@wrrdev/fenix-ui 1.0.6 → 1.0.8

package/dist/components/accordion/accordion.d.ts

@@ -0,0 +1,72 @@
+import { FxElement } from '../../core/base';
+/**
+ * <fx-accordion-panel> — Painel individual do accordion.
+ *
+ * Atributos:
+ *  - header: titulo exibido no cabecalho (ou use o slot "header").
+ *  - value: identificador unico do painel (usado pelo fx-accordion).
+ *  - expanded: presenca indica painel aberto (controlado pelo fx-accordion).
+ *  - disabled: impede a abertura do painel.
+ */
+export declare class FxAccordionPanel extends FxElement {
+    static styles: string;
+    static get observedAttributes(): string[];
+    get header(): string;
+    set header(v: string);
+    get value(): string;
+    set value(v: string);
+    get expanded(): boolean;
+    set expanded(v: boolean);
+    get disabled(): boolean;
+    set disabled(v: boolean);
+    protected connectedCallback(): void;
+    protected disconnectedCallback(): void;
+    private _mo;
+    protected render(): void;
+}
+/**
+ * <fx-accordion> — Conjunto de paineis expansivos (estilo PrimeVue).
+ *
+ * Por padrao (modo single) abrir um painel fecha os outros.
+ * Adicione o atributo `multiple` para permitir varios paineis abertos.
+ *
+ * Uso:
+ *   <fx-accordion value="p1">
+ *     <fx-accordion-panel value="p1" header="Titulo 1">Conteudo…</fx-accordion-panel>
+ *     <fx-accordion-panel value="p2" header="Titulo 2">Conteudo…</fx-accordion-panel>
+ *   </fx-accordion>
+ *
+ * Atributos:
+ *  - value: valor(es) ativo(s), separados por virgula no modo multiple.
+ *  - multiple: permite manter varios paineis abertos ao mesmo tempo.
+ *
+ * Evento: `change` (composed, detail: { value: string[] }).
+ */
+export declare class FxAccordion extends FxElement {
+    static styles: string;
+    static get observedAttributes(): string[];
+    get multiple(): boolean;
+    set multiple(v: boolean);
+    /** Valores ativos como array. */
+    get values(): string[];
+    set values(v: string[]);
+    protected connectedCallback(): void;
+    protected disconnectedCallback(): void;
+    private _observer;
+    protected render(): void;
+    /** Painéis do accordion (filhos diretos ou descendentes). */
+    private get panels();
+    private _sync;
+    private _initialized;
+    private _attachListeners;
+    private _listenersAttached;
+    /** Abre/fecha um painel respeitando o modo (single | multiple). */
+    toggle(panel: FxAccordionPanel): void;
+    /** Abre um painel pelo valor. */
+    open(value: string): void;
+    /** Fecha um painel pelo valor. */
+    close(value: string): void;
+}
+export declare function defineFxAccordion(): typeof FxAccordion;
+export declare function defineFxAccordionPanel(): typeof FxAccordionPanel;
+//# sourceMappingURL=accordion.d.ts.map

