[{"data":1,"prerenderedAt":1090},["ShallowReactive",2],{"locale-alternates":3,"docs-nav-en":134,"api-none":377,"page-en-\u002Fcomponents\u002Fbb-tree":378,"pt-showcase-BbTree":992},{"\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-calendar":20,"\u002Fen\u002Fcomponents\u002Fbb-calendar":21,"\u002Fit\u002Fcomponenti\u002Fbb-checkbox":22,"\u002Fen\u002Fcomponents\u002Fbb-checkbox":23,"\u002Fit\u002Fcomponenti\u002Fbb-checkbox-group":24,"\u002Fen\u002Fcomponents\u002Fbb-checkbox-group":25,"\u002Fit\u002Fcomponenti\u002Fbb-collapsible":26,"\u002Fen\u002Fcomponents\u002Fbb-collapsible":27,"\u002Fit\u002Fcomponenti\u002Fbb-color-input":28,"\u002Fen\u002Fcomponents\u002Fbb-color-input":29,"\u002Fit\u002Fcomponenti\u002Fbb-color-palette":30,"\u002Fen\u002Fcomponents\u002Fbb-color-palette":31,"\u002Fit\u002Fcomponenti\u002Fbb-confirm":32,"\u002Fen\u002Fcomponents\u002Fbb-confirm":33,"\u002Fit\u002Fcomponenti\u002Fbb-date-picker":34,"\u002Fen\u002Fcomponents\u002Fbb-date-picker":35,"\u002Fit\u002Fcomponenti\u002Fbb-date-picker-input":36,"\u002Fen\u002Fcomponents\u002Fbb-date-picker-input":37,"\u002Fit\u002Fcomponenti\u002Fbb-dialog":38,"\u002Fen\u002Fcomponents\u002Fbb-dialog":39,"\u002Fit\u002Fcomponenti\u002Fbb-dropdown":40,"\u002Fen\u002Fcomponents\u002Fbb-dropdown":41,"\u002Fit\u002Fcomponenti\u002Fbb-dropdown-button":42,"\u002Fen\u002Fcomponents\u002Fbb-dropdown-button":43,"\u002Fit\u002Fcomponenti\u002Fbb-dropzone":44,"\u002Fen\u002Fcomponents\u002Fbb-dropzone":45,"\u002Fit\u002Fcomponenti\u002Fbb-form":46,"\u002Fen\u002Fcomponents\u002Fbb-form":47,"\u002Fit\u002Fcomponenti\u002Fbb-hover-card":48,"\u002Fen\u002Fcomponents\u002Fbb-hover-card":49,"\u002Fit\u002Fcomponenti\u002Fbb-icon":50,"\u002Fen\u002Fcomponents\u002Fbb-icon":51,"\u002Fit\u002Fcomponenti\u002Fbb-indicator":52,"\u002Fen\u002Fcomponents\u002Fbb-indicator":53,"\u002Fit\u002Fcomponenti\u002Fbb-number-input":54,"\u002Fen\u002Fcomponents\u002Fbb-number-input":55,"\u002Fit\u002Fcomponenti\u002Fbb-off-canvas":56,"\u002Fen\u002Fcomponents\u002Fbb-off-canvas":57,"\u002Fit\u002Fcomponenti\u002Fbb-pagination":58,"\u002Fen\u002Fcomponents\u002Fbb-pagination":59,"\u002Fit\u002Fcomponenti\u002Fbb-popover":60,"\u002Fen\u002Fcomponents\u002Fbb-popover":61,"\u002Fit\u002Fcomponenti\u002Fbb-progress":62,"\u002Fen\u002Fcomponents\u002Fbb-progress":63,"\u002Fit\u002Fcomponenti\u002Fbb-radio":64,"\u002Fen\u002Fcomponents\u002Fbb-radio":65,"\u002Fit\u002Fcomponenti\u002Fbb-radio-group":66,"\u002Fen\u002Fcomponents\u002Fbb-radio-group":67,"\u002Fit\u002Fcomponenti\u002Fbb-rating":68,"\u002Fen\u002Fcomponents\u002Fbb-rating":69,"\u002Fit\u002Fcomponenti\u002Fbb-select":70,"\u002Fen\u002Fcomponents\u002Fbb-select":71,"\u002Fit\u002Fcomponenti\u002Fbb-select-popover":72,"\u002Fen\u002Fcomponents\u002Fbb-select-popover":73,"\u002Fit\u002Fcomponenti\u002Fbb-slider":74,"\u002Fen\u002Fcomponents\u002Fbb-slider":75,"\u002Fit\u002Fcomponenti\u002Fbb-smooth-height":76,"\u002Fen\u002Fcomponents\u002Fbb-smooth-height":77,"\u002Fit\u002Fcomponenti\u002Fbb-spinner":78,"\u002Fen\u002Fcomponents\u002Fbb-spinner":79,"\u002Fit\u002Fcomponenti\u002Fbb-switch":80,"\u002Fen\u002Fcomponents\u002Fbb-switch":81,"\u002Fit\u002Fcomponenti\u002Fbb-switch-group":82,"\u002Fen\u002Fcomponents\u002Fbb-switch-group":83,"\u002Fit\u002Fcomponenti\u002Fbb-table":84,"\u002Fen\u002Fcomponents\u002Fbb-table":85,"\u002Fit\u002Fcomponenti\u002Fbb-tabs":86,"\u002Fen\u002Fcomponents\u002Fbb-tabs":87,"\u002Fit\u002Fcomponenti\u002Fbb-tag":88,"\u002Fen\u002Fcomponents\u002Fbb-tag":89,"\u002Fit\u002Fcomponenti\u002Fbb-text-input":90,"\u002Fen\u002Fcomponents\u002Fbb-text-input":91,"\u002Fit\u002Fcomponenti\u002Fbb-textarea":92,"\u002Fen\u002Fcomponents\u002Fbb-textarea":93,"\u002Fit\u002Fcomponenti\u002Fbb-time-picker":94,"\u002Fen\u002Fcomponents\u002Fbb-time-picker":95,"\u002Fit\u002Fcomponenti\u002Fbb-time-picker-input":96,"\u002Fen\u002Fcomponents\u002Fbb-time-picker-input":97,"\u002Fit\u002Fcomponenti\u002Fbb-toast":98,"\u002Fen\u002Fcomponents\u002Fbb-toast":99,"\u002Fit\u002Fcomponenti\u002Fbb-tooltip":100,"\u002Fen\u002Fcomponents\u002Fbb-tooltip":101,"\u002Fit\u002Fcomponenti\u002Fbb-tree":102,"\u002Fen\u002Fcomponents\u002Fbb-tree":103,"\u002Fit\u002Fguide\u002Fadoption-checklist":104,"\u002Fen\u002Fguides\u002Fadoption-checklist":105,"\u002Fit\u002Fguide\u002Fai-agents":106,"\u002Fen\u002Fguides\u002Fai-agents":107,"\u002Fit\u002Fguide\u002Fcoherence":108,"\u002Fen\u002Fguides\u002Fcoherence":109,"\u002Fit\u002Fguide\u002Fdesign-language":110,"\u002Fen\u002Fguides\u002Fdesign-language":111,"\u002Fit\u002Fguide\u002Fdesign-tokens":112,"\u002Fen\u002Fguides\u002Fdesign-tokens":113,"\u002Fit\u002Fguide\u002Ffetching-data":114,"\u002Fen\u002Fguides\u002Ffetching-data":115,"\u002Fit\u002Fguide\u002Ficons":116,"\u002Fen\u002Fguides\u002Ficons":117,"\u002Fit\u002Fguide\u002Finertia":118,"\u002Fen\u002Fguides\u002Finertia":119,"\u002Fit\u002Fguide\u002Finstallation":120,"\u002Fen\u002Fguides\u002Finstallation":121,"\u002Fit\u002Fguide\u002Fmigration":122,"\u002Fen\u002Fguides\u002Fmigration":123,"\u002Fit\u002Fguide\u002Fnuxt":124,"\u002Fen\u002Fguides\u002Fnuxt":125,"\u002Fit\u002Fguide\u002Foptions-and-items":126,"\u002Fen\u002Fguides\u002Foptions-and-items":127,"\u002Fit\u002Fguide\u002Fpassthrough":128,"\u002Fen\u002Fguides\u002Fpassthrough":129,"\u002Fit\u002Fguide\u002Fpreset-components":130,"\u002Fen\u002Fguides\u002Fpreset-components":131,"\u002Fit\u002Fguide\u002Fvalidated-forms":132,"\u002Fen\u002Fguides\u002Fvalidated-forms":133},"\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",[135,150,162,186,198,242,275,311,332,353,365,371],{"label":136,"entries":137},"Getting started",[138,142,146],{"title":139,"path":140,"order":141},"Installation","\u002Fguides\u002Finstallation",1,{"title":143,"path":144,"order":145},"Migrating from v2","\u002Fguides\u002Fmigration",2,{"title":147,"path":148,"order":149},"Adoption checklist","\u002Fguides\u002Fadoption-checklist",3,{"label":151,"entries":152},"Design system",[153,156,159],{"title":154,"path":155,"order":141},"Design tokens","\u002Fguides\u002Fdesign-tokens",{"title":157,"path":158,"order":145},"Design language","\u002Fguides\u002Fdesign-language",{"title":160,"path":161,"order":149},"Passthrough","\u002Fguides\u002Fpassthrough",{"label":163,"entries":164},"Playbooks",[165,168,171,174,178,182],{"title":166,"path":167,"order":141},"Options and items","\u002Fguides\u002Foptions-and-items",{"title":169,"path":170,"order":145},"Fetching data","\u002Fguides\u002Ffetching-data",{"title":172,"path":173,"order":149},"Coherence","\u002Fguides\u002Fcoherence",{"title":175,"path":176,"order":177},"Validated forms","\u002Fguides\u002Fvalidated-forms",4,{"title":179,"path":180,"order":181},"Icons","\u002Fguides\u002Ficons",5,{"title":183,"path":184,"order":185},"Preset components","\u002Fguides\u002Fpreset-components",6,{"label":187,"entries":188},"Ecosystem",[189,192,195],{"title":190,"path":191,"order":141},"Inertia and Laravel","\u002Fguides\u002Finertia",{"title":193,"path":194,"order":145},"Nuxt","\u002Fguides\u002Fnuxt",{"title":196,"path":197,"order":149},"AI agents","\u002Fguides\u002Fai-agents",{"label":199,"entries":200},"Inputs",[201,204,207,210,213,216,219,222,226,230,234,238],{"title":202,"path":203,"component":202,"order":141},"BbBaseButton","\u002Fcomponents\u002Fbb-base-button",{"title":205,"path":206,"component":205,"order":145},"BbButton","\u002Fcomponents\u002Fbb-button",{"title":208,"path":209,"component":208,"order":149},"BbCalendar","\u002Fcomponents\u002Fbb-calendar",{"title":211,"path":212,"component":211,"order":149},"BbColorInput","\u002Fcomponents\u002Fbb-color-input",{"title":214,"path":215,"component":214,"order":177},"BbDatePickerInput","\u002Fcomponents\u002Fbb-date-picker-input",{"title":217,"path":218,"component":217,"order":181},"BbDropzone","\u002Fcomponents\u002Fbb-dropzone",{"title":220,"path":221,"component":220,"order":185},"BbForm","\u002Fcomponents\u002Fbb-form",{"title":223,"path":224,"component":223,"order":225},"BbNumberInput","\u002Fcomponents\u002Fbb-number-input",7,{"title":227,"path":228,"component":227,"order":229},"BbTag","\u002Fcomponents\u002Fbb-tag",8,{"title":231,"path":232,"component":231,"order":233},"BbTextarea","\u002Fcomponents\u002Fbb-textarea",9,{"title":235,"path":236,"component":235,"order":237},"BbTextInput","\u002Fcomponents\u002Fbb-text-input",10,{"title":239,"path":240,"component":239,"order":241},"BbTimePickerInput","\u002Fcomponents\u002Fbb-time-picker-input",11,{"label":243,"entries":244},"Selection",[245,248,251,254,257,260,263,266,269,272],{"title":246,"path":247,"component":246,"order":141},"BbCheckbox","\u002Fcomponents\u002Fbb-checkbox",{"title":249,"path":250,"component":249,"order":145},"BbCheckboxGroup","\u002Fcomponents\u002Fbb-checkbox-group",{"title":252,"path":253,"component":252,"order":149},"BbRadio","\u002Fcomponents\u002Fbb-radio",{"title":255,"path":256,"component":255,"order":177},"BbRadioGroup","\u002Fcomponents\u002Fbb-radio-group",{"title":258,"path":259,"component":258,"order":181},"BbRating","\u002Fcomponents\u002Fbb-rating",{"title":261,"path":262,"component":261,"order":185},"BbSelect","\u002Fcomponents\u002Fbb-select",{"title":264,"path":265,"component":264,"order":225},"BbSelectPopover","\u002Fcomponents\u002Fbb-select-popover",{"title":267,"path":268,"component":267,"order":229},"BbSlider","\u002Fcomponents\u002Fbb-slider",{"title":270,"path":271,"component":270,"order":233},"BbSwitch","\u002Fcomponents\u002Fbb-switch",{"title":273,"path":274,"component":273,"order":237},"BbSwitchGroup","\u002Fcomponents\u002Fbb-switch-group",{"label":276,"entries":277},"Overlay",[278,281,284,287,290,293,296,299,302,305,308],{"title":279,"path":280,"component":279,"order":141},"BbColorPalette","\u002Fcomponents\u002Fbb-color-palette",{"title":282,"path":283,"component":282,"order":145},"BbConfirm","\u002Fcomponents\u002Fbb-confirm",{"title":285,"path":286,"component":285,"order":149},"BbDatePicker","\u002Fcomponents\u002Fbb-date-picker",{"title":288,"path":289,"component":288,"order":177},"BbDialog","\u002Fcomponents\u002Fbb-dialog",{"title":291,"path":292,"component":291,"order":181},"BbDropdown","\u002Fcomponents\u002Fbb-dropdown",{"title":294,"path":295,"component":294,"order":185},"BbDropdownButton","\u002Fcomponents\u002Fbb-dropdown-button",{"title":297,"path":298,"component":297,"order":225},"BbHoverCard","\u002Fcomponents\u002Fbb-hover-card",{"title":300,"path":301,"component":300,"order":225},"BbOffCanvas","\u002Fcomponents\u002Fbb-off-canvas",{"title":303,"path":304,"component":303,"order":229},"BbPopover","\u002Fcomponents\u002Fbb-popover",{"title":306,"path":307,"component":306,"order":233},"BbTimePicker","\u002Fcomponents\u002Fbb-time-picker",{"title":309,"path":310,"component":309,"order":237},"BbTooltip","\u002Fcomponents\u002Fbb-tooltip",{"label":312,"entries":313},"Navigation",[314,317,320,323,326,329],{"title":315,"path":316,"component":315,"order":141},"BbAccordion","\u002Fcomponents\u002Fbb-accordion",{"title":318,"path":319,"component":318,"order":145},"BbBreadcrumbs","\u002Fcomponents\u002Fbb-breadcrumbs",{"title":321,"path":322,"component":321,"order":149},"BbCollapsible","\u002Fcomponents\u002Fbb-collapsible",{"title":324,"path":325,"component":324,"order":177},"BbPagination","\u002Fcomponents\u002Fbb-pagination",{"title":327,"path":328,"component":327,"order":181},"BbTabs","\u002Fcomponents\u002Fbb-tabs",{"title":330,"path":331,"component":330,"order":185},"BbTree","\u002Fcomponents\u002Fbb-tree",{"label":333,"entries":334},"Feedback",[335,338,341,344,347,350],{"title":336,"path":337,"component":336,"order":141},"BbAlert","\u002Fcomponents\u002Fbb-alert",{"title":339,"path":340,"component":339,"order":145},"BbBadge","\u002Fcomponents\u002Fbb-badge",{"title":342,"path":343,"component":342,"order":149},"BbIndicator","\u002Fcomponents\u002Fbb-indicator",{"title":345,"path":346,"component":345,"order":177},"BbProgress","\u002Fcomponents\u002Fbb-progress",{"title":348,"path":349,"component":348,"order":181},"BbSpinner","\u002Fcomponents\u002Fbb-spinner",{"title":351,"path":352,"component":351,"order":185},"BbToast","\u002Fcomponents\u002Fbb-toast",{"label":354,"entries":355},"Data Display",[356,359,362],{"title":357,"path":358,"component":357,"order":141},"BbAvatar","\u002Fcomponents\u002Fbb-avatar",{"title":360,"path":361,"component":360,"order":145},"BbIcon","\u002Fcomponents\u002Fbb-icon",{"title":363,"path":364,"component":363,"order":149},"BbTable","\u002Fcomponents\u002Fbb-table",{"label":366,"entries":367},"Layout & Utility",[368],{"title":369,"path":370,"component":369,"order":141},"BbSmoothHeight","\u002Fcomponents\u002Fbb-smooth-height",{"label":372,"entries":373},"Other",[374],{"title":375,"path":376,"component":375,"order":141},"BbAsterisk","\u002Fcomponents\u002Fbb-asterisk",null,{"id":379,"title":330,"body":380,"component":330,"description":978,"extension":979,"group":312,"meta":980,"navigation":981,"order":185,"path":331,"sections":982,"seo":989,"stem":990,"__hash__":991},"docs_en\u002Fcomponents\u002Fbb-tree.md",{"type":381,"value":382,"toc":970},"minimark",[383,428,434,442,470,474,477,568,574,591,594,613,626,629,650,656,675,678,716,740,754,779,785,808,811,834,837,855,858,877,883,886,889,904,910,929,932,963],[384,385,386,394],"when",{},[387,388,389,390,393],"p",{},"Reach for ",[391,392,330],"code",{}," when the data is genuinely hierarchical and of unbounded\ndepth: a file browser, a docs sidebar, a category picker, an org chart.",[395,396,398],"template",{"v-slot:else":397},"",[399,400,401,414,421],"ul",{},[402,403,404,409,410,413],"li",{},[405,406,407],"a",{"href":84},[391,408,363],{}," with its ",[391,411,412],{},"#expand"," slot — the rows are\nflat with one level of detail, which is not a tree",[402,415,416,420],{},[405,417,418],{"href":26},[391,419,321],{}," — it is one section that\nopens and closes",[402,422,423,427],{},[405,424,425],{"href":40},[391,426,291],{}," — it is a short list of commands",[387,429,430,431,433],{},"You own each node's markup. ",[391,432,330],{}," owns recursion, expansion state and\ndisclosure wiring. This split keeps branch controls and destination links\nsemantically correct.",[435,436,438],"h2",{"id":437},"default",[439,440,441],"span",{},"Navigation nodes",[387,443,444,450,451,454,455,458,459,462,463,466,467,469],{},[405,445,447],{"href":446},"\u002Fen\u002Fcomponents\u002Fbb-tree\u002Fapi#prop-items",[391,448,449],{},"items"," takes a nested array of\n",[391,452,453],{},"BbTreeItem\u003CMeta>",": your data in ",[391,456,457],{},"meta",", the nesting in ",[391,460,461],{},"children",". Declare the\narray as ",[391,464,465],{},"BbTreeItem\u003CYourType>[]"," and ",[391,468,457],{}," arrives typed in every slot.",[471,472],"demo",{"name":473},"BbTree\u002FNavigation",[387,475,476],{},"A branch is a disclosure button because it reveals content on the current page.\nA leaf that opens a destination is a real link. Never put both behaviours on a\nrow click.",[399,478,479,519,552],{},[402,480,481,482,485,486,489,490,492,493,492,496,492,499,492,502,492,505,492,508,511,512,466,515,518],{},"Bind the slot's ",[391,483,484],{},"expandProps"," to a real ",[391,487,488],{},"\u003Cbutton>"," on every branch. The slot\nalso receives ",[391,491,457],{},", ",[391,494,495],{},"item",[391,497,498],{},"parent",[391,500,501],{},"index",[391,503,504],{},"depth",[391,506,507],{},"value",[391,509,510],{},"expanded",",\n",[391,513,514],{},"expandable",[391,516,517],{},"toggleExpanded()","; treat them as read-only.",[402,520,521,522,525,526,529,530,534,535,539,540,543,544,547,548,551],{},"Give the leaf ",[391,523,524],{},"href"," or ",[391,527,528],{},"to"," through\n",[405,531,532],{"href":14},[391,533,202],{}," when the look is yours, or\n",[405,536,537],{"href":18},[391,538,205],{}," with ",[391,541,542],{},"variant=\"ghost\""," for the\nlibrary's. Both take ",[391,545,546],{},"active-class"," \u002F ",[391,549,550],{},"exact-active-class",", so the current page\nlights itself up.",[402,553,554,560,561,564,565,567],{},[405,555,557],{"href":556},"\u002Fen\u002Fcomponents\u002Fbb-tree\u002Fapi#prop-itemValue",[391,558,559],{},"item-value"," is required\n(",[391,562,563],{},"item-value=\"path\""," above), a key or a function of ",[391,566,457],{},". It gives every\nnode a stable identity, so a refetch can replace every object without closing\nthe folders a reader opened.",[435,569,571],{"id":570},"expansion",[439,572,573],{},"Which nodes open, and how they stay open",[387,575,576,577,582,583,586,587,590],{},"Nothing is expandable by default.\n",[405,578,580],{"href":579},"\u002Fen\u002Fcomponents\u002Fbb-tree\u002Fapi#prop-expandable",[391,581,514],{}," decides which nodes\nget a live toggle: ",[391,584,585],{},"true"," for the whole tree, or a function of\n",[391,588,589],{},"(item, depth, parent)",".",[471,592],{"name":593},"BbTree\u002FExpandable",[387,595,596,597,600,601,604,605,608,609,612],{},"The everyday form is ",[391,598,599],{},":expandable=\"(node) => !!node.children?.length\"","; the\nfunction also locks a level (",[391,602,603],{},"depth > 2",") or gates on ",[391,606,607],{},"item.meta",". A node's own\n",[391,610,611],{},"expandable: false"," pins that branch open, with no toggle. If your chevrons do\nnothing, this prop is missing: without it the tree renders fully expanded and\nstatic.",[387,614,615,616,622,623,625],{},"The open branches live in\n",[405,617,619],{"href":618},"\u002Fen\u002Fcomponents\u002Fbb-tree\u002Fapi#model-expandedItems",[391,620,621],{},"v-model:expandedItems",", as\ntheir ",[391,624,559],{}," identities:",[471,627],{"name":628},"BbTree\u002FExpandCollapse",[399,630,631,641,644],{},[402,632,633,634,637,638,640],{},"To open a node from code, push its value into the model. A branch joins the\nmodel on its own the first time it is seen, unless it carries\n",[391,635,636],{},"expanded: false",". After that the model is the only source of truth, and the\nitem's ",[391,639,510],{}," flag is ignored.",[402,642,643],{},"Leaves never appear in the model, so expand-all is \"every branch identity\",\nas the demo computes. Persist the model to restore open folders on the next\nvisit.",[402,645,646,647,649],{},"Pick an ",[391,648,559],{}," the server keeps stable, an id or a path, never a field\nthat changes with an edit: a node whose identity changes closes, along with\nits open subtree.",[435,651,653],{"id":652},"slots",[439,654,655],{},"One node, one slot",[387,657,658,659,664,665,668,669,672,673,590],{},"Beyond ",[405,660,662],{"href":661},"\u002Fen\u002Fcomponents\u002Fbb-tree\u002Fapi#slot-default",[391,663,437],{},", each node resolves\na slot in a fixed order: ",[391,666,667],{},"#\u003Cvalue>"," for the node whose identity matches, then\n",[391,670,671],{},"#\u003Cdepth>"," for every node at that level, then ",[391,674,437],{},[471,676],{"name":677},"BbTree\u002FNodeSlots",[387,679,680,684,685,688,689,492,692,695,696,492,699,688,702,705,706,709,710,713,714,590],{},[681,682,683],"strong",{},"The value slot's name is the identity in kebab-case",": ",[391,686,687],{},"src\u002Fcomposables"," is\n",[391,690,691],{},"#src-composables",[391,693,694],{},"Order History"," is ",[391,697,698],{},"#order-history",[391,700,701],{},"Q3 Reports",[391,703,704],{},"#q-3-reports",". For anything exotic write ",[391,707,708],{},"#[slotKey('Qualità')]",", with\n",[391,711,712],{},"import { slotKey } from 'bitboss-ui'",". A node whose name matches no slot renders\nthrough ",[391,715,437],{},[387,717,718,466,721,724,725,728,729,732,733,736,737,590],{},[391,719,720],{},"#\u003Cvalue>:children",[391,722,723],{},"#\u003Cdepth>:children"," replace the children ",[681,726,727],{},"container","\nof the matching node: the recursion stops there and your markup renders instead.\nThat is how you put an inline empty state under one branch\n(",[391,730,731],{},"#src-locales:children"," above, under the empty ",[391,734,735],{},"locales"," folder). They render\nfor leaves too, so guard branch-only markup with ",[391,738,739],{},"v-if=\"item.children?.length\"",[387,741,742,743,746,747,750,751,590],{},"Give nodes string identities (",[391,744,745],{},"'folder-1'",") when you use per-node slots: a node\nvalued ",[391,748,749],{},"1"," and every node at depth 1 both answer to ",[391,752,753],{},"#1",[755,756,758],"migration",{"title":757},"Per-node slot names",[387,759,760,761,764,765,767,768,770,771,774,775,778],{},"v2 named the slot with the raw value. v3 runs it through ",[391,762,763],{},"slotKey",", so rename\neach per-node slot to the kebab-case identity. A name in the v2 spelling matches\nno node, and that node renders through ",[391,766,437],{},".\nThe children-container slots are ",[391,769,720],{},", with a colon:\n",[391,772,773],{},"bitboss-ui check --fix"," rewrites the old ",[391,776,777],{},"-children"," names.",[435,780,782],{"id":781},"keyboard",[439,783,784],{},"A disclosure list, not a tree",[387,786,787,789,790,793,794,797,798,547,801,547,804,807],{},[391,788,330],{}," renders no ",[391,791,792],{},"role=\"tree\"",", no ",[391,795,796],{},"role=\"treeitem\""," and no\n",[391,799,800],{},"aria-level",[391,802,803],{},"aria-posinset",[391,805,806],{},"aria-setsize",". An APG tree makes the node\nitself the single focusable unit, which cannot coexist with slot-driven nodes\nthat hold your links and buttons. Each branch is an ordinary disclosure: a\nbutton that shows and hides a region.",[387,809,810],{},"What you get:",[399,812,813,827],{},[402,814,815,816,819,820,822,823,826],{},"The children container carries the ",[391,817,818],{},"id"," that ",[391,821,484],{},"' ",[391,824,825],{},"aria-controls","\npoints at. That pairing is the whole disclosure wiring.",[402,828,829,830,833],{},"A collapsed container is ",[391,831,832],{},"inert",", so its links and buttons leave the tab order\nand the accessibility tree.",[387,835,836],{},"What you still owe:",[399,838,839,848],{},[402,840,841,842,844,845,847],{},"One real focusable control per row, and ",[391,843,484],{}," on a ",[391,846,488],{}," for every\nbranch.",[402,849,850,851,854],{},"An accessible name on an icon-only toggle (",[391,852,853],{},"Collapse src",", not a bare\nchevron). When the toggle contains the node's label, as in the demos, that text\nis already the name.",[387,856,857],{},"Keyboard users Tab through whatever your slots render and toggle with Enter or\nSpace, so your node markup decides how good the keyboard experience is.",[755,859,861],{"title":860},"Tree roles and tabindex",[387,862,863,864,466,866,869,870,873,874,876],{},"v2 claimed ",[391,865,792],{},[391,867,868],{},"treeitem"," without the keyboard contract they\npromise; v3 drops the roles. Delete any ",[391,871,872],{},":tabindex=\"open ? undefined : -1\""," you\nwrote for collapsed branches: ",[391,875,832],{}," does it now, and the manual tabindex\nfights it.",[435,878,880],{"id":879},"lazy",[439,881,882],{},"Branches that load on first open",[387,884,885],{},"A collapsed branch renders its rows the first time it opens, so a mostly closed\ntree of thousands of nodes is cheap. Open branches are not virtualized: for\nfolders of unknown size, load the children when the branch first opens.",[471,887],{"name":888},"BbTree\u002FLazyFolders",[387,890,891,892,895,896,898,899,903],{},"Give each unloaded folder a single ",[681,893,894],{},"placeholder child",", so it is a real branch\n(a childless node is a leaf, and a leaf reports itself expanded). Mark those\nfolders ",[391,897,636],{},", or they open at first sight and every request fires\nat mount. Then watch the model: when an unloaded folder's identity appears, fetch\nand swap its children. ",[405,900,901],{"href":446},[391,902,449],{}," is\nwatched deeply, so the tree updates in place.",[435,905,907],{"id":906},"styling",[439,908,909],{},"Indentation, rhythm and connector lines",[387,911,912,913,916,917,920,921,924,925,928],{},"Two CSS custom properties on ",[391,914,915],{},".bb-tree"," shape the layout: ",[391,918,919],{},"--indent"," shifts each\nchild level and ",[391,922,923],{},"--gap"," adds space between siblings. Both default to ",[391,926,927],{},"0",", so\nnothing indents until you set them. Expansion animates on its own.",[471,930],{"name":931},"BbTree\u002FConnectors",[387,933,934,935,409,938,492,941,466,944,947,948,466,951,954,955,958,959,962],{},"Connector lines are not shipped: they are a look, and every product wants them\nslightly different. This is the one sanctioned case for styling the internals:\n",[391,936,937],{},".bb-tree__item",[391,939,940],{},"--depth-\u003Cn>",[391,942,943],{},"--expanded",[391,945,946],{},"--leaf"," modifiers,\n",[391,949,950],{},".bb-tree__row",[391,952,953],{},".bb-tree__children",". Write the rules under a wrapper class\nso they never reach another tree. For a plain per-node style use ",[391,956,957],{},"pt"," instead:\n",[391,960,961],{},"pt:item:expanded=\"font-medium\""," weights every open branch (leaves count as\nexpanded).",[387,964,965,966,969],{},"In a narrow pane a long label truncates with a plain ",[391,967,968],{},"truncate"," class on your\nnode markup: the row already lets its content shrink.",{"title":397,"searchDepth":149,"depth":149,"links":971},[972,973,974,975,976,977],{"id":437,"depth":145,"text":441},{"id":570,"depth":145,"text":573},{"id":652,"depth":145,"text":655},{"id":781,"depth":145,"text":784},{"id":879,"depth":145,"text":882},{"id":906,"depth":145,"text":909},"Nested, expandable data of any depth. You write each node's markup; the component handles structure and expansion.","md",{},true,[983,984,985,986,987,988],{"id":437,"title":441},{"id":570,"title":573},{"id":652,"title":655},{"id":781,"title":784},{"id":879,"title":882},{"id":906,"title":909},{"title":330,"description":978},"components\u002Fbb-tree","djetgiDNt9vtb19aqQYt88lSTF7DyhMGEcnCxKqlEa4",{"name":330,"slug":993,"group":312,"description":994,"entrypoint":995,"docs":996,"props":999,"models":1027,"events":1030,"slots":1036,"exposed":1054,"pt":1055,"validated":377,"migration":1065},"bb-tree","Renders hierarchical expandable tree structures.","bitboss-ui",{"contract":997,"source":998},"ai\u002FBbTree.md","ai\u002Fsource\u002FBbTree.md",[1000,1005,1010,1014,1019,1022],{"name":514,"type":1001,"required":1002,"default":377,"description":1003,"note":1004,"demo":570},"BbTreeExpandable\u003CMeta> | undefined",false,"Defines nodes as expandable. It can be a global boolean, or a function that receives the node, its depth, and its parent and returns a boolean.","Without it nothing is expandable: the tree renders fully expanded and static, which is the answer to \"my chevrons do nothing\". The everyday form is `(node) => !!node.children?.length`; a per-node `expandable` field overrides it for that node, and `false` on a branch renders its children frozen open rather than hiding them.",{"name":1006,"type":1007,"required":1002,"default":1008,"description":1009,"note":377,"demo":377},"expandedItems","any[] | undefined","[]","Live expansion state: the list of expanded node values (see `itemValue`). Branch nodes not explicitly collapsed via `expanded: false` seed the list when they first appear in `items`; from then on this model is the single source of truth.",{"name":449,"type":1011,"required":981,"default":1008,"description":1012,"note":1013,"demo":437},"BbTreeItem\u003CMeta>[]","Tree-like structure of nodes to render.","Use the fixed `{ meta, children }` envelope. Branches disclose children; leaves render navigation or content from your slot.",{"name":1015,"type":1016,"required":981,"default":377,"description":1017,"note":1018,"demo":437},"itemValue","ItemAccessor\u003CMeta>","A node's identity, the field telling nodes apart (e.g. `\"id\"`). Required: it decides which nodes `expandedItems` keeps open and names the per-node slots, a load-bearing id you write, never derived. A string reads that key from `meta`; a function maps `meta` to the value.","Required: a key or a function of `meta` that stays stable across refetches. A node whose identity changes closes and renames its per-node slots. It used to fall back to the whole `meta` object in the earlier 3.0 betas.",{"name":957,"type":1020,"required":1002,"default":377,"description":1021,"note":377,"demo":377},"PtMap\u003CBbTreePtPart, \"expanded\"> | undefined","Passthrough, object form: the same keys as the `pt:*` attributes without the prefix. See the `pt:\u003Cpart>` row.",{"name":1023,"type":1024,"required":1002,"default":377,"description":1025,"note":377,"demo":1026},"pt:\u003Cpart>","PtValue | undefined","Passthrough, attribute form: one attribute per part, `pt:\u003Cpart>`, and per part and state, `pt:\u003Cpart>:\u003Cstate>`. Parts: `item`, `root`. States: `expanded`.","passthrough",[1028],{"name":1006,"type":1007,"note":1029,"demo":570},"The live state, and the only way to change expansion from code — pushing a value opens that node, and the `expanded` flag on an item is ignored after the first sighting. Leaves never appear here, so expand-all is exactly the set of branch identities.",[1031],{"name":1032,"signature":1033,"description":1034,"note":1035,"demo":570},"update:expandedItems","(value: any[]): void","Emitted with the new value whenever `v-model:expandedItems` changes.","Fires with the whole new list on every toggle. Bind the model and treat it as state rather than listening to this directly.",[1037,1041,1045,1049,1052],{"name":1038,"type":1039,"description":1040,"note":377,"demo":652},"\u003Cdepth>","BbTreeNodeSlotProps\u003CMeta>","Every node at one depth (`0` = root); a numeric value can share this name.",{"name":1042,"type":1039,"description":1043,"note":1044,"demo":652},"\u003Cdepth>:children","The children container of every node at one depth.","Renders under leaves too, so guard branch-only markup with `v-if=\"item.children?.length\"`.",{"name":1046,"type":1039,"description":1047,"note":1048,"demo":652},"\u003Cvalue>","One node, by its resolved `item-value` (string or number) through `slotKey`; beats `\u003Cdepth>`, which beats `default`.","The name is the identity in kebab-case: `src\u002Fcomposables` is `#src-composables`, `Order History` is `#order-history`. For accents or punctuation write `#[slotKey('…')]`. A name that does not match raises no warning — the node falls back to `\u003Cdepth>` or `default`.",{"name":1050,"type":1039,"description":1051,"note":377,"demo":652},"\u003Cvalue>:children","One node's children container, stopping the recursion there; beats `\u003Cdepth>:children`. Renders for leaves too.",{"name":437,"type":1039,"description":377,"note":1053,"demo":437},"Renders every node that no `#\u003Cvalue>` or `#\u003Cdepth>` slot claims. Bind `expandProps` to a real `\u003Cbutton>` for branches: it carries `aria-expanded` and the `aria-controls` that pairs with the children container, and a button gets focus and Enter\u002FSpace for free.",[],{"parts":1056,"states":1062},[1057,1060],{"name":1058,"description":1059},"root","The tree.",{"name":495,"description":1061},"One node — a broadcast resolved per node at every depth. Its content is your slot markup, so there is no `icon`.",[1063],{"name":510,"description":1064},"Per node, on `item`: an expanded branch. Leaves count as expanded.",{"removed":1066,"renamed":1083},[1067,1075,1079],{"name":1068,"surface":1069,"replacedBy":1070,"hint":377,"since":1071,"migration":1072,"silent":981,"fix":1073},"\u003Cx>-children","slot","\u003Cx>:children","3.0.0-beta.41","ai\u002Fguides\u002Fmigration\u002Fcomponents\u002Fbb-tree.md",{"kind":1074},"rename",{"name":1076,"surface":957,"replacedBy":1077,"hint":377,"since":377,"migration":1072,"silent":981,"fix":1078},"pt:item:open","pt:item:expanded",{"kind":1074},{"name":1080,"surface":957,"replacedBy":1081,"hint":377,"since":377,"migration":1072,"silent":981,"fix":1082},"pt:root:open","pt:root:expanded",{"kind":1074},[1084,1086,1088],{"from":1068,"to":1070,"surface":1069,"since":1071,"migration":1072,"fix":1085},{"kind":1074},{"from":1076,"to":1077,"surface":957,"since":377,"migration":1072,"fix":1087},{"kind":1074},{"from":1080,"to":1081,"surface":957,"since":377,"migration":1072,"fix":1089},{"kind":1074},1793055147690]