[{"data":1,"prerenderedAt":1415},["ShallowReactive",2],{"api-none":3,"docs-nav-en":4,"locale-alternates":247,"page-en-\u002Fcomponents\u002Fbb-alert":378,"pt-showcase-BbAlert":1285},null,[5,20,32,56,68,112,145,181,202,223,235,241],{"label":6,"entries":7},"Getting started",[8,12,16],{"title":9,"path":10,"component":-1,"order":11},"Installation","\u002Fguides\u002Finstallation",1,{"title":13,"path":14,"component":-1,"order":15},"Migrating from v2","\u002Fguides\u002Fmigration",2,{"title":17,"path":18,"component":-1,"order":19},"Adoption checklist","\u002Fguides\u002Fadoption-checklist",3,{"label":21,"entries":22},"Design system",[23,26,29],{"title":24,"path":25,"component":-1,"order":11},"Design tokens","\u002Fguides\u002Fdesign-tokens",{"title":27,"path":28,"component":-1,"order":15},"Design language","\u002Fguides\u002Fdesign-language",{"title":30,"path":31,"component":-1,"order":19},"Passthrough","\u002Fguides\u002Fpassthrough",{"label":33,"entries":34},"Playbooks",[35,38,41,44,48,52],{"title":36,"path":37,"component":-1,"order":11},"Options and items","\u002Fguides\u002Foptions-and-items",{"title":39,"path":40,"component":-1,"order":15},"Fetching data","\u002Fguides\u002Ffetching-data",{"title":42,"path":43,"component":-1,"order":19},"Coherence","\u002Fguides\u002Fcoherence",{"title":45,"path":46,"component":-1,"order":47},"Validated forms","\u002Fguides\u002Fvalidated-forms",4,{"title":49,"path":50,"component":-1,"order":51},"Icons","\u002Fguides\u002Ficons",5,{"title":53,"path":54,"component":-1,"order":55},"Preset components","\u002Fguides\u002Fpreset-components",6,{"label":57,"entries":58},"Ecosystem",[59,62,65],{"title":60,"path":61,"component":-1,"order":11},"Inertia and Laravel","\u002Fguides\u002Finertia",{"title":63,"path":64,"component":-1,"order":15},"Nuxt","\u002Fguides\u002Fnuxt",{"title":66,"path":67,"component":-1,"order":19},"AI agents","\u002Fguides\u002Fai-agents",{"label":69,"entries":70},"Inputs",[71,74,77,80,83,86,89,92,96,100,104,108],{"title":72,"path":73,"component":72,"order":11},"BbBaseButton","\u002Fcomponents\u002Fbb-base-button",{"title":75,"path":76,"component":75,"order":15},"BbButton","\u002Fcomponents\u002Fbb-button",{"title":78,"path":79,"component":78,"order":19},"BbCalendar","\u002Fcomponents\u002Fbb-calendar",{"title":81,"path":82,"component":81,"order":19},"BbColorInput","\u002Fcomponents\u002Fbb-color-input",{"title":84,"path":85,"component":84,"order":47},"BbDatePickerInput","\u002Fcomponents\u002Fbb-date-picker-input",{"title":87,"path":88,"component":87,"order":51},"BbDropzone","\u002Fcomponents\u002Fbb-dropzone",{"title":90,"path":91,"component":90,"order":55},"BbForm","\u002Fcomponents\u002Fbb-form",{"title":93,"path":94,"component":93,"order":95},"BbNumberInput","\u002Fcomponents\u002Fbb-number-input",7,{"title":97,"path":98,"component":97,"order":99},"BbTag","\u002Fcomponents\u002Fbb-tag",8,{"title":101,"path":102,"component":101,"order":103},"BbTextarea","\u002Fcomponents\u002Fbb-textarea",9,{"title":105,"path":106,"component":105,"order":107},"BbTextInput","\u002Fcomponents\u002Fbb-text-input",10,{"title":109,"path":110,"component":109,"order":111},"BbTimePickerInput","\u002Fcomponents\u002Fbb-time-picker-input",11,{"label":113,"entries":114},"Selection",[115,118,121,124,127,130,133,136,139,142],{"title":116,"path":117,"component":116,"order":11},"BbCheckbox","\u002Fcomponents\u002Fbb-checkbox",{"title":119,"path":120,"component":119,"order":15},"BbCheckboxGroup","\u002Fcomponents\u002Fbb-checkbox-group",{"title":122,"path":123,"component":122,"order":19},"BbRadio","\u002Fcomponents\u002Fbb-radio",{"title":125,"path":126,"component":125,"order":47},"BbRadioGroup","\u002Fcomponents\u002Fbb-radio-group",{"title":128,"path":129,"component":128,"order":51},"BbRating","\u002Fcomponents\u002Fbb-rating",{"title":131,"path":132,"component":131,"order":55},"BbSelect","\u002Fcomponents\u002Fbb-select",{"title":134,"path":135,"component":134,"order":95},"BbSelectPopover","\u002Fcomponents\u002Fbb-select-popover",{"title":137,"path":138,"component":137,"order":99},"BbSlider","\u002Fcomponents\u002Fbb-slider",{"title":140,"path":141,"component":140,"order":103},"BbSwitch","\u002Fcomponents\u002Fbb-switch",{"title":143,"path":144,"component":143,"order":107},"BbSwitchGroup","\u002Fcomponents\u002Fbb-switch-group",{"label":146,"entries":147},"Overlay",[148,151,154,157,160,163,166,169,172,175,178],{"title":149,"path":150,"component":149,"order":11},"BbColorPalette","\u002Fcomponents\u002Fbb-color-palette",{"title":152,"path":153,"component":152,"order":15},"BbConfirm","\u002Fcomponents\u002Fbb-confirm",{"title":155,"path":156,"component":155,"order":19},"BbDatePicker","\u002Fcomponents\u002Fbb-date-picker",{"title":158,"path":159,"component":158,"order":47},"BbDialog","\u002Fcomponents\u002Fbb-dialog",{"title":161,"path":162,"component":161,"order":51},"BbDropdown","\u002Fcomponents\u002Fbb-dropdown",{"title":164,"path":165,"component":164,"order":55},"BbDropdownButton","\u002Fcomponents\u002Fbb-dropdown-button",{"title":167,"path":168,"component":167,"order":95},"BbHoverCard","\u002Fcomponents\u002Fbb-hover-card",{"title":170,"path":171,"component":170,"order":95},"BbOffCanvas","\u002Fcomponents\u002Fbb-off-canvas",{"title":173,"path":174,"component":173,"order":99},"BbPopover","\u002Fcomponents\u002Fbb-popover",{"title":176,"path":177,"component":176,"order":103},"BbTimePicker","\u002Fcomponents\u002Fbb-time-picker",{"title":179,"path":180,"component":179,"order":107},"BbTooltip","\u002Fcomponents\u002Fbb-tooltip",{"label":182,"entries":183},"Navigation",[184,187,190,193,196,199],{"title":185,"path":186,"component":185,"order":11},"BbAccordion","\u002Fcomponents\u002Fbb-accordion",{"title":188,"path":189,"component":188,"order":15},"BbBreadcrumbs","\u002Fcomponents\u002Fbb-breadcrumbs",{"title":191,"path":192,"component":191,"order":19},"BbCollapsible","\u002Fcomponents\u002Fbb-collapsible",{"title":194,"path":195,"component":194,"order":47},"BbPagination","\u002Fcomponents\u002Fbb-pagination",{"title":197,"path":198,"component":197,"order":51},"BbTabs","\u002Fcomponents\u002Fbb-tabs",{"title":200,"path":201,"component":200,"order":55},"BbTree","\u002Fcomponents\u002Fbb-tree",{"label":203,"entries":204},"Feedback",[205,208,211,214,217,220],{"title":206,"path":207,"component":206,"order":11},"BbAlert","\u002Fcomponents\u002Fbb-alert",{"title":209,"path":210,"component":209,"order":15},"BbBadge","\u002Fcomponents\u002Fbb-badge",{"title":212,"path":213,"component":212,"order":19},"BbIndicator","\u002Fcomponents\u002Fbb-indicator",{"title":215,"path":216,"component":215,"order":47},"BbProgress","\u002Fcomponents\u002Fbb-progress",{"title":218,"path":219,"component":218,"order":51},"BbSpinner","\u002Fcomponents\u002Fbb-spinner",{"title":221,"path":222,"component":221,"order":55},"BbToast","\u002Fcomponents\u002Fbb-toast",{"label":224,"entries":225},"Data Display",[226,229,232],{"title":227,"path":228,"component":227,"order":11},"BbAvatar","\u002Fcomponents\u002Fbb-avatar",{"title":230,"path":231,"component":230,"order":15},"BbIcon","\u002Fcomponents\u002Fbb-icon",{"title":233,"path":234,"component":233,"order":19},"BbTable","\u002Fcomponents\u002Fbb-table",{"label":236,"entries":237},"Layout & Utility",[238],{"title":239,"path":240,"component":239,"order":11},"BbSmoothHeight","\u002Fcomponents\u002Fbb-smooth-height",{"label":242,"entries":243},"Other",[244],{"title":245,"path":246,"component":245,"order":11},"BbAsterisk","\u002Fcomponents\u002Fbb-asterisk",{"\u002Fit\u002Fcomponenti\u002Fbb-accordion":248,"\u002Fen\u002Fcomponents\u002Fbb-accordion":249,"\u002Fit\u002Fcomponenti\u002Fbb-alert":250,"\u002Fen\u002Fcomponents\u002Fbb-alert":251,"\u002Fit\u002Fcomponenti\u002Fbb-asterisk":252,"\u002Fen\u002Fcomponents\u002Fbb-asterisk":253,"\u002Fit\u002Fcomponenti\u002Fbb-avatar":254,"\u002Fen\u002Fcomponents\u002Fbb-avatar":255,"\u002Fit\u002Fcomponenti\u002Fbb-badge":256,"\u002Fen\u002Fcomponents\u002Fbb-badge":257,"\u002Fit\u002Fcomponenti\u002Fbb-base-button":258,"\u002Fen\u002Fcomponents\u002Fbb-base-button":259,"\u002Fit\u002Fcomponenti\u002Fbb-breadcrumbs":260,"\u002Fen\u002Fcomponents\u002Fbb-breadcrumbs":261,"\u002Fit\u002Fcomponenti\u002Fbb-button":262,"\u002Fen\u002Fcomponents\u002Fbb-button":263,"\u002Fit\u002Fcomponenti\u002Fbb-calendar":264,"\u002Fen\u002Fcomponents\u002Fbb-calendar":265,"\u002Fit\u002Fcomponenti\u002Fbb-checkbox":266,"\u002Fen\u002Fcomponents\u002Fbb-checkbox":267,"\u002Fit\u002Fcomponenti\u002Fbb-checkbox-group":268,"\u002Fen\u002Fcomponents\u002Fbb-checkbox-group":269,"\u002Fit\u002Fcomponenti\u002Fbb-collapsible":270,"\u002Fen\u002Fcomponents\u002Fbb-collapsible":271,"\u002Fit\u002Fcomponenti\u002Fbb-color-input":272,"\u002Fen\u002Fcomponents\u002Fbb-color-input":273,"\u002Fit\u002Fcomponenti\u002Fbb-color-palette":274,"\u002Fen\u002Fcomponents\u002Fbb-color-palette":275,"\u002Fit\u002Fcomponenti\u002Fbb-confirm":276,"\u002Fen\u002Fcomponents\u002Fbb-confirm":277,"\u002Fit\u002Fcomponenti\u002Fbb-date-picker":278,"\u002Fen\u002Fcomponents\u002Fbb-date-picker":279,"\u002Fit\u002Fcomponenti\u002Fbb-date-picker-input":280,"\u002Fen\u002Fcomponents\u002Fbb-date-picker-input":281,"\u002Fit\u002Fcomponenti\u002Fbb-dialog":282,"\u002Fen\u002Fcomponents\u002Fbb-dialog":283,"\u002Fit\u002Fcomponenti\u002Fbb-dropdown":284,"\u002Fen\u002Fcomponents\u002Fbb-dropdown":285,"\u002Fit\u002Fcomponenti\u002Fbb-dropdown-button":286,"\u002Fen\u002Fcomponents\u002Fbb-dropdown-button":287,"\u002Fit\u002Fcomponenti\u002Fbb-dropzone":288,"\u002Fen\u002Fcomponents\u002Fbb-dropzone":289,"\u002Fit\u002Fcomponenti\u002Fbb-form":290,"\u002Fen\u002Fcomponents\u002Fbb-form":291,"\u002Fit\u002Fcomponenti\u002Fbb-hover-card":292,"\u002Fen\u002Fcomponents\u002Fbb-hover-card":293,"\u002Fit\u002Fcomponenti\u002Fbb-icon":294,"\u002Fen\u002Fcomponents\u002Fbb-icon":295,"\u002Fit\u002Fcomponenti\u002Fbb-indicator":296,"\u002Fen\u002Fcomponents\u002Fbb-indicator":297,"\u002Fit\u002Fcomponenti\u002Fbb-number-input":298,"\u002Fen\u002Fcomponents\u002Fbb-number-input":299,"\u002Fit\u002Fcomponenti\u002Fbb-off-canvas":300,"\u002Fen\u002Fcomponents\u002Fbb-off-canvas":301,"\u002Fit\u002Fcomponenti\u002Fbb-pagination":302,"\u002Fen\u002Fcomponents\u002Fbb-pagination":303,"\u002Fit\u002Fcomponenti\u002Fbb-popover":304,"\u002Fen\u002Fcomponents\u002Fbb-popover":305,"\u002Fit\u002Fcomponenti\u002Fbb-progress":306,"\u002Fen\u002Fcomponents\u002Fbb-progress":307,"\u002Fit\u002Fcomponenti\u002Fbb-radio":308,"\u002Fen\u002Fcomponents\u002Fbb-radio":309,"\u002Fit\u002Fcomponenti\u002Fbb-radio-group":310,"\u002Fen\u002Fcomponents\u002Fbb-radio-group":311,"\u002Fit\u002Fcomponenti\u002Fbb-rating":312,"\u002Fen\u002Fcomponents\u002Fbb-rating":313,"\u002Fit\u002Fcomponenti\u002Fbb-select":314,"\u002Fen\u002Fcomponents\u002Fbb-select":315,"\u002Fit\u002Fcomponenti\u002Fbb-select-popover":316,"\u002Fen\u002Fcomponents\u002Fbb-select-popover":317,"\u002Fit\u002Fcomponenti\u002Fbb-slider":318,"\u002Fen\u002Fcomponents\u002Fbb-slider":319,"\u002Fit\u002Fcomponenti\u002Fbb-smooth-height":320,"\u002Fen\u002Fcomponents\u002Fbb-smooth-height":321,"\u002Fit\u002Fcomponenti\u002Fbb-spinner":322,"\u002Fen\u002Fcomponents\u002Fbb-spinner":323,"\u002Fit\u002Fcomponenti\u002Fbb-switch":324,"\u002Fen\u002Fcomponents\u002Fbb-switch":325,"\u002Fit\u002Fcomponenti\u002Fbb-switch-group":326,"\u002Fen\u002Fcomponents\u002Fbb-switch-group":327,"\u002Fit\u002Fcomponenti\u002Fbb-table":328,"\u002Fen\u002Fcomponents\u002Fbb-table":329,"\u002Fit\u002Fcomponenti\u002Fbb-tabs":330,"\u002Fen\u002Fcomponents\u002Fbb-tabs":331,"\u002Fit\u002Fcomponenti\u002Fbb-tag":332,"\u002Fen\u002Fcomponents\u002Fbb-tag":333,"\u002Fit\u002Fcomponenti\u002Fbb-text-input":334,"\u002Fen\u002Fcomponents\u002Fbb-text-input":335,"\u002Fit\u002Fcomponenti\u002Fbb-textarea":336,"\u002Fen\u002Fcomponents\u002Fbb-textarea":337,"\u002Fit\u002Fcomponenti\u002Fbb-time-picker":338,"\u002Fen\u002Fcomponents\u002Fbb-time-picker":339,"\u002Fit\u002Fcomponenti\u002Fbb-time-picker-input":340,"\u002Fen\u002Fcomponents\u002Fbb-time-picker-input":341,"\u002Fit\u002Fcomponenti\u002Fbb-toast":342,"\u002Fen\u002Fcomponents\u002Fbb-toast":343,"\u002Fit\u002Fcomponenti\u002Fbb-tooltip":344,"\u002Fen\u002Fcomponents\u002Fbb-tooltip":345,"\u002Fit\u002Fcomponenti\u002Fbb-tree":346,"\u002Fen\u002Fcomponents\u002Fbb-tree":347,"\u002Fit\u002Fguide\u002Fadoption-checklist":348,"\u002Fen\u002Fguides\u002Fadoption-checklist":349,"\u002Fit\u002Fguide\u002Fai-agents":350,"\u002Fen\u002Fguides\u002Fai-agents":351,"\u002Fit\u002Fguide\u002Fcoherence":352,"\u002Fen\u002Fguides\u002Fcoherence":353,"\u002Fit\u002Fguide\u002Fdesign-language":354,"\u002Fen\u002Fguides\u002Fdesign-language":355,"\u002Fit\u002Fguide\u002Fdesign-tokens":356,"\u002Fen\u002Fguides\u002Fdesign-tokens":357,"\u002Fit\u002Fguide\u002Ffetching-data":358,"\u002Fen\u002Fguides\u002Ffetching-data":359,"\u002Fit\u002Fguide\u002Ficons":360,"\u002Fen\u002Fguides\u002Ficons":361,"\u002Fit\u002Fguide\u002Finertia":362,"\u002Fen\u002Fguides\u002Finertia":363,"\u002Fit\u002Fguide\u002Finstallation":364,"\u002Fen\u002Fguides\u002Finstallation":365,"\u002Fit\u002Fguide\u002Fmigration":366,"\u002Fen\u002Fguides\u002Fmigration":367,"\u002Fit\u002Fguide\u002Fnuxt":368,"\u002Fen\u002Fguides\u002Fnuxt":369,"\u002Fit\u002Fguide\u002Foptions-and-items":370,"\u002Fen\u002Fguides\u002Foptions-and-items":371,"\u002Fit\u002Fguide\u002Fpassthrough":372,"\u002Fen\u002Fguides\u002Fpassthrough":373,"\u002Fit\u002Fguide\u002Fpreset-components":374,"\u002Fen\u002Fguides\u002Fpreset-components":375,"\u002Fit\u002Fguide\u002Fvalidated-forms":376,"\u002Fen\u002Fguides\u002Fvalidated-forms":377},"\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-calendar","\u002Fit\u002Fcomponenti\u002Fbb-calendar","\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-hover-card","\u002Fit\u002Fcomponenti\u002Fbb-hover-card","\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\u002Fadoption-checklist","\u002Fit\u002Fguide\u002Fadoption-checklist","\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\u002Fpassthrough","\u002Fit\u002Fguide\u002Fpassthrough","\u002Fen\u002Fguides\u002Fpreset-components","\u002Fit\u002Fguide\u002Fpreset-components","\u002Fen\u002Fguides\u002Fvalidated-forms","\u002Fit\u002Fguide\u002Fvalidated-forms",{"id":379,"title":206,"body":380,"component":206,"description":1272,"extension":1273,"group":203,"meta":1274,"navigation":1275,"order":11,"path":207,"sections":1276,"seo":1282,"stem":1283,"__hash__":1284},"docs_en\u002Fcomponents\u002Fbb-alert.md",{"type":381,"value":382,"toc":1262},"minimark",[383,431,437,445,448,452,472,477,480,506,509,535,556,579,583,592,595,611,617,639,642,655,672,678,699,702,715,722,728,748,773,840,843,852,857,867,919,922,1004,1020,1103,1125,1252,1258],[384,385,386,394],"when",{},[387,388,389,390,393],"p",{},"Reach for ",[391,392,206],"code",{}," when the message stays on the page: errors above a form, a\nquota warning, a \"saved\" confirmation in the panel that produced it.",[395,396,398],"template",{"v-slot:else":397},"",[399,400,401,414,424],"ul",{},[402,403,404,409,410,413],"li",{},[405,406,407],"a",{"href":342},[391,408,221],{}," with ",[391,411,412],{},"useToast",", when the feedback is\nmomentary and follows an action",[402,415,416,409,420,423],{},[405,417,418],{"href":276},[391,419,152],{},[391,421,422],{},"useConfirm",", when you are\nasking the user to decide",[402,425,426,430],{},[405,427,428],{"href":256},[391,429,209],{},", when it is a count or a state attached\nto another element",[387,432,433,434,436],{},"Also see: ",[405,435,27],{"href":354},".",[438,439,441],"h2",{"id":440},"feedback",[442,443,444],"span",{},"Communicate a page state",[387,446,447],{},"Stack page-level messages at the top of the page they belong to, most urgent\nfirst.",[449,450],"demo",{"name":451},"BbAlert\u002FSettingsStack",[387,453,454,455,461,462,465,466,436],{},"Use ",[405,456,458],{"href":457},"\u002Fen\u002Fcomponents\u002Fbb-alert\u002Fapi#prop-hideClose",[391,459,460],{},"hide-close"," when the message\nclears only after the underlying state is fixed. The shortest form puts the body\nin the default slot, ",[391,463,464],{},"\u003CBbAlert>Something went wrong\u003C\u002FBbAlert>",". When a string is\nall you have, pass it as ",[405,467,469],{"href":468},"\u002Fen\u002Fcomponents\u002Fbb-alert\u002Fapi#prop-text",[391,470,471],{},"text",[473,474,476],"h3",{"id":475},"variants","Variants",[387,478,479],{},"Pick the variant by intent, not decoration:",[399,481,482,488,494,500],{},[402,483,484,487],{},[391,485,486],{},"outline"," for neutral information",[402,489,490,493],{},[391,491,492],{},"primary"," for a branded note that asks for action, such as an upgrade",[402,495,496,499],{},[391,497,498],{},"warning"," for something the user should attend to",[402,501,502,505],{},[391,503,504],{},"destructive"," for a failure",[449,507],{"name":508},"BbAlert\u002FVariants",[387,510,511,513,514,518,519,525,526,529,530,534],{},[391,512,486],{}," is the default. No variant brings an icon of its own, so pair the\n",[405,515,517],{"href":516},"\u002Fen\u002Fcomponents\u002Fbb-alert\u002Fapi#prop-variant","variant"," with an\n",[405,520,522],{"href":521},"\u002Fen\u002Fcomponents\u002Fbb-alert\u002Fapi#prop-icon",[391,523,524],{},"icon",", and pair them once: the object\nform of ",[391,527,528],{},"alertVariants"," sets each variant's icon for the whole app\n(",[405,531,533],{"href":532},"#styling","Custom variants",").",[387,536,537,538,541,542,545,546,549,550,552,553,436],{},"There is no ",[391,539,540],{},"success"," or ",[391,543,544],{},"info"," alert. A confirmation is usually a\n",[405,547,548],{"href":342},"toast",", a neutral note is ",[391,551,486],{}," with an icon, and\nanything else you ",[405,554,555],{"href":532},"register yourself",[557,558,560],"migration",{"title":559},"theme → variant",[387,561,562,563,566,567,570,571,574,575,578],{},"In v2 ",[391,564,565],{},"theme"," took any string and painted nothing: v2 shipped no\n",[391,568,569],{},".bb-alert--*"," rules at all. In v3 the string is live, and ",[391,572,573],{},"theme=\"warning\"","\nbecomes an amber alert, quietly. Grep your stylesheets for\n",[391,576,577],{},".bb-alert--\u003Cvalue>",": if nothing styled it, drop the prop.",[473,580,582],{"id":581},"validation-summaries","Validation summaries",[387,584,585,586,588,589,591],{},"A ",[391,587,504],{}," alert above the form, appearing on the first failed submit and\nlisting what is missing. Give it ",[391,590,460],{},": the user clears this message by\nfixing the fields.",[449,593],{"name":594},"BbAlert\u002FValidationSummary",[387,596,597,598,602,603,606,607,610],{},"Inside a ",[405,599,600],{"href":290},[391,601,90],{},", read ",[391,604,605],{},"errors"," and ",[391,608,609],{},"submitCount"," from\nits slot. The summary lists the messages each field already shows under itself,\nand a failed submit still moves focus to the first invalid field. Keep it to one\nsummary rather than an alert per field.",[438,612,614],{"id":613},"dismissal",[442,615,616],{},"Dismissal and v-model",[387,618,619,620,626,627,631,632,638],{},"The close button renders by default and works without a\n",[405,621,623],{"href":622},"\u002Fen\u002Fcomponents\u002Fbb-alert\u002Fapi#model-modelValue",[391,624,625],{},"v-model",". For a message nobody\nshould be able to close, use ",[405,628,629],{"href":457},[391,630,460],{},".\nName the button for the message with\n",[405,633,635],{"href":634},"\u002Fen\u002Fcomponents\u002Fbb-alert\u002Fapi#prop-closeLabel",[391,636,637],{},"close-label"," when \"Close\" alone\nwould be vague.",[449,640],{"name":641},"BbAlert\u002FDismissible",[387,643,644,645,647,648,651,652,436],{},"Bind ",[391,646,625],{}," to observe the state and to put the alert back: setting it to\n",[391,649,650],{},"true"," replays the same transition inward. The alert owns its own visibility, so\nit needs no wrapping ",[391,653,654],{},"v-if",[557,656,658],{"title":657},"show-close → hide-close",[387,659,660,661,664,665,667,668,671],{},"The polarity flipped: ",[391,662,663],{},":show-close=\"false\""," becomes ",[391,666,460],{},", and a\n",[391,669,670],{},"show-close"," left at its default is deleted. In development the library\nwarns when it still finds a v2 name on the component.",[438,673,675],{"id":674},"rich-content",[442,676,677],{},"Rich content",[387,679,680,681,687,688,694,695,698],{},"The ",[405,682,684],{"href":683},"\u002Fen\u002Fcomponents\u002Fbb-alert\u002Fapi#slot-title",[391,685,686],{},"#title"," and\n",[405,689,691],{"href":690},"\u002Fen\u002Fcomponents\u002Fbb-alert\u002Fapi#slot-text",[391,692,693],{},"#text"," slots replace the heading and the body. Both receive\n",[391,696,697],{},"{ text }",", so you can decorate the string you were handed instead of restating\nit.",[449,700],{"name":701},"BbAlert\u002FRichContent",[387,703,704,705,707,708,710,711,714],{},"Three sources can supply the body, and the most specific wins: ",[391,706,693],{},", then\nchild content, then the ",[391,709,471],{}," prop. There is no ",[391,712,713],{},"actions"," slot: a real anchor in\nthe text is fine, anything more interactive belongs outside the alert.",[557,716,717],{},[387,718,680,719,721],{},[391,720,693],{}," slot's scope used to hand you the title by mistake. It now carries\nthe text, so any workaround that read the prop from outside the slot can go.",[438,723,725],{"id":724},"announcements",[442,726,727],{},"How an alert is announced",[387,729,730,606,732,734,735,687,738,741,742,687,745,436],{},[391,731,498],{},[391,733,504],{}," announce as ",[391,736,737],{},"role=\"alert\"",[391,739,740],{},"aria-live=\"assertive\"",". Every other variant uses ",[391,743,744],{},"role=\"status\"",[391,746,747],{},"aria-live=\"polite\"",[387,749,750,751,757,758,761,762,765,766,772],{},"Force either one with the ",[405,752,754],{"href":753},"\u002Fen\u002Fcomponents\u002Fbb-alert\u002Fapi#prop-role",[391,755,756],{},"role"," prop when visual tone and urgency come\napart. The role brings its politeness along (",[391,759,760],{},"alert"," is assertive, ",[391,763,764],{},"status","\npolite); ",[405,767,769],{"href":768},"\u002Fen\u002Fcomponents\u002Fbb-alert\u002Fapi#prop-ariaLive",[391,770,771],{},"aria-live"," is for the rare case that needs the two to differ.",[774,775,779],"pre",{"className":776,"code":777,"language":778,"meta":397,"style":397},"language-vue shiki shiki-themes github-light-high-contrast github-dark-high-contrast","\u003CBbAlert\n    role=\"alert\"\n    icon=\"lucide:cloud-off\"\n    title=\"Autosave failed\"\n    text=\"Your last edits exist only on this device.\"\n\u002F>\n","vue",[391,780,781,792,805,815,825,835],{"__ignoreMap":397},[442,782,784,788],{"class":783,"line":11},"line",[442,785,787],{"class":786},"suds8","\u003C",[442,789,791],{"class":790},"sne4z","BbAlert\n",[442,793,794,798,801],{"class":783,"line":15},[442,795,797],{"class":796},"s-5SL","    role",[442,799,800],{"class":786},"=",[442,802,804],{"class":803},"sT6z2","\"alert\"\n",[442,806,807,810,812],{"class":783,"line":19},[442,808,809],{"class":796},"    icon",[442,811,800],{"class":786},[442,813,814],{"class":803},"\"lucide:cloud-off\"\n",[442,816,817,820,822],{"class":783,"line":47},[442,818,819],{"class":796},"    title",[442,821,800],{"class":786},[442,823,824],{"class":803},"\"Autosave failed\"\n",[442,826,827,830,832],{"class":783,"line":51},[442,828,829],{"class":796},"    text",[442,831,800],{"class":786},[442,833,834],{"class":803},"\"Your last edits exist only on this device.\"\n",[442,836,837],{"class":783,"line":55},[442,838,839],{"class":786},"\u002F>\n",[387,841,842],{},"Never let several assertive alerts appear at once: they cut each other off.",[557,844,845],{},[387,846,847,848,851],{},"The alert is always ",[391,849,850],{},"aria-atomic",", so a changed list re-announces whole. The v2\nprop that turned that off is gone.",[438,853,855],{"id":854},"styling",[442,856,533],{},[387,858,859,860,862,863,436],{},"Register a name in the plugin's ",[391,861,528],{}," and it becomes a typed value of\n",[405,864,865],{"href":516},[391,866,517],{},[774,868,872],{"className":869,"code":870,"language":871,"meta":397,"style":397},"language-ts shiki shiki-themes github-light-high-contrast github-dark-high-contrast","\u002F\u002F nuxt.config.ts\nexport default defineNuxtConfig({\n    bitboss: { alertVariants: ['success'] },\n});\n","ts",[391,873,874,880,897,911],{"__ignoreMap":397},[442,875,876],{"class":783,"line":11},[442,877,879],{"class":878},"sLBg1","\u002F\u002F nuxt.config.ts\n",[442,881,882,886,889,893],{"class":783,"line":15},[442,883,885],{"class":884},"sHUrx","export",[442,887,888],{"class":884}," default",[442,890,892],{"class":891},"sKwhi"," defineNuxtConfig",[442,894,896],{"class":895},"soyes","({\n",[442,898,899,902,905,908],{"class":783,"line":19},[442,900,901],{"class":786},"    bitboss: { alertVariants: [",[442,903,904],{"class":803},"'success'",[442,906,907],{"class":786},"] }",[442,909,910],{"class":895},",\n",[442,912,913,916],{"class":783,"line":47},[442,914,915],{"class":895},"})",[442,917,918],{"class":786},";\n",[387,920,921],{},"The object form registers the names and sets each variant's icon for the whole\napp; a built-in name only gets its icon:",[774,923,925],{"className":869,"code":924,"language":871,"meta":397,"style":397},"\u002F\u002F nuxt.config.ts\nexport default defineNuxtConfig({\n    bitboss: {\n        alertVariants: {\n            warning: { icon: 'lucide:triangle-alert' },\n            destructive: { icon: 'lucide:circle-x' },\n            success: { icon: 'lucide:circle-check' }, \u002F\u002F a project variant\n        },\n    },\n});\n",[391,926,927,931,941,946,951,962,972,986,991,998],{"__ignoreMap":397},[442,928,929],{"class":783,"line":11},[442,930,879],{"class":878},[442,932,933,935,937,939],{"class":783,"line":15},[442,934,885],{"class":884},[442,936,888],{"class":884},[442,938,892],{"class":891},[442,940,896],{"class":895},[442,942,943],{"class":783,"line":19},[442,944,945],{"class":786},"    bitboss: {\n",[442,947,948],{"class":783,"line":47},[442,949,950],{"class":786},"        alertVariants: {\n",[442,952,953,956,959],{"class":783,"line":51},[442,954,955],{"class":786},"            warning: { icon: ",[442,957,958],{"class":803},"'lucide:triangle-alert'",[442,960,961],{"class":786}," },\n",[442,963,964,967,970],{"class":783,"line":55},[442,965,966],{"class":786},"            destructive: { icon: ",[442,968,969],{"class":803},"'lucide:circle-x'",[442,971,961],{"class":786},[442,973,974,977,980,983],{"class":783,"line":95},[442,975,976],{"class":786},"            success: { icon: ",[442,978,979],{"class":803},"'lucide:circle-check'",[442,981,982],{"class":786}," }, ",[442,984,985],{"class":878},"\u002F\u002F a project variant\n",[442,987,988],{"class":783,"line":99},[442,989,990],{"class":786},"        },\n",[442,992,993,996],{"class":783,"line":103},[442,994,995],{"class":786},"    }",[442,997,910],{"class":895},[442,999,1000,1002],{"class":783,"line":107},[442,1001,915],{"class":895},[442,1003,918],{"class":786},[387,1005,1006,1007,1009,1010,1012,1013,1019],{},"An alert without its own ",[391,1008,524],{}," shows its variant's, its own ",[391,1011,524],{}," wins, and\n",[405,1014,1016],{"href":1015},"\u002Fen\u002Fcomponents\u002Fbb-alert\u002Fapi#prop-hideIcon",[391,1017,1018],{},"hide-icon"," hides either:",[774,1021,1023],{"className":776,"code":1022,"language":778,"meta":397,"style":397},"\u003CBbAlert variant=\"warning\" title=\"Heads up\" \u002F>\n\u003CBbAlert variant=\"warning\" icon=\"lucide:clock\" title=\"Runs at midnight\" \u002F>\n\u003CBbAlert variant=\"warning\" hide-icon title=\"Plain\" \u002F>\n",[391,1024,1025,1050,1079],{"__ignoreMap":397},[442,1026,1027,1029,1031,1034,1036,1039,1042,1044,1047],{"class":783,"line":11},[442,1028,787],{"class":786},[442,1030,206],{"class":790},[442,1032,1033],{"class":796}," variant",[442,1035,800],{"class":786},[442,1037,1038],{"class":803},"\"warning\"",[442,1040,1041],{"class":796}," title",[442,1043,800],{"class":786},[442,1045,1046],{"class":803},"\"Heads up\"",[442,1048,1049],{"class":786}," \u002F>\n",[442,1051,1052,1054,1056,1058,1060,1062,1065,1067,1070,1072,1074,1077],{"class":783,"line":15},[442,1053,787],{"class":786},[442,1055,206],{"class":790},[442,1057,1033],{"class":796},[442,1059,800],{"class":786},[442,1061,1038],{"class":803},[442,1063,1064],{"class":796}," icon",[442,1066,800],{"class":786},[442,1068,1069],{"class":803},"\"lucide:clock\"",[442,1071,1041],{"class":796},[442,1073,800],{"class":786},[442,1075,1076],{"class":803},"\"Runs at midnight\"",[442,1078,1049],{"class":786},[442,1080,1081,1083,1085,1087,1089,1091,1094,1096,1098,1101],{"class":783,"line":19},[442,1082,787],{"class":786},[442,1084,206],{"class":790},[442,1086,1033],{"class":796},[442,1088,800],{"class":786},[442,1090,1038],{"class":803},[442,1092,1093],{"class":796}," hide-icon",[442,1095,1041],{"class":796},[442,1097,800],{"class":786},[442,1099,1100],{"class":803},"\"Plain\"",[442,1102,1049],{"class":786},[387,1104,1105,1106,1109,1110,1113,1114,606,1117,1120,1121,1124],{},"Registered variants ship no CSS. You paint ",[391,1107,1108],{},".bb-alert--\u003Cname>"," yourself with the\nlocals the built-ins set: ",[391,1111,1112],{},"--fg"," for the title and the icon (the body and the\nclose button follow it at 75%), ",[391,1115,1116],{},"--bg",[391,1118,1119],{},"--border-color"," for the fill and the\nborder. Mix\nfrom a theme token such as ",[391,1122,1123],{},"--bb-success",", which stays legible in dark mode.",[774,1126,1130],{"className":1127,"code":1128,"language":1129,"meta":397,"style":397},"language-css shiki shiki-themes github-light-high-contrast github-dark-high-contrast",".bb-alert--success {\n    --fg: color-mix(in oklab, var(--bb-success) 55%, var(--bb-text));\n    --border-color: color-mix(\n        in oklab,\n        var(--bb-success) 35%,\n        var(--bb-panel)\n    );\n}\n","css",[391,1131,1132,1140,1191,1203,1212,1230,1242,1247],{"__ignoreMap":397},[442,1133,1134,1137],{"class":783,"line":11},[442,1135,1136],{"class":796},".bb-alert--success",[442,1138,1139],{"class":786}," {\n",[442,1141,1142,1145,1148,1151,1154,1157,1160,1163,1166,1168,1170,1173,1176,1179,1181,1183,1185,1188],{"class":783,"line":15},[442,1143,1144],{"class":895},"    --fg",[442,1146,1147],{"class":786},": ",[442,1149,1150],{"class":796},"color-mix",[442,1152,1153],{"class":786},"(",[442,1155,1156],{"class":895},"in",[442,1158,1159],{"class":895}," oklab",[442,1161,1162],{"class":786},", ",[442,1164,1165],{"class":796},"var",[442,1167,1153],{"class":786},[442,1169,1123],{"class":895},[442,1171,1172],{"class":786},") ",[442,1174,1175],{"class":796},"55",[442,1177,1178],{"class":884},"%",[442,1180,1162],{"class":786},[442,1182,1165],{"class":796},[442,1184,1153],{"class":786},[442,1186,1187],{"class":895},"--bb-text",[442,1189,1190],{"class":786},"));\n",[442,1192,1193,1196,1198,1200],{"class":783,"line":19},[442,1194,1195],{"class":895},"    --border-color",[442,1197,1147],{"class":786},[442,1199,1150],{"class":796},[442,1201,1202],{"class":786},"(\n",[442,1204,1205,1208,1210],{"class":783,"line":47},[442,1206,1207],{"class":895},"        in",[442,1209,1159],{"class":895},[442,1211,910],{"class":786},[442,1213,1214,1217,1219,1221,1223,1226,1228],{"class":783,"line":51},[442,1215,1216],{"class":796},"        var",[442,1218,1153],{"class":786},[442,1220,1123],{"class":895},[442,1222,1172],{"class":786},[442,1224,1225],{"class":796},"35",[442,1227,1178],{"class":884},[442,1229,910],{"class":786},[442,1231,1232,1234,1236,1239],{"class":783,"line":55},[442,1233,1216],{"class":796},[442,1235,1153],{"class":786},[442,1237,1238],{"class":895},"--bb-panel",[442,1240,1241],{"class":786},")\n",[442,1243,1244],{"class":783,"line":95},[442,1245,1246],{"class":786},"    );\n",[442,1248,1249],{"class":783,"line":99},[442,1250,1251],{"class":786},"}\n",[387,1253,1254,1255,1257],{},"A registered variant is polite however alarming its name. Pass ",[391,1256,737],{},"\non the instances that genuinely are urgent.",[1259,1260,1261],"style",{},"html pre.shiki code .suds8, html code.shiki .suds8{--shiki-default:#0E1116;--shiki-dark:#F0F3F6}html pre.shiki code .sne4z, html code.shiki .sne4z{--shiki-default:#024C1A;--shiki-dark:#72F088}html pre.shiki code .s-5SL, html code.shiki .s-5SL{--shiki-default:#023B95;--shiki-dark:#91CBFF}html pre.shiki code .sT6z2, html code.shiki .sT6z2{--shiki-default:#032563;--shiki-dark:#ADDCFF}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 .sLBg1, html code.shiki .sLBg1{--shiki-default:#66707B;--shiki-dark:#BDC4CC}html pre.shiki code .sHUrx, html code.shiki .sHUrx{--shiki-default:#A0111F;--shiki-dark:#FF9492}html pre.shiki code .sKwhi, html code.shiki .sKwhi{--shiki-default:#622CBC;--shiki-dark:#DBB7FF}html pre.shiki code .soyes, html code.shiki .soyes{--shiki-default:#702C00;--shiki-dark:#FFB757}",{"title":397,"searchDepth":19,"depth":19,"links":1263},[1264,1268,1269,1270,1271],{"id":440,"depth":15,"text":444,"children":1265},[1266,1267],{"id":475,"depth":19,"text":476},{"id":581,"depth":19,"text":582},{"id":613,"depth":15,"text":616},{"id":674,"depth":15,"text":677},{"id":724,"depth":15,"text":727},{"id":854,"depth":15,"text":533},"The status message that stays on the page until someone reads it or closes it.","md",{},true,[1277,1278,1279,1280,1281],{"id":440,"title":444},{"id":613,"title":616},{"id":674,"title":677},{"id":724,"title":727},{"id":854,"title":533},{"title":206,"description":1272},"components\u002Fbb-alert","DVzw2mqYLf3ZiEDxTDr-z8no9OYKWVYNmsP6qIL1VvM",{"name":206,"slug":1286,"group":203,"description":1287,"entrypoint":1288,"docs":1289,"props":1292,"models":1353,"events":1356,"slots":1361,"exposed":1373,"pt":1374,"validated":3,"migration":1397},"bb-alert","Shows contextual status messages.","bitboss-ui",{"contract":1290,"source":1291},"ai\u002FBbAlert.md","ai\u002Fsource\u002FBbAlert.md",[1293,1299,1304,1310,1313,1316,1321,1324,1328,1333,1337,1340,1343,1348],{"name":1294,"type":1295,"required":1296,"default":3,"description":1297,"note":1298,"demo":724},"ariaLive","\"off\" | \"polite\" | \"assertive\" | undefined",false,"ARIA live region politeness. Unset, it follows `role` when you set one (`'alert'` → `'assertive'`, `'status'` → `'polite'`), else the variant: `'assertive'` for destructive\u002Fwarning, otherwise `'polite'`.","Only override it when visual tone and urgency come apart — a quiet `outline` alert that still has to interrupt. A registered custom variant is polite whatever its name, so urgent instances of one need this set by hand.",{"name":1300,"type":1301,"required":1296,"default":3,"description":1302,"note":1303,"demo":613},"closeLabel","string | undefined","Visually hidden string used to label the close button.","Defaults to a localised \"Close\" from the plugin `locale`. Worth setting as soon as a page carries more than one dismissible alert, so the two buttons do not read the same to a screen reader.",{"name":1305,"type":1306,"required":1296,"default":1307,"description":1308,"note":1309,"demo":613},"hideClose","boolean | undefined","false","Defines whether to hide the close button.","The only way to make an alert permanent: an unbound alert is still dismissible, because the internal model starts at `true`. Replaces v2 `show-close`, with the polarity inverted.",{"name":1311,"type":1306,"required":1296,"default":1307,"description":1312,"note":3,"demo":3},"hideIcon","Hide the icon, its own or its variant's; with neither it does nothing.",{"name":524,"type":1301,"required":1296,"default":3,"description":1314,"note":1315,"demo":440},"Name of a registered icon to use, or a full raw `\u003Csvg>` string (e.g. an SVG file imported with `?raw`). Without one, the variant's icon from the build plugin's `alertVariants` object form shows (none by default).","No variant implies an icon — pass one, and pick it together with the variant. It reinforces the message; `title` and `text` still have to carry it alone.",{"name":1317,"type":1318,"required":1296,"default":1319,"description":1320,"note":3,"demo":3},"iconSize","number | CssSize | keyof Sizes | undefined","\"16\"","Size of the icon to use.",{"name":1322,"type":1306,"required":1296,"default":650,"description":1323,"note":3,"demo":3},"modelValue","Used by v-model. Alerts are visible on mount; the model dismisses them.",{"name":1325,"type":1326,"required":1296,"default":3,"description":1327,"note":3,"demo":3},"pt","PtMap\u003CBbAlertPtPart, \"outline\" | \"primary\" | \"destructive\" | \"warning\"> | undefined","Passthrough, object form: the same keys as the `pt:*` attributes without the prefix. See the `pt:\u003Cpart>` row.",{"name":1329,"type":1330,"required":1296,"default":3,"description":1331,"note":3,"demo":1332},"pt:\u003Cpart>","PtValue | undefined","Passthrough, attribute form: one attribute per part, `pt:\u003Cpart>`, and per part and state, `pt:\u003Cpart>:\u003Cstate>`. Parts: `close`, `icon`, `root`, `text`, `title`. States: `destructive`, `outline`, `primary`, `warning`.","passthrough",{"name":756,"type":1334,"required":1296,"default":3,"description":1335,"note":1336,"demo":724},"\"alert\" | \"status\" | undefined","Accessibility role for the alert container. Defaults to `'alert'` for destructive\u002Fwarning variants, otherwise `'status'`.","Derived from the variant, so setting it is a deliberate disagreement with that derivation. Reserve `alert` for genuinely urgent messages: several assertive alerts appearing together talk over each other.",{"name":471,"type":1301,"required":1296,"default":3,"description":1338,"note":1339,"demo":440},"Text content of the alert body.","For when a string is all you have — a server message, an item in a `v-for`. When the body is written in the template, the default slot reads better and wins over this prop.",{"name":1341,"type":1301,"required":1296,"default":3,"description":1342,"note":3,"demo":3},"title","Text content of the alert title.",{"name":1344,"type":1345,"required":1296,"default":1346,"description":1347,"note":3,"demo":3},"transitionDuration","number | undefined","250","Transition duration in milliseconds for enter\u002Fleave.",{"name":517,"type":1349,"required":1296,"default":1350,"description":1351,"note":1352,"demo":440},"keyof AlertVariantRegistry | undefined","\"outline\"","Visual variant of the alert.","An open registry, not a closed enum: `alertVariants` in the plugin config adds typed names, which then ship no CSS of their own. There is no `success` or `info`: a confirmation is usually a toast and a neutral note is `outline` with an icon; register one when the app needs it and colour it from `--bb-success` \u002F `--bb-info`.",[1354],{"name":1322,"type":1306,"note":1355,"demo":613},"A boolean that starts at `true`: the alert is visible on mount and the close button sets it to `false`, bound or not. Set it back to `true` and the alert re-enters with the same transition.",[1357],{"name":1358,"signature":1359,"description":1360,"note":3,"demo":3},"update:modelValue","(value: boolean): void","Emitted with the new value whenever `v-model` changes.",[1362,1366,1370],{"name":1363,"type":1364,"description":1365,"note":3,"demo":3},"default","any","The alert body, the shortest form: `\u003CBbAlert>Something went wrong\u003C\u002FBbAlert>`. The most specific source wins: `#text` > children > the `text` prop.",{"name":471,"type":1367,"description":1368,"note":1369,"demo":674},"BbAlertTextSlotProps","Replaces the default alert body text. Wins over children and `text`.","Receives `{ text }`, the value of the `text` prop, so it can decorate the string instead of restating it. Precedence for the body, most specific first: `#text`, child content, the `text` prop.",{"name":1341,"type":1371,"description":1372,"note":3,"demo":674},"BbAlertTitleSlotProps","Replaces the default alert title text.",[],{"parts":1375,"states":1388},[1376,1379,1381,1383,1385],{"name":1377,"description":1378},"root","The alert box.",{"name":524,"description":1380},"The leading glyph — its `icon`, else its variant's from the build config; never with `hide-icon`.",{"name":1341,"description":1382},"The heading line.",{"name":471,"description":1384},"The body copy.",{"name":1386,"description":1387},"close","The ✕ that dismisses the alert.",[1389,1391,1393,1395],{"name":504,"description":1390},"Component-wide: `variant: 'destructive'`. Below the real states, like every variant.",{"name":486,"description":1392},"Component-wide: `variant: 'outline'`. Merged after the part's base entry and before its states, so the real states still win.",{"name":492,"description":1394},"Component-wide: `variant: 'primary'`. Below the real states, like every variant.",{"name":498,"description":1396},"Component-wide: `variant: 'warning'`. Below the real states, like every variant.",{"removed":1398,"renamed":1410},[1399,1406],{"name":1400,"surface":1401,"replacedBy":1305,"hint":3,"since":1402,"migration":1403,"silent":1275,"fix":1404},"showClose","prop","3.0.0-alpha.1","ai\u002Fguides\u002Fmigration\u002Fcomponents\u002Fbb-alert.md",{"kind":1405},"invert",{"name":565,"surface":1401,"replacedBy":517,"hint":3,"since":1407,"migration":1403,"silent":1275,"fix":1408},"3.0.0-alpha.9",{"kind":1409},"rename",[1411,1413],{"from":1400,"to":1305,"surface":1401,"since":1402,"migration":1403,"fix":1412},{"kind":1405},{"from":565,"to":517,"surface":1401,"since":1407,"migration":1403,"fix":1414},{"kind":1409},1793055138205]