package/dist/components/accordion/accordion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/accordion.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAI5C;;;;;;;;GAQG;AACH,qBAAa,gBAAiB,SAAQ,SAAS;IAC7C,OAAgB,MAAM,SA+DpB;IAEF,WAAoB,kBAAkB,IAAI,MAAM,EAAE,CAEjD;IAED,IAAI,MAAM,IAAI,MAAM,CAEnB;IACD,IAAI,MAAM,CAAC,CAAC,EAAE,MAAM,EAEnB;IAED,IAAI,KAAK,IAAI,MAAM,CAElB;IACD,IAAI,KAAK,CAAC,CAAC,EAAE,MAAM,EAElB;IAED,IAAI,QAAQ,IAAI,OAAO,CAEtB;IACD,IAAI,QAAQ,CAAC,CAAC,EAAE,OAAO,EAEtB;IAED,IAAI,QAAQ,IAAI,OAAO,CAEtB;IACD,IAAI,QAAQ,CAAC,CAAC,EAAE,OAAO,EAEtB;cAEkB,iBAAiB,IAAI,IAAI;cAoBzB,oBAAoB,IAAI,IAAI;IAK/C,OAAO,CAAC,GAAG,CAAiC;cAEzB,MAAM,IAAI,IAAI;CAsBlC;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,qBAAa,WAAY,SAAQ,SAAS;IACxC,OAAgB,MAAM,SAapB;IAEF,WAAoB,kBAAkB,IAAI,MAAM,EAAE,CAEjD;IAED,IAAI,QAAQ,IAAI,OAAO,CAEtB;IACD,IAAI,QAAQ,CAAC,CAAC,EAAE,OAAO,EAEtB;IAED,iCAAiC;IACjC,IAAI,MAAM,IAAI,MAAM,EAAE,CAErB;IACD,IAAI,MAAM,CAAC,CAAC,EAAE,MAAM,EAAE,EAErB;cAEkB,iBAAiB,IAAI,IAAI;cASzB,oBAAoB,IAAI,IAAI;IAK/C,OAAO,CAAC,SAAS,CAAiC;cAE/B,MAAM,IAAI,IAAI;IAUjC,6DAA6D;IAC7D,OAAO,KAAK,MAAM,GAEjB;IAED,OAAO,CAAC,KAAK;IAsBb,OAAO,CAAC,YAAY,CAAS;IAE7B,OAAO,CAAC,gBAAgB;IAYxB,OAAO,CAAC,kBAAkB,CAAS;IAEnC,mEAAmE;IACnE,MAAM,CAAC,KAAK,EAAE,gBAAgB,GAAG,IAAI;IAqBrC,iCAAiC;IACjC,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAKzB,kCAAkC;IAClC,KAAK,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;CAI3B;AAED,wBAAgB,iBAAiB,IAAI,OAAO,WAAW,CAEtD;AAED,wBAAgB,sBAAsB,IAAI,OAAO,gBAAgB,CAEhE"}

package/dist/components/accordion/accordion.js

