@govbr-ds/webcomponents 2.0.0-next.44 → 2.0.0-next.45

package/dist/components/br-select.js.map

@@ -1 +1 @@
-{"version":3,"names":["selectCss","Select","__stencil_proxyCustomElement","HTMLElement","constructor","this","placeholder","isMultiple","options","selectAllLabel","unselectAllLabel","showSearchIcon","isOpen","customId","selectId","parsedOptions","inputValue","isAllSelected","isExpanded","focusedIndex","handleClickOutside","event","target","el","contains","synchronizeSelect","jsonData","JSON","parse","Array","isArray","Error","error","console","message","updateSelectedOptions","updateSelectedAllState","emitSelectedOptions","syncValueFromOutside","newVal","map","o","Object","assign","selected","includes","value","componentWillLoad","componentDidLoad","document","addEventListener","disconnectedCallback","removeEventListener","handleKeydownOnInput","key","closeSelect","preventDefault","openSelect","focusItemInDirection","resetFocus","toggleOpen","handleKeydownOnList","handleKeydownOnItem","index","handleSelection","handleSelectAllKeyDown","toggleSelectAll","input","shadowRoot","querySelector","focus","direction","itemCount","length","focusItem","items","querySelectorAll","item","updatedOptions","option","filter","_a","find","valueChange","emit","elementInternals","setFormValue","stringify","_b","getStringValue","firstSelected","label","howManySelected","selectedValues","allSelected","every","renderInput","h","readonly","onClick","onKeyDown","slot","height","renderSelectAllCheckbox","class","tabindex","role","name","checked","onCheckedChange","renderOptions","exportparts","getComputedId","getCssClassMap","render","id"],"sources":["../../packages/webcomponents/src/components/select/select.scss?tag=br-select&encapsulation=shadow","../../packages/webcomponents/src/components/select/select.tsx"],"sourcesContent":["@import \"~@govbr-ds/core/src/components/select/select\";\n@import \"~@govbr-ds/core/src/components/item/item\";\n\n:host {\n  display: inline-block;\n\n  .br-select br-list {\n    background-color: var(--bg-color);\n    box-shadow: var(--select-shadow);\n    margin-top: -2px;\n    max-height: 404px;\n    overflow: auto;\n    position: absolute;\n    resize: none;\n    width: 100%;\n    z-index: 1;\n\n    @include scrollbar;\n\n    &:focus,\n    &:active {\n      color: var(--color-secondary-09);\n      outline: none;\n    }\n\n    &:hover {\n      &::-webkit-scrollbar-thumb {\n        background: var(--color-secondary-07);\n      }\n    }\n\n    .br-item br-radio::part(radio-input) {\n      visibility: hidden;\n      height: 0;\n      width: 0;\n    }\n\n    .br-item br-radio::part(radio-label) {\n      padding-left: var(--spacing-scale-base);\n      position: relative;\n\n      &::before,\n      &::after {\n        display: none;\n      }\n    }\n  }\n}\n","import { AttachInternals, Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core'\n\nimport { CssClassMap } from '../../utils/interfaces'\n\n@Component({\n  tag: 'br-select',\n  styleUrl: 'select.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class Select {\n  /**\n   * Referência ao elemento host do componente.\n   * Utilize esta propriedade para acessar e manipular o elemento do DOM associado ao componente.\n   */\n  @Element() el: HTMLBrSelectElement\n\n  @AttachInternals() elementInternals: ElementInternals\n\n  /**\n   * Rótulo que indica o tipo de informação que deve ser selecionada.\n   */\n  @Prop({ reflect: true }) label: string\n\n  /**\n   * Texto auxiliar exibido antes de uma seleção.\n   */\n  @Prop({ reflect: true }) placeholder: string = ''\n\n  /**\n   * Habilita o modo múltiplo para selecionar várias opções.\n   */\n  @Prop({ reflect: true }) isMultiple: boolean = false\n\n  /**\n   * Define as opções disponíveis no componente de seleção.\n   * Pode ser fornecida como:\n   * - Uma **string** contendo um JSON válido que será analisado em um array de objetos. Exemplo: `'[{\"label\": \"Opção 1\", \"value\": \"1\"}]'.\n   * - Um **array de objetos**, onde cada objeto representa uma opção com as propriedades:\n   * - `label`: O texto exibido para o usuário (obrigatório).\n   * - `value`: O valor associado à opção (obrigatório).\n   * - `selected`: Um boolean opcional que indica se a opção está pré-selecionada (padrão: `false`).\n   * Se uma string for fornecida, ela será convertida internamente para um array via `JSON.parse`. Caso o formato seja inválido, um erro será registrado e as opções serão definidas como um array vazio.\n   * Exemplo de uso:\n   * ```typescript\n   * options='[{\"label\": \"Sim\", \"value\": \"1\"}, {\"label\": \"Não\", \"value\": \"0\"}]'\n   * // ou\n   * options=[{ label: \"Sim\", value: \"1\" }, { label: \"Não\", value: \"0\" }]\n   * ```\n   */\n  @Prop({ reflect: true }) options:\n    | string\n    | {\n      label: string\n      value: string\n      selected?: boolean\n    }[] = []\n\n  /**\n   * Rótulo para selecionar todas as opções.\n   */\n  @Prop({ reflect: true }) selectAllLabel: string = 'Selecionar todos'\n\n  /**\n   * Rótulo para desmarcar todas as opções.\n   */\n  @Prop({ reflect: true }) unselectAllLabel: string = 'Desselecionar todos'\n\n  /**\n   * Exibe o ícone de busca no campo de entrada.\n   */\n  @Prop({ reflect: true }) showSearchIcon: boolean = false\n\n  /**\n   * Indica se a listagem de itens do select está expandida\n   */\n  @Prop({ reflect: true }) isOpen: boolean = false\n\n  /**\n   * Identificador único.\n   * Caso não seja fornecido, um ID gerado automaticamente será usado.\n   */\n  @Prop({ reflect: true }) readonly customId: string = `br-select-${selectId++}`\n\n  // Representa as opções do select disponíveis para renderização.\n  // Cada opção contém `label`, `value` e o estado de seleção (`selected`).\n  @State() parsedOptions: { label: string; value: string; selected?: boolean }[] = []\n\n  // Valor exibido no input, refletindo as opções selecionadas.\n  @State() inputValue: string = ''\n\n  /** Valor selecionado (string para single, string[] para multiple) */\n  @Prop({ reflect: false }) value?: string | string[];\n\n  // Indica se todas as opções estão selecionadas. Comportamento do checkbox \"Selecionar Todos\".\n  @State() isAllSelected: boolean = false\n\n  // Controla se a lista de opções do select está expandida (aberta) ou colapsada (fechada).\n  @State() isExpanded: boolean = false\n\n  // Armazena o índice do item atualmente focado, usado para navegação por teclado.\n  @State() focusedIndex: number = -1\n\n  /**\n   * Evento emitido sempre que houver atualização nos itens selecionados.\n   * RENOMEADO PARA valueChange para compatibilidade com ngModel.\n   */\n  @Event({ bubbles: true, composed: true }) valueChange: EventEmitter;\n\n\n  @Watch('options')\n  synchronizeSelect() {\n    try {\n      let parsedOptions: { label: string; value: string; selected?: boolean }[] = []\n      if (typeof this.options === 'string') {\n        try {\n          const jsonData = JSON.parse(this.options)\n          if (Array.isArray(jsonData)) {\n            parsedOptions = jsonData\n          } else {\n            throw new Error('JSON inválido: deve ser um array')\n          }\n        } catch (error) {\n          console.error('Erro ao converter options para JSON:', error.message)\n          parsedOptions = []\n        }\n      } else if (Array.isArray(this.options)) {\n        parsedOptions = this.options\n      }\n\n      // Sanitiza as opções (remove opções inválidas, etc.)\n      this.parsedOptions = parsedOptions\n\n      // Atualiza o estado do componente\n      this.updateSelectedOptions()\n      this.updateSelectedAllState()\n      this.emitSelectedOptions()\n    } catch (error) {\n      console.error('Erro ao processar as opções do select:', error)\n      this.parsedOptions = []\n    }\n  }\n\n  @Watch('value')\n  syncValueFromOutside(newVal: string | string[]) {\n    // Atualize parsedOptions a partir de newVal\n    this.parsedOptions = this.parsedOptions.map(o => ({\n      ...o,\n      selected: this.isMultiple\n        ? Array.isArray(newVal) && newVal.includes(o.value)\n        : newVal === o.value\n    }));\n    this.updateSelectedOptions();   // mantém inputValue coeso\n    this.updateSelectedAllState();\n  }\n\n  componentWillLoad() {\n    this.isExpanded = this.isOpen\n    this.synchronizeSelect()\n  }\n\n  componentDidLoad() {\n    document.addEventListener('click', this.handleClickOutside)\n  }\n\n  disconnectedCallback() {\n    document.removeEventListener('click', this.handleClickOutside)\n  }\n\n  /**\n   * Fecha a lista suspensa (`dropdown`) do `br-select` quando o usuário clica fora do componente.\n   * O listener global é adicionado no `componentDidLoad` e removido no `disconnectedCallback` para evitar vazamentos de memória.\n   * Se a lista estiver aberta (`this.isExpanded`) e o clique ocorrer fora (`!this.el.contains(target)`), ela é fechada.\n   * A reatividade do StencilJS garante a atualização automática da interface.\n   * A arrow function (`=>`) mantém o contexto correto de `this` ao ser usada como callback.\n   *\n   * @param {MouseEvent} event O evento de clique.\n   * @returns {void}\n   */\n  private readonly handleClickOutside = (event: MouseEvent) => {\n    const target = event.target as HTMLElement\n    if (this.isExpanded && !this.el.contains(target)) {\n      this.isExpanded = false\n    }\n  }\n\n  private handleKeydownOnInput(event: KeyboardEvent) {\n    switch (event.key) {\n      case 'Tab':\n        this.closeSelect()\n        break\n      case 'ArrowDown':\n        event.preventDefault()\n        if (!this.isExpanded) {\n          this.openSelect()\n        }\n        this.focusItemInDirection('next')\n        break\n      case 'ArrowUp':\n        event.preventDefault()\n        if (!this.isExpanded) {\n          this.openSelect()\n        }\n        this.focusItemInDirection('previous')\n        break\n      case 'Escape':\n        this.closeSelect()\n        this.resetFocus()\n        break\n      case 'Enter':\n        this.toggleOpen()\n        break\n      default:\n    }\n  }\n\n  private handleKeydownOnList(event: KeyboardEvent) {\n    event.preventDefault()\n    switch (event.key) {\n      case 'Tab':\n      case 'Escape':\n        this.resetFocus()\n        break\n      case 'ArrowUp':\n        this.focusItemInDirection('previous')\n        break\n      case 'ArrowDown':\n        this.focusItemInDirection('next')\n        break\n      default:\n        break\n    }\n  }\n\n  private handleKeydownOnItem(event: KeyboardEvent, index: number) {\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault()\n      this.handleSelection(index)\n    } else if (event.key === 'Escape') {\n      this.closeSelect()\n    }\n  }\n\n  private handleSelectAllKeyDown(event: KeyboardEvent) {\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault()\n      this.toggleSelectAll()\n    } else if (event.key === 'Escape') {\n      event.preventDefault()\n      this.closeSelect()\n    }\n  }\n\n  private resetFocus() {\n    const input = this.el.shadowRoot.querySelector('br-input') as HTMLElement\n    input.focus()\n  }\n\n  private focusItemInDirection(direction: 'next' | 'previous') {\n    let itemCount = this.parsedOptions.length\n    if (this.isMultiple) itemCount += 1\n\n    this.focusedIndex =\n      direction === 'next' ? (this.focusedIndex + 1) % itemCount : (this.focusedIndex - 1 + itemCount) % itemCount\n\n    this.focusItem(this.focusedIndex)\n  }\n\n  private focusItem(index: number) {\n    const items = this.el.shadowRoot.querySelectorAll('.br-item')\n    if (items[index]) {\n      const item = items[index] as HTMLElement\n      item.focus()\n    }\n  }\n\n  private openSelect() {\n    this.isExpanded = true\n  }\n\n  private closeSelect() {\n    this.isExpanded = false\n    // Resetar o índice focado ao fechar o select\n    this.focusedIndex = -1\n  }\n\n  private handleSelection(index: number) {\n    if (index < 0 || index >= this.parsedOptions.length) {\n      return\n    }\n\n    if (this.isMultiple) {\n      const updatedOptions = [...this.parsedOptions]\n      updatedOptions[index].selected = !updatedOptions[index].selected\n      this.parsedOptions = updatedOptions\n    } else {\n      const updatedOptions = this.parsedOptions.map((option) => ({ ...option, selected: false }))\n      updatedOptions[index].selected = true\n      this.parsedOptions = updatedOptions\n      this.isExpanded = false\n    }\n\n    // Atualiza a prop 'value' interna do componente\n    this.value = this.isMultiple\n      ? this.parsedOptions.filter(o => o.selected).map(o => o.value)\n      : this.parsedOptions.find(o => o.selected)?.value;\n\n    // Emite o evento 'valueChange' para que o ngModel possa capturar\n    this.valueChange.emit(this.value);\n\n    this.updateSelectedOptions()\n    this.updateSelectedAllState()\n    this.elementInternals.setFormValue(JSON.stringify(this.value ?? []));\n  }\n\n  private updateSelectedOptions() {\n    this.inputValue = this.getStringValue(this.parsedOptions.filter((option) => option.selected))\n  }\n\n  private getStringValue(options: { label: string; value: string; selected?: boolean }[]) {\n    if (options.length > 0) {\n      const firstSelected = options[0].label || options[0].value\n      if (this.isMultiple) {\n        const howManySelected = options.length > 1 ? ` + (${options.length - 1})` : ''\n        return `${firstSelected}${howManySelected}`\n      } else {\n        return firstSelected\n      }\n    }\n    return ''\n  }\n\n  private emitSelectedOptions() {\n    // A lógica de emissão do evento já está no handleSelection para o ngModel.\n    // Esta função pode ser simplificada ou removida se a única finalidade era emitir para ngModel.\n    // No entanto, se houver outros consumidores deste evento, você pode mantê-la.\n    const selectedValues = this.parsedOptions\n      .filter((option) => option.selected === true)\n      .map((option) => option.value); // É importante emitir o 'value' para o ngModel.\n\n    // Já emitimos em handleSelection, mas se quiser ter certeza, pode emitir aqui também.\n    // this.valueChange.emit(this.isMultiple ? selectedValues : selectedValues[0] ?? undefined);\n\n    // Atualiza o valor do form associado\n    this.elementInternals.setFormValue(JSON.stringify(this.isMultiple ? selectedValues : selectedValues[0] ?? null));\n  }\n\n  private updateSelectedAllState() {\n    const allSelected = this.parsedOptions.every((option) => option.selected)\n    this.isAllSelected = allSelected\n  }\n\n  private toggleSelectAll() {\n    const updatedOptions = this.parsedOptions.map((option) => ({ ...option, selected: !this.isAllSelected }))\n    this.parsedOptions = updatedOptions\n    this.isAllSelected = !this.isAllSelected\n\n    this.updateSelectedOptions()\n\n    // Atualiza a prop 'value' e emite o evento para ngModel\n    this.value = this.isMultiple\n      ? this.parsedOptions.filter(o => o.selected).map(o => o.value)\n      : this.parsedOptions.find(o => o.selected)?.value;\n    this.valueChange.emit(this.value);\n\n    this.elementInternals.setFormValue(JSON.stringify(this.value ?? []));\n  }\n\n  private renderInput() {\n    return (\n      <br-input\n        value={this.inputValue}\n        label={this.label}\n        placeholder={this.placeholder}\n        readonly\n        onClick={() => this.toggleOpen()}\n        onKeyDown={(event) => this.handleKeydownOnInput(event)}\n      >\n        {this.showSearchIcon && <br-icon slot=\"icon\" icon-name=\"fa-solid:search\" aria-hidden=\"true\"></br-icon>}\n        <br-icon\n          slot=\"action\"\n          icon-name={this.isExpanded ? 'fa-solid:angle-up' : 'fa-solid:angle-down'}\n          height=\"16\"\n          aria-hidden=\"true\"\n        ></br-icon>\n      </br-input>\n    )\n  }\n\n  private renderSelectAllCheckbox() {\n    return (\n      <div\n        class={`br-item highlighted ${this.isAllSelected ? 'selected' : ''}`}\n        data-all=\"data-all\"\n        tabindex=\"-1\"\n        role=\"option\"\n        aria-selected={this.isAllSelected}\n        onKeyDown={(event) => this.handleSelectAllKeyDown(event)}\n        onClick={() => this.toggleSelectAll()}\n      >\n        <br-checkbox\n          name={`checkbox-${this.customId}`}\n          label={this.isAllSelected ? this.unselectAllLabel : this.selectAllLabel}\n          checked={this.isAllSelected}\n          onCheckedChange={() => this.toggleSelectAll()}\n        ></br-checkbox>\n      </div>\n    )\n  }\n\n  private renderOptions() {\n    return this.parsedOptions.map((option, index) => (\n      <div\n        class={`br-item ${option.selected ? 'selected' : ''}`}\n        key={`${option.label}-${this.customId}`}\n        role=\"option\"\n        tabindex={this.focusedIndex === index ? 0 : -1}\n        aria-selected={option.selected}\n        onClick={() => this.handleSelection(index)}\n        onKeyDown={(event) => this.handleKeydownOnItem(event, index)}\n      >\n        {this.isMultiple ? (\n          <br-checkbox\n            name={`checkbox-${index}-${this.customId}`}\n            label={option.label || option.value}\n            checked={option.selected === true}\n            onCheckedChange={() => this.handleSelection(index)}\n          />\n        ) : (\n          <br-radio\n            exportparts=\"radio-input, radio-label\"\n            name={`radio-${index}-${this.customId}`}\n            label={option.label || option.value}\n            checked={option.selected === true}\n            onCheckedChange={() => this.handleSelection(index)}\n          />\n        )}\n      </div>\n    ))\n  }\n\n  /**\n   * Determina um id para o radio.\n   */\n  private getComputedId() {\n    return this.customId?.length > 0 ? this.customId : `br-select-${this.customId}`\n  }\n\n  /**\n   * Inverte o valor da prop `isOpen`\n   */\n  @Method()\n  async toggleOpen() {\n    this.isExpanded = !this.isExpanded\n  }\n\n  private getCssClassMap(): CssClassMap {\n    return {\n      'br-select': true,\n    }\n  }\n\n  render() {\n    return (\n      <div class={this.getCssClassMap()} id={this.getComputedId()}>\n        {this.renderInput()}\n\n        {this.isExpanded && (\n          <br-list tabindex={-1} onKeyDown={(event) => this.handleKeydownOnList(event)}>\n            {this.isMultiple && this.renderSelectAllCheckbox()}\n            {this.renderOptions()}\n          </br-list>\n        )}\n      </div>\n    )\n  }\n}\n\nlet selectId = 0\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["selectCss","Select","__stencil_proxyCustomElement","HTMLElement","constructor","this","placeholder","isMultiple","options","selectAllLabel","unselectAllLabel","showSearchIcon","isOpen","customId","selectId","parsedOptions","inputValue","isAllSelected","isExpanded","focusedIndex","handleClickOutside","event","target","el","contains","synchronizeSelect","jsonData","JSON","parse","Array","isArray","Error","error","console","message","updateSelectedOptions","updateSelectedAllState","emitSelectedOptions","syncValueFromOutside","newVal","map","o","selected","includes","value","componentWillLoad","componentDidLoad","document","addEventListener","disconnectedCallback","removeEventListener","handleKeydownOnInput","key","closeSelect","preventDefault","openSelect","focusItemInDirection","resetFocus","toggleOpen","handleKeydownOnList","handleKeydownOnItem","index","handleSelection","handleSelectAllKeyDown","toggleSelectAll","input","shadowRoot","querySelector","focus","direction","itemCount","length","focusItem","items","querySelectorAll","item","updatedOptions","option","filter","find","valueChange","emit","elementInternals","setFormValue","stringify","getStringValue","firstSelected","label","howManySelected","selectedValues","allSelected","every","renderInput","h","readonly","onClick","onKeyDown","slot","height","renderSelectAllCheckbox","class","tabindex","role","name","checked","onCheckedChange","renderOptions","exportparts","getComputedId","getCssClassMap","render","id"],"sources":["../../packages/webcomponents/src/components/select/select.scss?tag=br-select&encapsulation=shadow","../../packages/webcomponents/src/components/select/select.tsx"],"sourcesContent":["@import \"~@govbr-ds/core/src/components/select/select\";\n@import \"~@govbr-ds/core/src/components/item/item\";\n\n:host {\n  display: inline-block;\n\n  .br-select br-list {\n    background-color: var(--bg-color);\n    box-shadow: var(--select-shadow);\n    margin-top: -2px;\n    max-height: 404px;\n    overflow: auto;\n    position: absolute;\n    resize: none;\n    width: 100%;\n    z-index: 1;\n\n    @include scrollbar;\n\n    &:focus,\n    &:active {\n      color: var(--color-secondary-09);\n      outline: none;\n    }\n\n    &:hover {\n      &::-webkit-scrollbar-thumb {\n        background: var(--color-secondary-07);\n      }\n    }\n\n    .br-item br-radio::part(radio-input) {\n      visibility: hidden;\n      height: 0;\n      width: 0;\n    }\n\n    .br-item br-radio::part(radio-label) {\n      padding-left: var(--spacing-scale-base);\n      position: relative;\n\n      &::before,\n      &::after {\n        display: none;\n      }\n    }\n  }\n}\n","import { AttachInternals, Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core'\n\nimport { CssClassMap } from '../../utils/interfaces'\n\n@Component({\n  tag: 'br-select',\n  styleUrl: 'select.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class Select {\n  /**\n   * Referência ao elemento host do componente.\n   * Utilize esta propriedade para acessar e manipular o elemento do DOM associado ao componente.\n   */\n  @Element() el: HTMLBrSelectElement\n\n  @AttachInternals() elementInternals: ElementInternals\n\n  /**\n   * Rótulo que indica o tipo de informação que deve ser selecionada.\n   */\n  @Prop({ reflect: true }) label: string\n\n  /**\n   * Texto auxiliar exibido antes de uma seleção.\n   */\n  @Prop({ reflect: true }) placeholder: string = ''\n\n  /**\n   * Habilita o modo múltiplo para selecionar várias opções.\n   */\n  @Prop({ reflect: true }) isMultiple: boolean = false\n\n  /**\n   * Define as opções disponíveis no componente de seleção.\n   * Pode ser fornecida como:\n   * - Uma **string** contendo um JSON válido que será analisado em um array de objetos. Exemplo: `'[{\"label\": \"Opção 1\", \"value\": \"1\"}]'.\n   * - Um **array de objetos**, onde cada objeto representa uma opção com as propriedades:\n   * - `label`: O texto exibido para o usuário (obrigatório).\n   * - `value`: O valor associado à opção (obrigatório).\n   * - `selected`: Um boolean opcional que indica se a opção está pré-selecionada (padrão: `false`).\n   * Se uma string for fornecida, ela será convertida internamente para um array via `JSON.parse`. Caso o formato seja inválido, um erro será registrado e as opções serão definidas como um array vazio.\n   * Exemplo de uso:\n   * ```typescript\n   * options='[{\"label\": \"Sim\", \"value\": \"1\"}, {\"label\": \"Não\", \"value\": \"0\"}]'\n   * // ou\n   * options=[{ label: \"Sim\", value: \"1\" }, { label: \"Não\", value: \"0\" }]\n   * ```\n   */\n  @Prop({ reflect: true }) options:\n    | string\n    | {\n      label: string\n      value: string\n      selected?: boolean\n    }[] = []\n\n  /**\n   * Rótulo para selecionar todas as opções.\n   */\n  @Prop({ reflect: true }) selectAllLabel: string = 'Selecionar todos'\n\n  /**\n   * Rótulo para desmarcar todas as opções.\n   */\n  @Prop({ reflect: true }) unselectAllLabel: string = 'Desselecionar todos'\n\n  /**\n   * Exibe o ícone de busca no campo de entrada.\n   */\n  @Prop({ reflect: true }) showSearchIcon: boolean = false\n\n  /**\n   * Indica se a listagem de itens do select está expandida\n   */\n  @Prop({ reflect: true }) isOpen: boolean = false\n\n  /**\n   * Identificador único.\n   * Caso não seja fornecido, um ID gerado automaticamente será usado.\n   */\n  @Prop({ reflect: true }) readonly customId: string = `br-select-${selectId++}`\n\n  // Representa as opções do select disponíveis para renderização.\n  // Cada opção contém `label`, `value` e o estado de seleção (`selected`).\n  @State() parsedOptions: { label: string; value: string; selected?: boolean }[] = []\n\n  // Valor exibido no input, refletindo as opções selecionadas.\n  @State() inputValue: string = ''\n\n  /** Valor selecionado (string para single, string[] para multiple) */\n  @Prop({ reflect: false }) value?: string | string[];\n\n  // Indica se todas as opções estão selecionadas. Comportamento do checkbox \"Selecionar Todos\".\n  @State() isAllSelected: boolean = false\n\n  // Controla se a lista de opções do select está expandida (aberta) ou colapsada (fechada).\n  @State() isExpanded: boolean = false\n\n  // Armazena o índice do item atualmente focado, usado para navegação por teclado.\n  @State() focusedIndex: number = -1\n\n  /**\n   * Evento emitido sempre que houver atualização nos itens selecionados.\n   * RENOMEADO PARA valueChange para compatibilidade com ngModel.\n   */\n  @Event({ bubbles: true, composed: true }) valueChange: EventEmitter;\n\n\n  @Watch('options')\n  synchronizeSelect() {\n    try {\n      let parsedOptions: { label: string; value: string; selected?: boolean }[] = []\n      if (typeof this.options === 'string') {\n        try {\n          const jsonData = JSON.parse(this.options)\n          if (Array.isArray(jsonData)) {\n            parsedOptions = jsonData\n          } else {\n            throw new Error('JSON inválido: deve ser um array')\n          }\n        } catch (error) {\n          console.error('Erro ao converter options para JSON:', error.message)\n          parsedOptions = []\n        }\n      } else if (Array.isArray(this.options)) {\n        parsedOptions = this.options\n      }\n\n      // Sanitiza as opções (remove opções inválidas, etc.)\n      this.parsedOptions = parsedOptions\n\n      // Atualiza o estado do componente\n      this.updateSelectedOptions()\n      this.updateSelectedAllState()\n      this.emitSelectedOptions()\n    } catch (error) {\n      console.error('Erro ao processar as opções do select:', error)\n      this.parsedOptions = []\n    }\n  }\n\n  @Watch('value')\n  syncValueFromOutside(newVal: string | string[]) {\n    // Atualize parsedOptions a partir de newVal\n    this.parsedOptions = this.parsedOptions.map(o => ({\n      ...o,\n      selected: this.isMultiple\n        ? Array.isArray(newVal) && newVal.includes(o.value)\n        : newVal === o.value\n    }));\n    this.updateSelectedOptions();   // mantém inputValue coeso\n    this.updateSelectedAllState();\n  }\n\n  componentWillLoad() {\n    this.isExpanded = this.isOpen\n    this.synchronizeSelect()\n  }\n\n  componentDidLoad() {\n    document.addEventListener('click', this.handleClickOutside)\n  }\n\n  disconnectedCallback() {\n    document.removeEventListener('click', this.handleClickOutside)\n  }\n\n  /**\n   * Fecha a lista suspensa (`dropdown`) do `br-select` quando o usuário clica fora do componente.\n   * O listener global é adicionado no `componentDidLoad` e removido no `disconnectedCallback` para evitar vazamentos de memória.\n   * Se a lista estiver aberta (`this.isExpanded`) e o clique ocorrer fora (`!this.el.contains(target)`), ela é fechada.\n   * A reatividade do StencilJS garante a atualização automática da interface.\n   * A arrow function (`=>`) mantém o contexto correto de `this` ao ser usada como callback.\n   *\n   * @param {MouseEvent} event O evento de clique.\n   * @returns {void}\n   */\n  private readonly handleClickOutside = (event: MouseEvent) => {\n    const target = event.target as HTMLElement\n    if (this.isExpanded && !this.el.contains(target)) {\n      this.isExpanded = false\n    }\n  }\n\n  private handleKeydownOnInput(event: KeyboardEvent) {\n    switch (event.key) {\n      case 'Tab':\n        this.closeSelect()\n        break\n      case 'ArrowDown':\n        event.preventDefault()\n        if (!this.isExpanded) {\n          this.openSelect()\n        }\n        this.focusItemInDirection('next')\n        break\n      case 'ArrowUp':\n        event.preventDefault()\n        if (!this.isExpanded) {\n          this.openSelect()\n        }\n        this.focusItemInDirection('previous')\n        break\n      case 'Escape':\n        this.closeSelect()\n        this.resetFocus()\n        break\n      case 'Enter':\n        this.toggleOpen()\n        break\n      default:\n    }\n  }\n\n  private handleKeydownOnList(event: KeyboardEvent) {\n    event.preventDefault()\n    switch (event.key) {\n      case 'Tab':\n      case 'Escape':\n        this.resetFocus()\n        break\n      case 'ArrowUp':\n        this.focusItemInDirection('previous')\n        break\n      case 'ArrowDown':\n        this.focusItemInDirection('next')\n        break\n      default:\n        break\n    }\n  }\n\n  private handleKeydownOnItem(event: KeyboardEvent, index: number) {\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault()\n      this.handleSelection(index)\n    } else if (event.key === 'Escape') {\n      this.closeSelect()\n    }\n  }\n\n  private handleSelectAllKeyDown(event: KeyboardEvent) {\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault()\n      this.toggleSelectAll()\n    } else if (event.key === 'Escape') {\n      event.preventDefault()\n      this.closeSelect()\n    }\n  }\n\n  private resetFocus() {\n    const input = this.el.shadowRoot.querySelector('br-input') as HTMLElement\n    input.focus()\n  }\n\n  private focusItemInDirection(direction: 'next' | 'previous') {\n    let itemCount = this.parsedOptions.length\n    if (this.isMultiple) itemCount += 1\n\n    this.focusedIndex =\n      direction === 'next' ? (this.focusedIndex + 1) % itemCount : (this.focusedIndex - 1 + itemCount) % itemCount\n\n    this.focusItem(this.focusedIndex)\n  }\n\n  private focusItem(index: number) {\n    const items = this.el.shadowRoot.querySelectorAll('.br-item')\n    if (items[index]) {\n      const item = items[index] as HTMLElement\n      item.focus()\n    }\n  }\n\n  private openSelect() {\n    this.isExpanded = true\n  }\n\n  private closeSelect() {\n    this.isExpanded = false\n    // Resetar o índice focado ao fechar o select\n    this.focusedIndex = -1\n  }\n\n  private handleSelection(index: number) {\n    if (index < 0 || index >= this.parsedOptions.length) {\n      return\n    }\n\n    if (this.isMultiple) {\n      const updatedOptions = [...this.parsedOptions]\n      updatedOptions[index].selected = !updatedOptions[index].selected\n      this.parsedOptions = updatedOptions\n    } else {\n      const updatedOptions = this.parsedOptions.map((option) => ({ ...option, selected: false }))\n      updatedOptions[index].selected = true\n      this.parsedOptions = updatedOptions\n      this.isExpanded = false\n    }\n\n    // Atualiza a prop 'value' interna do componente\n    this.value = this.isMultiple\n      ? this.parsedOptions.filter(o => o.selected).map(o => o.value)\n      : this.parsedOptions.find(o => o.selected)?.value;\n\n    // Emite o evento 'valueChange' para que o ngModel possa capturar\n    this.valueChange.emit(this.value);\n\n    this.updateSelectedOptions()\n    this.updateSelectedAllState()\n    this.elementInternals.setFormValue(JSON.stringify(this.value ?? []));\n  }\n\n  private updateSelectedOptions() {\n    this.inputValue = this.getStringValue(this.parsedOptions.filter((option) => option.selected))\n  }\n\n  private getStringValue(options: { label: string; value: string; selected?: boolean }[]) {\n    if (options.length > 0) {\n      const firstSelected = options[0].label || options[0].value\n      if (this.isMultiple) {\n        const howManySelected = options.length > 1 ? ` + (${options.length - 1})` : ''\n        return `${firstSelected}${howManySelected}`\n      } else {\n        return firstSelected\n      }\n    }\n    return ''\n  }\n\n  private emitSelectedOptions() {\n    // A lógica de emissão do evento já está no handleSelection para o ngModel.\n    // Esta função pode ser simplificada ou removida se a única finalidade era emitir para ngModel.\n    // No entanto, se houver outros consumidores deste evento, você pode mantê-la.\n    const selectedValues = this.parsedOptions\n      .filter((option) => option.selected === true)\n      .map((option) => option.value); // É importante emitir o 'value' para o ngModel.\n\n    // Já emitimos em handleSelection, mas se quiser ter certeza, pode emitir aqui também.\n    // this.valueChange.emit(this.isMultiple ? selectedValues : selectedValues[0] ?? undefined);\n\n    // Atualiza o valor do form associado\n    this.elementInternals.setFormValue(JSON.stringify(this.isMultiple ? selectedValues : selectedValues[0] ?? null));\n  }\n\n  private updateSelectedAllState() {\n    const allSelected = this.parsedOptions.every((option) => option.selected)\n    this.isAllSelected = allSelected\n  }\n\n  private toggleSelectAll() {\n    const updatedOptions = this.parsedOptions.map((option) => ({ ...option, selected: !this.isAllSelected }))\n    this.parsedOptions = updatedOptions\n    this.isAllSelected = !this.isAllSelected\n\n    this.updateSelectedOptions()\n\n    // Atualiza a prop 'value' e emite o evento para ngModel\n    this.value = this.isMultiple\n      ? this.parsedOptions.filter(o => o.selected).map(o => o.value)\n      : this.parsedOptions.find(o => o.selected)?.value;\n    this.valueChange.emit(this.value);\n\n    this.elementInternals.setFormValue(JSON.stringify(this.value ?? []));\n  }\n\n  private renderInput() {\n    return (\n      <br-input\n        value={this.inputValue}\n        label={this.label}\n        placeholder={this.placeholder}\n        readonly\n        onClick={() => this.toggleOpen()}\n        onKeyDown={(event) => this.handleKeydownOnInput(event)}\n      >\n        {this.showSearchIcon && <br-icon slot=\"icon\" icon-name=\"fa-solid:search\" aria-hidden=\"true\"></br-icon>}\n        <br-icon\n          slot=\"action\"\n          icon-name={this.isExpanded ? 'fa-solid:angle-up' : 'fa-solid:angle-down'}\n          height=\"16\"\n          aria-hidden=\"true\"\n        ></br-icon>\n      </br-input>\n    )\n  }\n\n  private renderSelectAllCheckbox() {\n    return (\n      <div\n        class={`br-item highlighted ${this.isAllSelected ? 'selected' : ''}`}\n        data-all=\"data-all\"\n        tabindex=\"-1\"\n        role=\"option\"\n        aria-selected={this.isAllSelected}\n        onKeyDown={(event) => this.handleSelectAllKeyDown(event)}\n        onClick={() => this.toggleSelectAll()}\n      >\n        <br-checkbox\n          name={`checkbox-${this.customId}`}\n          label={this.isAllSelected ? this.unselectAllLabel : this.selectAllLabel}\n          checked={this.isAllSelected}\n          onCheckedChange={() => this.toggleSelectAll()}\n        ></br-checkbox>\n      </div>\n    )\n  }\n\n  private renderOptions() {\n    return this.parsedOptions.map((option, index) => (\n      <div\n        class={`br-item ${option.selected ? 'selected' : ''}`}\n        key={`${option.label}-${this.customId}`}\n        role=\"option\"\n        tabindex={this.focusedIndex === index ? 0 : -1}\n        aria-selected={option.selected}\n        onClick={() => this.handleSelection(index)}\n        onKeyDown={(event) => this.handleKeydownOnItem(event, index)}\n      >\n        {this.isMultiple ? (\n          <br-checkbox\n            name={`checkbox-${index}-${this.customId}`}\n            label={option.label || option.value}\n            checked={option.selected === true}\n            onCheckedChange={() => this.handleSelection(index)}\n          />\n        ) : (\n          <br-radio\n            exportparts=\"radio-input, radio-label\"\n            name={`radio-${index}-${this.customId}`}\n            label={option.label || option.value}\n            checked={option.selected === true}\n            onCheckedChange={() => this.handleSelection(index)}\n          />\n        )}\n      </div>\n    ))\n  }\n\n  /**\n   * Determina um id para o radio.\n   */\n  private getComputedId() {\n    return this.customId?.length > 0 ? this.customId : `br-select-${this.customId}`\n  }\n\n  /**\n   * Inverte o valor da prop `isOpen`\n   */\n  @Method()\n  async toggleOpen() {\n    this.isExpanded = !this.isExpanded\n  }\n\n  private getCssClassMap(): CssClassMap {\n    return {\n      'br-select': true,\n    }\n  }\n\n  render() {\n    return (\n      <div class={this.getCssClassMap()} id={this.getComputedId()}>\n        {this.renderInput()}\n\n        {this.isExpanded && (\n          <br-list tabindex={-1} onKeyDown={(event) => this.handleKeydownOnList(event)}>\n            {this.isMultiple && this.renderSelectAllCheckbox()}\n            {this.renderOptions()}\n          </br-list>\n        )}\n      </div>\n    )\n  }\n}\n\nlet selectId = 0\n"],"mappings":"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","ignoreList":[]}