aeico-components 0.1.4 → 0.1.6

package/dist/chunks/drawer.cjs

@@ -0,0 +1,180 @@
+"use strict";
+const variables = require("./variables.cjs");
+const aeicoComponent = require("./aeico-component.cjs");
+const aeico = require("aeico");
+const style = "/**\n * :host is placed in the light DOM. Setting position:fixed on it guarantees\n * viewport-level coverage regardless of any z-index stacking inside the page.\n */\n:host {\n  display: none;\n}\n\n:host([data-open]) {\n  display: block;\n  position: fixed;\n  inset: 0;\n  z-index: var(--ae-drawer-z-index, 1000);\n  /* Host covers the viewport but passes pointer events through by default.\n     Backdrop and panel re-enable them selectively. */\n  pointer-events: none;\n}\n\n/* ── Backdrop ────────────────────────────────────────────────────── */\n.backdrop {\n  position: absolute;\n  inset: 0;\n  background: var(--color-overlay);\n  animation: drawer-backdrop-in 0.2s ease;\n  pointer-events: auto;\n}\n\n/* ── Panel ───────────────────────────────────────────────────────── */\n.panel {\n  position: absolute;\n  display: flex;\n  flex-direction: column;\n  background: var(--surface-overlay);\n  color: var(--color-text-main);\n  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.2);\n  overflow: hidden;\n  pointer-events: auto;\n  outline: none;\n}\n\n/* ── Placements ──────────────────────────────────────────────────── */\n.panel.placement-right {\n  inset: 0 0 0 auto;\n  width: var(--ae-drawer-size, 320px);\n  max-width: 100%;\n  border-radius: 8px 0 0 8px;\n  animation: drawer-slide-in-right 0.25s cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.panel.placement-left {\n  inset: 0 auto 0 0;\n  width: var(--ae-drawer-size, 320px);\n  max-width: 100%;\n  border-radius: 0 8px 8px 0;\n  animation: drawer-slide-in-left 0.25s cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.panel.placement-top {\n  inset: 0 0 auto 0;\n  height: var(--ae-drawer-size, 320px);\n  max-height: 100%;\n  border-radius: 0 0 8px 8px;\n  animation: drawer-slide-in-top 0.25s cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.panel.placement-bottom {\n  inset: auto 0 0 0;\n  height: var(--ae-drawer-size, 320px);\n  max-height: 100%;\n  border-radius: 8px 8px 0 0;\n  animation: drawer-slide-in-bottom 0.25s cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n/* ── Keyframes ───────────────────────────────────────────────────── */\n@keyframes drawer-backdrop-in {\n  from { opacity: 0; }\n  to   { opacity: 1; }\n}\n\n@keyframes drawer-slide-in-right {\n  from { transform: translateX(100%); }\n  to   { transform: translateX(0); }\n}\n\n@keyframes drawer-slide-in-left {\n  from { transform: translateX(-100%); }\n  to   { transform: translateX(0); }\n}\n\n@keyframes drawer-slide-in-top {\n  from { transform: translateY(-100%); }\n  to   { transform: translateY(0); }\n}\n\n@keyframes drawer-slide-in-bottom {\n  from { transform: translateY(100%); }\n  to   { transform: translateY(0); }\n}\n\n/* ── Header ──────────────────────────────────────────────────────── */\nheader {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 16px 20px;\n  border-bottom: 1px solid var(--border-subtle);\n  flex-shrink: 0;\n}\n\n.label {\n  flex: 1;\n  font-size: var(--size-m, 1rem);\n  font-weight: 500;\n  margin: 0;\n  color: var(--color-text-main);\n}\n\n.close-btn {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  width: 28px;\n  height: 28px;\n  padding: 0;\n  border: none;\n  border-radius: 4px;\n  background: transparent;\n  color: var(--color-text-muted);\n  font-size: 18px;\n  line-height: 1;\n  cursor: pointer;\n  transition: background 0.15s, color 0.15s;\n}\n\n.close-btn:hover {\n  background: var(--border-subtle);\n  color: var(--color-text-main);\n}\n\n/* ── Body ────────────────────────────────────────────────────────── */\n.body {\n  flex: 1;\n  overflow-y: auto;\n  padding: 20px;\n}\n\n/* ── Footer ──────────────────────────────────────────────────────── */\nfooter {\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  gap: 8px;\n  padding: 12px 20px;\n  border-top: 1px solid var(--border-subtle);\n  flex-shrink: 0;\n}\n\n::slotted([data-align-left]) {\n  margin-right: auto;\n}\n";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __knownSymbol = (name, symbol) => (symbol = Symbol[name]) ? symbol : Symbol.for("Symbol." + name);
+var __typeError = (msg) => {
+  throw TypeError(msg);
+};
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __decoratorStart = (base) => [, , , __create((base == null ? void 0 : base[__knownSymbol("metadata")]) ?? null)];
+var __decoratorStrings = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"];
+var __expectFn = (fn) => fn !== void 0 && typeof fn !== "function" ? __typeError("Function expected") : fn;
+var __decoratorContext = (kind, name, done, metadata, fns) => ({ kind: __decoratorStrings[kind], name, metadata, addInitializer: (fn) => done._ ? __typeError("Already initialized") : fns.push(__expectFn(fn || null)) });
+var __decoratorMetadata = (array, target) => __defNormalProp(target, __knownSymbol("metadata"), array[3]);
+var __runInitializers = (array, flags, self, value) => {
+  for (var i = 0, fns = array[flags >> 1], n = fns && fns.length; i < n; i++) flags & 1 ? fns[i].call(self) : value = fns[i].call(self, value);
+  return value;
+};
+var __decorateElement = (array, flags, name, decorators, target, extra) => {
+  var fn, it, done, ctx, access, k = flags & 7, s = false, p = false;
+  var j = array.length + 1, key = __decoratorStrings[k + 5];
+  var initializers = array[j - 1] = [], extraInitializers = array[j] || (array[j] = []);
+  var desc = (target = target.prototype, __getOwnPropDesc({ get [name]() {
+    return __privateGet(this, extra);
+  }, set [name](x) {
+    return __privateSet(this, extra, x);
+  } }, name));
+  for (var i = decorators.length - 1; i >= 0; i--) {
+    ctx = __decoratorContext(k, name, done = {}, array[3], extraInitializers);
+    {
+      ctx.static = s, ctx.private = p, access = ctx.access = { has: (x) => name in x };
+      access.get = (x) => x[name];
+      access.set = (x, y) => x[name] = y;
+    }
+    it = (0, decorators[i])({ get: desc.get, set: desc.set }, ctx), done._ = 1;
+    if (it === void 0) __expectFn(it) && (desc[key] = it);
+    else if (typeof it !== "object" || it === null) __typeError("Object expected");
+    else __expectFn(fn = it.get) && (desc.get = fn), __expectFn(fn = it.set) && (desc.set = fn), __expectFn(fn = it.init) && initializers.unshift(fn);
+  }
+  return desc && __defProp(target, name, desc), target;
+};
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
+var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), member.get(obj));
+var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
+var _closeOnOverlayClick_dec, _header_dec, _closable_dec, _modal_dec, _size_dec, _placement_dec, _label_dec, _a, _init, _label, _placement, _size, _modal, _closable, _header, _closeOnOverlayClick;
+class Drawer extends (_a = aeicoComponent.AeicoComponent, _label_dec = [aeico.prop({ type: String })], _placement_dec = [aeico.prop({ type: String })], _size_dec = [aeico.prop({ type: String })], _modal_dec = [aeico.prop({ type: Boolean })], _closable_dec = [aeico.prop({ type: Boolean })], _header_dec = [aeico.prop({ type: Boolean })], _closeOnOverlayClick_dec = [aeico.prop({ type: Boolean })], _a) {
+  constructor() {
+    super(...arguments);
+    __privateAdd(this, _label, __runInitializers(_init, 8, this)), __runInitializers(_init, 11, this);
+    __privateAdd(this, _placement, __runInitializers(_init, 12, this)), __runInitializers(_init, 15, this);
+    __privateAdd(this, _size, __runInitializers(_init, 16, this)), __runInitializers(_init, 19, this);
+    __privateAdd(this, _modal, __runInitializers(_init, 20, this, true)), __runInitializers(_init, 23, this);
+    __privateAdd(this, _closable, __runInitializers(_init, 24, this, true)), __runInitializers(_init, 27, this);
+    __privateAdd(this, _header, __runInitializers(_init, 28, this, true)), __runInitializers(_init, 31, this);
+    __privateAdd(this, _closeOnOverlayClick, __runInitializers(_init, 32, this, true)), __runInitializers(_init, 35, this);
+    __publicField(this, "_panelEl", null);
+    __publicField(this, "_hasFooter", false);
+    __publicField(this, "_handleBackdropClick", () => {
+      if (this.closeOnOverlayClick) {
+        this.close();
+      }
+    });
+    __publicField(this, "_handlePanelClick", (e) => {
+      const path = e.composedPath();
+      for (const el of path) {
+        if (el instanceof Element && el.hasAttribute("data-close")) {
+          this.close();
+          return;
+        }
+        if (el === this._panelEl) break;
+      }
+    });
+    __publicField(this, "_handleKeydown", (e) => {
+      if (e.key === "Escape") {
+        e.stopPropagation();
+        this.close();
+      }
+    });
+    __publicField(this, "_handleFooterSlotChange", (e) => {
+      const slotEl = e.target;
+      const hasContent = slotEl.assignedElements().length > 0;
+      if (hasContent !== this._hasFooter) {
+        this._hasFooter = hasContent;
+        this.update();
+      }
+    });
+  }
+  render() {
+    const placement = this.placement || "right";
+    const isVertical = placement === "top" || placement === "bottom";
+    return aeico.html(({ div, header, footer, span, button, slot }) => {
+      if (this.modal) {
+        div({ className: "backdrop", "@click": this._handleBackdropClick });
+      }
+      this._panelEl = div(
+        {
+          className: `panel placement-${placement}`,
+          role: "dialog",
+          "aria-modal": this.modal ? "true" : "false",
+          "aria-label": this.label,
+          tabindex: "-1",
+          "@click": this._handlePanelClick,
+          style: {
+            [isVertical ? "height" : "width"]: this.size || ""
+          }
+        },
+        () => {
+          if (this.header) {
+            header({}, () => {
+              slot({ name: "header" }, () => {
+                span({ className: "label", textContent: this.label || "" });
+              });
+              if (this.closable) {
+                button({
+                  className: "close-btn",
+                  textContent: "×",
+                  "@click": () => this.close()
+                });
+              }
+            });
+          }
+          div({ className: "body" }, () => {
+            slot();
+          });
+          footer({ style: { display: this._hasFooter ? "" : "none" } }, () => {
+            slot({ name: "footer", "@slotchange": this._handleFooterSlotChange });
+          });
+        }
+      );
+    });
+  }
+  open() {
+    this.setAttribute("data-open", "");
+    document.addEventListener("keydown", this._handleKeydown);
+    requestAnimationFrame(() => {
+      var _a2, _b;
+      const btn = (_a2 = this.shadowRoot) == null ? void 0 : _a2.querySelector(".close-btn");
+      (_b = btn ?? this._panelEl) == null ? void 0 : _b.focus();
+    });
+    this.emit("open", { detail: { target: this } });
+  }
+  close() {
+    this.removeAttribute("data-open");
+    document.removeEventListener("keydown", this._handleKeydown);
+    this.emit("close", { detail: { target: this } });
+  }
+  isOpen() {
+    return this.hasAttribute("data-open");
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    document.removeEventListener("keydown", this._handleKeydown);
+  }
+}
+_init = __decoratorStart(_a);
+_label = /* @__PURE__ */ new WeakMap();
+_placement = /* @__PURE__ */ new WeakMap();
+_size = /* @__PURE__ */ new WeakMap();
+_modal = /* @__PURE__ */ new WeakMap();
+_closable = /* @__PURE__ */ new WeakMap();
+_header = /* @__PURE__ */ new WeakMap();
+_closeOnOverlayClick = /* @__PURE__ */ new WeakMap();
+__decorateElement(_init, 4, "label", _label_dec, Drawer, _label);
+__decorateElement(_init, 4, "placement", _placement_dec, Drawer, _placement);
+__decorateElement(_init, 4, "size", _size_dec, Drawer, _size);
+__decorateElement(_init, 4, "modal", _modal_dec, Drawer, _modal);
+__decorateElement(_init, 4, "closable", _closable_dec, Drawer, _closable);
+__decorateElement(_init, 4, "header", _header_dec, Drawer, _header);
+__decorateElement(_init, 4, "closeOnOverlayClick", _closeOnOverlayClick_dec, Drawer, _closeOnOverlayClick);
+__decoratorMetadata(_init, Drawer);
+__publicField(Drawer, "styles", [variables.variables, style]);
+Drawer.register();
+exports.Drawer = Drawer;
+//# sourceMappingURL=drawer.cjs.map