@@ -0,0 +1,277 @@
+import { FxElement } from "../../core/base.js";
+import { css } from "../../core/css.js";
+import { defineElement } from "../../core/define.js";
+const _FxAccordionPanel = class _FxAccordionPanel extends FxElement {
+  constructor() {
+    super(...arguments);
+    this._mo = null;
+  }
+  static get observedAttributes() {
+    return ["header", "expanded", "disabled"];
+  }
+  get header() {
+    return this.getAttr("header", "");
+  }
+  set header(v) {
+    this.setAttribute("header", v);
+  }
+  get value() {
+    return this.getAttr("value", "");
+  }
+  set value(v) {
+    this.setAttribute("value", v);
+  }
+  get expanded() {
+    return this.hasAttr("expanded");
+  }
+  set expanded(v) {
+    this.toggleAttr("expanded", v);
+  }
+  get disabled() {
+    return this.hasAttr("disabled");
+  }
+  set disabled(v) {
+    this.toggleAttr("disabled", v);
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.addEventListener("click", (e) => {
+      const path = e.composedPath();
+      if (!path.some((el) => el.classList?.contains("header"))) return;
+      if (this.disabled) return;
+      this.dispatchEvent(
+        new CustomEvent("fx-accordion-toggle", {
+          bubbles: true,
+          composed: true,
+          detail: { panel: this }
+        })
+      );
+    });
+    this._mo = new MutationObserver(() => this.render());
+    this._mo.observe(this, { attributes: true, attributeFilter: ["expanded", "header", "disabled"] });
+  }
+  disconnectedCallback() {
+    this._mo?.disconnect();
+    this._mo = null;
+  }
+  render() {
+    this.setTemplate(`
+      <button type="button" class="header" part="header" role="button"
+        aria-expanded="${this.expanded}"
+        ${this.disabled ? 'aria-disabled="true"' : ""}>
+        <span class="header-text" part="header-text">
+          <slot name="header">${this.header}</slot>
+        </span>
+        <span class="chevron" part="chevron" aria-hidden="true">
+          <svg width="14" height="14" viewBox="0 0 24 24" fill="none"
+            stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
+            <polyline points="6 9 12 15 18 9"></polyline>
+          </svg>
+        </span>
+      </button>
+      <div class="content" part="content" role="region">
+        <div class="content-inner">
+          <div class="content-pad" part="content-pad"><slot></slot></div>
+        </div>
+      </div>
+    `);
+  }
+};
+_FxAccordionPanel.styles = css`
+    :host {
+      display: block;
+      font-family: var(--fx-font-family);
+      font-size: var(--fx-font-size);
+      color: var(--fx-text-default);
+      border-bottom: 1px solid var(--fx-border-default);
+    }
+    :host(:last-child) { border-bottom: none; }
+    :host([disabled]) { opacity: 0.6; pointer-events: none; }
+    .header {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: var(--fx-space-md);
+      width: 100%;
+      box-sizing: border-box;
+      padding: var(--fx-space-lg, 20px) var(--fx-space-md, 14px);
+      border: none;
+      background: transparent;
+      font-family: inherit;
+      font-size: inherit;
+      font-weight: 500;
+      color: var(--fx-text-muted);
+      text-align: left;
+      cursor: pointer;
+      transition: color var(--fx-motion-duration-fast, 150ms) var(--fx-motion-easing, ease),
+        background var(--fx-motion-duration-fast, 150ms) var(--fx-motion-easing, ease);
+    }
+    .header:hover { color: var(--fx-text-default); }
+    .header:focus-visible {
+      outline: none;
+      box-shadow: var(--fx-effect-focus-ring, none);
+      border-radius: var(--fx-radius-sm, 4px);
+    }
+    :host([expanded]) .header {
+      color: var(--fx-text-default);
+      font-weight: 700;
+    }
+    .header-text { flex: 1; min-width: 0; }
+    .chevron {
+      flex-shrink: 0;
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      width: 24px;
+      height: 24px;
+      color: var(--fx-text-muted);
+      transition: transform var(--fx-motion-duration-normal, 250ms) var(--fx-motion-easing, ease);
+    }
+    :host([expanded]) .chevron { transform: rotate(180deg); color: var(--fx-color-primary); }
+    .content {
+      display: grid;
+      grid-template-rows: 0fr;
+      transition: grid-template-rows var(--fx-motion-duration-normal, 250ms) var(--fx-motion-easing, ease);
+    }
+    :host([expanded]) .content { grid-template-rows: 1fr; }
+    .content-inner { overflow: hidden; }
+    .content-pad {
+      padding: 0 var(--fx-space-md, 14px) var(--fx-space-lg, 20px);
+      color: var(--fx-text-muted);
+      line-height: 1.6;
+    }
+  `;
+let FxAccordionPanel = _FxAccordionPanel;
+const _FxAccordion = class _FxAccordion extends FxElement {
+  constructor() {
+    super(...arguments);
+    this._observer = null;
+    this._initialized = false;
+    this._listenersAttached = false;
+  }
+  static get observedAttributes() {
+    return ["value", "multiple"];
+  }
+  get multiple() {
+    return this.hasAttr("multiple");
+  }
+  set multiple(v) {
+    this.toggleAttr("multiple", v);
+  }
+  /** Valores ativos como array. */
+  get values() {
+    return this.getAttr("value", "").split(",").map((s) => s.trim()).filter(Boolean);
+  }
+  set values(v) {
+    this.setAttribute("value", v.join(","));
+  }
+  connectedCallback() {
+    this._observer = new MutationObserver(() => this._sync());
+    this._observer.observe(this, { childList: true, subtree: true });
+    super.connectedCallback();
+    queueMicrotask(() => this._sync());
+  }
+  disconnectedCallback() {
+    this._observer?.disconnect();
+    this._observer = null;
+  }
+  render() {
+    this.setTemplate(`
+      <div class="accordion" part="accordion">
+        <slot></slot>
+      </div>
+    `);
+    this._sync();
+    this._attachListeners();
+  }
+  /** Painéis do accordion (filhos diretos ou descendentes). */
+  get panels() {
+    return Array.from(this.querySelectorAll("fx-accordion-panel"));
+  }
+  _sync() {
+    const actives = this.values;
+    const panels = Array.from(this.querySelectorAll("fx-accordion-panel"));
+    if (!this._initialized && actives.length === 0 && panels.length > 0) {
+      this._initialized = true;
+      const first = panels.find((p) => !p.hasAttribute("disabled"));
+      if (first) {
+        this.values = [first.getAttribute("value") || "0"];
+        return;
+      }
+    }
+    this._initialized = true;
+    panels.forEach((p, i) => {
+      const v = p.getAttribute("value") || String(i);
+      if (!p.hasAttribute("value")) p.setAttribute("value", v);
+      p.toggleAttribute("expanded", actives.includes(v));
+    });
+  }
+  _attachListeners() {
+    if (this._listenersAttached) return;
+    this._listenersAttached = true;
+    this.addEventListener("fx-accordion-toggle", (e) => {
+      const panel = e.detail?.panel;
+      if (!panel || panel.disabled) return;
+      this.toggle(panel);
+    });
+  }
+  /** Abre/fecha um painel respeitando o modo (single | multiple). */
+  toggle(panel) {
+    const v = panel.value;
+    let actives = this.values;
+    if (panel.expanded) {
+      actives = actives.filter((a) => a !== v);
+    } else if (this.multiple) {
+      actives = [...actives, v];
+    } else {
+      actives = [v];
+    }
+    this.values = actives;
+    this._sync();
+    this.dispatchEvent(
+      new CustomEvent("change", {
+        bubbles: true,
+        composed: true,
+        detail: { value: actives }
+      })
+    );
+  }
+  /** Abre um painel pelo valor. */
+  open(value) {
+    const panel = this.panels.find((p, i) => (p.value || String(i)) === value);
+    if (panel && !panel.expanded) this.toggle(panel);
+  }
+  /** Fecha um painel pelo valor. */
+  close(value) {
+    const panel = this.panels.find((p, i) => (p.value || String(i)) === value);
+    if (panel && panel.expanded) this.toggle(panel);
+  }
+};
+_FxAccordion.styles = css`
+    :host {
+      display: block;
+      font-family: var(--fx-font-family);
+      font-size: var(--fx-font-size);
+    }
+    .accordion {
+      background: var(--fx-surface-background, #ffffff);
+      border: 1px solid var(--fx-border-default);
+      border-radius: var(--fx-radius-md, 8px);
+      overflow: hidden;
+      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
+    }
+  `;
+let FxAccordion = _FxAccordion;
+function defineFxAccordion() {
+  return defineElement("fx-accordion", FxAccordion);
+}
+function defineFxAccordionPanel() {
+  return defineElement("fx-accordion-panel", FxAccordionPanel);
+}
+export {
+  FxAccordion,
+  FxAccordionPanel,
+  defineFxAccordion,
+  defineFxAccordionPanel
+};
+//# sourceMappingURL=accordion.js.map

