0:["$","$L3",null,{"buildId":"NW2wM5FRkiD0FXxAKHe6x","assetPrefix":"","urlParts":["","components","slider"],"initialTree":["",{"children":["components",{"children":[["id","slider","d"],{"children":["__PAGE__?{\"id\":\"slider\"}",{}]}]}]},"$undefined","$undefined",true],"initialSeedData":["",{"children":["components",{"children":[["id","slider","d"],{"children":["__PAGE__",{},[["$L4",[["$","main",null,{"children":[["$","$L5",null,{"maxW":"100%","children":["$","$L6",null,{"code":"import * as React from 'react'\nimport { RangeType, Slider } from '@welcome-ui/slider'\n\nconst Example = () => {\n const handleChange = (value: number) => {\n alert(value)\n }\n\n const handleChangeRange = (value: RangeType) => {\n alert(`${value.min} to ${value.max}`)\n }\n\n return (\n <>\n \n \n \n )\n}\n\nexport default Example\n","isOverview":true,"mt":0,"name":"Slider","pathToFile":"/Slider/docs/examples/overview.tsx","withCodeEditor":true}]}],["$","$L7",null,{"packageName":"slider","usage":"Slider"}],["$","$L5",null,{"maxW":"100%","children":["$","$L8",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":[["$","$L9","p-0",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Add ","position":{"start":{"line":2,"column":1,"offset":1},"end":{"line":2,"column":5,"offset":5}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"w","position":{"start":{"line":2,"column":5,"offset":5},"end":{"line":2,"column":8,"offset":8}}}],"position":{"start":{"line":2,"column":5,"offset":5},"end":{"line":2,"column":8,"offset":8}}},{"type":"text","value":" and ","position":{"start":{"line":2,"column":8,"offset":8},"end":{"line":2,"column":13,"offset":13}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"h","position":{"start":{"line":2,"column":13,"offset":13},"end":{"line":2,"column":16,"offset":16}}}],"position":{"start":{"line":2,"column":13,"offset":13},"end":{"line":2,"column":16,"offset":16}}},{"type":"text","value":" to set size of shape.","position":{"start":{"line":2,"column":16,"offset":16},"end":{"line":2,"column":38,"offset":38}}}],"position":{"start":{"line":2,"column":1,"offset":1},"end":{"line":2,"column":38,"offset":38}}},"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":"w"}]," 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":"h"}]," to set size of shape."]}],"\n",["$","$L8",null,{"as":"h3","id":"label-hint","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#label-hint","textDecoration":{"hover":"underline"},"children":"Label & Hint"}]}],"\n",["$","$L9","p-1",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"label","position":{"start":{"line":6,"column":1,"offset":58},"end":{"line":6,"column":8,"offset":65}}}],"position":{"start":{"line":6,"column":1,"offset":58},"end":{"line":6,"column":8,"offset":65}}},{"type":"text","value":" and ","position":{"start":{"line":6,"column":8,"offset":65},"end":{"line":6,"column":13,"offset":70}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"hint","position":{"start":{"line":6,"column":13,"offset":70},"end":{"line":6,"column":19,"offset":76}}}],"position":{"start":{"line":6,"column":13,"offset":70},"end":{"line":6,"column":19,"offset":76}}},{"type":"text","value":" props to add some information to your slider.","position":{"start":{"line":6,"column":19,"offset":76},"end":{"line":6,"column":65,"offset":122}}}],"position":{"start":{"line":6,"column":1,"offset":58},"end":{"line":6,"column":65,"offset":122}}},"children":[["$","$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":"label"}]," 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":"hint"}]," props to add some information to your slider."]}],"\n",["$","$L6",null,{"code":"import * as React from 'react'\nimport { RangeType, Slider } from '@welcome-ui/slider'\n\nconst Example = () => {\n const handleChange = (value: number) => {\n alert(value)\n }\n\n const handleChangeRange = (value: RangeType) => {\n alert(`${value.min} to ${value.max}`)\n }\n\n return (\n <>\n \n \n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Slider","pathToFile":"/Slider/docs/examples/label-and-hint.tsx","withCodeEditor":true}],"\n",["$","$L8",null,{"as":"h3","id":"step","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#step","textDecoration":{"hover":"underline"},"children":"Step"}]}],"\n",["$","$L9","p-2",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"step","position":{"start":{"line":12,"column":1,"offset":208},"end":{"line":12,"column":7,"offset":214}}}],"position":{"start":{"line":12,"column":1,"offset":208},"end":{"line":12,"column":7,"offset":214}}},{"type":"text","value":" prop allow you to snap to predefined sets of values.","position":{"start":{"line":12,"column":7,"offset":214},"end":{"line":12,"column":60,"offset":267}}}],"position":{"start":{"line":12,"column":1,"offset":208},"end":{"line":12,"column":60,"offset":267}}},"children":[["$","$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":"step"}]," prop allow you to snap to predefined sets of values."]}],"\n",["$","$L6",null,{"code":"import * as React from 'react'\nimport { RangeType, Slider } from '@welcome-ui/slider'\n\nconst Example = () => {\n const handleChange = (value: number) => {\n alert(value)\n }\n\n const handleChangeRange = (value: RangeType) => {\n alert(`${value.min} to ${value.max}`)\n }\n\n return (\n <>\n \n \n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Slider","pathToFile":"/Slider/docs/examples/step.tsx","withCodeEditor":true}],"\n",["$","$L8",null,{"as":"h3","id":"tooltip","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#tooltip","textDecoration":{"hover":"underline"},"children":"Tooltip"}]}],"\n",["$","$L9","p-3",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"tooltip","position":{"start":{"line":18,"column":1,"offset":346},"end":{"line":18,"column":10,"offset":355}}}],"position":{"start":{"line":18,"column":1,"offset":346},"end":{"line":18,"column":10,"offset":355}}},{"type":"text","value":" prop to indicate the value being selected when dragging.","position":{"start":{"line":18,"column":10,"offset":355},"end":{"line":18,"column":67,"offset":412}}}],"position":{"start":{"line":18,"column":1,"offset":346},"end":{"line":18,"column":67,"offset":412}}},"children":[["$","$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":"tooltip"}]," prop to indicate the value being selected when dragging."]}],"\n",["$","$L6",null,{"code":"import * as React from 'react'\nimport { RangeType, Slider } from '@welcome-ui/slider'\n\nconst Example = () => {\n const handleChange = (value: number) => {\n alert(value)\n }\n\n const handleChangeRange = (value: RangeType) => {\n alert(`${value.min} to ${value.max}`)\n }\n\n return (\n <>\n \n \n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Slider","pathToFile":"/Slider/docs/examples/tooltip.tsx","withCodeEditor":true}],"\n",["$","$L8",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",["$","$L9","p-4",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"disabled","position":{"start":{"line":24,"column":1,"offset":495},"end":{"line":24,"column":11,"offset":505}}}],"position":{"start":{"line":24,"column":1,"offset":495},"end":{"line":24,"column":11,"offset":505}}},{"type":"text","value":" prop to indicate the value being selected when dragging.","position":{"start":{"line":24,"column":11,"offset":505},"end":{"line":24,"column":68,"offset":562}}}],"position":{"start":{"line":24,"column":1,"offset":495},"end":{"line":24,"column":68,"offset":562}}},"children":[["$","$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":"disabled"}]," prop to indicate the value being selected when dragging."]}],"\n",["$","$L6",null,{"code":"import * as React from 'react'\nimport { RangeType, Slider } from '@welcome-ui/slider'\n\nconst Example = () => {\n const handleChange = (value: number) => {\n alert(value)\n }\n\n const handleChangeRange = (value: RangeType) => {\n alert(`${value.min} to ${value.max}`)\n }\n\n return (\n <>\n \n \n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Slider","pathToFile":"/Slider/docs/examples/disabled.tsx","withCodeEditor":true}],"\n",["$","$L8",null,{"as":"h3","id":"types","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#types","textDecoration":{"hover":"underline"},"children":"Types"}]}],"\n",["$","$L8",null,{"as":"h4","id":"slider","mb":"md","mt":"xl","variant":"h5","children":"Slider"}],"\n",["$","$L9","p-5",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"There is 3 differents types for slider: ","position":{"start":{"line":32,"column":1,"offset":656},"end":{"line":32,"column":41,"offset":696}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"inline","position":{"start":{"line":32,"column":41,"offset":696},"end":{"line":32,"column":49,"offset":704}}}],"position":{"start":{"line":32,"column":41,"offset":696},"end":{"line":32,"column":49,"offset":704}}},{"type":"text","value":", ","position":{"start":{"line":32,"column":49,"offset":704},"end":{"line":32,"column":51,"offset":706}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"left-field","position":{"start":{"line":32,"column":51,"offset":706},"end":{"line":32,"column":63,"offset":718}}}],"position":{"start":{"line":32,"column":51,"offset":706},"end":{"line":32,"column":63,"offset":718}}},{"type":"text","value":" and ","position":{"start":{"line":32,"column":63,"offset":718},"end":{"line":32,"column":68,"offset":723}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"right-field","position":{"start":{"line":32,"column":68,"offset":723},"end":{"line":32,"column":81,"offset":736}}}],"position":{"start":{"line":32,"column":68,"offset":723},"end":{"line":32,"column":81,"offset":736}}},{"type":"text","value":".","position":{"start":{"line":32,"column":81,"offset":736},"end":{"line":32,"column":82,"offset":737}}}],"position":{"start":{"line":32,"column":1,"offset":656},"end":{"line":32,"column":82,"offset":737}}},"children":["There is 3 differents types for slider: ",["$","$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":"inline"}],", ",["$","$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":"left-field"}]," 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":"right-field"}],"."]}],"\n",["$","$L6",null,{"code":"import * as React from 'react'\nimport { Slider } from '@welcome-ui/slider'\n\nconst Example = () => {\n const handleChange = (value: number) => {\n alert(value)\n }\n\n return (\n <>\n \n \n \n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Slider","pathToFile":"/Slider/docs/examples/types-slider.tsx","withCodeEditor":true}],"\n",["$","$L8",null,{"as":"h4","id":"range-slider","mb":"md","mt":"xl","variant":"h5","children":"Range Slider"}],"\n",["$","$L9","p-6",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"There is only 2 differents types for range slider: ","position":{"start":{"line":38,"column":1,"offset":830},"end":{"line":38,"column":52,"offset":881}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"inline","position":{"start":{"line":38,"column":52,"offset":881},"end":{"line":38,"column":60,"offset":889}}}],"position":{"start":{"line":38,"column":52,"offset":881},"end":{"line":38,"column":60,"offset":889}}},{"type":"text","value":" and ","position":{"start":{"line":38,"column":60,"offset":889},"end":{"line":38,"column":65,"offset":894}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"fields","position":{"start":{"line":38,"column":65,"offset":894},"end":{"line":38,"column":73,"offset":902}}}],"position":{"start":{"line":38,"column":65,"offset":894},"end":{"line":38,"column":73,"offset":902}}},{"type":"text","value":".","position":{"start":{"line":38,"column":73,"offset":902},"end":{"line":38,"column":74,"offset":903}}}],"position":{"start":{"line":38,"column":1,"offset":830},"end":{"line":38,"column":74,"offset":903}}},"children":["There is only 2 differents types for range slider: ",["$","$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":"inline"}]," 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":"fields"}],"."]}],"\n",["$","$L6",null,{"code":"import * as React from 'react'\nimport { RangeType, Slider } from '@welcome-ui/slider'\n\nconst Example = () => {\n const handleChangeRange = (value: RangeType) => {\n alert(`${value.min} to ${value.max}`)\n }\n\n return (\n <>\n \n \n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Slider","pathToFile":"/Slider/docs/examples/types-slider-range.tsx","withCodeEditor":true}],"\n",["$","$L8",null,{"as":"h3","id":"values","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#values","textDecoration":{"hover":"underline"},"children":"Values"}]}],"\n",["$","$L9","p-7",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"You can specify a range of values that will add a mark for each of them.","position":{"start":{"line":44,"column":1,"offset":995},"end":{"line":44,"column":73,"offset":1067}}}],"position":{"start":{"line":44,"column":1,"offset":995},"end":{"line":44,"column":73,"offset":1067}}},"children":"You can specify a range of values that will add a mark for each of them."}],"\n",["$","$L6",null,{"code":"import * as React from 'react'\nimport { RangeType, Slider } from '@welcome-ui/slider'\n\nconst Example = () => {\n const handleChange = (value: number) => {\n alert(value)\n }\n\n const handleChangeRange = (value: RangeType) => {\n alert(`${value.min} to ${value.max}`)\n }\n\n return (\n <>\n \n \n \n \n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Slider","pathToFile":"/Slider/docs/examples/values.tsx","withCodeEditor":true}],"\n",["$","$L8",null,{"as":"h3","id":"border-selector-color","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#border-selector-color","textDecoration":{"hover":"underline"},"children":"borderSelectorColor"}]}],"\n",["$","$L9","p-8",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"To match your background color, you should add a ","position":{"start":{"line":50,"column":1,"offset":1160},"end":{"line":50,"column":50,"offset":1209}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"borderSelectorColor","position":{"start":{"line":50,"column":50,"offset":1209},"end":{"line":50,"column":71,"offset":1230}}}],"position":{"start":{"line":50,"column":50,"offset":1209},"end":{"line":50,"column":71,"offset":1230}}},{"type":"text","value":".","position":{"start":{"line":50,"column":71,"offset":1230},"end":{"line":50,"column":72,"offset":1231}}}],"position":{"start":{"line":50,"column":1,"offset":1160},"end":{"line":50,"column":72,"offset":1231}}},"children":["To match your background color, you should add 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":"borderSelectorColor"}],"."]}],"\n",["$","$L6",null,{"code":"import * as React from 'react'\nimport { RangeType, Slider } from '@welcome-ui/slider'\n\nconst Example = () => {\n const handleChange = (value: number) => {\n alert(value)\n }\n\n const handleChangeRange = (value: RangeType) => {\n alert(`${value.min} to ${value.max}`)\n }\n\n return (\n <>\n \n \n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Slider","pathToFile":"/Slider/docs/examples/border-selector.tsx","withCodeEditor":true}]]}]]}],["$","$La",null,{"isSubPage":true,"tree":[{"id":"definition","title":"Definition","href":"#"},{"id":"installation","title":"Installation","href":"#installation"},{"id":"examples","title":"Examples","href":"#examples","children":[{"id":"label-hint","title":"Label & Hint","href":"#label-hint"},{"id":"step","title":"Step","href":"#step"},{"id":"tooltip","title":"Tooltip","href":"#tooltip"},{"id":"disabled","title":"Disabled","href":"#disabled"},{"id":"types","title":"Types","href":"#types"},{"id":"values","title":"Values","href":"#values"},{"id":"border-selector-color","title":"borderSelectorColor","href":"#border-selector-color"}]}]}]],null],null],null]},[[null,["$","$Lb",null,{"gap":"md","margin":"0 auto","maxWidth":1400,"pb":"3xl","px":"xl","templateColumns":{"lg":"16rem auto"},"children":[["$","$Lc",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"]},{"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":[["$","$Ld",null,{"direction":"column","gap":"xl","mb":"lg","children":[["$","$L8",null,{"pt":"3xl","variant":"h1","children":"Slider"}],["$","$L8",null,{"color":"neutral-60","pt":"lg","variant":"lg","children":"The Slider component is an interactive UI element that allows users to select a value from a continuous range. It typically consists of a track, thumb (or handle), and optional labels for indicating minimum and maximum values. Sliders are used for settings, adjustments, and filtering where users need to choose from a range of values. They enhance user experience by providing a visual and intuitive way to adjust parameters or make selections."}],["$","$Ld",null,{"align":"center","gap":"md","children":[["$","$Le",null,{"as":"a","href":"https://github.com/WTTJ/welcome-ui/tree/main/packages/Slider","rel":"noreferrer noopener","size":"sm","target":"_blank","variant":"tertiary","children":[["$","$Lf",null,{}],["$","span",null,{"children":"Source"}]]}],["$","$Le",null,{"as":"a","href":"https://www.npmjs.com/package/@welcome-ui/slider","rel":"noreferrer noopener","size":"sm","target":"_blank","variant":"tertiary","children":[["$","$L10",null,{}],["$","span",null,{"children":["@welcome-ui/","slider"]}]]}],"$undefined"]}]]}],["$","$L11",null,{"pages":"$12"}],["$","$Lb",null,{"gap":"xl","templateColumns":{"xl":"auto 15rem"},"children":[["$","$L8d",null,{"parallelRouterKey":"children","segmentPath":["children","components","children","$8e","children"],"error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L8f",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":"$undefined","notFoundStyles":"$undefined"}],["$","$L90",null,{"basePage":"components","currentId":"slider","pages":"$12"}]]}]]}]]}]],null],null]},[null,["$","$L8d",null,{"parallelRouterKey":"children","segmentPath":["children","components","children"],"error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L8f",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":["$","$L91",null,{"children":["$","$L92",null,{"children":["$","$L93",null,{"children":["$","$L5",null,{"backgroundColor":"neutral-10","children":[["$","$L94",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"]},{"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"},{"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"}]}]}],["$","$L95",null,{}],["$","$L8d",null,{"parallelRouterKey":"children","segmentPath":["children"],"error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L8f",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":["$","div",null,{"children":[["$","h2",null,{"children":"Not Found"}],["$","p",null,{"children":"Could not find requested resource"}],["$","$L96",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":["$","$Lb",null,{"gap":"xl","gridTemplateColumns":{"_":"1fr 1fr","md":"1fr 1fr 1fr 1fr"},"children":[["$","$Ld",null,{"flexDirection":"column","gap":"xs","children":[["$","$Ld",null,{"alignItems":"center","gap":"sm","children":["Made with ",["$","$L97",null,{"color":"primary-50"}]," by"]}],["$","$L5",null,{"as":"a","href":"https://www.welcometothejungle.com","rel":"noreferrer noopener","target":"_blank","w":"fit-content","children":["$","$L98",null,{"h":40}]}]]}],[["$","$Ld","Documentations",{"as":"nav","flexDirection":"column","gap":"lg","children":[["$","$L8",null,{"variant":"subtitle-md","children":"Documentations"}],["$","$Ld",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",["$","$L99",null,{"color":"neutral-60","size":"xs"}]]}]}]]}]]}],["$","$Ld","Updates",{"as":"nav","flexDirection":"column","gap":"lg","children":[["$","$L8",null,{"variant":"subtitle-md","children":"Updates"}],["$","$Ld",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",["$","$L99",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",["$","$L99",null,{"color":"neutral-60","size":"xs"}]]}]}]]}]]}],["$","$Ld","Community",{"as":"nav","flexDirection":"column","gap":"lg","children":[["$","$L8",null,{"variant":"subtitle-md","children":"Community"}],["$","$Ld",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",["$","$L99",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",["$","$L99",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",["$","$L99",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",["$","$L99",null,{"color":"neutral-60","size":"xs"}]]}]}]]}]]}]]]}]}]}]]}]}]}]}]}]]}]],null],null],"couldBeIntercepted":false,"initialHead":[null,"$L9a"],"globalErrorComponent":"$9b","missingSlots":"$W9c"}]