[{"data":1,"prerenderedAt":2860},["ShallowReactive",2],{"selaras-docs-navigation":3,"selaras-docs:\u002Fcomponents\u002Fforms\u002Fform-field":682},[4,11,128,525,584,626],{"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,70,107],{"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,66],{"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},"Accessibility","\u002Foverview\u002Fgetting-started\u002Faccessibility","overview\u002Fgetting-started\u002Faccessibility",90,{"title":67,"path":68,"stem":69,"order":65,"icon":9,"collapse":10,"navBadges":9},"Migrating to 1.0","\u002Foverview\u002Fgetting-started\u002Fmigrating-to-1","overview\u002Fgetting-started\u002Fmigrating-to-1",{"title":71,"order":30,"icon":9,"collapse":10,"navBadges":9,"path":72,"stem":73,"children":74,"page":10},"Theming","\u002Foverview\u002Ftheming","overview\u002Ftheming",[75,78,82,86,90,94,99,103],{"title":71,"path":76,"stem":77,"order":13,"icon":9,"collapse":10,"navBadges":9},"\u002Foverview\u002Ftheming\u002Foverview","overview\u002Ftheming\u002Foverview",{"title":79,"path":80,"stem":81,"order":30,"icon":9,"collapse":10,"navBadges":9},"CSS tokens","\u002Foverview\u002Ftheming\u002Fcss-tokens","overview\u002Ftheming\u002Fcss-tokens",{"title":83,"path":84,"stem":85,"order":35,"icon":9,"collapse":10,"navBadges":9},"Color roles","\u002Foverview\u002Ftheming\u002Fcolor-roles","overview\u002Ftheming\u002Fcolor-roles",{"title":87,"path":88,"stem":89,"order":40,"icon":9,"collapse":10,"navBadges":9},"Color modes","\u002Foverview\u002Ftheming\u002Fcolor-modes","overview\u002Ftheming\u002Fcolor-modes",{"title":91,"path":92,"stem":93,"order":45,"icon":9,"collapse":10,"navBadges":9},"Component styling","\u002Foverview\u002Ftheming\u002Fcomponent-styling","overview\u002Ftheming\u002Fcomponent-styling",{"title":95,"path":96,"stem":97,"order":98,"icon":9,"collapse":10,"navBadges":9},"Global configuration","\u002Foverview\u002Ftheming\u002Fglobal-configuration","overview\u002Ftheming\u002Fglobal-configuration",55,{"title":100,"path":101,"stem":102,"order":50,"icon":9,"collapse":10,"navBadges":9},"Scoped themes","\u002Foverview\u002Ftheming\u002Fscoped-themes","overview\u002Ftheming\u002Fscoped-themes",{"title":104,"path":105,"stem":106,"order":55,"icon":9,"collapse":10,"navBadges":9},"Complete themes","\u002Foverview\u002Ftheming\u002Fcomplete-themes","overview\u002Ftheming\u002Fcomplete-themes",{"title":108,"order":35,"icon":9,"collapse":10,"navBadges":9,"path":109,"stem":110,"children":111,"page":10},"Agent Support","\u002Foverview\u002Fagent-support","overview\u002Fagent-support",[112,116,120,124],{"title":113,"path":114,"stem":115,"order":13,"icon":9,"collapse":10,"navBadges":9},"Agent support","\u002Foverview\u002Fagent-support\u002Foverview","overview\u002Fagent-support\u002Foverview",{"title":117,"path":118,"stem":119,"order":30,"icon":9,"collapse":10,"navBadges":9},"Documentation exports","\u002Foverview\u002Fagent-support\u002Fdocumentation","overview\u002Fagent-support\u002Fdocumentation",{"title":121,"path":122,"stem":123,"order":35,"icon":9,"collapse":10,"navBadges":9},"Skills","\u002Foverview\u002Fagent-support\u002Fskills","overview\u002Fagent-support\u002Fskills",{"title":125,"path":126,"stem":127,"order":40,"icon":9,"collapse":10,"navBadges":9},"MCP","\u002Foverview\u002Fagent-support\u002Fmcp","overview\u002Fagent-support\u002Fmcp",{"title":129,"order":30,"icon":9,"collapse":10,"navBadges":9,"path":130,"stem":131,"children":132,"page":10},"Components","\u002Fcomponents","components",[133,210,313,336,380,433,486],{"title":134,"path":135,"stem":136,"children":137,"page":10},"Elements","\u002Fcomponents\u002Felements","components\u002Felements",[138,142,147,152,157,162,166,171,176,181,186,191,196,201,205],{"title":139,"path":140,"stem":141,"order":13,"icon":9,"collapse":10,"navBadges":9},"Button","\u002Fcomponents\u002Felements\u002Fbutton","components\u002Felements\u002Fbutton",{"title":143,"path":144,"stem":145,"order":146,"icon":9,"collapse":10,"navBadges":9},"ButtonGroup","\u002Fcomponents\u002Felements\u002Fbutton-group","components\u002Felements\u002Fbutton-group",10.5,{"title":148,"path":149,"stem":150,"order":151,"icon":9,"collapse":10,"navBadges":9},"Badge","\u002Fcomponents\u002Felements\u002Fbadge","components\u002Felements\u002Fbadge",11,{"title":153,"path":154,"stem":155,"order":156,"icon":9,"collapse":10,"navBadges":9},"Avatar","\u002Fcomponents\u002Felements\u002Favatar","components\u002Felements\u002Favatar",11.25,{"title":158,"path":159,"stem":160,"order":161,"icon":9,"collapse":10,"navBadges":9},"AvatarGroup","\u002Fcomponents\u002Felements\u002Favatar-group","components\u002Felements\u002Favatar-group",11.5,{"title":163,"path":164,"stem":165,"order":161,"icon":9,"collapse":10,"navBadges":9},"Chip","\u002Fcomponents\u002Felements\u002Fchip","components\u002Felements\u002Fchip",{"title":167,"path":168,"stem":169,"order":170,"icon":9,"collapse":10,"navBadges":9},"Icon","\u002Fcomponents\u002Felements\u002Ficon","components\u002Felements\u002Ficon",12,{"title":172,"path":173,"stem":174,"order":175,"icon":9,"collapse":10,"navBadges":9},"Skeleton","\u002Fcomponents\u002Felements\u002Fskeleton","components\u002Felements\u002Fskeleton",12.5,{"title":177,"path":178,"stem":179,"order":180,"icon":9,"collapse":10,"navBadges":9},"Separator","\u002Fcomponents\u002Felements\u002Fseparator","components\u002Felements\u002Fseparator",12.75,{"title":182,"path":183,"stem":184,"order":185,"icon":9,"collapse":10,"navBadges":9},"Alert","\u002Fcomponents\u002Felements\u002Falert","components\u002Felements\u002Falert",12.9,{"title":187,"path":188,"stem":189,"order":190,"icon":9,"collapse":10,"navBadges":9},"Toggle","\u002Fcomponents\u002Felements\u002Ftoggle","components\u002Felements\u002Ftoggle",12.92,{"title":192,"path":193,"stem":194,"order":195,"icon":9,"collapse":10,"navBadges":9},"Toggle Group","\u002Fcomponents\u002Felements\u002Ftoggle-group","components\u002Felements\u002Ftoggle-group",12.94,{"title":197,"path":198,"stem":199,"order":200,"icon":9,"collapse":10,"navBadges":9},"Kbd","\u002Fcomponents\u002Felements\u002Fkbd","components\u002Felements\u002Fkbd",12.95,{"title":202,"path":203,"stem":204,"order":200,"icon":9,"collapse":10,"navBadges":9},"Toolbar","\u002Fcomponents\u002Felements\u002Ftoolbar","components\u002Felements\u002Ftoolbar",{"title":206,"path":207,"stem":208,"order":209,"icon":9,"collapse":10,"navBadges":9},"Progress","\u002Fcomponents\u002Felements\u002Fprogress","components\u002Felements\u002Fprogress",12.97,{"title":211,"path":212,"stem":213,"children":214,"page":10},"Forms","\u002Fcomponents\u002Fforms","components\u002Fforms",[215,219,224,229,233,238,243,248,253,258,263,268,273,278,283,288,293,298,303,308],{"title":216,"path":217,"stem":218,"order":30,"icon":9,"collapse":10,"navBadges":9},"Input","\u002Fcomponents\u002Fforms\u002Finput","components\u002Fforms\u002Finput",{"title":220,"path":221,"stem":222,"order":223,"icon":9,"collapse":10,"navBadges":9},"InputGroup","\u002Fcomponents\u002Fforms\u002Finput-group","components\u002Fforms\u002Finput-group",20.25,{"title":225,"path":226,"stem":227,"order":228,"icon":9,"collapse":10,"navBadges":9},"Editable","\u002Fcomponents\u002Fforms\u002Feditable","components\u002Fforms\u002Feditable",20.5,{"title":230,"path":231,"stem":232,"order":228,"icon":9,"collapse":10,"navBadges":9},"InputNumber","\u002Fcomponents\u002Fforms\u002Finput-number","components\u002Fforms\u002Finput-number",{"title":234,"path":235,"stem":236,"order":237,"icon":9,"collapse":10,"navBadges":9},"Slider","\u002Fcomponents\u002Fforms\u002Fslider","components\u002Fforms\u002Fslider",20.75,{"title":239,"path":240,"stem":241,"order":242,"icon":9,"collapse":10,"navBadges":9},"PinInput","\u002Fcomponents\u002Fforms\u002Fpin-input","components\u002Fforms\u002Fpin-input",20.9,{"title":244,"path":245,"stem":246,"order":247,"icon":9,"collapse":10,"navBadges":9},"Textarea","\u002Fcomponents\u002Fforms\u002Ftextarea","components\u002Fforms\u002Ftextarea",21,{"title":249,"path":250,"stem":251,"order":252,"icon":9,"collapse":10,"navBadges":9},"FileUpload","\u002Fcomponents\u002Fforms\u002Ffile-upload","components\u002Fforms\u002Ffile-upload",21.5,{"title":254,"path":255,"stem":256,"order":257,"icon":9,"collapse":10,"navBadges":9},"Select","\u002Fcomponents\u002Fforms\u002Fselect","components\u002Fforms\u002Fselect",22,{"title":259,"path":260,"stem":261,"order":262,"icon":9,"collapse":10,"navBadges":9},"Listbox","\u002Fcomponents\u002Fforms\u002Flistbox","components\u002Fforms\u002Flistbox",22.5,{"title":264,"path":265,"stem":266,"order":267,"icon":9,"collapse":10,"navBadges":9},"TransferList","\u002Fcomponents\u002Fforms\u002Ftransfer-list","components\u002Fforms\u002Ftransfer-list",22.75,{"title":269,"path":270,"stem":271,"order":272,"icon":9,"collapse":10,"navBadges":9},"Autocomplete","\u002Fcomponents\u002Fforms\u002Fautocomplete","components\u002Fforms\u002Fautocomplete",23,{"title":274,"path":275,"stem":276,"order":277,"icon":9,"collapse":10,"navBadges":9},"DatePicker","\u002Fcomponents\u002Fforms\u002Fdate-picker","components\u002Fforms\u002Fdate-picker",23.5,{"title":279,"path":280,"stem":281,"order":282,"icon":9,"collapse":10,"navBadges":9},"ColorPicker","\u002Fcomponents\u002Fforms\u002Fcolor-picker","components\u002Fforms\u002Fcolor-picker",23.75,{"title":284,"path":285,"stem":286,"order":287,"icon":9,"collapse":10,"navBadges":9},"Checkbox","\u002Fcomponents\u002Fforms\u002Fcheckbox","components\u002Fforms\u002Fcheckbox",24,{"title":289,"path":290,"stem":291,"order":292,"icon":9,"collapse":10,"navBadges":9},"RadioGroup","\u002Fcomponents\u002Fforms\u002Fradio-group","components\u002Fforms\u002Fradio-group",25,{"title":294,"path":295,"stem":296,"order":297,"icon":9,"collapse":10,"navBadges":9},"Rating","\u002Fcomponents\u002Fforms\u002Frating","components\u002Fforms\u002Frating",25.5,{"title":299,"path":300,"stem":301,"order":302,"icon":9,"collapse":10,"navBadges":9},"Switch","\u002Fcomponents\u002Fforms\u002Fswitch","components\u002Fforms\u002Fswitch",26,{"title":304,"path":305,"stem":306,"order":307,"icon":9,"collapse":10,"navBadges":9},"FormField","\u002Fcomponents\u002Fforms\u002Fform-field","components\u002Fforms\u002Fform-field",27,{"title":309,"path":310,"stem":311,"order":312,"icon":9,"collapse":10,"navBadges":9},"Form Validation","\u002Fcomponents\u002Fforms\u002Fvalidation","components\u002Fforms\u002Fvalidation",28,{"title":314,"path":315,"stem":316,"children":317,"page":10},"Data","\u002Fcomponents\u002Fdata","components\u002Fdata",[318,322,327,331],{"title":319,"path":320,"stem":321,"order":312,"icon":9,"collapse":10,"navBadges":9},"EmptyState","\u002Fcomponents\u002Fdata\u002Fempty-state","components\u002Fdata\u002Fempty-state",{"title":323,"path":324,"stem":325,"order":326,"icon":9,"collapse":10,"navBadges":9},"Calendar","\u002Fcomponents\u002Fdata\u002Fcalendar","components\u002Fdata\u002Fcalendar",29,{"title":328,"path":329,"stem":330,"order":35,"icon":9,"collapse":10,"navBadges":9},"Table","\u002Fcomponents\u002Fdata\u002Ftable","components\u002Fdata\u002Ftable",{"title":332,"path":333,"stem":334,"order":335,"icon":9,"collapse":10,"navBadges":9},"Timeline","\u002Fcomponents\u002Fdata\u002Ftimeline","components\u002Fdata\u002Ftimeline",31,{"title":337,"path":338,"stem":339,"children":340,"page":10},"Navigation","\u002Fcomponents\u002Fnavigation","components\u002Fnavigation",[341,346,350,355,360,365,370,375],{"title":342,"path":343,"stem":344,"order":345,"icon":9,"collapse":10,"navBadges":9},"Breadcrumb","\u002Fcomponents\u002Fnavigation\u002Fbreadcrumb","components\u002Fnavigation\u002Fbreadcrumb",39,{"title":347,"path":348,"stem":349,"order":40,"icon":9,"collapse":10,"navBadges":9},"Tabs","\u002Fcomponents\u002Fnavigation\u002Ftabs","components\u002Fnavigation\u002Ftabs",{"title":351,"path":352,"stem":353,"order":354,"icon":9,"collapse":10,"navBadges":9},"Stepper","\u002Fcomponents\u002Fnavigation\u002Fstepper","components\u002Fnavigation\u002Fstepper",40.5,{"title":356,"path":357,"stem":358,"order":359,"icon":9,"collapse":10,"navBadges":9},"Accordion","\u002Fcomponents\u002Fnavigation\u002Faccordion","components\u002Fnavigation\u002Faccordion",41,{"title":361,"path":362,"stem":363,"order":364,"icon":9,"collapse":10,"navBadges":9},"Collapsible","\u002Fcomponents\u002Fnavigation\u002Fcollapsible","components\u002Fnavigation\u002Fcollapsible",41.5,{"title":366,"path":367,"stem":368,"order":369,"icon":9,"collapse":10,"navBadges":9},"Tree","\u002Fcomponents\u002Fnavigation\u002Ftree","components\u002Fnavigation\u002Ftree",41.75,{"title":371,"path":372,"stem":373,"order":374,"icon":9,"collapse":10,"navBadges":9},"Pagination","\u002Fcomponents\u002Fnavigation\u002Fpagination","components\u002Fnavigation\u002Fpagination",44,{"title":376,"path":377,"stem":378,"order":379,"icon":9,"collapse":10,"navBadges":9},"NavigationMenu","\u002Fcomponents\u002Fnavigation\u002Fnavigation-menu","components\u002Fnavigation\u002Fnavigation-menu",45,{"title":381,"path":382,"stem":383,"children":384,"page":10},"Overlays","\u002Fcomponents\u002Foverlays","components\u002Foverlays",[385,389,394,399,404,409,414,419,424,428],{"title":386,"path":387,"stem":388,"order":45,"icon":9,"collapse":10,"navBadges":9},"Modal","\u002Fcomponents\u002Foverlays\u002Fmodal","components\u002Foverlays\u002Fmodal",{"title":390,"path":391,"stem":392,"order":393,"icon":9,"collapse":10,"navBadges":9},"AlertDialog","\u002Fcomponents\u002Foverlays\u002Falert-dialog","components\u002Foverlays\u002Falert-dialog",50.5,{"title":395,"path":396,"stem":397,"order":398,"icon":9,"collapse":10,"navBadges":9},"Dropdown","\u002Fcomponents\u002Foverlays\u002Fdropdown","components\u002Foverlays\u002Fdropdown",51,{"title":400,"path":401,"stem":402,"order":403,"icon":9,"collapse":10,"navBadges":9},"Context Menu","\u002Fcomponents\u002Foverlays\u002Fcontext-menu","components\u002Foverlays\u002Fcontext-menu",51.5,{"title":405,"path":406,"stem":407,"order":408,"icon":9,"collapse":10,"navBadges":9},"Tooltip","\u002Fcomponents\u002Foverlays\u002Ftooltip","components\u002Foverlays\u002Ftooltip",52,{"title":410,"path":411,"stem":412,"order":413,"icon":9,"collapse":10,"navBadges":9},"Toast","\u002Fcomponents\u002Foverlays\u002Ftoast","components\u002Foverlays\u002Ftoast",53,{"title":415,"path":416,"stem":417,"order":418,"icon":9,"collapse":10,"navBadges":9},"Slideover","\u002Fcomponents\u002Foverlays\u002Fslideover","components\u002Foverlays\u002Fslideover",54,{"title":420,"path":421,"stem":422,"order":423,"icon":9,"collapse":10,"navBadges":9},"Command Palette","\u002Fcomponents\u002Foverlays\u002Fcommand-palette","components\u002Foverlays\u002Fcommand-palette",54.5,{"title":425,"path":426,"stem":427,"order":98,"icon":9,"collapse":10,"navBadges":9},"Popover","\u002Fcomponents\u002Foverlays\u002Fpopover","components\u002Foverlays\u002Fpopover",{"title":429,"path":430,"stem":431,"order":432,"icon":9,"collapse":10,"navBadges":9},"Drawer","\u002Fcomponents\u002Foverlays\u002Fdrawer","components\u002Foverlays\u002Fdrawer",56,{"title":434,"path":435,"stem":436,"children":437,"page":10},"Layout","\u002Fcomponents\u002Flayout","components\u002Flayout",[438,443,447,452,457,462,466,471,476,481],{"title":439,"path":440,"stem":441,"order":442,"icon":9,"collapse":10,"navBadges":9},"App","\u002Fcomponents\u002Flayout\u002Fapp","components\u002Flayout\u002Fapp",59,{"title":444,"path":445,"stem":446,"order":50,"icon":9,"collapse":10,"navBadges":9},"Container","\u002Fcomponents\u002Flayout\u002Fcontainer","components\u002Flayout\u002Fcontainer",{"title":448,"path":449,"stem":450,"order":451,"icon":9,"collapse":10,"navBadges":9},"Header","\u002Fcomponents\u002Flayout\u002Fheader","components\u002Flayout\u002Fheader",63,{"title":453,"path":454,"stem":455,"order":456,"icon":9,"collapse":10,"navBadges":9},"ColorModeToggle","\u002Fcomponents\u002Flayout\u002Fcolor-mode-toggle","components\u002Flayout\u002Fcolor-mode-toggle",64,{"title":458,"path":459,"stem":460,"order":461,"icon":9,"collapse":10,"navBadges":9},"ColorModeSwitch","\u002Fcomponents\u002Flayout\u002Fcolor-mode-switch","components\u002Flayout\u002Fcolor-mode-switch",65,{"title":463,"path":464,"stem":465,"order":461,"icon":9,"collapse":10,"navBadges":9},"ScrollArea","\u002Fcomponents\u002Flayout\u002Fscroll-area","components\u002Flayout\u002Fscroll-area",{"title":467,"path":468,"stem":469,"order":470,"icon":9,"collapse":10,"navBadges":9},"Card","\u002Fcomponents\u002Flayout\u002Fcard","components\u002Flayout\u002Fcard",66,{"title":472,"path":473,"stem":474,"order":475,"icon":9,"collapse":10,"navBadges":9},"CardGroup","\u002Fcomponents\u002Flayout\u002Fcard-group","components\u002Flayout\u002Fcard-group",67,{"title":477,"path":478,"stem":479,"order":480,"icon":9,"collapse":10,"navBadges":9},"Splitter","\u002Fcomponents\u002Flayout\u002Fsplitter","components\u002Flayout\u002Fsplitter",68,{"title":482,"path":483,"stem":484,"order":485,"icon":9,"collapse":10,"navBadges":9},"Theme","\u002Fcomponents\u002Flayout\u002Ftheme","components\u002Flayout\u002Ftheme",69,{"title":487,"path":488,"stem":489,"children":490,"page":10},"Typography","\u002Fcomponents\u002Ftypography","components\u002Ftypography",[491,495,500,505,510,515,520],{"title":492,"path":493,"stem":494,"order":55,"icon":9,"collapse":10,"navBadges":9},"Prose","\u002Fcomponents\u002Ftypography\u002Fprose","components\u002Ftypography\u002Fprose",{"title":496,"path":497,"stem":498,"order":499,"icon":9,"collapse":10,"navBadges":9},"CodeGroup","\u002Fcomponents\u002Ftypography\u002Fcode-group","components\u002Ftypography\u002Fcode-group",71,{"title":501,"path":502,"stem":503,"order":504,"icon":9,"collapse":10,"navBadges":9},"Callout","\u002Fcomponents\u002Ftypography\u002Fcallout","components\u002Ftypography\u002Fcallout",72,{"title":506,"path":507,"stem":508,"order":509,"icon":9,"collapse":10,"navBadges":9},"CodeButton","\u002Fcomponents\u002Ftypography\u002Fcode-button","components\u002Ftypography\u002Fcode-button",73,{"title":511,"path":512,"stem":513,"order":514,"icon":9,"collapse":10,"navBadges":9},"ReadMore","\u002Fcomponents\u002Ftypography\u002Fread-more","components\u002Ftypography\u002Fread-more",74,{"title":516,"path":517,"stem":518,"order":519,"icon":9,"collapse":10,"navBadges":9},"FileTree","\u002Fcomponents\u002Ftypography\u002Ffile-tree","components\u002Ftypography\u002Ffile-tree",75,{"title":521,"path":522,"stem":523,"order":524,"icon":9,"collapse":10,"navBadges":9},"CodeTree","\u002Fcomponents\u002Ftypography\u002Fcode-tree","components\u002Ftypography\u002Fcode-tree",76,{"title":526,"order":35,"icon":9,"collapse":10,"navBadges":9,"path":527,"stem":528,"children":529,"page":10},"Composites","\u002Fcomposites","composites",[530,559],{"title":531,"path":532,"stem":533,"children":534,"page":10},"Dashboard","\u002Fcomposites\u002Fdashboard","composites\u002Fdashboard",[535,539,543,547,551,555],{"title":536,"path":537,"stem":538,"order":13,"icon":9,"collapse":10,"navBadges":9},"DashboardGroup","\u002Fcomposites\u002Fdashboard\u002Fdashboard-group","composites\u002Fdashboard\u002Fdashboard-group",{"title":540,"path":541,"stem":542,"order":30,"icon":9,"collapse":10,"navBadges":9},"DashboardSidebar","\u002Fcomposites\u002Fdashboard\u002Fdashboard-sidebar","composites\u002Fdashboard\u002Fdashboard-sidebar",{"title":544,"path":545,"stem":546,"order":35,"icon":9,"collapse":10,"navBadges":9},"DashboardPanel","\u002Fcomposites\u002Fdashboard\u002Fdashboard-panel","composites\u002Fdashboard\u002Fdashboard-panel",{"title":548,"path":549,"stem":550,"order":40,"icon":9,"collapse":10,"navBadges":9},"DashboardResizeHandle","\u002Fcomposites\u002Fdashboard\u002Fdashboard-resize-handle","composites\u002Fdashboard\u002Fdashboard-resize-handle",{"title":552,"path":553,"stem":554,"order":45,"icon":9,"collapse":10,"navBadges":9},"DashboardNavbar","\u002Fcomposites\u002Fdashboard\u002Fdashboard-navbar","composites\u002Fdashboard\u002Fdashboard-navbar",{"title":556,"path":557,"stem":558,"order":50,"icon":9,"collapse":10,"navBadges":9},"DashboardSidebarToggle","\u002Fcomposites\u002Fdashboard\u002Fdashboard-sidebar-toggle","composites\u002Fdashboard\u002Fdashboard-sidebar-toggle",{"title":560,"path":561,"stem":562,"children":563,"page":10},"Documentation","\u002Fcomposites\u002Fdocumentation","composites\u002Fdocumentation",[564,568,572,576,580],{"title":565,"path":566,"stem":567,"order":13,"icon":9,"collapse":10,"navBadges":9},"PageHeader","\u002Fcomposites\u002Fdocumentation\u002Fpage-header","composites\u002Fdocumentation\u002Fpage-header",{"title":569,"path":570,"stem":571,"order":30,"icon":9,"collapse":10,"navBadges":9},"PageAside","\u002Fcomposites\u002Fdocumentation\u002Fpage-aside","composites\u002Fdocumentation\u002Fpage-aside",{"title":573,"path":574,"stem":575,"order":35,"icon":9,"collapse":10,"navBadges":9},"ContentNavigation","\u002Fcomposites\u002Fdocumentation\u002Fcontent-navigation","composites\u002Fdocumentation\u002Fcontent-navigation",{"title":577,"path":578,"stem":579,"order":40,"icon":9,"collapse":10,"navBadges":9},"ContentToc","\u002Fcomposites\u002Fdocumentation\u002Fcontent-toc","composites\u002Fdocumentation\u002Fcontent-toc",{"title":581,"path":582,"stem":583,"order":45,"icon":9,"collapse":10,"navBadges":9},"ContentSurround","\u002Fcomposites\u002Fdocumentation\u002Fcontent-surround","composites\u002Fdocumentation\u002Fcontent-surround",{"title":585,"order":586,"icon":9,"collapse":10,"navBadges":9,"path":587,"stem":588,"children":589,"page":10},"Blocks",35,"\u002Fblocks","blocks",[590,593,597,601,605,609],{"title":585,"path":591,"stem":592,"order":13,"icon":9,"collapse":10,"navBadges":9},"\u002Fblocks\u002Foverview","blocks\u002Foverview",{"title":594,"path":595,"stem":596,"order":30,"icon":9,"collapse":10,"navBadges":9},"Sign in","\u002Fblocks\u002Fsign-in","blocks\u002Fsign-in",{"title":598,"path":599,"stem":600,"order":35,"icon":9,"collapse":10,"navBadges":9},"Dashboard overview","\u002Fblocks\u002Fdashboard-overview","blocks\u002Fdashboard-overview",{"title":602,"path":603,"stem":604,"order":40,"icon":9,"collapse":10,"navBadges":9},"Profile settings","\u002Fblocks\u002Fprofile-settings","blocks\u002Fprofile-settings",{"title":606,"path":607,"stem":608,"order":45,"icon":9,"collapse":10,"navBadges":9},"Data management","\u002Fblocks\u002Fdata-management","blocks\u002Fdata-management",{"title":610,"order":50,"icon":9,"collapse":10,"navBadges":9,"path":611,"stem":612,"children":613,"page":10},"Editors","\u002Fblocks\u002Feditors","blocks\u002Feditors",[614,618,622],{"title":615,"path":616,"stem":617,"order":13,"icon":9,"collapse":10,"navBadges":9},"Tiptap editor","\u002Fblocks\u002Feditors\u002Ftiptap","blocks\u002Feditors\u002Ftiptap",{"title":619,"path":620,"stem":621,"order":30,"icon":9,"collapse":10,"navBadges":9},"Lexical editor","\u002Fblocks\u002Feditors\u002Flexical","blocks\u002Feditors\u002Flexical",{"title":623,"path":624,"stem":625,"order":35,"icon":9,"collapse":10,"navBadges":9},"Quill editor","\u002Fblocks\u002Feditors\u002Fquill","blocks\u002Feditors\u002Fquill",{"title":627,"order":40,"icon":9,"collapse":10,"navBadges":9,"path":628,"stem":629,"children":630,"page":10},"Utilities","\u002Futilities","utilities",[631,665],{"title":632,"path":633,"stem":634,"children":635,"page":10},"Composables","\u002Futilities\u002Fcomposables","utilities\u002Fcomposables",[636,640,644,649,653,657,661],{"title":637,"path":638,"stem":639,"order":13,"icon":9,"collapse":10,"navBadges":9},"useModal","\u002Futilities\u002Fcomposables\u002Fuse-modal","utilities\u002Fcomposables\u002Fuse-modal",{"title":641,"path":642,"stem":643,"order":170,"icon":9,"collapse":10,"navBadges":9},"useConfirm","\u002Futilities\u002Fcomposables\u002Fuse-confirm","utilities\u002Fcomposables\u002Fuse-confirm",{"title":645,"path":646,"stem":647,"order":648,"icon":9,"collapse":10,"navBadges":9},"useDrawer","\u002Futilities\u002Fcomposables\u002Fuse-drawer","utilities\u002Fcomposables\u002Fuse-drawer",15,{"title":650,"path":651,"stem":652,"order":30,"icon":9,"collapse":10,"navBadges":9},"useSlideover","\u002Futilities\u002Fcomposables\u002Fuse-slideover","utilities\u002Fcomposables\u002Fuse-slideover",{"title":654,"path":655,"stem":656,"order":35,"icon":9,"collapse":10,"navBadges":9},"useIcons","\u002Futilities\u002Fcomposables\u002Fuse-icons","utilities\u002Fcomposables\u002Fuse-icons",{"title":658,"path":659,"stem":660,"order":40,"icon":9,"collapse":10,"navBadges":9},"useMessages","\u002Futilities\u002Fcomposables\u002Fuse-messages","utilities\u002Fcomposables\u002Fuse-messages",{"title":662,"path":663,"stem":664,"order":45,"icon":9,"collapse":10,"navBadges":9},"useLocale","\u002Futilities\u002Fcomposables\u002Fuse-locale","utilities\u002Fcomposables\u002Fuse-locale",{"title":666,"path":667,"stem":668,"children":669,"page":10},"Directives","\u002Futilities\u002Fdirectives","utilities\u002Fdirectives",[670,674,678],{"title":671,"path":672,"stem":673,"order":13,"icon":9,"collapse":10,"navBadges":9},"v-ripple","\u002Futilities\u002Fdirectives\u002Fripple","utilities\u002Fdirectives\u002Fripple",{"title":675,"path":676,"stem":677,"order":648,"icon":9,"collapse":10,"navBadges":9},"v-hotkey","\u002Futilities\u002Fdirectives\u002Fhotkey","utilities\u002Fdirectives\u002Fhotkey",{"title":679,"path":680,"stem":681,"order":30,"icon":9,"collapse":10,"navBadges":9},"v-mask","\u002Futilities\u002Fdirectives\u002Fmask","utilities\u002Fdirectives\u002Fmask",{"byLocale":683,"defaultPath":305},{"en":684,"id":1854},{"id":685,"title":304,"aside":686,"body":687,"collapse":10,"description":1850,"editLink":686,"extension":1133,"icon":9,"issueLink":686,"meta":1851,"navBadges":9,"navigation":9,"order":307,"path":305,"prevNext":686,"seo":1852,"stem":306,"toc":686,"__hash__":1853},"docs\u002Fcomponents\u002Fforms\u002Fform-field.md",true,{"type":688,"value":689,"toc":1835},"minimark",[690,695,721,905,910,918,979,983,1004,1063,1067,1117,1121,1141,1257,1261,1272,1325,1329,1346,1350,1416,1431,1434,1438,1562,1573,1580,1586,1590,1594,1786,1790,1831],[691,692,694],"h2",{"id":693},"usage","Usage",[696,697,698,699,703,704,707,708,6,711,714,715,717,718,720],"p",{},"Wrap any single form control - Input, Textarea, Select, Autocomplete, Checkbox,\nRadioGroup, or Switch - and FormField generates a matching ",[700,701,702],"code",{},"id",", links the\nlabel to it, and computes ",[700,705,706],{},"aria-describedby"," from whichever of ",[700,709,710],{},"hint",[700,712,713],{},"error","\nis currently showing. The wrapped control picks all of this up automatically;\nyou don't pass ",[700,716,702],{}," or ",[700,719,706],{}," yourself.",[722,723,728],"pre",{"className":724,"code":725,"language":726,"meta":727,"style":727},"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","",[700,729,730,759,785,795,801,811,846,886,896],{"__ignoreMap":727},[731,732,734,738,742,746,749,752,756],"span",{"class":733,"line":8},"line",[731,735,737],{"class":736},"sVt8B","\u003C",[731,739,741],{"class":740},"s9eBZ","script",[731,743,745],{"class":744},"sScJk"," setup",[731,747,748],{"class":744}," lang",[731,750,751],{"class":736},"=",[731,753,755],{"class":754},"sZZnC","\"ts\"",[731,757,758],{"class":736},">\n",[731,760,762,766,770,773,776,779,782],{"class":733,"line":761},2,[731,763,765],{"class":764},"szBVR","const",[731,767,769],{"class":768},"sj4cs"," email",[731,771,772],{"class":764}," =",[731,774,775],{"class":744}," ref",[731,777,778],{"class":736},"(",[731,780,781],{"class":754},"''",[731,783,784],{"class":736},")\n",[731,786,788,791,793],{"class":733,"line":787},3,[731,789,790],{"class":736},"\u003C\u002F",[731,792,741],{"class":740},[731,794,758],{"class":736},[731,796,798],{"class":733,"line":797},4,[731,799,800],{"emptyLinePlaceholder":686},"\n",[731,802,804,806,809],{"class":733,"line":803},5,[731,805,737],{"class":736},[731,807,808],{"class":740},"template",[731,810,758],{"class":736},[731,812,814,817,820,823,825,828,831,833,836,839,841,844],{"class":733,"line":813},6,[731,815,816],{"class":736},"  \u003C",[731,818,819],{"class":740},"SFormField",[731,821,822],{"class":744}," label",[731,824,751],{"class":736},[731,826,827],{"class":754},"\"Email\"",[731,829,830],{"class":744}," name",[731,832,751],{"class":736},[731,834,835],{"class":754},"\"email\"",[731,837,838],{"class":744}," hint",[731,840,751],{"class":736},[731,842,843],{"class":754},"\"We'll never share this.\"",[731,845,758],{"class":736},[731,847,849,852,855,858,860,863,866,868,871,873,875,878,880,883],{"class":733,"line":848},7,[731,850,851],{"class":736},"    \u003C",[731,853,854],{"class":740},"SInput",[731,856,857],{"class":744}," v-model",[731,859,751],{"class":736},[731,861,862],{"class":754},"\"",[731,864,865],{"class":736},"email",[731,867,862],{"class":754},[731,869,870],{"class":744}," type",[731,872,751],{"class":736},[731,874,835],{"class":754},[731,876,877],{"class":744}," placeholder",[731,879,751],{"class":736},[731,881,882],{"class":754},"\"you@example.com\"",[731,884,885],{"class":736}," \u002F>\n",[731,887,889,892,894],{"class":733,"line":888},8,[731,890,891],{"class":736},"  \u003C\u002F",[731,893,819],{"class":740},[731,895,758],{"class":736},[731,897,899,901,903],{"class":733,"line":898},9,[731,900,790],{"class":736},[731,902,808],{"class":740},[731,904,758],{"class":736},[906,907,909],"h3",{"id":908},"description","Description",[696,911,912,914,915,917],{},[700,913,908],{}," adds a second, muted line under the label, before the\ncontrol - for context the user should read before reaching it (unlike\n",[700,916,710],{},", which sits below the control instead):",[722,919,923],{"className":920,"code":921,"language":922,"meta":727,"style":727},"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",[700,924,925,947,971],{"__ignoreMap":727},[731,926,927,929,931,933,935,937,940,942,945],{"class":733,"line":8},[731,928,737],{"class":736},[731,930,819],{"class":740},[731,932,822],{"class":744},[731,934,751],{"class":736},[731,936,827],{"class":754},[731,938,939],{"class":744}," description",[731,941,751],{"class":736},[731,943,944],{"class":754},"\"We'll use this to send your receipt.\"",[731,946,758],{"class":736},[731,948,949,951,953,955,957,959,961,963,965,967,969],{"class":733,"line":761},[731,950,816],{"class":736},[731,952,854],{"class":740},[731,954,857],{"class":744},[731,956,751],{"class":736},[731,958,862],{"class":754},[731,960,865],{"class":736},[731,962,862],{"class":754},[731,964,870],{"class":744},[731,966,751],{"class":736},[731,968,835],{"class":754},[731,970,885],{"class":736},[731,972,973,975,977],{"class":733,"line":787},[731,974,790],{"class":736},[731,976,819],{"class":740},[731,978,758],{"class":736},[906,980,982],{"id":981},"error-state","Error state",[696,984,985,986,988,989,992,993,996,997,999,1000,1003],{},"Set ",[700,987,713],{}," to a string to show a message in place of the hint and mark the\ncontrol ",[700,990,991],{},"invalid"," (a red ring\u002Foutline, ",[700,994,995],{},"aria-invalid=\"true\"","). Passing\n",[700,998,713],{}," as ",[700,1001,1002],{},"true"," (no message) still marks the control invalid without\nrendering any text.",[722,1005,1007],{"className":920,"code":1006,"language":922,"meta":727,"style":727},"\u003CSFormField label=\"Email\" error=\"Enter a valid email address\">\n  \u003CSInput v-model=\"email\" type=\"email\" \u002F>\n\u003C\u002FSFormField>\n",[700,1008,1009,1031,1055],{"__ignoreMap":727},[731,1010,1011,1013,1015,1017,1019,1021,1024,1026,1029],{"class":733,"line":8},[731,1012,737],{"class":736},[731,1014,819],{"class":740},[731,1016,822],{"class":744},[731,1018,751],{"class":736},[731,1020,827],{"class":754},[731,1022,1023],{"class":744}," error",[731,1025,751],{"class":736},[731,1027,1028],{"class":754},"\"Enter a valid email address\"",[731,1030,758],{"class":736},[731,1032,1033,1035,1037,1039,1041,1043,1045,1047,1049,1051,1053],{"class":733,"line":761},[731,1034,816],{"class":736},[731,1036,854],{"class":740},[731,1038,857],{"class":744},[731,1040,751],{"class":736},[731,1042,862],{"class":754},[731,1044,865],{"class":736},[731,1046,862],{"class":754},[731,1048,870],{"class":744},[731,1050,751],{"class":736},[731,1052,835],{"class":754},[731,1054,885],{"class":736},[731,1056,1057,1059,1061],{"class":733,"line":787},[731,1058,790],{"class":736},[731,1060,819],{"class":740},[731,1062,758],{"class":736},[906,1064,1066],{"id":1065},"required-indicator","Required indicator",[722,1068,1070],{"className":920,"code":1069,"language":922,"meta":727,"style":727},"\u003CSFormField label=\"Name\" required>\n  \u003CSInput v-model=\"name\" \u002F>\n\u003C\u002FSFormField>\n",[700,1071,1072,1090,1109],{"__ignoreMap":727},[731,1073,1074,1076,1078,1080,1082,1085,1088],{"class":733,"line":8},[731,1075,737],{"class":736},[731,1077,819],{"class":740},[731,1079,822],{"class":744},[731,1081,751],{"class":736},[731,1083,1084],{"class":754},"\"Name\"",[731,1086,1087],{"class":744}," required",[731,1089,758],{"class":736},[731,1091,1092,1094,1096,1098,1100,1102,1105,1107],{"class":733,"line":761},[731,1093,816],{"class":736},[731,1095,854],{"class":740},[731,1097,857],{"class":744},[731,1099,751],{"class":736},[731,1101,862],{"class":754},[731,1103,1104],{"class":736},"name",[731,1106,862],{"class":754},[731,1108,885],{"class":736},[731,1110,1111,1113,1115],{"class":733,"line":787},[731,1112,790],{"class":736},[731,1114,819],{"class":740},[731,1116,758],{"class":736},[906,1118,1120],{"id":1119},"sizes","Sizes",[696,1122,1123,1126,1127,1130,1131,1130,1134,1137,1138,1140],{},[700,1124,1125],{},"size"," also scales FormField's own label\u002Fdescription\u002Fhint\u002Ferror text\n(",[700,1128,1129],{},"sm"," \u002F ",[700,1132,1133],{},"md",[700,1135,1136],{},"lg",") - it's the same prop already forwarded to the\nwrapped control's own ",[700,1139,1125],{},", so both stay visually in sync without\nsetting it twice:",[722,1142,1144],{"className":920,"code":1143,"language":922,"meta":727,"style":727},"\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",[700,1145,1146,1168,1192,1200,1204,1225,1249],{"__ignoreMap":727},[731,1147,1148,1150,1152,1154,1156,1158,1161,1163,1166],{"class":733,"line":8},[731,1149,737],{"class":736},[731,1151,819],{"class":740},[731,1153,822],{"class":744},[731,1155,751],{"class":736},[731,1157,827],{"class":754},[731,1159,1160],{"class":744}," size",[731,1162,751],{"class":736},[731,1164,1165],{"class":754},"\"sm\"",[731,1167,758],{"class":736},[731,1169,1170,1172,1174,1176,1178,1180,1182,1184,1186,1188,1190],{"class":733,"line":761},[731,1171,816],{"class":736},[731,1173,854],{"class":740},[731,1175,857],{"class":744},[731,1177,751],{"class":736},[731,1179,862],{"class":754},[731,1181,865],{"class":736},[731,1183,862],{"class":754},[731,1185,1160],{"class":744},[731,1187,751],{"class":736},[731,1189,1165],{"class":754},[731,1191,885],{"class":736},[731,1193,1194,1196,1198],{"class":733,"line":787},[731,1195,790],{"class":736},[731,1197,819],{"class":740},[731,1199,758],{"class":736},[731,1201,1202],{"class":733,"line":797},[731,1203,800],{"emptyLinePlaceholder":686},[731,1205,1206,1208,1210,1212,1214,1216,1218,1220,1223],{"class":733,"line":803},[731,1207,737],{"class":736},[731,1209,819],{"class":740},[731,1211,822],{"class":744},[731,1213,751],{"class":736},[731,1215,827],{"class":754},[731,1217,1160],{"class":744},[731,1219,751],{"class":736},[731,1221,1222],{"class":754},"\"lg\"",[731,1224,758],{"class":736},[731,1226,1227,1229,1231,1233,1235,1237,1239,1241,1243,1245,1247],{"class":733,"line":813},[731,1228,816],{"class":736},[731,1230,854],{"class":740},[731,1232,857],{"class":744},[731,1234,751],{"class":736},[731,1236,862],{"class":754},[731,1238,865],{"class":736},[731,1240,862],{"class":754},[731,1242,1160],{"class":744},[731,1244,751],{"class":736},[731,1246,1222],{"class":754},[731,1248,885],{"class":736},[731,1250,1251,1253,1255],{"class":733,"line":848},[731,1252,790],{"class":736},[731,1254,819],{"class":740},[731,1256,758],{"class":736},[906,1258,1260],{"id":1259},"orientation","Orientation",[696,1262,1263,1266,1267,6,1269,1271],{},[700,1264,1265],{},"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. ",[700,1268,710],{},[700,1270,713],{}," still render\nfull-width below the row either way:",[722,1273,1275],{"className":920,"code":1274,"language":922,"meta":727,"style":727},"\u003CSFormField label=\"Email\" orientation=\"horizontal\">\n  \u003CSInput v-model=\"email\" \u002F>\n\u003C\u002FSFormField>\n",[700,1276,1277,1299,1317],{"__ignoreMap":727},[731,1278,1279,1281,1283,1285,1287,1289,1292,1294,1297],{"class":733,"line":8},[731,1280,737],{"class":736},[731,1282,819],{"class":740},[731,1284,822],{"class":744},[731,1286,751],{"class":736},[731,1288,827],{"class":754},[731,1290,1291],{"class":744}," orientation",[731,1293,751],{"class":736},[731,1295,1296],{"class":754},"\"horizontal\"",[731,1298,758],{"class":736},[731,1300,1301,1303,1305,1307,1309,1311,1313,1315],{"class":733,"line":761},[731,1302,816],{"class":736},[731,1304,854],{"class":740},[731,1306,857],{"class":744},[731,1308,751],{"class":736},[731,1310,862],{"class":754},[731,1312,865],{"class":736},[731,1314,862],{"class":754},[731,1316,885],{"class":736},[731,1318,1319,1321,1323],{"class":733,"line":787},[731,1320,790],{"class":736},[731,1322,819],{"class":740},[731,1324,758],{"class":736},[906,1326,1328],{"id":1327},"floating-label","Floating label",[696,1330,1331,1334,1335,1338,1339,1341,1342,1345],{},[700,1332,1333],{},"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 ",[700,1336,1337],{},":filled"," when it has\na value. Floating mode uses the vertical layout even if ",[700,1340,1259],{}," is set\nto ",[700,1343,1344],{},"horizontal",". DatePicker's editable segmented field keeps the label raised\nwhile empty so its day, month, and year placeholders remain visible and typeable.",[1347,1348],"component-example",{"name":1349},"form-field-floating",[722,1351,1353],{"className":920,"code":1352,"language":922,"meta":727,"style":727},"\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",[700,1354,1355,1384,1408],{"__ignoreMap":727},[731,1356,1357,1359,1361,1363,1365,1367,1370,1372,1375,1377,1379,1382],{"class":733,"line":8},[731,1358,737],{"class":736},[731,1360,819],{"class":740},[731,1362,822],{"class":744},[731,1364,751],{"class":736},[731,1366,827],{"class":754},[731,1368,1369],{"class":744}," label-mode",[731,1371,751],{"class":736},[731,1373,1374],{"class":754},"\"floating\"",[731,1376,838],{"class":744},[731,1378,751],{"class":736},[731,1380,1381],{"class":754},"\"We'll send your receipt here.\"",[731,1383,758],{"class":736},[731,1385,1386,1388,1390,1392,1394,1396,1398,1400,1402,1404,1406],{"class":733,"line":761},[731,1387,816],{"class":736},[731,1389,854],{"class":740},[731,1391,857],{"class":744},[731,1393,751],{"class":736},[731,1395,862],{"class":754},[731,1397,865],{"class":736},[731,1399,862],{"class":754},[731,1401,870],{"class":744},[731,1403,751],{"class":736},[731,1405,835],{"class":754},[731,1407,885],{"class":736},[731,1409,1410,1412,1414],{"class":733,"line":787},[731,1411,790],{"class":736},[731,1413,819],{"class":740},[731,1415,758],{"class":736},[696,1417,1418,1419,1422,1423,1427,1428,1430],{},"An ",[700,1420,1421],{},"SInputGroup"," containing one Input or Select plus an addon button also\nworks when the control comes first. For two editable controls, wrap ",[1424,1425,1426],"strong",{},"each","\ninput in its own ",[700,1429,819],{}," so both have independent labels, names, and\nvalidation state. This works with either InputGroup orientation:",[1347,1432],{"name":1433},"form-field-grouped",[906,1435,1437],{"id":1436},"works-with-any-control","Works with any control",[722,1439,1441],{"className":920,"code":1440,"language":922,"meta":727,"style":727},"\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",[700,1442,1443,1465,1500,1508,1512,1527,1554],{"__ignoreMap":727},[731,1444,1445,1447,1449,1451,1453,1456,1458,1460,1463],{"class":733,"line":8},[731,1446,737],{"class":736},[731,1448,819],{"class":740},[731,1450,822],{"class":744},[731,1452,751],{"class":736},[731,1454,1455],{"class":754},"\"Plan\"",[731,1457,830],{"class":744},[731,1459,751],{"class":736},[731,1461,1462],{"class":754},"\"plan\"",[731,1464,758],{"class":736},[731,1466,1467,1469,1472,1474,1476,1478,1481,1483,1486,1489,1491,1493,1496,1498],{"class":733,"line":761},[731,1468,816],{"class":736},[731,1470,1471],{"class":740},"SSelect",[731,1473,857],{"class":744},[731,1475,751],{"class":736},[731,1477,862],{"class":754},[731,1479,1480],{"class":736},"plan",[731,1482,862],{"class":754},[731,1484,1485],{"class":736}," :",[731,1487,1488],{"class":744},"items",[731,1490,751],{"class":736},[731,1492,862],{"class":754},[731,1494,1495],{"class":736},"planItems",[731,1497,862],{"class":754},[731,1499,885],{"class":736},[731,1501,1502,1504,1506],{"class":733,"line":787},[731,1503,790],{"class":736},[731,1505,819],{"class":740},[731,1507,758],{"class":736},[731,1509,1510],{"class":733,"line":797},[731,1511,800],{"emptyLinePlaceholder":686},[731,1513,1514,1516,1518,1520,1522,1525],{"class":733,"line":803},[731,1515,737],{"class":736},[731,1517,819],{"class":740},[731,1519,1023],{"class":744},[731,1521,751],{"class":736},[731,1523,1524],{"class":754},"\"You must accept the terms\"",[731,1526,758],{"class":736},[731,1528,1529,1531,1534,1536,1538,1540,1543,1545,1547,1549,1552],{"class":733,"line":813},[731,1530,816],{"class":736},[731,1532,1533],{"class":740},"SCheckbox",[731,1535,857],{"class":744},[731,1537,751],{"class":736},[731,1539,862],{"class":754},[731,1541,1542],{"class":736},"accepted",[731,1544,862],{"class":754},[731,1546,822],{"class":744},[731,1548,751],{"class":736},[731,1550,1551],{"class":754},"\"Accept terms\"",[731,1553,885],{"class":736},[731,1555,1556,1558,1560],{"class":733,"line":848},[731,1557,790],{"class":736},[731,1559,819],{"class":740},[731,1561,758],{"class":736},[696,1563,1564,1565,6,1567,1569,1570,1572],{},"A control's own ",[700,1566,702],{},[700,1568,1104],{}," still win over FormField's if you set them\nexplicitly. ",[700,1571,991],{}," 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.",[906,1574,1576,1577],{"id":1575},"custom-ui","Custom ",[700,1578,1579],{},":ui",[696,1581,1582,1583,1585],{},"To see exactly what you'd be overriding - the current default classes for\nevery slot and variant - here's ",[700,1584,304],{},"'s own theme file:",[1587,1588],"theme-source",{"name":1589},"form-field",[691,1591,1593],{"id":1592},"props","Props",[1595,1596,1597,1613],"table",{},[1598,1599,1600],"thead",{},[1601,1602,1603,1607,1610],"tr",{},[1604,1605,1606],"th",{},"Prop",[1604,1608,1609],{},"Type",[1604,1611,1612],{},"Default",[1614,1615,1616,1631,1645,1657,1669,1681,1694,1711,1724,1740,1757,1772],"tbody",{},[1601,1617,1618,1623,1628],{},[1619,1620,1621],"td",{},[700,1622,702],{},[1619,1624,1625],{},[700,1626,1627],{},"string",[1619,1629,1630],{},"generated unique ID",[1601,1632,1633,1638,1642],{},[1619,1634,1635],{},[700,1636,1637],{},"label",[1619,1639,1640],{},[700,1641,1627],{},[1619,1643,1644],{},"-",[1601,1646,1647,1651,1655],{},[1619,1648,1649],{},[700,1650,1104],{},[1619,1652,1653],{},[700,1654,1627],{},[1619,1656,1644],{},[1601,1658,1659,1663,1667],{},[1619,1660,1661],{},[700,1662,908],{},[1619,1664,1665],{},[700,1666,1627],{},[1619,1668,1644],{},[1601,1670,1671,1675,1679],{},[1619,1672,1673],{},[700,1674,710],{},[1619,1676,1677],{},[700,1678,1627],{},[1619,1680,1644],{},[1601,1682,1683,1687,1692],{},[1619,1684,1685],{},[700,1686,713],{},[1619,1688,1689],{},[700,1690,1691],{},"string | boolean",[1619,1693,1644],{},[1601,1695,1696,1701,1706],{},[1619,1697,1698],{},[700,1699,1700],{},"required",[1619,1702,1703],{},[700,1704,1705],{},"boolean",[1619,1707,1708],{},[700,1709,1710],{},"false",[1601,1712,1713,1717,1722],{},[1619,1714,1715],{},[700,1716,1125],{},[1619,1718,1719],{},[700,1720,1721],{},"'sm' | 'md' | 'lg'",[1619,1723,1644],{},[1601,1725,1726,1730,1735],{},[1619,1727,1728],{},[700,1729,1259],{},[1619,1731,1732],{},[700,1733,1734],{},"'vertical' | 'horizontal'",[1619,1736,1737],{},[700,1738,1739],{},"vertical",[1601,1741,1742,1747,1752],{},[1619,1743,1744],{},[700,1745,1746],{},"labelMode",[1619,1748,1749],{},[700,1750,1751],{},"'static' | 'floating'",[1619,1753,1754],{},[700,1755,1756],{},"static",[1601,1758,1759,1764,1768],{},[1619,1760,1761],{},[700,1762,1763],{},"filled",[1619,1765,1766],{},[700,1767,1705],{},[1619,1769,1770],{},[700,1771,1710],{},[1601,1773,1774,1779,1784],{},[1619,1775,1776],{},[700,1777,1778],{},"ui",[1619,1780,1781],{},[700,1782,1783],{},"Partial\u003CRecord\u003C'root' | 'body' | 'header' | 'label' | 'required' | 'description' | 'container' | 'hint' | 'error', string | object>>",[1619,1785,1644],{},[691,1787,1789],{"id":1788},"slots","Slots",[1595,1791,1792,1803],{},[1598,1793,1794],{},[1601,1795,1796,1799,1801],{},[1604,1797,1798],{},"Slot",[1604,1800,1593],{},[1604,1802,909],{},[1614,1804,1805,1818],{},[1601,1806,1807,1810,1815],{},[1619,1808,1809],{},"default",[1619,1811,1812],{},[700,1813,1814],{},"{ id, invalid, describedBy }",[1619,1816,1817],{},"The wrapped control. Props are also available if you need to bind them manually.",[1601,1819,1820,1824,1826],{},[1619,1821,1822],{},[700,1823,908],{},[1619,1825,1644],{},[1619,1827,1828,1829],{},"Custom content, overrides ",[700,1830,908],{},[1832,1833,1834],"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":727,"searchDepth":787,"depth":787,"links":1836},[1837,1848,1849],{"id":693,"depth":761,"text":694,"children":1838},[1839,1840,1841,1842,1843,1844,1845,1846],{"id":908,"depth":787,"text":909},{"id":981,"depth":787,"text":982},{"id":1065,"depth":787,"text":1066},{"id":1119,"depth":787,"text":1120},{"id":1259,"depth":787,"text":1260},{"id":1327,"depth":787,"text":1328},{"id":1436,"depth":787,"text":1437},{"id":1575,"depth":787,"text":1847},"Custom :ui",{"id":1592,"depth":761,"text":1593},{"id":1788,"depth":761,"text":1789},"Label, description, hint, and error-message wrapper that wires id\u002Faria-describedby\u002Finvalid into whatever form control it wraps.",{},{"title":304,"description":1850},"8SbkZoOSDk5n3U5Gt6tKHqTv3-pX7Nw2LkEMD7d-WOI",{"id":1855,"title":304,"aside":686,"body":1856,"collapse":10,"description":2854,"editLink":686,"extension":1133,"icon":9,"issueLink":686,"meta":2855,"navBadges":9,"navigation":9,"order":307,"path":2856,"prevNext":686,"seo":2857,"stem":2858,"toc":686,"__hash__":2859},"docs\u002Fid\u002Fcomponents\u002Fforms\u002Fform-field.md",{"type":688,"value":1857,"toc":2840},[1858,1862,1882,2010,2014,2022,2078,2080,2098,2154,2156,2202,2206,2221,2333,2337,2347,2397,2399,2413,2415,2477,2489,2491,2495,2607,2617,2621,2627,2629,2631,2798,2800,2838],[691,1859,1861],{"id":1860},"penggunaan","Penggunaan",[696,1863,1864,1865,1867,1868,1870,1871,6,1873,1875,1876,1878,1879,1881],{},"Bungkus satu kontrol formulir apa pun - Input, Textarea, Select, Autocomplete, Checkbox, RadioGroup, atau Switch - dan FormField menghasilkan ",[700,1866,702],{}," yang cocok, menautkan label kepadanya, dan menghitung ",[700,1869,706],{}," dari ",[700,1872,710],{},[700,1874,713],{}," mana yang saat ini ditampilkan. Kontrol yang dibungkus memperoleh semua ini secara otomatis; Anda tidak perlu meneruskan ",[700,1877,702],{}," atau ",[700,1880,706],{}," sendiri.",[722,1883,1884],{"className":724,"code":725,"language":726,"meta":727,"style":727},[700,1885,1886,1902,1918,1926,1930,1938,1964,1994,2002],{"__ignoreMap":727},[731,1887,1888,1890,1892,1894,1896,1898,1900],{"class":733,"line":8},[731,1889,737],{"class":736},[731,1891,741],{"class":740},[731,1893,745],{"class":744},[731,1895,748],{"class":744},[731,1897,751],{"class":736},[731,1899,755],{"class":754},[731,1901,758],{"class":736},[731,1903,1904,1906,1908,1910,1912,1914,1916],{"class":733,"line":761},[731,1905,765],{"class":764},[731,1907,769],{"class":768},[731,1909,772],{"class":764},[731,1911,775],{"class":744},[731,1913,778],{"class":736},[731,1915,781],{"class":754},[731,1917,784],{"class":736},[731,1919,1920,1922,1924],{"class":733,"line":787},[731,1921,790],{"class":736},[731,1923,741],{"class":740},[731,1925,758],{"class":736},[731,1927,1928],{"class":733,"line":797},[731,1929,800],{"emptyLinePlaceholder":686},[731,1931,1932,1934,1936],{"class":733,"line":803},[731,1933,737],{"class":736},[731,1935,808],{"class":740},[731,1937,758],{"class":736},[731,1939,1940,1942,1944,1946,1948,1950,1952,1954,1956,1958,1960,1962],{"class":733,"line":813},[731,1941,816],{"class":736},[731,1943,819],{"class":740},[731,1945,822],{"class":744},[731,1947,751],{"class":736},[731,1949,827],{"class":754},[731,1951,830],{"class":744},[731,1953,751],{"class":736},[731,1955,835],{"class":754},[731,1957,838],{"class":744},[731,1959,751],{"class":736},[731,1961,843],{"class":754},[731,1963,758],{"class":736},[731,1965,1966,1968,1970,1972,1974,1976,1978,1980,1982,1984,1986,1988,1990,1992],{"class":733,"line":848},[731,1967,851],{"class":736},[731,1969,854],{"class":740},[731,1971,857],{"class":744},[731,1973,751],{"class":736},[731,1975,862],{"class":754},[731,1977,865],{"class":736},[731,1979,862],{"class":754},[731,1981,870],{"class":744},[731,1983,751],{"class":736},[731,1985,835],{"class":754},[731,1987,877],{"class":744},[731,1989,751],{"class":736},[731,1991,882],{"class":754},[731,1993,885],{"class":736},[731,1995,1996,1998,2000],{"class":733,"line":888},[731,1997,891],{"class":736},[731,1999,819],{"class":740},[731,2001,758],{"class":736},[731,2003,2004,2006,2008],{"class":733,"line":898},[731,2005,790],{"class":736},[731,2007,808],{"class":740},[731,2009,758],{"class":736},[906,2011,2013],{"id":2012},"deskripsi","Deskripsi",[696,2015,2016,2018,2019,2021],{},[700,2017,908],{}," menambahkan baris kedua yang muted di bawah label, sebelum kontrol - untuk konteks yang harus dibaca pengguna sebelum mencapainya (tid seperti ",[700,2020,710],{},", yang duduk di bawah kontrol sebagai gantinya):",[722,2023,2024],{"className":920,"code":921,"language":922,"meta":727,"style":727},[700,2025,2026,2046,2070],{"__ignoreMap":727},[731,2027,2028,2030,2032,2034,2036,2038,2040,2042,2044],{"class":733,"line":8},[731,2029,737],{"class":736},[731,2031,819],{"class":740},[731,2033,822],{"class":744},[731,2035,751],{"class":736},[731,2037,827],{"class":754},[731,2039,939],{"class":744},[731,2041,751],{"class":736},[731,2043,944],{"class":754},[731,2045,758],{"class":736},[731,2047,2048,2050,2052,2054,2056,2058,2060,2062,2064,2066,2068],{"class":733,"line":761},[731,2049,816],{"class":736},[731,2051,854],{"class":740},[731,2053,857],{"class":744},[731,2055,751],{"class":736},[731,2057,862],{"class":754},[731,2059,865],{"class":736},[731,2061,862],{"class":754},[731,2063,870],{"class":744},[731,2065,751],{"class":736},[731,2067,835],{"class":754},[731,2069,885],{"class":736},[731,2071,2072,2074,2076],{"class":733,"line":787},[731,2073,790],{"class":736},[731,2075,819],{"class":740},[731,2077,758],{"class":736},[906,2079,982],{"id":981},[696,2081,2082,2083,2085,2086,2088,2089,2091,2092,2094,2095,2097],{},"Atur ",[700,2084,713],{}," ke string untuk menunjukkan pesan menggantikan hint dan menandai kontrol ",[700,2087,991],{}," (ring\u002Foutline merah, ",[700,2090,995],{},"). Meneruskan ",[700,2093,713],{}," sebagai ",[700,2096,1002],{}," (tanpa pesan) tetap menandai kontrol invalid tanpa merender teks apa pun.",[722,2099,2100],{"className":920,"code":1006,"language":922,"meta":727,"style":727},[700,2101,2102,2122,2146],{"__ignoreMap":727},[731,2103,2104,2106,2108,2110,2112,2114,2116,2118,2120],{"class":733,"line":8},[731,2105,737],{"class":736},[731,2107,819],{"class":740},[731,2109,822],{"class":744},[731,2111,751],{"class":736},[731,2113,827],{"class":754},[731,2115,1023],{"class":744},[731,2117,751],{"class":736},[731,2119,1028],{"class":754},[731,2121,758],{"class":736},[731,2123,2124,2126,2128,2130,2132,2134,2136,2138,2140,2142,2144],{"class":733,"line":761},[731,2125,816],{"class":736},[731,2127,854],{"class":740},[731,2129,857],{"class":744},[731,2131,751],{"class":736},[731,2133,862],{"class":754},[731,2135,865],{"class":736},[731,2137,862],{"class":754},[731,2139,870],{"class":744},[731,2141,751],{"class":736},[731,2143,835],{"class":754},[731,2145,885],{"class":736},[731,2147,2148,2150,2152],{"class":733,"line":787},[731,2149,790],{"class":736},[731,2151,819],{"class":740},[731,2153,758],{"class":736},[906,2155,1066],{"id":1065},[722,2157,2158],{"className":920,"code":1069,"language":922,"meta":727,"style":727},[700,2159,2160,2176,2194],{"__ignoreMap":727},[731,2161,2162,2164,2166,2168,2170,2172,2174],{"class":733,"line":8},[731,2163,737],{"class":736},[731,2165,819],{"class":740},[731,2167,822],{"class":744},[731,2169,751],{"class":736},[731,2171,1084],{"class":754},[731,2173,1087],{"class":744},[731,2175,758],{"class":736},[731,2177,2178,2180,2182,2184,2186,2188,2190,2192],{"class":733,"line":761},[731,2179,816],{"class":736},[731,2181,854],{"class":740},[731,2183,857],{"class":744},[731,2185,751],{"class":736},[731,2187,862],{"class":754},[731,2189,1104],{"class":736},[731,2191,862],{"class":754},[731,2193,885],{"class":736},[731,2195,2196,2198,2200],{"class":733,"line":787},[731,2197,790],{"class":736},[731,2199,819],{"class":740},[731,2201,758],{"class":736},[906,2203,2205],{"id":2204},"ukuran","Ukuran",[696,2207,2208,2210,2211,1130,2213,1130,2215,2217,2218,2220],{},[700,2209,1125],{}," juga menyusutkan\u002Fmembesarkan teks label\u002Fdescription\u002Fhint\u002Ferror FormField sendiri (",[700,2212,1129],{},[700,2214,1133],{},[700,2216,1136],{},") - ini adalah prop yang sama yang sudah diteruskan ke ",[700,2219,1125],{}," kontrol yang dibungkus, jadi keduanya tetap sinkron secara visual tanpa mengaturnya dua kali:",[722,2222,2223],{"className":920,"code":1143,"language":922,"meta":727,"style":727},[700,2224,2225,2245,2269,2277,2281,2301,2325],{"__ignoreMap":727},[731,2226,2227,2229,2231,2233,2235,2237,2239,2241,2243],{"class":733,"line":8},[731,2228,737],{"class":736},[731,2230,819],{"class":740},[731,2232,822],{"class":744},[731,2234,751],{"class":736},[731,2236,827],{"class":754},[731,2238,1160],{"class":744},[731,2240,751],{"class":736},[731,2242,1165],{"class":754},[731,2244,758],{"class":736},[731,2246,2247,2249,2251,2253,2255,2257,2259,2261,2263,2265,2267],{"class":733,"line":761},[731,2248,816],{"class":736},[731,2250,854],{"class":740},[731,2252,857],{"class":744},[731,2254,751],{"class":736},[731,2256,862],{"class":754},[731,2258,865],{"class":736},[731,2260,862],{"class":754},[731,2262,1160],{"class":744},[731,2264,751],{"class":736},[731,2266,1165],{"class":754},[731,2268,885],{"class":736},[731,2270,2271,2273,2275],{"class":733,"line":787},[731,2272,790],{"class":736},[731,2274,819],{"class":740},[731,2276,758],{"class":736},[731,2278,2279],{"class":733,"line":797},[731,2280,800],{"emptyLinePlaceholder":686},[731,2282,2283,2285,2287,2289,2291,2293,2295,2297,2299],{"class":733,"line":803},[731,2284,737],{"class":736},[731,2286,819],{"class":740},[731,2288,822],{"class":744},[731,2290,751],{"class":736},[731,2292,827],{"class":754},[731,2294,1160],{"class":744},[731,2296,751],{"class":736},[731,2298,1222],{"class":754},[731,2300,758],{"class":736},[731,2302,2303,2305,2307,2309,2311,2313,2315,2317,2319,2321,2323],{"class":733,"line":813},[731,2304,816],{"class":736},[731,2306,854],{"class":740},[731,2308,857],{"class":744},[731,2310,751],{"class":736},[731,2312,862],{"class":754},[731,2314,865],{"class":736},[731,2316,862],{"class":754},[731,2318,1160],{"class":744},[731,2320,751],{"class":736},[731,2322,1222],{"class":754},[731,2324,885],{"class":736},[731,2326,2327,2329,2331],{"class":733,"line":848},[731,2328,790],{"class":736},[731,2330,819],{"class":740},[731,2332,758],{"class":736},[906,2334,2336],{"id":2335},"orientasi","Orientasi",[696,2338,2339,2341,2342,6,2344,2346],{},[700,2340,1265],{}," menempatkan label di samping kontrol alih-alih di atasnya, dengan kontrol mengisi sisa lebar baris - berguna untuk formulir gaya halaman pengaturan dengan label di kiri. ",[700,2343,710],{},[700,2345,713],{}," tetap merender full-width di bawah baris dalam kedua cara:",[722,2348,2349],{"className":920,"code":1274,"language":922,"meta":727,"style":727},[700,2350,2351,2371,2389],{"__ignoreMap":727},[731,2352,2353,2355,2357,2359,2361,2363,2365,2367,2369],{"class":733,"line":8},[731,2354,737],{"class":736},[731,2356,819],{"class":740},[731,2358,822],{"class":744},[731,2360,751],{"class":736},[731,2362,827],{"class":754},[731,2364,1291],{"class":744},[731,2366,751],{"class":736},[731,2368,1296],{"class":754},[731,2370,758],{"class":736},[731,2372,2373,2375,2377,2379,2381,2383,2385,2387],{"class":733,"line":761},[731,2374,816],{"class":736},[731,2376,854],{"class":740},[731,2378,857],{"class":744},[731,2380,751],{"class":736},[731,2382,862],{"class":754},[731,2384,865],{"class":736},[731,2386,862],{"class":754},[731,2388,885],{"class":736},[731,2390,2391,2393,2395],{"class":733,"line":787},[731,2392,790],{"class":736},[731,2394,819],{"class":740},[731,2396,758],{"class":736},[906,2398,1328],{"id":1327},[696,2400,2401,2403,2404,2406,2407,2409,2410,2412],{},[700,2402,1333],{}," menempatkan label di atas kontrol kosong dan memindahkannya ke atas border saat kontrol difokuskan atau memiliki nilai. Ia mempertahankan asosiasi label native, hint, dan perilaku error yang sama. Input dan Textarea mendeteksi state nilai native mereka; Select, Autocomplete, dan DatePicker mengekspos state seleksi mereka ke field. Untuk kontrol kustom, berikan ",[700,2405,1337],{}," ketika memiliki nilai. Mode floating menggunakan tata letak vertikal bahkan jika ",[700,2408,1259],{}," diatur ke ",[700,2411,1344],{},". Field segmented yang dapat diedit DatePicker menjaga label terangkat saat kosong sehingga placeholder hari, bulan, dan tahun tetap terlihat dan dapat diketik.",[1347,2414],{"name":1349},[722,2416,2417],{"className":920,"code":1352,"language":922,"meta":727,"style":727},[700,2418,2419,2445,2469],{"__ignoreMap":727},[731,2420,2421,2423,2425,2427,2429,2431,2433,2435,2437,2439,2441,2443],{"class":733,"line":8},[731,2422,737],{"class":736},[731,2424,819],{"class":740},[731,2426,822],{"class":744},[731,2428,751],{"class":736},[731,2430,827],{"class":754},[731,2432,1369],{"class":744},[731,2434,751],{"class":736},[731,2436,1374],{"class":754},[731,2438,838],{"class":744},[731,2440,751],{"class":736},[731,2442,1381],{"class":754},[731,2444,758],{"class":736},[731,2446,2447,2449,2451,2453,2455,2457,2459,2461,2463,2465,2467],{"class":733,"line":761},[731,2448,816],{"class":736},[731,2450,854],{"class":740},[731,2452,857],{"class":744},[731,2454,751],{"class":736},[731,2456,862],{"class":754},[731,2458,865],{"class":736},[731,2460,862],{"class":754},[731,2462,870],{"class":744},[731,2464,751],{"class":736},[731,2466,835],{"class":754},[731,2468,885],{"class":736},[731,2470,2471,2473,2475],{"class":733,"line":787},[731,2472,790],{"class":736},[731,2474,819],{"class":740},[731,2476,758],{"class":736},[696,2478,2479,2481,2482,2485,2486,2488],{},[700,2480,1421],{}," yang berisi satu Input atau Select ditambah tombol addon juga berfungsi ketika kontrol datang pertama. Untuk dua kontrol yang dapat diedit, bungkus ",[1424,2483,2484],{},"setiap"," input dalam ",[700,2487,819],{}," sendiri sehingga keduanya memiliki label, name, dan state validasi independen. Ini berfungsi dengan kedua orientasi InputGroup:",[1347,2490],{"name":1433},[906,2492,2494],{"id":2493},"bekerja-dengan-kontrol-apa-pun","Bekerja dengan kontrol apa pun",[722,2496,2497],{"className":920,"code":1440,"language":922,"meta":727,"style":727},[700,2498,2499,2519,2549,2557,2561,2575,2599],{"__ignoreMap":727},[731,2500,2501,2503,2505,2507,2509,2511,2513,2515,2517],{"class":733,"line":8},[731,2502,737],{"class":736},[731,2504,819],{"class":740},[731,2506,822],{"class":744},[731,2508,751],{"class":736},[731,2510,1455],{"class":754},[731,2512,830],{"class":744},[731,2514,751],{"class":736},[731,2516,1462],{"class":754},[731,2518,758],{"class":736},[731,2520,2521,2523,2525,2527,2529,2531,2533,2535,2537,2539,2541,2543,2545,2547],{"class":733,"line":761},[731,2522,816],{"class":736},[731,2524,1471],{"class":740},[731,2526,857],{"class":744},[731,2528,751],{"class":736},[731,2530,862],{"class":754},[731,2532,1480],{"class":736},[731,2534,862],{"class":754},[731,2536,1485],{"class":736},[731,2538,1488],{"class":744},[731,2540,751],{"class":736},[731,2542,862],{"class":754},[731,2544,1495],{"class":736},[731,2546,862],{"class":754},[731,2548,885],{"class":736},[731,2550,2551,2553,2555],{"class":733,"line":787},[731,2552,790],{"class":736},[731,2554,819],{"class":740},[731,2556,758],{"class":736},[731,2558,2559],{"class":733,"line":797},[731,2560,800],{"emptyLinePlaceholder":686},[731,2562,2563,2565,2567,2569,2571,2573],{"class":733,"line":803},[731,2564,737],{"class":736},[731,2566,819],{"class":740},[731,2568,1023],{"class":744},[731,2570,751],{"class":736},[731,2572,1524],{"class":754},[731,2574,758],{"class":736},[731,2576,2577,2579,2581,2583,2585,2587,2589,2591,2593,2595,2597],{"class":733,"line":813},[731,2578,816],{"class":736},[731,2580,1533],{"class":740},[731,2582,857],{"class":744},[731,2584,751],{"class":736},[731,2586,862],{"class":754},[731,2588,1542],{"class":736},[731,2590,862],{"class":754},[731,2592,822],{"class":744},[731,2594,751],{"class":736},[731,2596,1551],{"class":754},[731,2598,885],{"class":736},[731,2600,2601,2603,2605],{"class":733,"line":848},[731,2602,790],{"class":736},[731,2604,819],{"class":740},[731,2606,758],{"class":736},[696,2608,2609,6,2611,2613,2614,2616],{},[700,2610,702],{},[700,2612,1104],{}," kontrol sendiri masih menang atas FormField jika Anda mengaturnya secara eksplisit. ",[700,2615,991],{}," di-OR dengan state error field, sehingga kontrol dapat opt-in terlihat invalid sendiri bahkan tanpa error, tetapi tidak dapat dipaksa kembali valid sementara FormField-nya memiliki error.",[906,2618,1576,2619],{"id":1575},[700,2620,1579],{},[696,2622,2623,2624,2626],{},"Untuk melihat dengan tepat apa yang akan Anda timpa - kelas default untuk setiap slot dan varian - berikut adalah file tema ",[700,2625,304],{}," sendiri:",[1587,2628],{"name":1589},[691,2630,1593],{"id":1592},[1595,2632,2633,2644],{},[1598,2634,2635],{},[1601,2636,2637,2639,2642],{},[1604,2638,1606],{},[1604,2640,2641],{},"Tipe",[1604,2643,1612],{},[1614,2645,2646,2658,2670,2682,2694,2706,2718,2732,2744,2758,2772,2786],{},[1601,2647,2648,2652,2656],{},[1619,2649,2650],{},[700,2651,702],{},[1619,2653,2654],{},[700,2655,1627],{},[1619,2657,1630],{},[1601,2659,2660,2664,2668],{},[1619,2661,2662],{},[700,2663,1637],{},[1619,2665,2666],{},[700,2667,1627],{},[1619,2669,1644],{},[1601,2671,2672,2676,2680],{},[1619,2673,2674],{},[700,2675,1104],{},[1619,2677,2678],{},[700,2679,1627],{},[1619,2681,1644],{},[1601,2683,2684,2688,2692],{},[1619,2685,2686],{},[700,2687,908],{},[1619,2689,2690],{},[700,2691,1627],{},[1619,2693,1644],{},[1601,2695,2696,2700,2704],{},[1619,2697,2698],{},[700,2699,710],{},[1619,2701,2702],{},[700,2703,1627],{},[1619,2705,1644],{},[1601,2707,2708,2712,2716],{},[1619,2709,2710],{},[700,2711,713],{},[1619,2713,2714],{},[700,2715,1691],{},[1619,2717,1644],{},[1601,2719,2720,2724,2728],{},[1619,2721,2722],{},[700,2723,1700],{},[1619,2725,2726],{},[700,2727,1705],{},[1619,2729,2730],{},[700,2731,1710],{},[1601,2733,2734,2738,2742],{},[1619,2735,2736],{},[700,2737,1125],{},[1619,2739,2740],{},[700,2741,1721],{},[1619,2743,1644],{},[1601,2745,2746,2750,2754],{},[1619,2747,2748],{},[700,2749,1259],{},[1619,2751,2752],{},[700,2753,1734],{},[1619,2755,2756],{},[700,2757,1739],{},[1601,2759,2760,2764,2768],{},[1619,2761,2762],{},[700,2763,1746],{},[1619,2765,2766],{},[700,2767,1751],{},[1619,2769,2770],{},[700,2771,1756],{},[1601,2773,2774,2778,2782],{},[1619,2775,2776],{},[700,2777,1763],{},[1619,2779,2780],{},[700,2781,1705],{},[1619,2783,2784],{},[700,2785,1710],{},[1601,2787,2788,2792,2796],{},[1619,2789,2790],{},[700,2791,1778],{},[1619,2793,2794],{},[700,2795,1783],{},[1619,2797,1644],{},[691,2799,1789],{"id":1788},[1595,2801,2802,2812],{},[1598,2803,2804],{},[1601,2805,2806,2808,2810],{},[1604,2807,1798],{},[1604,2809,1593],{},[1604,2811,2013],{},[1614,2813,2814,2825],{},[1601,2815,2816,2818,2822],{},[1619,2817,1809],{},[1619,2819,2820],{},[700,2821,1814],{},[1619,2823,2824],{},"Kontrol yang dibungkus. Props juga tersedia jika Anda perlu mengaitkannya secara manual.",[1601,2826,2827,2831,2833],{},[1619,2828,2829],{},[700,2830,908],{},[1619,2832,1644],{},[1619,2834,2835,2836],{},"Konten kustom, menggantikan ",[700,2837,908],{},[1832,2839,1834],{},{"title":727,"searchDepth":787,"depth":787,"links":2841},[2842,2852,2853],{"id":1860,"depth":761,"text":1861,"children":2843},[2844,2845,2846,2847,2848,2849,2850,2851],{"id":2012,"depth":787,"text":2013},{"id":981,"depth":787,"text":982},{"id":1065,"depth":787,"text":1066},{"id":2204,"depth":787,"text":2205},{"id":2335,"depth":787,"text":2336},{"id":1327,"depth":787,"text":1328},{"id":2493,"depth":787,"text":2494},{"id":1575,"depth":787,"text":1847},{"id":1592,"depth":761,"text":1593},{"id":1788,"depth":761,"text":1789},"Wrapper label, deskripsi, hint, dan pesan error yang menghubungkan id\u002Faria-describedby\u002Finvalid ke kontrol formulir apa pun yang dibungkusnya.",{},"\u002Fid\u002Fcomponents\u002Fforms\u002Fform-field",{"title":304,"description":2854},"id\u002Fcomponents\u002Fforms\u002Fform-field","qE1BH4dFD99mok9IJA5i2yjFCvVmDzOaWjaFLV-5FM4",1792925235907]