Tabs kept in the address

// apps/docs/examples/ui/search-param-tabs.tsx'use client';
import {TabPanel} from '@workspace/active-ui/components/composed/responsive-tabs';import {SearchParamTabs} from '@workspace/active-ui/components/composed/search-param-tabs';
/** * The same tabs, with the current tab in the address: choosing a tab sets * `?example-tab=` on this page, so a link or a reload opens it again. The * default tab leaves the parameter out, and an unknown value falls back to it. */export default function SearchParamTabsExample() {  return (    <div className="w-full max-w-xl">      <SearchParamTabs        queryParamName="example-tab"        defaultValue="summary"        tabs={[          {value: 'summary', label: 'Summary'},          {value: 'payments', label: 'Payments'},        ]}        mobilePlaceholder="Choose a section"        desktopContentClassName="pt-4"      >        <TabPanel id="summary">The totals of this year.</TabPanel>        <TabPanel id="payments">Every payment of this year.</TabPanel>      </SearchParamTabs>    </div>  );}