voa-ds-core 1.0.3

package/dist/voa/voa-accordion.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-accordion.entry.esm.js","sources":["src/components/voa-accordion/voa-accordion.css?tag=voa-accordion&encapsulation=shadow","src/components/voa-accordion/voa-accordion.tsx"],"sourcesContent":[":host {\r\n  display: block;\r\n  width: 100%;\r\n}\r\n\r\n.voa-accordion {\r\n  display: flex;\r\n  flex-direction: column;\r\n}\r\n\r\n.voa-accordion__trigger {\r\n  appearance: none;\r\n  background: transparent;\r\n  border: none;\r\n  width: 100%;\r\n  padding: 0;\r\n  cursor: pointer;\r\n  text-align: left;\r\n}\r\n\r\n.voa-accordion__header-content {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  width: 100%;\r\n}\r\n\r\n.voa-accordion__title {\r\n  flex-grow: 1;\r\n}\r\n\r\n.voa-accordion__icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  /* Removed fixed width/height. Let the SVG or the Part define it. */\r\n  flex-shrink: 0;\r\n}\r\n\r\n/* ============================================\r\n   ANIMATION ARCHITECTURE\r\n   ============================================\r\n   \r\n   This component uses CSS Grid to enable smooth height animations.\r\n   \r\n   STRUCTURAL (Internal CSS):\r\n   - Sets up grid context: display: grid; grid-template-rows: 1fr;\r\n   - Provides .voa-accordion__content-inner wrapper for height calculation\r\n   \r\n   ANIMATION (External CSS):\r\n   - Consumer controls transition timing via ::part(content)\r\n   - Consumer defines closed state: grid-template-rows: 0fr;\r\n   - Consumer handles prefers-reduced-motion\r\n   \r\n   Why? Performance, Accessibility, and Brand Flexibility.\r\n   ============================================ */\r\n\r\n.voa-accordion__content {\r\n  /* STRUCTURAL PREP FOR ANIMATION */\r\n  display: grid;\r\n  \r\n  /* Default state is open structurally to allow the 'fr' transition to work.\r\n     We control the 'closed' state via the grid-template-rows property. */\r\n  grid-template-rows: 1fr;\r\n  \r\n  /* IMPORTANT: We do NOT use display: none here.\r\n     If we did, the external CSS couldn't animate the opening. */\r\n}\r\n\r\n.voa-accordion__content-inner {\r\n  /* This inner wrapper is required for the grid trick to work.\r\n     The parent animates the grid track, this container calculates the height. */\r\n  overflow: hidden;\r\n  min-height: 0;\r\n}","import { Component, h, Prop, State, Event, EventEmitter, Method, Element, Host, Watch } from '@stencil/core';\r\n\r\n// Helper for unique IDs\r\nlet accordionIds = 0;\r\n\r\n@Component({\r\n  tag: 'voa-accordion',\r\n  styleUrl: 'voa-accordion.css',\r\n  shadow: true,\r\n})\r\nexport class VoaAccordion {\r\n  @Element() host: HTMLVoaAccordionElement;\r\n\r\n  private componentId = `voa-accordion-${accordionIds++}`;\r\n\r\n  /**\r\n   * If true, the accordion is expanded.\r\n   */\r\n  @Prop({ reflect: true }) open: boolean = false;\r\n\r\n  /**\r\n   * Size variant.\r\n   */\r\n  @Prop({ reflect: true }) size: 'md' | 'lg' = 'md';\r\n\r\n  /**\r\n   * Shows the top divider.\r\n   */\r\n  @Prop({ reflect: true }) divider: boolean = true;\r\n\r\n  /**\r\n   * Emitted when the user interacts with the header.\r\n   * Payload: the requested new state (boolean).\r\n   */\r\n  @Event() voaToggle: EventEmitter<boolean>;\r\n\r\n  // Internal state ensures the component works even if the parent doesn't update the prop immediately\r\n  @State() isExpanded: boolean = false;\r\n\r\n  @Watch('open')\r\n  watchOpenHandler(newValue: boolean) {\r\n    this.isExpanded = newValue;\r\n  }\r\n\r\n  componentWillLoad() {\r\n    this.isExpanded = this.open;\r\n  }\r\n\r\n  private handleToggle = () => {\r\n    // Invert internal state immediately for UI responsiveness\r\n    this.isExpanded = !this.isExpanded;\r\n    // Update the open prop to reflect in the DOM attribute (for CSS selectors)\r\n    this.open = this.isExpanded;\r\n    // Tell the world what happened\r\n    this.voaToggle.emit(this.isExpanded);\r\n  };\r\n\r\n  private handleKeyDown = (ev: KeyboardEvent) => {\r\n    if (ev.key === 'Enter' || ev.key === ' ') {\r\n      ev.preventDefault();\r\n      this.handleToggle();\r\n    }\r\n  };\r\n\r\n  @Method()\r\n  async setFocus(): Promise<void> {\r\n    const button = this.host.shadowRoot?.querySelector('button');\r\n    button?.focus();\r\n  }\r\n\r\n  render() {\r\n    const headerId = `${this.componentId}-header`;\r\n    const contentId = `${this.componentId}-content`;\r\n\r\n    return (\r\n      <Host>\r\n        <div\r\n          part=\"base\"\r\n          class={{\r\n            'voa-accordion': true,\r\n            [`voa-accordion--${this.size}`]: true,\r\n            'voa-accordion--open': this.isExpanded,\r\n            'voa-accordion--closed': !this.isExpanded,\r\n            'voa-accordion--divider': this.divider,\r\n          }}\r\n        >\r\n          {/* Header wraps a button for semantics */}\r\n          <div class=\"voa-accordion__header-wrapper\">\r\n            <button\r\n              part=\"header\"\r\n              id={headerId}\r\n              class=\"voa-accordion__trigger\"\r\n              onClick={this.handleToggle}\r\n              onKeyDown={this.handleKeyDown}\r\n              aria-expanded={this.isExpanded ? 'true' : 'false'}\r\n              aria-controls={contentId}\r\n            >\r\n              <div part=\"header-content\" class=\"voa-accordion__header-content\">\r\n                <span part=\"title\" class=\"voa-accordion__title\">\r\n                  <slot name=\"header\">Title</slot>\r\n                </span>\r\n\r\n                {/* ICON SLOT: Allows external replacement */}\r\n                <span part=\"icon\" class=\"voa-accordion__icon\">\r\n                  <slot name=\"icon\">\r\n                    {/* Default Fallback Icon (Chevron) */}\r\n                    <svg\r\n                      width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n                      style={{\r\n                        transform: this.isExpanded ? 'rotate(180deg)' : 'rotate(0deg)'\r\n                      }}\r\n                    >\r\n                      <path d=\"M7 10L12 15L17 10\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n                    </svg>\r\n                  </slot>\r\n                </span>\r\n              </div>\r\n            </button>\r\n          </div>\r\n\r\n          {/* CONTENT: Kept in DOM for animation support via CSS Grid Trick */}\r\n          <div\r\n            part=\"content\"\r\n            id={contentId}\r\n            class=\"voa-accordion__content\"\r\n            role=\"region\"\r\n            aria-labelledby={headerId}\r\n            aria-hidden={!this.isExpanded ? 'true' : 'false'}\r\n          >\r\n            <div class=\"voa-accordion__content-inner\">\r\n              <slot></slot>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}"],"names":[],"mappings":"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"}

