[{"data":1,"prerenderedAt":1806},["ShallowReactive",2],{"selaras-docs-navigation":3,"selaras-docs:\u002Fcomponents\u002Fforms\u002Fform-field":649},[4,11,124,509,568,593],{"title":5,"path":6,"stem":7,"order":8,"icon":9,"collapse":10,"navBadges":9},"Selaras","\u002F","index",1,null,false,{"title":12,"order":13,"icon":9,"collapse":10,"navBadges":9,"path":14,"stem":15,"children":16,"page":10},"Overview",10,"\u002Foverview","overview",[17,66,103],{"title":18,"order":13,"icon":9,"collapse":10,"navBadges":9,"path":19,"stem":20,"children":21,"page":10},"Getting Started","\u002Foverview\u002Fgetting-started","overview\u002Fgetting-started",[22,26,31,36,41,46,51,56,61],{"title":23,"path":24,"stem":25,"order":13,"icon":9,"collapse":10,"navBadges":9},"Introduction","\u002Foverview\u002Fgetting-started\u002Fintroduction","overview\u002Fgetting-started\u002Fintroduction",{"title":27,"path":28,"stem":29,"order":30,"icon":9,"collapse":10,"navBadges":9},"Installation","\u002Foverview\u002Fgetting-started\u002Finstallation","overview\u002Fgetting-started\u002Finstallation",20,{"title":32,"path":33,"stem":34,"order":35,"icon":9,"collapse":10,"navBadges":9},"Component usage","\u002Foverview\u002Fgetting-started\u002Fcomponent-usage","overview\u002Fgetting-started\u002Fcomponent-usage",30,{"title":37,"path":38,"stem":39,"order":40,"icon":9,"collapse":10,"navBadges":9},"Nuxt configuration","\u002Foverview\u002Fgetting-started\u002Fnuxt-configuration","overview\u002Fgetting-started\u002Fnuxt-configuration",40,{"title":42,"path":43,"stem":44,"order":45,"icon":9,"collapse":10,"navBadges":9},"Icons","\u002Foverview\u002Fgetting-started\u002Ficons","overview\u002Fgetting-started\u002Ficons",50,{"title":47,"path":48,"stem":49,"order":50,"icon":9,"collapse":10,"navBadges":9},"Messages and localization","\u002Foverview\u002Fgetting-started\u002Fmessages","overview\u002Fgetting-started\u002Fmessages",60,{"title":52,"path":53,"stem":54,"order":55,"icon":9,"collapse":10,"navBadges":9},"Adaptive interfaces","\u002Foverview\u002Fgetting-started\u002Fadaptive-interfaces","overview\u002Fgetting-started\u002Fadaptive-interfaces",70,{"title":57,"path":58,"stem":59,"order":60,"icon":9,"collapse":10,"navBadges":9},"TypeScript","\u002Foverview\u002Fgetting-started\u002Ftypescript","overview\u002Fgetting-started\u002Ftypescript",80,{"title":62,"path":63,"stem":64,"order":65,"icon":9,"collapse":10,"navBadges":9},"Migrating to 1.0","\u002Foverview\u002Fgetting-started\u002Fmigrating-to-1","overview\u002Fgetting-started\u002Fmigrating-to-1",90,{"title":67,"order":30,"icon":9,"collapse":10,"navBadges":9,"path":68,"stem":69,"children":70,"page":10},"Theming","\u002Foverview\u002Ftheming","overview\u002Ftheming",[71,74,78,82,86,90,95,99],{"title":67,"path":72,"stem":73,"order":13,"icon":9,"collapse":10,"navBadges":9},"\u002Foverview\u002Ftheming\u002Foverview","overview\u002Ftheming\u002Foverview",{"title":75,"path":76,"stem":77,"order":30,"icon":9,"collapse":10,"navBadges":9},"CSS tokens","\u002Foverview\u002Ftheming\u002Fcss-tokens","overview\u002Ftheming\u002Fcss-tokens",{"title":79,"path":80,"stem":81,"order":35,"icon":9,"collapse":10,"navBadges":9},"Color roles","\u002Foverview\u002Ftheming\u002Fcolor-roles","overview\u002Ftheming\u002Fcolor-roles",{"title":83,"path":84,"stem":85,"order":40,"icon":9,"collapse":10,"navBadges":9},"Color modes","\u002Foverview\u002Ftheming\u002Fcolor-modes","overview\u002Ftheming\u002Fcolor-modes",{"title":87,"path":88,"stem":89,"order":45,"icon":9,"collapse":10,"navBadges":9},"Component styling","\u002Foverview\u002Ftheming\u002Fcomponent-styling","overview\u002Ftheming\u002Fcomponent-styling",{"title":91,"path":92,"stem":93,"order":94,"icon":9,"collapse":10,"navBadges":9},"Global configuration","\u002Foverview\u002Ftheming\u002Fglobal-configuration","overview\u002Ftheming\u002Fglobal-configuration",55,{"title":96,"path":97,"stem":98,"order":50,"icon":9,"collapse":10,"navBadges":9},"Scoped themes","\u002Foverview\u002Ftheming\u002Fscoped-themes","overview\u002Ftheming\u002Fscoped-themes",{"title":100,"path":101,"stem":102,"order":55,"icon":9,"collapse":10,"navBadges":9},"Complete themes","\u002Foverview\u002Ftheming\u002Fcomplete-themes","overview\u002Ftheming\u002Fcomplete-themes",{"title":104,"order":35,"icon":9,"collapse":10,"navBadges":9,"path":105,"stem":106,"children":107,"page":10},"Agent Support","\u002Foverview\u002Fagent-support","overview\u002Fagent-support",[108,112,116,120],{"title":109,"path":110,"stem":111,"order":13,"icon":9,"collapse":10,"navBadges":9},"Agent support","\u002Foverview\u002Fagent-support\u002Foverview","overview\u002Fagent-support\u002Foverview",{"title":113,"path":114,"stem":115,"order":30,"icon":9,"collapse":10,"navBadges":9},"Documentation exports","\u002Foverview\u002Fagent-support\u002Fdocumentation","overview\u002Fagent-support\u002Fdocumentation",{"title":117,"path":118,"stem":119,"order":35,"icon":9,"collapse":10,"navBadges":9},"Skills","\u002Foverview\u002Fagent-support\u002Fskills","overview\u002Fagent-support\u002Fskills",{"title":121,"path":122,"stem":123,"order":40,"icon":9,"collapse":10,"navBadges":9},"MCP","\u002Foverview\u002Fagent-support\u002Fmcp","overview\u002Fagent-support\u002Fmcp",{"title":125,"order":30,"icon":9,"collapse":10,"navBadges":9,"path":126,"stem":127,"children":128,"page":10},"Components","\u002Fcomponents","components",[129,202,301,320,364,417,470],{"title":130,"path":131,"stem":132,"children":133,"page":10},"Elements","\u002Fcomponents\u002Felements","components\u002Felements",[134,138,143,148,153,158,162,167,172,177,182,187,192,197],{"title":135,"path":136,"stem":137,"order":13,"icon":9,"collapse":10,"navBadges":9},"Button","\u002Fcomponents\u002Felements\u002Fbutton","components\u002Felements\u002Fbutton",{"title":139,"path":140,"stem":141,"order":142,"icon":9,"collapse":10,"navBadges":9},"ButtonGroup","\u002Fcomponents\u002Felements\u002Fbutton-group","components\u002Felements\u002Fbutton-group",10.5,{"title":144,"path":145,"stem":146,"order":147,"icon":9,"collapse":10,"navBadges":9},"Badge","\u002Fcomponents\u002Felements\u002Fbadge","components\u002Felements\u002Fbadge",11,{"title":149,"path":150,"stem":151,"order":152,"icon":9,"collapse":10,"navBadges":9},"Avatar","\u002Fcomponents\u002Felements\u002Favatar","components\u002Felements\u002Favatar",11.25,{"title":154,"path":155,"stem":156,"order":157,"icon":9,"collapse":10,"navBadges":9},"AvatarGroup","\u002Fcomponents\u002Felements\u002Favatar-group","components\u002Felements\u002Favatar-group",11.5,{"title":159,"path":160,"stem":161,"order":157,"icon":9,"collapse":10,"navBadges":9},"Chip","\u002Fcomponents\u002Felements\u002Fchip","components\u002Felements\u002Fchip",{"title":163,"path":164,"stem":165,"order":166,"icon":9,"collapse":10,"navBadges":9},"Icon","\u002Fcomponents\u002Felements\u002Ficon","components\u002Felements\u002Ficon",12,{"title":168,"path":169,"stem":170,"order":171,"icon":9,"collapse":10,"navBadges":9},"Skeleton","\u002Fcomponents\u002Felements\u002Fskeleton","components\u002Felements\u002Fskeleton",12.5,{"title":173,"path":174,"stem":175,"order":176,"icon":9,"collapse":10,"navBadges":9},"Separator","\u002Fcomponents\u002Felements\u002Fseparator","components\u002Felements\u002Fseparator",12.75,{"title":178,"path":179,"stem":180,"order":181,"icon":9,"collapse":10,"navBadges":9},"Alert","\u002Fcomponents\u002Felements\u002Falert","components\u002Felements\u002Falert",12.9,{"title":183,"path":184,"stem":185,"order":186,"icon":9,"collapse":10,"navBadges":9},"Toggle","\u002Fcomponents\u002Felements\u002Ftoggle","components\u002Felements\u002Ftoggle",12.92,{"title":188,"path":189,"stem":190,"order":191,"icon":9,"collapse":10,"navBadges":9},"Toggle Group","\u002Fcomponents\u002Felements\u002Ftoggle-group","components\u002Felements\u002Ftoggle-group",12.94,{"title":193,"path":194,"stem":195,"order":196,"icon":9,"collapse":10,"navBadges":9},"Kbd","\u002Fcomponents\u002Felements\u002Fkbd","components\u002Felements\u002Fkbd",12.95,{"title":198,"path":199,"stem":200,"order":201,"icon":9,"collapse":10,"navBadges":9},"Progress","\u002Fcomponents\u002Felements\u002Fprogress","components\u002Felements\u002Fprogress",12.97,{"title":203,"path":204,"stem":205,"children":206,"page":10},"Forms","\u002Fcomponents\u002Fforms","components\u002Fforms",[207,211,216,221,226,231,236,241,246,251,256,261,266,271,276,281,286,291,296],{"title":208,"path":209,"stem":210,"order":30,"icon":9,"collapse":10,"navBadges":9},"Input","\u002Fcomponents\u002Fforms\u002Finput","components\u002Fforms\u002Finput",{"title":212,"path":213,"stem":214,"order":215,"icon":9,"collapse":10,"navBadges":9},"InputGroup","\u002Fcomponents\u002Fforms\u002Finput-group","components\u002Fforms\u002Finput-group",20.25,{"title":217,"path":218,"stem":219,"order":220,"icon":9,"collapse":10,"navBadges":9},"InputNumber","\u002Fcomponents\u002Fforms\u002Finput-number","components\u002Fforms\u002Finput-number",20.5,{"title":222,"path":223,"stem":224,"order":225,"icon":9,"collapse":10,"navBadges":9},"Slider","\u002Fcomponents\u002Fforms\u002Fslider","components\u002Fforms\u002Fslider",20.75,{"title":227,"path":228,"stem":229,"order":230,"icon":9,"collapse":10,"navBadges":9},"PinInput","\u002Fcomponents\u002Fforms\u002Fpin-input","components\u002Fforms\u002Fpin-input",20.9,{"title":232,"path":233,"stem":234,"order":235,"icon":9,"collapse":10,"navBadges":9},"Textarea","\u002Fcomponents\u002Fforms\u002Ftextarea","components\u002Fforms\u002Ftextarea",21,{"title":237,"path":238,"stem":239,"order":240,"icon":9,"collapse":10,"navBadges":9},"FileUpload","\u002Fcomponents\u002Fforms\u002Ffile-upload","components\u002Fforms\u002Ffile-upload",21.5,{"title":242,"path":243,"stem":244,"order":245,"icon":9,"collapse":10,"navBadges":9},"Select","\u002Fcomponents\u002Fforms\u002Fselect","components\u002Fforms\u002Fselect",22,{"title":247,"path":248,"stem":249,"order":250,"icon":9,"collapse":10,"navBadges":9},"Listbox","\u002Fcomponents\u002Fforms\u002Flistbox","components\u002Fforms\u002Flistbox",22.5,{"title":252,"path":253,"stem":254,"order":255,"icon":9,"collapse":10,"navBadges":9},"TransferList","\u002Fcomponents\u002Fforms\u002Ftransfer-list","components\u002Fforms\u002Ftransfer-list",22.75,{"title":257,"path":258,"stem":259,"order":260,"icon":9,"collapse":10,"navBadges":9},"Autocomplete","\u002Fcomponents\u002Fforms\u002Fautocomplete","components\u002Fforms\u002Fautocomplete",23,{"title":262,"path":263,"stem":264,"order":265,"icon":9,"collapse":10,"navBadges":9},"DatePicker","\u002Fcomponents\u002Fforms\u002Fdate-picker","components\u002Fforms\u002Fdate-picker",23.5,{"title":267,"path":268,"stem":269,"order":270,"icon":9,"collapse":10,"navBadges":9},"ColorPicker","\u002Fcomponents\u002Fforms\u002Fcolor-picker","components\u002Fforms\u002Fcolor-picker",23.75,{"title":272,"path":273,"stem":274,"order":275,"icon":9,"collapse":10,"navBadges":9},"Checkbox","\u002Fcomponents\u002Fforms\u002Fcheckbox","components\u002Fforms\u002Fcheckbox",24,{"title":277,"path":278,"stem":279,"order":280,"icon":9,"collapse":10,"navBadges":9},"RadioGroup","\u002Fcomponents\u002Fforms\u002Fradio-group","components\u002Fforms\u002Fradio-group",25,{"title":282,"path":283,"stem":284,"order":285,"icon":9,"collapse":10,"navBadges":9},"Rating","\u002Fcomponents\u002Fforms\u002Frating","components\u002Fforms\u002Frating",25.5,{"title":287,"path":288,"stem":289,"order":290,"icon":9,"collapse":10,"navBadges":9},"Switch","\u002Fcomponents\u002Fforms\u002Fswitch","components\u002Fforms\u002Fswitch",26,{"title":292,"path":293,"stem":294,"order":295,"icon":9,"collapse":10,"navBadges":9},"FormField","\u002Fcomponents\u002Fforms\u002Fform-field","components\u002Fforms\u002Fform-field",27,{"title":297,"path":298,"stem":299,"order":300,"icon":9,"collapse":10,"navBadges":9},"Form Validation","\u002Fcomponents\u002Fforms\u002Fvalidation","components\u002Fforms\u002Fvalidation",28,{"title":302,"path":303,"stem":304,"children":305,"page":10},"Data","\u002Fcomponents\u002Fdata","components\u002Fdata",[306,311,315],{"title":307,"path":308,"stem":309,"order":310,"icon":9,"collapse":10,"navBadges":9},"Calendar","\u002Fcomponents\u002Fdata\u002Fcalendar","components\u002Fdata\u002Fcalendar",29,{"title":312,"path":313,"stem":314,"order":35,"icon":9,"collapse":10,"navBadges":9},"Table","\u002Fcomponents\u002Fdata\u002Ftable","components\u002Fdata\u002Ftable",{"title":316,"path":317,"stem":318,"order":319,"icon":9,"collapse":10,"navBadges":9},"Timeline","\u002Fcomponents\u002Fdata\u002Ftimeline","components\u002Fdata\u002Ftimeline",31,{"title":321,"path":322,"stem":323,"children":324,"page":10},"Navigation","\u002Fcomponents\u002Fnavigation","components\u002Fnavigation",[325,330,334,339,344,349,354,359],{"title":326,"path":327,"stem":328,"order":329,"icon":9,"collapse":10,"navBadges":9},"Breadcrumb","\u002Fcomponents\u002Fnavigation\u002Fbreadcrumb","components\u002Fnavigation\u002Fbreadcrumb",39,{"title":331,"path":332,"stem":333,"order":40,"icon":9,"collapse":10,"navBadges":9},"Tabs","\u002Fcomponents\u002Fnavigation\u002Ftabs","components\u002Fnavigation\u002Ftabs",{"title":335,"path":336,"stem":337,"order":338,"icon":9,"collapse":10,"navBadges":9},"Stepper","\u002Fcomponents\u002Fnavigation\u002Fstepper","components\u002Fnavigation\u002Fstepper",40.5,{"title":340,"path":341,"stem":342,"order":343,"icon":9,"collapse":10,"navBadges":9},"Accordion","\u002Fcomponents\u002Fnavigation\u002Faccordion","components\u002Fnavigation\u002Faccordion",41,{"title":345,"path":346,"stem":347,"order":348,"icon":9,"collapse":10,"navBadges":9},"Collapsible","\u002Fcomponents\u002Fnavigation\u002Fcollapsible","components\u002Fnavigation\u002Fcollapsible",41.5,{"title":350,"path":351,"stem":352,"order":353,"icon":9,"collapse":10,"navBadges":9},"Tree","\u002Fcomponents\u002Fnavigation\u002Ftree","components\u002Fnavigation\u002Ftree",41.75,{"title":355,"path":356,"stem":357,"order":358,"icon":9,"collapse":10,"navBadges":9},"Pagination","\u002Fcomponents\u002Fnavigation\u002Fpagination","components\u002Fnavigation\u002Fpagination",44,{"title":360,"path":361,"stem":362,"order":363,"icon":9,"collapse":10,"navBadges":9},"NavigationMenu","\u002Fcomponents\u002Fnavigation\u002Fnavigation-menu","components\u002Fnavigation\u002Fnavigation-menu",45,{"title":365,"path":366,"stem":367,"children":368,"page":10},"Overlays","\u002Fcomponents\u002Foverlays","components\u002Foverlays",[369,373,378,383,388,393,398,403,408,412],{"title":370,"path":371,"stem":372,"order":45,"icon":9,"collapse":10,"navBadges":9},"Modal","\u002Fcomponents\u002Foverlays\u002Fmodal","components\u002Foverlays\u002Fmodal",{"title":374,"path":375,"stem":376,"order":377,"icon":9,"collapse":10,"navBadges":9},"AlertDialog","\u002Fcomponents\u002Foverlays\u002Falert-dialog","components\u002Foverlays\u002Falert-dialog",50.5,{"title":379,"path":380,"stem":381,"order":382,"icon":9,"collapse":10,"navBadges":9},"Dropdown","\u002Fcomponents\u002Foverlays\u002Fdropdown","components\u002Foverlays\u002Fdropdown",51,{"title":384,"path":385,"stem":386,"order":387,"icon":9,"collapse":10,"navBadges":9},"Context Menu","\u002Fcomponents\u002Foverlays\u002Fcontext-menu","components\u002Foverlays\u002Fcontext-menu",51.5,{"title":389,"path":390,"stem":391,"order":392,"icon":9,"collapse":10,"navBadges":9},"Tooltip","\u002Fcomponents\u002Foverlays\u002Ftooltip","components\u002Foverlays\u002Ftooltip",52,{"title":394,"path":395,"stem":396,"order":397,"icon":9,"collapse":10,"navBadges":9},"Toast","\u002Fcomponents\u002Foverlays\u002Ftoast","components\u002Foverlays\u002Ftoast",53,{"title":399,"path":400,"stem":401,"order":402,"icon":9,"collapse":10,"navBadges":9},"Slideover","\u002Fcomponents\u002Foverlays\u002Fslideover","components\u002Foverlays\u002Fslideover",54,{"title":404,"path":405,"stem":406,"order":407,"icon":9,"collapse":10,"navBadges":9},"Command Palette","\u002Fcomponents\u002Foverlays\u002Fcommand-palette","components\u002Foverlays\u002Fcommand-palette",54.5,{"title":409,"path":410,"stem":411,"order":94,"icon":9,"collapse":10,"navBadges":9},"Popover","\u002Fcomponents\u002Foverlays\u002Fpopover","components\u002Foverlays\u002Fpopover",{"title":413,"path":414,"stem":415,"order":416,"icon":9,"collapse":10,"navBadges":9},"Drawer","\u002Fcomponents\u002Foverlays\u002Fdrawer","components\u002Foverlays\u002Fdrawer",56,{"title":418,"path":419,"stem":420,"children":421,"page":10},"Layout","\u002Fcomponents\u002Flayout","components\u002Flayout",[422,427,431,436,441,446,450,455,460,465],{"title":423,"path":424,"stem":425,"order":426,"icon":9,"collapse":10,"navBadges":9},"App","\u002Fcomponents\u002Flayout\u002Fapp","components\u002Flayout\u002Fapp",59,{"title":428,"path":429,"stem":430,"order":50,"icon":9,"collapse":10,"navBadges":9},"Container","\u002Fcomponents\u002Flayout\u002Fcontainer","components\u002Flayout\u002Fcontainer",{"title":432,"path":433,"stem":434,"order":435,"icon":9,"collapse":10,"navBadges":9},"Header","\u002Fcomponents\u002Flayout\u002Fheader","components\u002Flayout\u002Fheader",63,{"title":437,"path":438,"stem":439,"order":440,"icon":9,"collapse":10,"navBadges":9},"ColorModeToggle","\u002Fcomponents\u002Flayout\u002Fcolor-mode-toggle","components\u002Flayout\u002Fcolor-mode-toggle",64,{"title":442,"path":443,"stem":444,"order":445,"icon":9,"collapse":10,"navBadges":9},"ColorModeSwitch","\u002Fcomponents\u002Flayout\u002Fcolor-mode-switch","components\u002Flayout\u002Fcolor-mode-switch",65,{"title":447,"path":448,"stem":449,"order":445,"icon":9,"collapse":10,"navBadges":9},"ScrollArea","\u002Fcomponents\u002Flayout\u002Fscroll-area","components\u002Flayout\u002Fscroll-area",{"title":451,"path":452,"stem":453,"order":454,"icon":9,"collapse":10,"navBadges":9},"Card","\u002Fcomponents\u002Flayout\u002Fcard","components\u002Flayout\u002Fcard",66,{"title":456,"path":457,"stem":458,"order":459,"icon":9,"collapse":10,"navBadges":9},"CardGroup","\u002Fcomponents\u002Flayout\u002Fcard-group","components\u002Flayout\u002Fcard-group",67,{"title":461,"path":462,"stem":463,"order":464,"icon":9,"collapse":10,"navBadges":9},"Splitter","\u002Fcomponents\u002Flayout\u002Fsplitter","components\u002Flayout\u002Fsplitter",68,{"title":466,"path":467,"stem":468,"order":469,"icon":9,"collapse":10,"navBadges":9},"Theme","\u002Fcomponents\u002Flayout\u002Ftheme","components\u002Flayout\u002Ftheme",69,{"title":471,"path":472,"stem":473,"children":474,"page":10},"Typography","\u002Fcomponents\u002Ftypography","components\u002Ftypography",[475,479,484,489,494,499,504],{"title":476,"path":477,"stem":478,"order":55,"icon":9,"collapse":10,"navBadges":9},"Prose","\u002Fcomponents\u002Ftypography\u002Fprose","components\u002Ftypography\u002Fprose",{"title":480,"path":481,"stem":482,"order":483,"icon":9,"collapse":10,"navBadges":9},"CodeGroup","\u002Fcomponents\u002Ftypography\u002Fcode-group","components\u002Ftypography\u002Fcode-group",71,{"title":485,"path":486,"stem":487,"order":488,"icon":9,"collapse":10,"navBadges":9},"Callout","\u002Fcomponents\u002Ftypography\u002Fcallout","components\u002Ftypography\u002Fcallout",72,{"title":490,"path":491,"stem":492,"order":493,"icon":9,"collapse":10,"navBadges":9},"CodeButton","\u002Fcomponents\u002Ftypography\u002Fcode-button","components\u002Ftypography\u002Fcode-button",73,{"title":495,"path":496,"stem":497,"order":498,"icon":9,"collapse":10,"navBadges":9},"ReadMore","\u002Fcomponents\u002Ftypography\u002Fread-more","components\u002Ftypography\u002Fread-more",74,{"title":500,"path":501,"stem":502,"order":503,"icon":9,"collapse":10,"navBadges":9},"FileTree","\u002Fcomponents\u002Ftypography\u002Ffile-tree","components\u002Ftypography\u002Ffile-tree",75,{"title":505,"path":506,"stem":507,"order":508,"icon":9,"collapse":10,"navBadges":9},"CodeTree","\u002Fcomponents\u002Ftypography\u002Fcode-tree","components\u002Ftypography\u002Fcode-tree",76,{"title":510,"order":35,"icon":9,"collapse":10,"navBadges":9,"path":511,"stem":512,"children":513,"page":10},"Composites","\u002Fcomposites","composites",[514,543],{"title":515,"path":516,"stem":517,"children":518,"page":10},"Dashboard","\u002Fcomposites\u002Fdashboard","composites\u002Fdashboard",[519,523,527,531,535,539],{"title":520,"path":521,"stem":522,"order":13,"icon":9,"collapse":10,"navBadges":9},"DashboardGroup","\u002Fcomposites\u002Fdashboard\u002Fdashboard-group","composites\u002Fdashboard\u002Fdashboard-group",{"title":524,"path":525,"stem":526,"order":30,"icon":9,"collapse":10,"navBadges":9},"DashboardSidebar","\u002Fcomposites\u002Fdashboard\u002Fdashboard-sidebar","composites\u002Fdashboard\u002Fdashboard-sidebar",{"title":528,"path":529,"stem":530,"order":35,"icon":9,"collapse":10,"navBadges":9},"DashboardPanel","\u002Fcomposites\u002Fdashboard\u002Fdashboard-panel","composites\u002Fdashboard\u002Fdashboard-panel",{"title":532,"path":533,"stem":534,"order":40,"icon":9,"collapse":10,"navBadges":9},"DashboardResizeHandle","\u002Fcomposites\u002Fdashboard\u002Fdashboard-resize-handle","composites\u002Fdashboard\u002Fdashboard-resize-handle",{"title":536,"path":537,"stem":538,"order":45,"icon":9,"collapse":10,"navBadges":9},"DashboardNavbar","\u002Fcomposites\u002Fdashboard\u002Fdashboard-navbar","composites\u002Fdashboard\u002Fdashboard-navbar",{"title":540,"path":541,"stem":542,"order":50,"icon":9,"collapse":10,"navBadges":9},"DashboardSidebarToggle","\u002Fcomposites\u002Fdashboard\u002Fdashboard-sidebar-toggle","composites\u002Fdashboard\u002Fdashboard-sidebar-toggle",{"title":544,"path":545,"stem":546,"children":547,"page":10},"Documentation","\u002Fcomposites\u002Fdocumentation","composites\u002Fdocumentation",[548,552,556,560,564],{"title":549,"path":550,"stem":551,"order":13,"icon":9,"collapse":10,"navBadges":9},"PageHeader","\u002Fcomposites\u002Fdocumentation\u002Fpage-header","composites\u002Fdocumentation\u002Fpage-header",{"title":553,"path":554,"stem":555,"order":30,"icon":9,"collapse":10,"navBadges":9},"PageAside","\u002Fcomposites\u002Fdocumentation\u002Fpage-aside","composites\u002Fdocumentation\u002Fpage-aside",{"title":557,"path":558,"stem":559,"order":35,"icon":9,"collapse":10,"navBadges":9},"ContentNavigation","\u002Fcomposites\u002Fdocumentation\u002Fcontent-navigation","composites\u002Fdocumentation\u002Fcontent-navigation",{"title":561,"path":562,"stem":563,"order":40,"icon":9,"collapse":10,"navBadges":9},"ContentToc","\u002Fcomposites\u002Fdocumentation\u002Fcontent-toc","composites\u002Fdocumentation\u002Fcontent-toc",{"title":565,"path":566,"stem":567,"order":45,"icon":9,"collapse":10,"navBadges":9},"ContentSurround","\u002Fcomposites\u002Fdocumentation\u002Fcontent-surround","composites\u002Fdocumentation\u002Fcontent-surround",{"title":569,"order":570,"icon":9,"collapse":10,"navBadges":9,"path":571,"stem":572,"children":573,"page":10},"Blocks",35,"\u002Fblocks","blocks",[574,577,581,585,589],{"title":569,"path":575,"stem":576,"order":13,"icon":9,"collapse":10,"navBadges":9},"\u002Fblocks\u002Foverview","blocks\u002Foverview",{"title":578,"path":579,"stem":580,"order":30,"icon":9,"collapse":10,"navBadges":9},"Sign in","\u002Fblocks\u002Fsign-in","blocks\u002Fsign-in",{"title":582,"path":583,"stem":584,"order":35,"icon":9,"collapse":10,"navBadges":9},"Dashboard overview","\u002Fblocks\u002Fdashboard-overview","blocks\u002Fdashboard-overview",{"title":586,"path":587,"stem":588,"order":40,"icon":9,"collapse":10,"navBadges":9},"Profile settings","\u002Fblocks\u002Fprofile-settings","blocks\u002Fprofile-settings",{"title":590,"path":591,"stem":592,"order":45,"icon":9,"collapse":10,"navBadges":9},"Data management","\u002Fblocks\u002Fdata-management","blocks\u002Fdata-management",{"title":594,"order":40,"icon":9,"collapse":10,"navBadges":9,"path":595,"stem":596,"children":597,"page":10},"Utilities","\u002Futilities","utilities",[598,632],{"title":599,"path":600,"stem":601,"children":602,"page":10},"Composables","\u002Futilities\u002Fcomposables","utilities\u002Fcomposables",[603,607,611,616,620,624,628],{"title":604,"path":605,"stem":606,"order":13,"icon":9,"collapse":10,"navBadges":9},"useModal","\u002Futilities\u002Fcomposables\u002Fuse-modal","utilities\u002Fcomposables\u002Fuse-modal",{"title":608,"path":609,"stem":610,"order":166,"icon":9,"collapse":10,"navBadges":9},"useConfirm","\u002Futilities\u002Fcomposables\u002Fuse-confirm","utilities\u002Fcomposables\u002Fuse-confirm",{"title":612,"path":613,"stem":614,"order":615,"icon":9,"collapse":10,"navBadges":9},"useDrawer","\u002Futilities\u002Fcomposables\u002Fuse-drawer","utilities\u002Fcomposables\u002Fuse-drawer",15,{"title":617,"path":618,"stem":619,"order":30,"icon":9,"collapse":10,"navBadges":9},"useSlideover","\u002Futilities\u002Fcomposables\u002Fuse-slideover","utilities\u002Fcomposables\u002Fuse-slideover",{"title":621,"path":622,"stem":623,"order":35,"icon":9,"collapse":10,"navBadges":9},"useIcons","\u002Futilities\u002Fcomposables\u002Fuse-icons","utilities\u002Fcomposables\u002Fuse-icons",{"title":625,"path":626,"stem":627,"order":40,"icon":9,"collapse":10,"navBadges":9},"useMessages","\u002Futilities\u002Fcomposables\u002Fuse-messages","utilities\u002Fcomposables\u002Fuse-messages",{"title":629,"path":630,"stem":631,"order":45,"icon":9,"collapse":10,"navBadges":9},"useLocale","\u002Futilities\u002Fcomposables\u002Fuse-locale","utilities\u002Fcomposables\u002Fuse-locale",{"title":633,"path":634,"stem":635,"children":636,"page":10},"Directives","\u002Futilities\u002Fdirectives","utilities\u002Fdirectives",[637,641,645],{"title":638,"path":639,"stem":640,"order":13,"icon":9,"collapse":10,"navBadges":9},"v-ripple","\u002Futilities\u002Fdirectives\u002Fripple","utilities\u002Fdirectives\u002Fripple",{"title":642,"path":643,"stem":644,"order":615,"icon":9,"collapse":10,"navBadges":9},"v-hotkey","\u002Futilities\u002Fdirectives\u002Fhotkey","utilities\u002Fdirectives\u002Fhotkey",{"title":646,"path":647,"stem":648,"order":30,"icon":9,"collapse":10,"navBadges":9},"v-mask","\u002Futilities\u002Fdirectives\u002Fmask","utilities\u002Fdirectives\u002Fmask",{"id":650,"title":292,"aside":651,"body":652,"collapse":10,"description":1802,"editLink":651,"extension":1098,"icon":9,"meta":1803,"navBadges":9,"navigation":9,"order":295,"path":293,"prevNext":651,"seo":1804,"stem":294,"toc":651,"__hash__":1805},"docs\u002Fcomponents\u002Fforms\u002Fform-field.md",true,{"type":653,"value":654,"toc":1787},"minimark",[655,660,686,870,875,883,944,948,969,1028,1032,1082,1086,1106,1222,1226,1237,1290,1294,1311,1315,1381,1396,1399,1403,1527,1538,1545,1551,1555,1559,1738,1742,1783],[656,657,659],"h2",{"id":658},"usage","Usage",[661,662,663,664,668,669,672,673,6,676,679,680,682,683,685],"p",{},"Wrap any single form control - Input, Textarea, Select, Autocomplete, Checkbox,\nRadioGroup, or Switch - and FormField generates a matching ",[665,666,667],"code",{},"id",", links the\nlabel to it, and computes ",[665,670,671],{},"aria-describedby"," from whichever of ",[665,674,675],{},"hint",[665,677,678],{},"error","\nis currently showing. The wrapped control picks all of this up automatically;\nyou don't pass ",[665,681,667],{}," or ",[665,684,671],{}," yourself.",[687,688,693],"pre",{"className":689,"code":690,"language":691,"meta":692,"style":692},"language-vue shiki shiki-themes github-light github-dark","\u003Cscript setup lang=\"ts\">\nconst email = ref('')\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CSFormField label=\"Email\" name=\"email\" hint=\"We'll never share this.\">\n    \u003CSInput v-model=\"email\" type=\"email\" placeholder=\"you@example.com\" \u002F>\n  \u003C\u002FSFormField>\n\u003C\u002Ftemplate>\n","vue","",[665,694,695,724,750,760,766,776,811,851,861],{"__ignoreMap":692},[696,697,699,703,707,711,714,717,721],"span",{"class":698,"line":8},"line",[696,700,702],{"class":701},"sVt8B","\u003C",[696,704,706],{"class":705},"s9eBZ","script",[696,708,710],{"class":709},"sScJk"," setup",[696,712,713],{"class":709}," lang",[696,715,716],{"class":701},"=",[696,718,720],{"class":719},"sZZnC","\"ts\"",[696,722,723],{"class":701},">\n",[696,725,727,731,735,738,741,744,747],{"class":698,"line":726},2,[696,728,730],{"class":729},"szBVR","const",[696,732,734],{"class":733},"sj4cs"," email",[696,736,737],{"class":729}," =",[696,739,740],{"class":709}," ref",[696,742,743],{"class":701},"(",[696,745,746],{"class":719},"''",[696,748,749],{"class":701},")\n",[696,751,753,756,758],{"class":698,"line":752},3,[696,754,755],{"class":701},"\u003C\u002F",[696,757,706],{"class":705},[696,759,723],{"class":701},[696,761,763],{"class":698,"line":762},4,[696,764,765],{"emptyLinePlaceholder":651},"\n",[696,767,769,771,774],{"class":698,"line":768},5,[696,770,702],{"class":701},[696,772,773],{"class":705},"template",[696,775,723],{"class":701},[696,777,779,782,785,788,790,793,796,798,801,804,806,809],{"class":698,"line":778},6,[696,780,781],{"class":701},"  \u003C",[696,783,784],{"class":705},"SFormField",[696,786,787],{"class":709}," label",[696,789,716],{"class":701},[696,791,792],{"class":719},"\"Email\"",[696,794,795],{"class":709}," name",[696,797,716],{"class":701},[696,799,800],{"class":719},"\"email\"",[696,802,803],{"class":709}," hint",[696,805,716],{"class":701},[696,807,808],{"class":719},"\"We'll never share this.\"",[696,810,723],{"class":701},[696,812,814,817,820,823,825,828,831,833,836,838,840,843,845,848],{"class":698,"line":813},7,[696,815,816],{"class":701},"    \u003C",[696,818,819],{"class":705},"SInput",[696,821,822],{"class":709}," v-model",[696,824,716],{"class":701},[696,826,827],{"class":719},"\"",[696,829,830],{"class":701},"email",[696,832,827],{"class":719},[696,834,835],{"class":709}," type",[696,837,716],{"class":701},[696,839,800],{"class":719},[696,841,842],{"class":709}," placeholder",[696,844,716],{"class":701},[696,846,847],{"class":719},"\"you@example.com\"",[696,849,850],{"class":701}," \u002F>\n",[696,852,854,857,859],{"class":698,"line":853},8,[696,855,856],{"class":701},"  \u003C\u002F",[696,858,784],{"class":705},[696,860,723],{"class":701},[696,862,864,866,868],{"class":698,"line":863},9,[696,865,755],{"class":701},[696,867,773],{"class":705},[696,869,723],{"class":701},[871,872,874],"h3",{"id":873},"description","Description",[661,876,877,879,880,882],{},[665,878,873],{}," adds a second, muted line under the label, before the\ncontrol - for context the user should read before reaching it (unlike\n",[665,881,675],{},", which sits below the control instead):",[687,884,888],{"className":885,"code":886,"language":887,"meta":692,"style":692},"language-vue-html shiki shiki-themes github-light github-dark","\u003CSFormField label=\"Email\" description=\"We'll use this to send your receipt.\">\n  \u003CSInput v-model=\"email\" type=\"email\" \u002F>\n\u003C\u002FSFormField>\n","vue-html",[665,889,890,912,936],{"__ignoreMap":692},[696,891,892,894,896,898,900,902,905,907,910],{"class":698,"line":8},[696,893,702],{"class":701},[696,895,784],{"class":705},[696,897,787],{"class":709},[696,899,716],{"class":701},[696,901,792],{"class":719},[696,903,904],{"class":709}," description",[696,906,716],{"class":701},[696,908,909],{"class":719},"\"We'll use this to send your receipt.\"",[696,911,723],{"class":701},[696,913,914,916,918,920,922,924,926,928,930,932,934],{"class":698,"line":726},[696,915,781],{"class":701},[696,917,819],{"class":705},[696,919,822],{"class":709},[696,921,716],{"class":701},[696,923,827],{"class":719},[696,925,830],{"class":701},[696,927,827],{"class":719},[696,929,835],{"class":709},[696,931,716],{"class":701},[696,933,800],{"class":719},[696,935,850],{"class":701},[696,937,938,940,942],{"class":698,"line":752},[696,939,755],{"class":701},[696,941,784],{"class":705},[696,943,723],{"class":701},[871,945,947],{"id":946},"error-state","Error state",[661,949,950,951,953,954,957,958,961,962,964,965,968],{},"Set ",[665,952,678],{}," to a string to show a message in place of the hint and mark the\ncontrol ",[665,955,956],{},"invalid"," (a red ring\u002Foutline, ",[665,959,960],{},"aria-invalid=\"true\"","). Passing\n",[665,963,678],{}," as ",[665,966,967],{},"true"," (no message) still marks the control invalid without\nrendering any text.",[687,970,972],{"className":885,"code":971,"language":887,"meta":692,"style":692},"\u003CSFormField label=\"Email\" error=\"Enter a valid email address\">\n  \u003CSInput v-model=\"email\" type=\"email\" \u002F>\n\u003C\u002FSFormField>\n",[665,973,974,996,1020],{"__ignoreMap":692},[696,975,976,978,980,982,984,986,989,991,994],{"class":698,"line":8},[696,977,702],{"class":701},[696,979,784],{"class":705},[696,981,787],{"class":709},[696,983,716],{"class":701},[696,985,792],{"class":719},[696,987,988],{"class":709}," error",[696,990,716],{"class":701},[696,992,993],{"class":719},"\"Enter a valid email address\"",[696,995,723],{"class":701},[696,997,998,1000,1002,1004,1006,1008,1010,1012,1014,1016,1018],{"class":698,"line":726},[696,999,781],{"class":701},[696,1001,819],{"class":705},[696,1003,822],{"class":709},[696,1005,716],{"class":701},[696,1007,827],{"class":719},[696,1009,830],{"class":701},[696,1011,827],{"class":719},[696,1013,835],{"class":709},[696,1015,716],{"class":701},[696,1017,800],{"class":719},[696,1019,850],{"class":701},[696,1021,1022,1024,1026],{"class":698,"line":752},[696,1023,755],{"class":701},[696,1025,784],{"class":705},[696,1027,723],{"class":701},[871,1029,1031],{"id":1030},"required-indicator","Required indicator",[687,1033,1035],{"className":885,"code":1034,"language":887,"meta":692,"style":692},"\u003CSFormField label=\"Name\" required>\n  \u003CSInput v-model=\"name\" \u002F>\n\u003C\u002FSFormField>\n",[665,1036,1037,1055,1074],{"__ignoreMap":692},[696,1038,1039,1041,1043,1045,1047,1050,1053],{"class":698,"line":8},[696,1040,702],{"class":701},[696,1042,784],{"class":705},[696,1044,787],{"class":709},[696,1046,716],{"class":701},[696,1048,1049],{"class":719},"\"Name\"",[696,1051,1052],{"class":709}," required",[696,1054,723],{"class":701},[696,1056,1057,1059,1061,1063,1065,1067,1070,1072],{"class":698,"line":726},[696,1058,781],{"class":701},[696,1060,819],{"class":705},[696,1062,822],{"class":709},[696,1064,716],{"class":701},[696,1066,827],{"class":719},[696,1068,1069],{"class":701},"name",[696,1071,827],{"class":719},[696,1073,850],{"class":701},[696,1075,1076,1078,1080],{"class":698,"line":752},[696,1077,755],{"class":701},[696,1079,784],{"class":705},[696,1081,723],{"class":701},[871,1083,1085],{"id":1084},"sizes","Sizes",[661,1087,1088,1091,1092,1095,1096,1095,1099,1102,1103,1105],{},[665,1089,1090],{},"size"," also scales FormField's own label\u002Fdescription\u002Fhint\u002Ferror text\n(",[665,1093,1094],{},"sm"," \u002F ",[665,1097,1098],{},"md",[665,1100,1101],{},"lg",") - it's the same prop already forwarded to the\nwrapped control's own ",[665,1104,1090],{},", so both stay visually in sync without\nsetting it twice:",[687,1107,1109],{"className":885,"code":1108,"language":887,"meta":692,"style":692},"\u003CSFormField label=\"Email\" size=\"sm\">\n  \u003CSInput v-model=\"email\" size=\"sm\" \u002F>\n\u003C\u002FSFormField>\n\n\u003CSFormField label=\"Email\" size=\"lg\">\n  \u003CSInput v-model=\"email\" size=\"lg\" \u002F>\n\u003C\u002FSFormField>\n",[665,1110,1111,1133,1157,1165,1169,1190,1214],{"__ignoreMap":692},[696,1112,1113,1115,1117,1119,1121,1123,1126,1128,1131],{"class":698,"line":8},[696,1114,702],{"class":701},[696,1116,784],{"class":705},[696,1118,787],{"class":709},[696,1120,716],{"class":701},[696,1122,792],{"class":719},[696,1124,1125],{"class":709}," size",[696,1127,716],{"class":701},[696,1129,1130],{"class":719},"\"sm\"",[696,1132,723],{"class":701},[696,1134,1135,1137,1139,1141,1143,1145,1147,1149,1151,1153,1155],{"class":698,"line":726},[696,1136,781],{"class":701},[696,1138,819],{"class":705},[696,1140,822],{"class":709},[696,1142,716],{"class":701},[696,1144,827],{"class":719},[696,1146,830],{"class":701},[696,1148,827],{"class":719},[696,1150,1125],{"class":709},[696,1152,716],{"class":701},[696,1154,1130],{"class":719},[696,1156,850],{"class":701},[696,1158,1159,1161,1163],{"class":698,"line":752},[696,1160,755],{"class":701},[696,1162,784],{"class":705},[696,1164,723],{"class":701},[696,1166,1167],{"class":698,"line":762},[696,1168,765],{"emptyLinePlaceholder":651},[696,1170,1171,1173,1175,1177,1179,1181,1183,1185,1188],{"class":698,"line":768},[696,1172,702],{"class":701},[696,1174,784],{"class":705},[696,1176,787],{"class":709},[696,1178,716],{"class":701},[696,1180,792],{"class":719},[696,1182,1125],{"class":709},[696,1184,716],{"class":701},[696,1186,1187],{"class":719},"\"lg\"",[696,1189,723],{"class":701},[696,1191,1192,1194,1196,1198,1200,1202,1204,1206,1208,1210,1212],{"class":698,"line":778},[696,1193,781],{"class":701},[696,1195,819],{"class":705},[696,1197,822],{"class":709},[696,1199,716],{"class":701},[696,1201,827],{"class":719},[696,1203,830],{"class":701},[696,1205,827],{"class":719},[696,1207,1125],{"class":709},[696,1209,716],{"class":701},[696,1211,1187],{"class":719},[696,1213,850],{"class":701},[696,1215,1216,1218,1220],{"class":698,"line":813},[696,1217,755],{"class":701},[696,1219,784],{"class":705},[696,1221,723],{"class":701},[871,1223,1225],{"id":1224},"orientation","Orientation",[661,1227,1228,1231,1232,6,1234,1236],{},[665,1229,1230],{},"orientation=\"horizontal\""," places the label beside the control instead\nof above it, with the control filling the remaining row width - useful\nfor settings-page-style label-left forms. ",[665,1233,675],{},[665,1235,678],{}," still render\nfull-width below the row either way:",[687,1238,1240],{"className":885,"code":1239,"language":887,"meta":692,"style":692},"\u003CSFormField label=\"Email\" orientation=\"horizontal\">\n  \u003CSInput v-model=\"email\" \u002F>\n\u003C\u002FSFormField>\n",[665,1241,1242,1264,1282],{"__ignoreMap":692},[696,1243,1244,1246,1248,1250,1252,1254,1257,1259,1262],{"class":698,"line":8},[696,1245,702],{"class":701},[696,1247,784],{"class":705},[696,1249,787],{"class":709},[696,1251,716],{"class":701},[696,1253,792],{"class":719},[696,1255,1256],{"class":709}," orientation",[696,1258,716],{"class":701},[696,1260,1261],{"class":719},"\"horizontal\"",[696,1263,723],{"class":701},[696,1265,1266,1268,1270,1272,1274,1276,1278,1280],{"class":698,"line":726},[696,1267,781],{"class":701},[696,1269,819],{"class":705},[696,1271,822],{"class":709},[696,1273,716],{"class":701},[696,1275,827],{"class":719},[696,1277,830],{"class":701},[696,1279,827],{"class":719},[696,1281,850],{"class":701},[696,1283,1284,1286,1288],{"class":698,"line":752},[696,1285,755],{"class":701},[696,1287,784],{"class":705},[696,1289,723],{"class":701},[871,1291,1293],{"id":1292},"floating-label","Floating label",[661,1295,1296,1299,1300,1303,1304,1306,1307,1310],{},[665,1297,1298],{},"label-mode=\"floating\""," places the label over an empty control and moves it\nabove the border when the control is focused or has a value. It keeps the same\nnative label association, hint, and error behavior. Input and Textarea detect\ntheir native value state; Select, Autocomplete, and DatePicker expose their\nselection state to the field. For a custom control, pass ",[665,1301,1302],{},":filled"," when it has\na value. Floating mode uses the vertical layout even if ",[665,1305,1224],{}," is set\nto ",[665,1308,1309],{},"horizontal",". DatePicker's editable segmented field keeps the label raised\nwhile empty so its day, month, and year placeholders remain visible and typeable.",[1312,1313],"component-example",{"name":1314},"form-field-floating",[687,1316,1318],{"className":885,"code":1317,"language":887,"meta":692,"style":692},"\u003CSFormField label=\"Email\" label-mode=\"floating\" hint=\"We'll send your receipt here.\">\n  \u003CSInput v-model=\"email\" type=\"email\" \u002F>\n\u003C\u002FSFormField>\n",[665,1319,1320,1349,1373],{"__ignoreMap":692},[696,1321,1322,1324,1326,1328,1330,1332,1335,1337,1340,1342,1344,1347],{"class":698,"line":8},[696,1323,702],{"class":701},[696,1325,784],{"class":705},[696,1327,787],{"class":709},[696,1329,716],{"class":701},[696,1331,792],{"class":719},[696,1333,1334],{"class":709}," label-mode",[696,1336,716],{"class":701},[696,1338,1339],{"class":719},"\"floating\"",[696,1341,803],{"class":709},[696,1343,716],{"class":701},[696,1345,1346],{"class":719},"\"We'll send your receipt here.\"",[696,1348,723],{"class":701},[696,1350,1351,1353,1355,1357,1359,1361,1363,1365,1367,1369,1371],{"class":698,"line":726},[696,1352,781],{"class":701},[696,1354,819],{"class":705},[696,1356,822],{"class":709},[696,1358,716],{"class":701},[696,1360,827],{"class":719},[696,1362,830],{"class":701},[696,1364,827],{"class":719},[696,1366,835],{"class":709},[696,1368,716],{"class":701},[696,1370,800],{"class":719},[696,1372,850],{"class":701},[696,1374,1375,1377,1379],{"class":698,"line":752},[696,1376,755],{"class":701},[696,1378,784],{"class":705},[696,1380,723],{"class":701},[661,1382,1383,1384,1387,1388,1392,1393,1395],{},"An ",[665,1385,1386],{},"SInputGroup"," containing one Input or Select plus an addon button also\nworks when the control comes first. For two editable controls, wrap ",[1389,1390,1391],"strong",{},"each","\ninput in its own ",[665,1394,784],{}," so both have independent labels, names, and\nvalidation state. This works with either InputGroup orientation:",[1312,1397],{"name":1398},"form-field-grouped",[871,1400,1402],{"id":1401},"works-with-any-control","Works with any control",[687,1404,1406],{"className":885,"code":1405,"language":887,"meta":692,"style":692},"\u003CSFormField label=\"Plan\" name=\"plan\">\n  \u003CSSelect v-model=\"plan\" :items=\"planItems\" \u002F>\n\u003C\u002FSFormField>\n\n\u003CSFormField error=\"You must accept the terms\">\n  \u003CSCheckbox v-model=\"accepted\" label=\"Accept terms\" \u002F>\n\u003C\u002FSFormField>\n",[665,1407,1408,1430,1465,1473,1477,1492,1519],{"__ignoreMap":692},[696,1409,1410,1412,1414,1416,1418,1421,1423,1425,1428],{"class":698,"line":8},[696,1411,702],{"class":701},[696,1413,784],{"class":705},[696,1415,787],{"class":709},[696,1417,716],{"class":701},[696,1419,1420],{"class":719},"\"Plan\"",[696,1422,795],{"class":709},[696,1424,716],{"class":701},[696,1426,1427],{"class":719},"\"plan\"",[696,1429,723],{"class":701},[696,1431,1432,1434,1437,1439,1441,1443,1446,1448,1451,1454,1456,1458,1461,1463],{"class":698,"line":726},[696,1433,781],{"class":701},[696,1435,1436],{"class":705},"SSelect",[696,1438,822],{"class":709},[696,1440,716],{"class":701},[696,1442,827],{"class":719},[696,1444,1445],{"class":701},"plan",[696,1447,827],{"class":719},[696,1449,1450],{"class":701}," :",[696,1452,1453],{"class":709},"items",[696,1455,716],{"class":701},[696,1457,827],{"class":719},[696,1459,1460],{"class":701},"planItems",[696,1462,827],{"class":719},[696,1464,850],{"class":701},[696,1466,1467,1469,1471],{"class":698,"line":752},[696,1468,755],{"class":701},[696,1470,784],{"class":705},[696,1472,723],{"class":701},[696,1474,1475],{"class":698,"line":762},[696,1476,765],{"emptyLinePlaceholder":651},[696,1478,1479,1481,1483,1485,1487,1490],{"class":698,"line":768},[696,1480,702],{"class":701},[696,1482,784],{"class":705},[696,1484,988],{"class":709},[696,1486,716],{"class":701},[696,1488,1489],{"class":719},"\"You must accept the terms\"",[696,1491,723],{"class":701},[696,1493,1494,1496,1499,1501,1503,1505,1508,1510,1512,1514,1517],{"class":698,"line":778},[696,1495,781],{"class":701},[696,1497,1498],{"class":705},"SCheckbox",[696,1500,822],{"class":709},[696,1502,716],{"class":701},[696,1504,827],{"class":719},[696,1506,1507],{"class":701},"accepted",[696,1509,827],{"class":719},[696,1511,787],{"class":709},[696,1513,716],{"class":701},[696,1515,1516],{"class":719},"\"Accept terms\"",[696,1518,850],{"class":701},[696,1520,1521,1523,1525],{"class":698,"line":813},[696,1522,755],{"class":701},[696,1524,784],{"class":705},[696,1526,723],{"class":701},[661,1528,1529,1530,6,1532,1534,1535,1537],{},"A control's own ",[665,1531,667],{},[665,1533,1069],{}," still win over FormField's if you set them\nexplicitly. ",[665,1536,956],{}," is OR'd with the field's error state instead, so a\ncontrol can opt into looking invalid on its own even without an error, but\ncan't be forced back to valid while its FormField has one.",[871,1539,1541,1542],{"id":1540},"custom-ui","Custom ",[665,1543,1544],{},":ui",[661,1546,1547,1548,1550],{},"To see exactly what you'd be overriding - the current default classes for\nevery slot and variant - here's ",[665,1549,292],{},"'s own theme file:",[1552,1553],"theme-source",{"name":1554},"form-field",[656,1556,1558],{"id":1557},"props","Props",[1560,1561,1562,1578],"table",{},[1563,1564,1565],"thead",{},[1566,1567,1568,1572,1575],"tr",{},[1569,1570,1571],"th",{},"Prop",[1569,1573,1574],{},"Type",[1569,1576,1577],{},"Default",[1579,1580,1581,1597,1609,1621,1633,1646,1663,1676,1692,1709,1724],"tbody",{},[1566,1582,1583,1589,1594],{},[1584,1585,1586],"td",{},[665,1587,1588],{},"label",[1584,1590,1591],{},[665,1592,1593],{},"string",[1584,1595,1596],{},"-",[1566,1598,1599,1603,1607],{},[1584,1600,1601],{},[665,1602,1069],{},[1584,1604,1605],{},[665,1606,1593],{},[1584,1608,1596],{},[1566,1610,1611,1615,1619],{},[1584,1612,1613],{},[665,1614,873],{},[1584,1616,1617],{},[665,1618,1593],{},[1584,1620,1596],{},[1566,1622,1623,1627,1631],{},[1584,1624,1625],{},[665,1626,675],{},[1584,1628,1629],{},[665,1630,1593],{},[1584,1632,1596],{},[1566,1634,1635,1639,1644],{},[1584,1636,1637],{},[665,1638,678],{},[1584,1640,1641],{},[665,1642,1643],{},"string | boolean",[1584,1645,1596],{},[1566,1647,1648,1653,1658],{},[1584,1649,1650],{},[665,1651,1652],{},"required",[1584,1654,1655],{},[665,1656,1657],{},"boolean",[1584,1659,1660],{},[665,1661,1662],{},"false",[1566,1664,1665,1669,1674],{},[1584,1666,1667],{},[665,1668,1090],{},[1584,1670,1671],{},[665,1672,1673],{},"'sm' | 'md' | 'lg'",[1584,1675,1596],{},[1566,1677,1678,1682,1687],{},[1584,1679,1680],{},[665,1681,1224],{},[1584,1683,1684],{},[665,1685,1686],{},"'vertical' | 'horizontal'",[1584,1688,1689],{},[665,1690,1691],{},"vertical",[1566,1693,1694,1699,1704],{},[1584,1695,1696],{},[665,1697,1698],{},"labelMode",[1584,1700,1701],{},[665,1702,1703],{},"'static' | 'floating'",[1584,1705,1706],{},[665,1707,1708],{},"static",[1566,1710,1711,1716,1720],{},[1584,1712,1713],{},[665,1714,1715],{},"filled",[1584,1717,1718],{},[665,1719,1657],{},[1584,1721,1722],{},[665,1723,1662],{},[1566,1725,1726,1731,1736],{},[1584,1727,1728],{},[665,1729,1730],{},"ui",[1584,1732,1733],{},[665,1734,1735],{},"Partial\u003CRecord\u003C'root' | 'body' | 'header' | 'label' | 'required' | 'description' | 'container' | 'hint' | 'error', string | object>>",[1584,1737,1596],{},[656,1739,1741],{"id":1740},"slots","Slots",[1560,1743,1744,1755],{},[1563,1745,1746],{},[1566,1747,1748,1751,1753],{},[1569,1749,1750],{},"Slot",[1569,1752,1558],{},[1569,1754,874],{},[1579,1756,1757,1770],{},[1566,1758,1759,1762,1767],{},[1584,1760,1761],{},"default",[1584,1763,1764],{},[665,1765,1766],{},"{ id, invalid, describedBy }",[1584,1768,1769],{},"The wrapped control. Props are also available if you need to bind them manually.",[1566,1771,1772,1776,1778],{},[1584,1773,1774],{},[665,1775,873],{},[1584,1777,1596],{},[1584,1779,1780,1781],{},"Custom content, overrides ",[665,1782,873],{},[1784,1785,1786],"style",{},"html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .s9eBZ, html code.shiki .s9eBZ{--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}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);}",{"title":692,"searchDepth":752,"depth":752,"links":1788},[1789,1800,1801],{"id":658,"depth":726,"text":659,"children":1790},[1791,1792,1793,1794,1795,1796,1797,1798],{"id":873,"depth":752,"text":874},{"id":946,"depth":752,"text":947},{"id":1030,"depth":752,"text":1031},{"id":1084,"depth":752,"text":1085},{"id":1224,"depth":752,"text":1225},{"id":1292,"depth":752,"text":1293},{"id":1401,"depth":752,"text":1402},{"id":1540,"depth":752,"text":1799},"Custom :ui",{"id":1557,"depth":726,"text":1558},{"id":1740,"depth":726,"text":1741},"Label, description, hint, and error-message wrapper that wires id\u002Faria-describedby\u002Finvalid into whatever form control it wraps.",{},{"title":292,"description":1802},"rERPDkqKYJtT235n2A3eu4_6JFrvrFK3h3ATZgok2Ag",1792056125129]