package/dist/components/accordion/accordion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"accordion.js","sources":["../../../src/components/accordion/accordion.ts"],"sourcesContent":["import { FxElement } from '../../core/base';\r\nimport { css } from '../../core/css';\r\nimport { defineElement } from '../../core/define';\r\n\r\n/**\r\n * <fx-accordion-panel> — Painel individual do accordion.\r\n *\r\n * Atributos:\r\n *  - header: titulo exibido no cabecalho (ou use o slot \"header\").\r\n *  - value: identificador unico do painel (usado pelo fx-accordion).\r\n *  - expanded: presenca indica painel aberto (controlado pelo fx-accordion).\r\n *  - disabled: impede a abertura do painel.\r\n */\r\nexport class FxAccordionPanel extends FxElement {\r\n  static override styles = css`\r\n    :host {\r\n      display: block;\r\n      font-family: var(--fx-font-family);\r\n      font-size: var(--fx-font-size);\r\n      color: var(--fx-text-default);\r\n      border-bottom: 1px solid var(--fx-border-default);\r\n    }\r\n    :host(:last-child) { border-bottom: none; }\r\n    :host([disabled]) { opacity: 0.6; pointer-events: none; }\r\n    .header {\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: space-between;\r\n      gap: var(--fx-space-md);\r\n      width: 100%;\r\n      box-sizing: border-box;\r\n      padding: var(--fx-space-lg, 20px) var(--fx-space-md, 14px);\r\n      border: none;\r\n      background: transparent;\r\n      font-family: inherit;\r\n      font-size: inherit;\r\n      font-weight: 500;\r\n      color: var(--fx-text-muted);\r\n      text-align: left;\r\n      cursor: pointer;\r\n      transition: color var(--fx-motion-duration-fast, 150ms) var(--fx-motion-easing, ease),\r\n        background var(--fx-motion-duration-fast, 150ms) var(--fx-motion-easing, ease);\r\n    }\r\n    .header:hover { color: var(--fx-text-default); }\r\n    .header:focus-visible {\r\n      outline: none;\r\n      box-shadow: var(--fx-effect-focus-ring, none);\r\n      border-radius: var(--fx-radius-sm, 4px);\r\n    }\r\n    :host([expanded]) .header {\r\n      color: var(--fx-text-default);\r\n      font-weight: 700;\r\n    }\r\n    .header-text { flex: 1; min-width: 0; }\r\n    .chevron {\r\n      flex-shrink: 0;\r\n      display: inline-flex;\r\n      align-items: center;\r\n      justify-content: center;\r\n      width: 24px;\r\n      height: 24px;\r\n      color: var(--fx-text-muted);\r\n      transition: transform var(--fx-motion-duration-normal, 250ms) var(--fx-motion-easing, ease);\r\n    }\r\n    :host([expanded]) .chevron { transform: rotate(180deg); color: var(--fx-color-primary); }\r\n    .content {\r\n      display: grid;\r\n      grid-template-rows: 0fr;\r\n      transition: grid-template-rows var(--fx-motion-duration-normal, 250ms) var(--fx-motion-easing, ease);\r\n    }\r\n    :host([expanded]) .content { grid-template-rows: 1fr; }\r\n    .content-inner { overflow: hidden; }\r\n    .content-pad {\r\n      padding: 0 var(--fx-space-md, 14px) var(--fx-space-lg, 20px);\r\n      color: var(--fx-text-muted);\r\n      line-height: 1.6;\r\n    }\r\n  `;\r\n\r\n  static override get observedAttributes(): string[] {\r\n    return ['header', 'expanded', 'disabled'];\r\n  }\r\n\r\n  get header(): string {\r\n    return this.getAttr('header', '');\r\n  }\r\n  set header(v: string) {\r\n    this.setAttribute('header', v);\r\n  }\r\n\r\n  get value(): string {\r\n    return this.getAttr('value', '');\r\n  }\r\n  set value(v: string) {\r\n    this.setAttribute('value', v);\r\n  }\r\n\r\n  get expanded(): boolean {\r\n    return this.hasAttr('expanded');\r\n  }\r\n  set expanded(v: boolean) {\r\n    this.toggleAttr('expanded', v);\r\n  }\r\n\r\n  get disabled(): boolean {\r\n    return this.hasAttr('disabled');\r\n  }\r\n  set disabled(v: boolean) {\r\n    this.toggleAttr('disabled', v);\r\n  }\r\n\r\n  protected override connectedCallback(): void {\r\n    super.connectedCallback();\r\n    // O clique vem do shadow root; composedPath() revela o alvo real.\r\n    this.addEventListener('click', (e) => {\r\n      const path = e.composedPath() as HTMLElement[];\r\n      if (!path.some((el) => el.classList?.contains('header'))) return;\r\n      if (this.disabled) return;\r\n      this.dispatchEvent(\r\n        new CustomEvent('fx-accordion-toggle', {\r\n          bubbles: true,\r\n          composed: true,\r\n          detail: { panel: this },\r\n        }),\r\n      );\r\n    });\r\n    // Re-render quando o atributo expanded muda (para aria-expanded).\r\n    this._mo = new MutationObserver(() => this.render());\r\n    this._mo.observe(this, { attributes: true, attributeFilter: ['expanded', 'header', 'disabled'] });\r\n  }\r\n\r\n  protected override disconnectedCallback(): void {\r\n    this._mo?.disconnect();\r\n    this._mo = null;\r\n  }\r\n\r\n  private _mo: MutationObserver | null = null;\r\n\r\n  protected override render(): void {\r\n    this.setTemplate(`\r\n      <button type=\"button\" class=\"header\" part=\"header\" role=\"button\"\r\n        aria-expanded=\"${this.expanded}\"\r\n        ${this.disabled ? 'aria-disabled=\"true\"' : ''}>\r\n        <span class=\"header-text\" part=\"header-text\">\r\n          <slot name=\"header\">${this.header}</slot>\r\n        </span>\r\n        <span class=\"chevron\" part=\"chevron\" aria-hidden=\"true\">\r\n          <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n            stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n            <polyline points=\"6 9 12 15 18 9\"></polyline>\r\n          </svg>\r\n        </span>\r\n      </button>\r\n      <div class=\"content\" part=\"content\" role=\"region\">\r\n        <div class=\"content-inner\">\r\n          <div class=\"content-pad\" part=\"content-pad\"><slot></slot></div>\r\n        </div>\r\n      </div>\r\n    `);\r\n  }\r\n}\r\n\r\n/**\r\n * <fx-accordion> — Conjunto de paineis expansivos (estilo PrimeVue).\r\n *\r\n * Por padrao (modo single) abrir um painel fecha os outros.\r\n * Adicione o atributo `multiple` para permitir varios paineis abertos.\r\n *\r\n * Uso:\r\n *   <fx-accordion value=\"p1\">\r\n *     <fx-accordion-panel value=\"p1\" header=\"Titulo 1\">Conteudo…</fx-accordion-panel>\r\n *     <fx-accordion-panel value=\"p2\" header=\"Titulo 2\">Conteudo…</fx-accordion-panel>\r\n *   </fx-accordion>\r\n *\r\n * Atributos:\r\n *  - value: valor(es) ativo(s), separados por virgula no modo multiple.\r\n *  - multiple: permite manter varios paineis abertos ao mesmo tempo.\r\n *\r\n * Evento: `change` (composed, detail: { value: string[] }).\r\n */\r\nexport class FxAccordion extends FxElement {\r\n  static override styles = css`\r\n    :host {\r\n      display: block;\r\n      font-family: var(--fx-font-family);\r\n      font-size: var(--fx-font-size);\r\n    }\r\n    .accordion {\r\n      background: var(--fx-surface-background, #ffffff);\r\n      border: 1px solid var(--fx-border-default);\r\n      border-radius: var(--fx-radius-md, 8px);\r\n      overflow: hidden;\r\n      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);\r\n    }\r\n  `;\r\n\r\n  static override get observedAttributes(): string[] {\r\n    return ['value', 'multiple'];\r\n  }\r\n\r\n  get multiple(): boolean {\r\n    return this.hasAttr('multiple');\r\n  }\r\n  set multiple(v: boolean) {\r\n    this.toggleAttr('multiple', v);\r\n  }\r\n\r\n  /** Valores ativos como array. */\r\n  get values(): string[] {\r\n    return this.getAttr('value', '').split(',').map(s => s.trim()).filter(Boolean);\r\n  }\r\n  set values(v: string[]) {\r\n    this.setAttribute('value', v.join(','));\r\n  }\r\n\r\n  protected override connectedCallback(): void {\r\n    this._observer = new MutationObserver(() => this._sync());\r\n    this._observer.observe(this, { childList: true, subtree: true });\r\n    super.connectedCallback();\r\n    // Os paineis filhos podem ainda nao estar upgradados no primeiro sync;\r\n    // reagenda para depois da fila de upgrade de custom elements.\r\n    queueMicrotask(() => this._sync());\r\n  }\r\n\r\n  protected override disconnectedCallback(): void {\r\n    this._observer?.disconnect();\r\n    this._observer = null;\r\n  }\r\n\r\n  private _observer: MutationObserver | null = null;\r\n\r\n  protected override render(): void {\r\n    this.setTemplate(`\r\n      <div class=\"accordion\" part=\"accordion\">\r\n        <slot></slot>\r\n      </div>\r\n    `);\r\n    this._sync();\r\n    this._attachListeners();\r\n  }\r\n\r\n  /** Painéis do accordion (filhos diretos ou descendentes). */\r\n  private get panels(): FxAccordionPanel[] {\r\n    return Array.from(this.querySelectorAll<FxAccordionPanel>('fx-accordion-panel'));\r\n  }\r\n\r\n  private _sync(): void {\r\n    const actives = this.values;\r\n    // Leitura via getAttribute (nao via getters) porque os paineis filhos\r\n    // podem ainda nao estar upgradados quando o accordion conecta.\r\n    const panels = Array.from(this.querySelectorAll('fx-accordion-panel'));\r\n    // Apenas na conexao inicial (sem valor definido): abre o primeiro painel.\r\n    if (!this._initialized && actives.length === 0 && panels.length > 0) {\r\n      this._initialized = true;\r\n      const first = panels.find((p) => !p.hasAttribute('disabled'));\r\n      if (first) {\r\n        this.values = [first.getAttribute('value') || '0'];\r\n        return;\r\n      }\r\n    }\r\n    this._initialized = true;\r\n    panels.forEach((p, i) => {\r\n      const v = p.getAttribute('value') || String(i);\r\n      if (!p.hasAttribute('value')) p.setAttribute('value', v);\r\n      p.toggleAttribute('expanded', actives.includes(v));\r\n    });\r\n  }\r\n\r\n  private _initialized = false;\r\n\r\n  private _attachListeners(): void {\r\n    if (this._listenersAttached) return;\r\n    this._listenersAttached = true;\r\n    // O painel emite 'fx-accordion-toggle' a partir do proprio host\r\n    // (event retargeting do Shadow DOM impede usar closest('.header') aqui).\r\n    this.addEventListener('fx-accordion-toggle', (e) => {\r\n      const panel = (e as CustomEvent).detail?.panel as FxAccordionPanel | undefined;\r\n      if (!panel || panel.disabled) return;\r\n      this.toggle(panel);\r\n    });\r\n  }\r\n\r\n  private _listenersAttached = false;\r\n\r\n  /** Abre/fecha um painel respeitando o modo (single | multiple). */\r\n  toggle(panel: FxAccordionPanel): void {\r\n    const v = panel.value;\r\n    let actives = this.values;\r\n    if (panel.expanded) {\r\n      actives = actives.filter(a => a !== v);\r\n    } else if (this.multiple) {\r\n      actives = [...actives, v];\r\n    } else {\r\n      actives = [v];\r\n    }\r\n    this.values = actives;\r\n    this._sync();\r\n    this.dispatchEvent(\r\n      new CustomEvent('change', {\r\n        bubbles: true,\r\n        composed: true,\r\n        detail: { value: actives },\r\n      }),\r\n    );\r\n  }\r\n\r\n  /** Abre um painel pelo valor. */\r\n  open(value: string): void {\r\n    const panel = this.panels.find((p, i) => (p.value || String(i)) === value);\r\n    if (panel && !panel.expanded) this.toggle(panel);\r\n  }\r\n\r\n  /** Fecha um painel pelo valor. */\r\n  close(value: string): void {\r\n    const panel = this.panels.find((p, i) => (p.value || String(i)) === value);\r\n    if (panel && panel.expanded) this.toggle(panel);\r\n  }\r\n}\r\n\r\nexport function defineFxAccordion(): typeof FxAccordion {\r\n  return defineElement('fx-accordion', FxAccordion);\r\n}\r\n\r\nexport function defineFxAccordionPanel(): typeof FxAccordionPanel {\r\n  return defineElement('fx-accordion-panel', FxAccordionPanel);\r\n}\r\n"],"names":[],"mappings":"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"}

