@govbr-ds/webcomponents 2.1.0 → 2.1.1

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

@@ -0,0 +1,1853 @@
+/*!
+ * 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 { l as listenForExternalBlockingSurface } from './floating-surface-dismiss-BWXfdbQH.js';
+import { F as FloatingUIManager } from './floating-ui-BavFwMnx.js';
+import { g as generateUniqueId } from './id-BkS6ujyf.js';
+import { i as isNil } from './isNil-B-qLmYZC.js';
+import { d as dispatchNativeFormEvent } from './event-DFN_so7I.js';
+import { i as isFormControlDisabled, g as getFormValidationState, s as safeSetFormValue, e as syncNativeFormValidity, r as resolveFormValidator } from './validator-D3tVP32U.js';
+import { h as hasNamedLightDomSlot, a as hasAssignedSlotContent } from './slot-BIG-yees.js';
+import './floating-ui.dom-DIK54tTj.js';
+
+const dropdownCss = () => `*,*::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:inline-block;position:relative}:host #trigger{display:inline-flex;align-items:center;cursor:pointer;outline:none}:host [part=trigger-arrow]{margin-left:var(--spacing-scale-half)}:host #trigger::slotted([slot=trigger]):focus:focus{outline:none}:host #trigger::slotted([slot=trigger]):focus.focus-visible,:host #trigger::slotted([slot=trigger]):focus:focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}:host ::slotted([slot=target] *:focus):focus{outline:none}:host ::slotted([slot=target] *:focus).focus-visible,:host ::slotted([slot=target] *:focus):focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}:host #target{display:none;position:absolute;z-index:var(--z-index-layer-1);box-shadow:var(--surface-shadow-sm);border-radius:0}:host #target:focus:focus{outline:none}:host #target:focus.focus-visible,:host #target:focus:focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}:host([arrow-position=left]) [part=trigger-arrow]{margin-left:0;margin-right:var(--spacing-scale-half)}:host([is-open]) #target{display:block;width:max-content}@media (max-width: 575px){:host([is-open]) #target{width:100vw !important;max-width:100vw !important}}`;
+
+const Dropdown = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.brDidOpen = createEvent(this, "brDidOpen", 7);
+        this.brDidClose = createEvent(this, "brDidClose", 7);
+        this.brDropdownChange = createEvent(this, "brDropdownChange", 7);
+        this.brDropdownOpenChange = createEvent(this, "brDropdownOpenChange", 6);
+        /**
+         * Identificador único do componente.
+         * Quando omitido, um valor é gerado automaticamente.
+         *
+         * > **Padrão:** valor único gerado por generateUniqueId().
+         *
+         * > **Uso compartilhado:** mantenha esta descrição idêntica em todos os componentes que usam `customId`.
+         */
+        this.customId = generateUniqueId();
+        /**
+         * Indica se o dropdown está aberto ou fechado.
+         * Esta propriedade é refletida no DOM e pode ser alterada externamente.
+         * O valor padrão é falso (fechado).
+         */
+        this.isOpen = false;
+        /**
+         * Define o posicionamento do target (alvo) em relação ao trigger (acionador).
+         */
+        this.placement = 'bottom-start';
+        /**
+         * Exibe uma seta ao lado do elemento acionador.
+         * O valor padrão é falso para preservar a apresentação dos triggers existentes.
+         */
+        this.showArrow = false;
+        /**
+         * Define o posicionamento da seta ('left' ou 'right') em relação ao elemento acionador.
+         * O valor padrão é 'right'.
+         */
+        this.arrowPosition = 'right';
+        /**
+         * Define se o dropdown deve permanecer aberto quando outro dropdown é aberto.
+         * Quando definido como false (padrão), o dropdown será fechado automaticamente quando outro dropdown for aberto.
+         * Quando definido como true, o dropdown permanecerá aberto mesmo quando outro dropdown for aberto.
+         */
+        this.preventAutoDismiss = false;
+        /**
+         * Define o z-index do elemento target (alvo) do dropdown.
+         * Permite customizar a ordem de sobreposição do painel dropdown em relação aos demais elementos da página.
+         * O valor padrão utiliza a variável CSS do design system: var(--z-index-layer-1).
+         */
+        this.targetZIndex = 'var(--z-index-layer-1)';
+        /**
+         * Desabilita a interação com o componente.
+         *
+         * > **Uso compartilhado:** mantenha esta descrição idêntica em todos os componentes que usam `disabled`.
+         */
+        this.disabled = false;
+        /**
+         * Método chamado sempre que a propriedade `isOpen` muda.
+         * Emite um evento com o novo estado do dropdown.
+         */
+        this.pendingOpenInit = false;
+        this.clickListenerAttached = false;
+        this.targetElement = null;
+        this.dropdownItems = [];
+        this.dropdownLinks = [];
+        this.focusableElement = null;
+        this.triggerKeydownHandler = (event) => {
+            if (this.disabled)
+                return;
+            if (event.key === 'Enter' || event.key === ' ') {
+                event.preventDefault();
+                this.handleTriggerBehavior(event);
+            }
+            else if (event.key === 'Escape') {
+                event.preventDefault();
+                this.hide();
+                this.focusOnTriggerElement();
+            }
+            else if (event.key === 'ArrowDown' && this.isOpen) {
+                event.preventDefault();
+                this.initializeDropdownItems();
+                if (this.dropdownLinks.length > 0) {
+                    this.focusOnElement(this.dropdownLinks[0]);
+                }
+                else if (this.dropdownItems.length > 0) {
+                    this.focusOnElement(this.dropdownItems[0]);
+                }
+            }
+        };
+        this.targetKeydownHandler = (event) => {
+            if (event.key === 'Escape') {
+                event.preventDefault();
+                this.hide();
+                this.focusOnTriggerElement();
+            }
+        };
+        /**
+         * Alterna o estado do dropdown entre aberto e fechado.
+         */
+        this.toggle = (event) => {
+            if (this.disabled)
+                return;
+            event.stopPropagation();
+            this.isOpen = !this.isOpen;
+        };
+        /**
+         * Handler para eventos de keydown nos itens não-link
+         * Implementa navegação completa por setas, Tab não navega entre estes itens
+         */
+        this.handleItemKeydown = (event) => {
+            const item = event.currentTarget;
+            const key = event.key;
+            const currentIndex = this.dropdownItems.indexOf(item);
+            const lastIndex = this.dropdownItems.length - 1;
+            switch (key) {
+                case 'ArrowUp':
+                    event.preventDefault();
+                    if (currentIndex <= 0) {
+                        this.focusOnElement(this.dropdownItems[lastIndex]);
+                    }
+                    else {
+                        this.focusOnElement(this.dropdownItems[currentIndex - 1]);
+                    }
+                    break;
+                case 'ArrowDown':
+                    event.preventDefault();
+                    if (currentIndex >= lastIndex) {
+                        this.focusOnElement(this.dropdownItems[0]);
+                    }
+                    else {
+                        this.focusOnElement(this.dropdownItems[currentIndex + 1]);
+                    }
+                    break;
+                case 'Home':
+                    event.preventDefault();
+                    this.focusOnElement(this.dropdownItems[0]);
+                    break;
+                case 'End':
+                    event.preventDefault();
+                    this.focusOnElement(this.dropdownItems[lastIndex]);
+                    break;
+                case 'Enter':
+                case ' ':
+                    event.preventDefault();
+                    item.click();
+                    this.hide();
+                    this.focusOnTriggerElement();
+                    break;
+                case 'Tab':
+                    break;
+                case 'Escape':
+                    event.preventDefault();
+                    this.hide();
+                    this.focusOnTriggerElement();
+                    break;
+            }
+        };
+        /**
+         * Handler específico para links
+         */
+        this.handleLinkKeydown = (event) => {
+            const link = event.currentTarget;
+            const key = event.key;
+            const linkIndex = this.dropdownLinks.indexOf(link);
+            const lastLinkIndex = this.dropdownLinks.length - 1;
+            switch (key) {
+                case 'ArrowUp':
+                case 'ArrowDown':
+                case 'Home':
+                case 'End':
+                    event.preventDefault();
+                    event.stopPropagation();
+                    break;
+                case 'Tab':
+                    event.preventDefault();
+                    if (!event.shiftKey) {
+                        if (linkIndex >= lastLinkIndex) {
+                            this.focusOnElement(this.dropdownLinks[0]);
+                        }
+                        else {
+                            this.focusOnElement(this.dropdownLinks[linkIndex + 1]);
+                        }
+                    }
+                    else {
+                        if (linkIndex <= 0) {
+                            this.focusOnElement(this.dropdownLinks[lastLinkIndex]);
+                        }
+                        else {
+                            this.focusOnElement(this.dropdownLinks[linkIndex - 1]);
+                        }
+                    }
+                    break;
+                case 'Enter':
+                case ' ':
+                    if (key === ' ' && link.tagName.toLowerCase() === 'a') {
+                        event.preventDefault();
+                    }
+                    setTimeout(() => this.hide(), 100);
+                    break;
+                case 'Escape':
+                    event.preventDefault();
+                    this.hide();
+                    this.focusOnTriggerElement();
+                    break;
+            }
+        };
+    }
+    isOpenChanged(newValue) {
+        if (newValue) {
+            this.attachClickListener();
+            this.attachOpenListeners();
+            this.brDidOpen.emit({ id: this.customId });
+            this.pendingOpenInit = true;
+        }
+        else {
+            this.detachClickListener();
+            this.detachOpenListeners();
+            this.cleanupPositioning();
+            this.brDidClose.emit({ id: this.customId });
+            if (this.triggerElement !== null && this.triggerElement !== undefined) {
+                this.focusOnTriggerElement();
+            }
+        }
+        this.brDropdownChange.emit({ isOpen: newValue });
+        this.brDropdownOpenChange.emit({ open: newValue });
+    }
+    /**
+     * Aplica o novo valor de z-index ao elemento target.
+     */
+    targetZIndexChanged() {
+        this.updateTargetZIndex();
+    }
+    /**
+     * Evento emitido quando o dropdown é aberto.
+     * Este evento é usado para implementar o auto-dismiss de outros dropdowns.
+     *
+     * @internal
+     */
+    placementChanged() {
+        if (!this.isOpen)
+            return;
+        this.cleanupPositioning();
+        this.positionDropdown();
+    }
+    /**
+     * Fecha o dropdown se for desabilitado enquanto estiver aberto.
+     */
+    disabledChanged(newValue) {
+        if (newValue && this.isOpen) {
+            this.hide();
+        }
+    }
+    connectedCallback() {
+        this.clickHandler = this.onClickOutside.bind(this);
+        this.dropdownOpenHandler = this.onDropdownDidOpen.bind(this);
+        if (this.isOpen)
+            this.attachOpenListeners();
+    }
+    disconnectedCallback() {
+        this.detachClickListener();
+        this.detachOpenListeners();
+        if (this.targetElement !== null && this.targetElement !== undefined) {
+            this.targetElement.removeEventListener('keydown', this.targetKeydownHandler);
+        }
+        this.cleanupPositioning();
+        this.clearDropdownItemListeners();
+    }
+    componentDidLoad() {
+        this.triggerElement = this.el.shadowRoot.querySelector('#trigger');
+        this.targetElement = this.el.shadowRoot.querySelector('#target');
+        this.setBehavior();
+        this.updateTargetZIndex();
+        if (this.isOpen) {
+            this.attachClickListener();
+            this.initializeDropdownItems();
+            this.positionDropdown();
+        }
+    }
+    attachClickListener() {
+        if (this.clickListenerAttached)
+            return;
+        document.addEventListener('click', this.clickHandler);
+        this.clickListenerAttached = true;
+    }
+    detachClickListener() {
+        if (!this.clickListenerAttached)
+            return;
+        document.removeEventListener('click', this.clickHandler);
+        this.clickListenerAttached = false;
+    }
+    attachOpenListeners() {
+        if (!this.isOpen)
+            return;
+        document.addEventListener('brDidOpen', this.dropdownOpenHandler);
+        this.cleanupBlockingSurfaceDismissal ?? (this.cleanupBlockingSurfaceDismissal = listenForExternalBlockingSurface(this.el, () => void this.hide()));
+    }
+    detachOpenListeners() {
+        document.removeEventListener('brDidOpen', this.dropdownOpenHandler);
+        this.cleanupBlockingSurfaceDismissal?.();
+        this.cleanupBlockingSurfaceDismissal = undefined;
+    }
+    componentDidRender() {
+        if (this.isOpen && this.pendingOpenInit) {
+            this.pendingOpenInit = false;
+            this.initializeDropdownItems();
+            this.positionDropdown();
+        }
+    }
+    /**
+     * Esconde o dropdown.
+     * Define a propriedade `isOpen` como falsa e retorna o novo estado.
+     * Este método pode ser chamado externamente.
+     * @deprecated Use `close`.
+     */
+    async hide() {
+        this.isOpen = false;
+        return { isOpen: this.isOpen };
+    }
+    /** Fecha o dropdown e mantém o formato de retorno legado. */
+    async close() {
+        return await this.hide();
+    }
+    /**
+     * Abre o dropdown.
+     * Define a propriedade `isOpen` como verdadeira e retorna o novo estado.
+     * Este método pode ser chamado externamente.
+     */
+    async open() {
+        this.isOpen = true;
+        return { isOpen: this.isOpen };
+    }
+    /**
+     * Define o foco no elemento interno do componente.
+     * Este método pode ser chamado externamente para garantir que o foco seja aplicado ao elemento correto.
+     */
+    async setFocus() {
+        if (this.focusableElement !== null && this.focusableElement !== undefined) {
+            this.focusableElement.focus();
+        }
+        else {
+            this.focusOnTriggerElement();
+        }
+    }
+    /**
+     * Limpa o posicionamento do Floating UI
+     */
+    cleanupPositioning() {
+        this.floatingManager?.stop();
+    }
+    clearDropdownItemListeners() {
+        this.dropdownItems.forEach((item) => {
+            item.removeEventListener('keydown', this.handleItemKeydown);
+        });
+        this.dropdownLinks.forEach((link) => {
+            link.removeEventListener('keydown', this.handleLinkKeydown);
+        });
+        this.dropdownItems = [];
+        this.dropdownLinks = [];
+    }
+    /**
+     * Foca em um elemento específico com suporte a componentes personalizados
+     * @param targetElement Elemento a receber o foco
+     */
+    focusOnElement(targetElement) {
+        if (targetElement && targetElement !== this.el) {
+            if ('setFocus' in targetElement) {
+                targetElement.setFocus();
+            }
+            else {
+                targetElement.focus();
+            }
+            targetElement.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'nearest' });
+        }
+    }
+    /**
+     * Foca no elemento interativo dentro do slot trigger
+     * Esta função procura pelo elemento dentro do slot trigger e aplica o foco nele
+     */
+    focusOnTriggerElement() {
+        const triggerSlot = this.el.shadowRoot.querySelector('slot[name="trigger"]');
+        if (triggerSlot !== null) {
+            const slotElements = triggerSlot.assignedElements();
+            if (slotElements.length > 0) {
+                const firstElement = slotElements[0];
+                if ('setFocus' in firstElement) {
+                    firstElement.setFocus();
+                }
+                else {
+                    firstElement.focus();
+                }
+                firstElement.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'nearest' });
+            }
+            else {
+                this.focusTrigger();
+            }
+        }
+        else {
+            this.focusTrigger();
+        }
+    }
+    /**
+     * Auxiliar para focar no elemento trigger
+     */
+    focusTrigger() {
+        if (typeof this.triggerElement !== 'undefined') {
+            this.triggerElement.focus();
+            this.triggerElement.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'nearest' });
+        }
+    }
+    getCssClassMap() {
+        return {
+            'br-dropdown': true,
+            disabled: this.disabled,
+        };
+    }
+    /**
+     * Lida com o comportamento no trigger
+     */
+    handleTriggerBehavior(event) {
+        if (this.disabled)
+            return;
+        event.preventDefault();
+        this.toggle(event);
+        if (this.isOpen) {
+            setTimeout(() => {
+                this.initializeDropdownItems();
+            }, 0);
+        }
+    }
+    /**
+     * Inicializa os itens do dropdown com comportamentos de navegação com teclado,
+     * separando claramente entre elementos navegáveis por Tab e elementos navegáveis por setas
+     */
+    initializeDropdownItems() {
+        if (this.targetElement === null)
+            return;
+        this.clearDropdownItemListeners();
+        this.targetElement.setAttribute('tabindex', '-1');
+        this.targetElement.focus();
+        const targetSlot = this.el.shadowRoot.querySelector('slot[name="target"]');
+        if (isNil(targetSlot))
+            return;
+        const assignedElements = targetSlot.assignedElements();
+        if (assignedElements.length === 0)
+            return;
+        const nonLinkSelector = 'button, br-button, input, br-input, br-item:not([href]), textarea, br-textarea, select, br-select, details, [tabindex]:not([tabindex="-1"]):not(a[href])';
+        const linkSelector = 'a[href], br-item[href]';
+        assignedElements.forEach((element) => {
+            if (element instanceof HTMLElement) {
+                if (element.matches(linkSelector)) {
+                    this.dropdownLinks.push(element);
+                }
+                else if (element.matches(nonLinkSelector)) {
+                    this.dropdownItems.push(element);
+                }
+            }
+            const linkChildren = Array.from(element.querySelectorAll(linkSelector));
+            this.dropdownLinks = this.dropdownLinks.concat(linkChildren);
+            const nonLinkChildren = Array.from(element.querySelectorAll(nonLinkSelector));
+            this.dropdownItems = this.dropdownItems.concat(nonLinkChildren);
+        });
+        this.dropdownItems.forEach((item) => {
+            item.addEventListener('keydown', this.handleItemKeydown);
+        });
+        this.dropdownLinks.forEach((link) => {
+            link.addEventListener('keydown', this.handleLinkKeydown);
+        });
+        if (this.dropdownLinks.length > 0) {
+            this.focusOnElement(this.dropdownLinks[0]);
+            this.focusableElement = this.dropdownLinks[0];
+        }
+        else if (this.dropdownItems.length > 0) {
+            this.focusOnElement(this.dropdownItems[0]);
+            this.focusableElement = this.dropdownItems[0];
+        }
+    }
+    /**
+     * Método que lida com cliques fora do dropdown.
+     *
+     * @param {MouseEvent} event - O evento de clique que ocorreu.
+     */
+    onClickOutside(event) {
+        if (!this.isOpen)
+            return;
+        const path = event.composedPath();
+        if (this.triggerElement &&
+            this.targetElement &&
+            !path.includes(this.triggerElement) &&
+            !path.includes(this.targetElement)) {
+            this.hide();
+        }
+    }
+    /**
+     * Método que lida com o evento brDidOpen de outros dropdowns
+     * Fecha este dropdown se não for o emissor do evento e preventAutoDismiss=false
+     */
+    onDropdownDidOpen(event) {
+        if (this.preventAutoDismiss) {
+            return;
+        }
+        const customEvent = event;
+        const eventTarget = event.target;
+        const isDropdownEvent = eventTarget?.tagName.toLowerCase() === 'br-dropdown';
+        if (isDropdownEvent && this.isOpen && customEvent.detail.id !== this.customId) {
+            this.hide();
+        }
+    }
+    /**
+     * Posiciona o dropdown usando Floating UI
+     */
+    positionDropdown() {
+        if (this.triggerElement == null || this.targetElement == null)
+            return;
+        this.floatingManager = new FloatingUIManager({
+            triggerElement: this.triggerElement,
+            contentElement: this.targetElement,
+            placement: this.placement,
+            offset: 4,
+        });
+        this.floatingManager.start();
+    }
+    /**
+     * Configura os comportamentos de interação do dropdown
+     */
+    setBehavior() {
+        if (this.triggerElement === null)
+            return;
+        if (this.targetElement !== null) {
+            this.targetElement.addEventListener('keydown', this.targetKeydownHandler);
+        }
+    }
+    /**
+     * Atualiza o z-index do target conforme a propriedade targetZIndex
+     */
+    updateTargetZIndex() {
+        if (this.targetElement === null) {
+            return;
+        }
+        if (this.targetZIndex !== null && this.targetZIndex !== undefined) {
+            this.targetElement.style.zIndex = this.targetZIndex;
+        }
+    }
+    render() {
+        return (h(Host, { key: '695bafe3b8c346f97a0db7360e32ac518ea1502b', "is-open": this.isOpen, placement: this.placement, "prevent-auto-dismiss": this.preventAutoDismiss, disabled: this.disabled, "arrow-position": this.arrowPosition }, h("div", { key: '301507910f180a8e8799df3a3b677f768c3bf50f', class: this.getCssClassMap(), id: this.customId }, h("div", { key: '7eed65fb40a674563a0378271ab8dbf4c3e441ef', id: "trigger", part: "trigger", role: "button", tabIndex: this.disabled ? -1 : 0, onClick: this.disabled ? null : this.toggle, onKeyDown: (e) => (this.disabled ? null : this.triggerKeydownHandler(e)), "aria-controls": "target", "aria-haspopup": "true", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-label": this.ariaLabel || null, "aria-disabled": this.disabled ? 'true' : null }, this.showArrow && this.arrowPosition === 'left' ? (h("br-icon", { iconName: this.isOpen ? 'fa6-solid:caret-up' : 'fa6-solid:caret-down', "aria-hidden": "true", part: "trigger-arrow", width: "16", height: "16" })) : null, h("slot", { key: 'fa3d69c559202120e5f13c37b02fc4f89a4f1063', name: "trigger" }), this.showArrow && this.arrowPosition === 'right' ? (h("br-icon", { iconName: this.isOpen ? 'fa6-solid:caret-up' : 'fa6-solid:caret-down', "aria-hidden": "true", part: "trigger-arrow", width: "16", height: "16" })) : null), h("div", { key: '9071300ed8deeeeaa0f669f825e6eecf1fa96e75', id: "target", part: "target", "aria-hidden": this.isOpen ? 'false' : 'true' }, h("slot", { key: 'c6c7dca48b06b11ab9c97d8e3f76de0a275dfb0d', name: "target" })))));
+    }
+    get el() { return getElement(this); }
+    static get watchers() { return {
+        "isOpen": [{
+                "isOpenChanged": 0
+            }],
+        "targetZIndex": [{
+                "targetZIndexChanged": 0
+            }],
+        "placement": [{
+                "placementChanged": 0
+            }],
+        "disabled": [{
+                "disabledChanged": 0
+            }]
+    }; }
+};
+Dropdown.style = dropdownCss();
+
+const selectCss = () => `*,*::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-select{--select-divider:1px solid var(--color-secondary-04);--select-shadow:var(--surface-shadow-md)}.br-select .br-input input{padding-right:29px;text-overflow:ellipsis}.br-select .br-input input::after{bottom:0;padding:0 5px;position:absolute;right:0}.br-select{max-width:400px;min-width:100px;position:relative}.br-select .br-list{background:var(--bg-color);box-shadow:var(--select-shadow);display:none;margin-top:-2px;max-height:404px;overflow:auto;position:absolute;resize:none;width:100%;z-index:1}.br-select .br-list::-webkit-scrollbar{height:var(--spacing-scale-base);width:var(--spacing-scale-base)}.br-select .br-list::-webkit-scrollbar-track{background:var(--gray-10)}.br-select .br-list::-webkit-scrollbar-thumb{background:var(--gray-30)}.br-select .br-list:hover::-webkit-scrollbar-thumb{background:var(--gray-40)}.br-select .br-list:focus,.br-select .br-list:active{color:var(--color-secondary-09);outline:none}.br-select .br-list:hover::-webkit-scrollbar-thumb{background:var(--color-secondary-07)}.br-select .br-list[expanded]{display:block}.br-select .br-item{--color:var(--color-light);--color-rgb:var(--color-light-rgb);--text-color:var(--color-light);--interactive:var(--interactive-light);--interactive-rgb:var(--interactive-light-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)}.br-select .br-item .content{padding:0}.br-select .br-item .br-checkbox,.br-select .br-item .br-radio{--item-padding-x:var(--spacing-scale-2x);--item-padding-y:var(--spacing-scale-2x)}.br-select .br-item .br-checkbox input:hover:not(:disabled)+label::before,.br-select .br-item .br-radio input:hover:not(:disabled)+label::before{background-image:none}.br-select .br-item .br-checkbox input+label,.br-select .br-item .br-radio input+label{padding-left:calc(var(--checkbox-padding) + var(--checkbox-size) + var(--item-padding-x))}.br-select .br-item .br-radio input+label{color:var(--text-color);display:block;height:auto;min-height:0;padding:var(--item-padding)}.br-select .br-item .br-radio input+label::before,.br-select .br-item .br-radio input+label::after{content:none}.br-select .br-item:not(:last-child){border-bottom:var(--select-divider)}.br-select .br-item:not([disabled]){--focus-offset:calc(var(--spacing-scale-half) * -1)}.br-select .br-item:not([disabled]):focus{outline:none}.br-select .br-item:not([disabled]).focus-visible,.br-select .br-item:not([disabled]):focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}.br-select .br-item:not([disabled]):not(:disabled):hover{background-image:linear-gradient(rgba(var(--color-rgb), var(--hover)), rgba(var(--color-rgb), var(--hover)))}.br-select .br-item.selected,.br-select .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)}.br-select .br-item.selected:focus,.br-select .br-item[selected]:focus{outline:none}.br-select .br-item.selected.focus-visible,.br-select .br-item.selected:focus-visible,.br-select .br-item[selected].focus-visible,.br-select .br-item[selected]:focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}.br-select .br-item.selected:not(:disabled):hover,.br-select .br-item[selected]:not(:disabled):hover{background-image:linear-gradient(rgba(var(--color-rgb), var(--hover)), rgba(var(--color-rgb), var(--hover)))}.br-select .br-item.disabled{line-height:calc(var(--font-line-height-high)*2);padding-left:calc(var(--item-padding) + var(--spacing-scale-base))}.br-select.inverted .br-input,.br-select.inverted .br-input label,.br-select.dark-mode .br-input,.br-select.dark-mode .br-input label{--color:var(--color-dark);--focus-color:var(--focus-color-dark)}:host{display:inline-block}.br-select{min-width:100px;max-width:400px;position:relative}:host([multiple]) .br-select{min-width:200px}`;
+
+let selectId = 0;
+const Select = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.brSelectStateChange = createEvent(this, "brSelectStateChange", 7);
+        this.valueChange = createEvent(this, "valueChange", 7);
+        this.optionHover = createEvent(this, "optionHover", 7);
+        this.brSelectSearch = createEvent(this, "brSelectSearch", 6);
+        this.opened = createEvent(this, "opened", 7);
+        this.closed = createEvent(this, "closed", 7);
+        this.brSelectValidationChange = createEvent(this, "brSelectValidationChange", 7);
+        if (hostRef.$hostElement$["s-ei"]) {
+            this.elementInternals = hostRef.$hostElement$["s-ei"];
+        }
+        else {
+            this.elementInternals = hostRef.$hostElement$.attachInternals();
+            hostRef.$hostElement$["s-ei"] = this.elementInternals;
+        }
+        /**
+         * Remove a borda do input quando o componente não está em foco.
+         *
+         * @default false
+         */
+        this.borderless = false;
+        /**
+         * Desativa toda a interação do select.
+         *
+         * @default false
+         */
+        this.disabled = false;
+        /**
+         * Exibe label e campo na mesma linha.
+         *
+         * @default false
+         * @deprecated Use `inline`.
+         */
+        this.isInline = false;
+        /**
+         * Habilita o modo de seleção múltipla.
+         *
+         * @default false
+         * @deprecated Use `multiple`.
+         */
+        this.isMultiple = false;
+        /**
+         * Mantém a lista aberta depois de uma seleção.
+         *
+         * @default false
+         * @deprecated O comportamento atual usa o fechamento padrão do select; mantenha esta prop
+         * apenas para compatibilidade com integrações legadas.
+         */
+        this.keepOpenOnSelect = false;
+        /**
+         * Define quantas opções ficam visíveis na janela da lista.
+         *
+         * @default 6
+         */
+        this.visibleItems = 6;
+        /**
+         * Informa a altura base de cada opção para o cálculo de virtual scroll.
+         *
+         * @default 40
+         */
+        this.itemHeight = 40;
+        /**
+         * Controla a largura do campo de entrada.
+         *
+         * @type {string}
+         * @example '20rem'
+         */
+        this.inputWidth = undefined;
+        /**
+         * Define quantas opções extras são renderizadas antes e depois da área visível no virtual scroll.
+         *
+         * @default 1
+         */
+        this.overscan = 1;
+        /**
+         * Controla o estado aberto/fechado da lista.
+         *
+         * @default false
+         * @deprecated Use `open`.
+         */
+        this.isOpen = false;
+        /**
+         * Valor público do select baseado nas opções atualmente selecionadas.
+         *
+         * @type {string | string[] | undefined}
+         * @remarks Em modo múltiplo, o valor público é um array de strings.
+         */
+        this.value = '';
+        /**
+         * Texto exibido quando não há seleção.
+         *
+         * @type {string | undefined}
+         */
+        this.placeholder = '';
+        /**
+         * Indica que o preenchimento do select é obrigatório.
+         *
+         * @default false
+         */
+        this.required = false;
+        /**
+         * Rótulo apresentado para a opção de selecionar todos no modo múltiplo.
+         *
+         * @default 'Selecionar todos'
+         */
+        this.selectAllLabel = Select.SELECT_ALL_LABEL;
+        /**
+         * Habilita a filtragem textual das opções por rótulo ou valor.
+         *
+         * @default true
+         */
+        this.filterable = true;
+        /**
+         * Define se as opções são filtradas localmente ou fornecidas por uma busca remota.
+         * Em `remote`, o componente emite `brSelectSearch`; a aplicação deve buscar,
+         * validar e aplicar as opções por `setOptions()`.
+         * @default 'local'
+         */
+        this.searchMode = 'local';
+        /**
+         * Indica que uma busca remota de opções está pendente.
+         * Enquanto ativo, novas opções não podem ser selecionadas; a aplicação
+         * continua responsável por debounce, cancelamento, erros e autenticação.
+         * @default false
+         */
+        this.loading = false;
+        /**
+         * Exibe o ícone de busca no campo de entrada.
+         *
+         * @default false
+         */
+        this.showSearchIcon = false;
+        /**
+         * Rótulo apresentado quando todas as opções já estão selecionadas no modo múltiplo.
+         *
+         * @default 'Desselecionar todos'
+         */
+        this.unselectAllLabel = Select.DESELECT_ALL_LABEL;
+        /**
+         * Opções fornecidas como array ou JSON, além das opções projetadas por slot.
+         *
+         * @deprecated O formato de opções tipado atual é preferível; o formato legado permanece aceito.
+         */
+        this.options = [];
+        /** Identificador público do controle. */
+        this.customId = `br-select-${selectId++}`;
+        /** Quantidade mínima de opções selecionadas no modo múltiplo. */
+        this.minSelections = 0;
+        /** Quantidade máxima de opções selecionadas no modo múltiplo. */
+        this.maxSelections = 0;
+        this.shouldRestoreSelectedOptionOnOpen = false;
+        this.pendingOptions = null;
+        this.slotElement = null;
+        this.handleSlotChange = () => this.syncOptionsFromSlot();
+        this.lastEmittedStateKey = '';
+        this.isStateChangeReady = false;
+        this.isValueChangeReady = false;
+        this.listboxId = `${this.customId}-listbox`;
+        this.activeOptionIndex = -1;
+        this.searchTerm = '';
+        this.formDisabled = false;
+        this.isValidating = false;
+        this.validatorMessage = null;
+        this.hasFeedbackSlot = false;
+        this.hasValidationLoadingSlot = false;
+        this.customValidationMessage = '';
+        this.validationRunId = 0;
+        this.lastAnnouncedOpen = false;
+        this.isApplyingExternalValue = false;
+        this.suppressValueChange = false;
+        this.hasImperativeOptions = false;
+        this.remoteSelectedOptions = new Map();
+        /**
+         * Sincroniza as opções declaradas no slot com a lista interna renderizada.
+         *
+         * @remarks
+         * Esse passo mantém alinhados o estado visual da lista e o texto exibido no input
+         * quando as opções são adicionadas, removidas ou alteradas dinamicamente.
+         */
+        this.syncOptionsFromSlot = (updateDisplayValue = true) => {
+            if (this.hasImperativeOptions)
+                return;
+            const nodes = this.slotElement?.assignedNodes({ flatten: true }) ?? [];
+            const options = nodes.map((n) => this.nodeToOption(n)).filter((o) => Boolean(o));
+            // Envia opções para o br-select-list
+            this.selectListElement?.setOptions(options);
+            if (updateDisplayValue)
+                this.syncDisplayValue(options);
+        };
+    }
+    formDisabledCallback(disabled) {
+        this.formDisabled = disabled;
+    }
+    formResetCallback() {
+        this.validationRunId++;
+        this.validatorMessage = null;
+        this.customValidationMessage = '';
+        this.applySelectedValue(this.initialValue);
+    }
+    formStateRestoreCallback(state) {
+        if (typeof state !== 'string' || state === '')
+            return;
+        try {
+            this.applySelectedValue(JSON.parse(state));
+        }
+        catch {
+            this.applySelectedValue(state);
+        }
+    }
+    componentWillLoad() {
+        this.hasFeedbackSlot = hasNamedLightDomSlot(this.el, 'feedback');
+        this.hasValidationLoadingSlot = hasNamedLightDomSlot(this.el, 'validation-loading');
+        this.setSelectionMode(this.effectiveMultiple);
+        const initialOptions = this.getHostOptions();
+        const propOptions = this.getOptionsProp();
+        if (initialOptions.length === 0 && propOptions.length > 0) {
+            this.pendingOptions = propOptions;
+            this.syncDisplayValue(propOptions);
+        }
+        else {
+            this.syncDisplayValue(initialOptions);
+        }
+        this.initialValue = Array.isArray(this.value) ? [...this.value] : this.value;
+        this.syncFormState();
+    }
+    componentDidLoad() {
+        this.lastEmittedStateKey = this.getStateChangeKey();
+        this.isStateChangeReady = true;
+        this.setSelectionMode(this.effectiveMultiple);
+        // Inicializa sincronização de opções a partir do slot
+        this.slotElement = this.el.shadowRoot?.querySelector('slot:not([name])');
+        if (this.slotElement) {
+            this.syncOptionsFromSlot(false);
+            this.slotElement.addEventListener('slotchange', this.handleSlotChange);
+        }
+        if (this.pendingOptions && this.selectListElement) {
+            this.selectListElement.setOptions(this.pendingOptions);
+            this.pendingOptions = null;
+        }
+        this.isValueChangeReady = true;
+        this.lastAnnouncedOpen = this.effectiveOpen;
+        if (this.effectiveOpen)
+            this.attachBlockingSurfaceListener();
+        this.updateValidity();
+    }
+    disconnectedCallback() {
+        if (this.slotElement) {
+            this.slotElement.removeEventListener('slotchange', this.handleSlotChange);
+            this.slotElement = null;
+        }
+        this.detachBlockingSurfaceListener();
+    }
+    get effectiveMultiple() {
+        return this.multiple ?? this.isMultiple;
+    }
+    get effectiveInline() {
+        return this.inline ?? this.isInline;
+    }
+    get effectiveOpen() {
+        return this.open ?? this.isOpen;
+    }
+    isDisabled() {
+        return isFormControlDisabled(this.disabled, this.formDisabled);
+    }
+    handleDisabledChange(isDisabled) {
+        if (isDisabled && this.effectiveOpen) {
+            this.close();
+            return;
+        }
+        this.emitStateChange();
+    }
+    handleIsOpenChange(isOpen) {
+        if (this.open === undefined)
+            this.syncOpenState(isOpen);
+    }
+    handleFilterableChange(filterable) {
+        if (!filterable) {
+            this.clearSearch();
+        }
+    }
+    handleLoadingChange(loading) {
+        if (this.selectListElement)
+            this.selectListElement.loading = loading;
+    }
+    handleIsMultipleChange(isMultiple) {
+        if (this.multiple === undefined)
+            this.setSelectionMode(isMultiple);
+        this.syncDisplayValue();
+    }
+    handleMultipleChange(multiple) {
+        if (multiple !== undefined)
+            this.setSelectionMode(multiple);
+        this.syncDisplayValue();
+    }
+    handleOpenChange(open) {
+        if (open !== undefined)
+            this.syncOpenState(open);
+    }
+    handleExternalValueChange(value) {
+        if (this.isApplyingExternalValue)
+            return;
+        this.applySelectedValue(value);
+    }
+    handleOptionsChange() {
+        const options = this.getOptionsProp();
+        void this.setOptions(options);
+    }
+    syncOpenState(isOpen) {
+        if (this.lastAnnouncedOpen !== isOpen) {
+            (isOpen ? this.opened : this.closed).emit();
+            this.lastAnnouncedOpen = isOpen;
+        }
+        if (isOpen) {
+            this.attachBlockingSurfaceListener();
+            this.selectInputElement?.flipUp();
+            void this.openListAndRestorePointerFocus();
+        }
+        else {
+            this.detachBlockingSurfaceListener();
+            this.selectInputElement?.flipDown();
+            void this.selectListElement?.close();
+        }
+        this.emitStateChange();
+    }
+    attachBlockingSurfaceListener() {
+        this.cleanupBlockingSurfaceDismissal ?? (this.cleanupBlockingSurfaceDismissal = listenForExternalBlockingSurface(this.el, () => void this.close()));
+    }
+    detachBlockingSurfaceListener() {
+        this.cleanupBlockingSurfaceDismissal?.();
+        this.cleanupBlockingSurfaceDismissal = undefined;
+    }
+    handleSelectInputFocus() {
+        this.activeOptionIndex = -1;
+        if (this.filterable && !this.effectiveOpen) {
+            this.clearSearch();
+            void this.show();
+        }
+    }
+    handleSelectInputValueChange(event) {
+        if (!this.filterable || this.isDisabled())
+            return;
+        const nextSearchTerm = event.detail ?? '';
+        this.searchTerm = nextSearchTerm;
+        this.activeOptionIndex = -1;
+        this.brSelectSearch.emit({ query: nextSearchTerm });
+        /*
+         * A chamada imperativa garante que a transição para string vazia também
+         * alcance a lista interna. Isso evita depender apenas da remoção/atualização
+         * do atributo `search-term` no custom element.
+         */
+        void this.getSelectListController()?.setSearchTerm?.(nextSearchTerm);
+        if (!this.effectiveOpen) {
+            void this.show();
+        }
+    }
+    handleSelectInputActionClick() {
+        this.toggleOpenFromPointer();
+    }
+    handleSelectInputClick() {
+        if (this.filterable) {
+            if (!this.effectiveOpen) {
+                this.shouldRestoreSelectedOptionOnOpen = true;
+                void this.show();
+            }
+            return;
+        }
+        this.toggleOpenFromPointer();
+    }
+    handleSelectOptionStateChange(event) {
+        this.syncSlottedOptionSelection(event.detail);
+        this.rememberRemoteSelections(this.getCurrentOptions());
+        this.syncDisplayValue();
+        this.syncActiveOptionIndex(event.detail);
+        event.stopPropagation();
+        const detail = { selected: event.detail.selected, value: event.detail.value };
+        this.emitStateChange(detail);
+        this.updateValidity();
+        if (!this.keepOpenOnSelect && !this.effectiveMultiple)
+            void this.close();
+        dispatchNativeFormEvent(this.el, 'input');
+        dispatchNativeFormEvent(this.el, 'change');
+    }
+    handleSelectOptionHover(event) {
+        this.optionHover.emit(event.detail);
+    }
+    // biome-ignore lint/complexity/noExcessiveCognitiveComplexity: centraliza a navegação por teclado do componente.
+    async handleKeyDown(event) {
+        if (this.isDisabled())
+            return;
+        const path = this.getEventPath(event);
+        const isFromInput = path.includes(this.selectInputElement);
+        const isFromList = path.includes(this.selectListElement);
+        if (!isFromInput && !isFromList)
+            return;
+        switch (event.key) {
+            case 'ArrowDown':
+                event.preventDefault();
+                await this.openAndFocusBoundary(isFromInput, 1);
+                return;
+            case 'ArrowUp':
+                event.preventDefault();
+                await this.openAndFocusBoundary(isFromInput, -1);
+                return;
+            case 'Home':
+                if (!this.effectiveOpen)
+                    return;
+                event.preventDefault();
+                await this.focusOptionByIndex(0);
+                return;
+            case 'End':
+                if (!this.effectiveOpen)
+                    return;
+                event.preventDefault();
+                await this.focusOptionByIndex(this.getNavigableOptions().length - 1);
+                return;
+            case 'Enter':
+            case ' ':
+                if (isFromInput && this.filterable && event.key === ' ') {
+                    return;
+                }
+                if (isFromList) {
+                    return;
+                }
+                event.preventDefault();
+                if (!this.effectiveOpen) {
+                    await this.show();
+                    await this.focusInitialOption(1);
+                    return;
+                }
+                await this.selectFocusedOption();
+                return;
+            case 'Escape':
+                if (!this.effectiveOpen)
+                    return;
+                event.preventDefault();
+                await this.close();
+                this.activeOptionIndex = -1;
+                await this.selectInputElement?.setFocus?.();
+                return;
+            case 'Tab':
+                if (!this.effectiveOpen)
+                    return;
+                await this.close();
+                this.activeOptionIndex = -1;
+                return;
+            default:
+                return;
+        }
+    }
+    handleWindowClick(ev) {
+        this.handleOutsideClick(ev);
+    }
+    /**
+     * Habilita o select para interação do usuário.
+     *
+     * @returns Uma promise concluída após a atualização do estado.
+     */
+    async enable() {
+        this.disabled = false;
+    }
+    /**
+     * Desabilita o select e impede novas interações.
+     *
+     * @returns Uma promise concluída após a atualização do estado.
+     */
+    async disable() {
+        this.disabled = true;
+    }
+    /**
+     * Abre a lista de opções quando o componente está habilitado.
+     *
+     * @returns Uma promise concluída após a atualização do estado.
+     */
+    async show() {
+        if (this.isDisabled())
+            return;
+        if (this.open !== undefined)
+            this.open = true;
+        else
+            this.isOpen = true;
+    }
+    /**
+     * Fecha a lista de opções quando o componente está habilitado.
+     *
+     * @returns Uma promise concluída após a atualização do estado.
+     */
+    async close() {
+        if (this.isDisabled())
+            return;
+        if (this.open !== undefined)
+            this.open = false;
+        else
+            this.isOpen = false;
+        this.clearSearch();
+    }
+    /**
+     * Alterna entre os estados aberto e fechado do select.
+     *
+     * @returns {Promise<void>} Uma promise concluída após a atualização do estado.
+     */
+    async toggleOpen() {
+        if (this.isDisabled())
+            return;
+        if (this.open !== undefined)
+            this.open = !this.open;
+        else
+            this.isOpen = !this.isOpen;
+    }
+    /**
+     * Limpa a seleção atual.
+     *
+     * @deprecated Use `setValue('')` ou a API de formulário.
+     */
+    async clear() {
+        await this.setValue(this.effectiveMultiple ? [] : '');
+    }
+    /**
+     * Retorna o valor público atual.
+     *
+     * @deprecated Leia a propriedade `value` diretamente.
+     */
+    async getValue() {
+        return this.value ?? (this.effectiveMultiple ? [] : '');
+    }
+    /**
+     * Define o valor público do select.
+     *
+     * @deprecated Atribua a propriedade `value` diretamente.
+     */
+    async setValue(value) {
+        this.applySelectedValue(value);
+    }
+    /**
+     * Move o foco para o campo interno.
+     *
+     * @deprecated Use o foco nativo do componente quando possível.
+     */
+    async setFocus() {
+        await this.selectInputElement?.setFocus?.();
+    }
+    async checkValidity() {
+        return this.elementInternals?.checkValidity?.() ?? true;
+    }
+    async reportValidity() {
+        return this.elementInternals?.reportValidity?.() ?? true;
+    }
+    async setCustomValidity(message) {
+        this.customValidationMessage = message;
+        this.updateValidity();
+    }
+    async getValidationState() {
+        return getFormValidationState(this.elementInternals);
+    }
+    async validate() {
+        const validator = this.resolveValidator();
+        if (!validator || this.isDisabled())
+            return this.checkValidity();
+        const runId = ++this.validationRunId;
+        this.isValidating = true;
+        this.validatorMessage = null;
+        this.updateValidity();
+        this.brSelectValidationChange.emit({ validating: true, valid: null, message: null });
+        let message = null;
+        try {
+            const currentValue = this.effectiveMultiple
+                ? [...(Array.isArray(this.value) ? this.value : [])]
+                : String(this.value ?? '');
+            message = (await validator(currentValue)) || null;
+        }
+        catch {
+            message = 'Não foi possível validar a seleção.';
+        }
+        if (runId !== this.validationRunId)
+            return false;
+        this.validatorMessage = message;
+        this.isValidating = false;
+        this.updateValidity();
+        const valid = message === null && (await this.checkValidity());
+        this.brSelectValidationChange.emit({ validating: false, valid, message });
+        return valid;
+    }
+    /**
+     * Substitui a coleção atual de opções por uma nova lista.
+     *
+     * @param options Opções que devem ser exibidas pela lista interna.
+     * Em `search-mode="remote"`, a seleção atual é preservada mesmo quando não
+     * aparece na resposta recebida.
+     * @returns Uma promise concluída após a sincronização das opções.
+     */
+    async setOptions(options) {
+        this.hasImperativeOptions = true;
+        const nextOptions = this.searchMode === 'remote' ? this.applyRemoteSelection(options) : options;
+        this.suppressValueChange = true;
+        try {
+            if (this.selectListElement) {
+                await this.selectListElement.setOptions(nextOptions);
+            }
+            else {
+                this.pendingOptions = nextOptions;
+            }
+            this.syncDisplayValue(nextOptions);
+        }
+        finally {
+            this.suppressValueChange = false;
+        }
+    }
+    /**
+     * Adiciona ou atualiza uma única opção na coleção interna.
+     *
+     * @param option Opção que deve ser inserida ou atualizada.
+     * @returns Uma promise concluída após a sincronização da opção.
+     */
+    async setOption(option) {
+        this.hasImperativeOptions = true;
+        if (this.selectListElement) {
+            await this.selectListElement.setOption(option);
+        }
+        else if (this.pendingOptions) {
+            const index = this.pendingOptions.findIndex((currentOption) => currentOption.value === option.value);
+            if (index !== -1)
+                this.pendingOptions[index] = option;
+            else
+                this.pendingOptions.push(option);
+        }
+        else {
+            this.pendingOptions = [option];
+        }
+        this.syncDisplayValue();
+    }
+    getHostOptions() {
+        return Array.from(this.el.childNodes)
+            .map((node) => this.nodeToOption(node))
+            .filter((option) => Boolean(option));
+    }
+    nodeToOption(node) {
+        if (node.nodeType === Node.ELEMENT_NODE)
+            return this.elementToOption(node);
+        if (node.nodeType === Node.TEXT_NODE)
+            return this.textNodeToOption(node);
+        return null;
+    }
+    elementToOption(el) {
+        if (el.tagName.toLowerCase() === 'br-select-option')
+            return this.optionElementToData(el);
+        const text = (el.textContent || '').trim();
+        return text ? { value: text, label: text } : null;
+    }
+    textNodeToOption(textNode) {
+        const text = (textNode.textContent || '').trim();
+        return text ? { value: text, label: text } : null;
+    }
+    optionElementToData(el) {
+        const rawValue = el.getAttribute('value') ?? el.value ?? '';
+        const rawLabel = el.getAttribute('label') ?? el.label ?? '';
+        let value = String(rawValue || '').trim();
+        let label = String(rawLabel || '').trim();
+        const selected = el.hasAttribute('selected') || Boolean(el.selected);
+        if (!value) {
+            const inner = this.extractInnerTextFromOption(el);
+            if (inner)
+                value = inner.trim();
+        }
+        if (!label)
+            label = value;
+        return { value: value || '', label: label || undefined, selected };
+    }
+    extractInnerTextFromOption(el) {
+        const fromSlot = this.getAssignedSlotText(el);
+        if (fromSlot)
+            return fromSlot;
+        const fallback = (el.textContent || '').trim();
+        return fallback || null;
+    }
+    getAssignedSlotText(el) {
+        try {
+            const innerSlot = el.shadowRoot?.querySelector('slot:not([name])');
+            if (!innerSlot?.assignedNodes)
+                return null;
+            const text = innerSlot
+                .assignedNodes({ flatten: true })
+                .map((node) => (node.textContent || '').trim())
+                .filter(Boolean)
+                .join(' ')
+                .trim();
+            return text || null;
+        }
+        catch (_e) {
+            return null;
+        }
+    }
+    getOptionLabel(option) {
+        return (option.label ?? option.value).trim();
+    }
+    getDisplayValue(options = this.getCurrentOptions()) {
+        const selectedOptions = options.filter((option) => {
+            if (!option.selected)
+                return false;
+            const optionLabel = this.getOptionLabel(option);
+            return !this.isSelectAllLabel(optionLabel);
+        });
+        if (selectedOptions.length === 0)
+            return '';
+        if (!this.effectiveMultiple) {
+            return this.getOptionLabel(selectedOptions[0]);
+        }
+        const [firstSelected, ...otherSelected] = selectedOptions;
+        const firstLabel = this.getOptionLabel(firstSelected);
+        if (otherSelected.length === 0)
+            return firstLabel;
+        return `${firstLabel} + (${otherSelected.length})`;
+    }
+    syncDisplayValue(options) {
+        const resolvedOptions = this.getFormOptions(options ?? this.getCurrentOptions());
+        this.displayValue = this.getDisplayValue(resolvedOptions);
+        this.syncValue(resolvedOptions);
+    }
+    syncValue(options) {
+        const nextValue = this.getSerializedValue(options);
+        this.syncFormState(options);
+        if (this.value === nextValue)
+            return;
+        this.isApplyingExternalValue = true;
+        this.value = nextValue;
+        this.isApplyingExternalValue = false;
+        if (!this.isValueChangeReady || this.suppressValueChange)
+            return;
+        this.valueChange.emit(Array.isArray(nextValue) ? nextValue.join(',') : nextValue);
+    }
+    getSerializedValue(options) {
+        const selectedValues = options
+            .filter((option) => {
+            if (!option.selected)
+                return false;
+            const optionLabel = this.getOptionLabel(option);
+            return !this.isSelectAllLabel(optionLabel);
+        })
+            .map((option) => option.value);
+        if (this.effectiveMultiple)
+            return selectedValues;
+        if (selectedValues.length === 0)
+            return '';
+        return selectedValues[0];
+    }
+    getOptionsProp() {
+        if (Array.isArray(this.options))
+            return this.options;
+        try {
+            const parsed = JSON.parse(this.options || '[]');
+            return Array.isArray(parsed) ? parsed : [];
+        }
+        catch {
+            return [];
+        }
+    }
+    applySelectedValue(value) {
+        const currentOptions = this.getCurrentOptions();
+        const options = currentOptions.map((option) => ({
+            ...option,
+            selected: this.effectiveMultiple ? Array.isArray(value) && value.includes(option.value) : value === option.value,
+        }));
+        this.isApplyingExternalValue = true;
+        if (this.selectListElement)
+            void this.selectListElement.setOptions(options);
+        else
+            this.pendingOptions = options;
+        this.value = value;
+        this.isApplyingExternalValue = false;
+        this.remoteSelectedOptions.clear();
+        this.rememberRemoteSelections(options);
+        if (this.searchMode === 'remote') {
+            const selectedValues = new Set(Array.isArray(value) ? value : [value ?? '']);
+            selectedValues.forEach((selectedValue) => {
+                if (selectedValue && !currentOptions.some((option) => option.value === selectedValue)) {
+                    this.remoteSelectedOptions.set(selectedValue, {
+                        value: selectedValue,
+                        label: selectedValue,
+                        selected: true,
+                    });
+                }
+            });
+            this.syncDisplayValue(this.getCurrentOptions());
+            return;
+        }
+        this.syncDisplayValue(options);
+    }
+    applyRemoteSelection(options) {
+        this.rememberRemoteSelections(this.getCurrentOptions());
+        const selectedValues = new Set(Array.isArray(this.value) ? this.value : [this.value ?? '']);
+        const nextOptions = options.map((option) => ({
+            ...option,
+            selected: selectedValues.has(option.value) || Boolean(option.selected),
+        }));
+        this.rememberRemoteSelections(nextOptions);
+        return nextOptions;
+    }
+    rememberRemoteSelections(options) {
+        if (this.searchMode !== 'remote')
+            return;
+        const visibleValues = new Set(options.map((option) => option.value));
+        options.forEach((option) => {
+            if (option.selected)
+                this.remoteSelectedOptions.set(option.value, { ...option, selected: true });
+            else if (visibleValues.has(option.value))
+                this.remoteSelectedOptions.delete(option.value);
+        });
+    }
+    getFormOptions(options) {
+        if (this.searchMode !== 'remote')
+            return options;
+        const result = options.map((option) => ({ ...option }));
+        const existingValues = new Set(result.map((option) => option.value));
+        this.remoteSelectedOptions.forEach((option, value) => {
+            if (!existingValues.has(value))
+                result.push({ ...option, selected: true });
+        });
+        return result;
+    }
+    syncFormState(options = this.getCurrentOptions()) {
+        const selected = this.getFormOptions(options).filter((option) => option.selected && !this.isSelectAllLabel(this.getOptionLabel(option)));
+        const selectedValues = selected.map((option) => option.value);
+        const formValue = this.effectiveMultiple ? JSON.stringify(selectedValues) : (selectedValues[0] ?? null);
+        safeSetFormValue(this.elementInternals, formValue);
+        if (this.nativeSelect) {
+            this.nativeSelect.value = selectedValues[0] ?? '';
+            const selectedSet = new Set(selectedValues);
+            const optionNodes = Array.from(this.nativeSelect.options);
+            selectedSet.forEach((value) => {
+                if (optionNodes.some((option) => option.value === value))
+                    return;
+                const option = document.createElement('option');
+                option.value = value;
+                this.nativeSelect?.append(option);
+            });
+            optionNodes.forEach((option) => {
+                if (option.value !== '' && !selectedSet.has(option.value))
+                    option.remove();
+                else
+                    option.selected = selectedSet.has(option.value);
+            });
+            this.nativeSelect.value = selectedValues[0] ?? '';
+        }
+        this.updateValidity();
+    }
+    updateValidity() {
+        if (!this.nativeSelect)
+            return;
+        const selectedCount = this.getFormOptions(this.getCurrentOptions()).filter((option) => option.selected).length;
+        const selectionMessage = this.effectiveMultiple && this.minSelections > 0 && selectedCount < this.minSelections
+            ? `Selecione pelo menos ${this.minSelections} opções.`
+            : this.effectiveMultiple && this.maxSelections > 0 && selectedCount > this.maxSelections
+                ? `Selecione no máximo ${this.maxSelections} opções.`
+                : '';
+        this.nativeSelect.setCustomValidity(this.customValidationMessage || this.validatorMessage || selectionMessage);
+        syncNativeFormValidity(this.elementInternals, this.nativeSelect);
+    }
+    resolveValidator() {
+        return resolveFormValidator(this.validator);
+    }
+    getRenderedDisplayValue() {
+        return this.displayValue ?? this.getDisplayValue();
+    }
+    /**
+     * Retorna o id da opção atualmente ativa para consumo do `aria-activedescendant`.
+     *
+     * @returns O id da opção ativa ou `undefined` quando a lista está fechada.
+     */
+    getActiveDescendant() {
+        if (!this.effectiveOpen || this.activeOptionIndex < 0)
+            return undefined;
+        return `${this.listboxId}-option-${this.activeOptionIndex}`;
+    }
+    toggleOpenFromPointer() {
+        if (!this.effectiveOpen) {
+            this.shouldRestoreSelectedOptionOnOpen = true;
+        }
+        void this.toggleOpen();
+    }
+    async openListAndRestorePointerFocus() {
+        await this.selectListElement?.open();
+        if (!this.shouldRestoreSelectedOptionOnOpen)
+            return;
+        this.shouldRestoreSelectedOptionOnOpen = false;
+        await this.scrollFirstSelectedOptionToTop();
+    }
+    async scrollFirstSelectedOptionToTop() {
+        const options = this.getNavigableOptions();
+        const firstSelectedIndex = options.findIndex((option) => !this.isSelectAllLabel(this.getOptionLabel(option)) && Boolean(option.selected));
+        if (firstSelectedIndex < 0)
+            return;
+        const didScroll = await this.getSelectListController()?.scrollFirstSelectedOptionToTop?.();
+        if (didScroll) {
+            this.activeOptionIndex = firstSelectedIndex;
+        }
+    }
+    async openAndFocusBoundary(fromInput, direction) {
+        if (!this.effectiveOpen) {
+            await this.show();
+            await this.focusInitialOption(direction);
+            return;
+        }
+        if (fromInput && this.activeOptionIndex < 0) {
+            await this.focusInitialOption(direction);
+            return;
+        }
+        await this.moveActiveOption(direction);
+    }
+    /**
+     * Define qual opção deve receber foco ao abrir o select pelo teclado.
+     *
+     * @param direction Direção inicial da navegação. `1` abre do topo para baixo e `-1` do fim para cima.
+     */
+    async focusInitialOption(direction) {
+        const options = this.getNavigableOptions();
+        if (options.length === 0)
+            return;
+        const selectedIndex = options.findIndex((option) => Boolean(option.selected));
+        const fallbackIndex = direction > 0 ? 0 : options.length - 1;
+        const initialIndex = selectedIndex >= 0 ? selectedIndex : fallbackIndex;
+        await this.focusOptionByIndex(initialIndex);
+    }
+    async moveActiveOption(step) {
+        const options = this.getNavigableOptions();
+        if (options.length === 0)
+            return;
+        const baseIndex = this.getCurrentActiveIndex();
+        const nextIndex = Math.min(options.length - 1, Math.max(0, baseIndex + step));
+        await this.focusOptionByIndex(nextIndex);
+    }
+    /**
+     * Resolve o índice ativo atual a partir do estado local ou da opção já selecionada.
+     *
+     * @returns O índice que deve servir como base para a próxima navegação por teclado.
+     */
+    getCurrentActiveIndex() {
+        if (this.activeOptionIndex >= 0)
+            return this.activeOptionIndex;
+        const options = this.getNavigableOptions();
+        const selectedIndex = options.findIndex((option) => Boolean(option.selected));
+        return selectedIndex >= 0 ? selectedIndex : 0;
+    }
+    /**
+     * Encaminha o foco lógico para uma opção específica da lista interna.
+     *
+     * @param index Índice da opção que deve receber foco.
+     */
+    async focusOptionByIndex(index) {
+        const didFocus = await this.getSelectListController()?.focusOption?.(index);
+        if (didFocus) {
+            this.activeOptionIndex = index;
+        }
+    }
+    /**
+     * Seleciona a opção atualmente ativa sem duplicar a lógica de seleção da lista.
+     *
+     * @remarks
+     * Em modo simples, a opção ativa é sempre marcada. Em modo múltiplo, a seleção é alternada.
+     */
+    async selectFocusedOption() {
+        const options = this.getNavigableOptions();
+        if (options.length === 0)
+            return;
+        const index = this.getCurrentActiveIndex();
+        const option = options[index];
+        const nextSelected = this.effectiveMultiple ? !option?.selected : true;
+        const didSelect = await this.getSelectListController()?.setOptionSelected?.(index, nextSelected);
+        if (didSelect) {
+            this.activeOptionIndex = index;
+        }
+    }
+    syncActiveOptionIndex(detail) {
+        const options = this.getNavigableOptions();
+        const optionIndex = options.findIndex((option) => option.value === detail.value);
+        if (optionIndex >= 0) {
+            this.activeOptionIndex = optionIndex;
+        }
+    }
+    /**
+     * Reflete no slot a seleção que foi consolidada pela lista interna.
+     *
+     * @param detail Estado emitido pela opção que disparou a mudança.
+     * @remarks
+     * Essa sincronização mantém as props/atributos das opções declaradas pelo consumidor em
+     * conformidade com o estado calculado internamente, inclusive no caso do "selecionar todos".
+     */
+    syncSlottedOptionSelection(detail) {
+        if (!this.slotElement || !detail?.value)
+            return;
+        const slottedOptions = this.slotElement
+            .assignedElements({ flatten: true })
+            .filter((el) => el.tagName.toLowerCase() === 'br-select-option');
+        if (slottedOptions.length === 0)
+            return;
+        const detailLabel = (detail.label ?? detail.value).trim();
+        const isSelectAll = this.isSelectAllLabel(detailLabel);
+        if (this.effectiveMultiple && isSelectAll) {
+            slottedOptions.forEach((option) => {
+                const optionLabel = (option.label ?? option.value).trim();
+                const isSelectAllOption = this.isSelectAllLabel(optionLabel);
+                if (isSelectAllOption) {
+                    option.indeterminate = false;
+                    option.selected = Boolean(detail.selected);
+                    this.normalizeSelectAllState(option);
+                    if (option.selected)
+                        option.setAttribute('selected', '');
+                    else
+                        option.removeAttribute('selected');
+                    return;
+                }
+                option.selected = Boolean(detail.selected);
+                if (option.selected)
+                    option.setAttribute('selected', '');
+                else
+                    option.removeAttribute('selected');
+            });
+            return;
+        }
+        slottedOptions.forEach((option) => {
+            const isTarget = option.value === detail.value;
+            const nextSelected = this.effectiveMultiple ? (isTarget ? Boolean(detail.selected) : option.selected) : isTarget;
+            if (isTarget) {
+                option.indeterminate = false;
+            }
+            option.selected = nextSelected;
+            if (nextSelected) {
+                option.setAttribute('selected', '');
+            }
+            else {
+                option.removeAttribute('selected');
+            }
+            if (!this.effectiveMultiple && !isTarget) {
+                option.selected = false;
+                option.removeAttribute('selected');
+            }
+        });
+        if (!this.effectiveMultiple)
+            return;
+        const selectableOptions = slottedOptions.filter((option) => {
+            const optionLabel = (option.label ?? option.value).trim();
+            return !this.isSelectAllLabel(optionLabel);
+        });
+        const allSelected = selectableOptions.length > 0 && selectableOptions.every((option) => Boolean(option.selected));
+        const anySelected = selectableOptions.some((option) => Boolean(option.selected));
+        slottedOptions.forEach((option) => {
+            const optionLabel = (option.label ?? option.value).trim();
+            if (!this.isSelectAllLabel(optionLabel))
+                return;
+            option.indeterminate = anySelected && !allSelected;
+            option.selected = allSelected;
+            this.normalizeSelectAllState(option);
+            if (option.selected)
+                option.setAttribute('selected', '');
+            else
+                option.removeAttribute('selected');
+        });
+    }
+    isSelectAllLabel(label) {
+        return label === this.selectAllLabel || label === this.unselectAllLabel;
+    }
+    getSelectAllLabel(selected, indeterminate) {
+        return selected && !indeterminate ? this.unselectAllLabel : this.selectAllLabel;
+    }
+    normalizeSelectAllState(option) {
+        const selected = Boolean(option.selected) && !option.indeterminate;
+        const indeterminate = Boolean(option.indeterminate);
+        option.selected = selected;
+        option.indeterminate = indeterminate;
+        option.label = this.getSelectAllLabel(selected, indeterminate);
+    }
+    handleOutsideClick(ev) {
+        if (!this.effectiveOpen)
+            return;
+        const clickPath = this.getEventPath(ev);
+        const isClickInsideSelect = clickPath.includes(this.el);
+        if (isClickInsideSelect)
+            return;
+        this.close();
+    }
+    emitStateChange(option) {
+        const payload = this.getStateChangeDetail(option);
+        const nextStateKey = JSON.stringify(payload);
+        if (!this.isStateChangeReady) {
+            this.lastEmittedStateKey = nextStateKey;
+            return;
+        }
+        if (this.lastEmittedStateKey === nextStateKey)
+            return;
+        this.lastEmittedStateKey = nextStateKey;
+        this.brSelectStateChange.emit(payload);
+    }
+    getStateChangeDetail(optionChange) {
+        const payload = {
+            isOpen: this.effectiveOpen,
+        };
+        const currentOptions = this.getFormOptions(this.getCurrentOptions());
+        if (this.effectiveMultiple) {
+            payload.options = currentOptions
+                .filter((option) => !this.isSelectAllLabel((option.label ?? option.value).trim()))
+                .map((option) => this.normalizeOptionForOutput(option));
+            return payload;
+        }
+        const selectedOption = currentOptions.find((option) => Boolean(option.selected));
+        if (selectedOption) {
+            payload.option = this.normalizeOptionForOutput(selectedOption);
+            return payload;
+        }
+        if (optionChange?.value) {
+            const { disabled: _disabled, ...normalizedOption } = optionChange;
+            payload.option = {
+                ...normalizedOption,
+                label: optionChange.label ?? optionChange.value,
+            };
+        }
+        return payload;
+    }
+    normalizeOptionForOutput(option) {
+        const optionLabel = (option.label ?? option.value).trim();
+        const isSelectAll = this.isSelectAllLabel(optionLabel);
+        const { disabled: _disabled, ...optionWithoutDisabled } = option;
+        if (isSelectAll) {
+            return optionWithoutDisabled;
+        }
+        const { indeterminate, ...normalized } = optionWithoutDisabled;
+        return normalized;
+    }
+    getStateChangeKey() {
+        return JSON.stringify(this.getStateChangeDetail());
+    }
+    /**
+     * Obtém o snapshot atual das opções respeitando a fonte mais atual disponível.
+     *
+     * @returns A coleção de opções normalizadas para leitura do estado público.
+     * @remarks
+     * A precedência é: lista interna, opções pendentes, conteúdo do slot e, por último,
+     * os filhos atuais do host.
+     */
+    getCurrentOptions() {
+        // As opções projetadas são a fonte canônica quando não há coleção
+        // imperativa: a lista virtualizada pode manter um snapshot enquanto o
+        // consumidor altera `selected` diretamente no slot.
+        if (!this.hasImperativeOptions && this.slotElement) {
+            const nodes = this.slotElement.assignedNodes({ flatten: true }) ?? [];
+            const slotOptions = nodes
+                .map((node) => this.nodeToOption(node))
+                .filter((option) => Boolean(option));
+            if (slotOptions.length > 0)
+                return slotOptions;
+        }
+        const listOptions = this.getSelectListController()?.options;
+        if (Array.isArray(listOptions) && listOptions.length > 0) {
+            const normalizedListOptions = listOptions.map((option) => ({ ...option }));
+            const hasRealOptions = normalizedListOptions.some((option) => !this.isSelectAllLabel(this.getOptionLabel(option)));
+            if (hasRealOptions) {
+                return normalizedListOptions;
+            }
+        }
+        if (this.pendingOptions) {
+            return this.pendingOptions.map((option) => ({ ...option }));
+        }
+        return this.getHostOptions();
+    }
+    normalizeSearchText(value) {
+        return value
+            .normalize('NFD')
+            .replace(/[\u0300-\u036f]/g, '')
+            .toLocaleLowerCase('pt-BR')
+            .trim();
+    }
+    getNavigableOptions() {
+        const options = this.getCurrentOptions();
+        const normalizedTerm = this.normalizeSearchText(this.searchTerm);
+        if (!this.filterable || this.searchMode === 'remote' || !normalizedTerm)
+            return options;
+        return options.filter((option) => {
+            if (this.isSelectAllLabel(this.getOptionLabel(option)))
+                return this.effectiveMultiple;
+            const label = this.normalizeSearchText(this.getOptionLabel(option));
+            const value = this.normalizeSearchText(option.value);
+            return label.includes(normalizedTerm) || value.includes(normalizedTerm);
+        });
+    }
+    clearSearch() {
+        if (!this.searchTerm)
+            return;
+        this.searchTerm = '';
+        this.activeOptionIndex = -1;
+        void this.getSelectListController()?.setSearchTerm?.('');
+    }
+    getEventPath(ev) {
+        return ev.composedPath ? ev.composedPath() : (ev.path ?? []);
+    }
+    getSelectListController() {
+        return this.selectListElement;
+    }
+    getCssClassMap() {
+        return {
+            'br-select': true,
+        };
+    }
+    getAccessibleLabel() {
+        return this.label?.trim() || this.placeholder?.trim() || 'Selecao';
+    }
+    setSelectionMode(isMultiple) {
+        this.selectListElement?.setMultiple(isMultiple);
+    }
+    renderSelectInput() {
+        return (h("br-select-input", { part: "input", exportparts: "container:input-container, input:input-field, label:input-label, group:input-group, icon:input-icon, action:input-action, action-button:input-action-button", ref: (el) => (this.selectInputElement = el), "aria-activedescendant": this.getActiveDescendant(), "aria-controls": this.listboxId, "aria-disabled": String(this.isDisabled()), "aria-expanded": String(this.effectiveOpen), "aria-haspopup": "listbox", "aria-label": this.getAccessibleLabel(), "aria-required": String(this.required), borderless: this.borderless, "is-inline": this.effectiveInline, "is-open": this.effectiveOpen, label: this.label, name: this.name, placeholder: this.placeholder, required: this.required, disabled: this.isDisabled(), filterable: this.filterable, showSearchIcon: this.showSearchIcon, autocomplete: this.autocomplete, "input-width": this.inputWidth, role: "combobox", value: this.filterable && this.effectiveOpen ? this.searchTerm : this.getRenderedDisplayValue() }));
+    }
+    renderSelectList() {
+        return (h("br-select-list", { part: "list", exportparts: "list, option, checkbox, select-all, empty-option, option-checkbox, option-radio", "active-option-index": this.activeOptionIndex, "aria-label": this.getAccessibleLabel(), "aria-multiselectable": this.effectiveMultiple ? 'true' : 'false', id: this.listboxId, "visible-items": this.visibleItems, "item-height": this.itemHeight, overscan: this.overscan, "search-term": this.filterable && this.searchMode === 'local' ? this.searchTerm : '', role: "listbox", "select-all-label": this.selectAllLabel, "unselect-all-label": this.unselectAllLabel, ref: (el) => {
+                this.selectListElement = el;
+                this.selectListElement.loading = this.loading;
+                this.setSelectionMode(this.effectiveMultiple);
+                void this.getSelectListController()?.setSearchTerm?.(this.filterable ? this.searchTerm : '');
+            } }, h("slot", null), h("slot", { name: "loading", slot: "loading" })));
+    }
+    renderHiddenSelect() {
+        const selectedOptions = this.getFormOptions(this.getCurrentOptions())
+            .filter((option) => !this.isSelectAllLabel(this.getOptionLabel(option)))
+            .filter((option) => option.selected);
+        return (h("select", { ref: (el) => (this.nativeSelect = el), part: "hidden-select", name: this.name, autocomplete: this.autocomplete, multiple: this.effectiveMultiple, required: this.required, disabled: this.isDisabled(), tabIndex: -1, "aria-hidden": "true", style: {
+                position: 'absolute',
+                width: '1px',
+                height: '1px',
+                padding: '0',
+                margin: '-1px',
+                overflow: 'hidden',
+                clip: 'rect(0, 0, 0, 0)',
+                whiteSpace: 'nowrap',
+                border: '0',
+            }, onChange: (event) => event.preventDefault() }, h("option", { value: "", selected: selectedOptions.length === 0 }), selectedOptions.map((option) => (h("option", { key: option.value, value: option.value, selected: option.selected, disabled: option.disabled })))));
+    }
+    render() {
+        return (h(Host, { key: 'acca9307d38da5b977fa8eac160bdd2b74eb573c', "aria-busy": this.isValidating || this.loading ? 'true' : null }, h("div", { key: 'b6a55059b9948c89c40415297315af9fa40939de', class: this.getCssClassMap(), part: "container" }, this.renderSelectInput(), this.renderSelectList(), h("div", { key: '789c2752631fed675dfe4f24e703a04a6012681f', part: "feedback", hidden: !this.hasFeedbackSlot && !this.validatorMessage }, h("slot", { key: '13f7245f98ee7c5529881b12d400180316e439f0', name: "feedback", onSlotchange: (event) => (this.hasFeedbackSlot = hasAssignedSlotContent(event.currentTarget)) }, this.validatorMessage)), h("div", { key: '3e2076875f4a9d7fd717151b918011b6ea89455e', part: "validation-loading", hidden: !this.hasValidationLoadingSlot || !this.isValidating }, h("slot", { key: 'cb51e859372eb703c4eed65e157bbefe7ab9e844', name: "validation-loading" })), this.renderHiddenSelect())));
+    }
+    static get formAssociated() { return true; }
+    get el() { return getElement(this); }
+    static get watchers() { return {
+        "disabled": [{
+                "handleDisabledChange": 0
+            }],
+        "isOpen": [{
+                "handleIsOpenChange": 0
+            }],
+        "filterable": [{
+                "handleFilterableChange": 0
+            }],
+        "loading": [{
+                "handleLoadingChange": 0
+            }],
+        "isMultiple": [{
+                "handleIsMultipleChange": 0
+            }],
+        "multiple": [{
+                "handleMultipleChange": 0
+            }],
+        "open": [{
+                "handleOpenChange": 0
+            }],
+        "value": [{
+                "handleExternalValueChange": 0
+            }],
+        "options": [{
+                "handleOptionsChange": 0
+            }]
+    }; }
+};
+Select.SELECT_ALL_LABEL = 'Selecionar todos';
+Select.DESELECT_ALL_LABEL = 'Desselecionar todos';
+Select.style = selectCss();
+
+export { Dropdown as br_dropdown, Select as br_select };