package/dist/chunks/drawer.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer.cjs","sources":["../../src/drawer/drawer.ts"],"sourcesContent":["import type { InferProps } from 'aeico';\nimport styleVariables from '../styles/variables.css?inline';\nimport style from '../styles/components/drawer.css?inline';\nimport AeicoComponent from '../aeico-component';\nimport { html, prop } from 'aeico';\nimport type { DrawerPlacement } from './defines';\n\nclass Drawer extends AeicoComponent {\n  protected static styles = [styleVariables, style];\n\n  @prop({ type: String })\n  accessor label: string | undefined;\n\n  @prop({ type: String })\n  accessor placement: DrawerPlacement | undefined;\n\n  @prop({ type: String })\n  accessor size: string | undefined;\n\n  @prop({ type: Boolean })\n  accessor modal: boolean = true;\n\n  @prop({ type: Boolean })\n  accessor closable: boolean = true;\n\n  @prop({ type: Boolean })\n  accessor header: boolean = true;\n\n  @prop({ type: Boolean })\n  accessor closeOnOverlayClick: boolean = true;\n\n  private _panelEl: HTMLDivElement | null = null;\n  private _hasFooter = false;\n\n  protected render() {\n    const placement = this.placement || 'right';\n    const isVertical = placement === 'top' || placement === 'bottom';\n\n    return html(({ div, header, footer, span, button, slot }) => {\n      // Backdrop (modal only)\n      if (this.modal) {\n        div({ className: 'backdrop', '@click': this._handleBackdropClick });\n      }\n\n      // Panel\n      this._panelEl = div(\n        {\n          className: `panel placement-${placement}`,\n          role: 'dialog',\n          'aria-modal': this.modal ? 'true' : 'false',\n          'aria-label': this.label,\n          tabindex: '-1',\n          '@click': this._handlePanelClick,\n          style: {\n            [isVertical ? 'height' : 'width']: this.size || '',\n          },\n        },\n        () => {\n          // Header\n          if (this.header) {\n            header({}, () => {\n              slot({ name: 'header' }, () => {\n                span({ className: 'label', textContent: this.label || '' });\n              });\n              if (this.closable) {\n                button({\n                  className: 'close-btn',\n                  textContent: '×',\n                  '@click': () => this.close(),\n                });\n              }\n            });\n          }\n\n          // Body\n          div({ className: 'body' }, () => {\n            slot();\n          });\n\n          // Footer — always rendered to capture slotchange, hidden when empty\n          footer({ style: { display: this._hasFooter ? '' : 'none' } }, () => {\n            slot({ name: 'footer', '@slotchange': this._handleFooterSlotChange });\n          });\n        },\n      );\n    });\n  }\n\n  private _handleBackdropClick = () => {\n    if (this.closeOnOverlayClick) {\n      this.close();\n    }\n  };\n\n  private _handlePanelClick = (e: Event) => {\n    const path = (e as MouseEvent).composedPath();\n    for (const el of path) {\n      if (el instanceof Element && el.hasAttribute('data-close')) {\n        this.close();\n        return;\n      }\n      if (el === this._panelEl) break;\n    }\n  };\n\n  private _handleKeydown = (e: KeyboardEvent) => {\n    if (e.key === 'Escape') {\n      e.stopPropagation();\n      this.close();\n    }\n  };\n\n  private _handleFooterSlotChange = (e: Event) => {\n    const slotEl = e.target as HTMLSlotElement;\n    const hasContent = slotEl.assignedElements().length > 0;\n    if (hasContent !== this._hasFooter) {\n      this._hasFooter = hasContent;\n      this.update();\n    }\n  };\n\n  open() {\n    this.setAttribute('data-open', '');\n    document.addEventListener('keydown', this._handleKeydown);\n    requestAnimationFrame(() => {\n      const btn = this.shadowRoot?.querySelector<HTMLElement>('.close-btn');\n      (btn ?? this._panelEl)?.focus();\n    });\n    this.emit('open', { detail: { target: this } });\n  }\n\n  close() {\n    this.removeAttribute('data-open');\n    document.removeEventListener('keydown', this._handleKeydown);\n    this.emit('close', { detail: { target: this } });\n  }\n\n  isOpen(): boolean {\n    return this.hasAttribute('data-open');\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    document.removeEventListener('keydown', this._handleKeydown);\n  }\n}\n\nDrawer.register();\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ae-drawer': Drawer;\n  }\n}\n\nexport default Drawer;\nexport type DrawerProps = InferProps<typeof Drawer>;\n"],"names":["prop","html","_a","styleVariables"],"mappings":"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"}

package/dist/chunks/drawer.js

@@ -0,0 +1,181 @@
+import { v as variables } from "./variables.js";
+import { A as AeicoComponent } from "./aeico-component.js";
+import { prop, html } from "aeico";
+const style = "/**\n * :host is placed in the light DOM. Setting position:fixed on it guarantees\n * viewport-level coverage regardless of any z-index stacking inside the page.\n */\n:host {\n  display: none;\n}\n\n:host([data-open]) {\n  display: block;\n  position: fixed;\n  inset: 0;\n  z-index: var(--ae-drawer-z-index, 1000);\n  /* Host covers the viewport but passes pointer events through by default.\n     Backdrop and panel re-enable them selectively. */\n  pointer-events: none;\n}\n\n/* ── Backdrop ────────────────────────────────────────────────────── */\n.backdrop {\n  position: absolute;\n  inset: 0;\n  background: var(--color-overlay);\n  animation: drawer-backdrop-in 0.2s ease;\n  pointer-events: auto;\n}\n\n/* ── Panel ───────────────────────────────────────────────────────── */\n.panel {\n  position: absolute;\n  display: flex;\n  flex-direction: column;\n  background: var(--surface-overlay);\n  color: var(--color-text-main);\n  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.2);\n  overflow: hidden;\n  pointer-events: auto;\n  outline: none;\n}\n\n/* ── Placements ──────────────────────────────────────────────────── */\n.panel.placement-right {\n  inset: 0 0 0 auto;\n  width: var(--ae-drawer-size, 320px);\n  max-width: 100%;\n  border-radius: 8px 0 0 8px;\n  animation: drawer-slide-in-right 0.25s cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.panel.placement-left {\n  inset: 0 auto 0 0;\n  width: var(--ae-drawer-size, 320px);\n  max-width: 100%;\n  border-radius: 0 8px 8px 0;\n  animation: drawer-slide-in-left 0.25s cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.panel.placement-top {\n  inset: 0 0 auto 0;\n  height: var(--ae-drawer-size, 320px);\n  max-height: 100%;\n  border-radius: 0 0 8px 8px;\n  animation: drawer-slide-in-top 0.25s cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.panel.placement-bottom {\n  inset: auto 0 0 0;\n  height: var(--ae-drawer-size, 320px);\n  max-height: 100%;\n  border-radius: 8px 8px 0 0;\n  animation: drawer-slide-in-bottom 0.25s cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n/* ── Keyframes ───────────────────────────────────────────────────── */\n@keyframes drawer-backdrop-in {\n  from { opacity: 0; }\n  to   { opacity: 1; }\n}\n\n@keyframes drawer-slide-in-right {\n  from { transform: translateX(100%); }\n  to   { transform: translateX(0); }\n}\n\n@keyframes drawer-slide-in-left {\n  from { transform: translateX(-100%); }\n  to   { transform: translateX(0); }\n}\n\n@keyframes drawer-slide-in-top {\n  from { transform: translateY(-100%); }\n  to   { transform: translateY(0); }\n}\n\n@keyframes drawer-slide-in-bottom {\n  from { transform: translateY(100%); }\n  to   { transform: translateY(0); }\n}\n\n/* ── Header ──────────────────────────────────────────────────────── */\nheader {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 16px 20px;\n  border-bottom: 1px solid var(--border-subtle);\n  flex-shrink: 0;\n}\n\n.label {\n  flex: 1;\n  font-size: var(--size-m, 1rem);\n  font-weight: 500;\n  margin: 0;\n  color: var(--color-text-main);\n}\n\n.close-btn {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  width: 28px;\n  height: 28px;\n  padding: 0;\n  border: none;\n  border-radius: 4px;\n  background: transparent;\n  color: var(--color-text-muted);\n  font-size: 18px;\n  line-height: 1;\n  cursor: pointer;\n  transition: background 0.15s, color 0.15s;\n}\n\n.close-btn:hover {\n  background: var(--border-subtle);\n  color: var(--color-text-main);\n}\n\n/* ── Body ────────────────────────────────────────────────────────── */\n.body {\n  flex: 1;\n  overflow-y: auto;\n  padding: 20px;\n}\n\n/* ── Footer ──────────────────────────────────────────────────────── */\nfooter {\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  gap: 8px;\n  padding: 12px 20px;\n  border-top: 1px solid var(--border-subtle);\n  flex-shrink: 0;\n}\n\n::slotted([data-align-left]) {\n  margin-right: auto;\n}\n";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __knownSymbol = (name, symbol) => (symbol = Symbol[name]) ? symbol : Symbol.for("Symbol." + name);
+var __typeError = (msg) => {
+  throw TypeError(msg);
+};
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __decoratorStart = (base) => [, , , __create((base == null ? void 0 : base[__knownSymbol("metadata")]) ?? null)];
+var __decoratorStrings = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"];
+var __expectFn = (fn) => fn !== void 0 && typeof fn !== "function" ? __typeError("Function expected") : fn;
+var __decoratorContext = (kind, name, done, metadata, fns) => ({ kind: __decoratorStrings[kind], name, metadata, addInitializer: (fn) => done._ ? __typeError("Already initialized") : fns.push(__expectFn(fn || null)) });
+var __decoratorMetadata = (array, target) => __defNormalProp(target, __knownSymbol("metadata"), array[3]);
+var __runInitializers = (array, flags, self, value) => {
+  for (var i = 0, fns = array[flags >> 1], n = fns && fns.length; i < n; i++) flags & 1 ? fns[i].call(self) : value = fns[i].call(self, value);
+  return value;
+};
+var __decorateElement = (array, flags, name, decorators, target, extra) => {
+  var fn, it, done, ctx, access, k = flags & 7, s = false, p = false;
+  var j = array.length + 1, key = __decoratorStrings[k + 5];
+  var initializers = array[j - 1] = [], extraInitializers = array[j] || (array[j] = []);
+  var desc = (target = target.prototype, __getOwnPropDesc({ get [name]() {
+    return __privateGet(this, extra);
+  }, set [name](x) {
+    return __privateSet(this, extra, x);
+  } }, name));
+  for (var i = decorators.length - 1; i >= 0; i--) {
+    ctx = __decoratorContext(k, name, done = {}, array[3], extraInitializers);
+    {
+      ctx.static = s, ctx.private = p, access = ctx.access = { has: (x) => name in x };
+      access.get = (x) => x[name];
+      access.set = (x, y) => x[name] = y;
+    }
+    it = (0, decorators[i])({ get: desc.get, set: desc.set }, ctx), done._ = 1;
+    if (it === void 0) __expectFn(it) && (desc[key] = it);
+    else if (typeof it !== "object" || it === null) __typeError("Object expected");
+    else __expectFn(fn = it.get) && (desc.get = fn), __expectFn(fn = it.set) && (desc.set = fn), __expectFn(fn = it.init) && initializers.unshift(fn);
+  }
+  return desc && __defProp(target, name, desc), target;
+};
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
+var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), member.get(obj));
+var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
+var _closeOnOverlayClick_dec, _header_dec, _closable_dec, _modal_dec, _size_dec, _placement_dec, _label_dec, _a, _init, _label, _placement, _size, _modal, _closable, _header, _closeOnOverlayClick;
+class Drawer extends (_a = AeicoComponent, _label_dec = [prop({ type: String })], _placement_dec = [prop({ type: String })], _size_dec = [prop({ type: String })], _modal_dec = [prop({ type: Boolean })], _closable_dec = [prop({ type: Boolean })], _header_dec = [prop({ type: Boolean })], _closeOnOverlayClick_dec = [prop({ type: Boolean })], _a) {
+  constructor() {
+    super(...arguments);
+    __privateAdd(this, _label, __runInitializers(_init, 8, this)), __runInitializers(_init, 11, this);
+    __privateAdd(this, _placement, __runInitializers(_init, 12, this)), __runInitializers(_init, 15, this);
+    __privateAdd(this, _size, __runInitializers(_init, 16, this)), __runInitializers(_init, 19, this);
+    __privateAdd(this, _modal, __runInitializers(_init, 20, this, true)), __runInitializers(_init, 23, this);
+    __privateAdd(this, _closable, __runInitializers(_init, 24, this, true)), __runInitializers(_init, 27, this);
+    __privateAdd(this, _header, __runInitializers(_init, 28, this, true)), __runInitializers(_init, 31, this);
+    __privateAdd(this, _closeOnOverlayClick, __runInitializers(_init, 32, this, true)), __runInitializers(_init, 35, this);
+    __publicField(this, "_panelEl", null);
+    __publicField(this, "_hasFooter", false);
+    __publicField(this, "_handleBackdropClick", () => {
+      if (this.closeOnOverlayClick) {
+        this.close();
+      }
+    });
+    __publicField(this, "_handlePanelClick", (e) => {
+      const path = e.composedPath();
+      for (const el of path) {
+        if (el instanceof Element && el.hasAttribute("data-close")) {
+          this.close();
+          return;
+        }
+        if (el === this._panelEl) break;
+      }
+    });
+    __publicField(this, "_handleKeydown", (e) => {
+      if (e.key === "Escape") {
+        e.stopPropagation();
+        this.close();
+      }
+    });
+    __publicField(this, "_handleFooterSlotChange", (e) => {
+      const slotEl = e.target;
+      const hasContent = slotEl.assignedElements().length > 0;
+      if (hasContent !== this._hasFooter) {
+        this._hasFooter = hasContent;
+        this.update();
+      }
+    });
+  }
+  render() {
+    const placement = this.placement || "right";
+    const isVertical = placement === "top" || placement === "bottom";
+    return html(({ div, header, footer, span, button, slot }) => {
+      if (this.modal) {
+        div({ className: "backdrop", "@click": this._handleBackdropClick });
+      }
+      this._panelEl = div(
+        {
+          className: `panel placement-${placement}`,
+          role: "dialog",
+          "aria-modal": this.modal ? "true" : "false",
+          "aria-label": this.label,
+          tabindex: "-1",
+          "@click": this._handlePanelClick,
+          style: {
+            [isVertical ? "height" : "width"]: this.size || ""
+          }
+        },
+        () => {
+          if (this.header) {
+            header({}, () => {
+              slot({ name: "header" }, () => {
+                span({ className: "label", textContent: this.label || "" });
+              });
+              if (this.closable) {
+                button({
+                  className: "close-btn",
+                  textContent: "×",
+                  "@click": () => this.close()
+                });
+              }
+            });
+          }
+          div({ className: "body" }, () => {
+            slot();
+          });
+          footer({ style: { display: this._hasFooter ? "" : "none" } }, () => {
+            slot({ name: "footer", "@slotchange": this._handleFooterSlotChange });
+          });
+        }
+      );
+    });
+  }
+  open() {
+    this.setAttribute("data-open", "");
+    document.addEventListener("keydown", this._handleKeydown);
+    requestAnimationFrame(() => {
+      var _a2, _b;
+      const btn = (_a2 = this.shadowRoot) == null ? void 0 : _a2.querySelector(".close-btn");
+      (_b = btn ?? this._panelEl) == null ? void 0 : _b.focus();
+    });
+    this.emit("open", { detail: { target: this } });
+  }
+  close() {
+    this.removeAttribute("data-open");
+    document.removeEventListener("keydown", this._handleKeydown);
+    this.emit("close", { detail: { target: this } });
+  }
+  isOpen() {
+    return this.hasAttribute("data-open");
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    document.removeEventListener("keydown", this._handleKeydown);
+  }
+}
+_init = __decoratorStart(_a);
+_label = /* @__PURE__ */ new WeakMap();
+_placement = /* @__PURE__ */ new WeakMap();
+_size = /* @__PURE__ */ new WeakMap();
+_modal = /* @__PURE__ */ new WeakMap();
+_closable = /* @__PURE__ */ new WeakMap();
+_header = /* @__PURE__ */ new WeakMap();
+_closeOnOverlayClick = /* @__PURE__ */ new WeakMap();
+__decorateElement(_init, 4, "label", _label_dec, Drawer, _label);
+__decorateElement(_init, 4, "placement", _placement_dec, Drawer, _placement);
+__decorateElement(_init, 4, "size", _size_dec, Drawer, _size);
+__decorateElement(_init, 4, "modal", _modal_dec, Drawer, _modal);
+__decorateElement(_init, 4, "closable", _closable_dec, Drawer, _closable);
+__decorateElement(_init, 4, "header", _header_dec, Drawer, _header);
+__decorateElement(_init, 4, "closeOnOverlayClick", _closeOnOverlayClick_dec, Drawer, _closeOnOverlayClick);
+__decoratorMetadata(_init, Drawer);
+__publicField(Drawer, "styles", [variables, style]);
+Drawer.register();
+export {
+  Drawer as D
+};
+//# sourceMappingURL=drawer.js.map

package/dist/chunks/drawer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer.js","sources":["../../src/drawer/drawer.ts"],"sourcesContent":["import type { InferProps } from 'aeico';\nimport styleVariables from '../styles/variables.css?inline';\nimport style from '../styles/components/drawer.css?inline';\nimport AeicoComponent from '../aeico-component';\nimport { html, prop } from 'aeico';\nimport type { DrawerPlacement } from './defines';\n\nclass Drawer extends AeicoComponent {\n  protected static styles = [styleVariables, style];\n\n  @prop({ type: String })\n  accessor label: string | undefined;\n\n  @prop({ type: String })\n  accessor placement: DrawerPlacement | undefined;\n\n  @prop({ type: String })\n  accessor size: string | undefined;\n\n  @prop({ type: Boolean })\n  accessor modal: boolean = true;\n\n  @prop({ type: Boolean })\n  accessor closable: boolean = true;\n\n  @prop({ type: Boolean })\n  accessor header: boolean = true;\n\n  @prop({ type: Boolean })\n  accessor closeOnOverlayClick: boolean = true;\n\n  private _panelEl: HTMLDivElement | null = null;\n  private _hasFooter = false;\n\n  protected render() {\n    const placement = this.placement || 'right';\n    const isVertical = placement === 'top' || placement === 'bottom';\n\n    return html(({ div, header, footer, span, button, slot }) => {\n      // Backdrop (modal only)\n      if (this.modal) {\n        div({ className: 'backdrop', '@click': this._handleBackdropClick });\n      }\n\n      // Panel\n      this._panelEl = div(\n        {\n          className: `panel placement-${placement}`,\n          role: 'dialog',\n          'aria-modal': this.modal ? 'true' : 'false',\n          'aria-label': this.label,\n          tabindex: '-1',\n          '@click': this._handlePanelClick,\n          style: {\n            [isVertical ? 'height' : 'width']: this.size || '',\n          },\n        },\n        () => {\n          // Header\n          if (this.header) {\n            header({}, () => {\n              slot({ name: 'header' }, () => {\n                span({ className: 'label', textContent: this.label || '' });\n              });\n              if (this.closable) {\n                button({\n                  className: 'close-btn',\n                  textContent: '×',\n                  '@click': () => this.close(),\n                });\n              }\n            });\n          }\n\n          // Body\n          div({ className: 'body' }, () => {\n            slot();\n          });\n\n          // Footer — always rendered to capture slotchange, hidden when empty\n          footer({ style: { display: this._hasFooter ? '' : 'none' } }, () => {\n            slot({ name: 'footer', '@slotchange': this._handleFooterSlotChange });\n          });\n        },\n      );\n    });\n  }\n\n  private _handleBackdropClick = () => {\n    if (this.closeOnOverlayClick) {\n      this.close();\n    }\n  };\n\n  private _handlePanelClick = (e: Event) => {\n    const path = (e as MouseEvent).composedPath();\n    for (const el of path) {\n      if (el instanceof Element && el.hasAttribute('data-close')) {\n        this.close();\n        return;\n      }\n      if (el === this._panelEl) break;\n    }\n  };\n\n  private _handleKeydown = (e: KeyboardEvent) => {\n    if (e.key === 'Escape') {\n      e.stopPropagation();\n      this.close();\n    }\n  };\n\n  private _handleFooterSlotChange = (e: Event) => {\n    const slotEl = e.target as HTMLSlotElement;\n    const hasContent = slotEl.assignedElements().length > 0;\n    if (hasContent !== this._hasFooter) {\n      this._hasFooter = hasContent;\n      this.update();\n    }\n  };\n\n  open() {\n    this.setAttribute('data-open', '');\n    document.addEventListener('keydown', this._handleKeydown);\n    requestAnimationFrame(() => {\n      const btn = this.shadowRoot?.querySelector<HTMLElement>('.close-btn');\n      (btn ?? this._panelEl)?.focus();\n    });\n    this.emit('open', { detail: { target: this } });\n  }\n\n  close() {\n    this.removeAttribute('data-open');\n    document.removeEventListener('keydown', this._handleKeydown);\n    this.emit('close', { detail: { target: this } });\n  }\n\n  isOpen(): boolean {\n    return this.hasAttribute('data-open');\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    document.removeEventListener('keydown', this._handleKeydown);\n  }\n}\n\nDrawer.register();\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ae-drawer': Drawer;\n  }\n}\n\nexport default Drawer;\nexport type DrawerProps = InferProps<typeof Drawer>;\n"],"names":["_a","styleVariables"],"mappings":"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"}

package/dist/chunks/dropdown-button.cjs

@@ -224,7 +224,7 @@ __decorateElement$2(_init$2, 4, "checked", _checked_dec, DropdownItem, _checked)
 __decorateElement$2(_init$2, 4, "active", _active_dec, DropdownItem, _active);
 __decoratorMetadata$2(_init$2, DropdownItem);
 __publicField$2(DropdownItem, "tagName", "dropdown-item");
-__publicField$2(DropdownItem, "styles", [variables.styleVariables, style]);
+__publicField$2(DropdownItem, "styles", [variables.variables, style]);
 DropdownItem.register();
 var __create$1 = Object.create;
 var __defProp$1 = Object.defineProperty;
@@ -399,7 +399,7 @@ __decorateElement$1(_init$1, 4, "disabled", _disabled_dec$1, Dropdown, _disabled
 __decorateElement$1(_init$1, 4, "label", _label_dec, Dropdown, _label);
 __decoratorMetadata$1(_init$1, Dropdown);
 __publicField$1(Dropdown, "tagName", "dropdown");
-__publicField$1(Dropdown, "styles", [variables.styleVariables, style$1]);
+__publicField$1(Dropdown, "styles", [variables.variables, style$1]);
 Dropdown.register();
 var __create = Object.create;
 var __defProp = Object.defineProperty;

package/dist/chunks/dropdown-button.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-button.cjs","sources":["../../src/dropdown/dropdown-item.ts","../../src/dropdown/dropdown.ts","../../src/dropdown/dropdown-button.ts"],"sourcesContent":["import AeicoComponent from '../aeico-component';\nimport type { InferProps } from 'aeico';\nimport { html } from 'aeico';\nimport style from '../styles/components/dropdown-item.css?inline';\nimport variables from '../styles/variables.css?inline';\nimport { prop } from 'aeico';\n// Ensure ae-icon is registered when icons are used\nimport '../icon/icon';\n\n/**\n * Dropdown menu item — used as a direct child of `<ae-dropdown>`.\n *\n * Renders as a `<button>` by default, or as an `<a>` anchor when `href` is set.\n * Use `<ae-icon>` inside to add icons, and CSS `color` / `--dropdown-item-color`\n * to apply danger or custom colours.\n *\n * @example\n * ```html\n * <ae-dropdown-item value=\"edit\"><ae-icon name=\"edit\"></ae-icon>Edit</ae-dropdown-item>\n * <ae-dropdown-item value=\"delete\" style=\"--dropdown-item-color:var(--color-danger)\">Delete</ae-dropdown-item>\n * <ae-dropdown-item href=\"/profile\">Profile</ae-dropdown-item>\n * ```\n */\nclass DropdownItem extends AeicoComponent {\n  static tagName = 'dropdown-item';\n\n  /** Value emitted in the `select` event detail on the parent dropdown. */\n  @prop({ type: String })\n  accessor value: string | undefined;\n\n  /** Disables the item — it becomes non-interactive and visually dimmed. */\n  @prop({ type: Boolean })\n  accessor disabled: boolean = false;\n\n  /**\n   * When set, the item renders as an `<a>` anchor element instead of a\n   * `<button>`. Useful for navigation items.\n   */\n  @prop({ type: String })\n  accessor href: string | undefined;\n\n  /**\n   * When `type=\"checkbox\"`, the item behaves as a toggle: each click flips\n   * `checked` and includes the new state in the `select` event detail.\n   */\n  @prop({ type: String })\n  accessor type: 'checkbox' | undefined;\n\n  /**\n   * Whether the item is checked. Only meaningful when `type=\"checkbox\"`.\n   * Reflects as the `checked` attribute.\n   */\n  @prop({ type: Boolean })\n  accessor checked: boolean = false;\n\n  /**\n   * Marks the item as the currently active/selected option (e.g. current route,\n   * current sort order). Purely visual — applies a highlighted background and\n   * accent colour.\n   */\n  @prop({ type: Boolean })\n  accessor active: boolean = false;\n\n  protected static styles = [variables, style];\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.listen('click', this._handleClick);\n    this.setAttribute('role', 'menuitem');\n  }\n\n  private _handleClick = (e: Event): void => {\n    if (this.disabled) {\n      e.preventDefault();\n      e.stopPropagation();\n\n      return;\n    }\n    if (this.type === 'checkbox') {\n      this.checked = !this.checked;\n    }\n    const label = this.textContent?.trim() ?? '';\n    this.dispatchEvent(\n      new CustomEvent('_item-select', {\n        bubbles: true,\n        composed: true,\n        detail: { value: this.value ?? '', label, checked: this.checked },\n      }),\n    );\n  };\n\n  protected render() {\n    const isCheckbox = this.type === 'checkbox';\n    const sharedProps = {\n      part: 'item',\n      className: 'item',\n      'aria-checked': isCheckbox ? String(this.checked) : undefined,\n    };\n    return html(({ button, a, span, slot }) => {\n      const children = () => {\n        if (isCheckbox) span({ className: 'check-indicator', 'aria-hidden': 'true' });\n        slot();\n      };\n      if (this.href) {\n        a(\n          {\n            ...sharedProps,\n            href: this.disabled ? undefined : this.href,\n            'aria-disabled': this.disabled || undefined,\n          },\n          children,\n        );\n      } else {\n        button(\n          {\n            ...sharedProps,\n            type: 'button',\n            disabled: this.disabled,\n          },\n          children,\n        );\n      }\n    });\n  }\n}\n\nDropdownItem.register();\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ae-dropdown-item': DropdownItem;\n  }\n}\n\nexport default DropdownItem;\nexport type DropdownItemProps = InferProps<typeof DropdownItem>;\n","import AeicoComponent from '../aeico-component';\nimport type { InferProps } from 'aeico';\nimport { html } from 'aeico';\nimport { prop } from 'aeico';\nimport style from '../styles/components/dropdown.css?inline';\nimport variables from '../styles/variables.css?inline';\nimport type { DropdownPlacement } from './defines';\n// Ensure ae-dropdown-item is registered when this module is used\nimport './dropdown-item';\n\n/**\n * Dropdown component — renders a floating menu panel anchored to a trigger slot.\n *\n * The trigger is provided via `slot=\"trigger\"` (typically an `<ae-button>`).\n * Menu items are provided as `<ae-dropdown-item>` default-slot children.\n *\n * Emits:\n * - `open`   — when the panel opens\n * - `close`  — when the panel closes\n * - `select` — `{ detail: { value, label } }` when a menu item is clicked\n *\n * @example\n * ```html\n * <ae-dropdown>\n *   <ae-button slot=\"trigger\">Actions</ae-button>\n *   <ae-dropdown-item value=\"edit\" icon=\"edit\">Edit</ae-dropdown-item>\n *   <ae-dropdown-item value=\"delete\" danger icon=\"trash\">Delete</ae-dropdown-item>\n * </ae-dropdown>\n * ```\n *\n * @example\n * ```html\n * <!-- Inside ae-navbar -->\n * <ae-navbar>\n *   <a slot=\"brand\" href=\"/\">MyApp</a>\n *   <ae-dropdown slot=\"end\">\n *     <ae-button slot=\"trigger\" variant=\"outlined\" size=\"sm\">User</ae-button>\n *     <ae-dropdown-item href=\"/profile\" icon=\"user\">Profile</ae-dropdown-item>\n *     <ae-dropdown-item value=\"logout\" danger>Sign out</ae-dropdown-item>\n *   </ae-dropdown>\n * </ae-navbar>\n * ```\n */\nclass Dropdown extends AeicoComponent {\n  static tagName = 'dropdown';\n\n  protected static styles = [variables, style];\n\n  /**\n   * Position of the panel relative to the trigger.\n   * Defaults to `'bottom-start'` (left-aligned, below trigger).\n   */\n  @prop({ type: String })\n  accessor placement: DropdownPlacement = 'bottom-start';\n\n  /**\n   * Whether the dropdown panel is visible. Reflects as the `open` attribute.\n   * Can be used for controlled open/close state.\n   */\n  @prop({ type: Boolean })\n  accessor open: boolean = false;\n\n  /**\n   * When `true` (default), clicking a menu item automatically closes the panel.\n   */\n  @prop({ type: Boolean })\n  accessor closeOnSelect: boolean = true;\n\n  /** Disables the trigger and prevents opening. */\n  @prop({ type: Boolean })\n  accessor disabled: boolean = false;\n\n  /**\n   * Optional label text. When set, `ae-dropdown` renders its own trigger button\n   * in the shadow DOM (no `slot=\"trigger\"` needed). Inherits `--ae-navbar-link-*`\n   * CSS variables so it automatically matches navbar link styles.\n   */\n  @prop({ type: String })\n  accessor label: string = '';\n\n  private _outsideClickHandler: ((e: MouseEvent) => void) | null = null;\n\n  connectedCallback() {\n    super.connectedCallback();\n\n    this.listen('_item-select', this._handleItemSelect as EventListener);\n    this.listen('keydown', this._handleKeydown as EventListener);\n\n    this._outsideClickHandler = (e: MouseEvent) => {\n      if (!this.open) return;\n      const path = e.composedPath();\n      if (!path.includes(this)) {\n        this._closePanel();\n      }\n    };\n    document.addEventListener('click', this._outsideClickHandler);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    if (this._outsideClickHandler) {\n      document.removeEventListener('click', this._outsideClickHandler);\n      this._outsideClickHandler = null;\n    }\n  }\n\n  /** Opens the dropdown panel. */\n  show(): void {\n    if (this.disabled || this.open) return;\n    this.open = true;\n    this.emit('open');\n  }\n\n  /** Closes the dropdown panel. */\n  hide(): void {\n    if (!this.open) return;\n    this.open = false;\n    this.emit('close');\n  }\n\n  /** Toggles the dropdown panel open/closed. */\n  toggle(): void {\n    if (this.open) {\n      this.hide();\n    } else {\n      this.show();\n    }\n  }\n\n  private _closePanel(): void {\n    if (this.open) this.hide();\n  }\n\n  // Called via declarative @click on the trigger-wrapper div inside the shadow DOM.\n  // Events from slotted trigger content bubble through the shadow DOM slot path,\n  // so this fires for trigger clicks only — not for panel item clicks.\n  private _handleTriggerClick = (): void => {\n    this.toggle();\n  };\n\n  private _handleItemSelect = (e: CustomEvent): void => {\n    this.emit('select', { detail: e.detail });\n    if (this.closeOnSelect) {\n      this._closePanel();\n    }\n  };\n\n  private _handleKeydown = (e: KeyboardEvent): void => {\n    if (e.key === 'Escape' && this.open) {\n      e.stopPropagation();\n      this._closePanel();\n    }\n  };\n\n  protected render() {\n    const placementClass = `placement-${this.placement}`;\n    const hasLabel = !!this.label;\n    const dir = this.placement.split('-')[0];\n    return html(({ div, slot, button, span }) => {\n      div(\n        {\n          className: 'trigger-wrapper',\n          'aria-haspopup': 'menu',\n          'aria-expanded': String(this.open),\n          '@click': this.disabled ? undefined : this._handleTriggerClick,\n        },\n        () => {\n          if (hasLabel) {\n            button(\n              {\n                className: 'trigger-label',\n                type: 'button',\n                disabled: this.disabled || undefined,\n              },\n              () => {\n                span({ text: this.label });\n                span({\n                  className: `ae-dropdown-arrow ae-dropdown-arrow--${dir}`,\n                  'aria-hidden': 'true',\n                });\n              },\n            );\n          } else {\n            slot({ name: 'trigger' });\n          }\n        },\n      );\n      div(\n        {\n          part: 'panel',\n          className: { panel: true, open: this.open, [placementClass]: true },\n          role: 'menu',\n        },\n        () => {\n          slot();\n        },\n      );\n    });\n  }\n}\n\nDropdown.register();\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ae-dropdown': Dropdown;\n  }\n}\n\nexport default Dropdown;\nexport type DropdownProps = InferProps<typeof Dropdown>;\n","import AeicoComponent from '../aeico-component';\nimport type { InferProps } from 'aeico';\nimport { html } from 'aeico';\nimport { prop } from 'aeico';\nimport type { ButtonColor, ButtonSize, ButtonVariant } from '../button/defines';\nimport type { DropdownPlacement } from './defines';\nimport type Dropdown from './dropdown';\nimport './dropdown';\nimport '../button/button';\n\n/**\n * DropdownButton — a pre-composed trigger + dropdown panel.\n *\n * Renders an `ae-button`-styled trigger with a built-in chevron,\n * and a floating panel for `<ae-dropdown-item>` children.\n * Accepts the same `variant`, `color`, `size`, and `disabled` props\n * as `ae-button`, making it a drop-in inside `ae-button-group`.\n *\n * @example\n * ```html\n * <ae-dropdown-button variant=\"outlined\" color=\"primary\">\n *   Actions\n *   <ae-dropdown-item value=\"edit\">Edit</ae-dropdown-item>\n *   <ae-dropdown-item value=\"delete\">Delete</ae-dropdown-item>\n * </ae-dropdown-button>\n *\n * <!-- Inside ae-button-group -->\n * <ae-button-group compact color=\"primary\">\n *   <ae-button>Save</ae-button>\n *   <ae-dropdown-button placement=\"bottom-end\">\n *     <ae-dropdown-item value=\"draft\">Save as draft</ae-dropdown-item>\n *     <ae-dropdown-item value=\"template\">Save as template</ae-dropdown-item>\n *   </ae-dropdown-button>\n * </ae-button-group>\n * ```\n *\n * Emits:\n * - `open`   — when the panel opens\n * - `close`  — when the panel closes\n * - `select` — `{ detail: { value, label } }` when a menu item is selected\n */\nclass DropdownButton extends AeicoComponent {\n  static tagName = 'dropdown-button';\n\n  // ae-button and ae-dropdown each carry their own shadow DOM styles.\n  // Only the host display is set here so button-group compact layout works.\n  protected static styles = [\n    ':host { display: inline-block; }',\n    '.caret { display: inline-block; width: 0; height: 0; margin-left: 0.3em; vertical-align: 0.2em; flex-shrink: 0; }',\n    '.caret--bottom { border-top: 0.35em solid; border-right: 0.35em solid transparent; border-left: 0.35em solid transparent; }',\n    '.caret--top { border-bottom: 0.35em solid; border-right: 0.35em solid transparent; border-left: 0.35em solid transparent; }',\n    '.caret--right { border-left: 0.35em solid; border-top: 0.35em solid transparent; border-bottom: 0.35em solid transparent; }',\n    '.caret--left { border-right: 0.35em solid; border-top: 0.35em solid transparent; border-bottom: 0.35em solid transparent; }',\n  ];\n\n  @prop({ type: String })\n  accessor variant: ButtonVariant = 'filled';\n\n  @prop({ type: String })\n  accessor color: ButtonColor = 'default';\n\n  @prop({ type: String })\n  accessor size: ButtonSize = 'md';\n\n  @prop({ type: Boolean })\n  accessor disabled: boolean = false;\n\n  @prop({ type: String })\n  accessor placement: DropdownPlacement = 'bottom-start';\n\n  @prop({ type: Boolean })\n  accessor closeOnSelect: boolean = true;\n\n  private _dropdownEl: Dropdown | null = null;\n\n  show(): void {\n    if (this.disabled) return;\n    this._dropdownEl?.show();\n  }\n  hide(): void {\n    this._dropdownEl?.hide();\n  }\n  toggle(): void {\n    if (this.disabled) return;\n    this._dropdownEl?.toggle();\n  }\n\n  get open(): boolean {\n    return this._dropdownEl?.open ?? false;\n  }\n\n  protected render() {\n    const dir = this.placement.split('-')[0];\n    return html(({ aeDropdown, aeButton, slot, span }) => {\n      this._dropdownEl = aeDropdown(\n        {\n          placement: this.placement,\n          'close-on-select': this.closeOnSelect,\n        },\n        () => {\n          aeButton(\n            {\n              slot: 'trigger',\n              variant: this.variant,\n              color: this.color,\n              size: this.size,\n              disabled: this.disabled || undefined,\n            },\n            () => {\n              slot({ name: 'label' });\n              span({ className: `caret caret--${dir}`, 'aria-hidden': 'true' });\n            },\n          );\n          slot();\n        },\n      );\n    });\n  }\n}\n\nDropdownButton.register();\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ae-dropdown-button': DropdownButton;\n  }\n}\n\nexport default DropdownButton;\nexport type DropdownButtonProps = InferProps<typeof DropdownButton>;\n"],"names":["_disabled_dec","_a","_init","_disabled","prop","__privateAdd","__runInitializers","__publicField","html","__decoratorStart","__decorateElement","__decoratorMetadata","variables","_closeOnSelect_dec","_placement_dec","_placement","_closeOnSelect","AeicoComponent","style"],"mappings":"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"}
+{"version":3,"file":"dropdown-button.cjs","sources":["../../src/dropdown/dropdown-item.ts","../../src/dropdown/dropdown.ts","../../src/dropdown/dropdown-button.ts"],"sourcesContent":["import AeicoComponent from '../aeico-component';\nimport type { InferProps } from 'aeico';\nimport { html } from 'aeico';\nimport style from '../styles/components/dropdown-item.css?inline';\nimport variables from '../styles/variables.css?inline';\nimport { prop } from 'aeico';\n// Ensure ae-icon is registered when icons are used\nimport '../icon/icon';\n\n/**\n * Dropdown menu item — used as a direct child of `<ae-dropdown>`.\n *\n * Renders as a `<button>` by default, or as an `<a>` anchor when `href` is set.\n * Use `<ae-icon>` inside to add icons, and CSS `color` / `--dropdown-item-color`\n * to apply danger or custom colours.\n *\n * @example\n * ```html\n * <ae-dropdown-item value=\"edit\"><ae-icon name=\"edit\"></ae-icon>Edit</ae-dropdown-item>\n * <ae-dropdown-item value=\"delete\" style=\"--dropdown-item-color:var(--color-danger)\">Delete</ae-dropdown-item>\n * <ae-dropdown-item href=\"/profile\">Profile</ae-dropdown-item>\n * ```\n */\nclass DropdownItem extends AeicoComponent {\n  static tagName = 'dropdown-item';\n\n  /** Value emitted in the `select` event detail on the parent dropdown. */\n  @prop({ type: String })\n  accessor value: string | undefined;\n\n  /** Disables the item — it becomes non-interactive and visually dimmed. */\n  @prop({ type: Boolean })\n  accessor disabled: boolean = false;\n\n  /**\n   * When set, the item renders as an `<a>` anchor element instead of a\n   * `<button>`. Useful for navigation items.\n   */\n  @prop({ type: String })\n  accessor href: string | undefined;\n\n  /**\n   * When `type=\"checkbox\"`, the item behaves as a toggle: each click flips\n   * `checked` and includes the new state in the `select` event detail.\n   */\n  @prop({ type: String })\n  accessor type: 'checkbox' | undefined;\n\n  /**\n   * Whether the item is checked. Only meaningful when `type=\"checkbox\"`.\n   * Reflects as the `checked` attribute.\n   */\n  @prop({ type: Boolean })\n  accessor checked: boolean = false;\n\n  /**\n   * Marks the item as the currently active/selected option (e.g. current route,\n   * current sort order). Purely visual — applies a highlighted background and\n   * accent colour.\n   */\n  @prop({ type: Boolean })\n  accessor active: boolean = false;\n\n  protected static styles = [variables, style];\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.listen('click', this._handleClick);\n    this.setAttribute('role', 'menuitem');\n  }\n\n  private _handleClick = (e: Event): void => {\n    if (this.disabled) {\n      e.preventDefault();\n      e.stopPropagation();\n\n      return;\n    }\n    if (this.type === 'checkbox') {\n      this.checked = !this.checked;\n    }\n    const label = this.textContent?.trim() ?? '';\n    this.dispatchEvent(\n      new CustomEvent('_item-select', {\n        bubbles: true,\n        composed: true,\n        detail: { value: this.value ?? '', label, checked: this.checked },\n      }),\n    );\n  };\n\n  protected render() {\n    const isCheckbox = this.type === 'checkbox';\n    const sharedProps = {\n      part: 'item',\n      className: 'item',\n      'aria-checked': isCheckbox ? String(this.checked) : undefined,\n    };\n    return html(({ button, a, span, slot }) => {\n      const children = () => {\n        if (isCheckbox) span({ className: 'check-indicator', 'aria-hidden': 'true' });\n        slot();\n      };\n      if (this.href) {\n        a(\n          {\n            ...sharedProps,\n            href: this.disabled ? undefined : this.href,\n            'aria-disabled': this.disabled || undefined,\n          },\n          children,\n        );\n      } else {\n        button(\n          {\n            ...sharedProps,\n            type: 'button',\n            disabled: this.disabled,\n          },\n          children,\n        );\n      }\n    });\n  }\n}\n\nDropdownItem.register();\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ae-dropdown-item': DropdownItem;\n  }\n}\n\nexport default DropdownItem;\nexport type DropdownItemProps = InferProps<typeof DropdownItem>;\n","import AeicoComponent from '../aeico-component';\nimport type { InferProps } from 'aeico';\nimport { html } from 'aeico';\nimport { prop } from 'aeico';\nimport style from '../styles/components/dropdown.css?inline';\nimport variables from '../styles/variables.css?inline';\nimport type { DropdownPlacement } from './defines';\n// Ensure ae-dropdown-item is registered when this module is used\nimport './dropdown-item';\n\n/**\n * Dropdown component — renders a floating menu panel anchored to a trigger slot.\n *\n * The trigger is provided via `slot=\"trigger\"` (typically an `<ae-button>`).\n * Menu items are provided as `<ae-dropdown-item>` default-slot children.\n *\n * Emits:\n * - `open`   — when the panel opens\n * - `close`  — when the panel closes\n * - `select` — `{ detail: { value, label } }` when a menu item is clicked\n *\n * @example\n * ```html\n * <ae-dropdown>\n *   <ae-button slot=\"trigger\">Actions</ae-button>\n *   <ae-dropdown-item value=\"edit\" icon=\"edit\">Edit</ae-dropdown-item>\n *   <ae-dropdown-item value=\"delete\" danger icon=\"trash\">Delete</ae-dropdown-item>\n * </ae-dropdown>\n * ```\n *\n * @example\n * ```html\n * <!-- Inside ae-navbar -->\n * <ae-navbar>\n *   <a slot=\"brand\" href=\"/\">MyApp</a>\n *   <ae-dropdown slot=\"end\">\n *     <ae-button slot=\"trigger\" variant=\"outlined\" size=\"sm\">User</ae-button>\n *     <ae-dropdown-item href=\"/profile\" icon=\"user\">Profile</ae-dropdown-item>\n *     <ae-dropdown-item value=\"logout\" danger>Sign out</ae-dropdown-item>\n *   </ae-dropdown>\n * </ae-navbar>\n * ```\n */\nclass Dropdown extends AeicoComponent {\n  static tagName = 'dropdown';\n\n  protected static styles = [variables, style];\n\n  /**\n   * Position of the panel relative to the trigger.\n   * Defaults to `'bottom-start'` (left-aligned, below trigger).\n   */\n  @prop({ type: String })\n  accessor placement: DropdownPlacement = 'bottom-start';\n\n  /**\n   * Whether the dropdown panel is visible. Reflects as the `open` attribute.\n   * Can be used for controlled open/close state.\n   */\n  @prop({ type: Boolean })\n  accessor open: boolean = false;\n\n  /**\n   * When `true` (default), clicking a menu item automatically closes the panel.\n   */\n  @prop({ type: Boolean })\n  accessor closeOnSelect: boolean = true;\n\n  /** Disables the trigger and prevents opening. */\n  @prop({ type: Boolean })\n  accessor disabled: boolean = false;\n\n  /**\n   * Optional label text. When set, `ae-dropdown` renders its own trigger button\n   * in the shadow DOM (no `slot=\"trigger\"` needed). Inherits `--ae-navbar-link-*`\n   * CSS variables so it automatically matches navbar link styles.\n   */\n  @prop({ type: String })\n  accessor label: string = '';\n\n  private _outsideClickHandler: ((e: MouseEvent) => void) | null = null;\n\n  connectedCallback() {\n    super.connectedCallback();\n\n    this.listen('_item-select', this._handleItemSelect as EventListener);\n    this.listen('keydown', this._handleKeydown as EventListener);\n\n    this._outsideClickHandler = (e: MouseEvent) => {\n      if (!this.open) return;\n      const path = e.composedPath();\n      if (!path.includes(this)) {\n        this._closePanel();\n      }\n    };\n    document.addEventListener('click', this._outsideClickHandler);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    if (this._outsideClickHandler) {\n      document.removeEventListener('click', this._outsideClickHandler);\n      this._outsideClickHandler = null;\n    }\n  }\n\n  /** Opens the dropdown panel. */\n  show(): void {\n    if (this.disabled || this.open) return;\n    this.open = true;\n    this.emit('open');\n  }\n\n  /** Closes the dropdown panel. */\n  hide(): void {\n    if (!this.open) return;\n    this.open = false;\n    this.emit('close');\n  }\n\n  /** Toggles the dropdown panel open/closed. */\n  toggle(): void {\n    if (this.open) {\n      this.hide();\n    } else {\n      this.show();\n    }\n  }\n\n  private _closePanel(): void {\n    if (this.open) this.hide();\n  }\n\n  // Called via declarative @click on the trigger-wrapper div inside the shadow DOM.\n  // Events from slotted trigger content bubble through the shadow DOM slot path,\n  // so this fires for trigger clicks only — not for panel item clicks.\n  private _handleTriggerClick = (): void => {\n    this.toggle();\n  };\n\n  private _handleItemSelect = (e: CustomEvent): void => {\n    this.emit('select', { detail: e.detail });\n    if (this.closeOnSelect) {\n      this._closePanel();\n    }\n  };\n\n  private _handleKeydown = (e: KeyboardEvent): void => {\n    if (e.key === 'Escape' && this.open) {\n      e.stopPropagation();\n      this._closePanel();\n    }\n  };\n\n  protected render() {\n    const placementClass = `placement-${this.placement}`;\n    const hasLabel = !!this.label;\n    const dir = this.placement.split('-')[0];\n    return html(({ div, slot, button, span }) => {\n      div(\n        {\n          className: 'trigger-wrapper',\n          'aria-haspopup': 'menu',\n          'aria-expanded': String(this.open),\n          '@click': this.disabled ? undefined : this._handleTriggerClick,\n        },\n        () => {\n          if (hasLabel) {\n            button(\n              {\n                className: 'trigger-label',\n                type: 'button',\n                disabled: this.disabled || undefined,\n              },\n              () => {\n                span({ text: this.label });\n                span({\n                  className: `ae-dropdown-arrow ae-dropdown-arrow--${dir}`,\n                  'aria-hidden': 'true',\n                });\n              },\n            );\n          } else {\n            slot({ name: 'trigger' });\n          }\n        },\n      );\n      div(\n        {\n          part: 'panel',\n          className: { panel: true, open: this.open, [placementClass]: true },\n          role: 'menu',\n        },\n        () => {\n          slot();\n        },\n      );\n    });\n  }\n}\n\nDropdown.register();\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ae-dropdown': Dropdown;\n  }\n}\n\nexport default Dropdown;\nexport type DropdownProps = InferProps<typeof Dropdown>;\n","import AeicoComponent from '../aeico-component';\nimport type { InferProps } from 'aeico';\nimport { html } from 'aeico';\nimport { prop } from 'aeico';\nimport type { ButtonColor, ButtonSize, ButtonVariant } from '../button/defines';\nimport type { DropdownPlacement } from './defines';\nimport type Dropdown from './dropdown';\nimport './dropdown';\nimport '../button/button';\n\n/**\n * DropdownButton — a pre-composed trigger + dropdown panel.\n *\n * Renders an `ae-button`-styled trigger with a built-in chevron,\n * and a floating panel for `<ae-dropdown-item>` children.\n * Accepts the same `variant`, `color`, `size`, and `disabled` props\n * as `ae-button`, making it a drop-in inside `ae-button-group`.\n *\n * @example\n * ```html\n * <ae-dropdown-button variant=\"outlined\" color=\"primary\">\n *   Actions\n *   <ae-dropdown-item value=\"edit\">Edit</ae-dropdown-item>\n *   <ae-dropdown-item value=\"delete\">Delete</ae-dropdown-item>\n * </ae-dropdown-button>\n *\n * <!-- Inside ae-button-group -->\n * <ae-button-group compact color=\"primary\">\n *   <ae-button>Save</ae-button>\n *   <ae-dropdown-button placement=\"bottom-end\">\n *     <ae-dropdown-item value=\"draft\">Save as draft</ae-dropdown-item>\n *     <ae-dropdown-item value=\"template\">Save as template</ae-dropdown-item>\n *   </ae-dropdown-button>\n * </ae-button-group>\n * ```\n *\n * Emits:\n * - `open`   — when the panel opens\n * - `close`  — when the panel closes\n * - `select` — `{ detail: { value, label } }` when a menu item is selected\n */\nclass DropdownButton extends AeicoComponent {\n  static tagName = 'dropdown-button';\n\n  // ae-button and ae-dropdown each carry their own shadow DOM styles.\n  // Only the host display is set here so button-group compact layout works.\n  protected static styles = [\n    ':host { display: inline-block; }',\n    '.caret { display: inline-block; width: 0; height: 0; margin-left: 0.3em; vertical-align: 0.2em; flex-shrink: 0; }',\n    '.caret--bottom { border-top: 0.35em solid; border-right: 0.35em solid transparent; border-left: 0.35em solid transparent; }',\n    '.caret--top { border-bottom: 0.35em solid; border-right: 0.35em solid transparent; border-left: 0.35em solid transparent; }',\n    '.caret--right { border-left: 0.35em solid; border-top: 0.35em solid transparent; border-bottom: 0.35em solid transparent; }',\n    '.caret--left { border-right: 0.35em solid; border-top: 0.35em solid transparent; border-bottom: 0.35em solid transparent; }',\n  ];\n\n  @prop({ type: String })\n  accessor variant: ButtonVariant = 'filled';\n\n  @prop({ type: String })\n  accessor color: ButtonColor = 'default';\n\n  @prop({ type: String })\n  accessor size: ButtonSize = 'md';\n\n  @prop({ type: Boolean })\n  accessor disabled: boolean = false;\n\n  @prop({ type: String })\n  accessor placement: DropdownPlacement = 'bottom-start';\n\n  @prop({ type: Boolean })\n  accessor closeOnSelect: boolean = true;\n\n  private _dropdownEl: Dropdown | null = null;\n\n  show(): void {\n    if (this.disabled) return;\n    this._dropdownEl?.show();\n  }\n  hide(): void {\n    this._dropdownEl?.hide();\n  }\n  toggle(): void {\n    if (this.disabled) return;\n    this._dropdownEl?.toggle();\n  }\n\n  get open(): boolean {\n    return this._dropdownEl?.open ?? false;\n  }\n\n  protected render() {\n    const dir = this.placement.split('-')[0];\n    return html(({ aeDropdown, aeButton, slot, span }) => {\n      this._dropdownEl = aeDropdown(\n        {\n          placement: this.placement,\n          'close-on-select': this.closeOnSelect,\n        },\n        () => {\n          aeButton(\n            {\n              slot: 'trigger',\n              variant: this.variant,\n              color: this.color,\n              size: this.size,\n              disabled: this.disabled || undefined,\n            },\n            () => {\n              slot({ name: 'label' });\n              span({ className: `caret caret--${dir}`, 'aria-hidden': 'true' });\n            },\n          );\n          slot();\n        },\n      );\n    });\n  }\n}\n\nDropdownButton.register();\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ae-dropdown-button': DropdownButton;\n  }\n}\n\nexport default DropdownButton;\nexport type DropdownButtonProps = InferProps<typeof DropdownButton>;\n"],"names":["_disabled_dec","_a","_init","_disabled","prop","__privateAdd","__runInitializers","__publicField","html","__decoratorStart","__decorateElement","__decoratorMetadata","variables","_closeOnSelect_dec","_placement_dec","_placement","_closeOnSelect","AeicoComponent","style"],"mappings":"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"}

package/dist/chunks/dropdown-button.js

@@ -1,6 +1,6 @@
 import { A as AeicoComponent } from "./aeico-component.js";
 import { prop, html } from "aeico";
-import { s as styleVariables } from "./variables.js";
+import { v as variables } from "./variables.js";
 const style$1 = ":host {\n  display: inline-block;\n  position: relative;\n\n  --dropdown-z-index: 1000;\n  --dropdown-bg: var(--surface-overlay, #fff);\n  --dropdown-border: 1px solid var(--color-border, rgba(0, 0, 0, 0.12));\n  --dropdown-border-radius: var(--ae-radius-md, 6px);\n  --dropdown-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n  --dropdown-min-width: 10rem;\n  --dropdown-padding: 0.25rem 0;\n}\n\n.trigger-wrapper {\n  display: flex;\n  align-items: stretch;\n  height: 100%;\n}\n\n/* Internal trigger rendered when `label` prop is set.\n   Uses --dropdown-trigger-* variables. Context components (e.g. ae-navbar)\n   map their own tokens to these variables via ::slotted(ae-dropdown). */\n.trigger-label {\n  display: inline-flex;\n  align-items: center;\n  height: var(--dropdown-trigger-height, auto);\n  padding: 0 var(--dropdown-trigger-padding-x, 0.75rem);\n  color: var(--dropdown-trigger-color, inherit);\n  background: var(--dropdown-trigger-bg, none);\n  border: none;\n  border-radius: var(--dropdown-trigger-radius, 0);\n  -webkit-appearance: none;\n  appearance: none;\n  cursor: pointer;\n  font: inherit;\n  font-size: var(--dropdown-trigger-font-size, inherit);\n  white-space: nowrap;\n  transition: color 0.15s ease, background-color 0.15s ease;\n  outline-offset: 2px;\n}\n\n.trigger-label:hover {\n  color: var(--dropdown-trigger-hover-color, inherit);\n  background-color: var(--dropdown-trigger-hover-bg, transparent);\n}\n\n:host([disabled]) .trigger-label {\n  opacity: 0.5;\n  cursor: not-allowed;\n  pointer-events: none;\n}\n\n/* Bootstrap-style CSS border caret — shadow DOM only, no global injection needed */\n.ae-dropdown-arrow {\n  display: inline-block;\n  width: 0;\n  height: 0;\n  margin-left: 0.3em;\n  vertical-align: 0.2em;\n  flex-shrink: 0;\n}\n.ae-dropdown-arrow--bottom {\n  border-top: 0.35em solid;\n  border-right: 0.35em solid transparent;\n  border-left: 0.35em solid transparent;\n}\n.ae-dropdown-arrow--top {\n  border-bottom: 0.35em solid;\n  border-right: 0.35em solid transparent;\n  border-left: 0.35em solid transparent;\n}\n.ae-dropdown-arrow--right {\n  border-left: 0.35em solid;\n  border-top: 0.35em solid transparent;\n  border-bottom: 0.35em solid transparent;\n}\n.ae-dropdown-arrow--left {\n  border-right: 0.35em solid;\n  border-top: 0.35em solid transparent;\n  border-bottom: 0.35em solid transparent;\n}\n\n.panel {\n  display: none;\n  position: absolute;\n  z-index: var(--dropdown-z-index);\n  background: var(--dropdown-bg);\n  border: var(--dropdown-border);\n  border-radius: var(--dropdown-border-radius);\n  box-shadow: var(--dropdown-shadow);\n  min-width: var(--dropdown-min-width);\n  padding: var(--dropdown-padding);\n  box-sizing: border-box;\n  /* Prevent panel from being wider than viewport */\n  max-width: calc(100vw - 16px);\n}\n\n.panel.open {\n  display: block;\n}\n\n/* placement variants */\n.panel.placement-bottom-start {\n  top: 100%;\n  left: 0;\n  margin-top: 4px;\n}\n\n.panel.placement-bottom-end {\n  top: 100%;\n  right: 0;\n  margin-top: 4px;\n}\n\n.panel.placement-bottom {\n  top: 100%;\n  left: 50%;\n  transform: translateX(-50%);\n  margin-top: 4px;\n}\n\n.panel.placement-top-start {\n  bottom: 100%;\n  left: 0;\n  margin-bottom: 4px;\n}\n\n.panel.placement-top-end {\n  bottom: 100%;\n  right: 0;\n  margin-bottom: 4px;\n}\n\n.panel.placement-top {\n  bottom: 100%;\n  left: 50%;\n  transform: translateX(-50%);\n  margin-bottom: 4px;\n}\n\n/* right placements */\n.panel.placement-right-start {\n  top: 0;\n  left: 100%;\n  margin-left: 4px;\n}\n\n.panel.placement-right-end {\n  bottom: 0;\n  left: 100%;\n  margin-left: 4px;\n}\n\n.panel.placement-right {\n  top: 50%;\n  left: 100%;\n  transform: translateY(-50%);\n  margin-left: 4px;\n}\n\n/* left placements */\n.panel.placement-left-start {\n  top: 0;\n  right: 100%;\n  margin-right: 4px;\n}\n\n.panel.placement-left-end {\n  bottom: 0;\n  right: 100%;\n  margin-right: 4px;\n}\n\n.panel.placement-left {\n  top: 50%;\n  right: 100%;\n  transform: translateY(-50%);\n  margin-right: 4px;\n}\n";
 const style = `:host {
   display: block;
@@ -223,7 +223,7 @@ __decorateElement$2(_init$2, 4, "checked", _checked_dec, DropdownItem, _checked)
 __decorateElement$2(_init$2, 4, "active", _active_dec, DropdownItem, _active);
 __decoratorMetadata$2(_init$2, DropdownItem);
 __publicField$2(DropdownItem, "tagName", "dropdown-item");
-__publicField$2(DropdownItem, "styles", [styleVariables, style]);
+__publicField$2(DropdownItem, "styles", [variables, style]);
 DropdownItem.register();
 var __create$1 = Object.create;
 var __defProp$1 = Object.defineProperty;
@@ -398,7 +398,7 @@ __decorateElement$1(_init$1, 4, "disabled", _disabled_dec$1, Dropdown, _disabled
 __decorateElement$1(_init$1, 4, "label", _label_dec, Dropdown, _label);
 __decoratorMetadata$1(_init$1, Dropdown);
 __publicField$1(Dropdown, "tagName", "dropdown");
-__publicField$1(Dropdown, "styles", [styleVariables, style$1]);
+__publicField$1(Dropdown, "styles", [variables, style$1]);
 Dropdown.register();
 var __create = Object.create;
 var __defProp = Object.defineProperty;
@@ -528,8 +528,8 @@ __publicField(DropdownButton, "styles", [
 ]);
 DropdownButton.register();
 export {
-  Dropdown as D,
-  DropdownButton as a,
-  DropdownItem as b
+  DropdownButton as D,
+  DropdownItem as a,
+  Dropdown as b
 };
 //# sourceMappingURL=dropdown-button.js.map