[{"data":1,"prerenderedAt":4387},["ShallowReactive",2],{"reference":3,"sidebar-roots":4,"content-query-yXtYzdsNFc":20,"$dNTcUNV7nV":4350},null,[5],{"_path":6,"_dir":7,"_draft":8,"_partial":9,"_locale":7,"navigation":10,"sidebarRoot":9,"_id":13,"_type":14,"title":15,"_source":16,"_file":17,"_stem":18,"_extension":19},"\u002F_dir","",false,true,{"title":11,"icon":12},"Storefront UI","IconStorefrontUi","content:_dir.yml","yaml","Dir","content","_dir.yml","_dir","yml",{"_path":21,"_dir":22,"_draft":8,"_partial":9,"_locale":7,"title":23,"description":7,"body":24,"_type":4344,"_id":4345,"_source":16,"_file":4346,"_stem":4347,"_extension":4348,"layout":4349},"\u002F_components\u002Fswitch","_components","Switch",{"type":25,"children":26,"toc":4334},"root",[27,35,4328],{"type":28,"tag":29,"props":30,"children":32},"element","h1",{"id":31},"switch",[33],{"type":34,"value":23},"text",{"type":28,"tag":36,"props":37,"children":41},"tabs",{":titles":38,"className":39},"[\"Usage\", \"API\", \"Source Code\"]",[40],"mt-8",[42,2420,2689],{"type":28,"tag":43,"props":44,"children":45},"template",{"v-slot:tab-1":7},[46,59,72,90,97,103,108,756,762,1574,1580,1585,2373,2379,2396,2409,2415],{"type":28,"tag":47,"props":48,"children":49},"p",{},[50,57],{"type":28,"tag":51,"props":52,"children":54},"code",{"className":53},[],[55],{"type":34,"value":56},"SfSwitch",{"type":34,"value":58}," allows users to control a boolean value. This can be used to enable\u002Fdisable features, especially on mobile.",{"type":28,"tag":47,"props":60,"children":61},{},[62,64,70],{"type":34,"value":63},"It uses an ",{"type":28,"tag":51,"props":65,"children":67},{"className":66},[],[68],{"type":34,"value":69},"\u003Cinput type=\"checkbox\">",{"type":34,"value":71}," with additional stylings to give it the appearance of a switch.",{"type":28,"tag":47,"props":73,"children":74},{},[75,77,88],{"type":34,"value":76},"From a functional perspective, it is similar to the ",{"type":28,"tag":78,"props":79,"children":81},"a",{"href":80},"\u002Fcheckbox.html",[82],{"type":28,"tag":51,"props":83,"children":85},{"className":84},[],[86],{"type":34,"value":87},"SfCheckbox",{"type":34,"value":89}," component, except the checkbox can handle indeterminate states. The two possible values are true and false.",{"type":28,"tag":91,"props":92,"children":94},"h2",{"id":93},"examples",[95],{"type":34,"value":96},"Examples",{"type":28,"tag":91,"props":98,"children":100},{"id":99},"switch-without-label",[101],{"type":34,"value":102},"Switch without label",{"type":28,"tag":47,"props":104,"children":105},{},[106],{"type":34,"value":107},"Switch base component without a label.",{"type":28,"tag":109,"props":110,"children":112},"showcase",{"showcase-name":111},"Switch\u002FSwitchWithoutLabel",[113,399],{"type":28,"tag":114,"props":115,"children":116},"vue-only",{},[117],{"type":28,"tag":118,"props":119,"children":123},"pre",{"className":120,"code":121,"language":122,"meta":7,"style":7},"language-vue shiki shiki-themes one-dark-pro","\u003Ctemplate>\n  \u003CSfSwitch value=\"value\" v-model=\"modelCheck\" \u002F>\n\u003C\u002Ftemplate>\n\n\u003Cscript lang=\"ts\" setup>\nimport { ref } from 'vue';\nimport { SfSwitch } from '@storefront-ui\u002Fvue';\n\nconst modelCheck = ref(false);\n\u003C\u002Fscript>\n\n","vue",[124],{"type":28,"tag":51,"props":125,"children":126},{"__ignoreMap":7},[127,149,198,215,224,260,300,333,341,383],{"type":28,"tag":128,"props":129,"children":132},"span",{"class":130,"line":131},"line",1,[133,139,144],{"type":28,"tag":128,"props":134,"children":136},{"style":135},"--shiki-default:#ABB2BF",[137],{"type":34,"value":138},"\u003C",{"type":28,"tag":128,"props":140,"children":142},{"style":141},"--shiki-default:#E06C75",[143],{"type":34,"value":43},{"type":28,"tag":128,"props":145,"children":146},{"style":135},[147],{"type":34,"value":148},">\n",{"type":28,"tag":128,"props":150,"children":152},{"class":130,"line":151},2,[153,158,162,168,173,179,184,188,193],{"type":28,"tag":128,"props":154,"children":155},{"style":135},[156],{"type":34,"value":157},"  \u003C",{"type":28,"tag":128,"props":159,"children":160},{"style":141},[161],{"type":34,"value":56},{"type":28,"tag":128,"props":163,"children":165},{"style":164},"--shiki-default:#D19A66",[166],{"type":34,"value":167}," value",{"type":28,"tag":128,"props":169,"children":170},{"style":135},[171],{"type":34,"value":172},"=",{"type":28,"tag":128,"props":174,"children":176},{"style":175},"--shiki-default:#98C379",[177],{"type":34,"value":178},"\"value\"",{"type":28,"tag":128,"props":180,"children":181},{"style":164},[182],{"type":34,"value":183}," v-model",{"type":28,"tag":128,"props":185,"children":186},{"style":135},[187],{"type":34,"value":172},{"type":28,"tag":128,"props":189,"children":190},{"style":175},[191],{"type":34,"value":192},"\"modelCheck\"",{"type":28,"tag":128,"props":194,"children":195},{"style":135},[196],{"type":34,"value":197}," \u002F>\n",{"type":28,"tag":128,"props":199,"children":201},{"class":130,"line":200},3,[202,207,211],{"type":28,"tag":128,"props":203,"children":204},{"style":135},[205],{"type":34,"value":206},"\u003C\u002F",{"type":28,"tag":128,"props":208,"children":209},{"style":141},[210],{"type":34,"value":43},{"type":28,"tag":128,"props":212,"children":213},{"style":135},[214],{"type":34,"value":148},{"type":28,"tag":128,"props":216,"children":218},{"class":130,"line":217},4,[219],{"type":28,"tag":128,"props":220,"children":221},{"emptyLinePlaceholder":9},[222],{"type":34,"value":223},"\n",{"type":28,"tag":128,"props":225,"children":227},{"class":130,"line":226},5,[228,232,237,242,246,251,256],{"type":28,"tag":128,"props":229,"children":230},{"style":135},[231],{"type":34,"value":138},{"type":28,"tag":128,"props":233,"children":234},{"style":141},[235],{"type":34,"value":236},"script",{"type":28,"tag":128,"props":238,"children":239},{"style":164},[240],{"type":34,"value":241}," lang",{"type":28,"tag":128,"props":243,"children":244},{"style":135},[245],{"type":34,"value":172},{"type":28,"tag":128,"props":247,"children":248},{"style":175},[249],{"type":34,"value":250},"\"ts\"",{"type":28,"tag":128,"props":252,"children":253},{"style":164},[254],{"type":34,"value":255}," setup",{"type":28,"tag":128,"props":257,"children":258},{"style":135},[259],{"type":34,"value":148},{"type":28,"tag":128,"props":261,"children":263},{"class":130,"line":262},6,[264,270,275,280,285,290,295],{"type":28,"tag":128,"props":265,"children":267},{"style":266},"--shiki-default:#C678DD",[268],{"type":34,"value":269},"import",{"type":28,"tag":128,"props":271,"children":272},{"style":135},[273],{"type":34,"value":274}," { ",{"type":28,"tag":128,"props":276,"children":277},{"style":141},[278],{"type":34,"value":279},"ref",{"type":28,"tag":128,"props":281,"children":282},{"style":135},[283],{"type":34,"value":284}," } ",{"type":28,"tag":128,"props":286,"children":287},{"style":266},[288],{"type":34,"value":289},"from",{"type":28,"tag":128,"props":291,"children":292},{"style":175},[293],{"type":34,"value":294}," 'vue'",{"type":28,"tag":128,"props":296,"children":297},{"style":135},[298],{"type":34,"value":299},";\n",{"type":28,"tag":128,"props":301,"children":303},{"class":130,"line":302},7,[304,308,312,316,320,324,329],{"type":28,"tag":128,"props":305,"children":306},{"style":266},[307],{"type":34,"value":269},{"type":28,"tag":128,"props":309,"children":310},{"style":135},[311],{"type":34,"value":274},{"type":28,"tag":128,"props":313,"children":314},{"style":141},[315],{"type":34,"value":56},{"type":28,"tag":128,"props":317,"children":318},{"style":135},[319],{"type":34,"value":284},{"type":28,"tag":128,"props":321,"children":322},{"style":266},[323],{"type":34,"value":289},{"type":28,"tag":128,"props":325,"children":326},{"style":175},[327],{"type":34,"value":328}," '@storefront-ui\u002Fvue'",{"type":28,"tag":128,"props":330,"children":331},{"style":135},[332],{"type":34,"value":299},{"type":28,"tag":128,"props":334,"children":336},{"class":130,"line":335},8,[337],{"type":28,"tag":128,"props":338,"children":339},{"emptyLinePlaceholder":9},[340],{"type":34,"value":223},{"type":28,"tag":128,"props":342,"children":344},{"class":130,"line":343},9,[345,350,356,362,368,373,378],{"type":28,"tag":128,"props":346,"children":347},{"style":266},[348],{"type":34,"value":349},"const",{"type":28,"tag":128,"props":351,"children":353},{"style":352},"--shiki-default:#E5C07B",[354],{"type":34,"value":355}," modelCheck",{"type":28,"tag":128,"props":357,"children":359},{"style":358},"--shiki-default:#56B6C2",[360],{"type":34,"value":361}," =",{"type":28,"tag":128,"props":363,"children":365},{"style":364},"--shiki-default:#61AFEF",[366],{"type":34,"value":367}," ref",{"type":28,"tag":128,"props":369,"children":370},{"style":135},[371],{"type":34,"value":372},"(",{"type":28,"tag":128,"props":374,"children":375},{"style":164},[376],{"type":34,"value":377},"false",{"type":28,"tag":128,"props":379,"children":380},{"style":135},[381],{"type":34,"value":382},");\n",{"type":28,"tag":128,"props":384,"children":386},{"class":130,"line":385},10,[387,391,395],{"type":28,"tag":128,"props":388,"children":389},{"style":135},[390],{"type":34,"value":206},{"type":28,"tag":128,"props":392,"children":393},{"style":141},[394],{"type":34,"value":236},{"type":28,"tag":128,"props":396,"children":397},{"style":135},[398],{"type":34,"value":148},{"type":28,"tag":400,"props":401,"children":402},"react-only",{},[403],{"type":28,"tag":118,"props":404,"children":408},{"className":405,"code":406,"language":407,"meta":7,"style":7},"language-tsx shiki shiki-themes one-dark-pro","import { SfSwitch } from '@storefront-ui\u002Freact';\nimport { useState } from 'react';\n\nexport default function SwitchWithoutLabel() {\n  const [checkedState, setCheckedState] = useState(false);\n  return (\n    \u003CSfSwitch\n      checked={checkedState}\n      value=\"value-1\"\n      onChange={(event) => {\n        setCheckedState(event.target.checked);\n      }}\n    \u002F>\n  );\n}\n","tsx",[409],{"type":28,"tag":51,"props":410,"children":411},{"__ignoreMap":7},[412,444,477,484,512,566,579,592,619,636,677,717,730,739,748],{"type":28,"tag":128,"props":413,"children":414},{"class":130,"line":131},[415,419,423,427,431,435,440],{"type":28,"tag":128,"props":416,"children":417},{"style":266},[418],{"type":34,"value":269},{"type":28,"tag":128,"props":420,"children":421},{"style":135},[422],{"type":34,"value":274},{"type":28,"tag":128,"props":424,"children":425},{"style":141},[426],{"type":34,"value":56},{"type":28,"tag":128,"props":428,"children":429},{"style":135},[430],{"type":34,"value":284},{"type":28,"tag":128,"props":432,"children":433},{"style":266},[434],{"type":34,"value":289},{"type":28,"tag":128,"props":436,"children":437},{"style":175},[438],{"type":34,"value":439}," '@storefront-ui\u002Freact'",{"type":28,"tag":128,"props":441,"children":442},{"style":135},[443],{"type":34,"value":299},{"type":28,"tag":128,"props":445,"children":446},{"class":130,"line":151},[447,451,455,460,464,468,473],{"type":28,"tag":128,"props":448,"children":449},{"style":266},[450],{"type":34,"value":269},{"type":28,"tag":128,"props":452,"children":453},{"style":135},[454],{"type":34,"value":274},{"type":28,"tag":128,"props":456,"children":457},{"style":141},[458],{"type":34,"value":459},"useState",{"type":28,"tag":128,"props":461,"children":462},{"style":135},[463],{"type":34,"value":284},{"type":28,"tag":128,"props":465,"children":466},{"style":266},[467],{"type":34,"value":289},{"type":28,"tag":128,"props":469,"children":470},{"style":175},[471],{"type":34,"value":472}," 'react'",{"type":28,"tag":128,"props":474,"children":475},{"style":135},[476],{"type":34,"value":299},{"type":28,"tag":128,"props":478,"children":479},{"class":130,"line":200},[480],{"type":28,"tag":128,"props":481,"children":482},{"emptyLinePlaceholder":9},[483],{"type":34,"value":223},{"type":28,"tag":128,"props":485,"children":486},{"class":130,"line":217},[487,492,497,502,507],{"type":28,"tag":128,"props":488,"children":489},{"style":266},[490],{"type":34,"value":491},"export",{"type":28,"tag":128,"props":493,"children":494},{"style":266},[495],{"type":34,"value":496}," default",{"type":28,"tag":128,"props":498,"children":499},{"style":266},[500],{"type":34,"value":501}," function",{"type":28,"tag":128,"props":503,"children":504},{"style":364},[505],{"type":34,"value":506}," SwitchWithoutLabel",{"type":28,"tag":128,"props":508,"children":509},{"style":135},[510],{"type":34,"value":511},"() {\n",{"type":28,"tag":128,"props":513,"children":514},{"class":130,"line":226},[515,520,525,530,535,540,545,549,554,558,562],{"type":28,"tag":128,"props":516,"children":517},{"style":266},[518],{"type":34,"value":519},"  const",{"type":28,"tag":128,"props":521,"children":522},{"style":135},[523],{"type":34,"value":524}," [",{"type":28,"tag":128,"props":526,"children":527},{"style":352},[528],{"type":34,"value":529},"checkedState",{"type":28,"tag":128,"props":531,"children":532},{"style":135},[533],{"type":34,"value":534},", ",{"type":28,"tag":128,"props":536,"children":537},{"style":352},[538],{"type":34,"value":539},"setCheckedState",{"type":28,"tag":128,"props":541,"children":542},{"style":135},[543],{"type":34,"value":544},"] ",{"type":28,"tag":128,"props":546,"children":547},{"style":358},[548],{"type":34,"value":172},{"type":28,"tag":128,"props":550,"children":551},{"style":364},[552],{"type":34,"value":553}," useState",{"type":28,"tag":128,"props":555,"children":556},{"style":135},[557],{"type":34,"value":372},{"type":28,"tag":128,"props":559,"children":560},{"style":164},[561],{"type":34,"value":377},{"type":28,"tag":128,"props":563,"children":564},{"style":135},[565],{"type":34,"value":382},{"type":28,"tag":128,"props":567,"children":568},{"class":130,"line":262},[569,574],{"type":28,"tag":128,"props":570,"children":571},{"style":266},[572],{"type":34,"value":573},"  return",{"type":28,"tag":128,"props":575,"children":576},{"style":135},[577],{"type":34,"value":578}," (\n",{"type":28,"tag":128,"props":580,"children":581},{"class":130,"line":302},[582,587],{"type":28,"tag":128,"props":583,"children":584},{"style":135},[585],{"type":34,"value":586},"    \u003C",{"type":28,"tag":128,"props":588,"children":589},{"style":352},[590],{"type":34,"value":591},"SfSwitch\n",{"type":28,"tag":128,"props":593,"children":594},{"class":130,"line":335},[595,601,605,610,614],{"type":28,"tag":128,"props":596,"children":598},{"style":597},"--shiki-default:#D19A66;--shiki-default-font-style:italic",[599],{"type":34,"value":600},"      checked",{"type":28,"tag":128,"props":602,"children":603},{"style":358},[604],{"type":34,"value":172},{"type":28,"tag":128,"props":606,"children":607},{"style":266},[608],{"type":34,"value":609},"{",{"type":28,"tag":128,"props":611,"children":612},{"style":141},[613],{"type":34,"value":529},{"type":28,"tag":128,"props":615,"children":616},{"style":266},[617],{"type":34,"value":618},"}\n",{"type":28,"tag":128,"props":620,"children":621},{"class":130,"line":343},[622,627,631],{"type":28,"tag":128,"props":623,"children":624},{"style":597},[625],{"type":34,"value":626},"      value",{"type":28,"tag":128,"props":628,"children":629},{"style":358},[630],{"type":34,"value":172},{"type":28,"tag":128,"props":632,"children":633},{"style":175},[634],{"type":34,"value":635},"\"value-1\"\n",{"type":28,"tag":128,"props":637,"children":638},{"class":130,"line":385},[639,644,648,652,656,662,667,672],{"type":28,"tag":128,"props":640,"children":641},{"style":597},[642],{"type":34,"value":643},"      onChange",{"type":28,"tag":128,"props":645,"children":646},{"style":358},[647],{"type":34,"value":172},{"type":28,"tag":128,"props":649,"children":650},{"style":266},[651],{"type":34,"value":609},{"type":28,"tag":128,"props":653,"children":654},{"style":135},[655],{"type":34,"value":372},{"type":28,"tag":128,"props":657,"children":659},{"style":658},"--shiki-default:#E06C75;--shiki-default-font-style:italic",[660],{"type":34,"value":661},"event",{"type":28,"tag":128,"props":663,"children":664},{"style":135},[665],{"type":34,"value":666},") ",{"type":28,"tag":128,"props":668,"children":669},{"style":266},[670],{"type":34,"value":671},"=>",{"type":28,"tag":128,"props":673,"children":674},{"style":135},[675],{"type":34,"value":676}," {\n",{"type":28,"tag":128,"props":678,"children":680},{"class":130,"line":679},11,[681,686,690,694,699,704,708,713],{"type":28,"tag":128,"props":682,"children":683},{"style":364},[684],{"type":34,"value":685},"        setCheckedState",{"type":28,"tag":128,"props":687,"children":688},{"style":135},[689],{"type":34,"value":372},{"type":28,"tag":128,"props":691,"children":692},{"style":352},[693],{"type":34,"value":661},{"type":28,"tag":128,"props":695,"children":696},{"style":135},[697],{"type":34,"value":698},".",{"type":28,"tag":128,"props":700,"children":701},{"style":352},[702],{"type":34,"value":703},"target",{"type":28,"tag":128,"props":705,"children":706},{"style":135},[707],{"type":34,"value":698},{"type":28,"tag":128,"props":709,"children":710},{"style":141},[711],{"type":34,"value":712},"checked",{"type":28,"tag":128,"props":714,"children":715},{"style":135},[716],{"type":34,"value":382},{"type":28,"tag":128,"props":718,"children":720},{"class":130,"line":719},12,[721,726],{"type":28,"tag":128,"props":722,"children":723},{"style":135},[724],{"type":34,"value":725},"      }",{"type":28,"tag":128,"props":727,"children":728},{"style":266},[729],{"type":34,"value":618},{"type":28,"tag":128,"props":731,"children":733},{"class":130,"line":732},13,[734],{"type":28,"tag":128,"props":735,"children":736},{"style":135},[737],{"type":34,"value":738},"    \u002F>\n",{"type":28,"tag":128,"props":740,"children":742},{"class":130,"line":741},14,[743],{"type":28,"tag":128,"props":744,"children":745},{"style":135},[746],{"type":34,"value":747},"  );\n",{"type":28,"tag":128,"props":749,"children":751},{"class":130,"line":750},15,[752],{"type":28,"tag":128,"props":753,"children":754},{"style":135},[755],{"type":34,"value":618},{"type":28,"tag":91,"props":757,"children":759},{"id":758},"switch-with-leading-control",[760],{"type":34,"value":761},"Switch with leading control",{"type":28,"tag":109,"props":763,"children":765},{"showcase-name":764},"Switch\u002FSwitchLeading",[766,1118],{"type":28,"tag":114,"props":767,"children":768},{},[769],{"type":28,"tag":118,"props":770,"children":772},{"className":120,"code":771,"language":122,"meta":7,"style":7},"\u003Ctemplate>\n  \u003Clabel class=\"flex items-center\">\n    \u003CSfSwitch value=\"value\" v-model=\"modelCheck\" \u002F>\n    \u003Cspan class=\"text-base ml-[10px] text-gray-900 cursor-pointer font-body\">Label\u003C\u002Fspan>\n  \u003C\u002Flabel>\n  \u003Cspan class=\"typography-hint-xs mt-0.5 ml-12 block text-gray-500\">Help text\u003C\u002Fspan>\n\u003C\u002Ftemplate>\n\n\u003Cscript lang=\"ts\" setup>\nimport { ref } from 'vue';\nimport { SfSwitch } from '@storefront-ui\u002Fvue';\n\nconst modelCheck = ref(false);\n\u003C\u002Fscript>\n\n",[773],{"type":28,"tag":51,"props":774,"children":775},{"__ignoreMap":7},[776,791,821,860,897,913,950,965,972,1003,1034,1065,1072,1103],{"type":28,"tag":128,"props":777,"children":778},{"class":130,"line":131},[779,783,787],{"type":28,"tag":128,"props":780,"children":781},{"style":135},[782],{"type":34,"value":138},{"type":28,"tag":128,"props":784,"children":785},{"style":141},[786],{"type":34,"value":43},{"type":28,"tag":128,"props":788,"children":789},{"style":135},[790],{"type":34,"value":148},{"type":28,"tag":128,"props":792,"children":793},{"class":130,"line":151},[794,798,803,808,812,817],{"type":28,"tag":128,"props":795,"children":796},{"style":135},[797],{"type":34,"value":157},{"type":28,"tag":128,"props":799,"children":800},{"style":141},[801],{"type":34,"value":802},"label",{"type":28,"tag":128,"props":804,"children":805},{"style":164},[806],{"type":34,"value":807}," class",{"type":28,"tag":128,"props":809,"children":810},{"style":135},[811],{"type":34,"value":172},{"type":28,"tag":128,"props":813,"children":814},{"style":175},[815],{"type":34,"value":816},"\"flex items-center\"",{"type":28,"tag":128,"props":818,"children":819},{"style":135},[820],{"type":34,"value":148},{"type":28,"tag":128,"props":822,"children":823},{"class":130,"line":200},[824,828,832,836,840,844,848,852,856],{"type":28,"tag":128,"props":825,"children":826},{"style":135},[827],{"type":34,"value":586},{"type":28,"tag":128,"props":829,"children":830},{"style":141},[831],{"type":34,"value":56},{"type":28,"tag":128,"props":833,"children":834},{"style":164},[835],{"type":34,"value":167},{"type":28,"tag":128,"props":837,"children":838},{"style":135},[839],{"type":34,"value":172},{"type":28,"tag":128,"props":841,"children":842},{"style":175},[843],{"type":34,"value":178},{"type":28,"tag":128,"props":845,"children":846},{"style":164},[847],{"type":34,"value":183},{"type":28,"tag":128,"props":849,"children":850},{"style":135},[851],{"type":34,"value":172},{"type":28,"tag":128,"props":853,"children":854},{"style":175},[855],{"type":34,"value":192},{"type":28,"tag":128,"props":857,"children":858},{"style":135},[859],{"type":34,"value":197},{"type":28,"tag":128,"props":861,"children":862},{"class":130,"line":217},[863,867,871,875,879,884,889,893],{"type":28,"tag":128,"props":864,"children":865},{"style":135},[866],{"type":34,"value":586},{"type":28,"tag":128,"props":868,"children":869},{"style":141},[870],{"type":34,"value":128},{"type":28,"tag":128,"props":872,"children":873},{"style":164},[874],{"type":34,"value":807},{"type":28,"tag":128,"props":876,"children":877},{"style":135},[878],{"type":34,"value":172},{"type":28,"tag":128,"props":880,"children":881},{"style":175},[882],{"type":34,"value":883},"\"text-base ml-[10px] text-gray-900 cursor-pointer font-body\"",{"type":28,"tag":128,"props":885,"children":886},{"style":135},[887],{"type":34,"value":888},">Label\u003C\u002F",{"type":28,"tag":128,"props":890,"children":891},{"style":141},[892],{"type":34,"value":128},{"type":28,"tag":128,"props":894,"children":895},{"style":135},[896],{"type":34,"value":148},{"type":28,"tag":128,"props":898,"children":899},{"class":130,"line":226},[900,905,909],{"type":28,"tag":128,"props":901,"children":902},{"style":135},[903],{"type":34,"value":904},"  \u003C\u002F",{"type":28,"tag":128,"props":906,"children":907},{"style":141},[908],{"type":34,"value":802},{"type":28,"tag":128,"props":910,"children":911},{"style":135},[912],{"type":34,"value":148},{"type":28,"tag":128,"props":914,"children":915},{"class":130,"line":262},[916,920,924,928,932,937,942,946],{"type":28,"tag":128,"props":917,"children":918},{"style":135},[919],{"type":34,"value":157},{"type":28,"tag":128,"props":921,"children":922},{"style":141},[923],{"type":34,"value":128},{"type":28,"tag":128,"props":925,"children":926},{"style":164},[927],{"type":34,"value":807},{"type":28,"tag":128,"props":929,"children":930},{"style":135},[931],{"type":34,"value":172},{"type":28,"tag":128,"props":933,"children":934},{"style":175},[935],{"type":34,"value":936},"\"typography-hint-xs mt-0.5 ml-12 block text-gray-500\"",{"type":28,"tag":128,"props":938,"children":939},{"style":135},[940],{"type":34,"value":941},">Help text\u003C\u002F",{"type":28,"tag":128,"props":943,"children":944},{"style":141},[945],{"type":34,"value":128},{"type":28,"tag":128,"props":947,"children":948},{"style":135},[949],{"type":34,"value":148},{"type":28,"tag":128,"props":951,"children":952},{"class":130,"line":302},[953,957,961],{"type":28,"tag":128,"props":954,"children":955},{"style":135},[956],{"type":34,"value":206},{"type":28,"tag":128,"props":958,"children":959},{"style":141},[960],{"type":34,"value":43},{"type":28,"tag":128,"props":962,"children":963},{"style":135},[964],{"type":34,"value":148},{"type":28,"tag":128,"props":966,"children":967},{"class":130,"line":335},[968],{"type":28,"tag":128,"props":969,"children":970},{"emptyLinePlaceholder":9},[971],{"type":34,"value":223},{"type":28,"tag":128,"props":973,"children":974},{"class":130,"line":343},[975,979,983,987,991,995,999],{"type":28,"tag":128,"props":976,"children":977},{"style":135},[978],{"type":34,"value":138},{"type":28,"tag":128,"props":980,"children":981},{"style":141},[982],{"type":34,"value":236},{"type":28,"tag":128,"props":984,"children":985},{"style":164},[986],{"type":34,"value":241},{"type":28,"tag":128,"props":988,"children":989},{"style":135},[990],{"type":34,"value":172},{"type":28,"tag":128,"props":992,"children":993},{"style":175},[994],{"type":34,"value":250},{"type":28,"tag":128,"props":996,"children":997},{"style":164},[998],{"type":34,"value":255},{"type":28,"tag":128,"props":1000,"children":1001},{"style":135},[1002],{"type":34,"value":148},{"type":28,"tag":128,"props":1004,"children":1005},{"class":130,"line":385},[1006,1010,1014,1018,1022,1026,1030],{"type":28,"tag":128,"props":1007,"children":1008},{"style":266},[1009],{"type":34,"value":269},{"type":28,"tag":128,"props":1011,"children":1012},{"style":135},[1013],{"type":34,"value":274},{"type":28,"tag":128,"props":1015,"children":1016},{"style":141},[1017],{"type":34,"value":279},{"type":28,"tag":128,"props":1019,"children":1020},{"style":135},[1021],{"type":34,"value":284},{"type":28,"tag":128,"props":1023,"children":1024},{"style":266},[1025],{"type":34,"value":289},{"type":28,"tag":128,"props":1027,"children":1028},{"style":175},[1029],{"type":34,"value":294},{"type":28,"tag":128,"props":1031,"children":1032},{"style":135},[1033],{"type":34,"value":299},{"type":28,"tag":128,"props":1035,"children":1036},{"class":130,"line":679},[1037,1041,1045,1049,1053,1057,1061],{"type":28,"tag":128,"props":1038,"children":1039},{"style":266},[1040],{"type":34,"value":269},{"type":28,"tag":128,"props":1042,"children":1043},{"style":135},[1044],{"type":34,"value":274},{"type":28,"tag":128,"props":1046,"children":1047},{"style":141},[1048],{"type":34,"value":56},{"type":28,"tag":128,"props":1050,"children":1051},{"style":135},[1052],{"type":34,"value":284},{"type":28,"tag":128,"props":1054,"children":1055},{"style":266},[1056],{"type":34,"value":289},{"type":28,"tag":128,"props":1058,"children":1059},{"style":175},[1060],{"type":34,"value":328},{"type":28,"tag":128,"props":1062,"children":1063},{"style":135},[1064],{"type":34,"value":299},{"type":28,"tag":128,"props":1066,"children":1067},{"class":130,"line":719},[1068],{"type":28,"tag":128,"props":1069,"children":1070},{"emptyLinePlaceholder":9},[1071],{"type":34,"value":223},{"type":28,"tag":128,"props":1073,"children":1074},{"class":130,"line":732},[1075,1079,1083,1087,1091,1095,1099],{"type":28,"tag":128,"props":1076,"children":1077},{"style":266},[1078],{"type":34,"value":349},{"type":28,"tag":128,"props":1080,"children":1081},{"style":352},[1082],{"type":34,"value":355},{"type":28,"tag":128,"props":1084,"children":1085},{"style":358},[1086],{"type":34,"value":361},{"type":28,"tag":128,"props":1088,"children":1089},{"style":364},[1090],{"type":34,"value":367},{"type":28,"tag":128,"props":1092,"children":1093},{"style":135},[1094],{"type":34,"value":372},{"type":28,"tag":128,"props":1096,"children":1097},{"style":164},[1098],{"type":34,"value":377},{"type":28,"tag":128,"props":1100,"children":1101},{"style":135},[1102],{"type":34,"value":382},{"type":28,"tag":128,"props":1104,"children":1105},{"class":130,"line":741},[1106,1110,1114],{"type":28,"tag":128,"props":1107,"children":1108},{"style":135},[1109],{"type":34,"value":206},{"type":28,"tag":128,"props":1111,"children":1112},{"style":141},[1113],{"type":34,"value":236},{"type":28,"tag":128,"props":1115,"children":1116},{"style":135},[1117],{"type":34,"value":148},{"type":28,"tag":400,"props":1119,"children":1120},{},[1121],{"type":28,"tag":118,"props":1122,"children":1124},{"className":405,"code":1123,"language":407,"meta":7,"style":7},"import { SfSwitch } from '@storefront-ui\u002Freact';\nimport { useState } from 'react';\n\nexport default function SwitchAlignment() {\n  const [checkedState, setCheckedState] = useState(false);\n  return (\n    \u003C>\n      \u003Clabel className=\"flex items-center\">\n        \u003CSfSwitch\n          checked={checkedState}\n          value=\"value-1\"\n          onChange={(event) => {\n            setCheckedState(event.target.checked);\n          }}\n        \u002F>\n        \u003Cspan className=\"text-base ml-[10px] text-gray-900 cursor-pointer font-body\">Label\u003C\u002Fspan>\n      \u003C\u002Flabel>\n      \u003Cspan className=\"typography-hint-xs mt-0.5 ml-12 block text-gray-500\">Help text\u003C\u002Fspan>\n    \u003C\u002F>\n  );\n}\n",[1125],{"type":28,"tag":51,"props":1126,"children":1127},{"__ignoreMap":7},[1128,1159,1190,1197,1221,1268,1279,1287,1316,1328,1352,1368,1404,1440,1452,1460,1496,1513,1549,1558,1566],{"type":28,"tag":128,"props":1129,"children":1130},{"class":130,"line":131},[1131,1135,1139,1143,1147,1151,1155],{"type":28,"tag":128,"props":1132,"children":1133},{"style":266},[1134],{"type":34,"value":269},{"type":28,"tag":128,"props":1136,"children":1137},{"style":135},[1138],{"type":34,"value":274},{"type":28,"tag":128,"props":1140,"children":1141},{"style":141},[1142],{"type":34,"value":56},{"type":28,"tag":128,"props":1144,"children":1145},{"style":135},[1146],{"type":34,"value":284},{"type":28,"tag":128,"props":1148,"children":1149},{"style":266},[1150],{"type":34,"value":289},{"type":28,"tag":128,"props":1152,"children":1153},{"style":175},[1154],{"type":34,"value":439},{"type":28,"tag":128,"props":1156,"children":1157},{"style":135},[1158],{"type":34,"value":299},{"type":28,"tag":128,"props":1160,"children":1161},{"class":130,"line":151},[1162,1166,1170,1174,1178,1182,1186],{"type":28,"tag":128,"props":1163,"children":1164},{"style":266},[1165],{"type":34,"value":269},{"type":28,"tag":128,"props":1167,"children":1168},{"style":135},[1169],{"type":34,"value":274},{"type":28,"tag":128,"props":1171,"children":1172},{"style":141},[1173],{"type":34,"value":459},{"type":28,"tag":128,"props":1175,"children":1176},{"style":135},[1177],{"type":34,"value":284},{"type":28,"tag":128,"props":1179,"children":1180},{"style":266},[1181],{"type":34,"value":289},{"type":28,"tag":128,"props":1183,"children":1184},{"style":175},[1185],{"type":34,"value":472},{"type":28,"tag":128,"props":1187,"children":1188},{"style":135},[1189],{"type":34,"value":299},{"type":28,"tag":128,"props":1191,"children":1192},{"class":130,"line":200},[1193],{"type":28,"tag":128,"props":1194,"children":1195},{"emptyLinePlaceholder":9},[1196],{"type":34,"value":223},{"type":28,"tag":128,"props":1198,"children":1199},{"class":130,"line":217},[1200,1204,1208,1212,1217],{"type":28,"tag":128,"props":1201,"children":1202},{"style":266},[1203],{"type":34,"value":491},{"type":28,"tag":128,"props":1205,"children":1206},{"style":266},[1207],{"type":34,"value":496},{"type":28,"tag":128,"props":1209,"children":1210},{"style":266},[1211],{"type":34,"value":501},{"type":28,"tag":128,"props":1213,"children":1214},{"style":364},[1215],{"type":34,"value":1216}," SwitchAlignment",{"type":28,"tag":128,"props":1218,"children":1219},{"style":135},[1220],{"type":34,"value":511},{"type":28,"tag":128,"props":1222,"children":1223},{"class":130,"line":226},[1224,1228,1232,1236,1240,1244,1248,1252,1256,1260,1264],{"type":28,"tag":128,"props":1225,"children":1226},{"style":266},[1227],{"type":34,"value":519},{"type":28,"tag":128,"props":1229,"children":1230},{"style":135},[1231],{"type":34,"value":524},{"type":28,"tag":128,"props":1233,"children":1234},{"style":352},[1235],{"type":34,"value":529},{"type":28,"tag":128,"props":1237,"children":1238},{"style":135},[1239],{"type":34,"value":534},{"type":28,"tag":128,"props":1241,"children":1242},{"style":352},[1243],{"type":34,"value":539},{"type":28,"tag":128,"props":1245,"children":1246},{"style":135},[1247],{"type":34,"value":544},{"type":28,"tag":128,"props":1249,"children":1250},{"style":358},[1251],{"type":34,"value":172},{"type":28,"tag":128,"props":1253,"children":1254},{"style":364},[1255],{"type":34,"value":553},{"type":28,"tag":128,"props":1257,"children":1258},{"style":135},[1259],{"type":34,"value":372},{"type":28,"tag":128,"props":1261,"children":1262},{"style":164},[1263],{"type":34,"value":377},{"type":28,"tag":128,"props":1265,"children":1266},{"style":135},[1267],{"type":34,"value":382},{"type":28,"tag":128,"props":1269,"children":1270},{"class":130,"line":262},[1271,1275],{"type":28,"tag":128,"props":1272,"children":1273},{"style":266},[1274],{"type":34,"value":573},{"type":28,"tag":128,"props":1276,"children":1277},{"style":135},[1278],{"type":34,"value":578},{"type":28,"tag":128,"props":1280,"children":1281},{"class":130,"line":302},[1282],{"type":28,"tag":128,"props":1283,"children":1284},{"style":135},[1285],{"type":34,"value":1286},"    \u003C>\n",{"type":28,"tag":128,"props":1288,"children":1289},{"class":130,"line":335},[1290,1295,1299,1304,1308,1312],{"type":28,"tag":128,"props":1291,"children":1292},{"style":135},[1293],{"type":34,"value":1294},"      \u003C",{"type":28,"tag":128,"props":1296,"children":1297},{"style":141},[1298],{"type":34,"value":802},{"type":28,"tag":128,"props":1300,"children":1301},{"style":597},[1302],{"type":34,"value":1303}," className",{"type":28,"tag":128,"props":1305,"children":1306},{"style":358},[1307],{"type":34,"value":172},{"type":28,"tag":128,"props":1309,"children":1310},{"style":175},[1311],{"type":34,"value":816},{"type":28,"tag":128,"props":1313,"children":1314},{"style":135},[1315],{"type":34,"value":148},{"type":28,"tag":128,"props":1317,"children":1318},{"class":130,"line":343},[1319,1324],{"type":28,"tag":128,"props":1320,"children":1321},{"style":135},[1322],{"type":34,"value":1323},"        \u003C",{"type":28,"tag":128,"props":1325,"children":1326},{"style":352},[1327],{"type":34,"value":591},{"type":28,"tag":128,"props":1329,"children":1330},{"class":130,"line":385},[1331,1336,1340,1344,1348],{"type":28,"tag":128,"props":1332,"children":1333},{"style":597},[1334],{"type":34,"value":1335},"          checked",{"type":28,"tag":128,"props":1337,"children":1338},{"style":358},[1339],{"type":34,"value":172},{"type":28,"tag":128,"props":1341,"children":1342},{"style":266},[1343],{"type":34,"value":609},{"type":28,"tag":128,"props":1345,"children":1346},{"style":141},[1347],{"type":34,"value":529},{"type":28,"tag":128,"props":1349,"children":1350},{"style":266},[1351],{"type":34,"value":618},{"type":28,"tag":128,"props":1353,"children":1354},{"class":130,"line":679},[1355,1360,1364],{"type":28,"tag":128,"props":1356,"children":1357},{"style":597},[1358],{"type":34,"value":1359},"          value",{"type":28,"tag":128,"props":1361,"children":1362},{"style":358},[1363],{"type":34,"value":172},{"type":28,"tag":128,"props":1365,"children":1366},{"style":175},[1367],{"type":34,"value":635},{"type":28,"tag":128,"props":1369,"children":1370},{"class":130,"line":719},[1371,1376,1380,1384,1388,1392,1396,1400],{"type":28,"tag":128,"props":1372,"children":1373},{"style":597},[1374],{"type":34,"value":1375},"          onChange",{"type":28,"tag":128,"props":1377,"children":1378},{"style":358},[1379],{"type":34,"value":172},{"type":28,"tag":128,"props":1381,"children":1382},{"style":266},[1383],{"type":34,"value":609},{"type":28,"tag":128,"props":1385,"children":1386},{"style":135},[1387],{"type":34,"value":372},{"type":28,"tag":128,"props":1389,"children":1390},{"style":658},[1391],{"type":34,"value":661},{"type":28,"tag":128,"props":1393,"children":1394},{"style":135},[1395],{"type":34,"value":666},{"type":28,"tag":128,"props":1397,"children":1398},{"style":266},[1399],{"type":34,"value":671},{"type":28,"tag":128,"props":1401,"children":1402},{"style":135},[1403],{"type":34,"value":676},{"type":28,"tag":128,"props":1405,"children":1406},{"class":130,"line":732},[1407,1412,1416,1420,1424,1428,1432,1436],{"type":28,"tag":128,"props":1408,"children":1409},{"style":364},[1410],{"type":34,"value":1411},"            setCheckedState",{"type":28,"tag":128,"props":1413,"children":1414},{"style":135},[1415],{"type":34,"value":372},{"type":28,"tag":128,"props":1417,"children":1418},{"style":352},[1419],{"type":34,"value":661},{"type":28,"tag":128,"props":1421,"children":1422},{"style":135},[1423],{"type":34,"value":698},{"type":28,"tag":128,"props":1425,"children":1426},{"style":352},[1427],{"type":34,"value":703},{"type":28,"tag":128,"props":1429,"children":1430},{"style":135},[1431],{"type":34,"value":698},{"type":28,"tag":128,"props":1433,"children":1434},{"style":141},[1435],{"type":34,"value":712},{"type":28,"tag":128,"props":1437,"children":1438},{"style":135},[1439],{"type":34,"value":382},{"type":28,"tag":128,"props":1441,"children":1442},{"class":130,"line":741},[1443,1448],{"type":28,"tag":128,"props":1444,"children":1445},{"style":135},[1446],{"type":34,"value":1447},"          }",{"type":28,"tag":128,"props":1449,"children":1450},{"style":266},[1451],{"type":34,"value":618},{"type":28,"tag":128,"props":1453,"children":1454},{"class":130,"line":750},[1455],{"type":28,"tag":128,"props":1456,"children":1457},{"style":135},[1458],{"type":34,"value":1459},"        \u002F>\n",{"type":28,"tag":128,"props":1461,"children":1463},{"class":130,"line":1462},16,[1464,1468,1472,1476,1480,1484,1488,1492],{"type":28,"tag":128,"props":1465,"children":1466},{"style":135},[1467],{"type":34,"value":1323},{"type":28,"tag":128,"props":1469,"children":1470},{"style":141},[1471],{"type":34,"value":128},{"type":28,"tag":128,"props":1473,"children":1474},{"style":597},[1475],{"type":34,"value":1303},{"type":28,"tag":128,"props":1477,"children":1478},{"style":358},[1479],{"type":34,"value":172},{"type":28,"tag":128,"props":1481,"children":1482},{"style":175},[1483],{"type":34,"value":883},{"type":28,"tag":128,"props":1485,"children":1486},{"style":135},[1487],{"type":34,"value":888},{"type":28,"tag":128,"props":1489,"children":1490},{"style":141},[1491],{"type":34,"value":128},{"type":28,"tag":128,"props":1493,"children":1494},{"style":135},[1495],{"type":34,"value":148},{"type":28,"tag":128,"props":1497,"children":1499},{"class":130,"line":1498},17,[1500,1505,1509],{"type":28,"tag":128,"props":1501,"children":1502},{"style":135},[1503],{"type":34,"value":1504},"      \u003C\u002F",{"type":28,"tag":128,"props":1506,"children":1507},{"style":141},[1508],{"type":34,"value":802},{"type":28,"tag":128,"props":1510,"children":1511},{"style":135},[1512],{"type":34,"value":148},{"type":28,"tag":128,"props":1514,"children":1516},{"class":130,"line":1515},18,[1517,1521,1525,1529,1533,1537,1541,1545],{"type":28,"tag":128,"props":1518,"children":1519},{"style":135},[1520],{"type":34,"value":1294},{"type":28,"tag":128,"props":1522,"children":1523},{"style":141},[1524],{"type":34,"value":128},{"type":28,"tag":128,"props":1526,"children":1527},{"style":597},[1528],{"type":34,"value":1303},{"type":28,"tag":128,"props":1530,"children":1531},{"style":358},[1532],{"type":34,"value":172},{"type":28,"tag":128,"props":1534,"children":1535},{"style":175},[1536],{"type":34,"value":936},{"type":28,"tag":128,"props":1538,"children":1539},{"style":135},[1540],{"type":34,"value":941},{"type":28,"tag":128,"props":1542,"children":1543},{"style":141},[1544],{"type":34,"value":128},{"type":28,"tag":128,"props":1546,"children":1547},{"style":135},[1548],{"type":34,"value":148},{"type":28,"tag":128,"props":1550,"children":1552},{"class":130,"line":1551},19,[1553],{"type":28,"tag":128,"props":1554,"children":1555},{"style":135},[1556],{"type":34,"value":1557},"    \u003C\u002F>\n",{"type":28,"tag":128,"props":1559,"children":1561},{"class":130,"line":1560},20,[1562],{"type":28,"tag":128,"props":1563,"children":1564},{"style":135},[1565],{"type":34,"value":747},{"type":28,"tag":128,"props":1567,"children":1569},{"class":130,"line":1568},21,[1570],{"type":28,"tag":128,"props":1571,"children":1572},{"style":135},[1573],{"type":34,"value":618},{"type":28,"tag":91,"props":1575,"children":1577},{"id":1576},"switch-with-trailing-control",[1578],{"type":34,"value":1579},"Switch with trailing control",{"type":28,"tag":47,"props":1581,"children":1582},{},[1583],{"type":34,"value":1584},"Switch component with a label align on the left.",{"type":28,"tag":109,"props":1586,"children":1588},{"showcase-name":1587},"Switch\u002FSwitchTrailing",[1589,1936],{"type":28,"tag":114,"props":1590,"children":1591},{},[1592],{"type":28,"tag":118,"props":1593,"children":1595},{"className":120,"code":1594,"language":122,"meta":7,"style":7},"\u003Ctemplate>\n  \u003Clabel class=\"flex items-center justify-between\">\n    \u003Cspan class=\"text-base text-gray-900 cursor-pointer font-body\">Label\u003C\u002Fspan>\n    \u003CSfSwitch value=\"value\" v-model=\"modelCheck\" \u002F>\n  \u003C\u002Flabel>\n  \u003Cspan class=\"typography-hint-xs mt-0.5 block text-gray-500\">Help text\u003C\u002Fspan>\n\u003C\u002Ftemplate>\n\n\u003Cscript lang=\"ts\" setup>\nimport { ref } from 'vue';\nimport { SfSwitch } from '@storefront-ui\u002Fvue';\n\nconst modelCheck = ref(false);\n\u003C\u002Fscript>\n\n",[1596],{"type":28,"tag":51,"props":1597,"children":1598},{"__ignoreMap":7},[1599,1614,1642,1678,1717,1732,1768,1783,1790,1821,1852,1883,1890,1921],{"type":28,"tag":128,"props":1600,"children":1601},{"class":130,"line":131},[1602,1606,1610],{"type":28,"tag":128,"props":1603,"children":1604},{"style":135},[1605],{"type":34,"value":138},{"type":28,"tag":128,"props":1607,"children":1608},{"style":141},[1609],{"type":34,"value":43},{"type":28,"tag":128,"props":1611,"children":1612},{"style":135},[1613],{"type":34,"value":148},{"type":28,"tag":128,"props":1615,"children":1616},{"class":130,"line":151},[1617,1621,1625,1629,1633,1638],{"type":28,"tag":128,"props":1618,"children":1619},{"style":135},[1620],{"type":34,"value":157},{"type":28,"tag":128,"props":1622,"children":1623},{"style":141},[1624],{"type":34,"value":802},{"type":28,"tag":128,"props":1626,"children":1627},{"style":164},[1628],{"type":34,"value":807},{"type":28,"tag":128,"props":1630,"children":1631},{"style":135},[1632],{"type":34,"value":172},{"type":28,"tag":128,"props":1634,"children":1635},{"style":175},[1636],{"type":34,"value":1637},"\"flex items-center justify-between\"",{"type":28,"tag":128,"props":1639,"children":1640},{"style":135},[1641],{"type":34,"value":148},{"type":28,"tag":128,"props":1643,"children":1644},{"class":130,"line":200},[1645,1649,1653,1657,1661,1666,1670,1674],{"type":28,"tag":128,"props":1646,"children":1647},{"style":135},[1648],{"type":34,"value":586},{"type":28,"tag":128,"props":1650,"children":1651},{"style":141},[1652],{"type":34,"value":128},{"type":28,"tag":128,"props":1654,"children":1655},{"style":164},[1656],{"type":34,"value":807},{"type":28,"tag":128,"props":1658,"children":1659},{"style":135},[1660],{"type":34,"value":172},{"type":28,"tag":128,"props":1662,"children":1663},{"style":175},[1664],{"type":34,"value":1665},"\"text-base text-gray-900 cursor-pointer font-body\"",{"type":28,"tag":128,"props":1667,"children":1668},{"style":135},[1669],{"type":34,"value":888},{"type":28,"tag":128,"props":1671,"children":1672},{"style":141},[1673],{"type":34,"value":128},{"type":28,"tag":128,"props":1675,"children":1676},{"style":135},[1677],{"type":34,"value":148},{"type":28,"tag":128,"props":1679,"children":1680},{"class":130,"line":217},[1681,1685,1689,1693,1697,1701,1705,1709,1713],{"type":28,"tag":128,"props":1682,"children":1683},{"style":135},[1684],{"type":34,"value":586},{"type":28,"tag":128,"props":1686,"children":1687},{"style":141},[1688],{"type":34,"value":56},{"type":28,"tag":128,"props":1690,"children":1691},{"style":164},[1692],{"type":34,"value":167},{"type":28,"tag":128,"props":1694,"children":1695},{"style":135},[1696],{"type":34,"value":172},{"type":28,"tag":128,"props":1698,"children":1699},{"style":175},[1700],{"type":34,"value":178},{"type":28,"tag":128,"props":1702,"children":1703},{"style":164},[1704],{"type":34,"value":183},{"type":28,"tag":128,"props":1706,"children":1707},{"style":135},[1708],{"type":34,"value":172},{"type":28,"tag":128,"props":1710,"children":1711},{"style":175},[1712],{"type":34,"value":192},{"type":28,"tag":128,"props":1714,"children":1715},{"style":135},[1716],{"type":34,"value":197},{"type":28,"tag":128,"props":1718,"children":1719},{"class":130,"line":226},[1720,1724,1728],{"type":28,"tag":128,"props":1721,"children":1722},{"style":135},[1723],{"type":34,"value":904},{"type":28,"tag":128,"props":1725,"children":1726},{"style":141},[1727],{"type":34,"value":802},{"type":28,"tag":128,"props":1729,"children":1730},{"style":135},[1731],{"type":34,"value":148},{"type":28,"tag":128,"props":1733,"children":1734},{"class":130,"line":262},[1735,1739,1743,1747,1751,1756,1760,1764],{"type":28,"tag":128,"props":1736,"children":1737},{"style":135},[1738],{"type":34,"value":157},{"type":28,"tag":128,"props":1740,"children":1741},{"style":141},[1742],{"type":34,"value":128},{"type":28,"tag":128,"props":1744,"children":1745},{"style":164},[1746],{"type":34,"value":807},{"type":28,"tag":128,"props":1748,"children":1749},{"style":135},[1750],{"type":34,"value":172},{"type":28,"tag":128,"props":1752,"children":1753},{"style":175},[1754],{"type":34,"value":1755},"\"typography-hint-xs mt-0.5 block text-gray-500\"",{"type":28,"tag":128,"props":1757,"children":1758},{"style":135},[1759],{"type":34,"value":941},{"type":28,"tag":128,"props":1761,"children":1762},{"style":141},[1763],{"type":34,"value":128},{"type":28,"tag":128,"props":1765,"children":1766},{"style":135},[1767],{"type":34,"value":148},{"type":28,"tag":128,"props":1769,"children":1770},{"class":130,"line":302},[1771,1775,1779],{"type":28,"tag":128,"props":1772,"children":1773},{"style":135},[1774],{"type":34,"value":206},{"type":28,"tag":128,"props":1776,"children":1777},{"style":141},[1778],{"type":34,"value":43},{"type":28,"tag":128,"props":1780,"children":1781},{"style":135},[1782],{"type":34,"value":148},{"type":28,"tag":128,"props":1784,"children":1785},{"class":130,"line":335},[1786],{"type":28,"tag":128,"props":1787,"children":1788},{"emptyLinePlaceholder":9},[1789],{"type":34,"value":223},{"type":28,"tag":128,"props":1791,"children":1792},{"class":130,"line":343},[1793,1797,1801,1805,1809,1813,1817],{"type":28,"tag":128,"props":1794,"children":1795},{"style":135},[1796],{"type":34,"value":138},{"type":28,"tag":128,"props":1798,"children":1799},{"style":141},[1800],{"type":34,"value":236},{"type":28,"tag":128,"props":1802,"children":1803},{"style":164},[1804],{"type":34,"value":241},{"type":28,"tag":128,"props":1806,"children":1807},{"style":135},[1808],{"type":34,"value":172},{"type":28,"tag":128,"props":1810,"children":1811},{"style":175},[1812],{"type":34,"value":250},{"type":28,"tag":128,"props":1814,"children":1815},{"style":164},[1816],{"type":34,"value":255},{"type":28,"tag":128,"props":1818,"children":1819},{"style":135},[1820],{"type":34,"value":148},{"type":28,"tag":128,"props":1822,"children":1823},{"class":130,"line":385},[1824,1828,1832,1836,1840,1844,1848],{"type":28,"tag":128,"props":1825,"children":1826},{"style":266},[1827],{"type":34,"value":269},{"type":28,"tag":128,"props":1829,"children":1830},{"style":135},[1831],{"type":34,"value":274},{"type":28,"tag":128,"props":1833,"children":1834},{"style":141},[1835],{"type":34,"value":279},{"type":28,"tag":128,"props":1837,"children":1838},{"style":135},[1839],{"type":34,"value":284},{"type":28,"tag":128,"props":1841,"children":1842},{"style":266},[1843],{"type":34,"value":289},{"type":28,"tag":128,"props":1845,"children":1846},{"style":175},[1847],{"type":34,"value":294},{"type":28,"tag":128,"props":1849,"children":1850},{"style":135},[1851],{"type":34,"value":299},{"type":28,"tag":128,"props":1853,"children":1854},{"class":130,"line":679},[1855,1859,1863,1867,1871,1875,1879],{"type":28,"tag":128,"props":1856,"children":1857},{"style":266},[1858],{"type":34,"value":269},{"type":28,"tag":128,"props":1860,"children":1861},{"style":135},[1862],{"type":34,"value":274},{"type":28,"tag":128,"props":1864,"children":1865},{"style":141},[1866],{"type":34,"value":56},{"type":28,"tag":128,"props":1868,"children":1869},{"style":135},[1870],{"type":34,"value":284},{"type":28,"tag":128,"props":1872,"children":1873},{"style":266},[1874],{"type":34,"value":289},{"type":28,"tag":128,"props":1876,"children":1877},{"style":175},[1878],{"type":34,"value":328},{"type":28,"tag":128,"props":1880,"children":1881},{"style":135},[1882],{"type":34,"value":299},{"type":28,"tag":128,"props":1884,"children":1885},{"class":130,"line":719},[1886],{"type":28,"tag":128,"props":1887,"children":1888},{"emptyLinePlaceholder":9},[1889],{"type":34,"value":223},{"type":28,"tag":128,"props":1891,"children":1892},{"class":130,"line":732},[1893,1897,1901,1905,1909,1913,1917],{"type":28,"tag":128,"props":1894,"children":1895},{"style":266},[1896],{"type":34,"value":349},{"type":28,"tag":128,"props":1898,"children":1899},{"style":352},[1900],{"type":34,"value":355},{"type":28,"tag":128,"props":1902,"children":1903},{"style":358},[1904],{"type":34,"value":361},{"type":28,"tag":128,"props":1906,"children":1907},{"style":364},[1908],{"type":34,"value":367},{"type":28,"tag":128,"props":1910,"children":1911},{"style":135},[1912],{"type":34,"value":372},{"type":28,"tag":128,"props":1914,"children":1915},{"style":164},[1916],{"type":34,"value":377},{"type":28,"tag":128,"props":1918,"children":1919},{"style":135},[1920],{"type":34,"value":382},{"type":28,"tag":128,"props":1922,"children":1923},{"class":130,"line":741},[1924,1928,1932],{"type":28,"tag":128,"props":1925,"children":1926},{"style":135},[1927],{"type":34,"value":206},{"type":28,"tag":128,"props":1929,"children":1930},{"style":141},[1931],{"type":34,"value":236},{"type":28,"tag":128,"props":1933,"children":1934},{"style":135},[1935],{"type":34,"value":148},{"type":28,"tag":400,"props":1937,"children":1938},{},[1939],{"type":28,"tag":118,"props":1940,"children":1942},{"className":405,"code":1941,"language":407,"meta":7,"style":7},"import { SfSwitch } from '@storefront-ui\u002Freact';\nimport { useState } from 'react';\n\nexport default function SwitchAlignment() {\n  const [checkedState, setCheckedState] = useState(false);\n  return (\n    \u003C>\n      \u003Clabel className=\"flex items-center justify-between\">\n        \u003Cspan className=\"text-base text-gray-900 cursor-pointer font-body\">Label\u003C\u002Fspan>\n        \u003CSfSwitch\n          checked={checkedState}\n          value=\"value-1\"\n          onChange={(event) => {\n            setCheckedState(event.target.checked);\n          }}\n        \u002F>\n      \u003C\u002Flabel>\n      \u003Cspan className=\"typography-hint-xs mt-0.5 block text-gray-500\">Help text\u003C\u002Fspan>\n    \u003C\u002F>\n  );\n}\n",[1943],{"type":28,"tag":51,"props":1944,"children":1945},{"__ignoreMap":7},[1946,1977,2008,2015,2038,2085,2096,2103,2130,2165,2176,2199,2214,2249,2284,2295,2302,2317,2352,2359,2366],{"type":28,"tag":128,"props":1947,"children":1948},{"class":130,"line":131},[1949,1953,1957,1961,1965,1969,1973],{"type":28,"tag":128,"props":1950,"children":1951},{"style":266},[1952],{"type":34,"value":269},{"type":28,"tag":128,"props":1954,"children":1955},{"style":135},[1956],{"type":34,"value":274},{"type":28,"tag":128,"props":1958,"children":1959},{"style":141},[1960],{"type":34,"value":56},{"type":28,"tag":128,"props":1962,"children":1963},{"style":135},[1964],{"type":34,"value":284},{"type":28,"tag":128,"props":1966,"children":1967},{"style":266},[1968],{"type":34,"value":289},{"type":28,"tag":128,"props":1970,"children":1971},{"style":175},[1972],{"type":34,"value":439},{"type":28,"tag":128,"props":1974,"children":1975},{"style":135},[1976],{"type":34,"value":299},{"type":28,"tag":128,"props":1978,"children":1979},{"class":130,"line":151},[1980,1984,1988,1992,1996,2000,2004],{"type":28,"tag":128,"props":1981,"children":1982},{"style":266},[1983],{"type":34,"value":269},{"type":28,"tag":128,"props":1985,"children":1986},{"style":135},[1987],{"type":34,"value":274},{"type":28,"tag":128,"props":1989,"children":1990},{"style":141},[1991],{"type":34,"value":459},{"type":28,"tag":128,"props":1993,"children":1994},{"style":135},[1995],{"type":34,"value":284},{"type":28,"tag":128,"props":1997,"children":1998},{"style":266},[1999],{"type":34,"value":289},{"type":28,"tag":128,"props":2001,"children":2002},{"style":175},[2003],{"type":34,"value":472},{"type":28,"tag":128,"props":2005,"children":2006},{"style":135},[2007],{"type":34,"value":299},{"type":28,"tag":128,"props":2009,"children":2010},{"class":130,"line":200},[2011],{"type":28,"tag":128,"props":2012,"children":2013},{"emptyLinePlaceholder":9},[2014],{"type":34,"value":223},{"type":28,"tag":128,"props":2016,"children":2017},{"class":130,"line":217},[2018,2022,2026,2030,2034],{"type":28,"tag":128,"props":2019,"children":2020},{"style":266},[2021],{"type":34,"value":491},{"type":28,"tag":128,"props":2023,"children":2024},{"style":266},[2025],{"type":34,"value":496},{"type":28,"tag":128,"props":2027,"children":2028},{"style":266},[2029],{"type":34,"value":501},{"type":28,"tag":128,"props":2031,"children":2032},{"style":364},[2033],{"type":34,"value":1216},{"type":28,"tag":128,"props":2035,"children":2036},{"style":135},[2037],{"type":34,"value":511},{"type":28,"tag":128,"props":2039,"children":2040},{"class":130,"line":226},[2041,2045,2049,2053,2057,2061,2065,2069,2073,2077,2081],{"type":28,"tag":128,"props":2042,"children":2043},{"style":266},[2044],{"type":34,"value":519},{"type":28,"tag":128,"props":2046,"children":2047},{"style":135},[2048],{"type":34,"value":524},{"type":28,"tag":128,"props":2050,"children":2051},{"style":352},[2052],{"type":34,"value":529},{"type":28,"tag":128,"props":2054,"children":2055},{"style":135},[2056],{"type":34,"value":534},{"type":28,"tag":128,"props":2058,"children":2059},{"style":352},[2060],{"type":34,"value":539},{"type":28,"tag":128,"props":2062,"children":2063},{"style":135},[2064],{"type":34,"value":544},{"type":28,"tag":128,"props":2066,"children":2067},{"style":358},[2068],{"type":34,"value":172},{"type":28,"tag":128,"props":2070,"children":2071},{"style":364},[2072],{"type":34,"value":553},{"type":28,"tag":128,"props":2074,"children":2075},{"style":135},[2076],{"type":34,"value":372},{"type":28,"tag":128,"props":2078,"children":2079},{"style":164},[2080],{"type":34,"value":377},{"type":28,"tag":128,"props":2082,"children":2083},{"style":135},[2084],{"type":34,"value":382},{"type":28,"tag":128,"props":2086,"children":2087},{"class":130,"line":262},[2088,2092],{"type":28,"tag":128,"props":2089,"children":2090},{"style":266},[2091],{"type":34,"value":573},{"type":28,"tag":128,"props":2093,"children":2094},{"style":135},[2095],{"type":34,"value":578},{"type":28,"tag":128,"props":2097,"children":2098},{"class":130,"line":302},[2099],{"type":28,"tag":128,"props":2100,"children":2101},{"style":135},[2102],{"type":34,"value":1286},{"type":28,"tag":128,"props":2104,"children":2105},{"class":130,"line":335},[2106,2110,2114,2118,2122,2126],{"type":28,"tag":128,"props":2107,"children":2108},{"style":135},[2109],{"type":34,"value":1294},{"type":28,"tag":128,"props":2111,"children":2112},{"style":141},[2113],{"type":34,"value":802},{"type":28,"tag":128,"props":2115,"children":2116},{"style":597},[2117],{"type":34,"value":1303},{"type":28,"tag":128,"props":2119,"children":2120},{"style":358},[2121],{"type":34,"value":172},{"type":28,"tag":128,"props":2123,"children":2124},{"style":175},[2125],{"type":34,"value":1637},{"type":28,"tag":128,"props":2127,"children":2128},{"style":135},[2129],{"type":34,"value":148},{"type":28,"tag":128,"props":2131,"children":2132},{"class":130,"line":343},[2133,2137,2141,2145,2149,2153,2157,2161],{"type":28,"tag":128,"props":2134,"children":2135},{"style":135},[2136],{"type":34,"value":1323},{"type":28,"tag":128,"props":2138,"children":2139},{"style":141},[2140],{"type":34,"value":128},{"type":28,"tag":128,"props":2142,"children":2143},{"style":597},[2144],{"type":34,"value":1303},{"type":28,"tag":128,"props":2146,"children":2147},{"style":358},[2148],{"type":34,"value":172},{"type":28,"tag":128,"props":2150,"children":2151},{"style":175},[2152],{"type":34,"value":1665},{"type":28,"tag":128,"props":2154,"children":2155},{"style":135},[2156],{"type":34,"value":888},{"type":28,"tag":128,"props":2158,"children":2159},{"style":141},[2160],{"type":34,"value":128},{"type":28,"tag":128,"props":2162,"children":2163},{"style":135},[2164],{"type":34,"value":148},{"type":28,"tag":128,"props":2166,"children":2167},{"class":130,"line":385},[2168,2172],{"type":28,"tag":128,"props":2169,"children":2170},{"style":135},[2171],{"type":34,"value":1323},{"type":28,"tag":128,"props":2173,"children":2174},{"style":352},[2175],{"type":34,"value":591},{"type":28,"tag":128,"props":2177,"children":2178},{"class":130,"line":679},[2179,2183,2187,2191,2195],{"type":28,"tag":128,"props":2180,"children":2181},{"style":597},[2182],{"type":34,"value":1335},{"type":28,"tag":128,"props":2184,"children":2185},{"style":358},[2186],{"type":34,"value":172},{"type":28,"tag":128,"props":2188,"children":2189},{"style":266},[2190],{"type":34,"value":609},{"type":28,"tag":128,"props":2192,"children":2193},{"style":141},[2194],{"type":34,"value":529},{"type":28,"tag":128,"props":2196,"children":2197},{"style":266},[2198],{"type":34,"value":618},{"type":28,"tag":128,"props":2200,"children":2201},{"class":130,"line":719},[2202,2206,2210],{"type":28,"tag":128,"props":2203,"children":2204},{"style":597},[2205],{"type":34,"value":1359},{"type":28,"tag":128,"props":2207,"children":2208},{"style":358},[2209],{"type":34,"value":172},{"type":28,"tag":128,"props":2211,"children":2212},{"style":175},[2213],{"type":34,"value":635},{"type":28,"tag":128,"props":2215,"children":2216},{"class":130,"line":732},[2217,2221,2225,2229,2233,2237,2241,2245],{"type":28,"tag":128,"props":2218,"children":2219},{"style":597},[2220],{"type":34,"value":1375},{"type":28,"tag":128,"props":2222,"children":2223},{"style":358},[2224],{"type":34,"value":172},{"type":28,"tag":128,"props":2226,"children":2227},{"style":266},[2228],{"type":34,"value":609},{"type":28,"tag":128,"props":2230,"children":2231},{"style":135},[2232],{"type":34,"value":372},{"type":28,"tag":128,"props":2234,"children":2235},{"style":658},[2236],{"type":34,"value":661},{"type":28,"tag":128,"props":2238,"children":2239},{"style":135},[2240],{"type":34,"value":666},{"type":28,"tag":128,"props":2242,"children":2243},{"style":266},[2244],{"type":34,"value":671},{"type":28,"tag":128,"props":2246,"children":2247},{"style":135},[2248],{"type":34,"value":676},{"type":28,"tag":128,"props":2250,"children":2251},{"class":130,"line":741},[2252,2256,2260,2264,2268,2272,2276,2280],{"type":28,"tag":128,"props":2253,"children":2254},{"style":364},[2255],{"type":34,"value":1411},{"type":28,"tag":128,"props":2257,"children":2258},{"style":135},[2259],{"type":34,"value":372},{"type":28,"tag":128,"props":2261,"children":2262},{"style":352},[2263],{"type":34,"value":661},{"type":28,"tag":128,"props":2265,"children":2266},{"style":135},[2267],{"type":34,"value":698},{"type":28,"tag":128,"props":2269,"children":2270},{"style":352},[2271],{"type":34,"value":703},{"type":28,"tag":128,"props":2273,"children":2274},{"style":135},[2275],{"type":34,"value":698},{"type":28,"tag":128,"props":2277,"children":2278},{"style":141},[2279],{"type":34,"value":712},{"type":28,"tag":128,"props":2281,"children":2282},{"style":135},[2283],{"type":34,"value":382},{"type":28,"tag":128,"props":2285,"children":2286},{"class":130,"line":750},[2287,2291],{"type":28,"tag":128,"props":2288,"children":2289},{"style":135},[2290],{"type":34,"value":1447},{"type":28,"tag":128,"props":2292,"children":2293},{"style":266},[2294],{"type":34,"value":618},{"type":28,"tag":128,"props":2296,"children":2297},{"class":130,"line":1462},[2298],{"type":28,"tag":128,"props":2299,"children":2300},{"style":135},[2301],{"type":34,"value":1459},{"type":28,"tag":128,"props":2303,"children":2304},{"class":130,"line":1498},[2305,2309,2313],{"type":28,"tag":128,"props":2306,"children":2307},{"style":135},[2308],{"type":34,"value":1504},{"type":28,"tag":128,"props":2310,"children":2311},{"style":141},[2312],{"type":34,"value":802},{"type":28,"tag":128,"props":2314,"children":2315},{"style":135},[2316],{"type":34,"value":148},{"type":28,"tag":128,"props":2318,"children":2319},{"class":130,"line":1515},[2320,2324,2328,2332,2336,2340,2344,2348],{"type":28,"tag":128,"props":2321,"children":2322},{"style":135},[2323],{"type":34,"value":1294},{"type":28,"tag":128,"props":2325,"children":2326},{"style":141},[2327],{"type":34,"value":128},{"type":28,"tag":128,"props":2329,"children":2330},{"style":597},[2331],{"type":34,"value":1303},{"type":28,"tag":128,"props":2333,"children":2334},{"style":358},[2335],{"type":34,"value":172},{"type":28,"tag":128,"props":2337,"children":2338},{"style":175},[2339],{"type":34,"value":1755},{"type":28,"tag":128,"props":2341,"children":2342},{"style":135},[2343],{"type":34,"value":941},{"type":28,"tag":128,"props":2345,"children":2346},{"style":141},[2347],{"type":34,"value":128},{"type":28,"tag":128,"props":2349,"children":2350},{"style":135},[2351],{"type":34,"value":148},{"type":28,"tag":128,"props":2353,"children":2354},{"class":130,"line":1551},[2355],{"type":28,"tag":128,"props":2356,"children":2357},{"style":135},[2358],{"type":34,"value":1557},{"type":28,"tag":128,"props":2360,"children":2361},{"class":130,"line":1560},[2362],{"type":28,"tag":128,"props":2363,"children":2364},{"style":135},[2365],{"type":34,"value":747},{"type":28,"tag":128,"props":2367,"children":2368},{"class":130,"line":1568},[2369],{"type":28,"tag":128,"props":2370,"children":2371},{"style":135},[2372],{"type":34,"value":618},{"type":28,"tag":91,"props":2374,"children":2376},{"id":2375},"accessibility-notes",[2377],{"type":34,"value":2378},"Accessibility notes",{"type":28,"tag":47,"props":2380,"children":2381},{},[2382,2387,2389,2394],{"type":28,"tag":51,"props":2383,"children":2385},{"className":2384},[],[2386],{"type":34,"value":56},{"type":34,"value":2388}," is built using the native ",{"type":28,"tag":51,"props":2390,"children":2392},{"className":2391},[],[2393],{"type":34,"value":69},{"type":34,"value":2395}," element. This means that has all of the same keyboard navigation and accessibility features as a native checkbox.",{"type":28,"tag":47,"props":2397,"children":2398},{},[2399,2401,2407],{"type":34,"value":2400},"By default, it comes with a ",{"type":28,"tag":51,"props":2402,"children":2404},{"className":2403},[],[2405],{"type":34,"value":2406},"role=\"switch\"",{"type":34,"value":2408}," attribute. This is useful for screen readers, which can announce the element as a switch.",{"type":28,"tag":91,"props":2410,"children":2412},{"id":2411},"playground",[2413],{"type":34,"value":2414},"Playground",{"type":28,"tag":2416,"props":2417,"children":2419},"generate",{"style":2418},"height: 380px",[],{"type":28,"tag":43,"props":2421,"children":2422},{"v-slot:tab-2":7},[2423,2429,2532,2641],{"type":28,"tag":91,"props":2424,"children":2426},{"id":2425},"props",[2427],{"type":34,"value":2428},"Props",{"type":28,"tag":114,"props":2430,"children":2431},{},[2432],{"type":28,"tag":2433,"props":2434,"children":2435},"table",{},[2436,2465],{"type":28,"tag":2437,"props":2438,"children":2439},"thead",{},[2440],{"type":28,"tag":2441,"props":2442,"children":2443},"tr",{},[2444,2450,2455,2460],{"type":28,"tag":2445,"props":2446,"children":2447},"th",{},[2448],{"type":34,"value":2449},"Prop name",{"type":28,"tag":2445,"props":2451,"children":2452},{},[2453],{"type":34,"value":2454},"Type",{"type":28,"tag":2445,"props":2456,"children":2457},{},[2458],{"type":34,"value":2459},"Default value",{"type":28,"tag":2445,"props":2461,"children":2462},{},[2463],{"type":34,"value":2464},"Possible values",{"type":28,"tag":2466,"props":2467,"children":2468},"tbody",{},[2469,2506],{"type":28,"tag":2441,"props":2470,"children":2471},{},[2472,2482,2487,2497],{"type":28,"tag":2473,"props":2474,"children":2475},"td",{},[2476],{"type":28,"tag":51,"props":2477,"children":2479},{"className":2478},[],[2480],{"type":34,"value":2481},"modelValue",{"type":28,"tag":2473,"props":2483,"children":2484},{},[2485],{"type":34,"value":2486},"`boolean",{"type":28,"tag":2473,"props":2488,"children":2489},{},[2490,2492,2495],{"type":34,"value":2491},"string",{"type":28,"tag":128,"props":2493,"children":2494},{},[],{"type":34,"value":2496},"`",{"type":28,"tag":2473,"props":2498,"children":2499},{},[2500],{"type":28,"tag":51,"props":2501,"children":2503},{"className":2502},[],[2504],{"type":34,"value":2505},"undefined",{"type":28,"tag":2441,"props":2507,"children":2508},{},[2509,2518,2526,2529],{"type":28,"tag":2473,"props":2510,"children":2511},{},[2512],{"type":28,"tag":51,"props":2513,"children":2515},{"className":2514},[],[2516],{"type":34,"value":2517},"value",{"type":28,"tag":2473,"props":2519,"children":2520},{},[2521],{"type":28,"tag":51,"props":2522,"children":2524},{"className":2523},[],[2525],{"type":34,"value":2491},{"type":28,"tag":2473,"props":2527,"children":2528},{},[],{"type":28,"tag":2473,"props":2530,"children":2531},{},[],{"type":28,"tag":400,"props":2533,"children":2534},{},[2535],{"type":28,"tag":2433,"props":2536,"children":2537},{},[2538,2560],{"type":28,"tag":2437,"props":2539,"children":2540},{},[2541],{"type":28,"tag":2441,"props":2542,"children":2543},{},[2544,2548,2552,2556],{"type":28,"tag":2445,"props":2545,"children":2546},{},[2547],{"type":34,"value":2449},{"type":28,"tag":2445,"props":2549,"children":2550},{},[2551],{"type":34,"value":2454},{"type":28,"tag":2445,"props":2553,"children":2554},{},[2555],{"type":34,"value":2459},{"type":28,"tag":2445,"props":2557,"children":2558},{},[2559],{"type":34,"value":2464},{"type":28,"tag":2466,"props":2561,"children":2562},{},[2563,2588,2615],{"type":28,"tag":2441,"props":2564,"children":2565},{},[2566,2574,2582,2585],{"type":28,"tag":2473,"props":2567,"children":2568},{},[2569],{"type":28,"tag":51,"props":2570,"children":2572},{"className":2571},[],[2573],{"type":34,"value":2517},{"type":28,"tag":2473,"props":2575,"children":2576},{},[2577],{"type":28,"tag":51,"props":2578,"children":2580},{"className":2579},[],[2581],{"type":34,"value":2491},{"type":28,"tag":2473,"props":2583,"children":2584},{},[],{"type":28,"tag":2473,"props":2586,"children":2587},{},[],{"type":28,"tag":2441,"props":2589,"children":2590},{},[2591,2600,2609,2612],{"type":28,"tag":2473,"props":2592,"children":2593},{},[2594],{"type":28,"tag":51,"props":2595,"children":2597},{"className":2596},[],[2598],{"type":34,"value":2599},"onChange",{"type":28,"tag":2473,"props":2601,"children":2602},{},[2603],{"type":28,"tag":51,"props":2604,"children":2606},{"className":2605},[],[2607],{"type":34,"value":2608},"Function",{"type":28,"tag":2473,"props":2610,"children":2611},{},[],{"type":28,"tag":2473,"props":2613,"children":2614},{},[],{"type":28,"tag":2441,"props":2616,"children":2617},{},[2618,2627,2635,2638],{"type":28,"tag":2473,"props":2619,"children":2620},{},[2621],{"type":28,"tag":51,"props":2622,"children":2624},{"className":2623},[],[2625],{"type":34,"value":2626},"className",{"type":28,"tag":2473,"props":2628,"children":2629},{},[2630],{"type":28,"tag":51,"props":2631,"children":2633},{"className":2632},[],[2634],{"type":34,"value":2491},{"type":28,"tag":2473,"props":2636,"children":2637},{},[],{"type":28,"tag":2473,"props":2639,"children":2640},{},[],{"type":28,"tag":114,"props":2642,"children":2643},{},[2644,2650],{"type":28,"tag":91,"props":2645,"children":2647},{"id":2646},"events",[2648],{"type":34,"value":2649},"Events",{"type":28,"tag":2433,"props":2651,"children":2652},{},[2653,2669],{"type":28,"tag":2437,"props":2654,"children":2655},{},[2656],{"type":28,"tag":2441,"props":2657,"children":2658},{},[2659,2664],{"type":28,"tag":2445,"props":2660,"children":2661},{},[2662],{"type":34,"value":2663},"Event name",{"type":28,"tag":2445,"props":2665,"children":2666},{},[2667],{"type":34,"value":2668},"Trigger",{"type":28,"tag":2466,"props":2670,"children":2671},{},[2672],{"type":28,"tag":2441,"props":2673,"children":2674},{},[2675,2684],{"type":28,"tag":2473,"props":2676,"children":2677},{},[2678],{"type":28,"tag":51,"props":2679,"children":2681},{"className":2680},[],[2682],{"type":34,"value":2683},"update:modelValue",{"type":28,"tag":2473,"props":2685,"children":2686},{},[2687],{"type":34,"value":2688},"triggers v-model update event",{"type":28,"tag":43,"props":2690,"children":2691},{"v-slot:tab-3":7},[2692,2697,3829],{"type":28,"tag":2693,"props":2694,"children":2696},"partial",{"content":2695},"block-callout",[],{"type":28,"tag":114,"props":2698,"children":2699},{},[2700],{"type":28,"tag":118,"props":2701,"children":2703},{"className":120,"code":2702,"language":122,"meta":7,"style":7},"\u003Cscript lang=\"ts\" setup>\nimport { type InputHTMLAttributes, type PropType, toRefs, computed, ref } from 'vue';\nimport { twMerge, useTwMergeRoot } from '@storefront-ui\u002Fvue';\n\nconst props = defineProps({\n  modelValue: {\n    type: [String, Array, Boolean] as PropType\u003CInputHTMLAttributes['checked']>,\n    default: false,\n  },\n  value: {\n    type: String,\n    default: '',\n  },\n  invalid: {\n    type: Boolean,\n    default: false,\n  },\n});\n\ndefineOptions({\n  inheritAttrs: false,\n});\nconst { attrsWithoutClass } = useTwMergeRoot();\n\nconst { modelValue } = toRefs(props);\nconst emit = defineEmits\u003C{\n  (event: 'update:modelValue', param: InputHTMLAttributes['checked']): void;\n}>();\n\nconst switchRef = ref();\nconst proxyChecked = computed({\n  get: () => modelValue?.value,\n  set: (value) => emit('update:modelValue', value),\n});\n\u003C\u002Fscript>\n\n\u003C!-- switchRef?.checked is used instead of model because model is value collection of multiple inputs, we need to have this one input check value -->\n\u003Ctemplate>\n  \u003Cinput\n    ref=\"switchRef\"\n    :class=\"\n      twMerge(\n        `appearance-none h-5 min-w-[36px] bg-transparent border-2 border-gray-500 rounded-full relative ease-in-out duration-300 hover:border-primary-800 hover:checked:before:bg-white checked:before:left-1\u002F2 checked:before:ml-0 checked:before:mr-0.5 disabled:before:bg-gray-500\u002F50 hover:before:bg-primary-800 active:border-primary-800 active:before:bg-primary-800 checked:bg-none checked:bg-primary-700 checked:border-primary-700 checked:before:bg-white hover:checked:bg-primary-800 hover:checked:border-primary-800 disabled:border-gray-500\u002F50 checked:disabled:before:bg-white checked:disabled:bg-gray-500\u002F50 checked:disabled:border-0 before:transition-all  before:w-3.5 before:h-3.5 before:bg-gray-500 before:absolute before:top-0 before:bottom-0 before:my-auto before:rounded-full before:left-0 before:ml-0.5 before:ease-in-out before:duration-300 cursor-pointer disabled:cursor-not-allowed focus-visible:outline focus-visible:outline-offset`,\n        {\n          'border-negative-700 hover:border-negative-800 active:border-negative-900 before:bg-negative-900': invalid,\n        },\n        $attrs.class,\n      )\n    \"\n    :value=\"value\"\n    type=\"checkbox\"\n    role=\"switch\"\n    data-testid=\"switch\"\n    :aria-checked=\"switchRef?.checked\"\n    v-model=\"proxyChecked\"\n    v-bind=\"attrsWithoutClass\"\n  \u002F>\n\u003C\u002Ftemplate>\n\n",[2704],{"type":28,"tag":51,"props":2705,"children":2706},{"__ignoreMap":7},[2707,2738,2814,2855,2862,2888,2901,2974,2996,3004,3016,3035,3055,3062,3074,3093,3112,3119,3127,3134,3146,3166,3174,3209,3217,3258,3285,3346,3355,3363,3388,3414,3450,3501,3509,3525,3533,3543,3559,3572,3590,3608,3617,3626,3635,3644,3653,3662,3671,3680,3698,3715,3733,3750,3768,3786,3804,3813],{"type":28,"tag":128,"props":2708,"children":2709},{"class":130,"line":131},[2710,2714,2718,2722,2726,2730,2734],{"type":28,"tag":128,"props":2711,"children":2712},{"style":135},[2713],{"type":34,"value":138},{"type":28,"tag":128,"props":2715,"children":2716},{"style":141},[2717],{"type":34,"value":236},{"type":28,"tag":128,"props":2719,"children":2720},{"style":164},[2721],{"type":34,"value":241},{"type":28,"tag":128,"props":2723,"children":2724},{"style":135},[2725],{"type":34,"value":172},{"type":28,"tag":128,"props":2727,"children":2728},{"style":175},[2729],{"type":34,"value":250},{"type":28,"tag":128,"props":2731,"children":2732},{"style":164},[2733],{"type":34,"value":255},{"type":28,"tag":128,"props":2735,"children":2736},{"style":135},[2737],{"type":34,"value":148},{"type":28,"tag":128,"props":2739,"children":2740},{"class":130,"line":151},[2741,2745,2749,2754,2759,2763,2767,2772,2776,2781,2785,2790,2794,2798,2802,2806,2810],{"type":28,"tag":128,"props":2742,"children":2743},{"style":266},[2744],{"type":34,"value":269},{"type":28,"tag":128,"props":2746,"children":2747},{"style":135},[2748],{"type":34,"value":274},{"type":28,"tag":128,"props":2750,"children":2751},{"style":266},[2752],{"type":34,"value":2753},"type",{"type":28,"tag":128,"props":2755,"children":2756},{"style":141},[2757],{"type":34,"value":2758}," InputHTMLAttributes",{"type":28,"tag":128,"props":2760,"children":2761},{"style":135},[2762],{"type":34,"value":534},{"type":28,"tag":128,"props":2764,"children":2765},{"style":266},[2766],{"type":34,"value":2753},{"type":28,"tag":128,"props":2768,"children":2769},{"style":141},[2770],{"type":34,"value":2771}," PropType",{"type":28,"tag":128,"props":2773,"children":2774},{"style":135},[2775],{"type":34,"value":534},{"type":28,"tag":128,"props":2777,"children":2778},{"style":141},[2779],{"type":34,"value":2780},"toRefs",{"type":28,"tag":128,"props":2782,"children":2783},{"style":135},[2784],{"type":34,"value":534},{"type":28,"tag":128,"props":2786,"children":2787},{"style":141},[2788],{"type":34,"value":2789},"computed",{"type":28,"tag":128,"props":2791,"children":2792},{"style":135},[2793],{"type":34,"value":534},{"type":28,"tag":128,"props":2795,"children":2796},{"style":141},[2797],{"type":34,"value":279},{"type":28,"tag":128,"props":2799,"children":2800},{"style":135},[2801],{"type":34,"value":284},{"type":28,"tag":128,"props":2803,"children":2804},{"style":266},[2805],{"type":34,"value":289},{"type":28,"tag":128,"props":2807,"children":2808},{"style":175},[2809],{"type":34,"value":294},{"type":28,"tag":128,"props":2811,"children":2812},{"style":135},[2813],{"type":34,"value":299},{"type":28,"tag":128,"props":2815,"children":2816},{"class":130,"line":200},[2817,2821,2825,2830,2834,2839,2843,2847,2851],{"type":28,"tag":128,"props":2818,"children":2819},{"style":266},[2820],{"type":34,"value":269},{"type":28,"tag":128,"props":2822,"children":2823},{"style":135},[2824],{"type":34,"value":274},{"type":28,"tag":128,"props":2826,"children":2827},{"style":141},[2828],{"type":34,"value":2829},"twMerge",{"type":28,"tag":128,"props":2831,"children":2832},{"style":135},[2833],{"type":34,"value":534},{"type":28,"tag":128,"props":2835,"children":2836},{"style":141},[2837],{"type":34,"value":2838},"useTwMergeRoot",{"type":28,"tag":128,"props":2840,"children":2841},{"style":135},[2842],{"type":34,"value":284},{"type":28,"tag":128,"props":2844,"children":2845},{"style":266},[2846],{"type":34,"value":289},{"type":28,"tag":128,"props":2848,"children":2849},{"style":175},[2850],{"type":34,"value":328},{"type":28,"tag":128,"props":2852,"children":2853},{"style":135},[2854],{"type":34,"value":299},{"type":28,"tag":128,"props":2856,"children":2857},{"class":130,"line":217},[2858],{"type":28,"tag":128,"props":2859,"children":2860},{"emptyLinePlaceholder":9},[2861],{"type":34,"value":223},{"type":28,"tag":128,"props":2863,"children":2864},{"class":130,"line":226},[2865,2869,2874,2878,2883],{"type":28,"tag":128,"props":2866,"children":2867},{"style":266},[2868],{"type":34,"value":349},{"type":28,"tag":128,"props":2870,"children":2871},{"style":352},[2872],{"type":34,"value":2873}," props",{"type":28,"tag":128,"props":2875,"children":2876},{"style":358},[2877],{"type":34,"value":361},{"type":28,"tag":128,"props":2879,"children":2880},{"style":364},[2881],{"type":34,"value":2882}," defineProps",{"type":28,"tag":128,"props":2884,"children":2885},{"style":135},[2886],{"type":34,"value":2887},"({\n",{"type":28,"tag":128,"props":2889,"children":2890},{"class":130,"line":262},[2891,2896],{"type":28,"tag":128,"props":2892,"children":2893},{"style":141},[2894],{"type":34,"value":2895},"  modelValue",{"type":28,"tag":128,"props":2897,"children":2898},{"style":135},[2899],{"type":34,"value":2900},": {\n",{"type":28,"tag":128,"props":2902,"children":2903},{"class":130,"line":302},[2904,2909,2914,2919,2923,2928,2932,2937,2941,2946,2950,2954,2959,2964,2969],{"type":28,"tag":128,"props":2905,"children":2906},{"style":141},[2907],{"type":34,"value":2908},"    type",{"type":28,"tag":128,"props":2910,"children":2911},{"style":135},[2912],{"type":34,"value":2913},": [",{"type":28,"tag":128,"props":2915,"children":2916},{"style":141},[2917],{"type":34,"value":2918},"String",{"type":28,"tag":128,"props":2920,"children":2921},{"style":135},[2922],{"type":34,"value":534},{"type":28,"tag":128,"props":2924,"children":2925},{"style":141},[2926],{"type":34,"value":2927},"Array",{"type":28,"tag":128,"props":2929,"children":2930},{"style":135},[2931],{"type":34,"value":534},{"type":28,"tag":128,"props":2933,"children":2934},{"style":141},[2935],{"type":34,"value":2936},"Boolean",{"type":28,"tag":128,"props":2938,"children":2939},{"style":135},[2940],{"type":34,"value":544},{"type":28,"tag":128,"props":2942,"children":2943},{"style":266},[2944],{"type":34,"value":2945},"as",{"type":28,"tag":128,"props":2947,"children":2948},{"style":352},[2949],{"type":34,"value":2771},{"type":28,"tag":128,"props":2951,"children":2952},{"style":135},[2953],{"type":34,"value":138},{"type":28,"tag":128,"props":2955,"children":2956},{"style":352},[2957],{"type":34,"value":2958},"InputHTMLAttributes",{"type":28,"tag":128,"props":2960,"children":2961},{"style":135},[2962],{"type":34,"value":2963},"[",{"type":28,"tag":128,"props":2965,"children":2966},{"style":175},[2967],{"type":34,"value":2968},"'checked'",{"type":28,"tag":128,"props":2970,"children":2971},{"style":135},[2972],{"type":34,"value":2973},"]>,\n",{"type":28,"tag":128,"props":2975,"children":2976},{"class":130,"line":335},[2977,2982,2987,2991],{"type":28,"tag":128,"props":2978,"children":2979},{"style":141},[2980],{"type":34,"value":2981},"    default",{"type":28,"tag":128,"props":2983,"children":2984},{"style":135},[2985],{"type":34,"value":2986},": ",{"type":28,"tag":128,"props":2988,"children":2989},{"style":164},[2990],{"type":34,"value":377},{"type":28,"tag":128,"props":2992,"children":2993},{"style":135},[2994],{"type":34,"value":2995},",\n",{"type":28,"tag":128,"props":2997,"children":2998},{"class":130,"line":343},[2999],{"type":28,"tag":128,"props":3000,"children":3001},{"style":135},[3002],{"type":34,"value":3003},"  },\n",{"type":28,"tag":128,"props":3005,"children":3006},{"class":130,"line":385},[3007,3012],{"type":28,"tag":128,"props":3008,"children":3009},{"style":141},[3010],{"type":34,"value":3011},"  value",{"type":28,"tag":128,"props":3013,"children":3014},{"style":135},[3015],{"type":34,"value":2900},{"type":28,"tag":128,"props":3017,"children":3018},{"class":130,"line":679},[3019,3023,3027,3031],{"type":28,"tag":128,"props":3020,"children":3021},{"style":141},[3022],{"type":34,"value":2908},{"type":28,"tag":128,"props":3024,"children":3025},{"style":135},[3026],{"type":34,"value":2986},{"type":28,"tag":128,"props":3028,"children":3029},{"style":141},[3030],{"type":34,"value":2918},{"type":28,"tag":128,"props":3032,"children":3033},{"style":135},[3034],{"type":34,"value":2995},{"type":28,"tag":128,"props":3036,"children":3037},{"class":130,"line":719},[3038,3042,3046,3051],{"type":28,"tag":128,"props":3039,"children":3040},{"style":141},[3041],{"type":34,"value":2981},{"type":28,"tag":128,"props":3043,"children":3044},{"style":135},[3045],{"type":34,"value":2986},{"type":28,"tag":128,"props":3047,"children":3048},{"style":175},[3049],{"type":34,"value":3050},"''",{"type":28,"tag":128,"props":3052,"children":3053},{"style":135},[3054],{"type":34,"value":2995},{"type":28,"tag":128,"props":3056,"children":3057},{"class":130,"line":732},[3058],{"type":28,"tag":128,"props":3059,"children":3060},{"style":135},[3061],{"type":34,"value":3003},{"type":28,"tag":128,"props":3063,"children":3064},{"class":130,"line":741},[3065,3070],{"type":28,"tag":128,"props":3066,"children":3067},{"style":141},[3068],{"type":34,"value":3069},"  invalid",{"type":28,"tag":128,"props":3071,"children":3072},{"style":135},[3073],{"type":34,"value":2900},{"type":28,"tag":128,"props":3075,"children":3076},{"class":130,"line":750},[3077,3081,3085,3089],{"type":28,"tag":128,"props":3078,"children":3079},{"style":141},[3080],{"type":34,"value":2908},{"type":28,"tag":128,"props":3082,"children":3083},{"style":135},[3084],{"type":34,"value":2986},{"type":28,"tag":128,"props":3086,"children":3087},{"style":141},[3088],{"type":34,"value":2936},{"type":28,"tag":128,"props":3090,"children":3091},{"style":135},[3092],{"type":34,"value":2995},{"type":28,"tag":128,"props":3094,"children":3095},{"class":130,"line":1462},[3096,3100,3104,3108],{"type":28,"tag":128,"props":3097,"children":3098},{"style":141},[3099],{"type":34,"value":2981},{"type":28,"tag":128,"props":3101,"children":3102},{"style":135},[3103],{"type":34,"value":2986},{"type":28,"tag":128,"props":3105,"children":3106},{"style":164},[3107],{"type":34,"value":377},{"type":28,"tag":128,"props":3109,"children":3110},{"style":135},[3111],{"type":34,"value":2995},{"type":28,"tag":128,"props":3113,"children":3114},{"class":130,"line":1498},[3115],{"type":28,"tag":128,"props":3116,"children":3117},{"style":135},[3118],{"type":34,"value":3003},{"type":28,"tag":128,"props":3120,"children":3121},{"class":130,"line":1515},[3122],{"type":28,"tag":128,"props":3123,"children":3124},{"style":135},[3125],{"type":34,"value":3126},"});\n",{"type":28,"tag":128,"props":3128,"children":3129},{"class":130,"line":1551},[3130],{"type":28,"tag":128,"props":3131,"children":3132},{"emptyLinePlaceholder":9},[3133],{"type":34,"value":223},{"type":28,"tag":128,"props":3135,"children":3136},{"class":130,"line":1560},[3137,3142],{"type":28,"tag":128,"props":3138,"children":3139},{"style":364},[3140],{"type":34,"value":3141},"defineOptions",{"type":28,"tag":128,"props":3143,"children":3144},{"style":135},[3145],{"type":34,"value":2887},{"type":28,"tag":128,"props":3147,"children":3148},{"class":130,"line":1568},[3149,3154,3158,3162],{"type":28,"tag":128,"props":3150,"children":3151},{"style":141},[3152],{"type":34,"value":3153},"  inheritAttrs",{"type":28,"tag":128,"props":3155,"children":3156},{"style":135},[3157],{"type":34,"value":2986},{"type":28,"tag":128,"props":3159,"children":3160},{"style":164},[3161],{"type":34,"value":377},{"type":28,"tag":128,"props":3163,"children":3164},{"style":135},[3165],{"type":34,"value":2995},{"type":28,"tag":128,"props":3167,"children":3169},{"class":130,"line":3168},22,[3170],{"type":28,"tag":128,"props":3171,"children":3172},{"style":135},[3173],{"type":34,"value":3126},{"type":28,"tag":128,"props":3175,"children":3177},{"class":130,"line":3176},23,[3178,3182,3186,3191,3195,3199,3204],{"type":28,"tag":128,"props":3179,"children":3180},{"style":266},[3181],{"type":34,"value":349},{"type":28,"tag":128,"props":3183,"children":3184},{"style":135},[3185],{"type":34,"value":274},{"type":28,"tag":128,"props":3187,"children":3188},{"style":352},[3189],{"type":34,"value":3190},"attrsWithoutClass",{"type":28,"tag":128,"props":3192,"children":3193},{"style":135},[3194],{"type":34,"value":284},{"type":28,"tag":128,"props":3196,"children":3197},{"style":358},[3198],{"type":34,"value":172},{"type":28,"tag":128,"props":3200,"children":3201},{"style":364},[3202],{"type":34,"value":3203}," useTwMergeRoot",{"type":28,"tag":128,"props":3205,"children":3206},{"style":135},[3207],{"type":34,"value":3208},"();\n",{"type":28,"tag":128,"props":3210,"children":3212},{"class":130,"line":3211},24,[3213],{"type":28,"tag":128,"props":3214,"children":3215},{"emptyLinePlaceholder":9},[3216],{"type":34,"value":223},{"type":28,"tag":128,"props":3218,"children":3220},{"class":130,"line":3219},25,[3221,3225,3229,3233,3237,3241,3246,3250,3254],{"type":28,"tag":128,"props":3222,"children":3223},{"style":266},[3224],{"type":34,"value":349},{"type":28,"tag":128,"props":3226,"children":3227},{"style":135},[3228],{"type":34,"value":274},{"type":28,"tag":128,"props":3230,"children":3231},{"style":352},[3232],{"type":34,"value":2481},{"type":28,"tag":128,"props":3234,"children":3235},{"style":135},[3236],{"type":34,"value":284},{"type":28,"tag":128,"props":3238,"children":3239},{"style":358},[3240],{"type":34,"value":172},{"type":28,"tag":128,"props":3242,"children":3243},{"style":364},[3244],{"type":34,"value":3245}," toRefs",{"type":28,"tag":128,"props":3247,"children":3248},{"style":135},[3249],{"type":34,"value":372},{"type":28,"tag":128,"props":3251,"children":3252},{"style":141},[3253],{"type":34,"value":2425},{"type":28,"tag":128,"props":3255,"children":3256},{"style":135},[3257],{"type":34,"value":382},{"type":28,"tag":128,"props":3259,"children":3261},{"class":130,"line":3260},26,[3262,3266,3271,3275,3280],{"type":28,"tag":128,"props":3263,"children":3264},{"style":266},[3265],{"type":34,"value":349},{"type":28,"tag":128,"props":3267,"children":3268},{"style":352},[3269],{"type":34,"value":3270}," emit",{"type":28,"tag":128,"props":3272,"children":3273},{"style":358},[3274],{"type":34,"value":361},{"type":28,"tag":128,"props":3276,"children":3277},{"style":364},[3278],{"type":34,"value":3279}," defineEmits",{"type":28,"tag":128,"props":3281,"children":3282},{"style":135},[3283],{"type":34,"value":3284},"\u003C{\n",{"type":28,"tag":128,"props":3286,"children":3288},{"class":130,"line":3287},27,[3289,3294,3298,3302,3307,3311,3316,3320,3324,3328,3332,3337,3342],{"type":28,"tag":128,"props":3290,"children":3291},{"style":135},[3292],{"type":34,"value":3293},"  (",{"type":28,"tag":128,"props":3295,"children":3296},{"style":658},[3297],{"type":34,"value":661},{"type":28,"tag":128,"props":3299,"children":3300},{"style":135},[3301],{"type":34,"value":2986},{"type":28,"tag":128,"props":3303,"children":3304},{"style":175},[3305],{"type":34,"value":3306},"'update:modelValue'",{"type":28,"tag":128,"props":3308,"children":3309},{"style":135},[3310],{"type":34,"value":534},{"type":28,"tag":128,"props":3312,"children":3313},{"style":658},[3314],{"type":34,"value":3315},"param",{"type":28,"tag":128,"props":3317,"children":3318},{"style":135},[3319],{"type":34,"value":2986},{"type":28,"tag":128,"props":3321,"children":3322},{"style":352},[3323],{"type":34,"value":2958},{"type":28,"tag":128,"props":3325,"children":3326},{"style":135},[3327],{"type":34,"value":2963},{"type":28,"tag":128,"props":3329,"children":3330},{"style":175},[3331],{"type":34,"value":2968},{"type":28,"tag":128,"props":3333,"children":3334},{"style":135},[3335],{"type":34,"value":3336},"]): ",{"type":28,"tag":128,"props":3338,"children":3339},{"style":352},[3340],{"type":34,"value":3341},"void",{"type":28,"tag":128,"props":3343,"children":3344},{"style":135},[3345],{"type":34,"value":299},{"type":28,"tag":128,"props":3347,"children":3349},{"class":130,"line":3348},28,[3350],{"type":28,"tag":128,"props":3351,"children":3352},{"style":135},[3353],{"type":34,"value":3354},"}>();\n",{"type":28,"tag":128,"props":3356,"children":3358},{"class":130,"line":3357},29,[3359],{"type":28,"tag":128,"props":3360,"children":3361},{"emptyLinePlaceholder":9},[3362],{"type":34,"value":223},{"type":28,"tag":128,"props":3364,"children":3366},{"class":130,"line":3365},30,[3367,3371,3376,3380,3384],{"type":28,"tag":128,"props":3368,"children":3369},{"style":266},[3370],{"type":34,"value":349},{"type":28,"tag":128,"props":3372,"children":3373},{"style":352},[3374],{"type":34,"value":3375}," switchRef",{"type":28,"tag":128,"props":3377,"children":3378},{"style":358},[3379],{"type":34,"value":361},{"type":28,"tag":128,"props":3381,"children":3382},{"style":364},[3383],{"type":34,"value":367},{"type":28,"tag":128,"props":3385,"children":3386},{"style":135},[3387],{"type":34,"value":3208},{"type":28,"tag":128,"props":3389,"children":3391},{"class":130,"line":3390},31,[3392,3396,3401,3405,3410],{"type":28,"tag":128,"props":3393,"children":3394},{"style":266},[3395],{"type":34,"value":349},{"type":28,"tag":128,"props":3397,"children":3398},{"style":352},[3399],{"type":34,"value":3400}," proxyChecked",{"type":28,"tag":128,"props":3402,"children":3403},{"style":358},[3404],{"type":34,"value":361},{"type":28,"tag":128,"props":3406,"children":3407},{"style":364},[3408],{"type":34,"value":3409}," computed",{"type":28,"tag":128,"props":3411,"children":3412},{"style":135},[3413],{"type":34,"value":2887},{"type":28,"tag":128,"props":3415,"children":3417},{"class":130,"line":3416},32,[3418,3423,3428,3432,3437,3442,3446],{"type":28,"tag":128,"props":3419,"children":3420},{"style":364},[3421],{"type":34,"value":3422},"  get",{"type":28,"tag":128,"props":3424,"children":3425},{"style":135},[3426],{"type":34,"value":3427},": () ",{"type":28,"tag":128,"props":3429,"children":3430},{"style":266},[3431],{"type":34,"value":671},{"type":28,"tag":128,"props":3433,"children":3434},{"style":352},[3435],{"type":34,"value":3436}," modelValue",{"type":28,"tag":128,"props":3438,"children":3439},{"style":135},[3440],{"type":34,"value":3441},"?.",{"type":28,"tag":128,"props":3443,"children":3444},{"style":141},[3445],{"type":34,"value":2517},{"type":28,"tag":128,"props":3447,"children":3448},{"style":135},[3449],{"type":34,"value":2995},{"type":28,"tag":128,"props":3451,"children":3453},{"class":130,"line":3452},33,[3454,3459,3464,3468,3472,3476,3480,3484,3488,3492,3496],{"type":28,"tag":128,"props":3455,"children":3456},{"style":364},[3457],{"type":34,"value":3458},"  set",{"type":28,"tag":128,"props":3460,"children":3461},{"style":135},[3462],{"type":34,"value":3463},": (",{"type":28,"tag":128,"props":3465,"children":3466},{"style":658},[3467],{"type":34,"value":2517},{"type":28,"tag":128,"props":3469,"children":3470},{"style":135},[3471],{"type":34,"value":666},{"type":28,"tag":128,"props":3473,"children":3474},{"style":266},[3475],{"type":34,"value":671},{"type":28,"tag":128,"props":3477,"children":3478},{"style":364},[3479],{"type":34,"value":3270},{"type":28,"tag":128,"props":3481,"children":3482},{"style":135},[3483],{"type":34,"value":372},{"type":28,"tag":128,"props":3485,"children":3486},{"style":175},[3487],{"type":34,"value":3306},{"type":28,"tag":128,"props":3489,"children":3490},{"style":135},[3491],{"type":34,"value":534},{"type":28,"tag":128,"props":3493,"children":3494},{"style":141},[3495],{"type":34,"value":2517},{"type":28,"tag":128,"props":3497,"children":3498},{"style":135},[3499],{"type":34,"value":3500},"),\n",{"type":28,"tag":128,"props":3502,"children":3504},{"class":130,"line":3503},34,[3505],{"type":28,"tag":128,"props":3506,"children":3507},{"style":135},[3508],{"type":34,"value":3126},{"type":28,"tag":128,"props":3510,"children":3512},{"class":130,"line":3511},35,[3513,3517,3521],{"type":28,"tag":128,"props":3514,"children":3515},{"style":135},[3516],{"type":34,"value":206},{"type":28,"tag":128,"props":3518,"children":3519},{"style":141},[3520],{"type":34,"value":236},{"type":28,"tag":128,"props":3522,"children":3523},{"style":135},[3524],{"type":34,"value":148},{"type":28,"tag":128,"props":3526,"children":3528},{"class":130,"line":3527},36,[3529],{"type":28,"tag":128,"props":3530,"children":3531},{"emptyLinePlaceholder":9},[3532],{"type":34,"value":223},{"type":28,"tag":128,"props":3534,"children":3536},{"class":130,"line":3535},37,[3537],{"type":28,"tag":128,"props":3538,"children":3540},{"style":3539},"--shiki-default:#7F848E;--shiki-default-font-style:italic",[3541],{"type":34,"value":3542},"\u003C!-- switchRef?.checked is used instead of model because model is value collection of multiple inputs, we need to have this one input check value -->\n",{"type":28,"tag":128,"props":3544,"children":3546},{"class":130,"line":3545},38,[3547,3551,3555],{"type":28,"tag":128,"props":3548,"children":3549},{"style":135},[3550],{"type":34,"value":138},{"type":28,"tag":128,"props":3552,"children":3553},{"style":141},[3554],{"type":34,"value":43},{"type":28,"tag":128,"props":3556,"children":3557},{"style":135},[3558],{"type":34,"value":148},{"type":28,"tag":128,"props":3560,"children":3562},{"class":130,"line":3561},39,[3563,3567],{"type":28,"tag":128,"props":3564,"children":3565},{"style":135},[3566],{"type":34,"value":157},{"type":28,"tag":128,"props":3568,"children":3569},{"style":141},[3570],{"type":34,"value":3571},"input\n",{"type":28,"tag":128,"props":3573,"children":3575},{"class":130,"line":3574},40,[3576,3581,3585],{"type":28,"tag":128,"props":3577,"children":3578},{"style":164},[3579],{"type":34,"value":3580},"    ref",{"type":28,"tag":128,"props":3582,"children":3583},{"style":135},[3584],{"type":34,"value":172},{"type":28,"tag":128,"props":3586,"children":3587},{"style":175},[3588],{"type":34,"value":3589},"\"switchRef\"\n",{"type":28,"tag":128,"props":3591,"children":3593},{"class":130,"line":3592},41,[3594,3599,3603],{"type":28,"tag":128,"props":3595,"children":3596},{"style":164},[3597],{"type":34,"value":3598},"    :class",{"type":28,"tag":128,"props":3600,"children":3601},{"style":135},[3602],{"type":34,"value":172},{"type":28,"tag":128,"props":3604,"children":3605},{"style":175},[3606],{"type":34,"value":3607},"\"\n",{"type":28,"tag":128,"props":3609,"children":3611},{"class":130,"line":3610},42,[3612],{"type":28,"tag":128,"props":3613,"children":3614},{"style":175},[3615],{"type":34,"value":3616},"      twMerge(\n",{"type":28,"tag":128,"props":3618,"children":3620},{"class":130,"line":3619},43,[3621],{"type":28,"tag":128,"props":3622,"children":3623},{"style":175},[3624],{"type":34,"value":3625},"        `appearance-none h-5 min-w-[36px] bg-transparent border-2 border-gray-500 rounded-full relative ease-in-out duration-300 hover:border-primary-800 hover:checked:before:bg-white checked:before:left-1\u002F2 checked:before:ml-0 checked:before:mr-0.5 disabled:before:bg-gray-500\u002F50 hover:before:bg-primary-800 active:border-primary-800 active:before:bg-primary-800 checked:bg-none checked:bg-primary-700 checked:border-primary-700 checked:before:bg-white hover:checked:bg-primary-800 hover:checked:border-primary-800 disabled:border-gray-500\u002F50 checked:disabled:before:bg-white checked:disabled:bg-gray-500\u002F50 checked:disabled:border-0 before:transition-all  before:w-3.5 before:h-3.5 before:bg-gray-500 before:absolute before:top-0 before:bottom-0 before:my-auto before:rounded-full before:left-0 before:ml-0.5 before:ease-in-out before:duration-300 cursor-pointer disabled:cursor-not-allowed focus-visible:outline focus-visible:outline-offset`,\n",{"type":28,"tag":128,"props":3627,"children":3629},{"class":130,"line":3628},44,[3630],{"type":28,"tag":128,"props":3631,"children":3632},{"style":175},[3633],{"type":34,"value":3634},"        {\n",{"type":28,"tag":128,"props":3636,"children":3638},{"class":130,"line":3637},45,[3639],{"type":28,"tag":128,"props":3640,"children":3641},{"style":175},[3642],{"type":34,"value":3643},"          'border-negative-700 hover:border-negative-800 active:border-negative-900 before:bg-negative-900': invalid,\n",{"type":28,"tag":128,"props":3645,"children":3647},{"class":130,"line":3646},46,[3648],{"type":28,"tag":128,"props":3649,"children":3650},{"style":175},[3651],{"type":34,"value":3652},"        },\n",{"type":28,"tag":128,"props":3654,"children":3656},{"class":130,"line":3655},47,[3657],{"type":28,"tag":128,"props":3658,"children":3659},{"style":175},[3660],{"type":34,"value":3661},"        $attrs.class,\n",{"type":28,"tag":128,"props":3663,"children":3665},{"class":130,"line":3664},48,[3666],{"type":28,"tag":128,"props":3667,"children":3668},{"style":175},[3669],{"type":34,"value":3670},"      )\n",{"type":28,"tag":128,"props":3672,"children":3674},{"class":130,"line":3673},49,[3675],{"type":28,"tag":128,"props":3676,"children":3677},{"style":175},[3678],{"type":34,"value":3679},"    \"\n",{"type":28,"tag":128,"props":3681,"children":3683},{"class":130,"line":3682},50,[3684,3689,3693],{"type":28,"tag":128,"props":3685,"children":3686},{"style":164},[3687],{"type":34,"value":3688},"    :value",{"type":28,"tag":128,"props":3690,"children":3691},{"style":135},[3692],{"type":34,"value":172},{"type":28,"tag":128,"props":3694,"children":3695},{"style":175},[3696],{"type":34,"value":3697},"\"value\"\n",{"type":28,"tag":128,"props":3699,"children":3701},{"class":130,"line":3700},51,[3702,3706,3710],{"type":28,"tag":128,"props":3703,"children":3704},{"style":164},[3705],{"type":34,"value":2908},{"type":28,"tag":128,"props":3707,"children":3708},{"style":135},[3709],{"type":34,"value":172},{"type":28,"tag":128,"props":3711,"children":3712},{"style":175},[3713],{"type":34,"value":3714},"\"checkbox\"\n",{"type":28,"tag":128,"props":3716,"children":3718},{"class":130,"line":3717},52,[3719,3724,3728],{"type":28,"tag":128,"props":3720,"children":3721},{"style":164},[3722],{"type":34,"value":3723},"    role",{"type":28,"tag":128,"props":3725,"children":3726},{"style":135},[3727],{"type":34,"value":172},{"type":28,"tag":128,"props":3729,"children":3730},{"style":175},[3731],{"type":34,"value":3732},"\"switch\"\n",{"type":28,"tag":128,"props":3734,"children":3736},{"class":130,"line":3735},53,[3737,3742,3746],{"type":28,"tag":128,"props":3738,"children":3739},{"style":164},[3740],{"type":34,"value":3741},"    data-testid",{"type":28,"tag":128,"props":3743,"children":3744},{"style":135},[3745],{"type":34,"value":172},{"type":28,"tag":128,"props":3747,"children":3748},{"style":175},[3749],{"type":34,"value":3732},{"type":28,"tag":128,"props":3751,"children":3753},{"class":130,"line":3752},54,[3754,3759,3763],{"type":28,"tag":128,"props":3755,"children":3756},{"style":164},[3757],{"type":34,"value":3758},"    :aria-checked",{"type":28,"tag":128,"props":3760,"children":3761},{"style":135},[3762],{"type":34,"value":172},{"type":28,"tag":128,"props":3764,"children":3765},{"style":175},[3766],{"type":34,"value":3767},"\"switchRef?.checked\"\n",{"type":28,"tag":128,"props":3769,"children":3771},{"class":130,"line":3770},55,[3772,3777,3781],{"type":28,"tag":128,"props":3773,"children":3774},{"style":164},[3775],{"type":34,"value":3776},"    v-model",{"type":28,"tag":128,"props":3778,"children":3779},{"style":135},[3780],{"type":34,"value":172},{"type":28,"tag":128,"props":3782,"children":3783},{"style":175},[3784],{"type":34,"value":3785},"\"proxyChecked\"\n",{"type":28,"tag":128,"props":3787,"children":3789},{"class":130,"line":3788},56,[3790,3795,3799],{"type":28,"tag":128,"props":3791,"children":3792},{"style":164},[3793],{"type":34,"value":3794},"    v-bind",{"type":28,"tag":128,"props":3796,"children":3797},{"style":135},[3798],{"type":34,"value":172},{"type":28,"tag":128,"props":3800,"children":3801},{"style":175},[3802],{"type":34,"value":3803},"\"attrsWithoutClass\"\n",{"type":28,"tag":128,"props":3805,"children":3807},{"class":130,"line":3806},57,[3808],{"type":28,"tag":128,"props":3809,"children":3810},{"style":135},[3811],{"type":34,"value":3812},"  \u002F>\n",{"type":28,"tag":128,"props":3814,"children":3816},{"class":130,"line":3815},58,[3817,3821,3825],{"type":28,"tag":128,"props":3818,"children":3819},{"style":135},[3820],{"type":34,"value":206},{"type":28,"tag":128,"props":3822,"children":3823},{"style":141},[3824],{"type":34,"value":43},{"type":28,"tag":128,"props":3826,"children":3827},{"style":135},[3828],{"type":34,"value":148},{"type":28,"tag":400,"props":3830,"children":3831},{},[3832],{"type":28,"tag":118,"props":3833,"children":3835},{"className":405,"code":3834,"language":407,"meta":7,"style":7},"import React, { forwardRef } from 'react';\nimport { twMerge, type SfSwitchProps } from '@storefront-ui\u002Freact';\n\nconst SfSwitch = forwardRef\u003CHTMLInputElement, SfSwitchProps>(\n  ({ invalid, className, ...attributes }, ref): React.JSX.Element => (\n    \u003Cinput\n      ref={ref}\n      className={twMerge(\n        `appearance-none h-5 min-w-[36px] bg-transparent border-2 border-gray-500 rounded-full relative ease-in-out duration-300 hover:border-primary-800 hover:before:checked:bg-white checked:before:left-1\u002F2 checked:before:ml-0 checked:before:mr-0.5 disabled:before:bg-gray-500\u002F50 hover:before:bg-primary-800 active:border-primary-800 active:before:bg-primary-800 checked:bg-none checked:bg-primary-700 checked:border-primary-700 checked:before:bg-white hover:checked:bg-primary-800 hover:checked:border-primary-800 hover:checked:before:bg-white disabled:border-gray-500\u002F50 checked:disabled:before:bg-white checked:disabled:bg-gray-500\u002F50 checked:disabled:border-0 before:transition-all  before:w-3.5 before:h-3.5 before:bg-gray-500 before:absolute before:top-0 before:bottom-0 before:my-auto before:rounded-full before:left-0 before:ml-0.5 before:ease-in-out before:duration-300 cursor-pointer disabled:cursor-not-allowed focus-visible:outline focus-visible:outline-offset`,\n        {\n          'border-negative-700 hover:border-negative-800 active:border-negative-900 before:bg-negative-900': invalid,\n        },\n        className,\n      )}\n      type=\"checkbox\"\n      role=\"switch\"\n      data-testid=\"switch\"\n      aria-checked={attributes?.checked}\n      {...attributes}\n    \u002F>\n  ),\n);\n\nexport default SfSwitch;\n\n",[3836],{"type":28,"tag":51,"props":3837,"children":3838},{"__ignoreMap":7},[3839,3877,3921,3928,3972,4049,4060,4084,4109,4121,4128,4148,4155,4167,4179,4195,4211,4227,4259,4280,4287,4295,4302,4309],{"type":28,"tag":128,"props":3840,"children":3841},{"class":130,"line":131},[3842,3846,3851,3856,3861,3865,3869,3873],{"type":28,"tag":128,"props":3843,"children":3844},{"style":266},[3845],{"type":34,"value":269},{"type":28,"tag":128,"props":3847,"children":3848},{"style":141},[3849],{"type":34,"value":3850}," React",{"type":28,"tag":128,"props":3852,"children":3853},{"style":135},[3854],{"type":34,"value":3855},", { ",{"type":28,"tag":128,"props":3857,"children":3858},{"style":141},[3859],{"type":34,"value":3860},"forwardRef",{"type":28,"tag":128,"props":3862,"children":3863},{"style":135},[3864],{"type":34,"value":284},{"type":28,"tag":128,"props":3866,"children":3867},{"style":266},[3868],{"type":34,"value":289},{"type":28,"tag":128,"props":3870,"children":3871},{"style":175},[3872],{"type":34,"value":472},{"type":28,"tag":128,"props":3874,"children":3875},{"style":135},[3876],{"type":34,"value":299},{"type":28,"tag":128,"props":3878,"children":3879},{"class":130,"line":151},[3880,3884,3888,3892,3896,3900,3905,3909,3913,3917],{"type":28,"tag":128,"props":3881,"children":3882},{"style":266},[3883],{"type":34,"value":269},{"type":28,"tag":128,"props":3885,"children":3886},{"style":135},[3887],{"type":34,"value":274},{"type":28,"tag":128,"props":3889,"children":3890},{"style":141},[3891],{"type":34,"value":2829},{"type":28,"tag":128,"props":3893,"children":3894},{"style":135},[3895],{"type":34,"value":534},{"type":28,"tag":128,"props":3897,"children":3898},{"style":266},[3899],{"type":34,"value":2753},{"type":28,"tag":128,"props":3901,"children":3902},{"style":141},[3903],{"type":34,"value":3904}," SfSwitchProps",{"type":28,"tag":128,"props":3906,"children":3907},{"style":135},[3908],{"type":34,"value":284},{"type":28,"tag":128,"props":3910,"children":3911},{"style":266},[3912],{"type":34,"value":289},{"type":28,"tag":128,"props":3914,"children":3915},{"style":175},[3916],{"type":34,"value":439},{"type":28,"tag":128,"props":3918,"children":3919},{"style":135},[3920],{"type":34,"value":299},{"type":28,"tag":128,"props":3922,"children":3923},{"class":130,"line":200},[3924],{"type":28,"tag":128,"props":3925,"children":3926},{"emptyLinePlaceholder":9},[3927],{"type":34,"value":223},{"type":28,"tag":128,"props":3929,"children":3930},{"class":130,"line":217},[3931,3935,3940,3944,3949,3953,3958,3962,3967],{"type":28,"tag":128,"props":3932,"children":3933},{"style":266},[3934],{"type":34,"value":349},{"type":28,"tag":128,"props":3936,"children":3937},{"style":352},[3938],{"type":34,"value":3939}," SfSwitch",{"type":28,"tag":128,"props":3941,"children":3942},{"style":358},[3943],{"type":34,"value":361},{"type":28,"tag":128,"props":3945,"children":3946},{"style":364},[3947],{"type":34,"value":3948}," forwardRef",{"type":28,"tag":128,"props":3950,"children":3951},{"style":135},[3952],{"type":34,"value":138},{"type":28,"tag":128,"props":3954,"children":3955},{"style":352},[3956],{"type":34,"value":3957},"HTMLInputElement",{"type":28,"tag":128,"props":3959,"children":3960},{"style":135},[3961],{"type":34,"value":534},{"type":28,"tag":128,"props":3963,"children":3964},{"style":352},[3965],{"type":34,"value":3966},"SfSwitchProps",{"type":28,"tag":128,"props":3968,"children":3969},{"style":135},[3970],{"type":34,"value":3971},">(\n",{"type":28,"tag":128,"props":3973,"children":3974},{"class":130,"line":226},[3975,3980,3985,3989,3993,3998,4003,4008,4012,4017,4022,4026,4031,4035,4040,4045],{"type":28,"tag":128,"props":3976,"children":3977},{"style":135},[3978],{"type":34,"value":3979},"  ({ ",{"type":28,"tag":128,"props":3981,"children":3982},{"style":658},[3983],{"type":34,"value":3984},"invalid",{"type":28,"tag":128,"props":3986,"children":3987},{"style":135},[3988],{"type":34,"value":534},{"type":28,"tag":128,"props":3990,"children":3991},{"style":658},[3992],{"type":34,"value":2626},{"type":28,"tag":128,"props":3994,"children":3995},{"style":135},[3996],{"type":34,"value":3997},", ...",{"type":28,"tag":128,"props":3999,"children":4000},{"style":658},[4001],{"type":34,"value":4002},"attributes",{"type":28,"tag":128,"props":4004,"children":4005},{"style":135},[4006],{"type":34,"value":4007}," }, ",{"type":28,"tag":128,"props":4009,"children":4010},{"style":658},[4011],{"type":34,"value":279},{"type":28,"tag":128,"props":4013,"children":4014},{"style":135},[4015],{"type":34,"value":4016},"): ",{"type":28,"tag":128,"props":4018,"children":4019},{"style":352},[4020],{"type":34,"value":4021},"React",{"type":28,"tag":128,"props":4023,"children":4024},{"style":135},[4025],{"type":34,"value":698},{"type":28,"tag":128,"props":4027,"children":4028},{"style":352},[4029],{"type":34,"value":4030},"JSX",{"type":28,"tag":128,"props":4032,"children":4033},{"style":135},[4034],{"type":34,"value":698},{"type":28,"tag":128,"props":4036,"children":4037},{"style":352},[4038],{"type":34,"value":4039},"Element",{"type":28,"tag":128,"props":4041,"children":4042},{"style":266},[4043],{"type":34,"value":4044}," =>",{"type":28,"tag":128,"props":4046,"children":4047},{"style":135},[4048],{"type":34,"value":578},{"type":28,"tag":128,"props":4050,"children":4051},{"class":130,"line":262},[4052,4056],{"type":28,"tag":128,"props":4053,"children":4054},{"style":135},[4055],{"type":34,"value":586},{"type":28,"tag":128,"props":4057,"children":4058},{"style":141},[4059],{"type":34,"value":3571},{"type":28,"tag":128,"props":4061,"children":4062},{"class":130,"line":302},[4063,4068,4072,4076,4080],{"type":28,"tag":128,"props":4064,"children":4065},{"style":597},[4066],{"type":34,"value":4067},"      ref",{"type":28,"tag":128,"props":4069,"children":4070},{"style":358},[4071],{"type":34,"value":172},{"type":28,"tag":128,"props":4073,"children":4074},{"style":266},[4075],{"type":34,"value":609},{"type":28,"tag":128,"props":4077,"children":4078},{"style":141},[4079],{"type":34,"value":279},{"type":28,"tag":128,"props":4081,"children":4082},{"style":266},[4083],{"type":34,"value":618},{"type":28,"tag":128,"props":4085,"children":4086},{"class":130,"line":335},[4087,4092,4096,4100,4104],{"type":28,"tag":128,"props":4088,"children":4089},{"style":597},[4090],{"type":34,"value":4091},"      className",{"type":28,"tag":128,"props":4093,"children":4094},{"style":358},[4095],{"type":34,"value":172},{"type":28,"tag":128,"props":4097,"children":4098},{"style":266},[4099],{"type":34,"value":609},{"type":28,"tag":128,"props":4101,"children":4102},{"style":364},[4103],{"type":34,"value":2829},{"type":28,"tag":128,"props":4105,"children":4106},{"style":135},[4107],{"type":34,"value":4108},"(\n",{"type":28,"tag":128,"props":4110,"children":4111},{"class":130,"line":343},[4112,4117],{"type":28,"tag":128,"props":4113,"children":4114},{"style":175},[4115],{"type":34,"value":4116},"        `appearance-none h-5 min-w-[36px] bg-transparent border-2 border-gray-500 rounded-full relative ease-in-out duration-300 hover:border-primary-800 hover:before:checked:bg-white checked:before:left-1\u002F2 checked:before:ml-0 checked:before:mr-0.5 disabled:before:bg-gray-500\u002F50 hover:before:bg-primary-800 active:border-primary-800 active:before:bg-primary-800 checked:bg-none checked:bg-primary-700 checked:border-primary-700 checked:before:bg-white hover:checked:bg-primary-800 hover:checked:border-primary-800 hover:checked:before:bg-white disabled:border-gray-500\u002F50 checked:disabled:before:bg-white checked:disabled:bg-gray-500\u002F50 checked:disabled:border-0 before:transition-all  before:w-3.5 before:h-3.5 before:bg-gray-500 before:absolute before:top-0 before:bottom-0 before:my-auto before:rounded-full before:left-0 before:ml-0.5 before:ease-in-out before:duration-300 cursor-pointer disabled:cursor-not-allowed focus-visible:outline focus-visible:outline-offset`",{"type":28,"tag":128,"props":4118,"children":4119},{"style":135},[4120],{"type":34,"value":2995},{"type":28,"tag":128,"props":4122,"children":4123},{"class":130,"line":385},[4124],{"type":28,"tag":128,"props":4125,"children":4126},{"style":135},[4127],{"type":34,"value":3634},{"type":28,"tag":128,"props":4129,"children":4130},{"class":130,"line":679},[4131,4136,4140,4144],{"type":28,"tag":128,"props":4132,"children":4133},{"style":175},[4134],{"type":34,"value":4135},"          'border-negative-700 hover:border-negative-800 active:border-negative-900 before:bg-negative-900'",{"type":28,"tag":128,"props":4137,"children":4138},{"style":135},[4139],{"type":34,"value":2986},{"type":28,"tag":128,"props":4141,"children":4142},{"style":141},[4143],{"type":34,"value":3984},{"type":28,"tag":128,"props":4145,"children":4146},{"style":135},[4147],{"type":34,"value":2995},{"type":28,"tag":128,"props":4149,"children":4150},{"class":130,"line":719},[4151],{"type":28,"tag":128,"props":4152,"children":4153},{"style":135},[4154],{"type":34,"value":3652},{"type":28,"tag":128,"props":4156,"children":4157},{"class":130,"line":732},[4158,4163],{"type":28,"tag":128,"props":4159,"children":4160},{"style":141},[4161],{"type":34,"value":4162},"        className",{"type":28,"tag":128,"props":4164,"children":4165},{"style":135},[4166],{"type":34,"value":2995},{"type":28,"tag":128,"props":4168,"children":4169},{"class":130,"line":741},[4170,4175],{"type":28,"tag":128,"props":4171,"children":4172},{"style":135},[4173],{"type":34,"value":4174},"      )",{"type":28,"tag":128,"props":4176,"children":4177},{"style":266},[4178],{"type":34,"value":618},{"type":28,"tag":128,"props":4180,"children":4181},{"class":130,"line":750},[4182,4187,4191],{"type":28,"tag":128,"props":4183,"children":4184},{"style":597},[4185],{"type":34,"value":4186},"      type",{"type":28,"tag":128,"props":4188,"children":4189},{"style":358},[4190],{"type":34,"value":172},{"type":28,"tag":128,"props":4192,"children":4193},{"style":175},[4194],{"type":34,"value":3714},{"type":28,"tag":128,"props":4196,"children":4197},{"class":130,"line":1462},[4198,4203,4207],{"type":28,"tag":128,"props":4199,"children":4200},{"style":597},[4201],{"type":34,"value":4202},"      role",{"type":28,"tag":128,"props":4204,"children":4205},{"style":358},[4206],{"type":34,"value":172},{"type":28,"tag":128,"props":4208,"children":4209},{"style":175},[4210],{"type":34,"value":3732},{"type":28,"tag":128,"props":4212,"children":4213},{"class":130,"line":1498},[4214,4219,4223],{"type":28,"tag":128,"props":4215,"children":4216},{"style":597},[4217],{"type":34,"value":4218},"      data-testid",{"type":28,"tag":128,"props":4220,"children":4221},{"style":358},[4222],{"type":34,"value":172},{"type":28,"tag":128,"props":4224,"children":4225},{"style":175},[4226],{"type":34,"value":3732},{"type":28,"tag":128,"props":4228,"children":4229},{"class":130,"line":1515},[4230,4235,4239,4243,4247,4251,4255],{"type":28,"tag":128,"props":4231,"children":4232},{"style":597},[4233],{"type":34,"value":4234},"      aria-checked",{"type":28,"tag":128,"props":4236,"children":4237},{"style":358},[4238],{"type":34,"value":172},{"type":28,"tag":128,"props":4240,"children":4241},{"style":266},[4242],{"type":34,"value":609},{"type":28,"tag":128,"props":4244,"children":4245},{"style":352},[4246],{"type":34,"value":4002},{"type":28,"tag":128,"props":4248,"children":4249},{"style":135},[4250],{"type":34,"value":3441},{"type":28,"tag":128,"props":4252,"children":4253},{"style":141},[4254],{"type":34,"value":712},{"type":28,"tag":128,"props":4256,"children":4257},{"style":266},[4258],{"type":34,"value":618},{"type":28,"tag":128,"props":4260,"children":4261},{"class":130,"line":1551},[4262,4267,4272,4276],{"type":28,"tag":128,"props":4263,"children":4264},{"style":266},[4265],{"type":34,"value":4266},"      {",{"type":28,"tag":128,"props":4268,"children":4269},{"style":135},[4270],{"type":34,"value":4271},"...",{"type":28,"tag":128,"props":4273,"children":4274},{"style":141},[4275],{"type":34,"value":4002},{"type":28,"tag":128,"props":4277,"children":4278},{"style":266},[4279],{"type":34,"value":618},{"type":28,"tag":128,"props":4281,"children":4282},{"class":130,"line":1560},[4283],{"type":28,"tag":128,"props":4284,"children":4285},{"style":135},[4286],{"type":34,"value":738},{"type":28,"tag":128,"props":4288,"children":4289},{"class":130,"line":1568},[4290],{"type":28,"tag":128,"props":4291,"children":4292},{"style":135},[4293],{"type":34,"value":4294},"  ),\n",{"type":28,"tag":128,"props":4296,"children":4297},{"class":130,"line":3168},[4298],{"type":28,"tag":128,"props":4299,"children":4300},{"style":135},[4301],{"type":34,"value":382},{"type":28,"tag":128,"props":4303,"children":4304},{"class":130,"line":3176},[4305],{"type":28,"tag":128,"props":4306,"children":4307},{"emptyLinePlaceholder":9},[4308],{"type":34,"value":223},{"type":28,"tag":128,"props":4310,"children":4311},{"class":130,"line":3211},[4312,4316,4320,4324],{"type":28,"tag":128,"props":4313,"children":4314},{"style":266},[4315],{"type":34,"value":491},{"type":28,"tag":128,"props":4317,"children":4318},{"style":266},[4319],{"type":34,"value":496},{"type":28,"tag":128,"props":4321,"children":4322},{"style":141},[4323],{"type":34,"value":3939},{"type":28,"tag":128,"props":4325,"children":4326},{"style":135},[4327],{"type":34,"value":299},{"type":28,"tag":4329,"props":4330,"children":4331},"style",{},[4332],{"type":34,"value":4333},"html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}",{"title":7,"searchDepth":226,"depth":151,"links":4335},[4336,4337,4338,4339,4340,4341,4342,4343],{"id":93,"depth":151,"text":96},{"id":99,"depth":151,"text":102},{"id":758,"depth":151,"text":761},{"id":1576,"depth":151,"text":1579},{"id":2375,"depth":151,"text":2378},{"id":2411,"depth":151,"text":2414},{"id":2425,"depth":151,"text":2428},{"id":2646,"depth":151,"text":2649},"markdown","content:_components:switch.md","_components\u002Fswitch.md","_components\u002Fswitch","md","default",{"nav":4351,"sidebarRoot":4353},[4352,4355,4367],{"title":11,"_path":4353,"_id":13,"layout":4354,"sidebarRoot":9,"icon":12},"\u002F","fullscreen",{"title":4356,"_path":4357,"children":4358,"_id":4366,"layout":4349},"Getting Started","\u002Fgetting-started",[4359,4362],{"title":4360,"_path":4357,"_id":4361,"layout":4349},"Installation","content:2.getting-started:1.index.md",{"title":4363,"_path":4364,"_id":4365,"layout":4349},"Browser support","\u002Fgetting-started\u002Fbrowser-support","content:2.getting-started:2.browser-support.md","content:2.getting-started:_dir.yml",{"title":4368,"_path":4369,"children":4370},"Customization","\u002Fcustomization",[4371,4375,4379,4383],{"title":4372,"_path":4373,"_id":4374,"layout":4349},"Overriding Default Styles","\u002Fcustomization\u002Foverriding-default-styles","content:3.customization:overriding-default-styles.md",{"title":4376,"_path":4377,"_id":4378,"layout":4349},"Prose styling","\u002Fcustomization\u002Fprose","content:3.customization:prose.md",{"title":4380,"_path":4381,"_id":4382,"layout":4349},"Theming","\u002Fcustomization\u002Ftheming","content:3.customization:theming.md",{"title":4384,"_path":4385,"_id":4386,"layout":4349},"Typography","\u002Fcustomization\u002Ftypography","content:3.customization:typography.md",1787574915447]