0:["$","$L3",null,{"buildId":"62R-xzNgoWhL4oQH9k8aj","assetPrefix":"","urlParts":["","components","tabs"],"initialTree":["",{"children":["components",{"children":[["id","tabs","d"],{"children":["__PAGE__?{\"id\":\"tabs\"}",{}]}]}]},"$undefined","$undefined",true],"initialSeedData":["",{"children":["components",{"children":[["id","tabs","d"],{"children":["__PAGE__",{},[["$L4",[["$","main",null,{"children":[["$","$L5",null,{"maxW":"100%","children":["$","$L6",null,{"code":"$7","isOverview":true,"mt":0,"name":"Tabs","pathToFile":"/Tabs/docs/examples/overview.tsx","withCodeEditor":true}]}],["$","$L8",null,{"packageName":"tabs","usage":"Tabs, useTabs"}],["$","$L5",null,{"maxW":"100%","children":["$","$L9",null,{"alignItems":"center","as":"h2","borderBottom":"1px solid","borderBottomColor":"neutral-30","display":"flex","id":"examples","mt":"3xl","pb":"sm","style":{"scrollMarginTop":170},"variant":"h3","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#examples","textDecoration":{"hover":"underline"},"children":"Examples"}]}]}],["$","$L5",null,{"maxW":"100%","children":[["$","$La","p-0",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Use ","position":{"start":{"line":2,"column":1,"offset":1},"end":{"line":2,"column":5,"offset":5}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"Table","position":{"start":{"line":2,"column":5,"offset":5},"end":{"line":2,"column":12,"offset":12}}}],"position":{"start":{"line":2,"column":5,"offset":5},"end":{"line":2,"column":12,"offset":12}}},{"type":"text","value":", ","position":{"start":{"line":2,"column":12,"offset":12},"end":{"line":2,"column":14,"offset":14}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"Table.Thead","position":{"start":{"line":2,"column":14,"offset":14},"end":{"line":2,"column":27,"offset":27}}}],"position":{"start":{"line":2,"column":14,"offset":14},"end":{"line":2,"column":27,"offset":27}}},{"type":"text","value":", ","position":{"start":{"line":2,"column":27,"offset":27},"end":{"line":2,"column":29,"offset":29}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"Table.Th","position":{"start":{"line":2,"column":29,"offset":29},"end":{"line":2,"column":39,"offset":39}}}],"position":{"start":{"line":2,"column":29,"offset":29},"end":{"line":2,"column":39,"offset":39}}},{"type":"text","value":", ","position":{"start":{"line":2,"column":39,"offset":39},"end":{"line":2,"column":41,"offset":41}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"Table.Tbody","position":{"start":{"line":2,"column":41,"offset":41},"end":{"line":2,"column":54,"offset":54}}}],"position":{"start":{"line":2,"column":41,"offset":41},"end":{"line":2,"column":54,"offset":54}}},{"type":"text","value":", ","position":{"start":{"line":2,"column":54,"offset":54},"end":{"line":2,"column":56,"offset":56}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"Table.Td","position":{"start":{"line":2,"column":56,"offset":56},"end":{"line":2,"column":66,"offset":66}}}],"position":{"start":{"line":2,"column":56,"offset":56},"end":{"line":2,"column":66,"offset":66}}},{"type":"text","value":", ","position":{"start":{"line":2,"column":66,"offset":66},"end":{"line":2,"column":68,"offset":68}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"Table.Tr","position":{"start":{"line":2,"column":68,"offset":68},"end":{"line":2,"column":78,"offset":78}}}],"position":{"start":{"line":2,"column":68,"offset":68},"end":{"line":2,"column":78,"offset":78}}},{"type":"text","value":".","position":{"start":{"line":2,"column":78,"offset":78},"end":{"line":2,"column":79,"offset":79}}}],"position":{"start":{"line":2,"column":1,"offset":1},"end":{"line":2,"column":79,"offset":79}}},"children":["Use ",["$","$L5",null,{"alignItems":"center","as":"code","backgroundColor":"neutral-30","borderRadius":"md","color":"neutral-90","display":"inline-flex","px":"sm","py":"xxs","text":"sm","whiteSpace":"break-spaces","children":"Table"}],", ",["$","$L5",null,{"alignItems":"center","as":"code","backgroundColor":"neutral-30","borderRadius":"md","color":"neutral-90","display":"inline-flex","px":"sm","py":"xxs","text":"sm","whiteSpace":"break-spaces","children":"Table.Thead"}],", ",["$","$L5",null,{"alignItems":"center","as":"code","backgroundColor":"neutral-30","borderRadius":"md","color":"neutral-90","display":"inline-flex","px":"sm","py":"xxs","text":"sm","whiteSpace":"break-spaces","children":"Table.Th"}],", ",["$","$L5",null,{"alignItems":"center","as":"code","backgroundColor":"neutral-30","borderRadius":"md","color":"neutral-90","display":"inline-flex","px":"sm","py":"xxs","text":"sm","whiteSpace":"break-spaces","children":"Table.Tbody"}],", ",["$","$L5",null,{"alignItems":"center","as":"code","backgroundColor":"neutral-30","borderRadius":"md","color":"neutral-90","display":"inline-flex","px":"sm","py":"xxs","text":"sm","whiteSpace":"break-spaces","children":"Table.Td"}],", ",["$","$L5",null,{"alignItems":"center","as":"code","backgroundColor":"neutral-30","borderRadius":"md","color":"neutral-90","display":"inline-flex","px":"sm","py":"xxs","text":"sm","whiteSpace":"break-spaces","children":"Table.Tr"}],"."]}],"\n",["$","$L9",null,{"as":"h3","id":"sizes","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#sizes","textDecoration":{"hover":"underline"},"children":"Sizes"}]}],"\n",["$","$La","p-1",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Size is set on Tab.List. Available sizes are ","position":{"start":{"line":6,"column":1,"offset":92},"end":{"line":6,"column":46,"offset":137}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"sm","position":{"start":{"line":6,"column":46,"offset":137},"end":{"line":6,"column":50,"offset":141}}}],"position":{"start":{"line":6,"column":46,"offset":137},"end":{"line":6,"column":50,"offset":141}}},{"type":"text","value":" and ","position":{"start":{"line":6,"column":50,"offset":141},"end":{"line":6,"column":55,"offset":146}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"md","position":{"start":{"line":6,"column":55,"offset":146},"end":{"line":6,"column":59,"offset":150}}}],"position":{"start":{"line":6,"column":55,"offset":146},"end":{"line":6,"column":59,"offset":150}}},{"type":"text","value":". By default size is set to ","position":{"start":{"line":6,"column":59,"offset":150},"end":{"line":6,"column":87,"offset":178}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"md","position":{"start":{"line":6,"column":87,"offset":178},"end":{"line":6,"column":91,"offset":182}}}],"position":{"start":{"line":6,"column":87,"offset":178},"end":{"line":6,"column":91,"offset":182}}},{"type":"text","value":".","position":{"start":{"line":6,"column":91,"offset":182},"end":{"line":6,"column":92,"offset":183}}}],"position":{"start":{"line":6,"column":1,"offset":92},"end":{"line":6,"column":92,"offset":183}}},"children":["Size is set on Tab.List. Available sizes are ",["$","$L5",null,{"alignItems":"center","as":"code","backgroundColor":"neutral-30","borderRadius":"md","color":"neutral-90","display":"inline-flex","px":"sm","py":"xxs","text":"sm","whiteSpace":"break-spaces","children":"sm"}]," and ",["$","$L5",null,{"alignItems":"center","as":"code","backgroundColor":"neutral-30","borderRadius":"md","color":"neutral-90","display":"inline-flex","px":"sm","py":"xxs","text":"sm","whiteSpace":"break-spaces","children":"md"}],". By default size is set to ",["$","$L5",null,{"alignItems":"center","as":"code","backgroundColor":"neutral-30","borderRadius":"md","color":"neutral-90","display":"inline-flex","px":"sm","py":"xxs","text":"sm","whiteSpace":"break-spaces","children":"md"}],"."]}],"\n",["$","$L6",null,{"code":"$b","isOverview":false,"mt":"$undefined","name":"Tabs","pathToFile":"/Tabs/docs/examples/sizes.tsx","withCodeEditor":true}],"\n",["$","$L9",null,{"as":"h3","id":"with-no-border","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#with-no-border","textDecoration":{"hover":"underline"},"children":"With no border"}]}],"\n",["$","$La","p-2",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"The border on ","position":{"start":{"line":12,"column":1,"offset":268},"end":{"line":12,"column":15,"offset":282}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"Tab.List","position":{"start":{"line":12,"column":15,"offset":282},"end":{"line":12,"column":25,"offset":292}}}],"position":{"start":{"line":12,"column":15,"offset":282},"end":{"line":12,"column":25,"offset":292}}},{"type":"text","value":" is an inset shadow that you can customize or disable via the ","position":{"start":{"line":12,"column":25,"offset":292},"end":{"line":12,"column":87,"offset":354}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"boxShadow","position":{"start":{"line":12,"column":87,"offset":354},"end":{"line":12,"column":98,"offset":365}}}],"position":{"start":{"line":12,"column":87,"offset":354},"end":{"line":12,"column":98,"offset":365}}},{"type":"text","value":" style prop","position":{"start":{"line":12,"column":98,"offset":365},"end":{"line":12,"column":109,"offset":376}}}],"position":{"start":{"line":12,"column":1,"offset":268},"end":{"line":12,"column":109,"offset":376}}},"children":["The border on ",["$","$L5",null,{"alignItems":"center","as":"code","backgroundColor":"neutral-30","borderRadius":"md","color":"neutral-90","display":"inline-flex","px":"sm","py":"xxs","text":"sm","whiteSpace":"break-spaces","children":"Tab.List"}]," is an inset shadow that you can customize or disable via the ",["$","$L5",null,{"alignItems":"center","as":"code","backgroundColor":"neutral-30","borderRadius":"md","color":"neutral-90","display":"inline-flex","px":"sm","py":"xxs","text":"sm","whiteSpace":"break-spaces","children":"boxShadow"}]," style prop"]}],"\n",["$","$L6",null,{"code":"$c","isOverview":false,"mt":"$undefined","name":"Tabs","pathToFile":"/Tabs/docs/examples/no-border.tsx","withCodeEditor":true}],"\n",["$","$L9",null,{"as":"h3","id":"with-a-badge","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#with-a-badge","textDecoration":{"hover":"underline"},"children":"With a badge"}]}],"\n",["$","$La","p-3",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Add badges, icons and images in tab.","position":{"start":{"line":18,"column":1,"offset":463},"end":{"line":18,"column":37,"offset":499}}}],"position":{"start":{"line":18,"column":1,"offset":463},"end":{"line":18,"column":37,"offset":499}}},"children":"Add badges, icons and images in tab."}],"\n",["$","$L6",null,{"code":"$d","isOverview":false,"mt":"$undefined","name":"Tabs","pathToFile":"/Tabs/docs/examples/badge.tsx","withCodeEditor":true}],"\n",["$","$L9",null,{"as":"h3","id":"use-another-component","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#use-another-component","textDecoration":{"hover":"underline"},"children":"Use another component"}]}],"\n",["$","$La","p-4",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Use another component in tab.","position":{"start":{"line":24,"column":1,"offset":591},"end":{"line":24,"column":30,"offset":620}}}],"position":{"start":{"line":24,"column":1,"offset":591},"end":{"line":24,"column":30,"offset":620}}},"children":"Use another component in tab."}],"\n",["$","$L6",null,{"code":"import * as React from 'react'\nimport { Tab, useTab } from '@welcome-ui/tabs'\n\nconst Example = () => {\n const tab = useTab({ defaultSelectedId: 'tab1' })\n\n return (\n <>\n \n \n Tab 1\n \n \n Tab 2\n \n \n Tab 3\n \n \n \n Tab.Panel 1\n \n \n Tab.Panel 2\n \n \n Tab.Panel 3\n \n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Tabs","pathToFile":"/Tabs/docs/examples/component.tsx","withCodeEditor":true}],"\n",["$","$L9",null,{"as":"h3","id":"one-tab","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#one-tab","textDecoration":{"hover":"underline"},"children":"One tab"}]}],"\n",["$","$La","p-5",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Active bar doesn't display with only one tab.","position":{"start":{"line":30,"column":1,"offset":702},"end":{"line":30,"column":46,"offset":747}}}],"position":{"start":{"line":30,"column":1,"offset":702},"end":{"line":30,"column":46,"offset":747}}},"children":"Active bar doesn't display with only one tab."}],"\n",["$","$L6",null,{"code":"import * as React from 'react'\nimport { Tab, useTab } from '@welcome-ui/tabs'\n\nconst Example = () => {\n const tab = useTab({ defaultSelectedId: 'tab1' })\n\n return (\n <>\n \n \n Tab 1\n \n \n \n Tab.Panel 1\n \n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Tabs","pathToFile":"/Tabs/docs/examples/one.tsx","withCodeEditor":true}],"\n",["$","$L9",null,{"as":"h3","id":"vertical","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#vertical","textDecoration":{"hover":"underline"},"children":"Vertical"}]}],"\n",["$","$La","p-6",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Set the tab orientation by providing the ","position":{"start":{"line":36,"column":1,"offset":824},"end":{"line":36,"column":42,"offset":865}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"orientation","position":{"start":{"line":36,"column":42,"offset":865},"end":{"line":36,"column":55,"offset":878}}}],"position":{"start":{"line":36,"column":42,"offset":865},"end":{"line":36,"column":55,"offset":878}}},{"type":"text","value":" prop to the tab state","position":{"start":{"line":36,"column":55,"offset":878},"end":{"line":36,"column":77,"offset":900}}}],"position":{"start":{"line":36,"column":1,"offset":824},"end":{"line":36,"column":77,"offset":900}}},"children":["Set the tab orientation by providing the ",["$","$L5",null,{"alignItems":"center","as":"code","backgroundColor":"neutral-30","borderRadius":"md","color":"neutral-90","display":"inline-flex","px":"sm","py":"xxs","text":"sm","whiteSpace":"break-spaces","children":"orientation"}]," prop to the tab state"]}],"\n",["$","$L6",null,{"code":"import * as React from 'react'\nimport { Box } from '@welcome-ui/box'\nimport { Tab, useTab } from '@welcome-ui/tabs'\n\nconst Example = () => {\n const tab = useTab({ orientation: 'vertical', defaultSelectedId: 'tab2' })\n\n return (\n \n \n \n Tab 1\n \n \n Tab 2\n \n \n Tab 3\n \n \n Tab 4\n \n \n \n Tab.Panel 1\n \n \n Tab.Panel 2\n \n \n Tab.Panel 3\n \n \n Tab.Panel 4\n \n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Tabs","pathToFile":"/Tabs/docs/examples/vertical.tsx","withCodeEditor":true}],"\n",["$","$L9",null,{"alignItems":"center","as":"h2","borderBottom":"1px solid","borderBottomColor":"neutral-30","display":"flex","id":"use-tab","mt":"3xl","pb":"sm","style":{"scrollMarginTop":170},"variant":"h3","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#use-tab","textDecoration":{"hover":"underline"},"children":"useTab"}]}],"\n",["$","$La","p-7",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"We use ","position":{"start":{"line":42,"column":1,"offset":979},"end":{"line":42,"column":8,"offset":986}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"useTab","position":{"start":{"line":42,"column":8,"offset":986},"end":{"line":42,"column":16,"offset":994}}}],"position":{"start":{"line":42,"column":8,"offset":986},"end":{"line":42,"column":16,"offset":994}}},{"type":"text","value":" from ","position":{"start":{"line":42,"column":16,"offset":994},"end":{"line":42,"column":22,"offset":1000}}},{"type":"element","tagName":"a","properties":{"href":"https://ariakit.org/reference/use-tab-store"},"children":[{"type":"text","value":"Ariakit Tab","position":{"start":{"line":42,"column":23,"offset":1001},"end":{"line":42,"column":34,"offset":1012}}}],"position":{"start":{"line":42,"column":22,"offset":1000},"end":{"line":42,"column":80,"offset":1058}}},{"type":"text","value":" for the state of the Tab.","position":{"start":{"line":42,"column":80,"offset":1058},"end":{"line":42,"column":106,"offset":1084}}}],"position":{"start":{"line":42,"column":1,"offset":979},"end":{"line":42,"column":106,"offset":1084}}},"children":["We use ",["$","$L5",null,{"alignItems":"center","as":"code","backgroundColor":"neutral-30","borderRadius":"md","color":"neutral-90","display":"inline-flex","px":"sm","py":"xxs","text":"sm","whiteSpace":"break-spaces","children":"useTab"}]," from ",["$","$Le",null,{"href":"https://ariakit.org/reference/use-tab-store","isExternal":true,"rel":"noreferrer noopener","target":"_blank","node":"$f","children":"Ariakit Tab"}]," for the state of the Tab."]}],"\n",["$","$La","p-8",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Pass options to ","position":{"start":{"line":44,"column":1,"offset":1086},"end":{"line":44,"column":17,"offset":1102}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"useTab","position":{"start":{"line":44,"column":17,"offset":1102},"end":{"line":44,"column":25,"offset":1110}}}],"position":{"start":{"line":44,"column":17,"offset":1102},"end":{"line":44,"column":25,"offset":1110}}},{"type":"text","value":":","position":{"start":{"line":44,"column":25,"offset":1110},"end":{"line":44,"column":26,"offset":1111}}}],"position":{"start":{"line":44,"column":1,"offset":1086},"end":{"line":44,"column":26,"offset":1111}}},"children":["Pass options to ",["$","$L5",null,{"alignItems":"center","as":"code","backgroundColor":"neutral-30","borderRadius":"md","color":"neutral-90","display":"inline-flex","px":"sm","py":"xxs","text":"sm","whiteSpace":"break-spaces","children":"useTab"}],":"]}],"\n",["$","$L5",null,{"as":"ul","listStyleType":"disc","mt":"sm","children":["\n",["$","$L5",null,{"as":"li","ml":"xxl","mt":"xs","children":[["$","$L5",null,{"as":"strong","color":"neutral-90","fontWeight":"500","children":"defaultSelectedId"}],": e.g. ",["$","$L5",null,{"alignItems":"center","as":"code","backgroundColor":"neutral-30","borderRadius":"md","color":"neutral-90","display":"inline-flex","px":"sm","py":"xxs","text":"sm","whiteSpace":"break-spaces","children":"const store = useTab({ defaultSelectedId: 'tab2' })"}]]}],"\n"]}]]}]]}],["$","$L19",null,{"isSubPage":true,"tree":[{"id":"definition","title":"Definition","href":"#"},{"id":"installation","title":"Installation","href":"#installation"},{"id":"examples","title":"Examples","href":"#examples","children":[{"id":"sizes","title":"Sizes","href":"#sizes"},{"id":"with-no-border","title":"With no border","href":"#with-no-border"},{"id":"with-a-badge","title":"With a badge","href":"#with-a-badge"},{"id":"use-another-component","title":"Use another component","href":"#use-another-component"},{"id":"one-tab","title":"One tab","href":"#one-tab"},{"id":"vertical","title":"Vertical","href":"#vertical"}]},{"id":"use-tab","title":"useTab","href":"#use-tab"}]}]],null],null],null]},[[null,["$","$L1a",null,{"gap":"md","margin":"0 auto","maxWidth":1400,"pb":"3xl","px":"xl","templateColumns":{"lg":"16rem auto"},"children":[["$","$L1b",null,{"display":{"_":"none","lg":"flex"},"isSubPage":true,"menu":[{"category":"actions","parent":"components","pages":[{"id":"button","title":"Button","subPages":["props"]},{"id":"button-group","title":"ButtonGroup","subPages":["props"]},{"id":"link","title":"Link","subPages":["props"]}]},{"category":"data-display","parent":"components","pages":[{"id":"accordion","title":"Accordion","subPages":["props"]},{"id":"avatar","title":"Avatar","subPages":["props"]},{"id":"badge","title":"Badge","subPages":["props"]},{"id":"card","title":"Card","subPages":["props"]},{"id":"swiper","title":"Swiper","subPages":["props"]},{"id":"table","title":"Table","subPages":["props"]},{"id":"tag","title":"Tag","subPages":["props"]}]},{"category":"feedback","parent":"components","pages":[{"id":"alert","title":"Alert","subPages":["props"]},{"id":"toast","title":"Toast","subPages":["props"]}]},{"category":"forms","parent":"components","pages":[{"id":"checkbox","title":"Checkbox","subPages":["props"]},{"id":"date-picker","title":"DatePicker","subPages":["props"]},{"id":"date-time-picker","title":"DateTimePicker","subPages":["props"]},{"id":"field","title":"Field","subPages":["props"]},{"id":"file-drop","title":"FileDrop","subPages":["props"]},{"id":"file-upload","title":"FileUpload","subPages":["props"]},{"id":"hint","title":"Hint","subPages":["props"]},{"id":"input-text","title":"InputText","subPages":["props"]},{"id":"label","title":"Label","subPages":["props"]},{"id":"password-input","title":"PasswordInput","subPages":["props"]},{"id":"picker","title":"Picker","subPages":["props"]},{"id":"radio-group","title":"RadioGroup","subPages":["props"]},{"id":"radio-tab","title":"RadioTab","subPages":["props"]},{"id":"search","title":"Search","subPages":["props"]},{"id":"select","title":"Select","subPages":["props"]},{"id":"slider","title":"Slider","subPages":["props"]},{"id":"textarea","title":"Textarea","subPages":["props"]},{"id":"time-picker","title":"TimePicker","subPages":["props"]},{"id":"toggle","title":"Toggle","subPages":["props"]}]},{"category":"icons-&-logo","parent":"components","pages":[{"id":"icon","title":"Icons","subPages":["props"]},{"id":"icon-font","title":"IconFont","subPages":["props"]},{"id":"logo","title":"Logo","subPages":["props"]},{"id":"variant-icon","title":"VariantIcon","subPages":["props"]}]},{"category":"layout","parent":"components","pages":[{"id":"aspect-ratio","title":"AspectRatio","subPages":["props"]},{"id":"box","title":"Box","subPages":["props"]},{"id":"flex","title":"Flex","subPages":["props"]},{"id":"grid","title":"Grid","subPages":["props"]},{"id":"loader","title":"Loader","subPages":["props"]},{"id":"shape","title":"Shape","subPages":["props"]},{"id":"stack","title":"Stack","subPages":["props"]}]},{"category":"navigation","parent":"components","pages":[{"id":"breadcrumb","title":"Breadcrumb","subPages":["props"]},{"id":"dropdown-menu","title":"DropdownMenu","subPages":["props"]},{"id":"pagination","title":"Pagination","subPages":["props"]},{"id":"tabs","title":"Tabs","subPages":["props"]}]},{"category":"overlay","parent":"components","pages":[{"id":"drawer","title":"Drawer","subPages":["props"]},{"id":"modal","title":"Modal","subPages":["props"]},{"id":"popover","title":"Popover","subPages":["props"]},{"id":"tooltip","title":"Tooltip","subPages":["props"]}]},{"category":"typography","parent":"components","pages":[{"id":"text","title":"Text","subPages":["props"]}]}]}],["$","div",null,{"children":[["$","$L1c",null,{"direction":"column","gap":"xl","mb":"lg","children":[["$","$L9",null,{"pt":"3xl","variant":"h1","children":"Tabs"}],["$","$L9",null,{"color":"neutral-60","pt":"lg","variant":"lg","children":"The Tabs component is a navigational element that allows users to switch between different views or sections of content within the same page. Each tab is associated with a content panel, and clicking a tab displays the corresponding panel while hiding others. This component helps organize content efficiently and improves user experience by providing easy access to different sections without leaving the current page."}],["$","$L1c",null,{"align":"center","gap":"md","children":[["$","$L1d",null,{"as":"a","href":"https://github.com/WTTJ/welcome-ui/tree/main/packages/Tabs","rel":"noreferrer noopener","size":"sm","target":"_blank","variant":"tertiary","children":[["$","$L1e",null,{}],["$","span",null,{"children":"Source"}]]}],["$","$L1d",null,{"as":"a","href":"https://www.npmjs.com/package/@welcome-ui/tabs","rel":"noreferrer noopener","size":"sm","target":"_blank","variant":"tertiary","children":[["$","$L1f",null,{}],["$","span",null,{"children":["@welcome-ui/","tabs"]}]]}],["$","$L1d",null,{"as":"a","href":"https://ariakit.org/components/tab","rel":"noreferrer noopener","size":"sm","target":"_blank","variant":"tertiary","children":[["$","svg",null,{"aria-hidden":"true","height":"16","viewBox":"0 0 48 48","children":[["$","circle",null,{"cx":"29","cy":"24","r":"5"}],["$","path",null,{"clipRule":"evenodd","d":"M12 4C7.58172 4 4 7.58172 4 12V36C4 40.4183 7.58172 44 12 44H36C40.4183 44 44 40.4183 44 36V12C44 7.58172 40.4183 4 36 4H12ZM23.9997 35.9997C30.6271 35.9997 35.9997 30.6271 35.9997 23.9997C35.9997 17.3723 30.6271 11.9997 23.9997 11.9997C17.3723 11.9997 11.9997 17.3723 11.9997 23.9997C11.9997 30.6271 17.3723 35.9997 23.9997 35.9997Z","fillRule":"evenodd"}],["$","path",null,{"clipRule":"evenodd","d":"M12 0C5.37258 0 0 5.37258 0 12V36C0 42.6274 5.37258 48 12 48H36C42.6274 48 48 42.6274 48 36V12C48 5.37258 42.6274 0 36 0H12ZM12 2C6.47715 2 2 6.47715 2 12V36C2 41.5228 6.47715 46 12 46H36C41.5228 46 46 41.5228 46 36V12C46 6.47715 41.5228 2 36 2H12Z","fillRule":"evenodd"}]]}],["$","span",null,{"children":"Built with Ariakit"}]]}]]}]]}],["$","$L20",null,{"pages":"$21"}],["$","$L1a",null,{"gap":"xl","templateColumns":{"xl":"auto 15rem"},"children":[["$","$L9a",null,{"parallelRouterKey":"children","segmentPath":["children","components","children","$9b","children"],"error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L9c",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":"$undefined","notFoundStyles":"$undefined"}],["$","$L9d",null,{"basePage":"components","currentId":"tabs","pages":"$21"}]]}]]}]]}]],null],null]},[null,["$","$L9a",null,{"parallelRouterKey":"children","segmentPath":["children","components","children"],"error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L9c",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":"$undefined","notFoundStyles":"$undefined"}]],null]},[[[["$","link","0",{"rel":"stylesheet","href":"/_next/static/css/d001ad355a308bd4.css","precedence":"next","crossOrigin":"$undefined"}],["$","link","1",{"rel":"stylesheet","href":"/_next/static/css/530efe9c1e6b27ee.css","precedence":"next","crossOrigin":"$undefined"}]],["$","html",null,{"lang":"en","children":[["$","head",null,{"children":["$","link",null,{"href":"/favicon.ico","rel":"icon","type":"image/x-icon"}]}],["$","body",null,{"children":["$","$L9e",null,{"children":["$","$L9f",null,{"children":["$","$La0",null,{"children":["$","$L5",null,{"backgroundColor":"neutral-10","children":[["$","$La1",null,{"components":[{"category":"actions","parent":"components","pages":[{"id":"button","title":"Button","subPages":["props"]},{"id":"button-group","title":"ButtonGroup","subPages":["props"]},{"id":"link","title":"Link","subPages":["props"]}]},{"category":"data-display","parent":"components","pages":[{"id":"accordion","title":"Accordion","subPages":["props"]},{"id":"avatar","title":"Avatar","subPages":["props"]},{"id":"badge","title":"Badge","subPages":["props"]},{"id":"card","title":"Card","subPages":["props"]},{"id":"swiper","title":"Swiper","subPages":["props"]},{"id":"table","title":"Table","subPages":["props"]},{"id":"tag","title":"Tag","subPages":["props"]}]},{"category":"feedback","parent":"components","pages":[{"id":"alert","title":"Alert","subPages":["props"]},{"id":"toast","title":"Toast","subPages":["props"]}]},{"category":"forms","parent":"components","pages":[{"id":"checkbox","title":"Checkbox","subPages":["props"]},{"id":"date-picker","title":"DatePicker","subPages":["props"]},{"id":"date-time-picker","title":"DateTimePicker","subPages":["props"]},{"id":"field","title":"Field","subPages":["props"]},{"id":"file-drop","title":"FileDrop","subPages":["props"]},{"id":"file-upload","title":"FileUpload","subPages":["props"]},{"id":"hint","title":"Hint","subPages":["props"]},{"id":"input-text","title":"InputText","subPages":["props"]},{"id":"label","title":"Label","subPages":["props"]},{"id":"password-input","title":"PasswordInput","subPages":["props"]},{"id":"picker","title":"Picker","subPages":["props"]},{"id":"radio-group","title":"RadioGroup","subPages":["props"]},{"id":"radio-tab","title":"RadioTab","subPages":["props"]},{"id":"search","title":"Search","subPages":["props"]},{"id":"select","title":"Select","subPages":["props"]},{"id":"slider","title":"Slider","subPages":["props"]},{"id":"textarea","title":"Textarea","subPages":["props"]},{"id":"time-picker","title":"TimePicker","subPages":["props"]},{"id":"toggle","title":"Toggle","subPages":["props"]}]},{"category":"icons-&-logo","parent":"components","pages":[{"id":"icon","title":"Icons","subPages":["props"]},{"id":"icon-font","title":"IconFont","subPages":["props"]},{"id":"logo","title":"Logo","subPages":["props"]},{"id":"variant-icon","title":"VariantIcon","subPages":["props"]}]},{"category":"layout","parent":"components","pages":[{"id":"aspect-ratio","title":"AspectRatio","subPages":["props"]},{"id":"box","title":"Box","subPages":["props"]},{"id":"flex","title":"Flex","subPages":["props"]},{"id":"grid","title":"Grid","subPages":["props"]},{"id":"loader","title":"Loader","subPages":["props"]},{"id":"shape","title":"Shape","subPages":["props"]},{"id":"stack","title":"Stack","subPages":["props"]}]},{"category":"navigation","parent":"components","pages":[{"id":"breadcrumb","title":"Breadcrumb","subPages":["props"]},{"id":"dropdown-menu","title":"DropdownMenu","subPages":["props"]},{"id":"pagination","title":"Pagination","subPages":["props"]},{"id":"tabs","title":"Tabs","subPages":["props"]}]},{"category":"overlay","parent":"components","pages":[{"id":"drawer","title":"Drawer","subPages":["props"]},{"id":"modal","title":"Modal","subPages":["props"]},{"id":"popover","title":"Popover","subPages":["props"]},{"id":"tooltip","title":"Tooltip","subPages":["props"]}]},{"category":"typography","parent":"components","pages":[{"id":"text","title":"Text","subPages":["props"]}]}],"foundations":[{"parent":"foundations","pages":[{"id":"getting-started"},{"id":"how-to-contribute"},{"id":"migration"}]},{"parent":"foundations","category":"theming","pages":[{"id":"basics","parent":"theming"},{"id":"customize","parent":"theming"}]},{"parent":"foundations","category":"upgrades","pages":[{"id":"v2","parent":"upgrades"},{"id":"v3","parent":"upgrades"},{"id":"v4","parent":"upgrades"},{"id":"v5","parent":"upgrades"}]}]}],["$","$La2",null,{}],["$","$L9a",null,{"parallelRouterKey":"children","segmentPath":["children"],"error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L9c",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":["$","div",null,{"children":[["$","h2",null,{"children":"Not Found"}],["$","p",null,{"children":"Could not find requested resource"}],["$","$La3",null,{"href":"/","children":"Return Home"}]]}],"notFoundStyles":[]}],["$","$L5",null,{"as":"footer","position":"relative","py":{"xs":"xxl","md":90},"backgroundColor":"beige-20","children":["$","$L5",null,{"margin":"0 auto","maxWidth":1200,"position":"relative","px":"lg","children":["$","$L1a",null,{"gap":"xl","gridTemplateColumns":{"_":"1fr 1fr","md":"1fr 1fr 1fr 1fr"},"children":[["$","$L1c",null,{"flexDirection":"column","gap":"xs","children":[["$","$L1c",null,{"alignItems":"center","gap":"sm","children":["Made with ",["$","$La4",null,{"color":"primary-50"}]," by"]}],["$","$L5",null,{"as":"a","href":"https://www.welcometothejungle.com","rel":"noreferrer noopener","target":"_blank","w":"fit-content","children":["$","$La5",null,{"h":40}]}]]}],[["$","$L1c","Documentations",{"as":"nav","flexDirection":"column","gap":"lg","children":[["$","$L9",null,{"variant":"subtitle-md","children":"Documentations"}],["$","$L1c",null,{"as":"ul","flexDirection":"column","gap":"sm","children":[["$","$L5","/foundations",{"as":"li","children":["$","$L5",null,{"alignItems":"center","as":"a","color":"neutral-90","display":"flex","fontSize":"sm","gap":"xs","href":"/foundations","rel":"$undefined","target":"$undefined","textDecoration":{"hover":"underline"},"children":["Foundations",false]}]}],["$","$L5","/components",{"as":"li","children":["$","$L5",null,{"alignItems":"center","as":"a","color":"neutral-90","display":"flex","fontSize":"sm","gap":"xs","href":"/components","rel":"$undefined","target":"$undefined","textDecoration":{"hover":"underline"},"children":["Components",false]}]}],["$","$L5","https://github.com/WTTJ/welcome-ui/",{"as":"li","children":["$","$L5",null,{"alignItems":"center","as":"a","color":"neutral-90","display":"flex","fontSize":"sm","gap":"xs","href":"https://github.com/WTTJ/welcome-ui/","rel":"noopener noreferrer","target":"_blank","textDecoration":{"hover":"underline"},"children":["Source code",["$","$La6",null,{"color":"neutral-60","size":"xs"}]]}]}]]}]]}],["$","$L1c","Updates",{"as":"nav","flexDirection":"column","gap":"lg","children":[["$","$L9",null,{"variant":"subtitle-md","children":"Updates"}],["$","$L1c",null,{"as":"ul","flexDirection":"column","gap":"sm","children":[["$","$L5","https://github.com/WTTJ/welcome-ui/releases",{"as":"li","children":["$","$L5",null,{"alignItems":"center","as":"a","color":"neutral-90","display":"flex","fontSize":"sm","gap":"xs","href":"https://github.com/WTTJ/welcome-ui/releases","rel":"noopener noreferrer","target":"_blank","textDecoration":{"hover":"underline"},"children":["Releases",["$","$La6",null,{"color":"neutral-60","size":"xs"}]]}]}],["$","$L5","https://github.com/orgs/WTTJ/projects/13",{"as":"li","children":["$","$L5",null,{"alignItems":"center","as":"a","color":"neutral-90","display":"flex","fontSize":"sm","gap":"xs","href":"https://github.com/orgs/WTTJ/projects/13","rel":"noopener noreferrer","target":"_blank","textDecoration":{"hover":"underline"},"children":["Project board",["$","$La6",null,{"color":"neutral-60","size":"xs"}]]}]}]]}]]}],["$","$L1c","Community",{"as":"nav","flexDirection":"column","gap":"lg","children":[["$","$L9",null,{"variant":"subtitle-md","children":"Community"}],["$","$L1c",null,{"as":"ul","flexDirection":"column","gap":"sm","children":[["$","$L5","https://github.com/WTTJ",{"as":"li","children":["$","$L5",null,{"alignItems":"center","as":"a","color":"neutral-90","display":"flex","fontSize":"sm","gap":"xs","href":"https://github.com/WTTJ","rel":"noopener noreferrer","target":"_blank","textDecoration":{"hover":"underline"},"children":["Github",["$","$La6",null,{"color":"neutral-60","size":"xs"}]]}]}],["$","$L5","https://x.com/wttj_tech",{"as":"li","children":["$","$L5",null,{"alignItems":"center","as":"a","color":"neutral-90","display":"flex","fontSize":"sm","gap":"xs","href":"https://x.com/wttj_tech","rel":"noopener noreferrer","target":"_blank","textDecoration":{"hover":"underline"},"children":["Twitter",["$","$La6",null,{"color":"neutral-60","size":"xs"}]]}]}],["$","$L5","https://medium.com/wttj-tech",{"as":"li","children":["$","$L5",null,{"alignItems":"center","as":"a","color":"neutral-90","display":"flex","fontSize":"sm","gap":"xs","href":"https://medium.com/wttj-tech","rel":"noopener noreferrer","target":"_blank","textDecoration":{"hover":"underline"},"children":["Medium",["$","$La6",null,{"color":"neutral-60","size":"xs"}]]}]}],["$","$L5","https://www.welcometothejungle.com/en/companies/wttj/jobs",{"as":"li","children":["$","$L5",null,{"alignItems":"center","as":"a","color":"neutral-90","display":"flex","fontSize":"sm","gap":"xs","href":"https://www.welcometothejungle.com/en/companies/wttj/jobs","rel":"noopener noreferrer","target":"_blank","textDecoration":{"hover":"underline"},"children":["Jobs",["$","$La6",null,{"color":"neutral-60","size":"xs"}]]}]}]]}]]}]]]}]}]}]]}]}]}]}]}]]}]],null],null],"couldBeIntercepted":false,"initialHead":[null,"$La7"],"globalErrorComponent":"$a8","missingSlots":"$Wa9"}]