package/dist/voa/voa-alert.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-alert.entry.esm.js","sources":["src/components/voa-alert/voa-alert.css?tag=voa-alert&encapsulation=shadow","src/components/voa-alert/voa-alert.tsx"],"sourcesContent":["/* UNSTYLED PATTERN: Structural Only */\r\n\r\n:host {\r\n  display: block;\r\n  box-sizing: border-box;\r\n  width: 100%;\r\n}\r\n\r\n.alert-container {\r\n  display: flex;\r\n  flex-direction: column;\r\n  position: relative;\r\n  box-sizing: border-box;\r\n  width: 100%;\r\n}\r\n\r\n.alert-inline {\r\n  flex-direction: row;\r\n  align-items: center;\r\n}\r\n\r\n.content-wrapper {\r\n  display: flex;\r\n  align-items: flex-start;\r\n  flex: 1;\r\n  width: 100%;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.alert-inline .content-wrapper {\r\n  align-items: center;\r\n}\r\n\r\n.alert-icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.content {\r\n  flex: 1;\r\n  display: flex;\r\n  flex-direction: column;\r\n  box-sizing: border-box;\r\n  min-width: 0; /* Prevents text overflow issues */\r\n}\r\n\r\n.alert-inline .content {\r\n  flex-direction: row;\r\n  align-items: center;\r\n}\r\n\r\n.text-group {\r\n  display: flex;\r\n  flex-direction: column;\r\n}\r\n\r\n.close-button {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  background: none;\r\n  border: none;\r\n  cursor: pointer;\r\n  padding: 0;\r\n  margin: 0;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.actions-wrapper {\r\n  display: flex;\r\n  justify-content: flex-end;\r\n  align-items: center;\r\n  width: 100%;\r\n  box-sizing: border-box;\r\n  flex-wrap: wrap;\r\n}\r\n","import { Component, Event, EventEmitter, Prop, h, Element, Method, Host } from '@stencil/core';\r\nimport { getAlertIcon } from '../../utils/icons';\r\n\r\n/**\r\n * O componente voa-alert é usado para exibir mensagens importantes para o usuário.\r\n * Pode ser de diferentes tipos (success, warning, error, info, basic) e opcionalmente dispensável.\r\n * Suporta variantes default (layout vertical) e inline (layout horizontal).\r\n * \r\n * @part base - O elemento raiz do alerta\r\n * @part content-wrapper - Wrapper do conteúdo principal\r\n * @part icon - Container do ícone\r\n * @part content - Container do conteúdo (slot padrão)\r\n * @part title - Container do título\r\n * @part description - Container da descrição\r\n * @part close-button - Botão de fechar\r\n * @part actions - Container dos botões de ação\r\n * @part primary-btn-base - Expõe o part \"base\" do botão primário para estilização externa\r\n * @part secondary-btn-base - Expõe o part \"base\" do botão secundário para estilização externa\r\n */\r\n@Component({\r\n  tag: 'voa-alert',\r\n  styleUrl: 'voa-alert.css',\r\n  shadow: true,\r\n})\r\nexport class VoaAlert {\r\n  @Element() host: HTMLVoaAlertElement;\r\n\r\n  /**\r\n   * Variante do alerta: 'default' (layout vertical) ou 'inline' (layout horizontal).\r\n   * Padrão é 'default'.\r\n   */\r\n  @Prop({ reflect: true }) variant: 'default' | 'inline' = 'default';\r\n\r\n  /**\r\n   * O tipo de alerta a ser exibido. Influencia a cor e o ícone.\r\n   * Padrão é 'info'.\r\n   */\r\n  @Prop({ reflect: true }) type: 'basic' | 'success' | 'warning' | 'warning-inline' | 'error' | 'info' = 'info';\r\n\r\n  /**\r\n   * Determina se o alerta pode ser fechado pelo usuário.\r\n   */\r\n  @Prop() closable: boolean = false;\r\n\r\n  /**\r\n   * Texto do rótulo para o botão de fechar, para acessibilidade.\r\n   * Padrão é \"Fechar alerta\".\r\n   */\r\n  @Prop() closeButtonLabel: string = 'Fechar alerta';\r\n\r\n  /**\r\n   * Título do alerta. Quando fornecido, será exibido como título principal.\r\n   * Para variant inline, apenas o título é exibido.\r\n   */\r\n  @Prop() alertTitle?: string;\r\n\r\n  /**\r\n   * Descrição do alerta. Apenas exibida na variante default.\r\n   */\r\n  @Prop() description?: string;\r\n\r\n  /**\r\n   * Determina se os botões devem ser exibidos.\r\n   * Se true, os botões serão exibidos (desde que pelo menos primaryButtonText seja fornecido).\r\n   * Se false, os botões não serão exibidos, independente das outras props.\r\n   */\r\n  @Prop() showButtons: boolean = false;\r\n\r\n  /**\r\n   * Texto do botão primário. Só será exibido se showButtons for true.\r\n   */\r\n  @Prop() primaryButtonText?: string;\r\n\r\n  /**\r\n   * Texto do botão secundário. Só será exibido se showButtons for true e primaryButtonText também for fornecido.\r\n   */\r\n  @Prop() secondaryButtonText?: string;\r\n\r\n  /**\r\n   * Evento emitido quando o alerta é dispensado (fechado).\r\n   */\r\n  @Event() voaDismiss: EventEmitter<void>;\r\n\r\n  /**\r\n   * Evento emitido quando o botão primário é clicado.\r\n   */\r\n  @Event() voaPrimaryClick: EventEmitter<void>;\r\n\r\n  /**\r\n   * Evento emitido quando o botão secundário é clicado.\r\n   */\r\n  @Event() voaSecondaryClick: EventEmitter<void>;\r\n\r\n  /**\r\n   * Método para acessibilidade WCAG 2.2 AA\r\n   * Delega foco ao botão de fechar se existir\r\n   */\r\n  @Method()\r\n  async setFocus(): Promise<void> {\r\n    const closeBtn = this.host.shadowRoot?.querySelector('[part=\"close-button\"]') as HTMLElement;\r\n    if (closeBtn) {\r\n      closeBtn.focus();\r\n    }\r\n  }\r\n\r\n  private handleClose = (e: Event) => {\r\n    e.stopPropagation();\r\n    this.voaDismiss.emit();\r\n  };\r\n\r\n  private renderIcon() {\r\n    const iconType = this.variant === 'inline' && this.type === 'warning' ? 'warning-inline' : this.type;\r\n    const IconComponent = getAlertIcon(iconType, this.variant);\r\n    \r\n    return (\r\n      <div part=\"icon\" class=\"alert-icon\">\r\n        <IconComponent />\r\n      </div>\r\n    );\r\n  }\r\n\r\n  render() {\r\n    const hasButtons = this.variant === 'default' && this.showButtons && !!this.primaryButtonText;\r\n\r\n    return (\r\n      <Host \r\n        role=\"alert\" \r\n        aria-hidden={!this.closable ? null : \"false\"}\r\n      >\r\n        <div\r\n          part=\"base\"\r\n          class={{\r\n            'alert-container': true,\r\n            [`alert-${this.variant}`]: true,\r\n            [`alert-type-${this.type}`]: true\r\n          }}\r\n        >\r\n          <div part=\"content-wrapper\" class=\"content-wrapper\">\r\n            {this.renderIcon()}\r\n            \r\n            <div part=\"content\" class=\"content\">\r\n              {(this.alertTitle || this.description) ? (\r\n                <div class=\"text-group\">\r\n                   {this.alertTitle && <div part=\"title\" class=\"title\">{this.alertTitle}</div>}\r\n                   {this.variant === 'default' && this.description && (\r\n                     <div part=\"description\" class=\"description\">{this.description}</div>\r\n                   )}\r\n                </div>\r\n              ) : (\r\n                <slot />\r\n              )}\r\n            </div>\r\n\r\n            {this.closable && (\r\n              <button\r\n                part=\"close-button\"\r\n                type=\"button\"\r\n                class=\"close-button\"\r\n                onClick={this.handleClose}\r\n                aria-label={this.closeButtonLabel}\r\n              >\r\n                {getAlertIcon('close', this.variant)()}\r\n              </button>\r\n            )}\r\n          </div>\r\n\r\n          {/* Action Buttons */}\r\n          {hasButtons && (\r\n            <div part=\"actions\" class=\"actions-wrapper\">\r\n              {this.secondaryButtonText && (\r\n                <voa-button\r\n                  variant=\"ghost\"\r\n                  size=\"sm\"\r\n                  onDsClick={() => this.voaSecondaryClick.emit()}\r\n                  exportparts=\"base: secondary-btn-base\" \r\n                >\r\n                  {this.secondaryButtonText}\r\n                </voa-button>\r\n              )}\r\n              \r\n              <voa-button\r\n                variant=\"primary\"\r\n                size=\"sm\"\r\n                onDsClick={() => this.voaPrimaryClick.emit()}\r\n                exportparts=\"base: primary-btn-base\"\r\n              >\r\n                {this.primaryButtonText}\r\n              </voa-button>\r\n            </div>\r\n          )}\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n} "],"names":[],"mappings":"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"}

package/dist/voa/voa-avatar.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-avatar.entry.esm.js","sources":["src/components/voa-avatar/voa-avatar.css?tag=voa-avatar&encapsulation=shadow","src/components/voa-avatar/voa-avatar.tsx"],"sourcesContent":["/* \r\n * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n * \r\n * Design Tokens utilizados (aplicados externamente):\r\n * - --structure-colors-bg-elevated: Background do avatar (✅ existe em voa-tokens.css)\r\n * - --text-primary: Cor do texto/iniciais (✅ existe em voa-tokens.css, valor: #0b1215)\r\n * - --spacing-spacing-md: 16px (xs) (✅ existe em voa-tokens.css)\r\n * - --spacing-spacing-lg: 24px (sm) (✅ existe em voa-tokens.css)\r\n * - --spacing-spacing-xl: 32px (md) (✅ existe em voa-tokens.css)\r\n * - --spacing-spacing-xxl: 48px (lg) (✅ existe em voa-tokens.css)\r\n * - --spacing-spacing-xxxl: 56px (xl) (✅ existe em voa-tokens.css)\r\n * - --radius-round: Border-radius circular (✅ existe em voa-tokens.css, valor: 64rem)\r\n * \r\n * Exemplo de estilização externa:\r\n * voa-avatar::part(base) {\r\n *   background-color: var(--structure-colors-bg-elevated);\r\n *   border-radius: var(--radius-round);\r\n * }\r\n * voa-avatar::part(initials) {\r\n *   color: var(--text-primary);\r\n *   font-family: var(--font-family-body);\r\n *   font-weight: var(--font-weight-semibold);\r\n * }\r\n */\r\n\r\n:host {\r\n  display: inline-block;\r\n  \r\n  /* Definir variáveis CSS para tamanhos usando tokens semânticos */\r\n  --avatar-size-xs: var(--spacing-spacing-md); /* 16px */\r\n  --avatar-size-sm: var(--spacing-spacing-lg); /* 24px */\r\n  --avatar-size-md: var(--spacing-spacing-xl); /* 32px */\r\n  --avatar-size-lg: var(--spacing-spacing-xxl); /* 48px */\r\n  --avatar-size-xl: var(--spacing-spacing-xxxl); /* 56px */\r\n}\r\n\r\n.voa-avatar {\r\n  /* APENAS estilos estruturais */\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  position: relative;\r\n  overflow: hidden;\r\n  flex-shrink: 0;\r\n  box-sizing: border-box;\r\n  /* Border-radius será aplicado externamente via tokens */\r\n}\r\n\r\n/* Tamanhos do Avatar - usando tokens semânticos */\r\n.voa-avatar--xs {\r\n  width: var(--avatar-size-xs);\r\n  height: var(--avatar-size-xs);\r\n}\r\n\r\n.voa-avatar--sm {\r\n  width: var(--avatar-size-sm);\r\n  height: var(--avatar-size-sm);\r\n}\r\n\r\n.voa-avatar--md {\r\n  width: var(--avatar-size-md);\r\n  height: var(--avatar-size-md);\r\n}\r\n\r\n.voa-avatar--lg {\r\n  width: var(--avatar-size-lg);\r\n  height: var(--avatar-size-lg);\r\n}\r\n\r\n.voa-avatar--xl {\r\n  width: var(--avatar-size-xl);\r\n  height: var(--avatar-size-xl);\r\n}\r\n\r\n/* Estilos estruturais para imagem */\r\n.voa-avatar img {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n  display: block;\r\n  box-sizing: border-box;\r\n}\r\n\r\n/* Estilos estruturais para iniciais */\r\n.avatar-initials {\r\n  display: inline-block;\r\n  text-transform: uppercase;\r\n  user-select: none;\r\n  line-height: 1;\r\n  box-sizing: border-box;\r\n  /* Font-size, color, font-weight serão aplicados externamente via tokens */\r\n}\r\n\r\n/* Estilos estruturais para ícone */\r\n.avatar-icon {\r\n  width: 60%;\r\n  height: 60%;\r\n  display: block;\r\n  box-sizing: border-box;\r\n  /* Color será aplicado externamente via tokens */\r\n} ","import { Component, Host, Prop, Element, Method, h } from '@stencil/core';\r\n\r\n/**\r\n * Componente Avatar do Voa Design System, baseado no design do Figma.\r\n * Suporta exibição de ícone, iniciais ou imagem de perfil.\r\n * \r\n * O componente segue o padrão \"unstyled\" - apenas estrutura e lógica.\r\n * Estilos visuais devem ser aplicados externamente via CSS Parts API usando design tokens.\r\n * \r\n * @part base - O elemento raiz do avatar (container circular)\r\n * @part image - O elemento de imagem (quando type=\"photo\" e src é fornecido)\r\n * @part initials - O wrapper do texto de iniciais (quando type=\"initials\")\r\n * @part icon - O wrapper do ícone SVG padrão (quando type=\"icon\")\r\n */\r\n@Component({\r\n  tag: 'voa-avatar',\r\n  styleUrl: 'voa-avatar.css',\r\n  shadow: true,\r\n  scoped: false, // Permite herdar variáveis CSS do contexto pai\r\n})\r\nexport class VoaAvatar {\r\n  @Element() host: HTMLVoaAvatarElement;\r\n\r\n  /**\r\n   * Tipo de avatar a ser exibido.\r\n   * - 'icon': Exibe um ícone de usuário padrão\r\n   * - 'photo': Exibe uma imagem (requer prop src)\r\n   * - 'initials': Exibe iniciais de texto (requer prop initials)\r\n   */\r\n  @Prop() type: 'icon' | 'photo' | 'initials' = 'icon';\r\n\r\n  /**\r\n   * Tamanho do avatar.\r\n   * Mapeado do Figma: xs (16px), sm (24px), md (32px), lg (48px), xl (56px)\r\n   */\r\n  @Prop() size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' = 'md';\r\n\r\n  /**\r\n   * As iniciais a serem exibidas quando type=\"initials\".\r\n   */\r\n  @Prop() initials?: string;\r\n\r\n  /**\r\n   * URL da imagem do avatar quando type=\"photo\".\r\n   */\r\n  @Prop() src?: string;\r\n\r\n  /**\r\n   * Texto alternativo para a imagem do avatar.\r\n   */\r\n  @Prop() alt?: string;\r\n\r\n  /**\r\n   * Método para acessibilidade WCAG 2.2 AA.\r\n   * Delega foco ao elemento interno do avatar.\r\n   */\r\n  @Method()\r\n  async setFocus(): Promise<void> {\r\n    const focusable = this.host.shadowRoot?.querySelector('[part=\"base\"]') as HTMLElement;\r\n    if (focusable) {\r\n      focusable.focus();\r\n    }\r\n  }\r\n\r\n  private getAriaLabel(): string {\r\n    if (this.alt) {\r\n      return this.alt;\r\n    }\r\n    if (this.type === 'initials' && this.initials) {\r\n      return `Avatar com iniciais ${this.initials}`;\r\n    }\r\n    if (this.type === 'photo' && this.src) {\r\n      return 'Avatar com foto de perfil';\r\n    }\r\n    return 'Avatar de usuário';\r\n  }\r\n\r\n  private renderContent() {\r\n    switch (this.type) {\r\n      case 'photo':\r\n        if (this.src) {\r\n          return <img part=\"image\" src={this.src} alt={this.alt || 'Avatar'} />;\r\n        }\r\n        // Fallback para icon se src não fornecido\r\n        return this.renderIcon();\r\n      \r\n      case 'initials':\r\n        if (this.initials) {\r\n          return <span class=\"avatar-initials\" part=\"initials\">{this.initials}</span>;\r\n        }\r\n        // Fallback para icon se initials não fornecido\r\n        return this.renderIcon();\r\n      \r\n      case 'icon':\r\n      default:\r\n        return this.renderIcon();\r\n    }\r\n  }\r\n\r\n  private renderIcon() {\r\n    return (\r\n      <svg class=\"avatar-icon\" part=\"icon\" viewBox=\"0 0 24 24\" fill=\"currentColor\" aria-hidden=\"true\">\r\n        <path d=\"M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z\"/>\r\n      </svg>\r\n    );\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host\r\n        role=\"img\"\r\n        aria-label={this.getAriaLabel()}\r\n      >\r\n        <div\r\n          part=\"base\"\r\n          class={{\r\n            'voa-avatar': true,\r\n            [`voa-avatar--${this.size}`]: true,\r\n            [`voa-avatar--${this.type}`]: true,\r\n          }}\r\n        >\r\n          {this.renderContent()}\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n} "],"names":[],"mappings":";;AAAA,MAAM,YAAY,GAAG,ugCAAugC;;MCoB/gC,SAAS,GAAA,MAAA;AANtB,IAAA,WAAA,CAAA,OAAA,EAAA;;AASE;;;;;AAKG;AACK,QAAA,IAAI,CAAA,IAAA,GAAkC,MAAM;AAEpD;;;AAGG;AACK,QAAA,IAAI,CAAA,IAAA,GAAqC,IAAI;AA2FtD;AA1EC;;;AAGG;AAEH,IAAA,MAAM,QAAQ,GAAA;;AACZ,QAAA,MAAM,SAAS,GAAG,CAAA,EAAA,GAAA,IAAI,CAAC,IAAI,CAAC,UAAU,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,aAAa,CAAC,eAAe,CAAgB;QACrF,IAAI,SAAS,EAAE;YACb,SAAS,CAAC,KAAK,EAAE;;;IAIb,YAAY,GAAA;AAClB,QAAA,IAAI,IAAI,CAAC,GAAG,EAAE;YACZ,OAAO,IAAI,CAAC,GAAG;;QAEjB,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,IAAI,IAAI,CAAC,QAAQ,EAAE;AAC7C,YAAA,OAAO,CAAuB,oBAAA,EAAA,IAAI,CAAC,QAAQ,EAAE;;QAE/C,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,IAAI,CAAC,GAAG,EAAE;AACrC,YAAA,OAAO,2BAA2B;;AAEpC,QAAA,OAAO,mBAAmB;;IAGpB,aAAa,GAAA;AACnB,QAAA,QAAQ,IAAI,CAAC,IAAI;AACf,YAAA,KAAK,OAAO;AACV,gBAAA,IAAI,IAAI,CAAC,GAAG,EAAE;oBACZ,OAAO,WAAK,IAAI,EAAC,OAAO,EAAC,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,IAAI,QAAQ,GAAI;;;AAGvE,gBAAA,OAAO,IAAI,CAAC,UAAU,EAAE;AAE1B,YAAA,KAAK,UAAU;AACb,gBAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;AACjB,oBAAA,OAAO,CAAM,CAAA,MAAA,EAAA,EAAA,KAAK,EAAC,iBAAiB,EAAC,IAAI,EAAC,UAAU,EAAE,EAAA,IAAI,CAAC,QAAQ,CAAQ;;;AAG7E,gBAAA,OAAO,IAAI,CAAC,UAAU,EAAE;AAE1B,YAAA,KAAK,MAAM;AACX,YAAA;AACE,gBAAA,OAAO,IAAI,CAAC,UAAU,EAAE;;;IAItB,UAAU,GAAA;AAChB,QAAA,QACE,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,aAAa,EAAC,IAAI,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,cAAc,iBAAa,MAAM,EAAA,EAC7F,CAAA,CAAA,MAAA,EAAA,EAAM,CAAC,EAAC,+GAA+G,EAAE,CAAA,CACrH;;IAIV,MAAM,GAAA;AACJ,QAAA,QACE,CAAC,CAAA,IAAI,EACH,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,KAAK,EACE,YAAA,EAAA,IAAI,CAAC,YAAY,EAAE,EAAA,EAE/B,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,MAAM,EACX,KAAK,EAAE;AACL,gBAAA,YAAY,EAAE,IAAI;AAClB,gBAAA,CAAC,eAAe,IAAI,CAAC,IAAI,CAAE,CAAA,GAAG,IAAI;AAClC,gBAAA,CAAC,eAAe,IAAI,CAAC,IAAI,CAAE,CAAA,GAAG,IAAI;aACnC,EAAA,EAEA,IAAI,CAAC,aAAa,EAAE,CACjB,CACD;;;;;;;;"}

package/dist/voa/voa-badge.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-badge.entry.esm.js","sources":["src/components/voa-badge/voa-badge.css?tag=voa-badge&encapsulation=shadow","src/components/voa-badge/voa-badge.tsx"],"sourcesContent":["/* \r\n * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n */\r\n\r\n:host {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-badge__container {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-badge__label {\r\n  display: inline-block;\r\n}\r\n\r\n.voa-badge__counter {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.voa-badge__indicator {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  text-align: center;\r\n  white-space: pre-wrap;\r\n}\r\n\r\n.voa-badge__indicator-only {\r\n  display: inline-block;\r\n}\r\n\r\n.voa-badge__icon,\r\n.voa-badge__icon-leading,\r\n.voa-badge__icon-trailing {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.voa-badge__icon svg,\r\n.voa-badge__icon-leading svg,\r\n.voa-badge__icon-trailing svg {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n","import { Component, Prop, h, Host, Element, Method } from '@stencil/core';\r\nimport { Icons } from '../../utils/icons';\r\n\r\nexport interface VoaBadge {\r\n  /**\r\n   * O texto a ser exibido no badge (mapeado do Figma como \"label\")\r\n   */\r\n  label?: string;\r\n\r\n  /**\r\n   * O número a ser exibido como contador (para variantes indicator e indicator-overlay)\r\n   */\r\n  count?: number;\r\n\r\n  /**\r\n   * O nome do ícone a ser exibido (para variantes icon-only e icons)\r\n   */\r\n  icon?: 'success' | 'warning' | 'error' | 'info' | 'close' | 'check' | 'star' | 'heart' | 'bell';\r\n\r\n  /**\r\n   * A variante do badge conforme design do Figma\r\n   * - plain: Badge com texto apenas\r\n   * - icons: Badge com texto e ícones (leading/trailing)\r\n   * - icon-only: Badge apenas com ícone\r\n   * - indicator: Badge numérico (contador)\r\n   * - indicator-overlay: Badge numérico com fundo vermelho (danger)\r\n   * - indicator-only: Badge apenas indicador (ponto vermelho)\r\n   */\r\n  variant?: 'plain' | 'icons' | 'icon-only' | 'indicator' | 'indicator-overlay' | 'indicator-only';\r\n\r\n  /**\r\n   * Forma do badge conforme design do Figma\r\n   * - default: Forma retangular com bordas arredondadas\r\n   * - pill: Forma completamente arredondada (pill-shaped)\r\n   */\r\n  shape?: 'default' | 'pill';\r\n\r\n  /**\r\n   * Tamanho do badge conforme design do Figma\r\n   * - sm: Tamanho pequeno\r\n   * - md: Tamanho médio (padrão)\r\n   */\r\n  size?: 'sm' | 'md';\r\n}\r\n\r\n/**\r\n * Badge component para exibir indicadores visuais como texto, contadores ou status.\r\n * Baseado no design do Figma (node-id: 397-3352).\r\n * \r\n * O componente segue o padrão \"unstyled\" - apenas estrutura e lógica.\r\n * Estilos visuais devem ser aplicados externamente via CSS Parts API usando design tokens.\r\n * \r\n * @part base - O container interno do badge (onde as classes são aplicadas)\r\n * @part label - O wrapper do texto (para variantes plain e icons)\r\n * @part counter - O wrapper do número (para variantes indicator e indicator-overlay)\r\n * @part icon-leading - Container do ícone à esquerda (para variante icons)\r\n * @part icon-trailing - Container do ícone à direita (para variante icons)\r\n * @part icon - Container do ícone (para variante icon-only)\r\n * @part indicator - O indicador numérico ou ponto (para variantes indicator, indicator-overlay, indicator-only)\r\n * \r\n * @slot start - Slot para ícone no início do badge (usado em variante icons)\r\n * @slot end - Slot para ícone no final do badge (usado em variante icons)\r\n */\r\n@Component({\r\n  tag: 'voa-badge',\r\n  styleUrl: 'voa-badge.css',\r\n  shadow: true,\r\n  scoped: false, // Permite herdar variáveis CSS do contexto pai\r\n})\r\nexport class VoaBadgeComponent implements VoaBadge {\r\n  @Element() host: HTMLVoaBadgeElement;\r\n\r\n  /**\r\n   * O texto a ser exibido no badge (mapeado do Figma como \"label\")\r\n   */\r\n  @Prop({ reflect: true }) label?: string;\r\n\r\n  /**\r\n   * O número a ser exibido como contador (para variantes indicator e indicator-overlay)\r\n   */\r\n  @Prop() count?: number;\r\n\r\n  /**\r\n   * O nome do ícone a ser exibido (para variantes icon-only e icons)\r\n   */\r\n  @Prop({ reflect: true }) icon?: 'success' | 'warning' | 'error' | 'info' | 'close' | 'check' | 'star' | 'heart' | 'bell';\r\n\r\n  /**\r\n   * A variante do badge conforme design do Figma\r\n   */\r\n  @Prop() variant: 'plain' | 'icons' | 'icon-only' | 'indicator' | 'indicator-overlay' | 'indicator-only' = 'plain';\r\n\r\n  /**\r\n   * Forma do badge conforme design do Figma\r\n   */\r\n  @Prop({ reflect: true }) shape: 'default' | 'pill' = 'default';\r\n\r\n  /**\r\n   * Tamanho do badge conforme design do Figma\r\n   */\r\n  @Prop() size: 'sm' | 'md' = 'md';\r\n\r\n  /**\r\n   * Método para acessibilidade WCAG 2.2 AA\r\n   * Delega foco ao elemento interno nativo\r\n   */\r\n  @Method()\r\n  async setFocus(): Promise<void> {\r\n    const focusable = this.host.shadowRoot?.querySelector('[tabindex]') as HTMLElement;\r\n    if (focusable) {\r\n      focusable.focus();\r\n    }\r\n  }\r\n\r\n  private renderIcon(iconName: string) {\r\n    const IconComponent = Icons[iconName];\r\n    if (!IconComponent) {\r\n      console.warn(`Ícone não encontrado: ${iconName}`);\r\n      return null;\r\n    }\r\n    return <IconComponent />;\r\n  }\r\n\r\n  private getAriaLabel(): string {\r\n    if (this.variant === 'indicator' || this.variant === 'indicator-overlay') {\r\n      return `${this.count || 0} items`;\r\n    }\r\n    if (this.variant === 'indicator-only') {\r\n      return 'Notification indicator';\r\n    }\r\n    if (this.variant === 'icon-only') {\r\n      return 'Icon badge';\r\n    }\r\n    return this.label || 'Badge';\r\n  }\r\n\r\n  private getRole(): string {\r\n    // All indicator variants use role=\"status\" for dynamic updates\r\n    // Non-indicator variants use role=\"status\" as 'badge' is not a valid ARIA role\r\n    return 'status';\r\n  }\r\n\r\n  private getAriaLive(): 'polite' | 'off' {\r\n    // Only indicator variants need live region announcements\r\n    if (this.variant === 'indicator' || this.variant === 'indicator-overlay' || this.variant === 'indicator-only') {\r\n      return 'polite';\r\n    }\r\n    return 'off';\r\n  }\r\n\r\n  render() {\r\n    const containerClasses = {\r\n      'voa-badge__container': true,\r\n      [`voa-badge--${this.variant}`]: true,\r\n      [`voa-badge--${this.shape}`]: true,\r\n      [`voa-badge--${this.size}`]: true,\r\n    };\r\n\r\n    const renderContent = () => {\r\n      switch (this.variant) {\r\n        case 'plain':\r\n          return <span part=\"label\" class=\"voa-badge__label\">{this.label}</span>;\r\n\r\n        case 'icons':\r\n          return (\r\n            <div>\r\n              <span part=\"icon-leading\" class=\"voa-badge__icon-leading\">\r\n                <slot name=\"start\">\r\n                  {this.icon && this.renderIcon(this.icon)}\r\n                </slot>\r\n              </span>\r\n              <span part=\"label\" class=\"voa-badge__label\">{this.label}</span>\r\n              <span part=\"icon-trailing\" class=\"voa-badge__icon-trailing\">\r\n                <slot name=\"end\">\r\n                  {this.icon && this.renderIcon(this.icon)}\r\n                </slot>\r\n              </span>\r\n            </div>\r\n          );\r\n\r\n        case 'icon-only':\r\n          return (\r\n            <span part=\"icon\" class=\"voa-badge__icon\">\r\n              {this.icon && this.renderIcon(this.icon)}\r\n            </span>\r\n          );\r\n\r\n        case 'indicator':\r\n          return (\r\n            <span part=\"indicator\" class=\"voa-badge__indicator\" role=\"status\" aria-live=\"polite\">\r\n              {this.count !== undefined ? this.count : 0}\r\n            </span>\r\n          );\r\n\r\n        case 'indicator-overlay':\r\n          return (\r\n            <span part=\"indicator\" class=\"voa-badge__indicator\" role=\"status\" aria-live=\"polite\">\r\n              {this.count !== undefined ? this.count : 0}\r\n            </span>\r\n          );\r\n\r\n        case 'indicator-only':\r\n          return <span part=\"indicator\" class=\"voa-badge__indicator-only\" aria-hidden=\"true\"></span>;\r\n\r\n        default:\r\n          return null;\r\n      }\r\n    };\r\n\r\n    return (\r\n      <Host\r\n        role={this.getRole()}\r\n        aria-label={this.getAriaLabel()}\r\n        aria-live={this.getAriaLive()}\r\n      >\r\n        <div part=\"base\" class={containerClasses}>\r\n          {renderContent()}\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":"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"}

package/dist/voa/voa-breadcrumbs-divider.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-breadcrumbs-divider.entry.esm.js","sources":["src/components/voa-breadcrumbs-divider/voa-breadcrumbs-divider.css?tag=voa-breadcrumbs-divider&encapsulation=shadow","src/components/voa-breadcrumbs-divider/voa-breadcrumbs-divider.tsx"],"sourcesContent":["/* \r\n * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n * \r\n * IMPORTANT: NÃO incluir cores, fontes, espaçamentos ou valores hardcoded.\r\n * Apenas estrutura: display, position, flexbox, grid, box-sizing, cursor, etc.\r\n */\r\n\r\n:host {\r\n  display: inline-flex;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-breadcrumbs-divider {\r\n  /* APENAS estilos estruturais */\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  position: relative;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-breadcrumbs-divider__icon {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n  overflow: hidden;\r\n}\r\n\r\n/* Layout para o SVG interno */\r\n.voa-breadcrumbs-divider__icon svg {\r\n  display: block;\r\n  width: 100%;\r\n  height: 100%;\r\n  flex-shrink: 0;\r\n}\r\n\r\n","import { Component, Prop, h, Host } from '@stencil/core';\r\nimport { Icons } from '../../utils/icons';\r\n\r\n/**\r\n * Componente de divisor para breadcrumbs.\r\n * Baseado no design do Figma (node-id: 443-9825).\r\n * \r\n * O componente segue o padrão \"unstyled\" - apenas estrutura e lógica.\r\n * Estilos visuais devem ser aplicados externamente via CSS Parts API usando design tokens.\r\n * \r\n * @part base - O container interno do divisor\r\n * @part icon - O container do ícone SVG\r\n */\r\n@Component({\r\n  tag: 'voa-breadcrumbs-divider',\r\n  styleUrl: 'voa-breadcrumbs-divider.css',\r\n  shadow: true,\r\n  scoped: false, // Permite herdar variáveis CSS do contexto pai\r\n})\r\nexport class VoaBreadcrumbsDivider {\r\n  /**\r\n   * Tipo de ícone a ser exibido como divisor.\r\n   * Mapeia as variantes do Figma: chevron, arrow, arrow-alt.\r\n   */\r\n  @Prop({ reflect: true }) icon: 'chevron' | 'arrow' | 'arrow-alt' = 'chevron';\r\n\r\n  private getIconComponent() {\r\n    switch (this.icon) {\r\n      case 'chevron':\r\n        return Icons['chevron-right'];\r\n      case 'arrow':\r\n        return Icons['arrow-right'];\r\n      case 'arrow-alt':\r\n        return Icons['arrow-right-alt'];\r\n      default:\r\n        return Icons['chevron-right'];\r\n    }\r\n  }\r\n\r\n  render() {\r\n    const IconComponent = this.getIconComponent();\r\n\r\n    return (\r\n      <Host\r\n        role=\"separator\"\r\n        aria-hidden=\"true\"\r\n      >\r\n        <div\r\n          part=\"base\"\r\n          class={{\r\n            'voa-breadcrumbs-divider': true,\r\n            [`voa-breadcrumbs-divider--${this.icon}`]: true,\r\n          }}\r\n        >\r\n          <span part=\"icon\" class=\"voa-breadcrumbs-divider__icon\">\r\n            <IconComponent />\r\n          </span>\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n\r\n"],"names":[],"mappings":";;;AAAA,MAAM,wBAAwB,GAAG,kYAAkY;;MCmBtZ,qBAAqB,GAAA,MAAA;AANlC,IAAA,WAAA,CAAA,OAAA,EAAA;;AAOE;;;AAGG;AACsB,QAAA,IAAI,CAAA,IAAA,GAAsC,SAAS;AAqC7E;IAnCS,gBAAgB,GAAA;AACtB,QAAA,QAAQ,IAAI,CAAC,IAAI;AACf,YAAA,KAAK,SAAS;AACZ,gBAAA,OAAO,KAAK,CAAC,eAAe,CAAC;AAC/B,YAAA,KAAK,OAAO;AACV,gBAAA,OAAO,KAAK,CAAC,aAAa,CAAC;AAC7B,YAAA,KAAK,WAAW;AACd,gBAAA,OAAO,KAAK,CAAC,iBAAiB,CAAC;AACjC,YAAA;AACE,gBAAA,OAAO,KAAK,CAAC,eAAe,CAAC;;;IAInC,MAAM,GAAA;AACJ,QAAA,MAAM,aAAa,GAAG,IAAI,CAAC,gBAAgB,EAAE;AAE7C,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,IAAI,EAAC,WAAW,iBACJ,MAAM,EAAA,EAElB,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,MAAM,EACX,KAAK,EAAE;AACL,gBAAA,yBAAyB,EAAE,IAAI;AAC/B,gBAAA,CAAC,4BAA4B,IAAI,CAAC,IAAI,CAAE,CAAA,GAAG,IAAI;AAChD,aAAA,EAAA,EAED,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,+BAA+B,EAAA,EACrD,CAAA,CAAC,aAAa,EAAG,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACZ,CACH,CACD;;;;;;;"}

package/dist/voa/voa-breadcrumbs-item.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-breadcrumbs-item.entry.esm.js","sources":["src/components/voa-breadcrumbs-item/voa-breadcrumbs-item.css?tag=voa-breadcrumbs-item&encapsulation=shadow","src/components/voa-breadcrumbs-item/voa-breadcrumbs-item.tsx"],"sourcesContent":["/* \r\n * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n * \r\n * IMPORTANT: NÃO incluir cores, fontes, espaçamentos ou valores hardcoded.\r\n * Apenas estrutura: display, position, flexbox, grid, box-sizing, cursor, etc.\r\n */\r\n\r\n:host {\r\n  display: inline-flex;\r\n  align-items: center;\r\n}\r\n\r\n.breadcrumbs-item-wrapper {\r\n  display: inline-flex;\r\n  align-items: center;\r\n}\r\n\r\n.breadcrumbs-content {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  text-decoration: none;\r\n  color: inherit;\r\n  box-sizing: border-box;\r\n  cursor: pointer;\r\n}\r\n\r\n/* Remove pointer events/cursor for active (current) item */\r\n.breadcrumbs-content[aria-current=\"page\"] {\r\n  cursor: default;\r\n  pointer-events: none; \r\n}\r\n\r\n.breadcrumbs-separator {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  margin-inline: 0; /* Spacing handled via CSS Parts */\r\n  user-select: none;\r\n}\r\n\r\n/* * CRITICAL: Hide separator on the last item.\r\n * Since we are inside Shadow DOM, :host(:last-child) refers to the \r\n * custom element itself within the parent's light DOM/slot context.\r\n */\r\n:host(:last-of-type) .breadcrumbs-separator {\r\n  display: none;\r\n}\r\n\r\n/* Layout para o SVG interno do ícone */\r\n.voa-breadcrumbs-item__icon svg {\r\n  display: block;\r\n  width: 16px;\r\n  height: 16px;\r\n  position: absolute;\r\n  top: 50%;\r\n  left: 50%;\r\n  transform: translate(-50%, -50%);\r\n  flex-shrink: 0;\r\n}\r\n\r\n","import { Component, Prop, h, Host, Element } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'voa-breadcrumbs-item',\r\n  styleUrl: 'voa-breadcrumbs-item.css',\r\n  shadow: true,\r\n})\r\nexport class VoaBreadcrumbsItem {\r\n  @Element() host: HTMLElement;\r\n\r\n  /**\r\n   * HREF destination. If provided, renders an anchor tag.\r\n   * If missing, renders a span (current page or static item).\r\n   */\r\n  @Prop() href?: string;\r\n\r\n  /**\r\n   * Target for the link (e.g., _blank)\r\n   */\r\n  @Prop() target?: string;\r\n\r\n  /**\r\n   * Is this the current/active page?\r\n   */\r\n  @Prop({ reflect: true }) active: boolean = false;\r\n\r\n  render() {\r\n    // Determine the tag type\r\n    const Tag = this.href && !this.active ? 'a' : 'span';\r\n    \r\n    // Accessibility: Current page should rely on aria-current\r\n    const ariaCurrent = this.active ? 'page' : undefined;\r\n\r\n    return (\r\n      <Host>\r\n        <li class=\"breadcrumbs-item-wrapper\">\r\n          \r\n          {/* 1. The Content Part */}\r\n          <Tag \r\n            part=\"content\" \r\n            class=\"breadcrumbs-content\"\r\n            href={this.href}\r\n            target={this.target}\r\n            aria-current={ariaCurrent}\r\n          >\r\n            <slot />\r\n          </Tag>\r\n\r\n          {/* 2. The Separator Part \r\n            We render it always, and hide it via CSS for the last item.\r\n            This is much more robust than JS logic.\r\n          */}\r\n          <span part=\"separator\" class=\"breadcrumbs-separator\" aria-hidden=\"true\">\r\n             <slot name=\"separator\">\r\n               {/* Default Icon: Chevron Right */}\r\n               <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n                 <polyline points=\"9 18 15 12 9 6\"></polyline>\r\n               </svg>\r\n             </slot>\r\n          </span>\r\n\r\n        </li>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n\r\n"],"names":[],"mappings":";;AAAA,MAAM,qBAAqB,GAAG,woBAAwoB;;MCOzpB,kBAAkB,GAAA,MAAA;AAL/B,IAAA,WAAA,CAAA,OAAA,EAAA;;AAmBE;;AAEG;AACsB,QAAA,IAAM,CAAA,MAAA,GAAY,KAAK;AAyCjD;IAvCC,MAAM,GAAA;;AAEJ,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,GAAG,GAAG,MAAM;;AAGpD,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,MAAM,GAAG,MAAM,GAAG,SAAS;AAEpD,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAI,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,0BAA0B,EAAA,EAGlC,CAAC,CAAA,GAAG,qDACF,IAAI,EAAC,SAAS,EACd,KAAK,EAAC,qBAAqB,EAC3B,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,MAAM,EAAE,IAAI,CAAC,MAAM,EAAA,cAAA,EACL,WAAW,EAAA,EAEzB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAQ,CACJ,EAMN,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,WAAW,EAAC,KAAK,EAAC,uBAAuB,iBAAa,MAAM,EAAA,EACpE,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,WAAW,EAAA,EAEpB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,kBAAc,GAAG,EAAA,gBAAA,EAAgB,OAAO,EAAA,iBAAA,EAAiB,OAAO,EAAA,EAC/I,CAAU,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,MAAM,EAAC,gBAAgB,EAAY,CAAA,CACzC,CACD,CACH,CAEJ,CACA;;;;;;;;"}

package/dist/voa/voa-breadcrumbs.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-breadcrumbs.entry.esm.js","sources":["src/components/voa-breadcrumbs/voa-breadcrumbs.css?tag=voa-breadcrumbs&encapsulation=shadow","src/components/voa-breadcrumbs/voa-breadcrumbs.tsx"],"sourcesContent":["/* \r\n * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n * \r\n * IMPORTANT: NÃO incluir cores, fontes, espaçamentos ou valores hardcoded.\r\n * Apenas estrutura: display, position, flexbox, grid, box-sizing, cursor, etc.\r\n */\r\n\r\n:host {\r\n  display: inline-block;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-breadcrumbs {\r\n  display: inline-block;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.breadcrumbs-list {\r\n  display: flex;\r\n  align-items: center;\r\n  flex-wrap: wrap; /* Breadcrumbs should wrap on small screens */\r\n  margin: 0;\r\n  padding: 0;\r\n  list-style: none; /* Remove default list numbers */\r\n  gap: 0; /* Gaps handled by items */\r\n}\r\n\r\n","import { Component, Prop, h, Host, Element } from '@stencil/core';\r\n\r\n/**\r\n * Componente de breadcrumbs (navegação estrutural).\r\n * Baseado no design do Figma (node-id: 443-10022).\r\n * * @slot default - Items do breadcrumb (voa-breadcrumbs-item)\r\n */\r\n@Component({\r\n  tag: 'voa-breadcrumbs',\r\n  styleUrl: 'voa-breadcrumbs.css',\r\n  shadow: true,\r\n})\r\nexport class VoaBreadcrumbs {\r\n  @Element() host: HTMLVoaBreadcrumbsElement;\r\n\r\n  /**\r\n   * Variante visual do breadcrumb.\r\n   */\r\n  @Prop({ reflect: true }) type: 'default' | 'round' | 'outline' = 'default';\r\n\r\n  render() {\r\n    return (\r\n      <Host>\r\n        {/* Using <nav> and <ol> is the Semantic Standard for Breadcrumbs. \r\n          Screen readers will announce \"Navigation, list, X items\".\r\n        */}\r\n        <nav\r\n          part=\"base\"\r\n          aria-label=\"Breadcrumb\"\r\n          class={{\r\n            'voa-breadcrumbs': true,\r\n            [`voa-breadcrumbs--${this.type}`]: true,\r\n          }}\r\n        >\r\n          <ol part=\"list\" class=\"breadcrumbs-list\">\r\n            <slot></slot>\r\n          </ol>\r\n        </nav>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n\r\n"],"names":[],"mappings":";;AAAA,MAAM,iBAAiB,GAAG,0NAA0N;;MCYvO,cAAc,GAAA,MAAA;AAL3B,IAAA,WAAA,CAAA,OAAA,EAAA;;AAQE;;AAEG;AACsB,QAAA,IAAI,CAAA,IAAA,GAAoC,SAAS;AAuB3E;IArBC,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAIH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,MAAM,gBACA,YAAY,EACvB,KAAK,EAAE;AACL,gBAAA,iBAAiB,EAAE,IAAI;AACvB,gBAAA,CAAC,oBAAoB,IAAI,CAAC,IAAI,CAAE,CAAA,GAAG,IAAI;AACxC,aAAA,EAAA,EAED,CAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAI,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,kBAAkB,EAAA,EACtC,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACV,CACD,CACD;;;;;;;;"}

package/dist/voa/voa-button.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-button.entry.esm.js","sources":["src/components/voa-button/voa-button.css?tag=voa-button&encapsulation=shadow","src/components/voa-button/voa-button.tsx"],"sourcesContent":["/* \r\n * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n * \r\n * IMPORTANT: NÃO incluir cores, fontes, espaçamentos ou valores hardcoded.\r\n * Apenas estrutura: display, position, flexbox, grid, box-sizing, cursor, etc.\r\n */\r\n\r\n:host {\r\n  display: inline-block;\r\n  box-sizing: border-box;\r\n}\r\n\r\n/* Cursor must be on :host because pointer-events:none on button \r\n   causes cursor to \"pass through\" to parent element */\r\n:host([disabled]),\r\n:host([loading]) {\r\n  cursor: not-allowed;\r\n}\r\n\r\n.voa-button {\r\n  /* APENAS estilos estruturais */\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  position: relative;\r\n  box-sizing: border-box;\r\n  border: none; /* Remove borda padrão que afeta box-model */\r\n  background: transparent; /* Garante que não há fundo padrão */\r\n  padding: 0; /* Reset de padding */\r\n  margin: 0; /* Reset de margin */\r\n  \r\n  /* Interatividade básica */\r\n  cursor: pointer;\r\n  user-select: none;\r\n  \r\n  /* Layout Flex */\r\n  flex-direction: row;\r\n  flex-wrap: nowrap;\r\n  gap: 0; /* Gap padrão zerado, definido externamente */\r\n}\r\n\r\n.voa-button:disabled,\r\n.voa-button--loading {\r\n  cursor: not-allowed;\r\n  pointer-events: none;\r\n}\r\n\r\n/* Containers para ícones - estrutura apenas */\r\n.voa-button__icon-leading,\r\n.voa-button__icon-trailing {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.voa-button__loader {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n  /* Default size - can be overridden via ::part(loader) */\r\n  width: var(--voa-loader-size, 16px);\r\n  height: var(--voa-loader-size, 16px);\r\n  /* Structural animation - rotation is physics, not art */\r\n  animation: voa-spin var(--voa-loader-duration, 1s) linear infinite;\r\n}\r\n\r\n/* Keyframes must be inside Shadow DOM scope to be accessible */\r\n@keyframes voa-spin {\r\n  0% { transform: rotate(0deg); }\r\n  100% { transform: rotate(360deg); }\r\n}\r\n\r\n/* Ensure the default SVG fills the loader span */\r\n.voa-button__loader svg {\r\n  height: 100%;\r\n  width: 100%;\r\n}\r\n\r\n.voa-button__label {\r\n  display: inline-block;\r\n  flex-shrink: 0;\r\n}\r\n\r\n/* Layout para slots de ícones */\r\n.voa-button ::slotted([slot=\"icon-leading\"]),\r\n.voa-button ::slotted([slot=\"icon-trailing\"]) {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n}\r\n","import { Component, Host, h, Prop, Event, EventEmitter, Element, Method } from '@stencil/core';\r\n\r\n/**\r\n * Botão principal do Voa Design System, baseado no design do Figma.\r\n * \r\n * O componente segue o padrão \"unstyled\" (headless), fornecendo apenas estrutura e lógica.\r\n * Todos os estilos visuais devem ser aplicados externamente via CSS Parts API usando design tokens.\r\n * \r\n * @part base - O elemento raiz do botão (elemento <button>)\r\n * @part label - O wrapper do texto do botão\r\n * @part icon-leading - Container do slot para ícone à esquerda\r\n * @part icon-trailing - Container do slot para ícone à direita\r\n */\r\n@Component({\r\n  tag: 'voa-button',\r\n  styleUrl: 'voa-button.css',\r\n  shadow: true,\r\n  scoped: false, // Permite herdar variáveis CSS do contexto pai\r\n})\r\nexport class VoaButton {\r\n  @Element() host: HTMLVoaButtonElement;\r\n\r\n  /**\r\n   * Variante visual do botão.\r\n   * Mapeia as variantes do Figma: primary, secondary, tonal, ghost, link.\r\n   */\r\n  @Prop({ reflect: true }) variant: 'primary' | 'secondary' | 'tonal' | 'ghost' | 'link' = 'primary';\r\n\r\n  /**\r\n   * Tamanho do botão.\r\n   * Mapeia os tamanhos do Figma: sm (small), md (medium), lg (large).\r\n   */\r\n  @Prop({ reflect: true }) size: 'sm' | 'md' | 'lg' = 'lg';\r\n\r\n  /**\r\n   * Se verdadeiro, o botão estará desabilitado.\r\n   */\r\n  @Prop({ reflect: true }) disabled: boolean = false;\r\n\r\n  /**\r\n   * Se verdadeiro, o botão exibe um estado de carregamento (spinner)\r\n   * e desabilita interações.\r\n   */\r\n  @Prop({ reflect: true }) loading: boolean = false;\r\n\r\n  /**\r\n   * O texto exibido no botão.\r\n   * Pode ser fornecido via prop ou via slot padrão.\r\n   */\r\n  @Prop() label?: string;\r\n\r\n  /**\r\n   * Rótulo ARIA para acessibilidade.\r\n   * Usado quando o botão não tem texto visível (apenas ícone).\r\n   */\r\n  @Prop() ariaLabel: string;\r\n\r\n  /**\r\n   * Tipo do botão HTML.\r\n   * Padrão é 'button' para evitar submissão de formulários.\r\n   */\r\n  @Prop() type: 'button' | 'submit' | 'reset' = 'button';\r\n\r\n  /**\r\n   * Evento emitido ao clicar no botão.\r\n   * Segue o padrão kebab-case: dsClick.\r\n   */\r\n  @Event() dsClick: EventEmitter<void>;\r\n\r\n  /**\r\n   * Método para acessibilidade WCAG 2.2 AA.\r\n   * Delega foco ao elemento interno nativo.\r\n   */\r\n  @Method()\r\n  async setFocus(): Promise<void> {\r\n    const button = this.host.shadowRoot?.querySelector('button[part=\"base\"]') as HTMLButtonElement;\r\n    if (button) {\r\n      button.focus();\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Handler para clique no botão.\r\n   */\r\n  private handleClick = (ev?: MouseEvent) => {\r\n    if (this.disabled || this.loading) {\r\n      ev?.preventDefault();\r\n      ev?.stopPropagation();\r\n      return;\r\n    }\r\n    this.dsClick.emit();\r\n  };\r\n\r\n  /**\r\n   * Handler para navegação por teclado (WCAG 2.2 AA).\r\n   * Suporta Enter, Space para ativar, e Escape para cancelar (se aplicável).\r\n   */\r\n  private handleKeyDown = (event: KeyboardEvent) => {\r\n    if (this.disabled || this.loading) {\r\n      return;\r\n    }\r\n\r\n    switch (event.key) {\r\n      case 'Enter':\r\n      case ' ':\r\n        event.preventDefault();\r\n        this.handleClick();\r\n        break;\r\n      case 'Escape':\r\n        // Para botões que abrem modais/dropdowns, Escape fecha\r\n        // Para botões simples, não faz nada (comportamento padrão)\r\n        break;\r\n    }\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <Host>\r\n        <button\r\n          part=\"base\"\r\n          type={this.type}\r\n          class={{\r\n            'voa-button': true,\r\n            [`voa-button--${this.variant}`]: true,\r\n            [`voa-button--${this.size}`]: true,\r\n            'voa-button--disabled': this.disabled,\r\n            'voa-button--loading': this.loading,\r\n          }}\r\n          disabled={this.disabled || this.loading}\r\n          onClick={this.handleClick}\r\n          onKeyDown={this.handleKeyDown}\r\n          aria-disabled={this.disabled || this.loading ? 'true' : undefined}\r\n          aria-busy={this.loading ? 'true' : undefined}\r\n          aria-label={\r\n            this.loading \r\n              ? 'Loading' \r\n              : (this.ariaLabel || this.label)\r\n          }\r\n        >\r\n          {this.loading && (\r\n            <span part=\"loader\" class=\"voa-button__loader\">\r\n              <slot name=\"loader\">\r\n                <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n                   <path d=\"M12 2V6\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n                   <path d=\"M12 18V22\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n                   <path d=\"M4.93 4.93L7.76 7.76\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n                   <path d=\"M16.24 16.24L19.07 19.07\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n                   <path d=\"M2 12H6\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n                   <path d=\"M18 12H22\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n                   <path d=\"M4.93 19.07L7.76 16.24\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n                   <path d=\"M16.24 7.76L19.07 4.93\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n                </svg>\r\n              </slot>\r\n            </span>\r\n          )}\r\n          \r\n          {!this.loading && (\r\n            <span part=\"icon-leading\" class=\"voa-button__icon-leading\">\r\n              <slot name=\"icon-leading\"></slot>\r\n            </span>\r\n          )}\r\n          <span part=\"label\" class=\"voa-button__label\">\r\n            <slot>{this.label}</slot>\r\n          </span>\r\n          <span part=\"icon-trailing\" class=\"voa-button__icon-trailing\">\r\n            <slot name=\"icon-trailing\"></slot>\r\n          </span>\r\n        </button>\r\n      </Host>\r\n    );\r\n  }\r\n} "],"names":[],"mappings":"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"}

package/dist/voa/voa-card.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-card.entry.esm.js","sources":["src/components/voa-card/voa-card.css?tag=voa-card&encapsulation=shadow","src/components/voa-card/voa-card.tsx"],"sourcesContent":[":host {\r\n  display: block;\r\n}\r\n\r\n[part=\"base\"] {\r\n  display: flex;\r\n  flex-direction: column;\r\n  overflow: hidden;\r\n}\r\n\r\n[part=\"header\"] {\r\n  display: block;\r\n}\r\n\r\n[part=\"body\"] {\r\n  flex: 1;\r\n  display: block;\r\n}\r\n\r\n[part=\"footer\"] {\r\n  display: block;\r\n}\r\n","import { Component, Host, h } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'voa-card',\r\n  styleUrl: 'voa-card.css',\r\n  shadow: true,\r\n})\r\nexport class VoaCard {\r\n  render() {\r\n    return (\r\n      <Host>\r\n        <div part=\"base\">\r\n          <div part=\"header\">\r\n            <slot name=\"header\"></slot>\r\n          </div>\r\n          <div part=\"body\">\r\n            <slot></slot>\r\n          </div>\r\n          <div part=\"footer\">\r\n            <slot name=\"footer\"></slot>\r\n          </div>\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":";;AAAA,MAAM,UAAU,GAAG,8LAA8L;;MCOpM,OAAO,GAAA,MAAA;;;;IAClB,MAAM,GAAA;QACJ,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,MAAM,EAAA,EACd,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EAAA,EAChB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,QAAQ,EAAA,CAAQ,CACvB,EACN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,MAAM,EAAA,EACd,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,EACN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EAAA,EAChB,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EAAA,CAAQ,CACvB,CACF,CACD;;;;;;;"}

package/dist/voa/voa-checkbox.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-checkbox.entry.esm.js","sources":["src/components/voa-checkbox/voa-checkbox.css?tag=voa-checkbox&encapsulation=shadow","src/components/voa-checkbox/voa-checkbox.tsx"],"sourcesContent":["/* \r\n * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n * \r\n * IMPORTANT: NÃO incluir cores, fontes, espaçamentos ou valores hardcoded.\r\n * Apenas estrutura: display, position, flexbox, grid, box-sizing, cursor, etc.\r\n */\r\n\r\n:host {\r\n  display: inline-block;\r\n  box-sizing: border-box;\r\n  contain: content;\r\n  pointer-events: auto;\r\n}\r\n\r\n.checkbox-container {\r\n  /* APENAS estilos estruturais */\r\n  display: inline-flex;\r\n  align-items: center;\r\n  position: relative;\r\n  box-sizing: border-box;\r\n  user-select: none;\r\n  /* Gap estrutural - será aplicado via CSS custom property externamente */\r\n  gap: 0; /* Defaults to 0, overridable externally */\r\n}\r\n\r\n.checkbox-container.checkbox-disabled {\r\n  cursor: not-allowed;\r\n  pointer-events: none;\r\n  opacity: 0.5; /* Structural indication of disabled state */\r\n}\r\n\r\n.checkbox-container.checkbox-no-label {\r\n  gap: 0;\r\n}\r\n\r\n/* \r\n * The visual box of the checkbox.\r\n * MUST have default dimensions to exist in the layout flow.\r\n */\r\n.checkbox-custom {\r\n  /* Improved alignment */\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  position: relative;\r\n  flex-shrink: 0;\r\n  box-sizing: border-box;\r\n  \r\n  /* DEFAULT STRUCTURAL SIZE - 20px conforme Figma */\r\n  width: 20px;\r\n  height: 20px;\r\n}\r\n\r\n/* \r\n * We leave the ::after content management to the external CSS \r\n * OR we set basic display properties here so the external CSS \r\n * just has to toggle opacity/color.\r\n */\r\n.checkbox-custom::after {\r\n  content: '';\r\n  display: block;\r\n  position: absolute;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.checkbox-label {\r\n  /* APENAS estilos estruturais */\r\n  display: inline-block;\r\n  user-select: none;\r\n  box-sizing: border-box;\r\n  /* Ensure label doesn't collapse if empty slot */\r\n  min-height: 1em;\r\n}\r\n","import { Component, Host, h, Prop, Event, EventEmitter, Element, AttachInternals, State, Watch } from '@stencil/core';\r\n\r\nexport type CheckboxState = 'active' | 'inactive' | 'indeterminate';\r\n\r\n/**\r\n * Componente de checkbox que segue o design system VOA.\r\n * \r\n * O componente segue o padrão \"unstyled\" (headless), fornecendo apenas estrutura e lógica.\r\n * Todos os estilos visuais devem ser aplicados externamente via CSS Parts API usando design tokens.\r\n * \r\n * @part base - O elemento raiz do checkbox (elemento <div> no container)\r\n * @part indicator - O indicador visual do checkbox (caixa customizada)\r\n * @part label - O wrapper do texto do label\r\n * \r\n * @slot default - Conteúdo do label do checkbox\r\n */\r\n@Component({\r\n  tag: 'voa-checkbox',\r\n  styleUrl: 'voa-checkbox.css',\r\n  shadow: {\r\n    delegatesFocus: true, // Passes focus to the internal input/button automatically\r\n  },\r\n  formAssociated: true, // CRITICAL: Makes this work in <form> tags\r\n})\r\nexport class VoaCheckbox {\r\n  @Element() host: HTMLVoaCheckboxElement;\r\n  @AttachInternals() internals: ElementInternals;\r\n\r\n  /**\r\n   * Internal state to handle \"uncontrolled\" usage while keeping props immutable\r\n   */\r\n  @State() internalState: CheckboxState = 'inactive';\r\n\r\n  /**\r\n   * State of the checkbox.\r\n   * active = checked\r\n   * inactive = unchecked\r\n   * indeterminate = partial/mixed\r\n   */\r\n  @Prop({ reflect: true }) state: CheckboxState = 'inactive';\r\n\r\n  /**\r\n   * Se o checkbox está desabilitado.\r\n   */\r\n  @Prop({ reflect: true }) disabled: boolean = false;\r\n\r\n  /**\r\n   * Se o label deve ser exibido.\r\n   */\r\n  @Prop() showLabel: boolean = true;\r\n\r\n  /**\r\n   * Nome do checkbox para formulários.\r\n   */\r\n  @Prop() name: string;\r\n\r\n  /**\r\n   * Valor do checkbox para formulários.\r\n   */\r\n  @Prop() value: string = 'on'; // Default value if none provided\r\n\r\n  /**\r\n   * Emitido quando o estado do checkbox muda.\r\n   * Segue o padrão kebab-case: dsChange.\r\n   */\r\n  @Event() dsChange: EventEmitter<CheckboxState>;\r\n\r\n  componentWillLoad() {\r\n    this.internalState = this.state;\r\n    this.updateFormInternals();\r\n  }\r\n\r\n  /**\r\n   * Atualiza o estado interno e sincroniza com o Form Internals API\r\n   */\r\n  @Watch('state')\r\n  stateChanged(newValue: CheckboxState) {\r\n    this.internalState = newValue;\r\n    this.updateFormInternals();\r\n  }\r\n\r\n  /**\r\n   * Watch changes to internal state and update the reflected prop for CSS selectors\r\n   */\r\n  @Watch('internalState')\r\n  internalStateChanged() {\r\n    // Update the reflected state prop so CSS selectors work\r\n    this.state = this.internalState;\r\n  }\r\n\r\n  /**\r\n   * Syncs with the native Form API and Accessibility Tree\r\n   */\r\n  private updateFormInternals() {\r\n    const isChecked = this.internalState === 'active';\r\n\r\n    // 1. Form Value: Only 'active' submits the value by default in standard HTML\r\n    this.internals.setFormValue(isChecked ? this.value : null);\r\n\r\n    // 2. Accessibility State\r\n    let ariaChecked = 'false';\r\n    if (this.internalState === 'active') ariaChecked = 'true';\r\n    if (this.internalState === 'indeterminate') ariaChecked = 'mixed';\r\n\r\n    this.internals.ariaChecked = ariaChecked;\r\n    this.internals.ariaDisabled = this.disabled ? 'true' : 'false';\r\n  }\r\n\r\n  /**\r\n   * Handler para clique no checkbox.\r\n   */\r\n  private handleClick = (_ev: Event) => {\r\n    if (this.disabled) return;\r\n\r\n    // Logic: Indeterminate -> Active. Active -> Inactive. Inactive -> Active.\r\n    if (this.internalState === 'indeterminate' || this.internalState === 'inactive') {\r\n      this.internalState = 'active';\r\n    } else {\r\n      this.internalState = 'inactive';\r\n    }\r\n\r\n    this.updateFormInternals();\r\n    this.dsChange.emit(this.internalState);\r\n  };\r\n\r\n  /**\r\n   * Handler para navegação por teclado (WCAG 2.2 AA).\r\n   * Suporta Space para alternar estado.\r\n   */\r\n  private handleKeyDown = (event: KeyboardEvent) => {\r\n    if (this.disabled) return;\r\n\r\n    // Native checkbox activates on Space\r\n    if (event.key === ' ') {\r\n      event.preventDefault();\r\n      this.handleClick(event);\r\n    }\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <Host\r\n        onClick={this.handleClick}\r\n        onKeyDown={this.handleKeyDown}\r\n        tabIndex={this.disabled ? -1 : 0}\r\n        style={{ cursor: this.disabled ? 'not-allowed' : 'pointer' }}\r\n      >\r\n        <div\r\n          part=\"base\"\r\n          class={{\r\n            'checkbox-container': true,\r\n            'checkbox-disabled': this.disabled,\r\n            [`checkbox-${this.internalState}`]: true,\r\n            'checkbox-no-label': !this.showLabel,\r\n          }}\r\n        >\r\n          {/* Visual Indicator */}\r\n          <div class=\"checkbox-custom\" part=\"indicator\">\r\n            {/* Optional: You could render the checkmark/dash SVG here if \r\n              you wanted structural icons instead of pure CSS pseudo-elements.\r\n              For now, keeping it empty to match your CSS-only approach.\r\n            */}\r\n          </div>\r\n\r\n          {this.showLabel && (\r\n            <span class=\"checkbox-label\" part=\"label\">\r\n              <slot />\r\n            </span>\r\n          )}\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n} "],"names":[],"mappings":"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"}

package/dist/voa/voa-container-multi-select.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-container-multi-select.entry.esm.js","sources":["src/components/voa-select/voa-container-multi-select.css?tag=voa-container-multi-select&encapsulation=shadow","src/components/voa-select/voa-container-multi-select.tsx"],"sourcesContent":["/* \r\n * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n */\r\n\r\n:host {\r\n  display: block;\r\n  width: 100%;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-container-multi-select {\r\n  position: relative;\r\n  width: 100%;\r\n  min-height: 48px; /* Altura mínima equivalente ao input */\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-container-multi-select__inner {\r\n  position: relative;\r\n  width: 100%;\r\n  min-height: inherit;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-container-multi-select__items {\r\n  display: flex;\r\n  flex-wrap: wrap;\r\n  align-items: center;\r\n  gap: var(--structure-large-spacing-xs, 4px); /* Gap entre itens/badges - Figma: spacing/spacing-xs */\r\n  width: 100%;\r\n  min-height: inherit;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-container-multi-select__item {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  cursor: pointer;\r\n  user-select: none;\r\n  box-sizing: border-box;\r\n}\r\n\r\n/* ============================================\r\n   ESTILOS PARA BADGES ANINHADOS\r\n   ============================================ */\r\n/* \r\n * ⚠️ EXCEÇÃO AO PADRÃO \"UNSTYLED\":\r\n * \r\n * Normalmente, estilos visuais devem ser aplicados externamente via CSS Parts API.\r\n * Porém, quando um componente incorpora outro componente e ambos usam Shadow DOM,\r\n * CSS externo NÃO pode atravessar os limites do Shadow DOM.\r\n * \r\n * SOLUÇÃO (conforme documentação.md):\r\n * Os estilos para o badge incorporado devem ser aplicados DENTRO deste CSS\r\n * (mesmo contexto Shadow DOM), usando design tokens semânticos.\r\n * \r\n * Referência: documentation.md - \"⚠️ CRITICAL: Styling Embedded Components\"\r\n */\r\n\r\n/* Wrapper do badge para permitir clique */\r\n.voa-container-multi-select__badge-wrapper {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  cursor: pointer;\r\n  box-sizing: border-box;\r\n}\r\n\r\n/* Badge incorporado - estilos visuais usando design tokens */\r\n.voa-container-multi-select__badge-wrapper voa-badge {\r\n  cursor: pointer;\r\n  box-sizing: border-box;\r\n}\r\n\r\n/* Badge base - estilos visuais usando design tokens */\r\n/* Nota: Usamos seletores específicos para garantir que os estilos sejam aplicados\r\n   sobre os estilos padrão do badge, já que ambos os componentes usam Shadow DOM */\r\n.voa-container-multi-select__badge-wrapper voa-badge::part(base) {\r\n  /* Background - Figma: brand-base with 15% opacity */\r\n  background-color: var(--branding-coi-colors-light-primary-light-opacity-15, rgba(0, 100, 203, 0.15));\r\n  \r\n  /* Border - Figma: 1px dashed brand-base */\r\n  border: 1px dashed var(--branding-coi-colors-light-primary-light, #0064cb);\r\n  \r\n  /* Border-radius - Figma: pill shape (1024px from tokens) */\r\n  border-radius: var(--structure-large-radius-round, 1024px);\r\n  \r\n  /* Padding - Figma: 2px vertical, 4px horizontal */\r\n  padding-block: var(--structure-large-spacing-xxs, 2px);\r\n  padding-inline: var(--structure-large-spacing-xs, 4px);\r\n  \r\n  /* Tipografia - Figma: Lato Regular 16px / 24px */\r\n  font-family: var(--branding-coi-type-family-sans, 'Lato', sans-serif);\r\n  font-size: 16px;\r\n  font-weight: 400;\r\n  line-height: 24px;\r\n  font-style: normal;\r\n  \r\n  /* Cor do texto - Figma: brand-base */\r\n  color: var(--branding-coi-colors-light-primary-light, #0064cb);\r\n  \r\n  /* Box-sizing */\r\n  box-sizing: border-box;\r\n  \r\n  /* Transições */\r\n  transition: background-color 0.2s ease, border-color 0.2s ease;\r\n  \r\n  /* Display e layout */\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: var(--structure-large-spacing-xxs, 2px);\r\n}\r\n\r\n/* Hover state do badge */\r\n.voa-container-multi-select__badge-wrapper:hover voa-badge::part(base) {\r\n  background-color: var(--branding-coi-colors-light-primary-light-opacity-25, rgba(0, 100, 203, 0.25));\r\n  border-color: var(--branding-coi-colors-light-primary-light-400, #0071c8);\r\n}\r\n\r\n/* Label do badge */\r\n.voa-container-multi-select__badge-wrapper voa-badge::part(label) {\r\n  color: var(--branding-coi-colors-light-primary-light, #0064cb);\r\n  box-sizing: border-box;\r\n  white-space: nowrap;\r\n}\r\n\r\n/* Ícone leading - esconder quando não necessário */\r\n.voa-container-multi-select__badge-wrapper voa-badge::part(icon-leading) {\r\n  display: none;\r\n}\r\n\r\n/* Ícone trailing (close) do badge */\r\n.voa-container-multi-select__badge-wrapper voa-badge::part(icon-trailing) {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  cursor: pointer;\r\n  color: var(--branding-coi-colors-light-primary-light, #0064cb);\r\n  box-sizing: border-box;\r\n  flex-shrink: 0;\r\n  margin-left: var(--structure-large-spacing-xxs, 2px);\r\n}\r\n\r\n.voa-container-multi-select__badge-wrapper voa-badge::part(icon-trailing) svg {\r\n  width: 12px;\r\n  height: 12px;\r\n  display: block;\r\n  flex-shrink: 0;\r\n}\r\n\r\n/* Hover no ícone close */\r\n.voa-container-multi-select__badge-wrapper:hover voa-badge::part(icon-trailing) {\r\n  opacity: 0.8;\r\n}\r\n\r\n/* Disabled state */\r\n.voa-container-multi-select--disabled .voa-container-multi-select__badge-wrapper voa-badge::part(base) {\r\n  opacity: 0.5;\r\n  cursor: not-allowed;\r\n  pointer-events: none;\r\n}\r\n\r\n.voa-container-multi-select__placeholder {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: flex-start;\r\n  min-height: inherit;\r\n  width: 100%;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-container-multi-select--disabled {\r\n  cursor: not-allowed;\r\n  pointer-events: none;\r\n} ","import { Component, Prop, Event, EventEmitter, h, State } from '@stencil/core';\r\n\r\n/**\r\n * Componente Container Multi-Select do Voa Design System, baseado no design do Figma.\r\n * Permite selecionar múltiplos itens dentro de um contêiner.\r\n * \r\n * @part base - The root container element\r\n * @part inner - The inner container wrapper\r\n * @part items - The items container wrapper\r\n * @part item - Individual selectable item\r\n * @part placeholder - The placeholder text element\r\n */\r\n@Component({\r\n  tag: 'voa-container-multi-select',\r\n  styleUrl: 'voa-container-multi-select.css',\r\n  shadow: true,\r\n  scoped: false // Permite herdar variáveis CSS do contexto pai\r\n})\r\nexport class VoaContainerMultiSelect {\r\n  /**\r\n   * Lista de itens para seleção\r\n   */\r\n  @Prop() items: Array<{id: string, label: string, selected?: boolean}> = [];\r\n\r\n  /**\r\n   * Se verdadeiro, o contêiner estará desabilitado.\r\n   */\r\n  @Prop() disabled: boolean = false;\r\n\r\n  /**\r\n   * Texto de placeholder quando não há itens selecionados\r\n   */\r\n  @Prop() placeholder: string = 'Selecione os itens';\r\n\r\n  /**\r\n   * Estado interno dos itens selecionados\r\n   */\r\n  @State() selectedItems: string[] = [];\r\n\r\n  /**\r\n   * Evento emitido quando a seleção é alterada\r\n   */\r\n  @Event() voaSelectionChange: EventEmitter<string[]>;\r\n\r\n  componentWillLoad() {\r\n    // Inicializa os itens selecionados com base nos itens que já têm selected=true\r\n    this.syncSelectedItems();\r\n  }\r\n\r\n  componentDidUpdate() {\r\n    // Sincroniza quando items prop muda (chamado após cada render)\r\n    this.syncSelectedItems();\r\n  }\r\n\r\n  /**\r\n   * Sincroniza selectedItems quando items prop muda\r\n   * Usa componentDidUpdate porque @Watch pode não detectar mudanças em arrays por referência\r\n   */\r\n  private syncSelectedItems() {\r\n    // Atualiza os itens selecionados com base nos itens que têm selected=true\r\n    const newSelectedItems = this.items\r\n      .filter(item => item.selected)\r\n      .map(item => item.id);\r\n    \r\n    // Só atualiza se houver mudança para evitar loops infinitos\r\n    const currentSorted = [...this.selectedItems].sort().join(',');\r\n    const newSorted = [...newSelectedItems].sort().join(',');\r\n    \r\n    if (currentSorted !== newSorted) {\r\n      this.selectedItems = newSelectedItems;\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Verifica se um item está selecionado\r\n   */\r\n  private isItemSelected(itemId: string): boolean {\r\n    return this.selectedItems.includes(itemId);\r\n  }\r\n\r\n  /**\r\n   * Manipula o clique no badge (remove o item da seleção quando clicado)\r\n   */\r\n  private handleBadgeClick = (itemId: string) => {\r\n    if (!this.disabled) {\r\n      // Remove o item da seleção quando o badge é clicado (incluindo o ícone close)\r\n      this.selectedItems = this.selectedItems.filter(id => id !== itemId);\r\n      this.voaSelectionChange.emit(this.selectedItems);\r\n    }\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <div \r\n        part=\"base\"\r\n        class={{\r\n          'voa-container-multi-select': true,\r\n          'voa-container-multi-select--disabled': this.disabled\r\n        }}\r\n        aria-disabled={this.disabled ? 'true' : 'false'}\r\n        role=\"listbox\"\r\n        aria-multiselectable=\"true\"\r\n      >\r\n        <div class=\"voa-container-multi-select__inner\" part=\"inner\">\r\n          {(() => {\r\n            // Filtrar apenas os itens selecionados para renderizar no campo\r\n            const selectedItems = this.items.filter(item => {\r\n              const isSelected = item.selected === true || this.isItemSelected(item.id);\r\n              return isSelected;\r\n            });\r\n\r\n            // Se não há itens selecionados, mostrar placeholder\r\n            if (selectedItems.length === 0) {\r\n              return (\r\n                <div class=\"voa-container-multi-select__placeholder\" part=\"placeholder\">\r\n                  {this.placeholder}\r\n                </div>\r\n              );\r\n            }\r\n\r\n            // Renderizar apenas os itens selecionados como badges\r\n            return (\r\n              <div class=\"voa-container-multi-select__items\" part=\"items\">\r\n                {selectedItems.map(item => (\r\n                  <div\r\n                    key={item.id}\r\n                    class=\"voa-container-multi-select__badge-wrapper\"\r\n                    onClick={() => this.handleBadgeClick(item.id)}\r\n                    role=\"option\"\r\n                    aria-selected=\"true\"\r\n                    tabIndex={this.disabled ? -1 : 0}\r\n                  >\r\n                    <voa-badge\r\n                      label={item.label}\r\n                      variant=\"icons\"\r\n                      size=\"sm\"\r\n                      shape=\"pill\"\r\n                    >\r\n                      <svg slot=\"end\" width=\"12\" height=\"12\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n                        <path d=\"M18 6L6 18\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                        <path d=\"M6 6L18 18\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                      </svg>\r\n                    </voa-badge>\r\n                  </div>\r\n                ))}\r\n              </div>\r\n            );\r\n          })()}\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n} "],"names":[],"mappings":"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"}

package/dist/voa/voa-datepicker.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-datepicker.entry.esm.js","sources":["src/components/voa-datepicker/datepicker.css?tag=voa-datepicker&encapsulation=shadow","src/components/voa-datepicker/datepicker.tsx"],"sourcesContent":[".datepicker {\r\n  padding: 10px;\r\n  border: 1px solid #ccc;\r\n  border-radius: 4px;\r\n  font-size: 14px;\r\n  width: 100%;\r\n}\r\n","import { Component, Prop, h, State } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"voa-datepicker\",\r\n  styleUrl: \"datepicker.css\",\r\n  shadow: true,\r\n})\r\nexport class DatePicker {\r\n  @Prop() value: string;\r\n  @State() selectedDate: string;\r\n\r\n  private handleDateChange = (event: Event) => {\r\n    const input = event.target as HTMLInputElement;\r\n    this.selectedDate = input.value;\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <input\r\n        class=\"datepicker\"\r\n        type=\"date\"\r\n        value={this.selectedDate}\r\n        onInput={this.handleDateChange}\r\n      />\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":";;AAAA,MAAM,aAAa,GAAG,6FAA6F;;MCOtG,UAAU,GAAA,MAAA;AALvB,IAAA,WAAA,CAAA,OAAA,EAAA;;AASU,QAAA,IAAA,CAAA,gBAAgB,GAAG,CAAC,KAAY,KAAI;AAC1C,YAAA,MAAM,KAAK,GAAG,KAAK,CAAC,MAA0B;AAC9C,YAAA,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,KAAK;AACjC,SAAC;AAYF;IAVC,MAAM,GAAA;AACJ,QAAA,QACE,8DACE,KAAK,EAAC,YAAY,EAClB,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,IAAI,CAAC,YAAY,EACxB,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAC9B,CAAA;;;;;;;"}

package/dist/voa/voa-drawer.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-drawer.entry.esm.js","sources":["src/components/voa-drawer/drawer.css?tag=voa-drawer&encapsulation=shadow","src/components/voa-drawer/drawer.tsx"],"sourcesContent":[".drawer {\r\n  position: fixed;\r\n  top: 0;\r\n  left: 0;\r\n  height: 100%;\r\n  width: 250px;\r\n  background-color: #f4f4f4;\r\n  box-shadow: 2px 0 5px rgba(0, 0, 0, 0.3);\r\n  overflow-x: hidden;\r\n  transform: translateX(-100%);\r\n  transition: transform 0.3s ease-out;\r\n}\r\n\r\n.drawer.open {\r\n  transform: translateX(0);\r\n}\r\n","import { Component, Prop, State, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"voa-drawer\",\r\n  styleUrl: \"drawer.css\",\r\n  shadow: true,\r\n})\r\nexport class Drawer {\r\n  @Prop() open: boolean = false;\r\n  @State() isOpen: boolean = this.open;\r\n\r\n  toggleDrawer = () => {\r\n    this.isOpen = !this.isOpen;\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <div>\r\n        <button onClick={this.toggleDrawer}>\r\n          {this.isOpen ? \"Close Drawer\" : \"Open Drawer\"}\r\n        </button>\r\n        <div class={`drawer ${this.isOpen ? \"open\" : \"\"}`}>\r\n          <slot></slot>\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":";;AAAA,MAAM,SAAS,GAAG,qPAAqP;;MCO1P,MAAM,GAAA,MAAA;AALnB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAMU,QAAA,IAAI,CAAA,IAAA,GAAY,KAAK;AACpB,QAAA,IAAA,CAAA,MAAM,GAAY,IAAI,CAAC,IAAI;AAEpC,QAAA,IAAY,CAAA,YAAA,GAAG,MAAK;AAClB,YAAA,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM;AAC5B,SAAC;AAcF;IAZC,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACE,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,OAAO,EAAE,IAAI,CAAC,YAAY,IAC/B,IAAI,CAAC,MAAM,GAAG,cAAc,GAAG,aAAa,CACtC,EACT,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,UAAU,IAAI,CAAC,MAAM,GAAG,MAAM,GAAG,EAAE,CAAE,CAAA,EAAA,EAC/C,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT,CACF;;;;;;;"}

package/dist/voa/voa-dropdown.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-dropdown.entry.esm.js","sources":["src/components/voa-dropdown/dropdown.css?tag=voa-dropdown&encapsulation=shadow","src/components/voa-dropdown/dropdown.tsx"],"sourcesContent":[".dropdown {\r\n  position: relative;\r\n  display: inline-block;\r\n}\r\n\r\n.dropdown-button {\r\n  padding: 10px 20px;\r\n  border: 1px solid #ccc;\r\n  border-radius: 4px;\r\n  background-color: #fff;\r\n  cursor: pointer;\r\n  transition: background-color 0.2s;\r\n}\r\n\r\n.dropdown-list {\r\n  position: absolute;\r\n  top: 100%;\r\n  left: 0;\r\n  width: 100%;\r\n  border: 1px solid #ccc;\r\n  border-radius: 4px;\r\n  background-color: #fff;\r\n  list-style: none;\r\n  padding: 0;\r\n  margin: 0;\r\n  z-index: 1;\r\n}\r\n\r\n.dropdown-list li {\r\n  padding: 10px;\r\n  cursor: pointer;\r\n}\r\n\r\n.dropdown-list li:hover {\r\n  background-color: #f4f4f4;\r\n}\r\n","import { Component, Prop, State, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"voa-dropdown\",\r\n  styleUrl: \"dropdown.css\",\r\n  shadow: true,\r\n})\r\nexport class Dropdown {\r\n  @Prop() options: string[] = [];\r\n  @State() isOpen: boolean = false;\r\n  @State() selected: string;\r\n\r\n  toggleDropdown = () => {\r\n    this.isOpen = !this.isOpen;\r\n  };\r\n\r\n  selectOption = (option: string) => {\r\n    this.selected = option;\r\n    this.isOpen = false;\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <div class=\"dropdown\">\r\n        <button onClick={this.toggleDropdown} class=\"dropdown-button\">\r\n          {this.selected || \"Select an option\"}\r\n        </button>\r\n        {this.isOpen && (\r\n          <ul class=\"dropdown-list\">\r\n            {this.options.map((option) => (\r\n              <li onClick={() => this.selectOption(option)}>{option}</li>\r\n            ))}\r\n          </ul>\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":";;AAAA,MAAM,WAAW,GAAG,0cAA0c;;MCOjd,QAAQ,GAAA,MAAA;AALrB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAMU,QAAA,IAAO,CAAA,OAAA,GAAa,EAAE;AACrB,QAAA,IAAM,CAAA,MAAA,GAAY,KAAK;AAGhC,QAAA,IAAc,CAAA,cAAA,GAAG,MAAK;AACpB,YAAA,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM;AAC5B,SAAC;AAED,QAAA,IAAA,CAAA,YAAY,GAAG,CAAC,MAAc,KAAI;AAChC,YAAA,IAAI,CAAC,QAAQ,GAAG,MAAM;AACtB,YAAA,IAAI,CAAC,MAAM,GAAG,KAAK;AACrB,SAAC;AAkBF;IAhBC,MAAM,GAAA;QACJ,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,UAAU,EAAA,EACnB,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,OAAO,EAAE,IAAI,CAAC,cAAc,EAAE,KAAK,EAAC,iBAAiB,IAC1D,IAAI,CAAC,QAAQ,IAAI,kBAAkB,CAC7B,EACR,IAAI,CAAC,MAAM,KACV,CAAI,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,eAAe,EAAA,EACtB,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,MACvB,CAAI,CAAA,IAAA,EAAA,EAAA,OAAO,EAAE,MAAM,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,EAAG,EAAA,MAAM,CAAM,CAC5D,CAAC,CACC,CACN,CACG;;;;;;;"}

package/dist/voa/voa-input-addon.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-input-addon.entry.esm.js","sources":["src/components/voa-input-addon/voa-input-addon.css?tag=voa-input-addon&encapsulation=shadow","src/components/voa-input-addon/voa-input-addon.tsx"],"sourcesContent":["/* \r\n * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n */\r\n\r\n:host {\r\n  display: inline-flex;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-input-addon__base {\r\n  display: flex;\r\n  align-items: center;\r\n  box-sizing: border-box;\r\n  height: 100%;\r\n}\r\n\r\n.voa-input-addon--interactive .voa-input-addon__base {\r\n  cursor: pointer;\r\n  user-select: none;\r\n}\r\n\r\n.voa-input-addon__content {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--spacing-spacing-xxs, 2px);\r\n  box-sizing: border-box;\r\n  width: 100%;\r\n  height: 100%;\r\n}\r\n\r\n.voa-input-addon__text {\r\n  display: inline-block;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-input-addon__icon,\r\n.voa-input-addon__flag-icon,\r\n.voa-input-addon__dropdown-icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-input-addon__flag-icon {\r\n  width: 24px;\r\n  height: 24px;\r\n  border-radius: 100px;\r\n}\r\n\r\n.voa-input-addon__button-text {\r\n  display: inline-block;\r\n  box-sizing: border-box;\r\n}\r\n\r\n","import { Component, Host, h, Prop, Event, EventEmitter, Element, Method } from '@stencil/core';\r\n\r\n/**\r\n * Componente Input-Addon para elementos auxiliares em inputs.\r\n * \r\n * Baseado no design do Figma: https://www.figma.com/design/wDStUEuqpl7Tu1oHpiAml6/Voa-Design-System?node-id=438-2157\r\n * \r\n * O componente segue o padrão \"unstyled\" (headless), fornecendo apenas estrutura e lógica.\r\n * Todos os estilos visuais devem ser aplicados externamente via CSS Parts API usando design tokens.\r\n * \r\n * @part base - O elemento raiz do addon\r\n * @part content - O conteúdo do addon\r\n * @part icon - O ícone (quando aplicável)\r\n * @part text - O texto do addon\r\n * @part dropdown-icon - O ícone de dropdown (quando aplicável)\r\n */\r\n@Component({\r\n  tag: 'voa-input-addon',\r\n  styleUrl: 'voa-input-addon.css',\r\n  shadow: true,\r\n  scoped: false,\r\n})\r\nexport class VoaInputAddon {\r\n  @Element() host: HTMLElement;\r\n\r\n  /**\r\n   * Variante do addon\r\n   */\r\n  @Prop({ reflect: true }) variant: 'label' | 'select' | 'flags' | 'button' | 'clear' | 'shortcut' | 'currency-pre' | 'currency-post' = 'label';\r\n\r\n  /**\r\n   * Texto do label/prepend (para variantes label, select)\r\n   */\r\n  @Prop() prependContent?: string = 'http://';\r\n\r\n  /**\r\n   * Código do país (para variante flags)\r\n   */\r\n  @Prop() countryCode?: string = 'BR +55';\r\n\r\n  /**\r\n   * Texto do botão (para variante button)\r\n   */\r\n  @Prop() buttonLabel?: string = 'Procurar...';\r\n\r\n  /**\r\n   * Símbolo da moeda (para variante currency-pre)\r\n   */\r\n  @Prop() currency?: string = 'R$';\r\n\r\n  /**\r\n   * Nome da moeda (para variante currency-post)\r\n   */\r\n  @Prop() currencyName?: string = 'Real';\r\n\r\n  /**\r\n   * Tecla do atalho (para variante shortcut)\r\n   */\r\n  @Prop() shortcut?: string = 'S';\r\n\r\n  /**\r\n   * Plataforma do atalho (para variante shortcut)\r\n   */\r\n  @Prop() platform?: 'mac' | 'win' = 'mac';\r\n\r\n  /**\r\n   * Evento emitido quando o addon é clicado (para variantes interativas)\r\n   */\r\n  @Event() dsClick: EventEmitter<void>;\r\n\r\n  /**\r\n   * Método para acessibilidade WCAG 2.2 AA.\r\n   * Delega foco ao elemento interno nativo.\r\n   */\r\n  @Method()\r\n  async setFocus(): Promise<void> {\r\n    const focusable = this.host.shadowRoot?.querySelector('[tabindex]') as HTMLElement;\r\n    if (focusable) {\r\n      focusable.focus();\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Handler para clique no addon\r\n   */\r\n  private handleClick = () => {\r\n    this.dsClick.emit();\r\n  };\r\n\r\n  /**\r\n   * Handler para navegação por teclado (WCAG 2.2 AA).\r\n   */\r\n  private handleKeyDown = (event: KeyboardEvent) => {\r\n    switch (event.key) {\r\n      case 'Enter':\r\n      case ' ':\r\n        event.preventDefault();\r\n        this.handleClick();\r\n        break;\r\n    }\r\n  };\r\n\r\n  render() {\r\n    const isInteractive = ['button', 'select', 'flags', 'currency-post', 'clear'].includes(this.variant);\r\n\r\n    return (\r\n      <Host\r\n        class={{\r\n          'voa-input-addon': true,\r\n          [`voa-input-addon--${this.variant}`]: true,\r\n          'voa-input-addon--interactive': isInteractive,\r\n        }}\r\n      >\r\n        <div\r\n          part=\"base\"\r\n          class=\"voa-input-addon__base\"\r\n          onClick={isInteractive ? this.handleClick : undefined}\r\n          onKeyDown={isInteractive ? this.handleKeyDown : undefined}\r\n          role={isInteractive ? 'button' : undefined}\r\n          tabindex={isInteractive ? 0 : undefined}\r\n          aria-label={this.getAriaLabel()}\r\n        >\r\n          {this.renderContent()}\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n\r\n  private getAriaLabel(): string | undefined {\r\n    switch (this.variant) {\r\n      case 'button':\r\n        return this.buttonLabel || 'Botão';\r\n      case 'clear':\r\n        return 'Limpar campo';\r\n      case 'select':\r\n        return `Selecionar ${this.prependContent || 'opção'}`;\r\n      case 'flags':\r\n        return `Selecionar país ${this.countryCode || ''}`;\r\n      case 'currency-post':\r\n        return `Selecionar moeda ${this.currencyName || ''}`;\r\n      default:\r\n        return undefined;\r\n    }\r\n  }\r\n\r\n  private renderContent() {\r\n    switch (this.variant) {\r\n      case 'currency-pre':\r\n        return (\r\n          <div part=\"content\" class=\"voa-input-addon__content\">\r\n            <span part=\"text\" class=\"voa-input-addon__text\">\r\n              {this.currency}\r\n            </span>\r\n          </div>\r\n        );\r\n\r\n      case 'select':\r\n        return (\r\n          <div part=\"content\" class=\"voa-input-addon__content\">\r\n            <span part=\"text\" class=\"voa-input-addon__text\">\r\n              {this.prependContent}\r\n            </span>\r\n            <span part=\"dropdown-icon\" class=\"voa-input-addon__dropdown-icon\">\r\n              <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n                <path\r\n                  d=\"M7 10L12 15L17 10\"\r\n                  stroke=\"currentColor\"\r\n                  stroke-width=\"2\"\r\n                  stroke-linecap=\"round\"\r\n                  stroke-linejoin=\"round\"\r\n                />\r\n              </svg>\r\n            </span>\r\n          </div>\r\n        );\r\n\r\n      case 'clear':\r\n        return (\r\n          <div part=\"content\" class=\"voa-input-addon__content\">\r\n            <span part=\"icon\" class=\"voa-input-addon__icon\">\r\n              <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n                <path\r\n                  d=\"M18 6L6 18M6 6L18 18\"\r\n                  stroke=\"currentColor\"\r\n                  stroke-width=\"2\"\r\n                  stroke-linecap=\"round\"\r\n                  stroke-linejoin=\"round\"\r\n                />\r\n              </svg>\r\n            </span>\r\n          </div>\r\n        );\r\n\r\n      case 'flags':\r\n        return (\r\n          <div part=\"content\" class=\"voa-input-addon__content\">\r\n            <span part=\"icon\" class=\"voa-input-addon__flag-icon\"></span>\r\n            <span part=\"text\" class=\"voa-input-addon__text\">\r\n              {this.countryCode}\r\n            </span>\r\n            <span part=\"dropdown-icon\" class=\"voa-input-addon__dropdown-icon\">\r\n              <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n                <path\r\n                  d=\"M7 10L12 15L17 10\"\r\n                  stroke=\"currentColor\"\r\n                  stroke-width=\"2\"\r\n                  stroke-linecap=\"round\"\r\n                  stroke-linejoin=\"round\"\r\n                />\r\n              </svg>\r\n            </span>\r\n          </div>\r\n        );\r\n\r\n      case 'button':\r\n        return (\r\n          <div part=\"content\" class=\"voa-input-addon__content\">\r\n            <span part=\"text\" class=\"voa-input-addon__button-text\">\r\n              {this.buttonLabel}\r\n            </span>\r\n          </div>\r\n        );\r\n\r\n      case 'currency-post':\r\n        return (\r\n          <div part=\"content\" class=\"voa-input-addon__content\">\r\n            <span part=\"text\" class=\"voa-input-addon__text\">\r\n              {this.currencyName}\r\n            </span>\r\n            <span part=\"dropdown-icon\" class=\"voa-input-addon__dropdown-icon\">\r\n              <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n                <path\r\n                  d=\"M7 10L12 15L17 10\"\r\n                  stroke=\"currentColor\"\r\n                  stroke-width=\"2\"\r\n                  stroke-linecap=\"round\"\r\n                  stroke-linejoin=\"round\"\r\n                />\r\n              </svg>\r\n            </span>\r\n          </div>\r\n        );\r\n\r\n      case 'shortcut':\r\n        return (\r\n          <div part=\"content\" class=\"voa-input-addon__content\">\r\n            <voa-keybinding shortcut={this.shortcut} platform={this.platform}></voa-keybinding>\r\n          </div>\r\n        );\r\n\r\n      case 'label':\r\n      default:\r\n        return (\r\n          <div part=\"content\" class=\"voa-input-addon__content\">\r\n            <span part=\"text\" class=\"voa-input-addon__text\">\r\n              {this.prependContent}\r\n            </span>\r\n          </div>\r\n        );\r\n    }\r\n  }\r\n}\r\n\r\n"],"names":[],"mappings":"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"}

package/dist/voa/voa-input.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-input.entry.esm.js","sources":["src/components/voa-input/voa-input.css?tag=voa-input&encapsulation=shadow","src/components/voa-input/voa-input.tsx"],"sourcesContent":["/* \r\n * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n */\r\n\r\n:host {\r\n  display: block;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-input__title-row {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-input__label {\r\n  display: block;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-input__info {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 4px;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-input__info-icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.voa-input__required-indicator {\r\n  display: inline;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-input__container {\r\n  position: relative;\r\n  display: flex;\r\n  align-items: center;\r\n  box-sizing: border-box;\r\n  overflow: hidden;\r\n}\r\n\r\n.voa-input__prefix {\r\n  display: flex;\r\n  align-items: center;\r\n  flex-shrink: 0;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-input__suffix {\r\n  display: flex;\r\n  align-items: center;\r\n  flex-shrink: 0;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-input__input {\r\n  flex: 1 1 0%;\r\n  min-width: 0;\r\n  width: 100%;\r\n  border: none;\r\n  outline: none;\r\n  background: transparent;\r\n  box-sizing: border-box;\r\n  display: block;\r\n}\r\n\r\n.voa-input__input:disabled {\r\n  cursor: not-allowed;\r\n}\r\n\r\n.voa-input__input:read-only {\r\n  cursor: default;\r\n}\r\n\r\n.voa-input__helper-text {\r\n  display: block;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.is-hidden {\r\n  display: none !important;\r\n}\r\n","import { Component, Host, h, Prop, State, Event, EventEmitter, Element, Method, Watch } from '@stencil/core';\r\n\r\n/**\r\n * Componente de input para entrada de dados do Voa Design System.\r\n * \r\n * Baseado no design do Figma, seguindo o padrão \"unstyled\" (headless).\r\n * Todos os estilos visuais devem ser aplicados externamente via CSS Parts API usando design tokens.\r\n * \r\n * @part base - O elemento raiz do componente\r\n * @part title-row - Container do titulo (label + info)\r\n * @part label - O elemento de label\r\n * @part info - Container da informacao adicional\r\n * @part info-icon - O ícone de informação\r\n * @part container - O wrapper do input (border, background)\r\n * @part input - O elemento input nativo\r\n * @part prefix - O wrapper do slot prefix\r\n * @part suffix - O wrapper do slot suffix\r\n * @part helper-text - O elemento de texto auxiliar/erro\r\n */\r\n@Component({\r\n  tag: 'voa-input',\r\n  styleUrl: 'voa-input.css',\r\n  shadow: true,\r\n  scoped: false, // Permite herdar variáveis CSS do contexto pai\r\n})\r\nexport class VoaInput {\r\n  @Element() host: HTMLVoaInputElement;\r\n\r\n  /**\r\n   * ID do elemento input\r\n   */\r\n  @Prop() inputId?: string;\r\n\r\n  /**\r\n   * Tipo do input (text, password, email, search, tel, etc.)\r\n   */\r\n  @Prop() type: string = 'text';\r\n\r\n  /**\r\n   * Nome do elemento input\r\n   */\r\n  @Prop() name?: string;\r\n\r\n  /**\r\n   * Valor do input\r\n   */\r\n  @Prop() value?: string = '';\r\n\r\n  /**\r\n   * Texto de placeholder\r\n   */\r\n  @Prop() placeholder?: string;\r\n\r\n  /**\r\n   * Texto do label\r\n   */\r\n  @Prop() label?: string;\r\n\r\n  /**\r\n   * Texto auxiliar ou mensagem de erro\r\n   */\r\n  @Prop() helperText?: string;\r\n\r\n  /**\r\n   * Indica se o campo está em estado de erro\r\n   */\r\n  @Prop({ reflect: true }) error: boolean = false;\r\n\r\n  /**\r\n   * Indica se o campo está em estado de sucesso\r\n   */\r\n  @Prop({ reflect: true }) valid: boolean = false;\r\n\r\n  /**\r\n   * Indica se o campo está em estado de aviso\r\n   */\r\n  @Prop({ reflect: true }) warning: boolean = false;\r\n\r\n  /**\r\n   * Indica se o campo está desabilitado\r\n   */\r\n  @Prop({ reflect: true }) disabled: boolean = false;\r\n\r\n  /**\r\n   * Indica se o campo é somente leitura\r\n   */\r\n  @Prop({ reflect: true }) readonly: boolean = false;\r\n\r\n  /**\r\n   * Indica se o campo é obrigatório\r\n   */\r\n  @Prop({ reflect: true }) required: boolean = false;\r\n\r\n  /**\r\n   * Variante de preenchimento (filled vs unfilled)\r\n   */\r\n  @Prop({ reflect: true }) fill: boolean = true;\r\n\r\n  /**\r\n   * Tamanho do input\r\n   */\r\n  @Prop({ reflect: true }) size: 'sm' | 'md' | 'lg' = 'md';\r\n\r\n  /**\r\n   * Mostrar ícone de informação na área de info\r\n   */\r\n  @Prop() showInfoIcon: boolean = true;\r\n\r\n  /**\r\n   * Estado interno que controla se o campo está em foco\r\n   */\r\n  @State() isFocused: boolean = false;\r\n\r\n  @State() hasPrefix: boolean = false;\r\n  @State() hasSuffix: boolean = false;\r\n  @State() hasInfo: boolean = false;\r\n\r\n  /**\r\n   * Valor interno do input\r\n   */\r\n  @State() internalValue: string = '';\r\n\r\n  @Watch('value')\r\n  valueChanged(newValue: string) {\r\n    this.internalValue = newValue;\r\n  }\r\n\r\n  /**\r\n   * Referência ao elemento input nativo\r\n   */\r\n  private inputRef?: HTMLInputElement;\r\n\r\n  /**\r\n   * Evento emitido quando o valor é alterado\r\n   */\r\n  @Event() dsChange: EventEmitter<string>;\r\n\r\n  /**\r\n   * Evento emitido durante a digitação\r\n   */\r\n  @Event() dsInput: EventEmitter<string>;\r\n\r\n  /**\r\n   * Evento emitido quando o campo ganha foco\r\n   */\r\n  @Event() dsFocus: EventEmitter<FocusEvent>;\r\n\r\n  /**\r\n   * Evento emitido quando o campo perde foco\r\n   */\r\n  @Event() dsBlur: EventEmitter<FocusEvent>;\r\n\r\n  /**\r\n   * Gera um ID único se não fornecido\r\n   */\r\n  private generateId(): string {\r\n    if (this.inputId) {\r\n      return this.inputId;\r\n    }\r\n    return `voa-input-${Math.random().toString(36).substr(2, 9)}`;\r\n  }\r\n\r\n  /**\r\n   * ID do input gerado ou fornecido\r\n   */\r\n  private inputIdValue: string = '';\r\n\r\n  componentWillLoad() {\r\n    this.inputIdValue = this.generateId();\r\n    this.internalValue = this.value || '';\r\n    this.checkSlots();\r\n  }\r\n\r\n  private checkSlots = () => {\r\n    this.hasPrefix = !!this.host.querySelector('[slot=\"prefix\"]');\r\n    this.hasSuffix = !!this.host.querySelector('[slot=\"suffix\"]');\r\n    this.hasInfo = !!this.host.querySelector('[slot=\"info\"]');\r\n  };\r\n\r\n  /**\r\n   * Gerenciador de evento de input\r\n   */\r\n  private handleInput = (event: Event) => {\r\n    const input = event.target as HTMLInputElement;\r\n    this.internalValue = input.value;\r\n    this.dsInput.emit(this.internalValue);\r\n  };\r\n\r\n  /**\r\n   * Gerenciador de evento de change\r\n   */\r\n  private handleChange = (event: Event) => {\r\n    const input = event.target as HTMLInputElement;\r\n    this.internalValue = input.value;\r\n    this.dsChange.emit(this.internalValue);\r\n  };\r\n\r\n  /**\r\n   * Gerenciador de evento de focus\r\n   */\r\n  private handleFocus = (event: FocusEvent) => {\r\n    this.isFocused = true;\r\n    this.dsFocus.emit(event);\r\n  };\r\n\r\n  /**\r\n   * Gerenciador de evento de blur\r\n   */\r\n  private handleBlur = (event: FocusEvent) => {\r\n    this.isFocused = false;\r\n    this.dsBlur.emit(event);\r\n  };\r\n\r\n  /**\r\n   * Método para acessibilidade WCAG 2.2 AA.\r\n   * Delega foco ao elemento interno nativo.\r\n   */\r\n  @Method()\r\n  async setFocus(): Promise<void> {\r\n    if (this.inputRef) {\r\n      this.inputRef.focus();\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Handler para navegação por teclado (WCAG 2.2 AA).\r\n   */\r\n  private handleKeyDown = (event: KeyboardEvent) => {\r\n    if (this.disabled || this.readonly) {\r\n      return;\r\n    }\r\n\r\n    // Permitir navegação normal por teclado\r\n    // Enter e Space já são tratados pelo input nativo\r\n    switch (event.key) {\r\n      case 'Escape':\r\n        // Se o input tiver valor, limpar pode ser útil\r\n        // Mas não implementamos isso por padrão para não quebrar UX\r\n        break;\r\n    }\r\n  };\r\n\r\n  render() {\r\n    const helperTextId = `${this.inputIdValue}-helper`;\r\n    const hasTitleRow = !!this.label || this.hasInfo;\r\n\r\n    return (\r\n      <Host\r\n        part=\"base\"\r\n        class={{\r\n          'voa-input': true,\r\n          [`voa-input--${this.size}`]: true,\r\n          'voa-input--filled': this.fill,\r\n          'voa-input--unfilled': !this.fill,\r\n          'voa-input--focused': this.isFocused,\r\n          'voa-input--error': this.error,\r\n          'voa-input--valid': this.valid,\r\n          'voa-input--warning': this.warning,\r\n          'voa-input--disabled': this.disabled,\r\n          'voa-input--readonly': this.readonly,\r\n          'voa-input--has-prefix': this.hasPrefix,\r\n          'voa-input--has-suffix': this.hasSuffix,\r\n        }}\r\n        data-has-prefix={this.hasPrefix ? 'true' : undefined}\r\n        data-has-suffix={this.hasSuffix ? 'true' : undefined}\r\n      >\r\n        {hasTitleRow && (\r\n          <div part=\"title-row\" class=\"voa-input__title-row\">\r\n            <label part=\"label\" htmlFor={this.inputIdValue} class=\"voa-input__label\">\r\n              <slot name=\"label\">{this.label}</slot>\r\n              {this.required && <span class=\"voa-input__required-indicator\" aria-label=\"obrigatório\">*</span>}\r\n            </label>\r\n            \r\n            <div \r\n              part=\"info\" \r\n              class={{\r\n                'voa-input__info': true,\r\n                'is-hidden': !this.hasInfo\r\n              }}\r\n            >\r\n              <slot name=\"info\" onSlotchange={this.checkSlots}></slot>\r\n              {this.showInfoIcon && this.hasInfo && (\r\n                <span part=\"info-icon\" class=\"voa-input__info-icon\">\r\n                  <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n                    <path d=\"M8 14C11.3137 14 14 11.3137 14 8C14 4.68629 11.3137 2 8 2C4.68629 2 2 4.68629 2 8C2 11.3137 4.68629 14 8 14Z\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                    <path d=\"M8 8V11\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                    <path d=\"M8 5H8.008\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                  </svg>\r\n                </span>\r\n              )}\r\n            </div>\r\n          </div>\r\n        )}\r\n\r\n        <div\r\n          part=\"container\"\r\n          class={{\r\n            'voa-input__container': true,\r\n            'is-focused': this.isFocused,\r\n            'has-error': this.error,\r\n            'has-valid': this.valid,\r\n            'has-warning': this.warning,\r\n            'is-disabled': this.disabled,\r\n            'is-readonly': this.readonly,\r\n          }}\r\n        >\r\n          <div \r\n            part=\"prefix\" \r\n            class={{\r\n              'voa-input__prefix': true,\r\n              'is-hidden': !this.hasPrefix\r\n            }}\r\n          >\r\n            <slot name=\"prefix\" onSlotchange={this.checkSlots}></slot>\r\n          </div>\r\n\r\n          <input\r\n            part=\"input\"\r\n            ref={(el) => (this.inputRef = el)}\r\n            id={this.inputIdValue}\r\n            type={this.type}\r\n            name={this.name}\r\n            value={this.internalValue}\r\n            placeholder={this.placeholder}\r\n            disabled={this.disabled}\r\n            readonly={this.readonly}\r\n            required={this.required}\r\n            onInput={this.handleInput}\r\n            onChange={this.handleChange}\r\n            onFocus={this.handleFocus}\r\n            onBlur={this.handleBlur}\r\n            onKeyDown={this.handleKeyDown}\r\n            aria-invalid={this.error ? 'true' : undefined}\r\n            aria-describedby={this.helperText ? helperTextId : undefined}\r\n            aria-disabled={this.disabled ? 'true' : undefined}\r\n            class=\"voa-input__input\"\r\n          />\r\n\r\n          <div \r\n            part=\"suffix\" \r\n            class={{\r\n              'voa-input__suffix': true,\r\n              'is-hidden': !this.hasSuffix\r\n            }}\r\n          >\r\n            <slot name=\"suffix\" onSlotchange={this.checkSlots}></slot>\r\n          </div>\r\n        </div>\r\n\r\n        {this.helperText && (\r\n          <div\r\n            part=\"helper-text\"\r\n            id={helperTextId}\r\n            class={{\r\n              'voa-input__helper-text': true,\r\n              'voa-input__helper-text--error': this.error,\r\n              'voa-input__helper-text--valid': this.valid,\r\n              'voa-input__helper-text--warning': this.warning,\r\n            }}\r\n            role={this.error ? 'alert' : undefined}\r\n          >\r\n            <slot name=\"helper-text\">{this.helperText}</slot>\r\n          </div>\r\n        )}\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":"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"}

package/dist/voa/voa-keybinding.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-keybinding.entry.esm.js","sources":["src/components/voa-keybinding/voa-keybinding.css?tag=voa-keybinding&encapsulation=shadow","src/components/voa-keybinding/voa-keybinding.tsx"],"sourcesContent":["/* \r\n * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n */\r\n\r\n:host {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-keybinding__icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-keybinding__text {\r\n  display: inline-block;\r\n  box-sizing: border-box;\r\n}\r\n\r\n","import { Component, Host, h, Prop, Element } from '@stencil/core';\r\n\r\n/**\r\n * Componente Keybinding para exibir atalhos de teclado.\r\n * \r\n * Baseado no design do Figma, usado como subcomponente do input-addon.\r\n * Segue o padrão \"unstyled\" (headless), fornecendo apenas estrutura e lógica.\r\n * \r\n * @part base - O elemento raiz do keybinding\r\n * @part key-icon - O ícone da tecla modificadora (⌘ ou Ctrl)\r\n * @part key-text - O texto da tecla\r\n */\r\n@Component({\r\n  tag: 'voa-keybinding',\r\n  styleUrl: 'voa-keybinding.css',\r\n  shadow: true,\r\n  scoped: false,\r\n})\r\nexport class VoaKeybinding {\r\n  @Element() host: HTMLElement;\r\n\r\n  /**\r\n   * A tecla do atalho (ex: \"S\", \"K\", \"Enter\")\r\n   */\r\n  @Prop() shortcut: string = 'S';\r\n\r\n  /**\r\n   * Plataforma do atalho (mac ou win)\r\n   */\r\n  @Prop() platform: 'mac' | 'win' = 'mac';\r\n\r\n  render() {\r\n    return (\r\n      <Host\r\n        part=\"base\"\r\n        class={{\r\n          'voa-keybinding': true,\r\n          [`voa-keybinding--${this.platform}`]: true,\r\n        }}\r\n      >\r\n        <div part=\"key-icon\" class=\"voa-keybinding__icon\">\r\n          {this.platform === 'mac' ? (\r\n            <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n              <path\r\n                d=\"M12.5 2C13.3284 2 14 2.67157 14 3.5V12.5C14 13.3284 13.3284 14 12.5 14H3.5C2.67157 14 2 13.3284 2 12.5V3.5C2 2.67157 2.67157 2 3.5 2H12.5Z\"\r\n                fill=\"currentColor\"\r\n                fill-opacity=\"0.1\"\r\n              />\r\n              <path\r\n                d=\"M4 4H12M4 8H12M4 12H8\"\r\n                stroke=\"currentColor\"\r\n                stroke-width=\"1.5\"\r\n                stroke-linecap=\"round\"\r\n              />\r\n            </svg>\r\n          ) : (\r\n            <svg width=\"20\" height=\"10\" viewBox=\"0 0 20 10\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n              <rect x=\"0\" y=\"0\" width=\"20\" height=\"10\" rx=\"2\" fill=\"currentColor\" fill-opacity=\"0.1\" />\r\n              <text x=\"10\" y=\"7\" text-anchor=\"middle\" font-size=\"8\" fill=\"currentColor\" font-weight=\"600\">\r\n                Ctrl\r\n              </text>\r\n            </svg>\r\n          )}\r\n        </div>\r\n        <span part=\"key-text\" class=\"voa-keybinding__text\">\r\n          {this.shortcut}\r\n        </span>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n\r\n"],"names":[],"mappings":";;AAAA,MAAM,gBAAgB,GAAG,uPAAuP;;MCkBnQ,aAAa,GAAA,MAAA;AAN1B,IAAA,WAAA,CAAA,OAAA,EAAA;;AASE;;AAEG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAW,GAAG;AAE9B;;AAEG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAkB,KAAK;AAyCxC;IAvCC,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,IAAI,EAAC,MAAM,EACX,KAAK,EAAE;AACL,gBAAA,gBAAgB,EAAE,IAAI;AACtB,gBAAA,CAAC,mBAAmB,IAAI,CAAC,QAAQ,CAAE,CAAA,GAAG,IAAI;aAC3C,EAAA,EAED,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,IAAI,EAAC,UAAU,EAAC,KAAK,EAAC,sBAAsB,EAAA,EAC9C,IAAI,CAAC,QAAQ,KAAK,KAAK,IACtB,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,EAAA,EAC5F,CACE,CAAA,MAAA,EAAA,EAAA,CAAC,EAAC,4IAA4I,EAC9I,IAAI,EAAC,cAAc,EACN,cAAA,EAAA,KAAK,EAClB,CAAA,EACF,CAAA,CAAA,MAAA,EAAA,EACE,CAAC,EAAC,uBAAuB,EACzB,MAAM,EAAC,cAAc,EAAA,cAAA,EACR,KAAK,EAAA,gBAAA,EACH,OAAO,EACtB,CAAA,CACE,KAEN,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,EAAA,EAC5F,CAAM,CAAA,MAAA,EAAA,EAAA,CAAC,EAAC,GAAG,EAAC,CAAC,EAAC,GAAG,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,EAAE,EAAC,GAAG,EAAC,IAAI,EAAC,cAAc,EAAc,cAAA,EAAA,KAAK,EAAG,CAAA,EACzF,CAAM,CAAA,MAAA,EAAA,EAAA,CAAC,EAAC,IAAI,EAAC,CAAC,EAAC,GAAG,iBAAa,QAAQ,EAAA,WAAA,EAAW,GAAG,EAAC,IAAI,EAAC,cAAc,EAAA,aAAA,EAAa,KAAK,EAEpF,EAAA,MAAA,CAAA,CACH,CACP,CACG,EACN,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,UAAU,EAAC,KAAK,EAAC,sBAAsB,EAC/C,EAAA,IAAI,CAAC,QAAQ,CACT,CACF;;;;;;;;"}

package/dist/voa/voa-link.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-link.entry.esm.js","sources":["src/components/voa-link/link.css?tag=voa-link&encapsulation=shadow","src/components/voa-link/link.tsx"],"sourcesContent":[".link {\r\n  color: #007bff;\r\n  text-decoration: none;\r\n  transition: color 0.2s;\r\n}\r\n\r\n.link:hover {\r\n  color: #0056b3;\r\n}\r\n","import { Component, Prop, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"voa-link\",\r\n  styleUrl: \"link.css\",\r\n  shadow: true,\r\n})\r\nexport class Link {\r\n  @Prop() href: string;\r\n  @Prop() target: string = \"_self\";\r\n\r\n  render() {\r\n    return (\r\n      <a class=\"link\" href={this.href} target={this.target}>\r\n        <slot></slot>\r\n      </a>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":";;AAAA,MAAM,OAAO,GAAG,2FAA2F;;MCO9F,IAAI,GAAA,MAAA;AALjB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAOU,QAAA,IAAM,CAAA,MAAA,GAAW,OAAO;AASjC;IAPC,MAAM,GAAA;AACJ,QAAA,QACE,CAAG,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,MAAM,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAA,EAClD,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACX;;;;;;;"}

package/dist/voa/voa-list.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-list.entry.esm.js","sources":["src/components/voa-list/list.css?tag=voa-list&encapsulation=shadow","src/components/voa-list/list.tsx"],"sourcesContent":[".list {\r\n  list-style: none;\r\n  padding: 0;\r\n  margin: 0;\r\n}\r\n\r\n.list li {\r\n  padding: 10px;\r\n  border-bottom: 1px solid #ddd;\r\n}\r\n\r\n.list li:last-child {\r\n  border-bottom: none;\r\n}\r\n","import { Component, Prop, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"voa-list\",\r\n  styleUrl: \"list.css\",\r\n  shadow: true,\r\n})\r\nexport class List {\r\n  @Prop() items: string[] = [];\r\n\r\n  render() {\r\n    return (\r\n      <ul class=\"list\">\r\n        {this.items.map((item) => (\r\n          <li>{item}</li>\r\n        ))}\r\n      </ul>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":";;AAAA,MAAM,OAAO,GAAG,qIAAqI;;MCOxI,IAAI,GAAA,MAAA;AALjB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAMU,QAAA,IAAK,CAAA,KAAA,GAAa,EAAE;AAW7B;IATC,MAAM,GAAA;AACJ,QAAA,QACE,CAAI,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,MAAM,IACb,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,MACnB,CAAA,CAAA,IAAA,EAAA,IAAA,EAAK,IAAI,CAAM,CAChB,CAAC,CACC;;;;;;;"}

package/dist/voa/voa-modal.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-modal.entry.esm.js","sources":["src/components/voa-modal/modal.css?tag=voa-modal&encapsulation=shadow","src/components/voa-modal/modal.tsx"],"sourcesContent":[".modal {\r\n  display: none;\r\n  position: fixed;\r\n  top: 0;\r\n  left: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  background-color: rgba(0, 0, 0, 0.5);\r\n  justify-content: center;\r\n  align-items: center;\r\n  z-index: 1000;\r\n}\r\n\r\n.modal.open {\r\n  display: flex;\r\n}\r\n\r\n.overlay {\r\n  position: absolute;\r\n  width: 100%;\r\n  height: 100%;\r\n}\r\n\r\n.content {\r\n  background-color: white;\r\n  padding: 20px;\r\n  border-radius: 8px;\r\n  position: relative;\r\n  z-index: 1001;\r\n}\r\n\r\n.close {\r\n  position: absolute;\r\n  top: 10px;\r\n  right: 10px;\r\n  font-size: 1.5rem;\r\n  background: none;\r\n  border: none;\r\n  cursor: pointer;\r\n}\r\n","import { Component, Prop, State, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"voa-modal\",\r\n  styleUrl: \"modal.css\",\r\n  shadow: true,\r\n})\r\nexport class Modal {\r\n  @Prop() open: boolean = false;\r\n  @State() isOpen: boolean = this.open;\r\n\r\n  closeModal = () => {\r\n    this.isOpen = false;\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <div class={`modal ${this.isOpen ? \"open\" : \"\"}`}>\r\n        <div class=\"overlay\" onClick={this.closeModal}></div>\r\n        <div class=\"content\">\r\n          <button class=\"close\" onClick={this.closeModal}>\r\n            &times;\r\n          </button>\r\n          <slot></slot>\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":";;AAAA,MAAM,QAAQ,GAAG,sbAAsb;;MCO1b,KAAK,GAAA,MAAA;AALlB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAMU,QAAA,IAAI,CAAA,IAAA,GAAY,KAAK;AACpB,QAAA,IAAA,CAAA,MAAM,GAAY,IAAI,CAAC,IAAI;AAEpC,QAAA,IAAU,CAAA,UAAA,GAAG,MAAK;AAChB,YAAA,IAAI,CAAC,MAAM,GAAG,KAAK;AACrB,SAAC;AAeF;IAbC,MAAM,GAAA;QACJ,QACE,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAAA,MAAA,EAAS,IAAI,CAAC,MAAM,GAAG,MAAM,GAAG,EAAE,CAAE,CAAA,EAAA,EAC9C,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EAAC,OAAO,EAAE,IAAI,CAAC,UAAU,EAAQ,CAAA,EACrD,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EAAA,EAClB,CAAQ,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,OAAO,EAAC,OAAO,EAAE,IAAI,CAAC,UAAU,EAErC,EAAA,QAAA,CAAA,EACT,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT,CACF;;;;;;;"}

package/dist/voa/voa-option.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-option.entry.esm.js","sources":["src/components/voa-option/voa-option.css?tag=voa-option&encapsulation=shadow","src/components/voa-option/voa-option.tsx"],"sourcesContent":["/* UNSTYLED PATTERN: Structural CSS only */\r\n\r\n:host {\r\n  display: inline-block;\r\n  box-sizing: border-box;\r\n  contain: content;\r\n}\r\n\r\n:host(:focus) {\r\n  outline: none; /* Focus ring handled on part(base) via external CSS */\r\n}\r\n\r\n.option-container {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  position: relative;\r\n  box-sizing: border-box;\r\n  user-select: none;\r\n  gap: 0;\r\n  width: 100%;\r\n  cursor: pointer;\r\n}\r\n\r\n.option-container.option-disabled {\r\n  cursor: not-allowed;\r\n  pointer-events: none;\r\n  opacity: 0.5;\r\n}\r\n\r\n/* The Radio Circle Container */\r\n.option-indicator {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  position: relative;\r\n  box-sizing: border-box;\r\n  flex-shrink: 0;\r\n  \r\n  /* DEFAULT STRUCTURAL SIZE */\r\n  width: 20px;\r\n  height: 20px;\r\n}\r\n\r\n/* The Inner Dot */\r\n.option-indicator-dot {\r\n  display: block;\r\n  position: absolute;\r\n  /* Size must be set by external CSS or it is invisible */\r\n}\r\n\r\n.option-label {\r\n  display: inline-block;\r\n  box-sizing: border-box;\r\n  flex: 1;\r\n}\r\n","import { Component, Host, h, Prop, Event, EventEmitter, Element, AttachInternals, State, Watch } from '@stencil/core';\r\n\r\n/**\r\n * Componente Option do Voa Design System - Radio Button Pattern\r\n * \r\n * Acts as a standalone radio option that can be used in a radio group.\r\n * Manages internal checked state and syncs with Native Form API via ElementInternals.\r\n * \r\n * @part base - Root container with flex layout\r\n * @part indicator - Outer radio circle container\r\n * @part indicator-dot - Inner dot (visible when checked)\r\n * @part label - Label text wrapper\r\n * \r\n * CSS Parts allow external styling via ::part() selectors using design tokens.\r\n * Supports delegated focus for better accessibility.\r\n */\r\n@Component({\r\n  tag: 'voa-option',\r\n  styleUrl: 'voa-option.css',\r\n  shadow: {\r\n    delegatesFocus: true\r\n  },\r\n  formAssociated: true\r\n})\r\nexport class VoaOption {\r\n  @Element() host: HTMLVoaOptionElement;\r\n  @AttachInternals() internals: ElementInternals;\r\n\r\n  /**\r\n   * Internal state for the checked status.\r\n   * Synced from the checked prop via @Watch.\r\n   */\r\n  @State() internalChecked: boolean = false;\r\n\r\n  /**\r\n   * If true, this option is selected.\r\n   */\r\n  @Prop({ reflect: true }) checked: boolean = false;\r\n\r\n  /**\r\n   * If true, this option is disabled.\r\n   */\r\n  @Prop({ reflect: true }) disabled: boolean = false;\r\n\r\n  /**\r\n   * The label text displayed next to the radio indicator.\r\n   * If not provided, only the indicator is shown.\r\n   */\r\n  @Prop() label?: string;\r\n\r\n  /**\r\n   * The name attribute for the radio group.\r\n   */\r\n  @Prop() name: string;\r\n\r\n  /**\r\n   * The value returned when this option is selected.\r\n   */\r\n  @Prop() value: string;\r\n\r\n  /**\r\n   * Emitted when the user selects this option.\r\n   */\r\n  @Event() dsChange: EventEmitter<string>;\r\n\r\n  componentWillLoad() {\r\n    this.internalChecked = this.checked;\r\n    this.updateFormInternals();\r\n  }\r\n\r\n  @Watch('checked')\r\n  checkedChanged(newValue: boolean) {\r\n    this.internalChecked = newValue;\r\n    this.updateFormInternals();\r\n  }\r\n\r\n  /**\r\n   * Syncs with Native Form API\r\n   */\r\n  private updateFormInternals() {\r\n    this.internals.setFormValue(this.internalChecked ? this.value : null);\r\n    this.internals.ariaChecked = this.internalChecked ? 'true' : 'false';\r\n    this.internals.ariaDisabled = this.disabled ? 'true' : 'false';\r\n  }\r\n\r\n  private handleClick = () => {\r\n    if (this.disabled) return;\r\n\r\n    // Radio logic: Clicking toggles the checked state.\r\n    // In a radio group, parent should uncheck siblings.\r\n    // For this isolated component, we toggle and emit the event.\r\n    this.internalChecked = !this.internalChecked;\r\n    this.checked = this.internalChecked; // Update the prop so it reflects to attribute\r\n    this.updateFormInternals();\r\n    this.dsChange.emit(this.value);\r\n  };\r\n\r\n  private handleKeyDown = (ev: KeyboardEvent) => {\r\n    if (this.disabled) return;\r\n    if (ev.key === ' ' || ev.key === 'Enter') {\r\n      ev.preventDefault();\r\n      this.handleClick();\r\n    }\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <Host\r\n        onClick={this.handleClick}\r\n        onKeyDown={this.handleKeyDown}\r\n        tabIndex={this.disabled ? -1 : 0}\r\n      >\r\n        <div\r\n          part=\"base\"\r\n          class={{\r\n            'option-container': true,\r\n            'option-disabled': this.disabled,\r\n            'option-checked': this.internalChecked,\r\n            'option-no-label': !this.label\r\n          }}\r\n        >\r\n          {/* visual radio indicator */}\r\n          <div part=\"indicator\" class=\"option-indicator\">\r\n            <div part=\"indicator-dot\" class=\"option-indicator-dot\"></div>\r\n          </div>\r\n\r\n          {/* Label Wrapper */}\r\n          {this.label && (\r\n            <span part=\"label\" class=\"option-label\">\r\n              {this.label}\r\n              <slot />\r\n            </span>\r\n          )}\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":"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"}

package/dist/voa/voa-pagination-item.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-pagination-item.entry.esm.js","sources":["src/components/voa-pagination/voa-pagination-item.css?tag=voa-pagination-item&encapsulation=shadow","src/components/voa-pagination/voa-pagination-item.tsx"],"sourcesContent":[":host {\r\n  display: inline-block;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.base-button {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  position: relative;\r\n  box-sizing: border-box;\r\n  background: none;\r\n  border: none;\r\n  cursor: pointer;\r\n  padding: 0;\r\n  margin: 0;\r\n  min-width: 32px;\r\n  /* Structural minimums */\r\n  height: 32px;\r\n}\r\n\r\n:host([type=\"ellipsis\"]) .content {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 32px;\r\n  height: 32px;\r\n}\r\n\r\n.icon-wrapper {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}","import { Component, Prop, h, Host, Element, Event, EventEmitter } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'voa-pagination-item',\r\n  styleUrl: 'voa-pagination-item.css',\r\n  shadow: true,\r\n})\r\nexport class VoaPaginationItem {\r\n  @Element() host: HTMLElement;\r\n\r\n  /**\r\n   * The type of item to render.\r\n   * - page: A standard page number\r\n   * - ellipsis: The \"...\" separator\r\n   * - prev/next: Navigation arrows\r\n   */\r\n  @Prop({ reflect: true }) type: 'page' | 'ellipsis' | 'prev' | 'next' = 'page';\r\n\r\n  /**\r\n   * Is this the current active page?\r\n   */\r\n  @Prop({ reflect: true }) active: boolean = false;\r\n\r\n  /**\r\n   * Is this item disabled?\r\n   */\r\n  @Prop({ reflect: true }) disabled: boolean = false;\r\n\r\n  @Event() itemClick: EventEmitter<void>;\r\n\r\n  private handleClick = () => {\r\n    if (!this.disabled && this.type !== 'ellipsis') {\r\n      this.itemClick.emit();\r\n    }\r\n  };\r\n\r\n  private renderIcon() {\r\n    if (this.type === 'prev') {\r\n      return (\r\n        <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n          <polyline points=\"15 18 9 12 15 6\"></polyline>\r\n        </svg>\r\n      );\r\n    }\r\n    if (this.type === 'next') {\r\n      return (\r\n        <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n          <polyline points=\"9 18 15 12 9 6\"></polyline>\r\n        </svg>\r\n      );\r\n    }\r\n    return null;\r\n  }\r\n\r\n  render() {\r\n    // Ellipsis are not interactive\r\n    if (this.type === 'ellipsis') {\r\n      return (\r\n        <Host aria-hidden=\"true\">\r\n          <div part=\"content\" class=\"content\">...</div>\r\n        </Host>\r\n      );\r\n    }\r\n\r\n    return (\r\n      <Host\r\n        onClick={this.handleClick}\r\n        aria-current={this.active ? 'page' : undefined}\r\n        aria-disabled={this.disabled ? 'true' : undefined}\r\n      >\r\n        <button\r\n          type=\"button\"\r\n          part=\"base\"\r\n          class=\"base-button\"\r\n          disabled={this.disabled}\r\n          tabIndex={this.disabled ? -1 : 0}\r\n        >\r\n          <span part=\"content\" class=\"content\">\r\n            {(this.type === 'prev' || this.type === 'next') ? (\r\n              <span part=\"icon\" class=\"icon-wrapper\">\r\n                {this.renderIcon()}\r\n              </span>\r\n            ) : (\r\n              <slot />\r\n            )}\r\n          </span>\r\n        </button>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":";;AAAA,MAAM,oBAAoB,GAAG,6bAA6b;;MCO7c,iBAAiB,GAAA,MAAA;AAL9B,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAQE;;;;;AAKG;AACsB,QAAA,IAAI,CAAA,IAAA,GAA0C,MAAM;AAE7E;;AAEG;AACsB,QAAA,IAAM,CAAA,MAAA,GAAY,KAAK;AAEhD;;AAEG;AACsB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAI1C,QAAA,IAAW,CAAA,WAAA,GAAG,MAAK;YACzB,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,EAAE;AAC9C,gBAAA,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE;;AAEzB,SAAC;AAwDF;IAtDS,UAAU,GAAA;AAChB,QAAA,IAAI,IAAI,CAAC,IAAI,KAAK,MAAM,EAAE;AACxB,YAAA,QACE,CAAK,CAAA,KAAA,EAAA,EAAA,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAA,cAAA,EAAc,GAAG,EAAgB,gBAAA,EAAA,OAAO,qBAAiB,OAAO,EAAA,EACxH,CAAA,CAAA,UAAA,EAAA,EAAU,MAAM,EAAC,iBAAiB,EAAY,CAAA,CAC1C;;AAGV,QAAA,IAAI,IAAI,CAAC,IAAI,KAAK,MAAM,EAAE;AACxB,YAAA,QACE,CAAK,CAAA,KAAA,EAAA,EAAA,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAA,cAAA,EAAc,GAAG,EAAgB,gBAAA,EAAA,OAAO,qBAAiB,OAAO,EAAA,EACxH,CAAA,CAAA,UAAA,EAAA,EAAU,MAAM,EAAC,gBAAgB,EAAY,CAAA,CACzC;;AAGV,QAAA,OAAO,IAAI;;IAGb,MAAM,GAAA;;AAEJ,QAAA,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,EAAE;AAC5B,YAAA,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,aAAA,EAAa,MAAM,EAAA,EACtB,CAAK,CAAA,KAAA,EAAA,EAAA,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,SAAS,EAAA,EAAA,KAAA,CAAU,CACxC;;AAIX,QAAA,QACE,CAAA,CAAC,IAAI,EAAA,EACH,OAAO,EAAE,IAAI,CAAC,WAAW,EACX,cAAA,EAAA,IAAI,CAAC,MAAM,GAAG,MAAM,GAAG,SAAS,EAAA,eAAA,EAC/B,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,SAAS,EAAA,EAEjD,CAAA,CAAA,QAAA,EAAA,EACE,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,aAAa,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,EAAE,GAAG,CAAC,EAAA,EAEhC,CAAM,CAAA,MAAA,EAAA,EAAA,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,SAAS,EACjC,EAAA,CAAC,IAAI,CAAC,IAAI,KAAK,MAAM,IAAI,IAAI,CAAC,IAAI,KAAK,MAAM,KAC5C,YAAM,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,cAAc,EAAA,EACnC,IAAI,CAAC,UAAU,EAAE,CACb,KAEP,CAAA,CAAA,MAAA,EAAA,IAAA,CAAQ,CACT,CACI,CACA,CACJ;;;;;;;;"}

package/dist/voa/voa-pagination.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-pagination.entry.esm.js","sources":["src/components/voa-pagination/voa-pagination.css?tag=voa-pagination&encapsulation=shadow","src/components/voa-pagination/voa-pagination.tsx"],"sourcesContent":[":host {\r\n  display: block;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.pagination-list {\r\n  display: flex;\r\n  align-items: center;\r\n  list-style: none;\r\n  padding: 0;\r\n  margin: 0;\r\n  gap: 4px;\r\n  /* Default gap, can be overridden externally */\r\n}\r\n\r\nli {\r\n  display: flex;\r\n  margin: 0;\r\n  padding: 0;\r\n}","import { Component, Prop, h, Event, EventEmitter, Host, State, Watch } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"voa-pagination\",\r\n  styleUrl: \"voa-pagination.css\",\r\n  shadow: true,\r\n})\r\nexport class VoaPagination {\r\n  @Prop() currentPage: number = 1;\r\n  @Prop() totalPages: number = 1;\r\n\r\n  /**\r\n   * How many siblings to show around the current page.\r\n   * E.g., siblingCount=1 means: ... 4 [5] 6 ...\r\n   */\r\n  @Prop() siblingCount: number = 1;\r\n\r\n  @Event() voaPageChange: EventEmitter<number>;\r\n\r\n  @State() internalPage: number = 1;\r\n\r\n  @Watch('currentPage')\r\n  handlePageChange(val: number) {\r\n    this.internalPage = val;\r\n  }\r\n\r\n  componentWillLoad() {\r\n    this.internalPage = this.currentPage;\r\n  }\r\n\r\n  private onPageClick(page: number) {\r\n    if (page < 1 || page > this.totalPages || page === this.internalPage) return;\r\n    this.internalPage = page;\r\n    this.voaPageChange.emit(this.internalPage);\r\n  }\r\n\r\n  /**\r\n   * THE ALGORITHM:\r\n   * Generates the range of numbers to display.\r\n   */\r\n  private getPaginationRange() {\r\n    const totalPageNumbers = this.siblingCount + 5; // sibling + first + last + current + 2*dots\r\n\r\n    // Case 1: Total pages is small, show everything\r\n    if (totalPageNumbers >= this.totalPages) {\r\n      return Array.from({ length: this.totalPages }, (_, i) => i + 1);\r\n    }\r\n\r\n    const leftSiblingIndex = Math.max(this.internalPage - this.siblingCount, 1);\r\n    const rightSiblingIndex = Math.min(this.internalPage + this.siblingCount, this.totalPages);\r\n\r\n    const shouldShowLeftDots = leftSiblingIndex > 2;\r\n    const shouldShowRightDots = rightSiblingIndex < this.totalPages - 2;\r\n\r\n    const firstPageIndex = 1;\r\n    const lastPageIndex = this.totalPages;\r\n\r\n    // Case 2: No left dots, but right dots shown\r\n    if (!shouldShowLeftDots && shouldShowRightDots) {\r\n      let leftItemCount = 3 + 2 * this.siblingCount;\r\n      let leftRange = Array.from({ length: leftItemCount }, (_, i) => i + 1);\r\n      return [...leftRange, '...', lastPageIndex];\r\n    }\r\n\r\n    // Case 3: No right dots, but left dots shown\r\n    if (shouldShowLeftDots && !shouldShowRightDots) {\r\n      let rightItemCount = 3 + 2 * this.siblingCount;\r\n      let rightRange = Array.from({ length: rightItemCount }, (_, i) => lastPageIndex - rightItemCount + i + 1);\r\n      return [firstPageIndex, '...', ...rightRange];\r\n    }\r\n\r\n    // Case 4: Both dots shown\r\n    if (shouldShowLeftDots && shouldShowRightDots) {\r\n      let middleRange = Array.from({ length: rightSiblingIndex - leftSiblingIndex + 1 }, (_, i) => leftSiblingIndex + i);\r\n      return [firstPageIndex, '...', ...middleRange, '...', lastPageIndex];\r\n    }\r\n  }\r\n\r\n  render() {\r\n    const paginationRange = this.getPaginationRange();\r\n\r\n    return (\r\n      <Host>\r\n        <nav role=\"navigation\" aria-label=\"Pagination\">\r\n          <ul class=\"pagination-list\">\r\n\r\n            {/* Previous Button */}\r\n            <li>\r\n              <voa-pagination-item\r\n                type=\"prev\"\r\n                disabled={this.internalPage === 1}\r\n                onItemClick={() => this.onPageClick(this.internalPage - 1)}\r\n              />\r\n            </li>\r\n\r\n            {/* Page Numbers */}\r\n            {paginationRange.map((pageNumber, index) => {\r\n              if (pageNumber === '...') {\r\n                return (\r\n                  <li key={`dots-${index}`}>\r\n                    <voa-pagination-item type=\"ellipsis\" />\r\n                  </li>\r\n                );\r\n              }\r\n\r\n              return (\r\n                <li key={pageNumber}>\r\n                  <voa-pagination-item\r\n                    active={pageNumber === this.internalPage}\r\n                    onItemClick={() => this.onPageClick(pageNumber as number)}\r\n                  >\r\n                    {pageNumber}\r\n                  </voa-pagination-item>\r\n                </li>\r\n              );\r\n            })}\r\n\r\n            {/* Next Button */}\r\n            <li>\r\n              <voa-pagination-item\r\n                type=\"next\"\r\n                disabled={this.internalPage === this.totalPages}\r\n                onItemClick={() => this.onPageClick(this.internalPage + 1)}\r\n              />\r\n            </li>\r\n\r\n          </ul>\r\n        </nav>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":"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"}

package/dist/voa/voa-progress.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-progress.entry.esm.js","sources":["src/components/voa-progress/progress.css?tag=voa-progress&encapsulation=shadow","src/components/voa-progress/progress.tsx"],"sourcesContent":[".progress {\r\n  width: 100%;\r\n  background-color: #eee;\r\n  border-radius: 4px;\r\n  overflow: hidden;\r\n}\r\n\r\n.bar {\r\n  height: 20px;\r\n  background-color: #007bff;\r\n  transition: width 0.2s;\r\n}\r\n","import { Component, Prop, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"voa-progress\",\r\n  styleUrl: \"progress.css\",\r\n  shadow: true,\r\n})\r\nexport class Progress {\r\n  @Prop() value: number = 0;\r\n\r\n  render() {\r\n    return (\r\n      <div class=\"progress\">\r\n        <div class=\"bar\" style={{ width: `${this.value}%` }}></div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":";;AAAA,MAAM,WAAW,GAAG,+IAA+I;;MCOtJ,QAAQ,GAAA,MAAA;AALrB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAMU,QAAA,IAAK,CAAA,KAAA,GAAW,CAAC;AAS1B;IAPC,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,UAAU,EAAA,EACnB,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,KAAK,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,KAAK,CAAG,CAAA,CAAA,EAAE,EAAQ,CAAA,CACvD;;;;;;;"}

package/dist/voa/voa-radio.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-radio.entry.esm.js","sources":["src/components/voa-radio/voa-radio.css?tag=voa-radio&encapsulation=shadow","src/components/voa-radio/voa-radio.tsx"],"sourcesContent":["/* \r\n * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n */\r\n\r\n:host {\r\n  display: inline-block;\r\n}\r\n\r\n.voa-radio {\r\n  /* Structural styles only */\r\n  display: inline-flex;\r\n  align-items: center;\r\n  position: relative;\r\n  user-select: none;\r\n  cursor: pointer;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-radio--disabled {\r\n  cursor: not-allowed;\r\n  pointer-events: none;\r\n}\r\n\r\n.voa-radio__input {\r\n  /* Structural styles only - visually hidden but accessible */\r\n  position: absolute;\r\n  opacity: 0;\r\n  width: 0;\r\n  height: 0;\r\n  margin: 0;\r\n  padding: 0;\r\n  pointer-events: none;\r\n}\r\n\r\n.voa-radio__indicator {\r\n  /* Structural styles only - Tamanho fixo 20px conforme Figma */\r\n  position: relative;\r\n  display: grid;\r\n  place-content: center;\r\n  flex-shrink: 0;\r\n  box-sizing: border-box;\r\n  width: 20px;\r\n  height: 20px;\r\n  border-radius: 50%;\r\n}\r\n\r\n.voa-radio__dot {\r\n  /* Structural styles only - Tamanho fixo 8px conforme Figma */\r\n  position: absolute;\r\n  /* Centralizar perfeitamente independente de borders */\r\n  left: 50%;\r\n  top: 50%;\r\n  /* Usar margin negativo para centralizar baseado no tamanho do dot (8px / 2 = 4px) */\r\n  margin-left: -4px;\r\n  margin-top: -4px;\r\n  width: 8px;\r\n  height: 8px;\r\n  border-radius: 50%;\r\n  transform: scale(0);\r\n  box-sizing: border-box;\r\n  opacity: 0;\r\n}\r\n\r\n.voa-radio--checked .voa-radio__dot {\r\n  transform: scale(1);\r\n  opacity: 1;\r\n}\r\n\r\n/* Acessibilidade */\r\n:host(:focus-within) {\r\n  outline: none;\r\n}\r\n\r\n/* Respeitar preferências de movimento reduzido */\r\n@media (prefers-reduced-motion: reduce) {\r\n  .voa-radio__indicator,\r\n  .voa-radio__dot {\r\n    transition: none;\r\n  }\r\n} ","import { Component, Prop, Event, EventEmitter, Method, Element, h } from '@stencil/core';\r\n\r\n/**\r\n * Componente Radio Button do Voa Design System, baseado no design do Figma.\r\n * Permite seleção única dentro de um grupo de opções.\r\n * Este é o componente base do radio (apenas o indicador visual).\r\n * Para opções com label, use o componente voa-option.\r\n * \r\n * @part base - The root label element\r\n * @part input - The native radio input element\r\n * @part indicator - The visual radio indicator circle (20px)\r\n * @part dot - The inner dot when checked (8px)\r\n */\r\n@Component({\r\n  tag: 'voa-radio',\r\n  styleUrl: 'voa-radio.css',\r\n  shadow: true,\r\n  scoped: false // Permite herdar variáveis CSS do contexto pai\r\n})\r\nexport class VoaRadio {\r\n  @Element() host: HTMLVoaRadioElement;\r\n  /**\r\n   * Se verdadeiro, o radio button estará selecionado.\r\n   */\r\n  @Prop({ reflect: true }) checked: boolean = false;\r\n\r\n  /**\r\n   * Se verdadeiro, o radio button estará desabilitado.\r\n   */\r\n  @Prop({ reflect: true }) disabled: boolean = false;\r\n\r\n  /**\r\n   * Nome do grupo de radio buttons (usado para agrupamento).\r\n   */\r\n  @Prop() name: string;\r\n\r\n  /**\r\n   * Valor do radio button quando selecionado.\r\n   */\r\n  @Prop() value: string;\r\n\r\n  /**\r\n   * Evento emitido quando o estado do radio button muda.\r\n   */\r\n  @Event() radioChange: EventEmitter<{ checked: boolean; value: string; name: string }>;\r\n\r\n  /**\r\n   * Evento emitido quando o radio button recebe foco.\r\n   */\r\n  @Event() radioFocus: EventEmitter<void>;\r\n\r\n  /**\r\n   * Evento emitido quando o radio button perde foco.\r\n   */\r\n  @Event() radioBlur: EventEmitter<void>;\r\n\r\n  private handleChange = (event: Event) => {\r\n    const input = event.target as HTMLInputElement;\r\n    this.checked = input.checked;\r\n    \r\n    this.radioChange.emit({\r\n      checked: this.checked,\r\n      value: this.value,\r\n      name: this.name\r\n    });\r\n  };\r\n\r\n  private handleFocus = () => {\r\n    this.radioFocus.emit();\r\n  };\r\n\r\n  private handleBlur = () => {\r\n    this.radioBlur.emit();\r\n  };\r\n\r\n  /**\r\n   * Método para delegar foco ao elemento interno do radio.\r\n   * Requerido para acessibilidade WCAG 2.2 AA.\r\n   */\r\n  @Method()\r\n  async setFocus(): Promise<void> {\r\n    const input = this.host.shadowRoot?.querySelector('input[type=\"radio\"]') as HTMLInputElement;\r\n    if (input) {\r\n      input.focus();\r\n    }\r\n  }\r\n\r\n  render() {\r\n    const containerClasses = {\r\n      'voa-radio': true,\r\n      'voa-radio--checked': this.checked,\r\n      'voa-radio--disabled': this.disabled\r\n    };\r\n\r\n    return (\r\n      <label \r\n        part=\"base\"\r\n        class={containerClasses}\r\n        aria-disabled={this.disabled ? 'true' : undefined}\r\n        role=\"radio\"\r\n        aria-checked={this.checked ? 'true' : 'false'}\r\n      >\r\n        <input\r\n          type=\"radio\"\r\n          part=\"input\"\r\n          class=\"voa-radio__input\"\r\n          checked={this.checked}\r\n          disabled={this.disabled}\r\n          name={this.name}\r\n          value={this.value}\r\n          onChange={this.handleChange}\r\n          onFocus={this.handleFocus}\r\n          onBlur={this.handleBlur}\r\n        />\r\n        <span class=\"voa-radio__indicator\" part=\"indicator\">\r\n          <span class=\"voa-radio__dot\" part=\"dot\"></span>\r\n        </span>\r\n      </label>\r\n    );\r\n  }\r\n} "],"names":[],"mappings":";;AAAA,MAAM,WAAW,GAAG,g0BAAg0B;;MCmBv0B,QAAQ,GAAA,MAAA;AANrB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;;AAQE;;AAEG;AACsB,QAAA,IAAO,CAAA,OAAA,GAAY,KAAK;AAEjD;;AAEG;AACsB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AA2B1C,QAAA,IAAA,CAAA,YAAY,GAAG,CAAC,KAAY,KAAI;AACtC,YAAA,MAAM,KAAK,GAAG,KAAK,CAAC,MAA0B;AAC9C,YAAA,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC,OAAO;AAE5B,YAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;gBACpB,OAAO,EAAE,IAAI,CAAC,OAAO;gBACrB,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,IAAI,EAAE,IAAI,CAAC;AACZ,aAAA,CAAC;AACJ,SAAC;AAEO,QAAA,IAAW,CAAA,WAAA,GAAG,MAAK;AACzB,YAAA,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE;AACxB,SAAC;AAEO,QAAA,IAAU,CAAA,UAAA,GAAG,MAAK;AACxB,YAAA,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE;AACvB,SAAC;AA+CF;AA7CC;;;AAGG;AAEH,IAAA,MAAM,QAAQ,GAAA;;AACZ,QAAA,MAAM,KAAK,GAAG,CAAA,EAAA,GAAA,IAAI,CAAC,IAAI,CAAC,UAAU,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,aAAa,CAAC,qBAAqB,CAAqB;QAC5F,IAAI,KAAK,EAAE;YACT,KAAK,CAAC,KAAK,EAAE;;;IAIjB,MAAM,GAAA;AACJ,QAAA,MAAM,gBAAgB,GAAG;AACvB,YAAA,WAAW,EAAE,IAAI;YACjB,oBAAoB,EAAE,IAAI,CAAC,OAAO;YAClC,qBAAqB,EAAE,IAAI,CAAC;SAC7B;AAED,QAAA,QACE,CACE,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,gBAAgB,EAAA,eAAA,EACR,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,SAAS,EACjD,IAAI,EAAC,OAAO,kBACE,IAAI,CAAC,OAAO,GAAG,MAAM,GAAG,OAAO,EAAA,EAE7C,CACE,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,kBAAkB,EACxB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,IAAI,CAAC,YAAY,EAC3B,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,MAAM,EAAE,IAAI,CAAC,UAAU,EACvB,CAAA,EACF,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,sBAAsB,EAAC,IAAI,EAAC,WAAW,EAAA,EACjD,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,gBAAgB,EAAC,IAAI,EAAC,KAAK,EAAQ,CAAA,CAC1C,CACD;;;;;;;;"}

package/dist/voa/voa-select-base.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"voa-select-base.entry.esm.js","sources":["src/components/voa-select/voa-select-base.css?tag=voa-select-base&encapsulation=shadow","src/components/voa-select/voa-select-base.tsx"],"sourcesContent":["/* \r\n * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).\r\n * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally\r\n * via CSS Parts API (::part() selectors) using design tokens.\r\n */\r\n\r\n:host {\r\n  display: block;\r\n  width: 100%;\r\n  position: relative;\r\n  box-sizing: border-box;\r\n  /* Garantir que o dropdown possa aparecer fora do container */\r\n  overflow: visible;\r\n}\r\n\r\n.voa-select {\r\n  position: relative;\r\n  width: 100%;\r\n  min-height: 48px;\r\n  box-sizing: border-box;\r\n  /* Garantir que o dropdown possa aparecer fora do container */\r\n  overflow: visible;\r\n}\r\n\r\n.voa-select__control {\r\n  /* Structural styles only - Reset button defaults */\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  width: 100%;\r\n  min-height: 48px;\r\n  height: 100%;\r\n  box-sizing: border-box;\r\n  cursor: pointer;\r\n  \r\n  /* Reset button defaults */\r\n  border: none;\r\n  outline: none;\r\n  background: none;\r\n  padding: 0;\r\n  margin: 0;\r\n  font: inherit;\r\n  color: inherit;\r\n  text-align: inherit;\r\n  appearance: none;\r\n  -webkit-appearance: none;\r\n  -moz-appearance: none;\r\n}\r\n\r\n.voa-select--disabled .voa-select__control {\r\n  cursor: not-allowed;\r\n  pointer-events: none;\r\n}\r\n\r\n.voa-select__value {\r\n  /* Structural styles only */\r\n  flex: 1;\r\n  white-space: nowrap;\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.voa-select__indicator {\r\n  /* Structural styles only */\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n  box-sizing: border-box;\r\n  transition: transform 0.2s ease;\r\n}\r\n\r\n.voa-select--open .voa-select__indicator {\r\n  transform: rotate(180deg);\r\n}\r\n\r\n.voa-select__dropdown-icon {\r\n  pointer-events: none;\r\n  display: block;\r\n}\r\n\r\n.voa-select__dropdown {\r\n  /* Structural styles only */\r\n  position: absolute;\r\n  top: calc(100% + 4px); /* Posicionado logo abaixo do control com 4px de espaço */\r\n  left: 0;\r\n  right: 0;\r\n  z-index: 1000;\r\n  max-height: 200px;\r\n  overflow-y: auto;\r\n  box-sizing: border-box;\r\n  display: block;\r\n\r\n  /* Visual styles - White background */\r\n  background-color: var(--colors-structure-bg-base, #ffffff);\r\n  \r\n  /* Outline - border using same token as input field */\r\n  border: 1.125px solid var(--colors-structure-border-color, #adb5bd);\r\n  border-radius: 15.75px;\r\n\r\n  /* Shadow for elevation */\r\n  box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.15), \r\n              0px 0px 0px 0.5px var(--colors-structure-border-color, #adb5bd),\r\n              inset 0px 0px 0px 1px var(--colors-structure-border-color, #adb5bd);\r\n\r\n  /* Padding inside dropdown - vertical only */\r\n  padding: 8px 0;\r\n\r\n  /* Animation - entrance effect */\r\n  animation: dropdownEnter 0.2s ease-out forwards;\r\n  opacity: 1;\r\n  transform: translateY(0);\r\n}\r\n\r\n@keyframes dropdownEnter {\r\n  from {\r\n    opacity: 0;\r\n    transform: translateY(-8px);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n}\r\n\r\n@keyframes dropdownExit {\r\n  from {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n  to {\r\n    opacity: 0;\r\n    transform: translateY(-8px);\r\n  }\r\n}\r\n\r\n/* Toggle logic handled by class in TSX */\r\n.voa-select__dropdown--hidden {\r\n  animation: dropdownExit 0.15s ease-in forwards;\r\n  display: none;\r\n  pointer-events: none;\r\n}\r\n\r\n.voa-select__option {\r\n  /* Structural styles only */\r\n  box-sizing: border-box;\r\n  cursor: pointer;\r\n  display: flex;\r\n  align-items: center;\r\n  /* Padding to prevent text from touching borders */\r\n  padding: 8px 12px;\r\n}\r\n\r\n.voa-select__option--disabled {\r\n  cursor: not-allowed;\r\n  pointer-events: none;\r\n}\r\n\r\n/* Active state (keyboard navigation highlight) */\r\n.voa-select__option--active {\r\n  /* Minimal visual feedback for keyboard navigation - external CSS will enhance */\r\n  background-color: rgba(0, 0, 0, 0.05);\r\n}\r\n\r\n/* Selected state */\r\n.voa-select__option--selected {\r\n  /* Minimal visual feedback for selected state - external CSS will enhance */\r\n  background-color: rgba(0, 100, 203, 0.1);\r\n} ","import { Component, Prop, Event, EventEmitter, Method, Element, h, State, Watch, Listen } from '@stencil/core';\r\n\r\n/**\r\n * Componente Base para Select do Voa Design System, baseado no design do Figma.\r\n * \r\n * @part base - The root select element\r\n * @part control - The select control button\r\n * @part value - The displayed value text\r\n * @part indicator - The dropdown indicator icon\r\n * @part dropdown - The dropdown menu container\r\n * @part option - Individual option element\r\n */\r\n@Component({\r\n  tag: 'voa-select-base',\r\n  styleUrl: 'voa-select-base.css',\r\n  shadow: true,\r\n  scoped: false // Permite herdar variáveis CSS do contexto pai\r\n})\r\nexport class VoaSelectBase {\r\n  @Element() host: HTMLElement;\r\n  /**\r\n   * Lista de opções para seleção\r\n   */\r\n  @Prop() options: Array<{ value: string, label: string, disabled?: boolean }> = [];\r\n\r\n  /**\r\n   * Texto de placeholder quando não há item selecionado\r\n   */\r\n  @Prop() placeholder: string = 'Select an option';\r\n\r\n  /**\r\n   * Se verdadeiro, o select estará desabilitado.\r\n   */\r\n  @Prop({ reflect: true }) disabled: boolean = false;\r\n\r\n  /**\r\n   * Se verdadeiro, o select terá estado de erro.\r\n   */\r\n  @Prop({ reflect: true }) error: boolean = false;\r\n\r\n  /**\r\n   * THE TRUTH. Read-only from parent.\r\n   */\r\n  @Prop() value?: string;\r\n\r\n  /**\r\n   * Internal Reality.\r\n   */\r\n  @State() innerValue?: string;\r\n\r\n  /**\r\n   * Se verdadeiro, o select mostrará as opções.\r\n   */\r\n  @State() isOpen: boolean = false;\r\n\r\n  /**\r\n   * Track which option is currently \"highlighted\" by the keyboard\r\n   * (Not necessarily selected yet).\r\n   */\r\n  @State() activeIndex: number = -1;\r\n\r\n  /**\r\n   * Evento emitido quando o valor é alterado\r\n   */\r\n  @Event() voaChange: EventEmitter<string>;\r\n\r\n  private listboxId = `voa-listbox-${Math.random().toString(36).substr(2, 9)}`;\r\n\r\n  componentWillLoad() {\r\n    this.innerValue = this.value;\r\n  }\r\n\r\n  @Watch('value')\r\n  syncValue(val: string) {\r\n    this.innerValue = val;\r\n  }\r\n\r\n  @Listen('click', { target: 'window' })\r\n  handleOutsideClick(ev: MouseEvent) {\r\n    const path = ev.composedPath();\r\n    if (this.isOpen && !path.includes(this.host)) {\r\n      this.closeDropdown();\r\n    }\r\n  }\r\n\r\n  private toggleDropdown = () => {\r\n    if (this.disabled) return;\r\n    if (this.isOpen) {\r\n      this.closeDropdown();\r\n    } else {\r\n      this.openDropdown();\r\n    }\r\n  };\r\n\r\n  private openDropdown() {\r\n    this.isOpen = true;\r\n    // Find the index of the currently selected value to highlight it\r\n    const index = this.options.findIndex(o => o.value === this.innerValue);\r\n    this.activeIndex = index >= 0 ? index : 0;\r\n  }\r\n\r\n  private closeDropdown() {\r\n    this.isOpen = false;\r\n    this.activeIndex = -1;\r\n  }\r\n\r\n  private handleSelect = (val: string) => {\r\n    if (this.disabled) return;\r\n    this.innerValue = val;\r\n    this.voaChange.emit(val);\r\n    this.closeDropdown();\r\n  };\r\n\r\n  /**\r\n   * THE KEYBOARD BRAIN\r\n   * This is what makes a Select a Select.\r\n   */\r\n  private handleKeyDown = (ev: KeyboardEvent) => {\r\n    if (this.disabled) return;\r\n\r\n    switch (ev.key) {\r\n      case 'Enter':\r\n      case ' ':\r\n        ev.preventDefault();\r\n        if (this.isOpen) {\r\n          if (this.activeIndex >= 0 && this.options[this.activeIndex]) {\r\n            this.handleSelect(this.options[this.activeIndex].value);\r\n          }\r\n        } else {\r\n          this.openDropdown();\r\n        }\r\n        break;\r\n      case 'ArrowDown':\r\n        ev.preventDefault();\r\n        if (!this.isOpen) {\r\n          this.openDropdown();\r\n        } else {\r\n          this.activeIndex = Math.min(this.activeIndex + 1, this.options.length - 1);\r\n          this.scrollToActive();\r\n        }\r\n        break;\r\n      case 'ArrowUp':\r\n        ev.preventDefault();\r\n        if (this.isOpen) {\r\n          this.activeIndex = Math.max(this.activeIndex - 1, 0);\r\n          this.scrollToActive();\r\n        }\r\n        break;\r\n      case 'Escape':\r\n        if (this.isOpen) {\r\n          ev.preventDefault();\r\n          this.closeDropdown();\r\n        }\r\n        break;\r\n      case 'Tab':\r\n        // If user tabs away, close it.\r\n        if (this.isOpen) {\r\n          this.closeDropdown();\r\n        }\r\n        break;\r\n    }\r\n  };\r\n\r\n  private scrollToActive() {\r\n    // Logic to scroll the dropdown container to keep the active item in view\r\n    // Implementation omitted for brevity, but vital for production\r\n  }\r\n\r\n  private getDisplayText(): string {\r\n    const selected = this.options.find(o => o.value === this.innerValue);\r\n    return selected ? selected.label : this.placeholder;\r\n  }\r\n\r\n  /**\r\n   * Método para delegar foco ao elemento interno do select.\r\n   * Requerido para acessibilidade WCAG 2.2 AA.\r\n   */\r\n  @Method()\r\n  async setFocus(): Promise<void> {\r\n    const control = this.host.shadowRoot?.querySelector('[part=\"control\"]') as HTMLElement;\r\n    if (control) {\r\n      control.focus();\r\n    }\r\n  }\r\n\r\n  render() {\r\n    const activeId = this.activeIndex >= 0 ? `${this.listboxId}-opt-${this.activeIndex}` : undefined;\r\n\r\n    return (\r\n      <div\r\n        part=\"base\"\r\n        class={{\r\n          'voa-select': true,\r\n          'voa-select--open': this.isOpen,\r\n          'voa-select--disabled': this.disabled,\r\n        }}\r\n        // The container handles keydown\r\n        onKeyDown={this.handleKeyDown}\r\n      >\r\n        {/* CONTROL (The Trigger) */}\r\n        <button\r\n          part=\"control\"\r\n          type=\"button\"\r\n          class=\"voa-select__control\"\r\n          onClick={this.toggleDropdown}\r\n          aria-haspopup=\"listbox\"\r\n          aria-expanded={this.isOpen ? 'true' : 'false'}\r\n          aria-controls={this.listboxId}\r\n          aria-activedescendant={this.isOpen ? activeId : undefined}\r\n          disabled={this.disabled}\r\n        >\r\n          <span part=\"value\" class=\"voa-select__value\">\r\n            {this.getDisplayText()}\r\n          </span>\r\n          <span part=\"indicator\" class=\"voa-select__indicator\">\r\n            <slot name=\"indicator\">\r\n              {/* Default Chevron */}\r\n              <svg width=\"10\" height=\"6\" viewBox=\"0 0 10 6\" fill=\"none\" stroke=\"currentColor\">\r\n                <path d=\"M1 1L5 5L9 1\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n              </svg>\r\n            </slot>\r\n          </span>\r\n        </button>\r\n\r\n        {/* DROPDOWN (The Listbox) */}\r\n        <div\r\n          id={this.listboxId}\r\n          part=\"dropdown\"\r\n          class={{\r\n            'voa-select__dropdown': true,\r\n            'voa-select__dropdown--hidden': !this.isOpen,\r\n          }}\r\n          role=\"listbox\"\r\n          tabindex=\"-1\"\r\n          aria-hidden={!this.isOpen ? 'true' : undefined}\r\n        >\r\n          {this.options.map((option, index) => {\r\n            const isSelected = option.value === this.innerValue;\r\n            const isActive = index === this.activeIndex;\r\n\r\n            return (\r\n              <div\r\n                id={`${this.listboxId}-opt-${index}`}\r\n                part=\"option\"\r\n                class={{\r\n                  'voa-select__option': true,\r\n                  'voa-select__option--selected': isSelected,\r\n                  'voa-select__option--active': isActive, // Highlighted by keyboard\r\n                  'voa-select__option--disabled': !!option.disabled,\r\n                }}\r\n                role=\"option\"\r\n                aria-selected={isSelected ? 'true' : 'false'}\r\n                onClick={() => !option.disabled && this.handleSelect(option.value)}\r\n                onMouseEnter={() => (this.activeIndex = index)} // Mouse syncs with keyboard\r\n              >\r\n                {option.label}\r\n              </div>\r\n            );\r\n          })}\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}"],"names":[],"mappings":"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"}