[{"data":1,"prerenderedAt":368},["ShallowReactive",2],{"navigation":3,"\u002Fgetting-started\u002Fusage":136,"\u002Fgetting-started\u002Fusage-surround":363},[4,27],{"title":5,"path":6,"stem":7,"children":8,"icon":26},"Getting Started","\u002Fgetting-started","1.getting-started\u002F1.index",[9,12,17,21],{"title":10,"path":6,"stem":7,"icon":11},"Introduction","i-lucide-house",{"title":13,"path":14,"stem":15,"icon":16},"Installation (Nuxt)","\u002Fgetting-started\u002Finstallation-nuxt","1.getting-started\u002F2.installation-nuxt","i-lucide-download",{"title":18,"path":19,"stem":20,"icon":16},"Installation (Standalone)","\u002Fgetting-started\u002Finstallation-standalone","1.getting-started\u002F3.installation-standalone",{"title":22,"path":23,"stem":24,"icon":25},"Usage","\u002Fgetting-started\u002Fusage","1.getting-started\u002F4.usage","i-lucide-sliders",false,{"title":28,"path":29,"stem":30,"children":31,"page":26},"Components","\u002Fcomponents","runtime",[32,36,40,44,48,52,56,60,64,68,72,76,80,84,88,92,96,100,104,108,112,116,120,124,128,132],{"title":33,"path":34,"stem":35},"WAsyncValidatedInput","\u002Fcomponents\u002Fw-async-validated-input","runtime\u002Fcomponents\u002FWAsyncValidatedInput\u002FWAsyncValidatedInput",{"title":37,"path":38,"stem":39},"WAuth","\u002Fcomponents\u002Fw-auth","runtime\u002Fcomponents\u002FWAuth\u002FWAuth",{"title":41,"path":42,"stem":43},"WAuthLocalUser","\u002Fcomponents\u002Fw-auth-local-users","runtime\u002Fcomponents\u002FWAuth\u002FWAuthLocalUsers",{"title":45,"path":46,"stem":47},"WButton","\u002Fcomponents\u002Fw-button","runtime\u002Fcomponents\u002FWButton\u002FWButton",{"title":49,"path":50,"stem":51},"WCheckbox","\u002Fcomponents\u002Fw-checkbox","runtime\u002Fcomponents\u002FWCheckbox\u002FWCheckbox",{"title":53,"path":54,"stem":55},"WColorInput","\u002Fcomponents\u002Fw-color-input","runtime\u002Fcomponents\u002FWColorInput\u002FWColorInput",{"title":57,"path":58,"stem":59},"WColorPicker","\u002Fcomponents\u002Fw-color-picker","runtime\u002Fcomponents\u002FWColorPicker\u002FWColorPicker",{"title":61,"path":62,"stem":63},"WCombobox","\u002Fcomponents\u002Fw-combobox","runtime\u002Fcomponents\u002FWCombobox\u002FWCombobox",{"title":65,"path":66,"stem":67},"WDarkModeSwitcher","\u002Fcomponents\u002Fw-dark-mode-switcher","runtime\u002Fcomponents\u002FWDarkModeSwitcher\u002FWDarkModeSwitcher",{"title":69,"path":70,"stem":71},"WDatePicker","\u002Fcomponents\u002Fw-date-picker","runtime\u002Fcomponents\u002FWDatePicker\u002FWDatePicker",{"title":73,"path":74,"stem":75},"WFileInput","\u002Fcomponents\u002Fw-file-input","runtime\u002Fcomponents\u002FWFileInput\u002FWFileInput",{"title":77,"path":78,"stem":79},"WIcon","\u002Fcomponents\u002Fw-icon","runtime\u002Fcomponents\u002FWIcon\u002FWIcon",{"title":81,"path":82,"stem":83},"WMetamorphosisTheme","\u002Fcomponents\u002Fw-metamorphosis-theme","runtime\u002Fcomponents\u002FWMetamorphosisTheme\u002FWMetamorphosisTheme",{"title":85,"path":86,"stem":87},"WMultiValues","\u002Fcomponents\u002Fw-multi-values","runtime\u002Fcomponents\u002FWMultiValues\u002FWMultiValues",{"title":89,"path":90,"stem":91},"WNotification","\u002Fcomponents\u002Fw-notification","runtime\u002Fcomponents\u002FWNotifications\u002FWNotification",{"title":93,"path":94,"stem":95},"WNotifications","\u002Fcomponents\u002Fw-notifications","runtime\u002Fcomponents\u002FWNotifications\u002FWNotifications",{"title":97,"path":98,"stem":99},"WNumberInput","\u002Fcomponents\u002Fw-number-input","runtime\u002Fcomponents\u002FWNumberInput\u002FWNumberInput",{"title":101,"path":102,"stem":103},"WPagination","\u002Fcomponents\u002Fw-pagination","runtime\u002Fcomponents\u002FWPagination\u002FWPagination",{"title":105,"path":106,"stem":107},"WPalette","\u002Fcomponents\u002Fw-palette","runtime\u002Fcomponents\u002FWPalette\u002FWPalette",{"title":109,"path":110,"stem":111},"WPopover","\u002Fcomponents\u002Fw-popover","runtime\u002Fcomponents\u002FWPopover\u002FWPopover",{"title":113,"path":114,"stem":115},"WPopup","\u002Fcomponents\u002Fw-popup","runtime\u002Fcomponents\u002FWPopup\u002FWPopup",{"title":117,"path":118,"stem":119},"WProgressBar","\u002Fcomponents\u002Fw-progress-bar","runtime\u002Fcomponents\u002FWProgressBar\u002FWProgressBar",{"title":121,"path":122,"stem":123},"WRecorder","\u002Fcomponents\u002Fw-recorder","runtime\u002Fcomponents\u002FWRecorder\u002FWRecorder",{"title":125,"path":126,"stem":127},"WSimpleInput","\u002Fcomponents\u002Fw-simple-input","runtime\u002Fcomponents\u002FWSimpleInput\u002FWSimpleInput",{"title":129,"path":130,"stem":131},"WTable","\u002Fcomponents\u002Fw-table","runtime\u002Fcomponents\u002FWTable\u002FWTable",{"title":133,"path":134,"stem":135},"WTooltip","\u002Fcomponents\u002Fw-tooltip","runtime\u002Fcomponents\u002FWTooltip\u002FWTooltip",{"id":137,"title":22,"body":138,"description":356,"extension":357,"links":358,"meta":359,"navigation":360,"path":23,"seo":361,"stem":24,"__hash__":362},"docs\u002F1.getting-started\u002F4.usage.md",{"type":139,"value":140,"toc":350},"minimark",[141,145,158,214,218,221,251,255,265,287,296,300,307,340,346],[142,143,28],"h2",{"id":144},"components",[146,147,148,149,153,154,157],"p",{},"Components are auto-imported when using the Nuxt module. For standalone usage, they are auto-imported via ",[150,151,152],"code",{},"unplugin-vue-components"," with the ",[150,155,156],{},"WitchcraftUiResolver",".",[159,160,165],"pre",{"className":161,"code":162,"language":163,"meta":164,"style":164},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Ctemplate>\n    \u003CWButton>Click me\u003C\u002FWButton>\n\u003C\u002Ftemplate>\n","vue","",[150,166,167,183,205],{"__ignoreMap":164},[168,169,172,176,180],"span",{"class":170,"line":171},"line",1,[168,173,175],{"class":174},"sMK4o","\u003C",[168,177,179],{"class":178},"swJcz","template",[168,181,182],{"class":174},">\n",[168,184,186,189,191,194,198,201,203],{"class":170,"line":185},2,[168,187,188],{"class":174},"    \u003C",[168,190,45],{"class":178},[168,192,193],{"class":174},">",[168,195,197],{"class":196},"sTEyZ","Click me",[168,199,200],{"class":174},"\u003C\u002F",[168,202,45],{"class":178},[168,204,182],{"class":174},[168,206,208,210,212],{"class":170,"line":207},3,[168,209,200],{"class":174},[168,211,179],{"class":178},[168,213,182],{"class":174},[142,215,217],{"id":216},"props","Props",[146,219,220],{},"Most components accept standard HTML attributes via fallthrough props which are sent to the element that most \"embodies\" the component, e.g. $attrs goes to the checkbox root not it's wrapper (this is documented per component). Some components also accept typed props for specific parts or to override reka's props (e.g. root-props):",[159,222,224],{"className":161,"code":223,"language":163,"meta":164,"style":164},"\u003CWCheckbox wrapper-attrs=\"{ class: 'my-wrapper-class' }\" \u002F>\n",[150,225,226],{"__ignoreMap":164},[168,227,228,230,232,236,239,242,246,248],{"class":170,"line":171},[168,229,175],{"class":174},[168,231,49],{"class":178},[168,233,235],{"class":234},"spNyl"," wrapper-attrs",[168,237,238],{"class":174},"=",[168,240,241],{"class":174},"\"",[168,243,245],{"class":244},"sfazB","{ class: 'my-wrapper-class' }",[168,247,241],{"class":174},[168,249,250],{"class":174}," \u002F>\n",[142,252,254],{"id":253},"icons","Icons",[146,256,257,258,261,262,264],{},"The module installs ",[150,259,260],{},"unplugin-icons\u002Fnuxt"," and configures it with custom styles. Use icons with the ",[150,263,77],{}," component:",[159,266,268],{"className":161,"code":267,"language":163,"meta":164,"style":164},"\u003CWIcon>\u003Ci-lucide-check\u002F>\u003C\u002FWIcon>\n",[150,269,270],{"__ignoreMap":164},[168,271,272,274,276,278,281,283,285],{"class":170,"line":171},[168,273,175],{"class":174},[168,275,77],{"class":178},[168,277,193],{"class":174},[168,279,280],{"class":196},"\u003Ci-lucide-check\u002F>",[168,282,200],{"class":174},[168,284,77],{"class":178},[168,286,182],{"class":174},[146,288,289,291,292,295],{},[150,290,77],{}," is a simple wrapper that applies ",[150,293,294],{},"inline-block"," display to the icon in its slot.",[142,297,299],{"id":298},"helpers","Helpers",[146,301,302,303,306],{},"Some helpers are not auto-imported. Import them from ",[150,304,305],{},"#witchcraft-ui-helpers",":",[159,308,312],{"className":309,"code":310,"language":311,"meta":164,"style":164},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","import { someHelper } from \"#witchcraft-ui-helpers\"\n","ts",[150,313,314],{"__ignoreMap":164},[168,315,316,320,323,326,329,332,335,337],{"class":170,"line":171},[168,317,319],{"class":318},"s7zQu","import",[168,321,322],{"class":174}," {",[168,324,325],{"class":196}," someHelper",[168,327,328],{"class":174}," }",[168,330,331],{"class":318}," from",[168,333,334],{"class":174}," \"",[168,336,305],{"class":244},[168,338,339],{"class":174},"\"\n",[146,341,342,343,157],{},"Anything else can be imported from ",[150,344,345],{},"#witchcraft-ui",[347,348,349],"style",{},"html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}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);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}",{"title":164,"searchDepth":171,"depth":185,"links":351},[352,353,354,355],{"id":144,"depth":185,"text":28},{"id":216,"depth":185,"text":217},{"id":253,"depth":185,"text":254},{"id":298,"depth":185,"text":299},"Learn how to use and customize @witchcraft\u002Fui components.","md",null,{},{"icon":25},{"title":22,"description":356},"cSZXxCc2FV0PppRE99S-F0ICBo19gANCll4rt4BJlAk",[364,366],{"title":18,"path":19,"stem":20,"description":365,"icon":16,"children":-1},"Use @witchcraft\u002Fui without Nuxt.",{"title":33,"path":34,"stem":35,"description":367,"children":-1},"This is for usage with @witchcraft\u002Fnuxt-utils's useAsyncValidation for handling\ncomplex validation scenarios (client+server) as in the case of a username.",1781830839058]