@govbr-ds/webcomponents 2.1.0 → 2.1.1

package/dist/esm/br-collapse_2.entry.js

@@ -0,0 +1,680 @@
+/*!
+ * Construído por SERPRO
+ * © https://serpro.gov.br/ - MIT License.
+ */
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-C2RBydfd.js';
+import { c as redispatchNativeEvent } from './event-DFN_so7I.js';
+import { g as generateUniqueId } from './id-BkS6ujyf.js';
+import { h as hasNamedLightDomSlot } from './slot-BIG-yees.js';
+
+const collapseCss = () => `*,*::before,*::after{box-sizing:border-box}:host{line-height:var(--font-line-height-medium);-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}main{display:block}hr{box-sizing:content-box;height:0;overflow:visible}a{background-color:rgba(0,0,0,0)}b,strong{font-weight:bolder}code{font-family:monospace;font-size:1em}small{font-size:80%}img{border-style:none}button,input,select,textarea{font-family:inherit;font-size:100%;line-height:var(--font-line-height-medium);margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{appearance:none}::-webkit-file-upload-button{appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}.d-none{display:none !important}@media (min-width: 576px){.d-sm-block{display:block !important}.d-sm-flex{display:flex !important}}[data-toggle=dropdown]+*{position:absolute}.dropdown{position:relative}.dropdown [data-toggle=dropdown]+*{box-shadow:var(--surface-shadow-sm);left:0;position:absolute;top:100%}.dropdown>.br-notification{left:auto;right:0}.dropdown .br-item{--color:var(--color-light);--color-rgb:var(--color-light-rgb);--text-color:var(--color-light);--interactive:var(--interactive-light);--interactive-rgb:var(--color-rgb);--visited:var(--visited-light);--hover:var(--hover-light);--pressed:var(--pressed-light);--focus-color:var(--focus-color-light);--focus:var(--focus-color-light);--item-padding-y:var(--spacing-scale-2x);background-color:var(--background-light);color:var(--color)}.dropdown .br-item:not(:last-child){border-bottom:1px solid var(--border-color)}.dropdown .br-item.selected{--color:var(--color-dark);--color-rgb:var(--color-dark-rgb);--text-color:var(--color-dark);--interactive:var(--interactive-dark);--interactive-rgb:var(--interactive-dark-rgb);--visited:var(--visited-dark);--hover:var(--hover-dark);--pressed:var(--pressed-dark);--focus-color:var(--focus-color-dark);--focus:var(--focus-color-dark)}.justify-content-start{justify-content:flex-start !important}.justify-content-end{justify-content:flex-end !important}.justify-content-center{justify-content:center !important}.align-items-center{align-items:center !important}.col,[class*=col-]{padding-left:calc(var(--grid-gutter)*.5);padding-right:calc(var(--grid-gutter)*.5);width:100%}.col{flex:1 0 0%;min-width:8.3333333333%}.col-auto{flex:0 0 auto;width:auto}.col-2{flex-basis:16.6666666667%;max-width:16.6666666667%}.container,.container-fluid,.container-lg{--grid-margin:var(--grid-portrait-margin);--grid-maxwidth:var(--grid-portrait-maxwidth);margin-left:auto;margin-right:auto;max-width:var(--grid-maxwidth);padding-left:var(--grid-margin);padding-right:var(--grid-margin);width:100%}.row{--grid-gutter:var(--grid-portrait-gutter);display:flex;flex-wrap:wrap;margin-left:calc(var(--grid-gutter)*-0.5);margin-right:calc(var(--grid-gutter)*-0.5)}@media (min-width: 576px){.container,.container-lg,.container-fluid{--grid-margin:var(--grid-tablet-margin)}.row{--grid-gutter:var(--grid-tablet-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-sm) - var(--grid-tablet-margin))}}@media (min-width: 992px){.container,.container-lg,.container-fluid{--grid-margin:var(--grid-tablet-margin)}.row{--grid-gutter:var(--grid-tablet-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-md) - var(--grid-tablet-margin))}}@media (min-width: 1280px){.container,.container-lg,.container-fluid{--grid-margin:var(--grid-desktop-margin)}.row{--grid-gutter:var(--grid-desktop-gutter)}.container,.container-lg{--grid-maxwidth:calc(var(--grid-breakpoint-lg) - var(--grid-desktop-margin))}}@media (min-width: 1600px){.container,.container-lg,.container-fluid{--grid-margin:var(--grid-tv-margin)}.row{--grid-gutter:var(--grid-tv-gutter)}.container,.container-lg{--grid-maxwidth:calc(var(--grid-breakpoint-xl) - var(--grid-tv-margin))}}.ease{animation-timing-function:cubic-bezier(0.25, 0.1, 0.25, 1)}.ease-in-out{animation-timing-function:cubic-bezier(0.42, 0, 0.58, 1)}.mt-1{margin-top:var(--spacing-scale-half) !important}.mr-1{margin-right:var(--spacing-scale-half) !important}.mb-1{margin-bottom:var(--spacing-scale-half) !important}.ml-1{margin-left:var(--spacing-scale-half) !important}.mx-3{margin-left:var(--spacing-scale-2x) !important;margin-right:var(--spacing-scale-2x) !important}.mb-4{margin-bottom:var(--spacing-scale-3x) !important}.ml-auto{margin-left:auto !important}.pt-half{padding-top:var(--spacing-scale-half) !important}@media (min-width: 576px){.ml-sm-0{margin-left:var(--spacing-scale-default) !important}}.highlight{background:var(--status-highlight-background) linear-gradient(var(--status-highlight-overlay), var(--status-highlight-overlay));color:var(--status-highlight-text);padding:0 var(--spacing-scale-half)}[disabled],.disabled{cursor:not-allowed;opacity:var(--disabled)}[disabled] *,.disabled *{pointer-events:none}.text-center{text-align:center !important}.text-right{text-align:right !important}.text-nowrap{white-space:nowrap !important}.text-uppercase{text-transform:uppercase !important}.text-bold{font-weight:700 !important}.text-base{font-size:var(--font-size-scale-base) !important}.text-down-01{font-size:var(--font-size-scale-down-01) !important}@media (min-width: 576px){.text-sm-center{text-align:center !important}.text-sm-left{text-align:left !important}.text-sm-right{text-align:right !important}}p{color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-2x);margin-top:0}p a{text-decoration:underline}@media (min-width: 576px){p{font-size:var(--font-size-scale-up-01)}}a{--focus-offset:var(--spacing-scale-half)}a:focus{outline:none}a.focus-visible,a:focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}a:not(:disabled):hover{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}a:not(:disabled):active{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--pressed)), rgba(var(--interactive-rgb), var(--pressed)))}a{color:var(--interactive);text-decoration:none}.main-content a{text-decoration:underline}button{cursor:pointer}img{max-width:100%;vertical-align:middle}h2,.h2{color:var(--color);font-size:var(--font-size-scale-up-03);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-2xh);margin-top:var(--spacing-scale-3xh);padding-bottom:var(--spacing-scale-2xh)}@media (min-width: 576px){.h2,h2{font-size:var(--font-size-scale-up-05);font-weight:var(--font-weight-regular)}}ul,ol{margin-bottom:var(--spacing-scale-2x);margin-top:0;padding:0 0 0 var(--spacing-scale-5x)}table{--table-background:var(--background);--table-color:var(--color);--table-border-color:var(--gray-20);--table-border-style:solid;--table-border-width:1px;--table-hover:var(--color-rgb);--table-padding:var(--spacing-scale-3x);--table-font-weight:var(--font-weight-medium);--table-th-background:var(--background-alternative);--table-th-font-weight:var(--font-weight-semi-bold);--table-row-size:var(--spacing-scale-2x);border-collapse:collapse;width:100%}tr.selected,tr.is-selected{--color:var(--color-dark);--color-rgb:var(--color-dark-rgb);--text-color:var(--color-dark);--interactive:var(--interactive-dark);--interactive-rgb:var(--interactive-dark-rgb);--visited:var(--visited-dark);--hover:var(--hover-dark);--pressed:var(--pressed-dark);--focus-color:var(--focus-color-dark);--focus:var(--focus-color-dark)}label,.label{color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half)}fieldset,.fieldset{border:var(--surface-width-none);margin-bottom:var(--spacing-scale-5x);margin-top:0;padding:0}legend,.legend{color:var(--color);font-size:var(--font-size-scale-up-01);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-2x);margin-top:var(--spacing-scale-2x)}::placeholder,.placeholder{color:var(--color-light);font-size:var(--font-size-scale-base);font-style:italic;font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half);margin-top:var(--spacing-scale-half);opacity:1}input,textarea,.input{color:var(--color-light);font-size:var(--font-size-scale-up-01);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-half)}.help{font-size:var(--font-size-scale-base)}code,.code{background:var(--gray-5);border-radius:4px;color:var(--gray-80);display:inline-block;font-family:monospace;font-size:var(--font-size-scale-base);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-low);padding:var(--spacing-scale-half)}*[data-toggle=collapse]:not(:disabled):hover{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}*[data-toggle=collapse]:focus{outline:none}*[data-toggle=collapse].focus-visible,*[data-toggle=collapse]:focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}:host{display:block;width:100%}:host([color-mode=dark]){--collapse-color:var(--pure-0, #fff);--collapse-hover:rgb(var(--color-rgb), var(--hover));--collapse-border-color:var(--color-secondary-07, #555)}:host([divider]) .br-collapse{border-bottom:1px solid var(--border-color, var(--color-secondary-04, #e5e5e5))}:host .br-collapse{color:var(--collapse-color, var(--color, inherit));border-bottom:1px solid var(--collapse-border-color, var(--border-color, var(--color-secondary-04, #e5e5e5)))}:host .br-collapse .trigger{display:flex;justify-content:center;align-items:center}:host .br-collapse .trigger:not(:disabled):hover,:host .br-collapse .trigger:not(:disabled):focus-visible{background-image:linear-gradient(var(--collapse-hover, rgb(var(--color-rgb), var(--hover))), var(--collapse-hover, rgb(var(--color-rgb), var(--hover))))}:host .br-collapse .trigger-content{flex:1 1 auto !important}:host .br-collapse .content{transition:height .3s;overflow:hidden}:host .br-collapse br-icon{color:var(--interactive);pointer-events:none}:host details{width:100%}:host details summary{list-style:none;display:flex;align-items:center;gap:8px;cursor:pointer;padding:8px 12px;height:48px;outline:none}:host details summary::-webkit-details-marker{display:none}:host details summary:focus-visible{outline:var(--focus-width) var(--focus-style) var(--focus)}:host details.trigger-button summary{width:max-content;min-width:40px;border-radius:var(--surface-border-radius-sm, 4px)}:host details.trigger-text summary{width:max-content;padding-inline:0}:host details.direction-up .content{display:flex;flex-direction:column-reverse}:host details.direction-right,:host details.direction-left{display:flex;align-items:flex-start}:host details.direction-right summary,:host details.direction-left summary{flex:0 0 auto}:host details.direction-right .content,:host details.direction-left .content{flex:1 1 auto;min-width:0}:host details.direction-left{flex-direction:row-reverse}:host .visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;border:0}@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}`;
+
+const Collapse = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.brDidOpen = createEvent(this, "brDidOpen", 7);
+        this.brCollapseOpen = createEvent(this, "brCollapseOpen", 6);
+        this.brDidClose = createEvent(this, "brDidClose", 7);
+        this.brCollapseClose = createEvent(this, "brCollapseClose", 6);
+        this.itemCount = 0;
+        this.suppressNextCustomEvent = false;
+        /**
+         * Identificador único do componente.
+         * Quando omitido, um valor é gerado automaticamente.
+         *
+         * > **Padrão:** valor único gerado por generateUniqueId().
+         *
+         */
+        this.customId = generateUniqueId();
+        /**
+         * Controla se o collapse está aberto.
+         */
+        this.open = false;
+        /**
+         * Indica se o componente possui um divisor (divider) inferior.
+         */
+        this.divider = false;
+        /**
+         * Identifica o grupo de accordion; quando informado, mantém apenas um item aberto por vez entre os irmãos
+         * do mesmo pai imediato.
+         */
+        this.accordionGroup = null;
+        /**
+         * Classe CSS do ícone exibido quando o conteúdo está oculto.
+         */
+        this.iconToShow = 'fa6-solid:chevron-down';
+        /**
+         * Classe CSS do ícone exibido quando o conteúdo está visível.
+         */
+        this.iconToHide = 'fa6-solid:chevron-up';
+        /**
+         * Define a posição do ícone no acionador: 'left' ou 'right'.
+         */
+        this.iconPosition = 'right';
+        /**
+         * Controla se o identificador visual de expansão/retração será renderizado.
+         * @default true
+         */
+        this.useIcons = true;
+        /**
+         * Direção em que o conteúdo é expandido e para a qual o ícone aponta.
+         * @default 'down'
+         */
+        this.expansionDirection = 'down';
+        /** Tema visual do Collapse/Accordion.
+         * @default 'light'
+         */
+        this.colorMode = 'light';
+        /** Forma visual do acionador sem alterar sua semântica nativa.
+         * @default 'surface'
+         */
+        this.triggerVariant = 'surface';
+        /**
+         * Atualiza estado e emite eventos quando o <details> abre ou fecha.
+         */
+        this.handleCollapse = (event) => {
+            const details = event.target;
+            const isOpen = details.open;
+            const suppressCustomEvent = this.suppressNextCustomEvent;
+            this.suppressNextCustomEvent = false;
+            this.open = isOpen;
+            if (!suppressCustomEvent && this.open) {
+                // Fecha outros do mesmo grupo de forma determinística antes de emitir evento
+                this.closeOthersInGroup();
+                this.emitOpen();
+            }
+            else if (!suppressCustomEvent) {
+                this.emitClose();
+            }
+            redispatchNativeEvent(this.el, event, 'toggle');
+        };
+    }
+    /**
+     * Remove o listener do <details> ao desmontar o componente.
+     */
+    disconnectedCallback() {
+        const details = this.el.shadowRoot?.querySelector('details');
+        if (details !== null) {
+            details.removeEventListener('toggle', this.handleCollapse);
+        }
+    }
+    /**
+     * Ajusta o estado inicial do <details> para refletir o valor de open.
+     */
+    componentWillLoad() {
+        this.syncDetailsWithOpen();
+    }
+    componentDidLoad() {
+        this.updateItemCount(this.el.shadowRoot?.querySelector('slot:not([name])'));
+    }
+    updateItemCount(slot) {
+        const count = slot?.assignedElements({ flatten: true }).filter((element) => element.tagName.toLowerCase() === 'br-item')
+            .length ?? 0;
+        if (count !== this.itemCount)
+            this.itemCount = count;
+    }
+    /**
+     * Abre o collapse programaticamente.
+     * @deprecated Atualize a propriedade `open`.
+     */
+    async openCollapse() {
+        const changesNativeState = this.el.shadowRoot?.querySelector('details')?.open !== true;
+        this.open = true;
+        this.suppressNextCustomEvent = changesNativeState;
+        this.syncDetailsWithOpen();
+        // Fecha outros do mesmo grupo antes de emitir evento
+        this.closeOthersInGroup();
+        this.emitOpen();
+    }
+    /**
+     * Fecha o collapse programaticamente.
+     * @deprecated Atualize a propriedade `open`.
+     */
+    async closeCollapse() {
+        const changesNativeState = this.el.shadowRoot?.querySelector('details')?.open === true;
+        this.open = false;
+        this.suppressNextCustomEvent = changesNativeState;
+        this.syncDetailsWithOpen();
+        this.emitClose();
+    }
+    /**
+     * Alterna o estado aberto.
+     * O elemento também redispara o evento nativo `toggle` no host; essa ocorrência é sintética (`isTrusted === false`).
+     */
+    async toggle() {
+        if (this.open)
+            await this.closeCollapse();
+        else
+            await this.openCollapse();
+    }
+    /**
+     * Mantém o estado do <details> alinhado com a prop open.
+     */
+    syncDetailsWithOpen() {
+        const details = this.el.shadowRoot?.querySelector('details');
+        if (details !== null) {
+            details.open = this.open;
+        }
+    }
+    emitOpen() {
+        const detail = { id: this.customId, accordionGroup: this.accordionGroup };
+        this.brDidOpen.emit(detail);
+        this.brCollapseOpen.emit(detail);
+    }
+    emitClose() {
+        const detail = { id: this.customId, accordionGroup: this.accordionGroup };
+        this.brDidClose.emit(detail);
+        this.brCollapseClose.emit(detail);
+    }
+    /**
+     * Fecha outros collapses abertos no mesmo accordion, buscando apenas no pai imediato.
+     */
+    closeOthersInGroup() {
+        if (this.accordionGroup == null || this.accordionGroup === '')
+            return;
+        const parent = this.el.parentElement;
+        if (!parent)
+            return;
+        const others = Array.from(parent.querySelectorAll('br-collapse'));
+        others
+            .filter((collapse) => collapse !== this.el && collapse.accordionGroup === this.accordionGroup && collapse.open)
+            .forEach((c) => {
+            c.open = false;
+        });
+    }
+    /**
+     * Seleciona o ícone conforme o estado atual.
+     */
+    renderIcon() {
+        if (!this.useIcons)
+            return null;
+        return (h("br-icon", { iconName: this.open ? this.iconToHide : this.iconToShow, width: "16", height: "16", "aria-hidden": "true" }));
+    }
+    /**
+     * Renderiza o <details> com acionador e conteúdo expansível.
+     */
+    render() {
+        return (h(Host, { key: '0dbbabeaff8a9f0b4b3149da51e730c9c18b4961' }, h("details", { key: 'dfb43de3589f35d5ebb7a901e93658faf6825e30', class: `br-collapse direction-${this.expansionDirection} trigger-${this.triggerVariant}`, open: this.open, onToggle: this.handleCollapse, id: this.customId, part: "details" }, h("summary", { key: 'd7c1cc7bca44d6cc30bc15f507326b1d00f462df', class: "trigger", part: "trigger", "aria-controls": `content-${this.customId}` }, this.iconPosition === 'left' && this.renderIcon(), h("div", { key: '8d064ef748c9b4afe81637b442df0ddb29e1d402', class: "trigger-content", id: `label-${this.customId}` }, h("slot", { key: '014d443d1b3e010f1b36a85d97430e9322fdaefb', name: "trigger" })), this.iconPosition === 'right' && this.renderIcon()), h("div", { key: '64502ae705a2a4e88ea28bb80e240e938d2cba1c', class: "content", id: `content-${this.customId}`, part: "content", "aria-hidden": String(!this.open) }, this.open && this.itemCount > 0 && (h("div", { key: 'f4a8f0c7aa15c0b9e9cf32de25557f5170842d7f', class: "visually-hidden" }, this.itemCount, " ", this.itemCount === 1 ? 'item' : 'itens', " na lista")), h("slot", { key: 'b15a6c609416ce20ad54d9ffa8f81339a7f7d7a2', onSlotchange: (event) => this.updateItemCount(event.currentTarget) })))));
+    }
+    get el() { return getElement(this); }
+};
+Collapse.style = collapseCss();
+
+const listCss = () => `*,*::before,*::after{box-sizing:border-box}:host{line-height:var(--font-line-height-medium);-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}main{display:block}hr{box-sizing:content-box;height:0;overflow:visible}a{background-color:rgba(0,0,0,0)}b,strong{font-weight:bolder}code{font-family:monospace;font-size:1em}small{font-size:80%}img{border-style:none}button,input,select,textarea{font-family:inherit;font-size:100%;line-height:var(--font-line-height-medium);margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{appearance:none}::-webkit-file-upload-button{appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}.d-none{display:none !important}@media (min-width: 576px){.d-sm-block{display:block !important}.d-sm-flex{display:flex !important}}[data-toggle=dropdown]+*{position:absolute}.dropdown{position:relative}.dropdown [data-toggle=dropdown]+*{box-shadow:var(--surface-shadow-sm);left:0;position:absolute;top:100%}.dropdown>.br-notification{left:auto;right:0}.dropdown .br-item{--color:var(--color-light);--color-rgb:var(--color-light-rgb);--text-color:var(--color-light);--interactive:var(--interactive-light);--interactive-rgb:var(--color-rgb);--visited:var(--visited-light);--hover:var(--hover-light);--pressed:var(--pressed-light);--focus-color:var(--focus-color-light);--focus:var(--focus-color-light);--item-padding-y:var(--spacing-scale-2x);background-color:var(--background-light);color:var(--color)}.dropdown .br-item:not(:last-child){border-bottom:1px solid var(--border-color)}.dropdown .br-item.selected{--color:var(--color-dark);--color-rgb:var(--color-dark-rgb);--text-color:var(--color-dark);--interactive:var(--interactive-dark);--interactive-rgb:var(--interactive-dark-rgb);--visited:var(--visited-dark);--hover:var(--hover-dark);--pressed:var(--pressed-dark);--focus-color:var(--focus-color-dark);--focus:var(--focus-color-dark)}.justify-content-start{justify-content:flex-start !important}.justify-content-end{justify-content:flex-end !important}.justify-content-center{justify-content:center !important}.align-items-center{align-items:center !important}.col,[class*=col-]{padding-left:calc(var(--grid-gutter)*.5);padding-right:calc(var(--grid-gutter)*.5);width:100%}.col{flex:1 0 0%;min-width:8.3333333333%}.col-auto{flex:0 0 auto;width:auto}.col-2{flex-basis:16.6666666667%;max-width:16.6666666667%}.container,.container-fluid,.container-lg{--grid-margin:var(--grid-portrait-margin);--grid-maxwidth:var(--grid-portrait-maxwidth);margin-left:auto;margin-right:auto;max-width:var(--grid-maxwidth);padding-left:var(--grid-margin);padding-right:var(--grid-margin);width:100%}.row{--grid-gutter:var(--grid-portrait-gutter);display:flex;flex-wrap:wrap;margin-left:calc(var(--grid-gutter)*-0.5);margin-right:calc(var(--grid-gutter)*-0.5)}@media (min-width: 576px){.container,.container-lg,.container-fluid{--grid-margin:var(--grid-tablet-margin)}.row{--grid-gutter:var(--grid-tablet-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-sm) - var(--grid-tablet-margin))}}@media (min-width: 992px){.container,.container-lg,.container-fluid{--grid-margin:var(--grid-tablet-margin)}.row{--grid-gutter:var(--grid-tablet-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-md) - var(--grid-tablet-margin))}}@media (min-width: 1280px){.container,.container-lg,.container-fluid{--grid-margin:var(--grid-desktop-margin)}.row{--grid-gutter:var(--grid-desktop-gutter)}.container,.container-lg{--grid-maxwidth:calc(var(--grid-breakpoint-lg) - var(--grid-desktop-margin))}}@media (min-width: 1600px){.container,.container-lg,.container-fluid{--grid-margin:var(--grid-tv-margin)}.row{--grid-gutter:var(--grid-tv-gutter)}.container,.container-lg{--grid-maxwidth:calc(var(--grid-breakpoint-xl) - var(--grid-tv-margin))}}.ease{animation-timing-function:cubic-bezier(0.25, 0.1, 0.25, 1)}.ease-in-out{animation-timing-function:cubic-bezier(0.42, 0, 0.58, 1)}.mt-1{margin-top:var(--spacing-scale-half) !important}.mr-1{margin-right:var(--spacing-scale-half) !important}.mb-1{margin-bottom:var(--spacing-scale-half) !important}.ml-1{margin-left:var(--spacing-scale-half) !important}.mx-3{margin-left:var(--spacing-scale-2x) !important;margin-right:var(--spacing-scale-2x) !important}.mb-4{margin-bottom:var(--spacing-scale-3x) !important}.ml-auto{margin-left:auto !important}.pt-half{padding-top:var(--spacing-scale-half) !important}@media (min-width: 576px){.ml-sm-0{margin-left:var(--spacing-scale-default) !important}}.highlight{background:var(--status-highlight-background) linear-gradient(var(--status-highlight-overlay), var(--status-highlight-overlay));color:var(--status-highlight-text);padding:0 var(--spacing-scale-half)}[disabled],.disabled{cursor:not-allowed;opacity:var(--disabled)}[disabled] *,.disabled *{pointer-events:none}.text-center{text-align:center !important}.text-right{text-align:right !important}.text-nowrap{white-space:nowrap !important}.text-uppercase{text-transform:uppercase !important}.text-bold{font-weight:700 !important}.text-base{font-size:var(--font-size-scale-base) !important}.text-down-01{font-size:var(--font-size-scale-down-01) !important}@media (min-width: 576px){.text-sm-center{text-align:center !important}.text-sm-left{text-align:left !important}.text-sm-right{text-align:right !important}}p{color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-2x);margin-top:0}p a{text-decoration:underline}@media (min-width: 576px){p{font-size:var(--font-size-scale-up-01)}}a{--focus-offset:var(--spacing-scale-half)}a:focus{outline:none}a.focus-visible,a:focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}a:not(:disabled):hover{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}a:not(:disabled):active{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--pressed)), rgba(var(--interactive-rgb), var(--pressed)))}a{color:var(--interactive);text-decoration:none}.main-content a{text-decoration:underline}button{cursor:pointer}img{max-width:100%;vertical-align:middle}h2,.h2{color:var(--color);font-size:var(--font-size-scale-up-03);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-2xh);margin-top:var(--spacing-scale-3xh);padding-bottom:var(--spacing-scale-2xh)}@media (min-width: 576px){.h2,h2{font-size:var(--font-size-scale-up-05);font-weight:var(--font-weight-regular)}}ul,ol{margin-bottom:var(--spacing-scale-2x);margin-top:0;padding:0 0 0 var(--spacing-scale-5x)}table{--table-background:var(--background);--table-color:var(--color);--table-border-color:var(--gray-20);--table-border-style:solid;--table-border-width:1px;--table-hover:var(--color-rgb);--table-padding:var(--spacing-scale-3x);--table-font-weight:var(--font-weight-medium);--table-th-background:var(--background-alternative);--table-th-font-weight:var(--font-weight-semi-bold);--table-row-size:var(--spacing-scale-2x);border-collapse:collapse;width:100%}tr.selected,tr.is-selected{--color:var(--color-dark);--color-rgb:var(--color-dark-rgb);--text-color:var(--color-dark);--interactive:var(--interactive-dark);--interactive-rgb:var(--interactive-dark-rgb);--visited:var(--visited-dark);--hover:var(--hover-dark);--pressed:var(--pressed-dark);--focus-color:var(--focus-color-dark);--focus:var(--focus-color-dark)}label,.label{color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half)}fieldset,.fieldset{border:var(--surface-width-none);margin-bottom:var(--spacing-scale-5x);margin-top:0;padding:0}legend,.legend{color:var(--color);font-size:var(--font-size-scale-up-01);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-2x);margin-top:var(--spacing-scale-2x)}::placeholder,.placeholder{color:var(--color-light);font-size:var(--font-size-scale-base);font-style:italic;font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half);margin-top:var(--spacing-scale-half);opacity:1}input,textarea,.input{color:var(--color-light);font-size:var(--font-size-scale-up-01);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-half)}.help{font-size:var(--font-size-scale-base)}code,.code{background:var(--gray-5);border-radius:4px;color:var(--gray-80);display:inline-block;font-family:monospace;font-size:var(--font-size-scale-base);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-low);padding:var(--spacing-scale-half)}*[data-toggle=collapse]:not(:disabled):hover{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}*[data-toggle=collapse]:focus{outline:none}*[data-toggle=collapse].focus-visible,*[data-toggle=collapse]:focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}.br-list.horizontal{display:flex;flex-wrap:wrap}.br-list.horizontal>.header{flex-grow:1;width:100%}.br-list.horizontal>.header+.br-divider{border-top:1px solid var(--border-color);width:100%}.br-list.horizontal>.br-item+.br-divider,.br-list.horizontal>.group+.br-divider{border-width:0 1px 0 0;width:1px}.br-list.horizontal>.br-item,.br-list.horizontal>.group{flex:1;height:auto;min-height:56px;width:auto}.br-list.horizontal[data-toggle]>.br-item,.br-list.horizontal.toggle>.br-item{display:block}.br-list{background-color:var(--background)}.br-list .br-item{text-align:left;width:100%}.br-list .br-item .fa{text-align:center}.br-list .br-item>.content{align-items:var(--spacing-vertical-top);display:flex}.br-list .br-item>.content>.content{flex:1}.br-list .br-item .content:hover button.br-button{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}.br-list .br-item[data-toggle]{cursor:pointer}.br-list .br-item[data-toggle]~.br-list .br-item{padding:var(--spacing-scale-base) var(--spacing-scale-3x)}.br-list .br-list{overflow:hidden;transition:all 400ms ease-in-out}.br-list .header{align-items:var(--spacing-vertical-center);display:flex;font-size:var(--font-size-scale-base);font-weight:var(--font-weight-bold);justify-content:space-between;padding:var(--spacing-scale-base) var(--spacing-scale-2x)}.br-divider,hr{--divider-size:var(--surface-width-sm);border-color:var(--border-color);border-style:solid;border-width:0;border-top-width:var(--divider-size);display:block}.br-divider.content,hr.content{align-items:center;border:0;display:flex;justify-content:center}.br-divider.content::after,.br-divider.content::before,hr.content::after,hr.content::before{border-color:var(--border-color);border-style:solid;border-width:0;border-top-width:var(--divider-size);content:"";flex:1}.br-divider.content::after,hr.content::after{margin-left:var(--spacing-scale-base)}.br-divider.content::before,hr.content::before{margin-right:var(--spacing-scale-base)}.br-divider.vertical,hr.vertical{align-self:stretch;border-right-width:var(--divider-size);border-top-width:0}.br-divider.vertical.content,hr.vertical.content{flex-direction:column}.br-divider.vertical.content::after,.br-divider.vertical.content::before,hr.vertical.content::after,hr.vertical.content::before{border-right-width:var(--divider-size);border-top-width:0;margin:0}.br-divider.inverted,.br-divider.dark-mode,hr.inverted,hr.dark-mode{--border-color:var(--pure-0)}.br-divider.dashed,hr.dashed{border-style:dashed}.br-divider.sm,hr.sm{--divider-size:var(--surface-width-sm)}hr{--divider-padding:var(--spacing-scale-2x);margin:var(--divider-padding) 0}:host{display:block}:host .br-list.horizontal ::slotted(br-item){flex:1;height:auto;min-height:56px;width:auto}:host .br-list.divider:not(.horizontal) ::slotted(br-item:not(:last-of-type)){border-bottom:1px solid var(--border-color, var(--color-secondary-04, #e5e5e5))}:host .br-list.divider.horizontal ::slotted(br-item:not(:last-of-type)){border-right:1px solid var(--border-color, var(--color-secondary-04, #e5e5e5))}`;
+
+const List = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        /**
+         * Define o texto do cabeçalho da lista.
+         * Quando definido, também é usado como `aria-label` do elemento `role="list"`,
+         * fornecendo um nome acessível que leitores de tela anunciam ao entrar na lista.
+         */
+        this.header = null;
+        /**
+         * Indica se a lista será horizontal. Por padrão, a lista é vertical.
+         * @deprecated Use `orientation`.
+         */
+        this.isHorizontal = false;
+        /**
+         * Identificador único do componente.
+         * Quando omitido, um valor é gerado automaticamente.
+         *
+         * > **Padrão:** valor único gerado por generateUniqueId().
+         *
+         */
+        this.customId = generateUniqueId();
+        /**
+         * Indica que o divider para o título da lista estará oculto.
+         */
+        this.hideHeaderDivider = false;
+        /**
+         * Indica se a lista possui divisores (divider) entre os itens.
+         */
+        this.divider = false;
+        /**
+         * Indica se a lista possui o comportamento de collapse.
+         */
+        this.collapse = false;
+        /**
+         * Indica se a lista possui o comportamento de accordion.
+         * O valor da propriedade define o grupo, ou seja, o accordion é aplicado a todas as listas que possuem o mesmo valor para esta propriedade.
+         */
+        this.accordion = null;
+        /** Semântica do host quando o conteúdo não representa itens de lista. */
+        this.listRole = 'list';
+        /**
+         * Modificador de densidade da lista.
+         */
+        this.density = null;
+        this.observer = null;
+        this.slotElement = null;
+        this.observingNestedContent = false;
+        this.boundKeydown = null;
+        this.mutationFrame = null;
+        this.handleSlotChange = () => {
+            this.syncObserverMode();
+            this.scheduleListSync();
+        };
+        this.renderHeader = () => {
+            if (this.header?.length > 0 || this.hasSlotContent('header')) {
+                return (h("div", { class: !this.hasSlotContent('header') ? 'header' : null, slot: this.collapse || this.accordion ? 'trigger' : null }, h("slot", { name: "header" }, !this.hasSlotContent('header') ? h("div", { class: "title" }, this.header) : null)));
+            }
+            return null;
+        };
+    }
+    async componentDidLoad() {
+        this.boundKeydown = this.handleKeydown.bind(this);
+        this.el.addEventListener('keydown', this.boundKeydown);
+        if (this.effectiveOrientation === 'horizontal') {
+            const slotItems = Array.from(this.el.querySelectorAll('br-item'));
+            slotItems.forEach((item) => {
+                const nextElement = item.nextElementSibling;
+                if (nextElement?.classList.contains('br-divider')) {
+                    const divider = nextElement;
+                    divider.style.borderWidth = '0 1px 0 0';
+                    divider.style.width = '1px';
+                }
+            });
+        }
+        this.applyListItemRoles();
+        this.normalizeIntermediateWrappers();
+        await this.initRovingTabindex();
+        this.slotElement = this.el.shadowRoot?.querySelector('slot:not([name])') ?? null;
+        this.slotElement?.addEventListener('slotchange', this.handleSlotChange);
+        this.syncObserverMode();
+    }
+    disconnectedCallback() {
+        if (this.boundKeydown) {
+            this.el.removeEventListener('keydown', this.boundKeydown);
+            this.boundKeydown = null;
+        }
+        this.observer?.disconnect();
+        this.observer = null;
+        this.slotElement?.removeEventListener('slotchange', this.handleSlotChange);
+        this.slotElement = null;
+        if (this.mutationFrame !== null) {
+            cancelAnimationFrame(this.mutationFrame);
+            this.mutationFrame = null;
+        }
+    }
+    /**
+     * Retorna todos os `br-item` pertencentes diretamente a esta lista, ignorando
+     * itens de listas aninhadas. Usa `TreeWalker` com `FILTER_REJECT` em `br-list`
+     * filhas para evitar contaminar itens internos com `role="listitem"` desta lista pai.
+     */
+    getOwnedItems() {
+        const items = [];
+        const walker = document.createTreeWalker(this.el, NodeFilter.SHOW_ELEMENT, {
+            acceptNode: (node) => {
+                const tag = node.tagName?.toLowerCase();
+                if (node !== this.el &&
+                    (tag === 'br-list' || tag === 'ul' || tag === 'ol' || node.getAttribute?.('role') === 'list')) {
+                    return NodeFilter.FILTER_REJECT;
+                }
+                if (tag === 'br-item' || tag === 'br-footer-item' || tag === 'br-skiplink-item') {
+                    return NodeFilter.FILTER_ACCEPT;
+                }
+                return NodeFilter.FILTER_SKIP;
+            },
+        });
+        let current = walker.nextNode();
+        while (current) {
+            items.push(current);
+            current = walker.nextNode();
+        }
+        return items;
+    }
+    /**
+     * Aplica `role="listitem"` em todos os itens pertencentes a esta lista quando `listRole === 'list'`.
+     * Chamado no `componentDidLoad` e pelo `MutationObserver` para itens adicionados dinamicamente.
+     */
+    applyListItemRoles() {
+        if (this.listRole !== 'list')
+            return;
+        this.getOwnedItems().forEach((item) => {
+            item.setAttribute('role', 'listitem');
+        });
+    }
+    /**
+     * Aplica `role="presentation"` em wrappers intermediários e elementos decorativos sem semântica
+     * entre o `br-list` e seus itens diretos (ex.: `<div>` de layout ou `<span>` divisores).
+     * Sem isso, a relação `list → listitem` exigida pelo WAI-ARIA é quebrada.
+     */
+    normalizeIntermediateWrappers() {
+        for (const child of Array.from(this.el.children)) {
+            this.normalizeWrapperRecursive(child);
+        }
+    }
+    normalizeWrapperRecursive(node) {
+        const tag = node.tagName?.toLowerCase();
+        if (tag === 'br-item' || tag === 'br-footer-item' || tag === 'br-skiplink-item') {
+            return;
+        }
+        // Não interfere em listas aninhadas: elas têm sua própria semântica.
+        if (tag === 'br-list' || tag === 'ul' || tag === 'ol' || node.getAttribute('role') === 'list') {
+            return;
+        }
+        // Slot de cabeçalho não deve ser tratado como wrapper de item.
+        if (node.getAttribute('slot') === 'header') {
+            return;
+        }
+        if (this.listRole === 'list' && !node.hasAttribute('role')) {
+            node.setAttribute('role', 'presentation');
+        }
+        for (const grandChild of Array.from(node.children)) {
+            this.normalizeWrapperRecursive(grandChild);
+        }
+    }
+    /**
+     * Observa mutações no light DOM para manter `role="listitem"` e o roving tabindex
+     * atualizados quando itens são adicionados dinamicamente após o `componentDidLoad`.
+     */
+    mutationHasRelevantItems(mutations) {
+        const itemTags = ['br-item', 'br-footer-item', 'br-skiplink-item'];
+        for (const mutation of mutations) {
+            for (const node of [...Array.from(mutation.addedNodes), ...Array.from(mutation.removedNodes)]) {
+                if (node.nodeType !== Node.ELEMENT_NODE)
+                    continue;
+                const el = node;
+                const tag = el.tagName?.toLowerCase();
+                if (itemTags.includes(tag) || itemTags.some((t) => el.querySelector?.(t))) {
+                    return true;
+                }
+            }
+            if (mutation.type === 'attributes' && itemTags.includes(mutation.target.tagName?.toLowerCase())) {
+                return true;
+            }
+        }
+        return false;
+    }
+    hasNestedSlottedContent() {
+        const itemTags = ['br-item', 'br-footer-item', 'br-skiplink-item'];
+        return (this.slotElement?.assignedElements({ flatten: true }) ?? []).some((element) => {
+            const tag = element.tagName.toLowerCase();
+            return !itemTags.includes(tag) && itemTags.some((itemTag) => element.querySelector(itemTag) !== null);
+        });
+    }
+    scheduleListSync() {
+        if (this.mutationFrame !== null)
+            return;
+        this.mutationFrame = requestAnimationFrame(async () => {
+            this.mutationFrame = null;
+            this.applyListItemRoles();
+            this.normalizeIntermediateWrappers();
+            await this.initRovingTabindex();
+        });
+    }
+    syncObserverMode() {
+        const nested = this.hasNestedSlottedContent();
+        if (this.observer !== null && nested === this.observingNestedContent)
+            return;
+        this.observer?.disconnect();
+        this.observingNestedContent = nested;
+        this.observer = new MutationObserver((mutations) => {
+            if (!this.mutationHasRelevantItems(mutations))
+                return;
+            this.scheduleListSync();
+        });
+        this.observer.observe(this.el, {
+            childList: true,
+            subtree: nested,
+            attributes: true,
+            attributeFilter: ['disabled', 'hidden', 'href', 'is-interactive', 'interactive', 'is-button', 'button', 'style'],
+        });
+    }
+    /**
+     * Implementa o padrão roving tabindex do WAI-ARIA APG.
+     * Apenas o primeiro item habilitado recebe `tabIndex=0`; todos os outros ficam com `tabIndex=-1`.
+     * Isso garante que a lista seja um único tab stop, com navegação interna via teclas de seta.
+     */
+    async initRovingTabindex() {
+        const items = this.getNavigableItems();
+        await Promise.all(items.map((item, index) => item.setTabIndex(index === 0 ? 0 : -1)));
+    }
+    /**
+     * Move o foco para o primeiro item navegável da lista.
+     * API pública para componentes que abrem a lista programaticamente
+     * (ex.: `br-dropdown`), evitando acesso direto ao `br-item`.
+     */
+    async focusFirstItem() {
+        const items = this.getNavigableItems();
+        if (items.length > 0) {
+            await this.focusItem(items[0]);
+        }
+    }
+    /**
+     * Atualiza o roving tabindex após uma navegação, colocando tabIndex=0
+     * no item que recebeu foco e tabIndex=-1 em todos os outros.
+     */
+    async updateRovingTabindex(focusedItem) {
+        const items = this.getNavigableItems();
+        await Promise.all(items.map((item) => item.setTabIndex(item === focusedItem ? 0 : -1)));
+    }
+    /**
+     * Verifica se um item está visível no documento.
+     */
+    isItemVisible(item) {
+        const style = window.getComputedStyle(item);
+        return style.display !== 'none' && style.visibility !== 'hidden';
+    }
+    /**
+     * Indica se o item participa da navegação por teclado (roving tabindex).
+     * Itens puramente de exibição (sem isInteractive/isButton/href) não são
+     * widgets acionáveis e não devem virar tab stop nem ser alcançados por seta.
+     */
+    isFocusableItem(item) {
+        return (item.hasAttribute('is-interactive') ||
+            item.hasAttribute('interactive') ||
+            item.hasAttribute('is-button') ||
+            item.hasAttribute('button') ||
+            item.hasAttribute('href'));
+    }
+    /**
+     * Retorna os br-item navegáveis desta lista, ignorando itens desabilitados,
+     * não-interativos, ocultos e itens pertencentes a listas aninhadas.
+     */
+    getNavigableItems() {
+        const items = [];
+        const walker = document.createTreeWalker(this.el, NodeFilter.SHOW_ELEMENT, {
+            acceptNode: (node) => {
+                const tag = node.tagName?.toLowerCase();
+                if (node !== this.el &&
+                    (tag === 'br-list' || tag === 'ul' || tag === 'ol' || node.getAttribute?.('role') === 'list')) {
+                    return NodeFilter.FILTER_REJECT;
+                }
+                if (tag === 'br-item' && !node.hasAttribute('disabled') && this.isFocusableItem(node)) {
+                    return NodeFilter.FILTER_ACCEPT;
+                }
+                return NodeFilter.FILTER_SKIP;
+            },
+        });
+        let current = walker.nextNode();
+        while (current) {
+            const item = current;
+            if (this.isItemVisible(item)) {
+                items.push(item);
+            }
+            current = walker.nextNode();
+        }
+        return items;
+    }
+    /**
+     * Resolve o elemento com foco atravessando múltiplos níveis de shadow DOM.
+     */
+    getDeepActiveElement(root = document) {
+        let active = root.activeElement;
+        while (active?.shadowRoot?.activeElement) {
+            active = active.shadowRoot.activeElement;
+        }
+        return active;
+    }
+    /**
+     * Sobe a partir de `start` até achar um dos `items`, atravessando limites de shadow root
+     * (via `.host`) em cada nível. Necessário porque `Node.contains()` não atravessa o shadow
+     * boundary de um elemento diferente (ex.: o `<input>` nativo dentro do shadow root de um
+     * `br-checkbox`/`br-radio` aninhado no item) -- sem isso, o foco dentro desses controles
+     * nunca é atribuído ao item correto.
+     */
+    findOwnerItem(start, items) {
+        let node = start;
+        while (node) {
+            if (node instanceof globalThis.Element && items.includes(node)) {
+                return node;
+            }
+            node = node instanceof ShadowRoot ? node.host : node.parentNode;
+        }
+        return null;
+    }
+    getCurrentIndex(items) {
+        const active = this.getDeepActiveElement();
+        const owner = this.findOwnerItem(active, items);
+        return owner ? items.indexOf(owner) : -1;
+    }
+    /**
+     * Indica se o teclado deve ser deixado para o próprio controle (input de texto, textarea,
+     * select), sem ser sequestrado pela navegação por setas/Home/End/Enter/Espaço da lista.
+     * Esses controles têm edição de texto/cursor próprios que a lista não deve sobrepor.
+     *
+     * Checkbox e radio ficam DE FORA deste bypass -- checkbox não tem comportamento nativo de
+     * seta algum (precisa que a lista trate as setas pra navegar entre itens, ver `findOwnerItem`),
+     * e radio já trata suas próprias setas via `defaultPrevented` (seu próprio `@Listen('keydown')`
+     * chama `preventDefault()`, o que o early-return de `handleKeydown` já respeita).
+     */
+    isFormControlTarget(target) {
+        const el = target;
+        const tag = el?.tagName?.toLowerCase();
+        if (!tag)
+            return false;
+        if (tag === 'textarea' || tag === 'select')
+            return true;
+        if (tag === 'input') {
+            const type = (el.type || 'text').toLowerCase();
+            return !['button', 'submit', 'reset', 'image', 'checkbox', 'radio'].includes(type);
+        }
+        return ['br-input', 'br-textarea', 'br-select'].includes(tag);
+    }
+    async focusItem(item) {
+        await this.updateRovingTabindex(item);
+        if ('setFocus' in item) {
+            await item.setFocus();
+        }
+        item.scrollIntoView({
+            behavior: 'smooth',
+            block: 'nearest',
+            inline: 'nearest',
+        });
+    }
+    /**
+     * Trata a navegação por teclado dentro da lista, implementando o padrão
+     * composite widget do WAI-ARIA APG.
+     *
+     * - ArrowDown / ArrowRight (horizontal): próximo item (circular)
+     * - ArrowUp / ArrowLeft (horizontal): item anterior (circular)
+     * - Home / End: primeiro / último item
+     * - Enter / Space: ativa o item com foco via `activate()`
+     *
+     * Usa `composedPath()` para identificar a lista dona do evento,
+     * garantindo que listas aninhadas não processem eventos umas das outras.
+     * Chama `stopPropagation()` em todas as teclas tratadas para evitar
+     * conflito com componentes pai.
+     *
+     * Sai cedo (sem interceptar nada) quando: (a) o evento já foi tratado por um
+     * handler mais interno que chamou `preventDefault()` -- ex.: `br-dropdown` tratando
+     * Enter/Setas nos próprios itens, ou `br-radio` tratando Setas dentro do seu grupo --
+     * evitando double-handling; ou (b) o alvo é um controle de formulário que deve manter
+     * seu próprio comportamento de teclado (ver `isFormControlTarget`).
+     */
+    handleKeydown(event) {
+        const path = event.composedPath();
+        const closestList = path.find((el) => el.tagName?.toLowerCase() === 'br-list');
+        if (closestList !== this.el)
+            return;
+        if (event.defaultPrevented)
+            return;
+        if (this.isFormControlTarget(event.target))
+            return;
+        const items = this.getNavigableItems();
+        if (!items.length)
+            return;
+        let currentIndex = this.getCurrentIndex(items);
+        if (currentIndex === -1)
+            currentIndex = 0;
+        const nextKey = this.isHorizontal ? 'ArrowRight' : 'ArrowDown';
+        const prevKey = this.isHorizontal ? 'ArrowLeft' : 'ArrowUp';
+        let target = null;
+        switch (event.key) {
+            case nextKey:
+                event.preventDefault();
+                event.stopPropagation();
+                target = items[(currentIndex + 1) % items.length];
+                break;
+            case prevKey:
+                event.preventDefault();
+                event.stopPropagation();
+                target = items[(currentIndex - 1 + items.length) % items.length];
+                break;
+            case 'Home':
+                event.preventDefault();
+                event.stopPropagation();
+                target = items[0];
+                break;
+            case 'End':
+                event.preventDefault();
+                event.stopPropagation();
+                target = items[items.length - 1];
+                break;
+            case 'Enter':
+            case ' ': {
+                event.preventDefault();
+                event.stopPropagation();
+                const currentItem = items[currentIndex];
+                if (currentItem && 'activate' in currentItem) {
+                    currentItem.activate();
+                }
+                return;
+            }
+            default:
+                return;
+        }
+        if (target) {
+            void this.focusItem(target);
+        }
+    }
+    getCssClassMap() {
+        return {
+            'br-list': true,
+            horizontal: this.effectiveOrientation === 'horizontal',
+            divider: this.divider,
+            small: this.density === 'small',
+            large: this.density === 'large',
+        };
+    }
+    get effectiveOrientation() {
+        return this.orientation ?? (this.isHorizontal ? 'horizontal' : 'vertical');
+    }
+    /**
+     * Verifica se o slot possui conteúdo.
+     * @param slotName Nome do slot a ser verificado.
+     * @returns true se o slot possui conteúdo, false caso contrário.
+     */
+    hasSlotContent(slotName) {
+        return hasNamedLightDomSlot(this.el, slotName);
+    }
+    renderDivider() {
+        if ((this.header || this.hasSlotContent('header')) && !this.hideHeaderDivider) {
+            return h("div", { class: "br-divider" });
+        }
+        return null;
+    }
+    renderListBody() {
+        return [this.renderHeader(), this.renderDivider(), h("slot", null)];
+    }
+    render() {
+        return (h(Host, { key: '76fc25996edd37644798a525574f4c2d86c04373', role: this.listRole, "aria-label": this.header || null }, h("div", { key: 'be7604b1166c62b28dc12ecddae73b2b38ce3a17', class: this.getCssClassMap(), id: this.customId, part: "container" }, this.accordion || this.collapse ? (h("br-collapse", { "accordion-group": this.accordion || null, divider: this.divider }, this.renderListBody())) : (this.renderListBody()))));
+    }
+    get el() { return getElement(this); }
+};
+List.style = listCss();
+
+export { Collapse as br_collapse, List as br_list };