package/dist/components/accordion/index.d.ts

@@ -0,0 +1,2 @@
+export { FxAccordion, FxAccordionPanel } from './accordion';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/accordion/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/index.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC"}

package/dist/components/accordion/index.js

@@ -0,0 +1,9 @@
+import { defineFxAccordion, defineFxAccordionPanel } from "./accordion.js";
+import { FxAccordion, FxAccordionPanel } from "./accordion.js";
+defineFxAccordion();
+defineFxAccordionPanel();
+export {
+  FxAccordion,
+  FxAccordionPanel
+};
+//# sourceMappingURL=index.js.map

package/dist/components/accordion/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/components/accordion/index.ts"],"sourcesContent":["import { defineFxAccordion, defineFxAccordionPanel } from './accordion';\r\n\r\n// Reexporta as classes para uso programático (ex.: instanceof, herança).\r\nexport { FxAccordion, FxAccordionPanel } from './accordion';\r\n\r\n// Auto-registro: basta importar o subpath `@wrrdev/fenix-ui/accordion`\r\n// para que os componentes sejam definidos no CustomElementRegistry.\r\ndefineFxAccordion();\r\ndefineFxAccordionPanel();\r\n"],"names":[],"mappings":";;AAOA,kBAAA;AACA,uBAAA;"}

