0:["$","$L3",null,{"buildId":"IIhYmIJcebLFFDdteXHVa","assetPrefix":"","urlParts":["","components","button"],"initialTree":["",{"children":["components",{"children":[["id","button","d"],{"children":["__PAGE__?{\"id\":\"button\"}",{}]}]}]},"$undefined","$undefined",true],"initialSeedData":["",{"children":["components",{"children":[["id","button","d"],{"children":["__PAGE__",{},[["$L4",[["$","main",null,{"children":[["$","$L5",null,{"maxW":"100%","children":["$","$L6",null,{"code":"import * as React from 'react'\n\nimport { Button } from 'welcome-ui/Button'\n\nconst Example = () => {\n return \n}\n\nexport default Example\n","isOverview":true,"mt":0,"name":"Button","pathToFile":"/Button/docs/examples/overview.tsx","withCodeEditor":true}]}],["$","$L5",null,{"maxW":"100%","children":["$","$L7",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":[["$","$L7",null,{"as":"h3","id":"variants","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#variants","textDecoration":{"hover":"underline"},"children":"Variants"}]}],"\n",["$","$L7",null,{"as":"h4","id":"basics","mb":"md","mt":"xl","variant":"h5","children":"Basics"}],"\n",["$","$L6",null,{"code":"import * as React from 'react'\n\nimport { Button } from 'welcome-ui/Button'\n\nconst Example = () => {\n return (\n <>\n \n \n \n \n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Button","pathToFile":"/Button/docs/examples/variants.tsx","withCodeEditor":true}],"\n",["$","$L7",null,{"as":"h4","id":"danger","mb":"md","mt":"xl","variant":"h5","children":"Danger"}],"\n",["$","$L8","p-0",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Add ","position":{"start":{"line":10,"column":1,"offset":109},"end":{"line":10,"column":5,"offset":113}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"danger","position":{"start":{"line":10,"column":5,"offset":113},"end":{"line":10,"column":13,"offset":121}}}],"position":{"start":{"line":10,"column":5,"offset":113},"end":{"line":10,"column":13,"offset":121}}},{"type":"text","value":" property to transform variant button with red color. Do not include secondary!","position":{"start":{"line":10,"column":13,"offset":121},"end":{"line":10,"column":92,"offset":200}}}],"position":{"start":{"line":10,"column":1,"offset":109},"end":{"line":10,"column":92,"offset":200}}},"children":["Add ",["$","$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":"danger"}]," property to transform variant button with red color. Do not include secondary!"]}],"\n",["$","$L6",null,{"code":"import * as React from 'react'\n\nimport { Button } from 'welcome-ui/Button'\n\nconst Example = () => {\n return (\n <>\n \n \n \n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Button","pathToFile":"/Button/docs/examples/danger.tsx","withCodeEditor":true}],"\n",["$","$L7",null,{"as":"h4","id":"ai","mb":"md","mt":"xl","variant":"h5","children":"AI"}],"\n",["$","$L8","p-1",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Add ","position":{"start":{"line":16,"column":1,"offset":277},"end":{"line":16,"column":5,"offset":281}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"ai","position":{"start":{"line":16,"column":5,"offset":281},"end":{"line":16,"column":9,"offset":285}}}],"position":{"start":{"line":16,"column":5,"offset":281},"end":{"line":16,"column":9,"offset":285}}},{"type":"text","value":" property to transform variant button with purple color. Do not include secondary!","position":{"start":{"line":16,"column":9,"offset":285},"end":{"line":16,"column":91,"offset":367}}}],"position":{"start":{"line":16,"column":1,"offset":277},"end":{"line":16,"column":91,"offset":367}}},"children":["Add ",["$","$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":"ai"}]," property to transform variant button with purple color. Do not include secondary!"]}],"\n",["$","$L6",null,{"code":"import * as React from 'react'\n\nimport { Button } from 'welcome-ui/Button'\n\nconst Example = () => {\n return (\n <>\n \n \n \n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Button","pathToFile":"/Button/docs/examples/ai.tsx","withCodeEditor":true}],"\n",["$","$L7",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",["$","$L8","p-2",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Use size property with ","position":{"start":{"line":22,"column":1,"offset":442},"end":{"line":22,"column":24,"offset":465}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"xs","position":{"start":{"line":22,"column":24,"offset":465},"end":{"line":22,"column":28,"offset":469}}}],"position":{"start":{"line":22,"column":24,"offset":465},"end":{"line":22,"column":28,"offset":469}}},{"type":"text","value":", ","position":{"start":{"line":22,"column":28,"offset":469},"end":{"line":22,"column":30,"offset":471}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"sm","position":{"start":{"line":22,"column":30,"offset":471},"end":{"line":22,"column":34,"offset":475}}}],"position":{"start":{"line":22,"column":30,"offset":471},"end":{"line":22,"column":34,"offset":475}}},{"type":"text","value":", ","position":{"start":{"line":22,"column":34,"offset":475},"end":{"line":22,"column":36,"offset":477}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"md","position":{"start":{"line":22,"column":36,"offset":477},"end":{"line":22,"column":40,"offset":481}}}],"position":{"start":{"line":22,"column":36,"offset":477},"end":{"line":22,"column":40,"offset":481}}},{"type":"text","value":" (default) or ","position":{"start":{"line":22,"column":40,"offset":481},"end":{"line":22,"column":54,"offset":495}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"lg","position":{"start":{"line":22,"column":54,"offset":495},"end":{"line":22,"column":58,"offset":499}}}],"position":{"start":{"line":22,"column":54,"offset":495},"end":{"line":22,"column":58,"offset":499}}},{"type":"text","value":".","position":{"start":{"line":22,"column":58,"offset":499},"end":{"line":22,"column":59,"offset":500}}}],"position":{"start":{"line":22,"column":1,"offset":442},"end":{"line":22,"column":59,"offset":500}}},"children":["Use size property with ",["$","$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":"xs"}],", ",["$","$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"}],", ",["$","$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"}]," (default) or ",["$","$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":"lg"}],"."]}],"\n",["$","$L6",null,{"code":"import * as React from 'react'\n\nimport { Button } from 'welcome-ui/Button'\n\nconst Example = () => {\n return (\n <>\n \n \n \n \n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Button","pathToFile":"/Button/docs/examples/sizes.tsx","withCodeEditor":true}],"\n",["$","$L7",null,{"as":"h3","id":"disabled","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#disabled","textDecoration":{"hover":"underline"},"children":"Disabled"}]}],"\n",["$","$L8","p-3",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"All disabled buttons have the same style.","position":{"start":{"line":28,"column":1,"offset":581},"end":{"line":28,"column":42,"offset":622}}}],"position":{"start":{"line":28,"column":1,"offset":581},"end":{"line":28,"column":42,"offset":622}}},"children":"All disabled buttons have the same style."}],"\n",["$","$L6",null,{"code":"import * as React from 'react'\n\nimport { Button } from 'welcome-ui/Button'\n\nconst Example = () => {\n return \n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Button","pathToFile":"/Button/docs/examples/disabled.tsx","withCodeEditor":true}],"\n",["$","$L7",null,{"as":"h3","id":"with-icons","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#with-icons","textDecoration":{"hover":"underline"},"children":"With icons"}]}],"\n",["$","$L6",null,{"code":"import * as React from 'react'\n\nimport { Button } from 'welcome-ui/Button'\nimport { WttjIcon } from 'welcome-ui/Icons'\n\nconst Example = () => {\n return (\n <>\n \n \n \n \n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Button","pathToFile":"/Button/docs/examples/icons.tsx","withCodeEditor":true}],"\n",["$","$L7",null,{"as":"h3","id":"shape","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#shape","textDecoration":{"hover":"underline"},"children":"Shape"}]}],"\n",["$","$L8","p-4",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"You can set a ","position":{"start":{"line":38,"column":1,"offset":784},"end":{"line":38,"column":15,"offset":798}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"cirle","position":{"start":{"line":38,"column":15,"offset":798},"end":{"line":38,"column":22,"offset":805}}}],"position":{"start":{"line":38,"column":15,"offset":798},"end":{"line":38,"column":22,"offset":805}}},{"type":"text","value":" or ","position":{"start":{"line":38,"column":22,"offset":805},"end":{"line":38,"column":26,"offset":809}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"square","position":{"start":{"line":38,"column":26,"offset":809},"end":{"line":38,"column":34,"offset":817}}}],"position":{"start":{"line":38,"column":26,"offset":809},"end":{"line":38,"column":34,"offset":817}}},{"type":"text","value":" shape with ","position":{"start":{"line":38,"column":34,"offset":817},"end":{"line":38,"column":46,"offset":829}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"w","position":{"start":{"line":38,"column":46,"offset":829},"end":{"line":38,"column":49,"offset":832}}}],"position":{"start":{"line":38,"column":46,"offset":829},"end":{"line":38,"column":49,"offset":832}}},{"type":"text","value":" & ","position":{"start":{"line":38,"column":49,"offset":832},"end":{"line":38,"column":52,"offset":835}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"h","position":{"start":{"line":38,"column":52,"offset":835},"end":{"line":38,"column":55,"offset":838}}}],"position":{"start":{"line":38,"column":52,"offset":835},"end":{"line":38,"column":55,"offset":838}}},{"type":"text","value":" to have buttons perfect for icons.","position":{"start":{"line":38,"column":55,"offset":838},"end":{"line":38,"column":90,"offset":873}}}],"position":{"start":{"line":38,"column":1,"offset":784},"end":{"line":38,"column":90,"offset":873}}},"children":["You can set a ",["$","$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":"cirle"}]," or ",["$","$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":"square"}]," shape with ",["$","$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":"w"}]," & ",["$","$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":"h"}]," to have buttons perfect for icons."]}],"\n",["$","$L6",null,{"code":"import * as React from 'react'\n\nimport { Button } from 'welcome-ui/Button'\nimport { WttjIcon } from 'welcome-ui/Icons'\n\nconst Example = () => {\n return (\n <>\n \n \n \n \n \n \n \n \n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Button","pathToFile":"/Button/docs/examples/shapes.tsx","withCodeEditor":true}],"\n",["$","$L7",null,{"as":"h3","id":"loading","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#loading","textDecoration":{"hover":"underline"},"children":"Loading"}]}],"\n",["$","$L8","p-5",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"You can set an ","position":{"start":{"line":44,"column":1,"offset":954},"end":{"line":44,"column":16,"offset":969}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"isLoading","position":{"start":{"line":44,"column":16,"offset":969},"end":{"line":44,"column":27,"offset":980}}}],"position":{"start":{"line":44,"column":16,"offset":969},"end":{"line":44,"column":27,"offset":980}}},{"type":"text","value":" property to display a loading indicator that matches the button’s size and disables it.","position":{"start":{"line":44,"column":27,"offset":980},"end":{"line":44,"column":115,"offset":1068}}}],"position":{"start":{"line":44,"column":1,"offset":954},"end":{"line":44,"column":115,"offset":1068}}},"children":["You can set an ",["$","$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":"isLoading"}]," property to display a loading indicator that matches the button’s size and disables it."]}],"\n",["$","$L6",null,{"code":"import * as React from 'react'\n\nimport { Button } from 'welcome-ui/Button'\n\nconst Example = () => {\n const [isLoading, setIsLoading] = React.useState(false)\n\n return (\n <>\n \n \n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Button","pathToFile":"/Button/docs/examples/is-loading.tsx","withCodeEditor":true}],"\n",["$","$L7",null,{"as":"h3","id":"transform-to-a-link","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#transform-to-a-link","textDecoration":{"hover":"underline"},"children":"Transform to a link"}]}],"\n",["$","$L8","p-6",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"You can transform your Button component with ","position":{"start":{"line":50,"column":1,"offset":1165},"end":{"line":50,"column":46,"offset":1210}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"as","position":{"start":{"line":50,"column":46,"offset":1210},"end":{"line":50,"column":50,"offset":1214}}}],"position":{"start":{"line":50,"column":46,"offset":1210},"end":{"line":50,"column":50,"offset":1214}}},{"type":"text","value":" property to add you linker, ","position":{"start":{"line":50,"column":50,"offset":1214},"end":{"line":50,"column":79,"offset":1243}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"href","position":{"start":{"line":50,"column":79,"offset":1243},"end":{"line":50,"column":85,"offset":1249}}}],"position":{"start":{"line":50,"column":79,"offset":1243},"end":{"line":50,"column":85,"offset":1249}}},{"type":"text","value":" or ","position":{"start":{"line":50,"column":85,"offset":1249},"end":{"line":50,"column":89,"offset":1253}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"to","position":{"start":{"line":50,"column":89,"offset":1253},"end":{"line":50,"column":93,"offset":1257}}}],"position":{"start":{"line":50,"column":89,"offset":1253},"end":{"line":50,"column":93,"offset":1257}}},{"type":"text","value":"... all that you want.","position":{"start":{"line":50,"column":93,"offset":1257},"end":{"line":50,"column":115,"offset":1279}}}],"position":{"start":{"line":50,"column":1,"offset":1165},"end":{"line":50,"column":115,"offset":1279}}},"children":["You can transform your Button component with ",["$","$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":"as"}]," property to add you linker, ",["$","$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":"href"}]," or ",["$","$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":"to"}],"... all that you want."]}],"\n",["$","$L6",null,{"code":"import * as React from 'react'\n\nimport { Button } from 'welcome-ui/Button'\nimport { WttjIcon } from 'welcome-ui/Icons'\n\nconst Example = () => {\n return (\n \n \n Welcome\n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Button","pathToFile":"/Button/docs/examples/link.tsx","withCodeEditor":true}],"\n",["$","$L7",null,{"as":"h3","id":"button-group","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#button-group","textDecoration":{"hover":"underline"},"children":"ButtonGroup"}]}],"\n",["$","$L8","p-7",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"See documentation from ","position":{"start":{"line":56,"column":1,"offset":1362},"end":{"line":56,"column":24,"offset":1385}}},{"type":"element","tagName":"a","properties":{"href":"/components/button-group"},"children":[{"type":"text","value":"ButtonGroup","position":{"start":{"line":56,"column":25,"offset":1386},"end":{"line":56,"column":36,"offset":1397}}}],"position":{"start":{"line":56,"column":24,"offset":1385},"end":{"line":56,"column":63,"offset":1424}}},{"type":"text","value":" component.","position":{"start":{"line":56,"column":63,"offset":1424},"end":{"line":56,"column":74,"offset":1435}}}],"position":{"start":{"line":56,"column":1,"offset":1362},"end":{"line":56,"column":74,"offset":1435}}},"children":["See documentation from ",["$","$L9",null,{"href":"/components/button-group","isExternal":true,"rel":"noreferrer noopener","target":"_blank","node":"$a","children":"ButtonGroup"}]," component."]}]]}]]}],["$","$L14",null,{"isSubPage":true,"tree":[{"id":"definition","title":"Definition","href":"#"},{"id":"installation","title":"Installation","href":"#installation"},{"id":"examples","title":"Examples","href":"#examples","children":[{"id":"variants","title":"Variants","href":"#variants"},{"id":"sizes","title":"Sizes","href":"#sizes"},{"id":"disabled","title":"Disabled","href":"#disabled"},{"id":"with-icons","title":"With icons","href":"#with-icons"},{"id":"shape","title":"Shape","href":"#shape"},{"id":"loading","title":"Loading","href":"#loading"},{"id":"transform-to-a-link","title":"Transform to a link","href":"#transform-to-a-link"},{"id":"button-group","title":"ButtonGroup","href":"#button-group"}]}]}]],null],null],null]},[[null,["$","$L15",null,{"gap":"md","margin":"0 auto","maxWidth":1400,"pb":"3xl","px":"xl","templateColumns":{"lg":"16rem auto"},"children":[["$","$L16",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":"icons-font","title":"IconsFont","subPages":["props"]},{"id":"logo","title":"Logo","subPages":["props"]},{"id":"variant-icon","title":"VariantIcon","subPages":["props"]},{"id":"welcome-loader","title":"WelcomeLoader","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":[["$","$L17",null,{"direction":"column","gap":"xl","mb":"lg","children":[["$","$L7",null,{"mt":"3xl","variant":"h1","children":"Button"}],["$","$L7",null,{"color":"neutral-60","pt":"lg","variant":"lg","children":"The Button component is an interactive element used to trigger actions or events within an application. It provides a consistent and accessible way for users to interact with the interface, featuring customizable styles and states (e.g., default, hover, active, disabled)."}],["$","$L17",null,{"align":"center","gap":"md","children":[["$","$L18",null,{"as":"a","href":"https://github.com/WTTJ/welcome-ui/tree/main/lib/src/components/Button","rel":"noreferrer noopener","size":"sm","target":"_blank","variant":"tertiary","children":[["$","$L19",null,{}],["$","span",null,{"children":"Source"}]]}],["$","$L18",null,{"as":"a","href":"https://ariakit.org/components/button","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"}]]}]]}]]}],["$","$L1a",null,{"pages":"$1b"}],["$","$L15",null,{"gap":"xl","templateColumns":{"xl":"auto 15rem"},"children":[["$","$L96",null,{"parallelRouterKey":"children","segmentPath":["children","components","children","$97","children"],"error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L98",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":"$undefined","notFoundStyles":"$undefined"}],["$","$L99",null,{"basePage":"components","currentId":"button","pages":"$1b"}]]}]]}]]}]],null],null]},[null,["$","$L96",null,{"parallelRouterKey":"children","segmentPath":["children","components","children"],"error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L98",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":"$undefined","notFoundStyles":"$undefined"}]],null]},[[[["$","link","0",{"rel":"stylesheet","href":"/_next/static/css/c240aae3a48c5bf0.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.png","rel":"icon","type":"image/png"}]}],["$","body",null,{"children":["$","$L9a",null,{"children":["$","$L9b",null,{"children":["$","$L9c",null,{"children":["$","$L5",null,{"backgroundColor":"neutral-10","children":[["$","$L9d",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":"icons-font","title":"IconsFont","subPages":["props"]},{"id":"logo","title":"Logo","subPages":["props"]},{"id":"variant-icon","title":"VariantIcon","subPages":["props"]},{"id":"welcome-loader","title":"WelcomeLoader","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"}]},{"parent":"foundations","category":"theming","pages":[{"id":"basics","parent":"theming"},{"id":"customize","parent":"theming"}]},{"parent":"foundations","category":"upgrades","pages":[{"id":"olders","parent":"upgrades"},{"id":"v8","parent":"upgrades"}]}]}],["$","$L9e",null,{}],["$","$L96",null,{"parallelRouterKey":"children","segmentPath":["children"],"error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L98",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":["$","div",null,{"children":[["$","h2",null,{"children":"Not Found"}],["$","p",null,{"children":"Could not find requested resource"}],["$","$L9f",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":["$","$L15",null,{"gap":"xl","gridTemplateColumns":{"_":"1fr 1fr","md":"1fr 1fr 1fr 1fr"},"children":[["$","$L17",null,{"flexDirection":"column","gap":"xs","children":[["$","$L17",null,{"alignItems":"center","gap":"sm","children":["Made with ",["$","$La0",null,{"color":"primary-50"}]," by"]}],["$","$L5",null,{"as":"a","href":"https://www.welcometothejungle.com","rel":"noreferrer noopener","target":"_blank","w":"fit-content","children":["$","$La1",null,{"h":40}]}]]}],[["$","$L17","Documentations",{"as":"nav","flexDirection":"column","gap":"lg","children":[["$","$L7",null,{"variant":"subtitle-md","children":"Documentations"}],["$","$L17",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",["$","$La2",null,{"color":"neutral-60","size":"xs"}]]}]}]]}]]}],["$","$L17","Updates",{"as":"nav","flexDirection":"column","gap":"lg","children":[["$","$L7",null,{"variant":"subtitle-md","children":"Updates"}],["$","$L17",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",["$","$La2",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",["$","$La2",null,{"color":"neutral-60","size":"xs"}]]}]}]]}]]}],["$","$L17","Community",{"as":"nav","flexDirection":"column","gap":"lg","children":[["$","$L7",null,{"variant":"subtitle-md","children":"Community"}],["$","$L17",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",["$","$La2",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",["$","$La2",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",["$","$La2",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",["$","$La2",null,{"color":"neutral-60","size":"xs"}]]}]}]]}]]}]]]}]}]}]]}]}]}]}]}]]}]],null],null],"couldBeIntercepted":false,"initialHead":[null,"$La3"],"globalErrorComponent":"$a4","missingSlots":"$Wa5"}]