[{"data":1,"prerenderedAt":1490},["ShallowReactive",2],{"navigation":3,"\u002Fcomponents\u002Finput\u002Fdeveloper":439},[4,30,256,281,366,375,402,424],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":6},"Getting Started",false,"\u002Fgetting-started","1.getting-started",[10,15,20,25],{"title":11,"path":12,"stem":13,"icon":14},"Installation","\u002Fgetting-started\u002Finstallation","1.getting-started\u002F2.installation","i-lucide-download",{"title":16,"path":17,"stem":18,"icon":19},"Nuxt","\u002Fgetting-started\u002Fnuxt","1.getting-started\u002F3.nuxt","i-lucide-mountain",{"title":21,"path":22,"stem":23,"icon":24},"Theming","\u002Fgetting-started\u002Ftheming","1.getting-started\u002F4.theming","i-lucide-palette",{"title":26,"path":27,"stem":28,"icon":29},"MCP","\u002Fgetting-started\u002Fmcp","1.getting-started\u002F5.mcp","i-lucide-plug",{"title":31,"icon":6,"path":32,"stem":33,"children":34,"page":6},"Components","\u002Fcomponents","2.components",[35,43,51,59,67,75,83,92,100,104,108,116,124,133,141,149,157,166,174,182,191,199,203,211,220,228,236,240,248],{"title":36,"path":37,"stem":38,"children":39,"page":6},"Accordion","\u002Fcomponents\u002Faccordion","2.components\u002F01.accordion",[40],{"title":36,"path":41,"stem":42},"\u002Fcomponents\u002Faccordion\u002Foverview","2.components\u002F01.accordion\u002F1.overview",{"title":44,"path":45,"stem":46,"children":47,"page":6},"Alert","\u002Fcomponents\u002Falert","2.components\u002F02.alert",[48],{"title":44,"path":49,"stem":50},"\u002Fcomponents\u002Falert\u002Foverview","2.components\u002F02.alert\u002F1.overview",{"title":52,"path":53,"stem":54,"children":55,"page":6},"Button","\u002Fcomponents\u002Fbutton","2.components\u002F03.button",[56],{"title":52,"path":57,"stem":58},"\u002Fcomponents\u002Fbutton\u002Foverview","2.components\u002F03.button\u002F1.overview",{"title":60,"path":61,"stem":62,"children":63,"page":6},"Card","\u002Fcomponents\u002Fcard","2.components\u002F04.card",[64],{"title":60,"path":65,"stem":66},"\u002Fcomponents\u002Fcard\u002Foverview","2.components\u002F04.card\u002F1.overview",{"title":68,"path":69,"stem":70,"children":71,"page":6},"Carousel","\u002Fcomponents\u002Fcarousel","2.components\u002F05.carousel",[72],{"title":68,"path":73,"stem":74},"\u002Fcomponents\u002Fcarousel\u002Foverview","2.components\u002F05.carousel\u002F1.overview",{"title":76,"path":77,"stem":78,"children":79,"page":6},"Checkbox","\u002Fcomponents\u002Fcheckbox","2.components\u002F06.checkbox",[80],{"title":76,"path":81,"stem":82},"\u002Fcomponents\u002Fcheckbox\u002Foverview","2.components\u002F06.checkbox\u002F1.overview",{"title":84,"path":85,"stem":86,"children":87,"page":6},"Date Picker","\u002Fcomponents\u002Fdate-picker","2.components\u002F07.date-picker",[88],{"title":89,"path":90,"stem":91},"Date picker","\u002Fcomponents\u002Fdate-picker\u002Foverview","2.components\u002F07.date-picker\u002F1.overview",{"title":93,"path":94,"stem":95,"children":96,"page":6},"Dropdown","\u002Fcomponents\u002Fdropdown","2.components\u002F08.dropdown",[97],{"title":93,"path":98,"stem":99},"\u002Fcomponents\u002Fdropdown\u002Foverview","2.components\u002F08.dropdown\u002F1.overview",{"title":101,"path":102,"stem":103},"Heading","\u002Fcomponents\u002Fheading","2.components\u002F09.heading",{"title":105,"path":106,"stem":107},"Icon","\u002Fcomponents\u002Ficon","2.components\u002F10.icon",{"title":109,"path":110,"stem":111,"children":112,"page":6},"Input","\u002Fcomponents\u002Finput","2.components\u002F11.input",[113],{"title":109,"path":114,"stem":115},"\u002Fcomponents\u002Finput\u002Foverview","2.components\u002F11.input\u002F1.overview",{"title":117,"path":118,"stem":119,"children":120,"page":6},"Label","\u002Fcomponents\u002Flabel","2.components\u002F12.label",[121],{"title":117,"path":122,"stem":123},"\u002Fcomponents\u002Flabel\u002Foverview","2.components\u002F12.label\u002F1.overview",{"title":125,"path":126,"stem":127,"children":128,"page":6},"Phone Number","\u002Fcomponents\u002Fphone-number","2.components\u002F13.phone-number",[129],{"title":130,"path":131,"stem":132},"Phone number","\u002Fcomponents\u002Fphone-number\u002Foverview","2.components\u002F13.phone-number\u002F1.overview",{"title":134,"path":135,"stem":136,"children":137,"page":6},"Popover","\u002Fcomponents\u002Fpopover","2.components\u002F14.popover",[138],{"title":134,"path":139,"stem":140},"\u002Fcomponents\u002Fpopover\u002Foverview","2.components\u002F14.popover\u002F1.overview",{"title":142,"path":143,"stem":144,"children":145,"page":6},"Quantity","\u002Fcomponents\u002Fquantity","2.components\u002F15.quantity",[146],{"title":142,"path":147,"stem":148},"\u002Fcomponents\u002Fquantity\u002Foverview","2.components\u002F15.quantity\u002F1.overview",{"title":150,"path":151,"stem":152,"children":153,"page":6},"Radio","\u002Fcomponents\u002Fradio","2.components\u002F16.radio",[154],{"title":150,"path":155,"stem":156},"\u002Fcomponents\u002Fradio\u002Foverview","2.components\u002F16.radio\u002F1.overview",{"title":158,"path":159,"stem":160,"children":161,"page":6},"Radio Group","\u002Fcomponents\u002Fradio-group","2.components\u002F17.radio-group",[162],{"title":163,"path":164,"stem":165},"Radio group","\u002Fcomponents\u002Fradio-group\u002Foverview","2.components\u002F17.radio-group\u002F1.overview",{"title":167,"path":168,"stem":169,"children":170,"page":6},"Rating","\u002Fcomponents\u002Frating","2.components\u002F18.rating",[171],{"title":167,"path":172,"stem":173},"\u002Fcomponents\u002Frating\u002Foverview","2.components\u002F18.rating\u002F1.overview",{"title":175,"path":176,"stem":177,"children":178,"page":6},"Required","\u002Fcomponents\u002Frequired","2.components\u002F19.required",[179],{"title":175,"path":180,"stem":181},"\u002Fcomponents\u002Frequired\u002Foverview","2.components\u002F19.required\u002F1.overview",{"title":183,"path":184,"stem":185,"children":186,"page":6},"Scroll Area","\u002Fcomponents\u002Fscroll-area","2.components\u002F20.scroll-area",[187],{"title":188,"path":189,"stem":190},"Scroll area","\u002Fcomponents\u002Fscroll-area\u002Foverview","2.components\u002F20.scroll-area\u002F1.overview",{"title":192,"path":193,"stem":194,"children":195,"page":6},"Select","\u002Fcomponents\u002Fselect","2.components\u002F21.select",[196],{"title":192,"path":197,"stem":198},"\u002Fcomponents\u002Fselect\u002Foverview","2.components\u002F21.select\u002F1.overview",{"title":200,"path":201,"stem":202},"Spinner","\u002Fcomponents\u002Fspinner","2.components\u002F22.spinner",{"title":204,"path":205,"stem":206,"children":207,"page":6},"Switch","\u002Fcomponents\u002Fswitch","2.components\u002F23.switch",[208],{"title":204,"path":209,"stem":210},"\u002Fcomponents\u002Fswitch\u002Foverview","2.components\u002F23.switch\u002F1.overview",{"title":212,"path":213,"stem":214,"children":215,"page":6},"Tab Badge","\u002Fcomponents\u002Ftab-badge","2.components\u002F24.tab-badge",[216],{"title":217,"path":218,"stem":219},"Tab badge","\u002Fcomponents\u002Ftab-badge\u002Foverview","2.components\u002F24.tab-badge\u002F1.overview",{"title":221,"path":222,"stem":223,"children":224,"page":6},"Tabs","\u002Fcomponents\u002Ftabs","2.components\u002F25.tabs",[225],{"title":221,"path":226,"stem":227},"\u002Fcomponents\u002Ftabs\u002Foverview","2.components\u002F25.tabs\u002F1.overview",{"title":229,"path":230,"stem":231,"children":232,"page":6},"Tag","\u002Fcomponents\u002Ftag","2.components\u002F26.tag",[233],{"title":229,"path":234,"stem":235},"\u002Fcomponents\u002Ftag\u002Foverview","2.components\u002F26.tag\u002F1.overview",{"title":237,"path":238,"stem":239},"Text","\u002Fcomponents\u002Ftext","2.components\u002F27.text",{"title":241,"path":242,"stem":243,"children":244,"page":6},"Textarea","\u002Fcomponents\u002Ftextarea","2.components\u002F28.textarea",[245],{"title":241,"path":246,"stem":247},"\u002Fcomponents\u002Ftextarea\u002Foverview","2.components\u002F28.textarea\u002F1.overview",{"title":249,"path":250,"stem":251,"children":252,"page":6},"Tooltip","\u002Fcomponents\u002Ftooltip","2.components\u002F29.tooltip",[253],{"title":249,"path":254,"stem":255},"\u002Fcomponents\u002Ftooltip\u002Foverview","2.components\u002F29.tooltip\u002F1.overview",{"title":257,"icon":6,"path":258,"stem":259,"children":260,"page":6},"Foundations","\u002Ffoundations","2.foundations",[261,269,273,277],{"title":262,"icon":6,"path":263,"stem":264,"children":265,"page":6},"Color","\u002Ffoundations\u002Fcolor","2.foundations\u002F1.color",[266],{"title":262,"path":267,"stem":268},"\u002Ffoundations\u002Fcolor\u002Foverview","2.foundations\u002F1.color\u002F1.overview",{"title":270,"path":271,"stem":272},"Icons","\u002Ffoundations\u002Ficons","2.foundations\u002F2.icons",{"title":274,"path":275,"stem":276},"Logos and Pins","\u002Ffoundations\u002Flogos-and-pins","2.foundations\u002F3.logos-and-pins",{"title":278,"path":279,"stem":280},"Web layers","\u002Ffoundations\u002Fweb-layers","2.foundations\u002F4.web-layers",{"title":282,"icon":6,"path":283,"stem":284,"children":285,"page":6},"WIP","\u002Fwip","3.wip",[286,290,294,298,302,306,310,314,318,322,326,330,334,338,342,346,350,354,358,362],{"title":287,"path":288,"stem":289},"Additional","\u002Fwip\u002Fadditional","3.wip\u002Fadditional",{"title":291,"path":292,"stem":293},"Alt text","\u002Fwip\u002Falt-text","3.wip\u002Falt-text",{"title":295,"path":296,"stem":297},"AnnouncementBar","\u002Fwip\u002Fannouncement-bar","3.wip\u002Fannouncement-bar",{"title":299,"path":300,"stem":301},"Avatar","\u002Fwip\u002Favatar","3.wip\u002Favatar",{"title":303,"path":304,"stem":305},"Banner","\u002Fwip\u002Fbanner","3.wip\u002Fbanner",{"title":307,"path":308,"stem":309},"Breadcrumbs","\u002Fwip\u002Fbreadcrumbs","3.wip\u002Fbreadcrumbs",{"title":311,"path":312,"stem":313},"Divider & scroll","\u002Fwip\u002Fdivider-scroll","3.wip\u002Fdivider-scroll",{"title":315,"path":316,"stem":317},"FieldMessage","\u002Fwip\u002Ffield-message","3.wip\u002Ffield-message",{"title":319,"path":320,"stem":321},"Focus Ring","\u002Fwip\u002Ffocus-ring","3.wip\u002Ffocus-ring",{"title":323,"path":324,"stem":325},"InlineSeparator","\u002Fwip\u002Finline-separator","3.wip\u002Finline-separator",{"title":327,"path":328,"stem":329},"Modal & drawer","\u002Fwip\u002Fmodal-drawer","3.wip\u002Fmodal-drawer",{"title":331,"path":332,"stem":333},"Optional","\u002Fwip\u002Foptional","3.wip\u002Foptional",{"title":335,"path":336,"stem":337},"Pagination","\u002Fwip\u002Fpagination","3.wip\u002Fpagination",{"title":339,"path":340,"stem":341},"PasswordInput","\u002Fwip\u002Fpassword-input","3.wip\u002Fpassword-input",{"title":343,"path":344,"stem":345},"Pinned bar page","\u002Fwip\u002Fpinned-bar-page","3.wip\u002Fpinned-bar-page",{"title":347,"path":348,"stem":349},"PromotionalBar","\u002Fwip\u002Fpromotional-bar","3.wip\u002Fpromotional-bar",{"title":351,"path":352,"stem":353},"SearchInput","\u002Fwip\u002Fsearch-input","3.wip\u002Fsearch-input",{"title":355,"path":356,"stem":357},"StatusLine","\u002Fwip\u002Fstatus-line","3.wip\u002Fstatus-line",{"title":359,"path":360,"stem":361},"Stepper & loaderBar","\u002Fwip\u002Fstepper-loader-bar","3.wip\u002Fstepper-loader-bar",{"title":363,"path":364,"stem":365},"TextInput","\u002Fwip\u002Ftext-input","3.wip\u002Ftext-input",{"title":367,"icon":6,"path":368,"stem":369,"children":370,"page":6},"Overview","\u002Foverview","4.overview",[371],{"title":372,"path":373,"stem":374},"For developers","\u002Foverview\u002Ffor-developers","4.overview\u002F1.for-developers",{"title":376,"icon":6,"path":377,"stem":378,"children":379,"page":6},"Brand","\u002Fbrand","5.brand",[380,389],{"title":381,"icon":6,"path":382,"stem":383,"children":384,"page":6},"Brand guidelines","\u002Fbrand\u002Fbrand-guidelines","5.brand\u002F1.brand-guidelines",[385],{"title":386,"path":387,"stem":388},"Dr. Max Trademarks Guidelines","\u002Fbrand\u002Fbrand-guidelines\u002Fdr-max-trademarks-guidelines","5.brand\u002F1.brand-guidelines\u002F2.dr-max-trademarks-guidelines",{"title":390,"icon":6,"path":391,"stem":392,"children":393,"page":6},"Assets","\u002Fbrand\u002Fassets","5.brand\u002F2.assets",[394,398],{"title":395,"path":396,"stem":397},"Logos","\u002Fbrand\u002Fassets\u002Flogos","5.brand\u002F2.assets\u002F2.logos",{"title":399,"path":400,"stem":401},"Dr. Max Tagline","\u002Fbrand\u002Fassets\u002Fdr-max-tagline","5.brand\u002F2.assets\u002F3.dr-max-tagline",{"title":403,"icon":6,"path":404,"stem":405,"children":406,"page":6},"Content","\u002Fcontent","6.content",[407,411],{"title":408,"path":409,"stem":410},"Content accessibility","\u002Fcontent\u002Fcontent-accessibility","6.content\u002F1.content-accessibility",{"title":412,"icon":6,"path":413,"stem":414,"children":415,"page":6},"Content guidance","\u002Fcontent\u002Fcontent-guidelines","6.content\u002F2.content-guidelines",[416,420],{"title":417,"path":418,"stem":419},"Category color-coding","\u002Fcontent\u002Fcontent-guidelines\u002Fcategory-color-coding","6.content\u002F2.content-guidelines\u002F2.category-color-coding",{"title":421,"path":422,"stem":423},"Pop-up banners","\u002Fcontent\u002Fcontent-guidelines\u002Fpop-up-banners","6.content\u002F2.content-guidelines\u002F3.pop-up-banners",{"title":425,"icon":6,"path":426,"stem":427,"children":428,"page":6},"Accessibility","\u002Faccessibility","7.accessibility",[429],{"title":430,"path":431,"stem":432,"children":433,"icon":6},"Accessibility guidance","\u002Faccessibility\u002Faccessibility-guidance","7.accessibility\u002F1.accessibility-guidance\u002F1.index",[434,435],{"title":425,"path":431,"stem":432},{"title":436,"path":437,"stem":438},"Understanding WCAG 2.2","\u002Faccessibility\u002Faccessibility-guidance\u002Funderstanding-wcag-2-2","7.accessibility\u002F1.accessibility-guidance\u002F2.understanding-wcag-2-2",{"id":440,"title":109,"body":441,"description":1482,"extension":1483,"links":1484,"meta":1485,"navigation":6,"path":1486,"seo":1487,"stem":1488,"__hash__":1489},"docs\u002F2.components\u002F11.input\u002F3.developer.md",{"type":442,"value":443,"toc":1470},"minimark",[444,449,491,495,499,510,706,711,730,839,843,857,989,993,1003,1116,1123,1127,1136,1217,1221,1227,1324,1327,1333,1458,1462,1466],[445,446,448],"h2",{"id":447},"import","Import",[450,451,456],"pre",{"className":452,"code":453,"language":454,"meta":455,"style":455},"language-ts shiki shiki-themes material-theme-palenight","import { Input } from \"@dr-max\u002Fui\u002Finput\"\n","ts","",[457,458,459],"code",{"__ignoreMap":455},[460,461,464,467,471,475,478,481,484,488],"span",{"class":462,"line":463},"line",1,[460,465,447],{"class":466},"s6cf3",[460,468,470],{"class":469},"sAklC"," {",[460,472,474],{"class":473},"s0W1g"," Input",[460,476,477],{"class":469}," }",[460,479,480],{"class":466}," from",[460,482,483],{"class":469}," \"",[460,485,487],{"class":486},"sfyAc","@dr-max\u002Fui\u002Finput",[460,489,490],{"class":469},"\"\n",[492,493,494],"p",{},"The entry carries its own precompiled CSS (including the styles of the Icon, Required and Spinner parts it composes) — no extra style imports needed.",[445,496,498],{"id":497},"usage","Usage",[492,500,501,502,505,506,509],{},"Bind the value with ",[457,503,504],{},"v-model"," and always provide a ",[457,507,508],{},"label"," — a stable input ID is generated automatically:",[511,512,513,520],"code-preview",{},[514,515],"ui-input",{"className":516,"label":518,"placeholder":519},[517],"w-72","Email address","you@example.com",[521,522,523],"template",{"v-slot:code":455},[450,524,528],{"className":525,"code":526,"language":527,"meta":455,"style":455},"language-vue shiki shiki-themes material-theme-palenight","\u003Cscript setup lang=\"ts\">\nimport { Input } from \"@dr-max\u002Fui\u002Finput\"\nimport { ref } from \"vue\"\n\nconst email = ref(\"\")\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CInput v-model=\"email\" label=\"Email address\" placeholder=\"you@example.com\" \u002F>\n\u003C\u002Ftemplate>\n","vue",[457,529,530,559,578,598,605,628,638,643,652,697],{"__ignoreMap":455},[460,531,532,535,539,543,546,549,552,554,556],{"class":462,"line":463},[460,533,534],{"class":469},"\u003C",[460,536,538],{"class":537},"s-wAU","script",[460,540,542],{"class":541},"sJ14y"," setup",[460,544,545],{"class":541}," lang",[460,547,548],{"class":469},"=",[460,550,551],{"class":469},"\"",[460,553,454],{"class":486},[460,555,551],{"class":469},[460,557,558],{"class":469},">\n",[460,560,562,564,566,568,570,572,574,576],{"class":462,"line":561},2,[460,563,447],{"class":466},[460,565,470],{"class":469},[460,567,474],{"class":473},[460,569,477],{"class":469},[460,571,480],{"class":466},[460,573,483],{"class":469},[460,575,487],{"class":486},[460,577,490],{"class":469},[460,579,581,583,585,588,590,592,594,596],{"class":462,"line":580},3,[460,582,447],{"class":466},[460,584,470],{"class":469},[460,586,587],{"class":473}," ref",[460,589,477],{"class":469},[460,591,480],{"class":466},[460,593,483],{"class":469},[460,595,527],{"class":486},[460,597,490],{"class":469},[460,599,601],{"class":462,"line":600},4,[460,602,604],{"emptyLinePlaceholder":603},true,"\n",[460,606,608,611,614,616,619,622,625],{"class":462,"line":607},5,[460,609,610],{"class":541},"const",[460,612,613],{"class":473}," email ",[460,615,548],{"class":469},[460,617,587],{"class":618},"sdLwU",[460,620,621],{"class":473},"(",[460,623,624],{"class":469},"\"\"",[460,626,627],{"class":473},")\n",[460,629,631,634,636],{"class":462,"line":630},6,[460,632,633],{"class":469},"\u003C\u002F",[460,635,538],{"class":537},[460,637,558],{"class":469},[460,639,641],{"class":462,"line":640},7,[460,642,604],{"emptyLinePlaceholder":603},[460,644,646,648,650],{"class":462,"line":645},8,[460,647,534],{"class":469},[460,649,521],{"class":537},[460,651,558],{"class":469},[460,653,655,658,660,663,665,667,670,672,675,677,679,681,683,686,688,690,692,694],{"class":462,"line":654},9,[460,656,657],{"class":469},"  \u003C",[460,659,109],{"class":537},[460,661,662],{"class":541}," v-model",[460,664,548],{"class":469},[460,666,551],{"class":469},[460,668,669],{"class":473},"email",[460,671,551],{"class":469},[460,673,674],{"class":541}," label",[460,676,548],{"class":469},[460,678,551],{"class":469},[460,680,518],{"class":486},[460,682,551],{"class":469},[460,684,685],{"class":541}," placeholder",[460,687,548],{"class":469},[460,689,551],{"class":469},[460,691,519],{"class":486},[460,693,551],{"class":469},[460,695,696],{"class":469}," \u002F>\n",[460,698,700,702,704],{"class":462,"line":699},10,[460,701,633],{"class":469},[460,703,521],{"class":537},[460,705,558],{"class":469},[707,708,710],"h3",{"id":709},"types","Types",[492,712,713,716,717,720,721,720,723,720,726,729],{},[457,714,715],{},"type"," accepts any native input type (",[457,718,719],{},"text",", ",[457,722,669],{},[457,724,725],{},"number",[457,727,728],{},"password",", …). Native number inputs intentionally emit strings for VInput compatibility:",[511,731,732,735,738],{},[514,733],{"className":734,"label":518,"type":669},[517],[514,736],{"className":737,"label":142,"type":725},[517],[521,739,740],{"v-slot:code":455},[450,741,743],{"className":525,"code":742,"language":527,"meta":455,"style":455},"\u003Ctemplate>\n  \u003CInput v-model=\"email\" type=\"email\" label=\"Email address\" \u002F>\n  \u003CInput v-model=\"quantity\" type=\"number\" label=\"Quantity\" \u002F>\n\u003C\u002Ftemplate>\n",[457,744,745,753,792,831],{"__ignoreMap":455},[460,746,747,749,751],{"class":462,"line":463},[460,748,534],{"class":469},[460,750,521],{"class":537},[460,752,558],{"class":469},[460,754,755,757,759,761,763,765,767,769,772,774,776,778,780,782,784,786,788,790],{"class":462,"line":561},[460,756,657],{"class":469},[460,758,109],{"class":537},[460,760,662],{"class":541},[460,762,548],{"class":469},[460,764,551],{"class":469},[460,766,669],{"class":473},[460,768,551],{"class":469},[460,770,771],{"class":541}," type",[460,773,548],{"class":469},[460,775,551],{"class":469},[460,777,669],{"class":486},[460,779,551],{"class":469},[460,781,674],{"class":541},[460,783,548],{"class":469},[460,785,551],{"class":469},[460,787,518],{"class":486},[460,789,551],{"class":469},[460,791,696],{"class":469},[460,793,794,796,798,800,802,804,807,809,811,813,815,817,819,821,823,825,827,829],{"class":462,"line":580},[460,795,657],{"class":469},[460,797,109],{"class":537},[460,799,662],{"class":541},[460,801,548],{"class":469},[460,803,551],{"class":469},[460,805,806],{"class":473},"quantity",[460,808,551],{"class":469},[460,810,771],{"class":541},[460,812,548],{"class":469},[460,814,551],{"class":469},[460,816,725],{"class":486},[460,818,551],{"class":469},[460,820,674],{"class":541},[460,822,548],{"class":469},[460,824,551],{"class":469},[460,826,142],{"class":486},[460,828,551],{"class":469},[460,830,696],{"class":469},[460,832,833,835,837],{"class":462,"line":600},[460,834,633],{"class":469},[460,836,521],{"class":537},[460,838,558],{"class":469},[707,840,842],{"id":841},"required-and-optionality","Required and optionality",[492,844,845,848,849,852,853,856],{},[457,846,847],{},"required"," renders a visual required indicator, ",[457,850,851],{},"optionality-description"," describes an optional field beside its label, and ",[457,854,855],{},"additional-description"," adds supporting text below the field:",[511,858,859,864,869],{},[514,860],{"className":861,"label":862,":required":863},[517],"Street and number","true",[514,865],{"className":866,"label":867,"additional-description":868,"optionality-description":331},[517],"Company","Only needed for business invoices.",[521,870,871],{"v-slot:code":455},[450,872,874],{"className":525,"code":873,"language":527,"meta":455,"style":455},"\u003Ctemplate>\n  \u003CInput v-model=\"street\" label=\"Street and number\" required \u002F>\n  \u003CInput\n    v-model=\"company\"\n    label=\"Company\"\n    optionality-description=\"Optional\"\n    additional-description=\"Only needed for business invoices.\"\n  \u002F>\n\u003C\u002Ftemplate>\n",[457,875,876,884,916,923,937,950,963,976,981],{"__ignoreMap":455},[460,877,878,880,882],{"class":462,"line":463},[460,879,534],{"class":469},[460,881,521],{"class":537},[460,883,558],{"class":469},[460,885,886,888,890,892,894,896,899,901,903,905,907,909,911,914],{"class":462,"line":561},[460,887,657],{"class":469},[460,889,109],{"class":537},[460,891,662],{"class":541},[460,893,548],{"class":469},[460,895,551],{"class":469},[460,897,898],{"class":473},"street",[460,900,551],{"class":469},[460,902,674],{"class":541},[460,904,548],{"class":469},[460,906,551],{"class":469},[460,908,862],{"class":486},[460,910,551],{"class":469},[460,912,913],{"class":541}," required",[460,915,696],{"class":469},[460,917,918,920],{"class":462,"line":580},[460,919,657],{"class":469},[460,921,922],{"class":537},"Input\n",[460,924,925,928,930,932,935],{"class":462,"line":600},[460,926,927],{"class":541},"    v-model",[460,929,548],{"class":469},[460,931,551],{"class":469},[460,933,934],{"class":473},"company",[460,936,490],{"class":469},[460,938,939,942,944,946,948],{"class":462,"line":607},[460,940,941],{"class":541},"    label",[460,943,548],{"class":469},[460,945,551],{"class":469},[460,947,867],{"class":486},[460,949,490],{"class":469},[460,951,952,955,957,959,961],{"class":462,"line":630},[460,953,954],{"class":541},"    optionality-description",[460,956,548],{"class":469},[460,958,551],{"class":469},[460,960,331],{"class":486},[460,962,490],{"class":469},[460,964,965,968,970,972,974],{"class":462,"line":640},[460,966,967],{"class":541},"    additional-description",[460,969,548],{"class":469},[460,971,551],{"class":469},[460,973,868],{"class":486},[460,975,490],{"class":469},[460,977,978],{"class":462,"line":645},[460,979,980],{"class":469},"  \u002F>\n",[460,982,983,985,987],{"class":462,"line":654},[460,984,633],{"class":469},[460,986,521],{"class":537},[460,988,558],{"class":469},[707,990,992],{"id":991},"validation-errors","Validation errors",[492,994,995,998,999,1002],{},[457,996,997],{},"errors"," renders validation messages below the input once ",[457,1000,1001],{},"touched"," marks the validation as active:",[511,1004,1005,1009],{},[514,1006],{"className":1007,"label":518,":errors":1008,":touched":863},[517],"[{\"label\":\"Enter a valid email address\",\"param\":\"email\"}]",[521,1010,1011],{"v-slot:code":455},[450,1012,1014],{"className":525,"code":1013,"language":527,"meta":455,"style":455},"\u003Ctemplate>\n  \u003CInput\n    v-model=\"email\"\n    label=\"Email address\"\n    touched\n    :errors=\"[{ label: 'Enter a valid email address', param: 'email' }]\"\n  \u002F>\n\u003C\u002Ftemplate>\n",[457,1015,1016,1024,1030,1042,1054,1059,1104,1108],{"__ignoreMap":455},[460,1017,1018,1020,1022],{"class":462,"line":463},[460,1019,534],{"class":469},[460,1021,521],{"class":537},[460,1023,558],{"class":469},[460,1025,1026,1028],{"class":462,"line":561},[460,1027,657],{"class":469},[460,1029,922],{"class":537},[460,1031,1032,1034,1036,1038,1040],{"class":462,"line":580},[460,1033,927],{"class":541},[460,1035,548],{"class":469},[460,1037,551],{"class":469},[460,1039,669],{"class":473},[460,1041,490],{"class":469},[460,1043,1044,1046,1048,1050,1052],{"class":462,"line":600},[460,1045,941],{"class":541},[460,1047,548],{"class":469},[460,1049,551],{"class":469},[460,1051,518],{"class":486},[460,1053,490],{"class":469},[460,1055,1056],{"class":462,"line":607},[460,1057,1058],{"class":541},"    touched\n",[460,1060,1061,1064,1066,1068,1070,1073,1075,1078,1081,1084,1086,1088,1091,1093,1095,1097,1099,1102],{"class":462,"line":630},[460,1062,1063],{"class":469},"    :",[460,1065,997],{"class":541},[460,1067,548],{"class":469},[460,1069,551],{"class":469},[460,1071,1072],{"class":469},"[{ ",[460,1074,508],{"class":537},[460,1076,1077],{"class":469},": ",[460,1079,1080],{"class":469},"'",[460,1082,1083],{"class":486},"Enter a valid email address",[460,1085,1080],{"class":469},[460,1087,720],{"class":469},[460,1089,1090],{"class":537},"param",[460,1092,1077],{"class":469},[460,1094,1080],{"class":469},[460,1096,669],{"class":486},[460,1098,1080],{"class":469},[460,1100,1101],{"class":469}," }]",[460,1103,490],{"class":469},[460,1105,1106],{"class":462,"line":640},[460,1107,980],{"class":469},[460,1109,1110,1112,1114],{"class":462,"line":645},[460,1111,633],{"class":469},[460,1113,521],{"class":537},[460,1115,558],{"class":469},[492,1117,1118,1119,1122],{},"Keep ",[457,1120,1121],{},"errors-html"," off unless the error labels come from a trusted source — it renders them as raw HTML.",[707,1124,1126],{"id":1125},"warning","Warning",[492,1128,1129,1131,1132,1135],{},[457,1130,1125],{}," shows the warning state while no errors exist, with ",[457,1133,1134],{},"warning-message"," rendered below the field:",[511,1137,1138,1142],{},[514,1139],{"className":1140,"label":518,":warning":863,"warning-message":1141},[517],"Did you mean gmail.com?",[521,1143,1144],{"v-slot:code":455},[450,1145,1147],{"className":525,"code":1146,"language":527,"meta":455,"style":455},"\u003Ctemplate>\n  \u003CInput\n    v-model=\"email\"\n    label=\"Email address\"\n    warning\n    warning-message=\"Did you mean gmail.com?\"\n  \u002F>\n\u003C\u002Ftemplate>\n",[457,1148,1149,1157,1163,1175,1187,1192,1205,1209],{"__ignoreMap":455},[460,1150,1151,1153,1155],{"class":462,"line":463},[460,1152,534],{"class":469},[460,1154,521],{"class":537},[460,1156,558],{"class":469},[460,1158,1159,1161],{"class":462,"line":561},[460,1160,657],{"class":469},[460,1162,922],{"class":537},[460,1164,1165,1167,1169,1171,1173],{"class":462,"line":580},[460,1166,927],{"class":541},[460,1168,548],{"class":469},[460,1170,551],{"class":469},[460,1172,669],{"class":473},[460,1174,490],{"class":469},[460,1176,1177,1179,1181,1183,1185],{"class":462,"line":600},[460,1178,941],{"class":541},[460,1180,548],{"class":469},[460,1182,551],{"class":469},[460,1184,518],{"class":486},[460,1186,490],{"class":469},[460,1188,1189],{"class":462,"line":607},[460,1190,1191],{"class":541},"    warning\n",[460,1193,1194,1197,1199,1201,1203],{"class":462,"line":630},[460,1195,1196],{"class":541},"    warning-message",[460,1198,548],{"class":469},[460,1200,551],{"class":469},[460,1202,1141],{"class":486},[460,1204,490],{"class":469},[460,1206,1207],{"class":462,"line":640},[460,1208,980],{"class":469},[460,1210,1211,1213,1215],{"class":462,"line":645},[460,1212,633],{"class":469},[460,1214,521],{"class":537},[460,1216,558],{"class":469},[707,1218,1220],{"id":1219},"disabled-and-loading","Disabled and loading",[492,1222,1223,1226],{},[457,1224,1225],{},"loading"," shows a spinner and suppresses the validation state icons:",[511,1228,1229,1233,1237],{},[514,1230],{"className":1231,"label":1232,":disabled":863},[517],"Customer number",[514,1234],{"className":1235,"label":1236,":loading":863},[517],"Voucher code",[521,1238,1239],{"v-slot:code":455},[450,1240,1242],{"className":525,"code":1241,"language":527,"meta":455,"style":455},"\u003Ctemplate>\n  \u003CInput v-model=\"customerNumber\" label=\"Customer number\" disabled \u002F>\n  \u003CInput v-model=\"voucher\" label=\"Voucher code\" loading \u002F>\n\u003C\u002Ftemplate>\n",[457,1243,1244,1252,1284,1316],{"__ignoreMap":455},[460,1245,1246,1248,1250],{"class":462,"line":463},[460,1247,534],{"class":469},[460,1249,521],{"class":537},[460,1251,558],{"class":469},[460,1253,1254,1256,1258,1260,1262,1264,1267,1269,1271,1273,1275,1277,1279,1282],{"class":462,"line":561},[460,1255,657],{"class":469},[460,1257,109],{"class":537},[460,1259,662],{"class":541},[460,1261,548],{"class":469},[460,1263,551],{"class":469},[460,1265,1266],{"class":473},"customerNumber",[460,1268,551],{"class":469},[460,1270,674],{"class":541},[460,1272,548],{"class":469},[460,1274,551],{"class":469},[460,1276,1232],{"class":486},[460,1278,551],{"class":469},[460,1280,1281],{"class":541}," disabled",[460,1283,696],{"class":469},[460,1285,1286,1288,1290,1292,1294,1296,1299,1301,1303,1305,1307,1309,1311,1314],{"class":462,"line":580},[460,1287,657],{"class":469},[460,1289,109],{"class":537},[460,1291,662],{"class":541},[460,1293,548],{"class":469},[460,1295,551],{"class":469},[460,1297,1298],{"class":473},"voucher",[460,1300,551],{"class":469},[460,1302,674],{"class":541},[460,1304,548],{"class":469},[460,1306,551],{"class":469},[460,1308,1236],{"class":486},[460,1310,551],{"class":469},[460,1312,1313],{"class":541}," loading",[460,1315,696],{"class":469},[460,1317,1318,1320,1322],{"class":462,"line":600},[460,1319,633],{"class":469},[460,1321,521],{"class":537},[460,1323,558],{"class":469},[707,1325,1326],{"id":728},"Password",[492,1328,1329,1332],{},[457,1330,1331],{},"type=\"password\""," renders a visibility toggle. Its accessible labels and the live-region announcements are configurable:",[450,1334,1336],{"className":525,"code":1335,"language":527,"meta":455,"style":455},"\u003Ctemplate>\n  \u003CInput\n    v-model=\"password\"\n    type=\"password\"\n    label=\"Password\"\n    show-password-label=\"Show password\"\n    hide-password-label=\"Hide password\"\n    password-visible-message=\"Password is visible\"\n    password-hidden-message=\"Password is hidden\"\n  \u002F>\n\u003C\u002Ftemplate>\n",[457,1337,1338,1346,1352,1364,1377,1389,1403,1417,1431,1445,1449],{"__ignoreMap":455},[460,1339,1340,1342,1344],{"class":462,"line":463},[460,1341,534],{"class":469},[460,1343,521],{"class":537},[460,1345,558],{"class":469},[460,1347,1348,1350],{"class":462,"line":561},[460,1349,657],{"class":469},[460,1351,922],{"class":537},[460,1353,1354,1356,1358,1360,1362],{"class":462,"line":580},[460,1355,927],{"class":541},[460,1357,548],{"class":469},[460,1359,551],{"class":469},[460,1361,728],{"class":473},[460,1363,490],{"class":469},[460,1365,1366,1369,1371,1373,1375],{"class":462,"line":600},[460,1367,1368],{"class":541},"    type",[460,1370,548],{"class":469},[460,1372,551],{"class":469},[460,1374,728],{"class":486},[460,1376,490],{"class":469},[460,1378,1379,1381,1383,1385,1387],{"class":462,"line":607},[460,1380,941],{"class":541},[460,1382,548],{"class":469},[460,1384,551],{"class":469},[460,1386,1326],{"class":486},[460,1388,490],{"class":469},[460,1390,1391,1394,1396,1398,1401],{"class":462,"line":630},[460,1392,1393],{"class":541},"    show-password-label",[460,1395,548],{"class":469},[460,1397,551],{"class":469},[460,1399,1400],{"class":486},"Show password",[460,1402,490],{"class":469},[460,1404,1405,1408,1410,1412,1415],{"class":462,"line":640},[460,1406,1407],{"class":541},"    hide-password-label",[460,1409,548],{"class":469},[460,1411,551],{"class":469},[460,1413,1414],{"class":486},"Hide password",[460,1416,490],{"class":469},[460,1418,1419,1422,1424,1426,1429],{"class":462,"line":645},[460,1420,1421],{"class":541},"    password-visible-message",[460,1423,548],{"class":469},[460,1425,551],{"class":469},[460,1427,1428],{"class":486},"Password is visible",[460,1430,490],{"class":469},[460,1432,1433,1436,1438,1440,1443],{"class":462,"line":654},[460,1434,1435],{"class":541},"    password-hidden-message",[460,1437,548],{"class":469},[460,1439,551],{"class":469},[460,1441,1442],{"class":486},"Password is hidden",[460,1444,490],{"class":469},[460,1446,1447],{"class":462,"line":699},[460,1448,980],{"class":469},[460,1450,1452,1454,1456],{"class":462,"line":1451},11,[460,1453,633],{"class":469},[460,1455,521],{"class":537},[460,1457,558],{"class":469},[445,1459,1461],{"id":1460},"playground","Playground",[1463,1464],"component-playground",{"component":1465},"input",[1467,1468,1469],"style",{},"html pre.shiki code .s6cf3, html code.shiki .s6cf3{--shiki-default:#89DDFF;--shiki-default-font-style:italic}html pre.shiki code .sAklC, html code.shiki .sAklC{--shiki-default:#89DDFF}html pre.shiki code .s0W1g, html code.shiki .s0W1g{--shiki-default:#BABED8}html pre.shiki code .sfyAc, html code.shiki .sfyAc{--shiki-default:#C3E88D}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 pre.shiki code .s-wAU, html code.shiki .s-wAU{--shiki-default:#F07178}html pre.shiki code .sJ14y, html code.shiki .sJ14y{--shiki-default:#C792EA}html pre.shiki code .sdLwU, html code.shiki .sdLwU{--shiki-default:#82AAFF}",{"title":455,"searchDepth":463,"depth":561,"links":1471},[1472,1473,1481],{"id":447,"depth":561,"text":448},{"id":497,"depth":561,"text":498,"children":1474},[1475,1476,1477,1478,1479,1480],{"id":709,"depth":580,"text":710},{"id":841,"depth":580,"text":842},{"id":991,"depth":580,"text":992},{"id":1125,"depth":580,"text":1126},{"id":1219,"depth":580,"text":1220},{"id":728,"depth":580,"text":1326},{"id":1460,"depth":561,"text":1461},"Let users enter and edit a single line of text.","md",null,{},"\u002Fcomponents\u002Finput\u002Fdeveloper",{"title":109,"description":1482},"2.components\u002F11.input\u002F3.developer","LLlTsUxKqdNr-TrQhnuMlxzYalJCF-4Gwxr6G23bsiM",1793289681749]