package/dist/components/calendar/calendar.d.ts

@@ -8,8 +8,8 @@ export declare class FxCalendar extends FxElement {
     private pickStart;
     private pickEnd;
     /** Modo de seleção: 'single' | 'range' | 'multiple'. */
-    get mode(): 'single' | 'range' | 'multiple';
-    set mode(m: 'single' | 'range' | 'multiple');
+    get mode(): "single" | "range" | "multiple";
+    set mode(m: "single" | "range" | "multiple");
     get range(): boolean;
     set range(value: boolean);
     /** Datas selecionadas no modo multiple (CSV no atributo). */

package/dist/components/calendar/calendar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../../src/components/calendar/calendar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAyC5C,qBAAa,UAAW,SAAQ,SAAS;IACvC,OAAgB,MAAM,SAkFpB;IAEF,WAAoB,kBAAkB,IAAI,MAAM,EAAE,CAEjD;IAED,OAAO,CAAC,IAAI,CAAgB;IAC5B,OAAO,CAAC,MAAM,CAA6D;IAC3E,gDAAgD;IAChD,OAAO,CAAC,SAAS,CAAuB;IACxC,OAAO,CAAC,OAAO,CAAuB;IAEtC,wDAAwD;IACxD,IAAI,IAAI,IAAI,QAAQ,GAAG,OAAO,GAAG,UAAU,CAI1C;IACD,IAAI,IAAI,CAAC,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,UAAU,EAE1C;IAED,IAAI,KAAK,IAAI,OAAO,CAEnB;IACD,IAAI,KAAK,CAAC,KAAK,EAAE,OAAO,EAEvB;IAED,6DAA6D;IAC7D,IAAI,MAAM,IAAI,MAAM,EAAE,CAGrB;IACD,IAAI,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,EAExB;IAED,IAAI,KAAK,IAAI,MAAM,CAElB;IACD,IAAI,KAAK,CAAC,CAAC,EAAE,MAAM,EAElB;IAED,OAAO,CAAC,MAAM;IAOd,OAAO,CAAC,MAAM;IAId,OAAO,CAAC,GAAG;IAQX,OAAO,CAAC,WAAW;IAMnB,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,YAAY;IAOpB,OAAO,CAAC,QAAQ;IAIhB,OAAO,CAAC,SAAS;IAIjB,OAAO,CAAC,GAAG;IAMX,2CAA2C;IAC3C,OAAO,CAAC,SAAS;IAuBjB,OAAO,CAAC,IAAI;IAkBZ,OAAO,CAAC,OAAO;IA2Bf,OAAO,CAAC,QAAQ;cAYG,MAAM,IAAI,IAAI;IAiFjC,uDAAuD;IACvD,OAAO,CAAC,QAAQ;CAuBjB;AAED,wBAAgB,gBAAgB,IAAI,OAAO,UAAU,CAEpD"}
+{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../../src/components/calendar/calendar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAyC5C,qBAAa,UAAW,SAAQ,SAAS;IACxC,OAAgB,MAAM,SAkIpB;IAEF,WAAoB,kBAAkB,IAAI,MAAM,EAAE,CAajD;IAED,OAAO,CAAC,IAAI,CAAgB;IAC5B,OAAO,CAAC,MAAM,CAA6D;IAC3E,gDAAgD;IAChD,OAAO,CAAC,SAAS,CAAuB;IACxC,OAAO,CAAC,OAAO,CAAuB;IAEtC,wDAAwD;IACxD,IAAI,IAAI,IAAI,QAAQ,GAAG,OAAO,GAAG,UAAU,CAI1C;IACD,IAAI,IAAI,CAAC,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,UAAU,EAE1C;IAED,IAAI,KAAK,IAAI,OAAO,CAEnB;IACD,IAAI,KAAK,CAAC,KAAK,EAAE,OAAO,EAEvB;IAED,6DAA6D;IAC7D,IAAI,MAAM,IAAI,MAAM,EAAE,CAQrB;IACD,IAAI,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,EAExB;IAED,IAAI,KAAK,IAAI,MAAM,CAElB;IACD,IAAI,KAAK,CAAC,CAAC,EAAE,MAAM,EAElB;IAED,OAAO,CAAC,MAAM;IAOd,OAAO,CAAC,MAAM;IAId,OAAO,CAAC,GAAG;IAQX,OAAO,CAAC,WAAW;IAMnB,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,YAAY;IAOpB,OAAO,CAAC,QAAQ;IAIhB,OAAO,CAAC,SAAS;IAQjB,OAAO,CAAC,GAAG;IAMX,2CAA2C;IAC3C,OAAO,CAAC,SAAS;IAyBjB,OAAO,CAAC,IAAI;IA0CZ,OAAO,CAAC,OAAO;IA4Bf,OAAO,CAAC,QAAQ;cAYG,MAAM,IAAI,IAAI;IAgGjC,uDAAuD;IACvD,OAAO,CAAC,QAAQ;CAsChB;AAED,wBAAgB,gBAAgB,IAAI,OAAO,UAAU,CAEpD"}