[{"data":1,"prerenderedAt":1805},["ShallowReactive",2],{"locale-alternates":3,"docs-nav-en":124,"api-none":352,"page-en-\u002Fguides\u002Fvalidated-forms":353},{"\u002Fit\u002Fcomponenti\u002Fbb-accordion":4,"\u002Fen\u002Fcomponents\u002Fbb-accordion":5,"\u002Fit\u002Fcomponenti\u002Fbb-alert":6,"\u002Fen\u002Fcomponents\u002Fbb-alert":7,"\u002Fit\u002Fcomponenti\u002Fbb-asterisk":8,"\u002Fen\u002Fcomponents\u002Fbb-asterisk":9,"\u002Fit\u002Fcomponenti\u002Fbb-avatar":10,"\u002Fen\u002Fcomponents\u002Fbb-avatar":11,"\u002Fit\u002Fcomponenti\u002Fbb-badge":12,"\u002Fen\u002Fcomponents\u002Fbb-badge":13,"\u002Fit\u002Fcomponenti\u002Fbb-base-button":14,"\u002Fen\u002Fcomponents\u002Fbb-base-button":15,"\u002Fit\u002Fcomponenti\u002Fbb-breadcrumbs":16,"\u002Fen\u002Fcomponents\u002Fbb-breadcrumbs":17,"\u002Fit\u002Fcomponenti\u002Fbb-button":18,"\u002Fen\u002Fcomponents\u002Fbb-button":19,"\u002Fit\u002Fcomponenti\u002Fbb-checkbox":20,"\u002Fen\u002Fcomponents\u002Fbb-checkbox":21,"\u002Fit\u002Fcomponenti\u002Fbb-checkbox-group":22,"\u002Fen\u002Fcomponents\u002Fbb-checkbox-group":23,"\u002Fit\u002Fcomponenti\u002Fbb-collapsible":24,"\u002Fen\u002Fcomponents\u002Fbb-collapsible":25,"\u002Fit\u002Fcomponenti\u002Fbb-color-input":26,"\u002Fen\u002Fcomponents\u002Fbb-color-input":27,"\u002Fit\u002Fcomponenti\u002Fbb-color-palette":28,"\u002Fen\u002Fcomponents\u002Fbb-color-palette":29,"\u002Fit\u002Fcomponenti\u002Fbb-confirm":30,"\u002Fen\u002Fcomponents\u002Fbb-confirm":31,"\u002Fit\u002Fcomponenti\u002Fbb-date-picker":32,"\u002Fen\u002Fcomponents\u002Fbb-date-picker":33,"\u002Fit\u002Fcomponenti\u002Fbb-date-picker-input":34,"\u002Fen\u002Fcomponents\u002Fbb-date-picker-input":35,"\u002Fit\u002Fcomponenti\u002Fbb-dialog":36,"\u002Fen\u002Fcomponents\u002Fbb-dialog":37,"\u002Fit\u002Fcomponenti\u002Fbb-dropdown":38,"\u002Fen\u002Fcomponents\u002Fbb-dropdown":39,"\u002Fit\u002Fcomponenti\u002Fbb-dropdown-button":40,"\u002Fen\u002Fcomponents\u002Fbb-dropdown-button":41,"\u002Fit\u002Fcomponenti\u002Fbb-dropzone":42,"\u002Fen\u002Fcomponents\u002Fbb-dropzone":43,"\u002Fit\u002Fcomponenti\u002Fbb-form":44,"\u002Fen\u002Fcomponents\u002Fbb-form":45,"\u002Fit\u002Fcomponenti\u002Fbb-icon":46,"\u002Fen\u002Fcomponents\u002Fbb-icon":47,"\u002Fit\u002Fcomponenti\u002Fbb-indicator":48,"\u002Fen\u002Fcomponents\u002Fbb-indicator":49,"\u002Fit\u002Fcomponenti\u002Fbb-number-input":50,"\u002Fen\u002Fcomponents\u002Fbb-number-input":51,"\u002Fit\u002Fcomponenti\u002Fbb-off-canvas":52,"\u002Fen\u002Fcomponents\u002Fbb-off-canvas":53,"\u002Fit\u002Fcomponenti\u002Fbb-pagination":54,"\u002Fen\u002Fcomponents\u002Fbb-pagination":55,"\u002Fit\u002Fcomponenti\u002Fbb-popover":56,"\u002Fen\u002Fcomponents\u002Fbb-popover":57,"\u002Fit\u002Fcomponenti\u002Fbb-progress":58,"\u002Fen\u002Fcomponents\u002Fbb-progress":59,"\u002Fit\u002Fcomponenti\u002Fbb-radio":60,"\u002Fen\u002Fcomponents\u002Fbb-radio":61,"\u002Fit\u002Fcomponenti\u002Fbb-radio-group":62,"\u002Fen\u002Fcomponents\u002Fbb-radio-group":63,"\u002Fit\u002Fcomponenti\u002Fbb-rating":64,"\u002Fen\u002Fcomponents\u002Fbb-rating":65,"\u002Fit\u002Fcomponenti\u002Fbb-select":66,"\u002Fen\u002Fcomponents\u002Fbb-select":67,"\u002Fit\u002Fcomponenti\u002Fbb-select-popover":68,"\u002Fen\u002Fcomponents\u002Fbb-select-popover":69,"\u002Fit\u002Fcomponenti\u002Fbb-slider":70,"\u002Fen\u002Fcomponents\u002Fbb-slider":71,"\u002Fit\u002Fcomponenti\u002Fbb-smooth-height":72,"\u002Fen\u002Fcomponents\u002Fbb-smooth-height":73,"\u002Fit\u002Fcomponenti\u002Fbb-spinner":74,"\u002Fen\u002Fcomponents\u002Fbb-spinner":75,"\u002Fit\u002Fcomponenti\u002Fbb-switch":76,"\u002Fen\u002Fcomponents\u002Fbb-switch":77,"\u002Fit\u002Fcomponenti\u002Fbb-switch-group":78,"\u002Fen\u002Fcomponents\u002Fbb-switch-group":79,"\u002Fit\u002Fcomponenti\u002Fbb-table":80,"\u002Fen\u002Fcomponents\u002Fbb-table":81,"\u002Fit\u002Fcomponenti\u002Fbb-tabs":82,"\u002Fen\u002Fcomponents\u002Fbb-tabs":83,"\u002Fit\u002Fcomponenti\u002Fbb-tag":84,"\u002Fen\u002Fcomponents\u002Fbb-tag":85,"\u002Fit\u002Fcomponenti\u002Fbb-text-input":86,"\u002Fen\u002Fcomponents\u002Fbb-text-input":87,"\u002Fit\u002Fcomponenti\u002Fbb-textarea":88,"\u002Fen\u002Fcomponents\u002Fbb-textarea":89,"\u002Fit\u002Fcomponenti\u002Fbb-time-picker":90,"\u002Fen\u002Fcomponents\u002Fbb-time-picker":91,"\u002Fit\u002Fcomponenti\u002Fbb-time-picker-input":92,"\u002Fen\u002Fcomponents\u002Fbb-time-picker-input":93,"\u002Fit\u002Fcomponenti\u002Fbb-toast":94,"\u002Fen\u002Fcomponents\u002Fbb-toast":95,"\u002Fit\u002Fcomponenti\u002Fbb-tooltip":96,"\u002Fen\u002Fcomponents\u002Fbb-tooltip":97,"\u002Fit\u002Fcomponenti\u002Fbb-tree":98,"\u002Fen\u002Fcomponents\u002Fbb-tree":99,"\u002Fit\u002Fguide\u002Fai-agents":100,"\u002Fen\u002Fguides\u002Fai-agents":101,"\u002Fit\u002Fguide\u002Fcoherence":102,"\u002Fen\u002Fguides\u002Fcoherence":103,"\u002Fit\u002Fguide\u002Fdesign-language":104,"\u002Fen\u002Fguides\u002Fdesign-language":105,"\u002Fit\u002Fguide\u002Fdesign-tokens":106,"\u002Fen\u002Fguides\u002Fdesign-tokens":107,"\u002Fit\u002Fguide\u002Ffetching-data":108,"\u002Fen\u002Fguides\u002Ffetching-data":109,"\u002Fit\u002Fguide\u002Ficons":110,"\u002Fen\u002Fguides\u002Ficons":111,"\u002Fit\u002Fguide\u002Finertia":112,"\u002Fen\u002Fguides\u002Finertia":113,"\u002Fit\u002Fguide\u002Finstallation":114,"\u002Fen\u002Fguides\u002Finstallation":115,"\u002Fit\u002Fguide\u002Fmigration":116,"\u002Fen\u002Fguides\u002Fmigration":117,"\u002Fit\u002Fguide\u002Fnuxt":118,"\u002Fen\u002Fguides\u002Fnuxt":119,"\u002Fit\u002Fguide\u002Foptions-and-items":120,"\u002Fen\u002Fguides\u002Foptions-and-items":121,"\u002Fit\u002Fguide\u002Fvalidated-forms":122,"\u002Fen\u002Fguides\u002Fvalidated-forms":123},"\u002Fen\u002Fcomponents\u002Fbb-accordion","\u002Fit\u002Fcomponenti\u002Fbb-accordion","\u002Fen\u002Fcomponents\u002Fbb-alert","\u002Fit\u002Fcomponenti\u002Fbb-alert","\u002Fen\u002Fcomponents\u002Fbb-asterisk","\u002Fit\u002Fcomponenti\u002Fbb-asterisk","\u002Fen\u002Fcomponents\u002Fbb-avatar","\u002Fit\u002Fcomponenti\u002Fbb-avatar","\u002Fen\u002Fcomponents\u002Fbb-badge","\u002Fit\u002Fcomponenti\u002Fbb-badge","\u002Fen\u002Fcomponents\u002Fbb-base-button","\u002Fit\u002Fcomponenti\u002Fbb-base-button","\u002Fen\u002Fcomponents\u002Fbb-breadcrumbs","\u002Fit\u002Fcomponenti\u002Fbb-breadcrumbs","\u002Fen\u002Fcomponents\u002Fbb-button","\u002Fit\u002Fcomponenti\u002Fbb-button","\u002Fen\u002Fcomponents\u002Fbb-checkbox","\u002Fit\u002Fcomponenti\u002Fbb-checkbox","\u002Fen\u002Fcomponents\u002Fbb-checkbox-group","\u002Fit\u002Fcomponenti\u002Fbb-checkbox-group","\u002Fen\u002Fcomponents\u002Fbb-collapsible","\u002Fit\u002Fcomponenti\u002Fbb-collapsible","\u002Fen\u002Fcomponents\u002Fbb-color-input","\u002Fit\u002Fcomponenti\u002Fbb-color-input","\u002Fen\u002Fcomponents\u002Fbb-color-palette","\u002Fit\u002Fcomponenti\u002Fbb-color-palette","\u002Fen\u002Fcomponents\u002Fbb-confirm","\u002Fit\u002Fcomponenti\u002Fbb-confirm","\u002Fen\u002Fcomponents\u002Fbb-date-picker","\u002Fit\u002Fcomponenti\u002Fbb-date-picker","\u002Fen\u002Fcomponents\u002Fbb-date-picker-input","\u002Fit\u002Fcomponenti\u002Fbb-date-picker-input","\u002Fen\u002Fcomponents\u002Fbb-dialog","\u002Fit\u002Fcomponenti\u002Fbb-dialog","\u002Fen\u002Fcomponents\u002Fbb-dropdown","\u002Fit\u002Fcomponenti\u002Fbb-dropdown","\u002Fen\u002Fcomponents\u002Fbb-dropdown-button","\u002Fit\u002Fcomponenti\u002Fbb-dropdown-button","\u002Fen\u002Fcomponents\u002Fbb-dropzone","\u002Fit\u002Fcomponenti\u002Fbb-dropzone","\u002Fen\u002Fcomponents\u002Fbb-form","\u002Fit\u002Fcomponenti\u002Fbb-form","\u002Fen\u002Fcomponents\u002Fbb-icon","\u002Fit\u002Fcomponenti\u002Fbb-icon","\u002Fen\u002Fcomponents\u002Fbb-indicator","\u002Fit\u002Fcomponenti\u002Fbb-indicator","\u002Fen\u002Fcomponents\u002Fbb-number-input","\u002Fit\u002Fcomponenti\u002Fbb-number-input","\u002Fen\u002Fcomponents\u002Fbb-off-canvas","\u002Fit\u002Fcomponenti\u002Fbb-off-canvas","\u002Fen\u002Fcomponents\u002Fbb-pagination","\u002Fit\u002Fcomponenti\u002Fbb-pagination","\u002Fen\u002Fcomponents\u002Fbb-popover","\u002Fit\u002Fcomponenti\u002Fbb-popover","\u002Fen\u002Fcomponents\u002Fbb-progress","\u002Fit\u002Fcomponenti\u002Fbb-progress","\u002Fen\u002Fcomponents\u002Fbb-radio","\u002Fit\u002Fcomponenti\u002Fbb-radio","\u002Fen\u002Fcomponents\u002Fbb-radio-group","\u002Fit\u002Fcomponenti\u002Fbb-radio-group","\u002Fen\u002Fcomponents\u002Fbb-rating","\u002Fit\u002Fcomponenti\u002Fbb-rating","\u002Fen\u002Fcomponents\u002Fbb-select","\u002Fit\u002Fcomponenti\u002Fbb-select","\u002Fen\u002Fcomponents\u002Fbb-select-popover","\u002Fit\u002Fcomponenti\u002Fbb-select-popover","\u002Fen\u002Fcomponents\u002Fbb-slider","\u002Fit\u002Fcomponenti\u002Fbb-slider","\u002Fen\u002Fcomponents\u002Fbb-smooth-height","\u002Fit\u002Fcomponenti\u002Fbb-smooth-height","\u002Fen\u002Fcomponents\u002Fbb-spinner","\u002Fit\u002Fcomponenti\u002Fbb-spinner","\u002Fen\u002Fcomponents\u002Fbb-switch","\u002Fit\u002Fcomponenti\u002Fbb-switch","\u002Fen\u002Fcomponents\u002Fbb-switch-group","\u002Fit\u002Fcomponenti\u002Fbb-switch-group","\u002Fen\u002Fcomponents\u002Fbb-table","\u002Fit\u002Fcomponenti\u002Fbb-table","\u002Fen\u002Fcomponents\u002Fbb-tabs","\u002Fit\u002Fcomponenti\u002Fbb-tabs","\u002Fen\u002Fcomponents\u002Fbb-tag","\u002Fit\u002Fcomponenti\u002Fbb-tag","\u002Fen\u002Fcomponents\u002Fbb-text-input","\u002Fit\u002Fcomponenti\u002Fbb-text-input","\u002Fen\u002Fcomponents\u002Fbb-textarea","\u002Fit\u002Fcomponenti\u002Fbb-textarea","\u002Fen\u002Fcomponents\u002Fbb-time-picker","\u002Fit\u002Fcomponenti\u002Fbb-time-picker","\u002Fen\u002Fcomponents\u002Fbb-time-picker-input","\u002Fit\u002Fcomponenti\u002Fbb-time-picker-input","\u002Fen\u002Fcomponents\u002Fbb-toast","\u002Fit\u002Fcomponenti\u002Fbb-toast","\u002Fen\u002Fcomponents\u002Fbb-tooltip","\u002Fit\u002Fcomponenti\u002Fbb-tooltip","\u002Fen\u002Fcomponents\u002Fbb-tree","\u002Fit\u002Fcomponenti\u002Fbb-tree","\u002Fen\u002Fguides\u002Fai-agents","\u002Fit\u002Fguide\u002Fai-agents","\u002Fen\u002Fguides\u002Fcoherence","\u002Fit\u002Fguide\u002Fcoherence","\u002Fen\u002Fguides\u002Fdesign-language","\u002Fit\u002Fguide\u002Fdesign-language","\u002Fen\u002Fguides\u002Fdesign-tokens","\u002Fit\u002Fguide\u002Fdesign-tokens","\u002Fen\u002Fguides\u002Ffetching-data","\u002Fit\u002Fguide\u002Ffetching-data","\u002Fen\u002Fguides\u002Ficons","\u002Fit\u002Fguide\u002Ficons","\u002Fen\u002Fguides\u002Finertia","\u002Fit\u002Fguide\u002Finertia","\u002Fen\u002Fguides\u002Finstallation","\u002Fit\u002Fguide\u002Finstallation","\u002Fen\u002Fguides\u002Fmigration","\u002Fit\u002Fguide\u002Fmigration","\u002Fen\u002Fguides\u002Fnuxt","\u002Fit\u002Fguide\u002Fnuxt","\u002Fen\u002Fguides\u002Foptions-and-items","\u002Fit\u002Fguide\u002Foptions-and-items","\u002Fen\u002Fguides\u002Fvalidated-forms","\u002Fit\u002Fguide\u002Fvalidated-forms",[125,136,145,166,178,220,253,286,307,328,340,346],{"label":126,"entries":127},"Getting started",[128,132],{"title":129,"path":130,"order":131},"Installation","\u002Fguides\u002Finstallation",1,{"title":133,"path":134,"order":135},"Migrating from v2","\u002Fguides\u002Fmigration",2,{"label":137,"entries":138},"Design system",[139,142],{"title":140,"path":141,"order":131},"Design tokens","\u002Fguides\u002Fdesign-tokens",{"title":143,"path":144,"order":135},"Design language","\u002Fguides\u002Fdesign-language",{"label":146,"entries":147},"Playbooks",[148,151,154,158,162],{"title":149,"path":150,"order":131},"Options and items","\u002Fguides\u002Foptions-and-items",{"title":152,"path":153,"order":135},"Fetching data","\u002Fguides\u002Ffetching-data",{"title":155,"path":156,"order":157},"Coherence","\u002Fguides\u002Fcoherence",3,{"title":159,"path":160,"order":161},"Validated forms","\u002Fguides\u002Fvalidated-forms",4,{"title":163,"path":164,"order":165},"Icons","\u002Fguides\u002Ficons",5,{"label":167,"entries":168},"Ecosystem",[169,172,175],{"title":170,"path":171,"order":131},"Inertia and Laravel","\u002Fguides\u002Finertia",{"title":173,"path":174,"order":135},"Nuxt","\u002Fguides\u002Fnuxt",{"title":176,"path":177,"order":157},"AI agents","\u002Fguides\u002Fai-agents",{"label":179,"entries":180},"Inputs",[181,184,187,190,193,196,200,204,208,212,216],{"title":182,"path":183,"component":182,"order":131},"BbBaseButton","\u002Fcomponents\u002Fbb-base-button",{"title":185,"path":186,"component":185,"order":135},"BbButton","\u002Fcomponents\u002Fbb-button",{"title":188,"path":189,"component":188,"order":157},"BbColorInput","\u002Fcomponents\u002Fbb-color-input",{"title":191,"path":192,"component":191,"order":161},"BbDatePickerInput","\u002Fcomponents\u002Fbb-date-picker-input",{"title":194,"path":195,"component":194,"order":165},"BbDropzone","\u002Fcomponents\u002Fbb-dropzone",{"title":197,"path":198,"component":197,"order":199},"BbForm","\u002Fcomponents\u002Fbb-form",6,{"title":201,"path":202,"component":201,"order":203},"BbNumberInput","\u002Fcomponents\u002Fbb-number-input",7,{"title":205,"path":206,"component":205,"order":207},"BbTag","\u002Fcomponents\u002Fbb-tag",8,{"title":209,"path":210,"component":209,"order":211},"BbTextarea","\u002Fcomponents\u002Fbb-textarea",9,{"title":213,"path":214,"component":213,"order":215},"BbTextInput","\u002Fcomponents\u002Fbb-text-input",10,{"title":217,"path":218,"component":217,"order":219},"BbTimePickerInput","\u002Fcomponents\u002Fbb-time-picker-input",11,{"label":221,"entries":222},"Selection",[223,226,229,232,235,238,241,244,247,250],{"title":224,"path":225,"component":224,"order":131},"BbCheckbox","\u002Fcomponents\u002Fbb-checkbox",{"title":227,"path":228,"component":227,"order":135},"BbCheckboxGroup","\u002Fcomponents\u002Fbb-checkbox-group",{"title":230,"path":231,"component":230,"order":157},"BbRadio","\u002Fcomponents\u002Fbb-radio",{"title":233,"path":234,"component":233,"order":161},"BbRadioGroup","\u002Fcomponents\u002Fbb-radio-group",{"title":236,"path":237,"component":236,"order":165},"BbRating","\u002Fcomponents\u002Fbb-rating",{"title":239,"path":240,"component":239,"order":199},"BbSelect","\u002Fcomponents\u002Fbb-select",{"title":242,"path":243,"component":242,"order":203},"BbSelectPopover","\u002Fcomponents\u002Fbb-select-popover",{"title":245,"path":246,"component":245,"order":207},"BbSlider","\u002Fcomponents\u002Fbb-slider",{"title":248,"path":249,"component":248,"order":211},"BbSwitch","\u002Fcomponents\u002Fbb-switch",{"title":251,"path":252,"component":251,"order":215},"BbSwitchGroup","\u002Fcomponents\u002Fbb-switch-group",{"label":254,"entries":255},"Overlay",[256,259,262,265,268,271,274,277,280,283],{"title":257,"path":258,"component":257,"order":131},"BbColorPalette","\u002Fcomponents\u002Fbb-color-palette",{"title":260,"path":261,"component":260,"order":135},"BbConfirm","\u002Fcomponents\u002Fbb-confirm",{"title":263,"path":264,"component":263,"order":157},"BbDatePicker","\u002Fcomponents\u002Fbb-date-picker",{"title":266,"path":267,"component":266,"order":161},"BbDialog","\u002Fcomponents\u002Fbb-dialog",{"title":269,"path":270,"component":269,"order":165},"BbDropdown","\u002Fcomponents\u002Fbb-dropdown",{"title":272,"path":273,"component":272,"order":199},"BbDropdownButton","\u002Fcomponents\u002Fbb-dropdown-button",{"title":275,"path":276,"component":275,"order":203},"BbOffCanvas","\u002Fcomponents\u002Fbb-off-canvas",{"title":278,"path":279,"component":278,"order":207},"BbPopover","\u002Fcomponents\u002Fbb-popover",{"title":281,"path":282,"component":281,"order":211},"BbTimePicker","\u002Fcomponents\u002Fbb-time-picker",{"title":284,"path":285,"component":284,"order":215},"BbTooltip","\u002Fcomponents\u002Fbb-tooltip",{"label":287,"entries":288},"Navigation",[289,292,295,298,301,304],{"title":290,"path":291,"component":290,"order":131},"BbAccordion","\u002Fcomponents\u002Fbb-accordion",{"title":293,"path":294,"component":293,"order":135},"BbBreadcrumbs","\u002Fcomponents\u002Fbb-breadcrumbs",{"title":296,"path":297,"component":296,"order":157},"BbCollapsible","\u002Fcomponents\u002Fbb-collapsible",{"title":299,"path":300,"component":299,"order":161},"BbPagination","\u002Fcomponents\u002Fbb-pagination",{"title":302,"path":303,"component":302,"order":165},"BbTabs","\u002Fcomponents\u002Fbb-tabs",{"title":305,"path":306,"component":305,"order":199},"BbTree","\u002Fcomponents\u002Fbb-tree",{"label":308,"entries":309},"Feedback",[310,313,316,319,322,325],{"title":311,"path":312,"component":311,"order":131},"BbAlert","\u002Fcomponents\u002Fbb-alert",{"title":314,"path":315,"component":314,"order":135},"BbBadge","\u002Fcomponents\u002Fbb-badge",{"title":317,"path":318,"component":317,"order":157},"BbIndicator","\u002Fcomponents\u002Fbb-indicator",{"title":320,"path":321,"component":320,"order":161},"BbProgress","\u002Fcomponents\u002Fbb-progress",{"title":323,"path":324,"component":323,"order":165},"BbSpinner","\u002Fcomponents\u002Fbb-spinner",{"title":326,"path":327,"component":326,"order":199},"BbToast","\u002Fcomponents\u002Fbb-toast",{"label":329,"entries":330},"Data Display",[331,334,337],{"title":332,"path":333,"component":332,"order":131},"BbAvatar","\u002Fcomponents\u002Fbb-avatar",{"title":335,"path":336,"component":335,"order":135},"BbIcon","\u002Fcomponents\u002Fbb-icon",{"title":338,"path":339,"component":338,"order":157},"BbTable","\u002Fcomponents\u002Fbb-table",{"label":341,"entries":342},"Layout & Utility",[343],{"title":344,"path":345,"component":344,"order":131},"BbSmoothHeight","\u002Fcomponents\u002Fbb-smooth-height",{"label":347,"entries":348},"Other",[349],{"title":350,"path":351,"component":350,"order":131},"BbAsterisk","\u002Fcomponents\u002Fbb-asterisk",null,{"id":354,"title":159,"body":355,"component":352,"description":1791,"extension":1792,"group":146,"meta":1793,"navigation":561,"order":161,"path":160,"sections":1794,"seo":1802,"stem":1803,"__hash__":1804},"docs_en\u002Fguides\u002Fvalidated-forms.md",{"type":356,"value":357,"toc":1782},"minimark",[358,388,395,403,418,460,472,477,484,790,809,826,832,853,1252,1278,1284,1290,1308,1315,1321,1387,1407,1506,1513,1524,1530,1603,1606,1612,1618,1641,1669,1676,1703,1711,1719,1762,1778],[359,360,361,365,366,373,374,376,377,379,380,383,384,387],"p",{},[362,363,364],"code",{},"bitboss-ui\u002Fvalidated"," ships the standard form controls with\n",[367,368,372],"a",{"href":369,"rel":370},"https:\u002F\u002Fvee-validate.logaretm.com\u002Fv4\u002F",[371],"nofollow","vee-validate"," field binding already\nattached. A validated ",[362,375,213],{}," inside a ",[362,378,197],{}," needs nothing but a ",[362,381,382],{},"label","\nand its ",[362,385,386],{},"rules",".",[359,389,390,394],{},[367,391,392],{"href":44},[362,393,197],{}," documents the host component itself. This page\nis the setup around it.",[396,397,399],"h2",{"id":398},"entrypoint",[400,401,402],"span",{},"A separate entrypoint",[359,404,405,406,408,409,413,414,417],{},"Import from ",[362,407,364],{}," ",[410,411,412],"strong",{},"only"," where you want validation. The core\n",[362,415,416],{},"bitboss-ui"," entrypoint never pulls vee-validate into an app that does not\nvalidate anything. That is why the two exist.",[419,420,425],"pre",{"className":421,"code":422,"language":423,"meta":424,"style":424},"language-bash shiki shiki-themes github-light-high-contrast github-dark-high-contrast","npm i vee-validate                             # required peer for \u002Fvalidated\nnpm i @vee-validate\u002Frules @vee-validate\u002Fi18n   # recommended: standard rules and messages\n","bash","",[362,426,427,445],{"__ignoreMap":424},[400,428,430,434,438,441],{"class":429,"line":131},"line",[400,431,433],{"class":432},"soyes","npm",[400,435,437],{"class":436},"sT6z2"," i",[400,439,440],{"class":436}," vee-validate",[400,442,444],{"class":443},"sLBg1","                             # required peer for \u002Fvalidated\n",[400,446,447,449,451,454,457],{"class":429,"line":135},[400,448,433],{"class":432},[400,450,437],{"class":436},[400,452,453],{"class":436}," @vee-validate\u002Frules",[400,455,456],{"class":436}," @vee-validate\u002Fi18n",[400,458,459],{"class":443},"   # recommended: standard rules and messages\n",[359,461,462,463,465,466,468,469,471],{},"The controls are the same components. ",[362,464,213],{}," from ",[362,467,364],{},"\nis ",[362,470,213],{}," plus field binding. Every prop you already know still works, and\nthree more are added.",[396,473,474],{"id":386},[400,475,476],{},"Define the rules once",[359,478,479,480,483],{},"Declare your rules with ",[362,481,482],{},"defineRule"," in a side-effect module, import that module\nfrom the entry point, and then reference them as plain strings on every field.\nOver a whole app this is the setup that costs least.",[419,485,489],{"className":486,"code":487,"language":488,"meta":424,"style":424},"language-ts shiki shiki-themes github-light-high-contrast github-dark-high-contrast","\u002F\u002F app\u002Fvalidators.ts\nimport { configure, defineRule } from 'vee-validate';\nimport { localize, setLocale } from '@vee-validate\u002Fi18n';\nimport en from '@vee-validate\u002Fi18n\u002Fdist\u002Flocale\u002Fen.json';\nimport { required, email, min_value, max_value, numeric, min, max } from '@vee-validate\u002Frules';\n\ndefineRule('required', required);\ndefineRule('email', email);\ndefineRule('min_value', min_value);\ndefineRule('max_value', max_value);\ndefineRule('numeric', numeric);\ndefineRule('min', min);\ndefineRule('max', max);\n\n\u002F\u002F Project rules use the same (value, params, ctx) signature.\ndefineRule('password', (v: unknown) =>\n    typeof v === 'string' && v.length > 0 && v.length \u003C 8\n        ? 'Password must be at least 8 characters'\n        : true\n);\n\nconfigure({ generateMessage: localize({ en }) });\nsetLocale('en');\n","ts",[362,490,491,496,515,529,543,557,563,577,589,601,613,625,638,651,656,662,691,733,742,751,757,762,777],{"__ignoreMap":424},[400,492,493],{"class":429,"line":131},[400,494,495],{"class":443},"\u002F\u002F app\u002Fvalidators.ts\n",[400,497,498,502,506,509,512],{"class":429,"line":135},[400,499,501],{"class":500},"sHUrx","import",[400,503,505],{"class":504},"suds8"," { configure, defineRule } ",[400,507,508],{"class":500},"from",[400,510,511],{"class":436}," 'vee-validate'",[400,513,514],{"class":504},";\n",[400,516,517,519,522,524,527],{"class":429,"line":157},[400,518,501],{"class":500},[400,520,521],{"class":504}," { localize, setLocale } ",[400,523,508],{"class":500},[400,525,526],{"class":436}," '@vee-validate\u002Fi18n'",[400,528,514],{"class":504},[400,530,531,533,536,538,541],{"class":429,"line":161},[400,532,501],{"class":500},[400,534,535],{"class":504}," en ",[400,537,508],{"class":500},[400,539,540],{"class":436}," '@vee-validate\u002Fi18n\u002Fdist\u002Flocale\u002Fen.json'",[400,542,514],{"class":504},[400,544,545,547,550,552,555],{"class":429,"line":165},[400,546,501],{"class":500},[400,548,549],{"class":504}," { required, email, min_value, max_value, numeric, min, max } ",[400,551,508],{"class":500},[400,553,554],{"class":436}," '@vee-validate\u002Frules'",[400,556,514],{"class":504},[400,558,559],{"class":429,"line":199},[400,560,562],{"emptyLinePlaceholder":561},true,"\n",[400,564,565,568,571,574],{"class":429,"line":203},[400,566,482],{"class":567},"sKwhi",[400,569,570],{"class":504},"(",[400,572,573],{"class":436},"'required'",[400,575,576],{"class":504},", required);\n",[400,578,579,581,583,586],{"class":429,"line":207},[400,580,482],{"class":567},[400,582,570],{"class":504},[400,584,585],{"class":436},"'email'",[400,587,588],{"class":504},", email);\n",[400,590,591,593,595,598],{"class":429,"line":211},[400,592,482],{"class":567},[400,594,570],{"class":504},[400,596,597],{"class":436},"'min_value'",[400,599,600],{"class":504},", min_value);\n",[400,602,603,605,607,610],{"class":429,"line":215},[400,604,482],{"class":567},[400,606,570],{"class":504},[400,608,609],{"class":436},"'max_value'",[400,611,612],{"class":504},", max_value);\n",[400,614,615,617,619,622],{"class":429,"line":219},[400,616,482],{"class":567},[400,618,570],{"class":504},[400,620,621],{"class":436},"'numeric'",[400,623,624],{"class":504},", numeric);\n",[400,626,628,630,632,635],{"class":429,"line":627},12,[400,629,482],{"class":567},[400,631,570],{"class":504},[400,633,634],{"class":436},"'min'",[400,636,637],{"class":504},", min);\n",[400,639,641,643,645,648],{"class":429,"line":640},13,[400,642,482],{"class":567},[400,644,570],{"class":504},[400,646,647],{"class":436},"'max'",[400,649,650],{"class":504},", max);\n",[400,652,654],{"class":429,"line":653},14,[400,655,562],{"emptyLinePlaceholder":561},[400,657,659],{"class":429,"line":658},15,[400,660,661],{"class":443},"\u002F\u002F Project rules use the same (value, params, ctx) signature.\n",[400,663,665,667,669,672,675,678,681,685,688],{"class":429,"line":664},16,[400,666,482],{"class":567},[400,668,570],{"class":504},[400,670,671],{"class":436},"'password'",[400,673,674],{"class":504},", (",[400,676,677],{"class":432},"v",[400,679,680],{"class":500},":",[400,682,684],{"class":683},"s-5SL"," unknown",[400,686,687],{"class":504},") ",[400,689,690],{"class":500},"=>\n",[400,692,694,697,700,703,706,709,712,715,718,721,723,725,727,730],{"class":429,"line":693},17,[400,695,696],{"class":500},"    typeof",[400,698,699],{"class":504}," v ",[400,701,702],{"class":500},"===",[400,704,705],{"class":436}," 'string'",[400,707,708],{"class":500}," &&",[400,710,711],{"class":504}," v.",[400,713,714],{"class":683},"length",[400,716,717],{"class":500}," >",[400,719,720],{"class":683}," 0",[400,722,708],{"class":500},[400,724,711],{"class":504},[400,726,714],{"class":683},[400,728,729],{"class":500}," \u003C",[400,731,732],{"class":683}," 8\n",[400,734,736,739],{"class":429,"line":735},18,[400,737,738],{"class":500},"        ?",[400,740,741],{"class":436}," 'Password must be at least 8 characters'\n",[400,743,745,748],{"class":429,"line":744},19,[400,746,747],{"class":500},"        :",[400,749,750],{"class":683}," true\n",[400,752,754],{"class":429,"line":753},20,[400,755,756],{"class":504},");\n",[400,758,760],{"class":429,"line":759},21,[400,761,562],{"emptyLinePlaceholder":561},[400,763,765,768,771,774],{"class":429,"line":764},22,[400,766,767],{"class":567},"configure",[400,769,770],{"class":504},"({ generateMessage: ",[400,772,773],{"class":567},"localize",[400,775,776],{"class":504},"({ en }) });\n",[400,778,780,783,785,788],{"class":429,"line":779},23,[400,781,782],{"class":567},"setLocale",[400,784,570],{"class":504},[400,786,787],{"class":436},"'en'",[400,789,756],{"class":504},[419,791,793],{"className":486,"code":792,"language":488,"meta":424,"style":424},"\u002F\u002F main.ts — imported once, for its side effects\nimport '.\u002Fapp\u002Fvalidators';\n",[362,794,795,800],{"__ignoreMap":424},[400,796,797],{"class":429,"line":131},[400,798,799],{"class":443},"\u002F\u002F main.ts — imported once, for its side effects\n",[400,801,802,804,807],{"class":429,"line":135},[400,803,501],{"class":500},[400,805,806],{"class":436}," '.\u002Fapp\u002Fvalidators'",[400,808,514],{"class":504},[810,811,812],"note",{},[359,813,814,815,818,819,822,823,825],{},"vee-validate's i18n is a ",[410,816,817],{},"separate registry"," from the library's own ",[362,820,821],{},"locale",".\nThey share no keys and there is no automatic bridge. Register a message locale\nfor every language you support. If the app switches language at runtime, call\n",[362,824,782],{}," yourself in step with it.",[396,827,829],{"id":828},"form",[400,830,831],{},"Build the form",[359,833,834,835,838,839,841,842,845,846,848,849,852],{},"Wrap the fields in ",[362,836,837],{},"\u003CBbForm>"," and give each one a ",[362,840,382],{}," (or a ",[362,843,844],{},"legend",") and its\n",[362,847,386],{},". The field name is derived from the label, so there is no ",[362,850,851],{},"vid"," to write.",[419,854,858],{"className":855,"code":856,"language":857,"meta":424,"style":424},"language-vue shiki shiki-themes github-light-high-contrast github-dark-high-contrast","\u003Cscript setup lang=\"ts\">\nimport { reactive, ref } from 'vue';\nimport { BbButton } from 'bitboss-ui';\nimport { BbForm, BbTextInput, BbNumberInput, BbCheckbox } from 'bitboss-ui\u002Fvalidated';\n\nconst form = reactive({ email: null, quantity: null, terms: false });\n\n\u002F\u002F `@submit` hands you the collected values, so the ref has to be able to hold\n\u002F\u002F them — a bare `ref(null)` infers `Ref\u003Cnull>` and the assignment will not compile.\nconst submitted = ref\u003CRecord\u003Cstring, unknown> | null>(null);\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n    \u003CBbForm v-slot=\"{ isSubmitting }\" @submit=\"(v) => (submitted = v)\">\n        \u003CBbTextInput v-model=\"form.email\" label=\"Email\" rules=\"required|email\" \u002F>\n        \u003CBbNumberInput v-model=\"form.quantity\" label=\"Quantity\" rules=\"required|min_value:1\" \u002F>\n        \u003CBbCheckbox v-model=\"form.terms\" label=\"Accept terms\" rules=\"required\" \u002F>\n        \u003CBbButton type=\"submit\" :loading=\"isSubmitting\">Submit\u003C\u002FBbButton>\n    \u003C\u002FBbForm>\n\u003C\u002Ftemplate>\n","vue",[362,859,860,884,898,912,926,930,964,968,973,978,1022,1031,1035,1044,1095,1133,1166,1199,1235,1244],{"__ignoreMap":424},[400,861,862,865,869,872,875,878,881],{"class":429,"line":131},[400,863,864],{"class":504},"\u003C",[400,866,868],{"class":867},"sne4z","script",[400,870,871],{"class":683}," setup",[400,873,874],{"class":683}," lang",[400,876,877],{"class":504},"=",[400,879,880],{"class":436},"\"ts\"",[400,882,883],{"class":504},">\n",[400,885,886,888,891,893,896],{"class":429,"line":135},[400,887,501],{"class":500},[400,889,890],{"class":504}," { reactive, ref } ",[400,892,508],{"class":500},[400,894,895],{"class":436}," 'vue'",[400,897,514],{"class":504},[400,899,900,902,905,907,910],{"class":429,"line":157},[400,901,501],{"class":500},[400,903,904],{"class":504}," { BbButton } ",[400,906,508],{"class":500},[400,908,909],{"class":436}," 'bitboss-ui'",[400,911,514],{"class":504},[400,913,914,916,919,921,924],{"class":429,"line":161},[400,915,501],{"class":500},[400,917,918],{"class":504}," { BbForm, BbTextInput, BbNumberInput, BbCheckbox } ",[400,920,508],{"class":500},[400,922,923],{"class":436}," 'bitboss-ui\u002Fvalidated'",[400,925,514],{"class":504},[400,927,928],{"class":429,"line":165},[400,929,562],{"emptyLinePlaceholder":561},[400,931,932,935,938,941,944,947,950,953,955,958,961],{"class":429,"line":199},[400,933,934],{"class":500},"const",[400,936,937],{"class":683}," form",[400,939,940],{"class":500}," =",[400,942,943],{"class":567}," reactive",[400,945,946],{"class":504},"({ email: ",[400,948,949],{"class":683},"null",[400,951,952],{"class":504},", quantity: ",[400,954,949],{"class":683},[400,956,957],{"class":504},", terms: ",[400,959,960],{"class":683},"false",[400,962,963],{"class":504}," });\n",[400,965,966],{"class":429,"line":203},[400,967,562],{"emptyLinePlaceholder":561},[400,969,970],{"class":429,"line":207},[400,971,972],{"class":443},"\u002F\u002F `@submit` hands you the collected values, so the ref has to be able to hold\n",[400,974,975],{"class":429,"line":211},[400,976,977],{"class":443},"\u002F\u002F them — a bare `ref(null)` infers `Ref\u003Cnull>` and the assignment will not compile.\n",[400,979,980,982,985,987,990,992,995,997,1000,1003,1006,1009,1012,1015,1018,1020],{"class":429,"line":215},[400,981,934],{"class":500},[400,983,984],{"class":683}," submitted",[400,986,940],{"class":500},[400,988,989],{"class":567}," ref",[400,991,864],{"class":504},[400,993,994],{"class":432},"Record",[400,996,864],{"class":504},[400,998,999],{"class":683},"string",[400,1001,1002],{"class":504},", ",[400,1004,1005],{"class":683},"unknown",[400,1007,1008],{"class":504},"> ",[400,1010,1011],{"class":500},"|",[400,1013,1014],{"class":683}," null",[400,1016,1017],{"class":504},">(",[400,1019,949],{"class":683},[400,1021,756],{"class":504},[400,1023,1024,1027,1029],{"class":429,"line":219},[400,1025,1026],{"class":504},"\u003C\u002F",[400,1028,868],{"class":867},[400,1030,883],{"class":504},[400,1032,1033],{"class":429,"line":627},[400,1034,562],{"emptyLinePlaceholder":561},[400,1036,1037,1039,1042],{"class":429,"line":640},[400,1038,864],{"class":504},[400,1040,1041],{"class":867},"template",[400,1043,883],{"class":504},[400,1045,1046,1049,1051,1054,1056,1059,1062,1064,1067,1070,1072,1074,1076,1078,1080,1083,1086,1088,1091,1093],{"class":429,"line":653},[400,1047,1048],{"class":504},"    \u003C",[400,1050,197],{"class":867},[400,1052,1053],{"class":683}," v-slot",[400,1055,877],{"class":504},[400,1057,1058],{"class":504},"\"",[400,1060,1061],{"class":504},"{ isSubmitting }",[400,1063,1058],{"class":504},[400,1065,1066],{"class":504}," @",[400,1068,1069],{"class":683},"submit",[400,1071,877],{"class":504},[400,1073,1058],{"class":504},[400,1075,570],{"class":504},[400,1077,677],{"class":432},[400,1079,687],{"class":504},[400,1081,1082],{"class":500},"=>",[400,1084,1085],{"class":504}," (submitted ",[400,1087,877],{"class":500},[400,1089,1090],{"class":504}," v)",[400,1092,1058],{"class":504},[400,1094,883],{"class":504},[400,1096,1097,1100,1102,1105,1107,1109,1112,1114,1117,1119,1122,1125,1127,1130],{"class":429,"line":658},[400,1098,1099],{"class":504},"        \u003C",[400,1101,213],{"class":867},[400,1103,1104],{"class":683}," v-model",[400,1106,877],{"class":504},[400,1108,1058],{"class":504},[400,1110,1111],{"class":504},"form.email",[400,1113,1058],{"class":504},[400,1115,1116],{"class":683}," label",[400,1118,877],{"class":504},[400,1120,1121],{"class":436},"\"Email\"",[400,1123,1124],{"class":683}," rules",[400,1126,877],{"class":504},[400,1128,1129],{"class":436},"\"required|email\"",[400,1131,1132],{"class":504}," \u002F>\n",[400,1134,1135,1137,1139,1141,1143,1145,1148,1150,1152,1154,1157,1159,1161,1164],{"class":429,"line":664},[400,1136,1099],{"class":504},[400,1138,201],{"class":867},[400,1140,1104],{"class":683},[400,1142,877],{"class":504},[400,1144,1058],{"class":504},[400,1146,1147],{"class":504},"form.quantity",[400,1149,1058],{"class":504},[400,1151,1116],{"class":683},[400,1153,877],{"class":504},[400,1155,1156],{"class":436},"\"Quantity\"",[400,1158,1124],{"class":683},[400,1160,877],{"class":504},[400,1162,1163],{"class":436},"\"required|min_value:1\"",[400,1165,1132],{"class":504},[400,1167,1168,1170,1172,1174,1176,1178,1181,1183,1185,1187,1190,1192,1194,1197],{"class":429,"line":693},[400,1169,1099],{"class":504},[400,1171,224],{"class":867},[400,1173,1104],{"class":683},[400,1175,877],{"class":504},[400,1177,1058],{"class":504},[400,1179,1180],{"class":504},"form.terms",[400,1182,1058],{"class":504},[400,1184,1116],{"class":683},[400,1186,877],{"class":504},[400,1188,1189],{"class":436},"\"Accept terms\"",[400,1191,1124],{"class":683},[400,1193,877],{"class":504},[400,1195,1196],{"class":436},"\"required\"",[400,1198,1132],{"class":504},[400,1200,1201,1203,1205,1208,1210,1213,1216,1219,1221,1223,1226,1228,1231,1233],{"class":429,"line":735},[400,1202,1099],{"class":504},[400,1204,185],{"class":867},[400,1206,1207],{"class":683}," type",[400,1209,877],{"class":504},[400,1211,1212],{"class":436},"\"submit\"",[400,1214,1215],{"class":504}," :",[400,1217,1218],{"class":683},"loading",[400,1220,877],{"class":504},[400,1222,1058],{"class":504},[400,1224,1225],{"class":504},"isSubmitting",[400,1227,1058],{"class":504},[400,1229,1230],{"class":504},">Submit\u003C\u002F",[400,1232,185],{"class":867},[400,1234,883],{"class":504},[400,1236,1237,1240,1242],{"class":429,"line":744},[400,1238,1239],{"class":504},"    \u003C\u002F",[400,1241,197],{"class":867},[400,1243,883],{"class":504},[400,1245,1246,1248,1250],{"class":429,"line":753},[400,1247,1026],{"class":504},[400,1249,1041],{"class":867},[400,1251,883],{"class":504},[359,1253,1254,1257,1258,1261,1262,1002,1264,1002,1267,1002,1270,1273,1274,1277],{},[362,1255,1256],{},"@submit"," fires ",[410,1259,1260],{},"only when every field passes",", with the collected values. The\nslot also exposes ",[362,1263,1225],{},[362,1265,1266],{},"submitCount",[362,1268,1269],{},"values",[362,1271,1272],{},"validate"," and\n",[362,1275,1276],{},"resetForm",": enough for any chrome that lives inside the form.",[359,1279,1280,1281,387],{},"Prefer rule strings, but a one-off inline function still works:\n",[362,1282,1283],{},":rules=\"(v) => !!v || 'Required'\"",[396,1285,1287],{"id":1286},"outside",[400,1288,1289],{},"Chrome outside the form",[359,1291,1292,1293,1296,1297,1300,1301,1304,1305,387],{},"A dialog footer, a page toolbar, a leave guard: anything that needs the form's\nstate but does not live inside it. Give the form an explicit ",[362,1294,1295],{},"id"," and read it\nwith ",[362,1298,1299],{},"useBbFormContext(id)",", the same id-context pattern as ",[362,1302,1303],{},"useBbTableContext","\nand ",[362,1306,1307],{},"useBbDropdownContext",[359,1309,1310,1311,1314],{},"There is no template-ref handle. ",[362,1312,1313],{},"useBbFormContext"," is the only outside surface,\nand that is deliberate. A ref would let a caller reach past the form's own\ncontract into whatever vee-validate happens to expose this version.",[396,1316,1318],{"id":1317},"props",[400,1319,1320],{},"The three added props",[1322,1323,1324,1340],"table",{},[1325,1326,1327],"thead",{},[1328,1329,1330,1334,1337],"tr",{},[1331,1332,1333],"th",{},"Prop",[1331,1335,1336],{},"Type",[1331,1338,1339],{},"Notes",[1341,1342,1343,1361,1374],"tbody",{},[1328,1344,1345,1350,1355],{},[1346,1347,1348],"td",{},[362,1349,386],{},[1346,1351,1352],{},[362,1353,1354],{},"RuleExpression\u003CmodelValue>",[1346,1356,1357,1358,1360],{},"A rule string (",[362,1359,1129],{},"), a function, or an object",[1328,1362,1363,1368,1371],{},[1346,1364,1365],{},[362,1366,1367],{},"validateOn",[1346,1369,1370],{},"timing array",[1346,1372,1373],{},"When to re-validate. Per-control defaults below",[1328,1375,1376,1380,1384],{},[1346,1377,1378],{},[362,1379,851],{},[1346,1381,1382],{},[362,1383,999],{},[1346,1385,1386],{},"Escape hatch — an explicit field name",[359,1388,1389,1394,1395,1398,1399,1402,1403,1406],{},[410,1390,1391,1393],{},[362,1392,851],{}," is an escape hatch."," The field name comes from the label: \"Preferred\ntime\" becomes ",[362,1396,1397],{},"preferredtime",". Set it only when that name would not be unique, as\nin ",[362,1400,1401],{},"v-for","'d rows or array ",[362,1404,1405],{},"v-model","s sharing one label.",[419,1408,1410],{"className":855,"code":1409,"language":857,"meta":424,"style":424},"\u003CBbTextInput\n    v-for=\"(_, i) in form.attendees\"\n    :key=\"i\"\n    v-model=\"form.attendees[i]\"\n    label=\"Attendee\"\n    :vid=\"`attendee_${i}`\"\n\u002F>\n",[362,1411,1412,1419,1440,1457,1471,1481,1501],{"__ignoreMap":424},[400,1413,1414,1416],{"class":429,"line":131},[400,1415,864],{"class":504},[400,1417,1418],{"class":867},"BbTextInput\n",[400,1420,1421,1424,1426,1428,1431,1434,1437],{"class":429,"line":135},[400,1422,1423],{"class":500},"    v-for",[400,1425,877],{"class":504},[400,1427,1058],{"class":504},[400,1429,1430],{"class":504},"(_, i) ",[400,1432,1433],{"class":500},"in",[400,1435,1436],{"class":504}," form.attendees",[400,1438,1439],{"class":504},"\"\n",[400,1441,1442,1445,1448,1450,1452,1455],{"class":429,"line":157},[400,1443,1444],{"class":504},"    :",[400,1446,1447],{"class":683},"key",[400,1449,877],{"class":504},[400,1451,1058],{"class":504},[400,1453,1454],{"class":504},"i",[400,1456,1439],{"class":504},[400,1458,1459,1462,1464,1466,1469],{"class":429,"line":161},[400,1460,1461],{"class":683},"    v-model",[400,1463,877],{"class":504},[400,1465,1058],{"class":504},[400,1467,1468],{"class":504},"form.attendees[i]",[400,1470,1439],{"class":504},[400,1472,1473,1476,1478],{"class":429,"line":165},[400,1474,1475],{"class":683},"    label",[400,1477,877],{"class":504},[400,1479,1480],{"class":436},"\"Attendee\"\n",[400,1482,1483,1485,1487,1489,1491,1494,1496,1499],{"class":429,"line":199},[400,1484,1444],{"class":504},[400,1486,851],{"class":683},[400,1488,877],{"class":504},[400,1490,1058],{"class":504},[400,1492,1493],{"class":436},"`attendee_${",[400,1495,1454],{"class":504},[400,1497,1498],{"class":436},"}`",[400,1500,1439],{"class":504},[400,1502,1503],{"class":429,"line":203},[400,1504,1505],{"class":504},"\u002F>\n",[359,1507,1508,1512],{},[367,1509,1510],{"href":42},[362,1511,194],{}," has no label, so it always needs one.",[359,1514,1515,1516,1519,1520,1523],{},"External errors compose. Whatever you pass to the base ",[362,1517,1518],{},"errors"," prop is\n",[410,1521,1522],{},"merged"," with the vee-validate messages, so a server error and a rule message\nshow together rather than replacing each other. That is what makes the same field\nwork for client rules and an Inertia or Laravel round trip.",[396,1525,1527],{"id":1526},"timing",[400,1528,1529],{},"When a field re-validates",[1322,1531,1532,1542],{},[1325,1533,1534],{},[1328,1535,1536,1539],{},[1331,1537,1538],{},"Default",[1331,1540,1541],{},"Controls",[1341,1543,1544,1563,1590],{},[1328,1545,1546,1551],{},[1346,1547,1548],{},[362,1549,1550],{},"['blur']",[1346,1552,1553,1002,1555,1002,1557,1002,1559,1002,1561],{},[362,1554,213],{},[362,1556,201],{},[362,1558,209],{},[362,1560,188],{},[362,1562,194],{},[1328,1564,1565,1570],{},[1346,1566,1567],{},[362,1568,1569],{},"['inactive']",[1346,1571,1572,1002,1574,1002,1576,1002,1578,1002,1580,1002,1582,1002,1584,1002,1586,1002,1588],{},[362,1573,239],{},[362,1575,205],{},[362,1577,245],{},[362,1579,236],{},[362,1581,191],{},[362,1583,217],{},[362,1585,227],{},[362,1587,251],{},[362,1589,233],{},[1328,1591,1592,1597],{},[1346,1593,1594],{},[362,1595,1596],{},"['update:modelValue', 'change', 'blur']",[1346,1598,1599,1002,1601],{},[362,1600,224],{},[362,1602,248],{},[359,1604,1605],{},"The grouping follows how each control is used, not how it is built. A text field\nis judged when you leave it, a picker when it goes inactive. A single toggle is\njudged the moment it flips: there is nothing else to wait for.",[396,1607,1609],{"id":1608},"asterisk",[400,1610,1611],{},"The required asterisk",[359,1613,1614,1615,680],{},"Turn on the plugin option and required fields carry a red ",[362,1616,1617],{},"*",[419,1619,1621],{"className":486,"code":1620,"language":488,"meta":424,"style":424},"\u002F\u002F vite.config.ts\nbitbossUi({ requiredAsterisk: true });\n",[362,1622,1623,1628],{"__ignoreMap":424},[400,1624,1625],{"class":429,"line":131},[400,1626,1627],{"class":443},"\u002F\u002F vite.config.ts\n",[400,1629,1630,1633,1636,1639],{"class":429,"line":135},[400,1631,1632],{"class":567},"bitbossUi",[400,1634,1635],{"class":504},"({ requiredAsterisk: ",[400,1637,1638],{"class":683},"true",[400,1640,963],{"class":504},[359,1642,1643,1644,1647,1648,1651,1652,1654,1655,1660,1661,1664,1665,1668],{},"It shows on any ",[362,1645,1646],{},"\u002Fvalidated"," control that is ",[362,1649,1650],{},"required",", or whose ",[362,1653,386],{},"\ncontain a ",[410,1656,1657,1659],{},[362,1658,1650],{}," rule",", rendered into the control's ",[362,1662,1663],{},"#label"," or ",[362,1666,1667],{},"#legend","\nslot.",[359,1670,1671,1672,1675],{},"Rules alone are not enough, and deliberately so. Every other rule is conditional\non a value being present. ",[362,1673,1674],{},"max:5"," passes on an empty field, which is what makes\n\"optional, but at most 5 if filled\" expressible. Raising the asterisk for any\nrule would mark optional fields as mandatory and contradict the engine.",[359,1677,1678,1679,1682,1683,1686,1687,1690,1691,1694,1695,1698,1699,1702],{},"Both rule shapes are read: the string form (",[362,1680,1681],{},"'required|email'",", arguments\nallowed, so ",[362,1684,1685],{},"'required:true'"," counts) and the object form (",[362,1688,1689],{},"{ required: true }",",\nwhere ",[362,1692,1693],{},"{ required: false }"," correctly shows nothing). ",[362,1696,1697],{},"required_if"," and its\nrelatives do ",[410,1700,1701],{},"not"," count: conditionally required is not required.",[810,1704,1705],{},[359,1706,1707,1708,1710],{},"A validator function or a typed schema (yup, zod) is opaque to this check. On\nschema-driven fields that should carry the marker, set ",[362,1709,1650],{}," explicitly.",[359,1712,1713,1714,1718],{},"Core, non-validated components ignore the option entirely. The marker itself is\nthe exported ",[367,1715,1716],{"href":8},[362,1717,350],{},", which you can drop into\nyour own label content when you build a bespoke field.",[359,1720,1721,1722,1002,1724,1002,1726,1728,1729,1002,1731,1002,1733,1002,1735,1002,1737,1728,1739,1002,1741,1002,1743,1002,1745,1002,1747,1728,1749,1751,1752,1754,1755,1757,1758,1761],{},"The controls that ship validated: ",[362,1723,213],{},[362,1725,201],{},[362,1727,209],{},",\n",[362,1730,239],{},[362,1732,205],{},[362,1734,224],{},[362,1736,227],{},[362,1738,248],{},[362,1740,251],{},[362,1742,233],{},[362,1744,236],{},[362,1746,245],{},[362,1748,191],{},[362,1750,217],{}," and ",[362,1753,188],{},". There is also ",[362,1756,197],{},", and the\n",[362,1759,1760],{},"useValidatedField"," composable for wrapping controls of your own.",[359,1763,1764,1765,1767,1768,1770,1771,1773,1774,387],{},"Start with one ",[362,1766,197],{},", one shared validators module and rule strings on the\nfields. Add ",[362,1769,1313],{}," only when controls live outside the form, and use\n",[362,1772,1760],{}," only for a control that the validated entrypoint does not\nalready export. For Inertia submissions, continue with\n",[367,1775,1777],{"href":1776},"\u002Fen\u002Fguides\u002Finertia#forms","Forms that return promises",[1779,1780,1781],"style",{},"html pre.shiki code .soyes, html code.shiki .soyes{--shiki-default:#702C00;--shiki-dark:#FFB757}html pre.shiki code .sT6z2, html code.shiki .sT6z2{--shiki-default:#032563;--shiki-dark:#ADDCFF}html pre.shiki code .sLBg1, html code.shiki .sLBg1{--shiki-default:#66707B;--shiki-dark:#BDC4CC}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sHUrx, html code.shiki .sHUrx{--shiki-default:#A0111F;--shiki-dark:#FF9492}html pre.shiki code .suds8, html code.shiki .suds8{--shiki-default:#0E1116;--shiki-dark:#F0F3F6}html pre.shiki code .sKwhi, html code.shiki .sKwhi{--shiki-default:#622CBC;--shiki-dark:#DBB7FF}html pre.shiki code .s-5SL, html code.shiki .s-5SL{--shiki-default:#023B95;--shiki-dark:#91CBFF}html pre.shiki code .sne4z, html code.shiki .sne4z{--shiki-default:#024C1A;--shiki-dark:#72F088}",{"title":424,"searchDepth":157,"depth":157,"links":1783},[1784,1785,1786,1787,1788,1789,1790],{"id":398,"depth":135,"text":402},{"id":386,"depth":135,"text":476},{"id":828,"depth":135,"text":831},{"id":1286,"depth":135,"text":1289},{"id":1317,"depth":135,"text":1320},{"id":1526,"depth":135,"text":1529},{"id":1608,"depth":135,"text":1611},"Form controls from bitboss-ui\u002Fvalidated, already wired to vee-validate.","md",{},[1795,1796,1797,1798,1799,1800,1801],{"id":398,"title":402},{"id":386,"title":476},{"id":828,"title":831},{"id":1286,"title":1289},{"id":1317,"title":1320},{"id":1526,"title":1529},{"id":1608,"title":1611},{"title":159,"description":1791},"guides\u002Fvalidated-forms","l_gJoz0hCWU2cigHYG33lZEcUF6H4dWuwLR7GKA8oAQ",1790005168732]