@incursa/ui-kit 1.6.1 → 1.8.0

package/dist/web-components/index.js

@@ -1984,11 +1984,338 @@ if (typeof globalThis !== "undefined") {
   });
 }
 
+// node_modules/lucide/dist/esm/defaultAttributes.mjs
+var defaultAttributes = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: 24,
+  height: 24,
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": 2,
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round"
+};
+
+// node_modules/lucide/dist/esm/createElement.mjs
+var createSVGElement = ([tag, attrs, children]) => {
+  const element = document.createElementNS("http://www.w3.org/2000/svg", tag);
+  Object.keys(attrs).forEach((name) => {
+    element.setAttribute(name, String(attrs[name]));
+  });
+  if (children?.length) {
+    children.forEach((child) => {
+      const childElement = createSVGElement(child);
+      element.appendChild(childElement);
+    });
+  }
+  return element;
+};
+var createElement = (iconNode, customAttrs = {}) => {
+  const tag = "svg";
+  const attrs = {
+    ...defaultAttributes,
+    ...customAttrs
+  };
+  return createSVGElement([tag, attrs, iconNode]);
+};
+
+// node_modules/lucide/dist/esm/icons/circle-check.mjs
+var CircleCheck = [
+  ["circle", { cx: "12", cy: "12", r: "10" }],
+  ["path", { d: "m9 12 2 2 4-4" }]
+];
+
+// node_modules/lucide/dist/esm/icons/circle-question-mark.mjs
+var CircleQuestionMark = [
+  ["circle", { cx: "12", cy: "12", r: "10" }],
+  ["path", { d: "M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3" }],
+  ["path", { d: "M12 17h.01" }]
+];
+
+// node_modules/lucide/dist/esm/icons/circle-x.mjs
+var CircleX = [
+  ["circle", { cx: "12", cy: "12", r: "10" }],
+  ["path", { d: "m15 9-6 6" }],
+  ["path", { d: "m9 9 6 6" }]
+];
+
+// node_modules/lucide/dist/esm/icons/download.mjs
+var Download = [
+  ["path", { d: "M12 15V3" }],
+  ["path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }],
+  ["path", { d: "m7 10 5 5 5-5" }]
+];
+
+// node_modules/lucide/dist/esm/icons/external-link.mjs
+var ExternalLink = [
+  ["path", { d: "M15 3h6v6" }],
+  ["path", { d: "M10 14 21 3" }],
+  ["path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }]
+];
+
+// node_modules/lucide/dist/esm/icons/file-text.mjs
+var FileText = [
+  [
+    "path",
+    {
+      d: "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z"
+    }
+  ],
+  ["path", { d: "M14 2v5a1 1 0 0 0 1 1h5" }],
+  ["path", { d: "M10 9H8" }],
+  ["path", { d: "M16 13H8" }],
+  ["path", { d: "M16 17H8" }]
+];
+
+// node_modules/lucide/dist/esm/icons/folder-plus.mjs
+var FolderPlus = [
+  ["path", { d: "M12 10v6" }],
+  ["path", { d: "M9 13h6" }],
+  [
+    "path",
+    {
+      d: "M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z"
+    }
+  ]
+];
+
+// node_modules/lucide/dist/esm/icons/info.mjs
+var Info = [
+  ["circle", { cx: "12", cy: "12", r: "10" }],
+  ["path", { d: "M12 16v-4" }],
+  ["path", { d: "M12 8h.01" }]
+];
+
+// node_modules/lucide/dist/esm/icons/lock.mjs
+var Lock = [
+  ["rect", { width: "18", height: "11", x: "3", y: "11", rx: "2", ry: "2" }],
+  ["path", { d: "M7 11V7a5 5 0 0 1 10 0v4" }]
+];
+
+// node_modules/lucide/dist/esm/icons/pause.mjs
+var Pause = [
+  ["rect", { x: "14", y: "3", width: "5", height: "18", rx: "1" }],
+  ["rect", { x: "5", y: "3", width: "5", height: "18", rx: "1" }]
+];
+
+// node_modules/lucide/dist/esm/icons/play.mjs
+var Play = [
+  [
+    "path",
+    { d: "M5 5a2 2 0 0 1 3.008-1.728l11.997 6.998a2 2 0 0 1 .003 3.458l-12 7A2 2 0 0 1 5 19z" }
+  ]
+];
+
+// node_modules/lucide/dist/esm/icons/refresh-cw.mjs
+var RefreshCw = [
+  ["path", { d: "M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8" }],
+  ["path", { d: "M21 3v5h-5" }],
+  ["path", { d: "M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16" }],
+  ["path", { d: "M8 16H3v5" }]
+];
+
+// node_modules/lucide/dist/esm/icons/search-x.mjs
+var SearchX = [
+  ["path", { d: "m13.5 8.5-5 5" }],
+  ["path", { d: "m8.5 8.5 5 5" }],
+  ["circle", { cx: "11", cy: "11", r: "8" }],
+  ["path", { d: "m21 21-4.3-4.3" }]
+];
+
+// node_modules/lucide/dist/esm/icons/settings.mjs
+var Settings = [
+  [
+    "path",
+    {
+      d: "M9.671 4.136a2.34 2.34 0 0 1 4.659 0 2.34 2.34 0 0 0 3.319 1.915 2.34 2.34 0 0 1 2.33 4.033 2.34 2.34 0 0 0 0 3.831 2.34 2.34 0 0 1-2.33 4.033 2.34 2.34 0 0 0-3.319 1.915 2.34 2.34 0 0 1-4.659 0 2.34 2.34 0 0 0-3.32-1.915 2.34 2.34 0 0 1-2.33-4.033 2.34 2.34 0 0 0 0-3.831A2.34 2.34 0 0 1 6.35 6.051a2.34 2.34 0 0 0 3.319-1.915"
+    }
+  ],
+  ["circle", { cx: "12", cy: "12", r: "3" }]
+];
+
+// node_modules/lucide/dist/esm/icons/shield-check.mjs
+var ShieldCheck = [
+  [
+    "path",
+    {
+      d: "M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"
+    }
+  ],
+  ["path", { d: "m9 12 2 2 4-4" }]
+];
+
+// node_modules/lucide/dist/esm/icons/triangle-alert.mjs
+var TriangleAlert = [
+  ["path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }],
+  ["path", { d: "M12 9v4" }],
+  ["path", { d: "M12 17h.01" }]
+];
+
+// node_modules/lucide/dist/esm/icons/upload.mjs
+var Upload = [
+  ["path", { d: "M12 3v12" }],
+  ["path", { d: "m17 8-5-5-5 5" }],
+  ["path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }]
+];
+
+// src/icons/index.js
+var ICON_NODES = Object.freeze({
+  info: Info,
+  help: CircleQuestionMark,
+  success: CircleCheck,
+  warning: TriangleAlert,
+  error: CircleX,
+  upload: Upload,
+  document: FileText,
+  download: Download,
+  settings: Settings,
+  "external-link": ExternalLink,
+  empty: FolderPlus,
+  "no-results": SearchX,
+  loading: RefreshCw,
+  lock: Lock,
+  pause: Pause,
+  play: Play,
+  permission: ShieldCheck
+});
+var ICON_NAMES = Object.freeze(Object.keys(ICON_NODES));
+var DEFAULT_SIZE = 16;
+function getNamespace() {
+  if (typeof globalThis === "undefined") {
+    return null;
+  }
+  const root = globalThis.IncWebComponents || (globalThis.IncWebComponents = {});
+  const icons = root.icons || (root.icons = {});
+  if (!icons.names) {
+    icons.names = ICON_NAMES;
+  }
+  if (!icons.defaultRenderer) {
+    icons.defaultRenderer = renderDefaultIcon;
+  }
+  if (!icons.render) {
+    icons.render = renderIncIcon;
+  }
+  if (!icons.setRenderer) {
+    icons.setRenderer = setIconRenderer;
+  }
+  return icons;
+}
+function normalizeIconName(name) {
+  return String(name || "").trim().toLowerCase().replace(/[_\s]+/g, "-");
+}
+function normalizeSize(value) {
+  const parsed = Number.parseFloat(value);
+  return Number.isFinite(parsed) && parsed > 0 ? parsed : DEFAULT_SIZE;
+}
+function buildIconAttributes(name, options = {}) {
+  const size = normalizeSize(options.size);
+  const className = options.className || "inc-icon";
+  const attrs = {
+    width: size,
+    height: size,
+    "data-inc-icon": name,
+    class: className,
+    focusable: "false"
+  };
+  if (options.decorative !== false) {
+    attrs["aria-hidden"] = "true";
+  } else {
+    attrs.role = "img";
+    attrs["aria-label"] = options.label || name;
+  }
+  return attrs;
+}
+function renderDefaultIcon(name, options = {}) {
+  const normalizedName = normalizeIconName(name);
+  const iconNode = ICON_NODES[normalizedName] || ICON_NODES.info;
+  if (typeof document === "undefined") {
+    return "";
+  }
+  return createElement(iconNode, buildIconAttributes(normalizedName, options));
+}
+function coerceIconResult(result) {
+  if (!result || typeof document === "undefined") {
+    return null;
+  }
+  if (result instanceof Node) {
+    return result;
+  }
+  if (typeof result === "string") {
+    const template = document.createElement("template");
+    template.innerHTML = result.trim();
+    return template.content.firstElementChild || null;
+  }
+  return null;
+}
+function getIconRenderer() {
+  const namespace2 = getNamespace();
+  return typeof namespace2?.renderer === "function" ? namespace2.renderer : renderDefaultIcon;
+}
+function setIconRenderer(renderer) {
+  const namespace2 = getNamespace();
+  if (!namespace2) {
+    return null;
+  }
+  if (renderer == null) {
+    delete namespace2.renderer;
+    return null;
+  }
+  if (typeof renderer !== "function") {
+    throw new TypeError("Inc icon renderer must be a function.");
+  }
+  namespace2.renderer = renderer;
+  return renderer;
+}
+function renderIncIcon(name, options = {}) {
+  const normalizedName = normalizeIconName(name) || "info";
+  const renderer = getIconRenderer();
+  const rendered = renderer(normalizedName, options);
+  const icon = coerceIconResult(rendered) || coerceIconResult(renderDefaultIcon(normalizedName, options));
+  if (icon instanceof Element && options.decorative !== false) {
+    icon.setAttribute("aria-hidden", "true");
+    icon.removeAttribute("aria-label");
+    icon.removeAttribute("role");
+  }
+  return icon;
+}
+function replaceIconContents(container, name, options = {}) {
+  if (!(container instanceof Element)) {
+    return null;
+  }
+  container.replaceChildren();
+  const icon = renderIncIcon(name, options);
+  if (icon) {
+    icon.setAttribute("data-inc-generated-icon", "true");
+    icon.setAttribute("data-inc-icon-upgraded", "true");
+    container.append(icon);
+  }
+  return icon;
+}
+getNamespace();
+
 // src/web-components/components/feedback.js
 var THEME_MODES = ["light", "dark", "system"];
 var DEFAULT_THEME_STORAGE_KEY = "inc-theme-mode";
 var BADGE_TONES = /* @__PURE__ */ new Set(["primary", "secondary", "success", "danger", "warning", "info"]);
 var SPINNER_VARIANTS = /* @__PURE__ */ new Set(["border", "grow"]);
+var ICON_NAME_SET = new Set(ICON_NAMES);
+var STATE_ICON_BY_VARIANT = /* @__PURE__ */ new Map([
+  ["empty", "empty"],
+  ["results", "no-results"],
+  ["loading", "loading"],
+  ["error", "error"],
+  ["danger", "error"],
+  ["warning", "warning"],
+  ["success", "success"],
+  ["info", "info"]
+]);
+var STATE_ICON_BY_STATUS = /* @__PURE__ */ new Map([
+  ["+", "empty"],
+  ["?", "no-results"],
+  ["!", "error"],
+  ["...", "loading"]
+]);
 var HostElement3 = typeof HTMLElement === "undefined" ? class {
 } : HTMLElement;
 var themeSubscribers = /* @__PURE__ */ new Set();
@@ -2018,6 +2345,28 @@ function toPositiveInt(value) {
 function normalizeToken(value) {
   return String(value ?? "").trim().toLowerCase();
 }
+function resolveStateIconName(icon, status, variant) {
+  const explicitIcon = normalizeIconName(icon);
+  if (explicitIcon) {
+    return explicitIcon;
+  }
+  const normalizedStatus = normalizeIconName(status);
+  if (STATE_ICON_BY_STATUS.has(String(status || "").trim())) {
+    return STATE_ICON_BY_STATUS.get(String(status || "").trim());
+  }
+  if (ICON_NAME_SET.has(normalizedStatus)) {
+    return normalizedStatus;
+  }
+  return STATE_ICON_BY_VARIANT.get(normalizeToken(variant)) || "info";
+}
+function renderDecorativeIcon(container, name, size = 18) {
+  replaceIconContents(container, name, {
+    className: "inc-icon",
+    decorative: true,
+    size
+  });
+  container.hidden = false;
+}
 function getSystemTheme() {
   if (!window.matchMedia) {
     return "light";
@@ -2146,7 +2495,7 @@ function formatRemaining(totalSeconds) {
   return `${minutes}m ${seconds}s`;
 }
 var IncStatePanel = class extends HostElement3 {
-  static observedAttributes = ["tone", "variant", "title", "body", "status", "open"];
+  static observedAttributes = ["tone", "variant", "title", "body", "status", "icon", "open"];
   #fallback = null;
   #appliedVariantClass = "";
   connectedCallback() {
@@ -2178,6 +2527,7 @@ var IncStatePanel = class extends HostElement3 {
     body.className = "inc-state-panel__body";
     actions.className = "inc-state-panel__actions";
     icon.setAttribute("part", "icon");
+    icon.setAttribute("aria-hidden", "true");
     title.setAttribute("part", "title");
     body.setAttribute("part", "body");
     actions.setAttribute("part", "actions");
@@ -2204,10 +2554,18 @@ var IncStatePanel = class extends HostElement3 {
     const title = this.getAttribute("title") || "";
     const body = this.getAttribute("body") || "";
     const status = this.getAttribute("status") || "";
+    const iconName = resolveStateIconName(this.getAttribute("icon"), status, nextVariant);
     this.#fallback.title.textContent = title;
     this.#fallback.body.textContent = body;
-    this.#fallback.icon.textContent = status;
-    this.#fallback.icon.hidden = !status;
+    if (iconName === "none") {
+      this.#fallback.icon.replaceChildren();
+      this.#fallback.icon.hidden = true;
+    } else if (ICON_NAME_SET.has(iconName)) {
+      renderDecorativeIcon(this.#fallback.icon, iconName, 22);
+    } else {
+      this.#fallback.icon.textContent = status;
+      this.#fallback.icon.hidden = !status;
+    }
     this.#fallback.actions.hidden = true;
   }
   #dispatchSlotChange() {
@@ -2525,6 +2883,10 @@ var IncAutoRefresh = class extends HostElement3 {
       return;
     }
     this.innerHTML = `
+<button type="button" class="inc-auto-refresh__toggle inc-btn inc-btn--outline-secondary inc-btn--micro" part="toggle">
+  <span class="inc-auto-refresh__toggle-icon" aria-hidden="true"></span>
+  <span class="inc-auto-refresh__toggle-text"></span>
+</button>
 <span class="inc-auto-refresh__countdown" part="countdown">
   <span class="inc-auto-refresh__label" part="label"></span>
   <span class="inc-auto-refresh__value" part="value"></span>
@@ -2532,10 +2894,6 @@ var IncAutoRefresh = class extends HostElement3 {
 <span class="inc-auto-refresh__status" part="status" hidden>
   <span class="inc-auto-refresh__status-text"></span>
 </span>
-<button type="button" class="inc-auto-refresh__toggle inc-btn inc-btn--outline-secondary inc-btn--micro" part="toggle">
-  <span class="inc-auto-refresh__toggle-icon" aria-hidden="true"></span>
-  <span class="inc-auto-refresh__toggle-text"></span>
-</button>
         `.trim();
     this.#parts = this.#getParts();
   }
@@ -2547,6 +2905,7 @@ var IncAutoRefresh = class extends HostElement3 {
       status: this.querySelector(".inc-auto-refresh__status"),
       statusText: this.querySelector(".inc-auto-refresh__status-text"),
       toggle: this.querySelector(".inc-auto-refresh__toggle"),
+      toggleIcon: this.querySelector(".inc-auto-refresh__toggle-icon"),
       toggleText: this.querySelector(".inc-auto-refresh__toggle-text")
     };
   }
@@ -2669,6 +3028,9 @@ var IncAutoRefresh = class extends HostElement3 {
     if (this.#parts.toggleText) {
       this.#parts.toggleText.textContent = actionLabel;
     }
+    if (this.#parts.toggleIcon instanceof HTMLElement) {
+      renderDecorativeIcon(this.#parts.toggleIcon, this.#isPaused ? "play" : "pause", 16);
+    }
   }
   #stop() {
     if (this.#timeoutId) {
@@ -3028,6 +3390,18 @@ var BUTTON_VARIANTS = /* @__PURE__ */ new Set([
   "outline-info"
 ]);
 var BUTTON_SIZES = /* @__PURE__ */ new Set(["sm", "lg", "micro"]);
+var ALERT_DEFAULT_ROLE_BY_TONE = /* @__PURE__ */ new Map([
+  ["info", "status"],
+  ["secondary", "status"]
+]);
+var ALERT_ICON_BY_TONE = /* @__PURE__ */ new Map([
+  ["success", "success"],
+  ["danger", "error"],
+  ["warning", "warning"],
+  ["info", "info"],
+  ["secondary", "info"],
+  ["primary", "info"]
+]);
 var HostElement4 = typeof HTMLElement === "undefined" ? class {
 } : HTMLElement;
 function toBoolean(value, fallback = false) {
@@ -3036,6 +3410,10 @@ function toBoolean(value, fallback = false) {
   }
   return !FALSE_TOKENS.has(String(value).toLowerCase());
 }
+function toPositiveInt2(value) {
+  const parsed = Number.parseInt(String(value ?? "").trim(), 10);
+  return Number.isFinite(parsed) && parsed > 0 ? parsed : null;
+}
 function emit2(host, type, detail = {}, options = {}) {
   return host.dispatchEvent(new CustomEvent(type, {
     detail,
@@ -3044,6 +3422,20 @@ function emit2(host, type, detail = {}, options = {}) {
     cancelable: options.cancelable === true
   }));
 }
+function getDirectIconSlot(host) {
+  return Array.from(host.children || []).find((node) => node instanceof HTMLElement && node.getAttribute("slot") === "icon") || null;
+}
+function hasConsumerIcon(container) {
+  return Array.from(container.children || []).some((node) => node instanceof HTMLElement && !node.hasAttribute("data-inc-generated-icon"));
+}
+function renderDecorativeIcon2(container, name, options = {}) {
+  replaceIconContents(container, name, {
+    className: "inc-icon",
+    decorative: true,
+    size: options.size || 16
+  });
+  container.hidden = false;
+}
 var IncElement = class extends HostElement4 {
   emit(type, detail = {}, options = {}) {
     return emit2(this, type, detail, options);
@@ -3051,7 +3443,7 @@ var IncElement = class extends HostElement4 {
 };
 var IncButtonElement = class extends IncElement {
   static get observedAttributes() {
-    return ["tone", "variant", "size", "loading", "href", "type", "disabled", "label", "target", "rel", "download"];
+    return ["tone", "variant", "size", "loading", "href", "type", "disabled", "label", "target", "rel", "download", "icon"];
   }
   connectedCallback() {
     addClass(this, "inc-button");
@@ -3139,6 +3531,7 @@ var IncButtonElement = class extends IncElement {
       control.removeAttribute("aria-busy");
       this.removeLoadingSpinner(control);
     }
+    this.syncIcon(control);
     const label = this.getAttribute("label");
     if (label) {
       control.setAttribute("aria-label", label);
@@ -3184,6 +3577,41 @@ var IncButtonElement = class extends IncElement {
     }
     control.querySelectorAll(":scope > [data-inc-button-spinner]").forEach((node) => node.remove());
   }
+  syncIcon(control) {
+    if (!(control instanceof HTMLElement)) {
+      return;
+    }
+    const explicitIcon = normalizeIconName(this.getAttribute("icon"));
+    const inferredIcon = this.getAttribute("download") != null ? "download" : this.getAttribute("target") === "_blank" ? "external-link" : "";
+    const iconName = explicitIcon || inferredIcon;
+    let icon = control.querySelector(":scope > [data-inc-button-icon]");
+    const slotted = getDirectIconSlot(control);
+    if (!icon && (iconName || slotted)) {
+      icon = document.createElement("span");
+      icon.className = "inc-btn__icon";
+      icon.setAttribute("data-inc-button-icon", "true");
+      icon.setAttribute("aria-hidden", "true");
+      control.prepend(icon);
+    }
+    if (!(icon instanceof HTMLElement)) {
+      return;
+    }
+    if (slotted) {
+      slotted.removeAttribute("slot");
+      icon.replaceChildren(slotted);
+      icon.hidden = false;
+      return;
+    }
+    if (hasConsumerIcon(icon)) {
+      icon.hidden = false;
+      return;
+    }
+    if (iconName && iconName !== "none") {
+      renderDecorativeIcon2(icon, iconName, { size: 16 });
+      return;
+    }
+    icon.remove();
+  }
 };
 var IncButtonGroupElement = class extends IncElement {
   static get observedAttributes() {
@@ -3251,7 +3679,6 @@ var IncCloseButtonElement = class extends IncElement {
     return ["label", "variant"];
   }
   connectedCallback() {
-    addClass(this, "inc-close-button");
     this.sync();
   }
   attributeChangedCallback() {
@@ -3260,7 +3687,7 @@ var IncCloseButtonElement = class extends IncElement {
     }
   }
   sync() {
-    addClass(this, "inc-close-button");
+    this.classList.remove("inc-close-button", "inc-close-button--white");
     this.setAttribute("part", "close-button");
     const control = this.ensureControl();
     const variant = normalizeToken2(this.getAttribute("variant"));
@@ -3271,9 +3698,7 @@ var IncCloseButtonElement = class extends IncElement {
     }
     control.type = "button";
     control.setAttribute("aria-label", this.getAttribute("label") || "Close");
-    if (!control.childNodes.length) {
-      control.textContent = "\xD7";
-    }
+    control.textContent = "";
   }
   ensureControl() {
     const existing = this._control || this.querySelector(":scope > button.inc-close-button");
@@ -3296,7 +3721,7 @@ var IncCloseButtonElement = class extends IncElement {
 };
 var IncAlertElement = class extends IncElement {
   static get observedAttributes() {
-    return ["tone", "variant", "dismissible", "dismiss-label"];
+    return ["tone", "variant", "dismissible", "dismiss-label", "timeout", "icon"];
   }
   connectedCallback() {
     addClass(this, "inc-alert");
@@ -3304,6 +3729,7 @@ var IncAlertElement = class extends IncElement {
     this.sync();
   }
   disconnectedCallback() {
+    this.stopDismissTimer();
     if (this._boundClick) {
       this.removeEventListener("click", this._boundClick);
     }
@@ -3323,7 +3749,7 @@ var IncAlertElement = class extends IncElement {
         return;
       }
       event.preventDefault();
-      this.hide();
+      this.dismiss("manual");
     };
     this.addEventListener("click", this._boundClick);
   }
@@ -3334,6 +3760,7 @@ var IncAlertElement = class extends IncElement {
     const tone = normalizeToken2(this.getAttribute("tone") || this.getAttribute("variant")) || "info";
     const resolvedTone = BADGE_TONES2.has(tone) ? tone : "info";
     this.classList.add(`inc-alert--${resolvedTone}`);
+    this.syncIcon(resolvedTone);
     if (toBoolean(this.getAttribute("dismissible"))) {
       this.classList.add("inc-alert--dismissible");
       this.ensureDismissButton();
@@ -3341,12 +3768,24 @@ var IncAlertElement = class extends IncElement {
       this.removeDismissButton();
     }
     if (!this.hasAttribute("role")) {
-      this.setAttribute("role", resolvedTone === "info" || resolvedTone === "secondary" ? "status" : "alert");
+      this.setAttribute("role", ALERT_DEFAULT_ROLE_BY_TONE.get(resolvedTone) || "alert");
     }
     if (!this.hasAttribute("aria-live")) {
       this.setAttribute("aria-live", this.getAttribute("role") === "alert" ? "assertive" : "polite");
     }
     this.setAttribute("aria-atomic", "true");
+    const timeoutMs = toPositiveInt2(this.getAttribute("timeout"));
+    if (timeoutMs) {
+      this.ensureProgressBar();
+      if (!this.hidden && this.getAttribute("aria-hidden") !== "true") {
+        this.startDismissTimer(timeoutMs);
+      } else {
+        this.stopDismissTimer();
+      }
+    } else {
+      this.stopDismissTimer();
+      this.removeProgressBar();
+    }
   }
   ensureDismissButton() {
     let button = this.querySelector(":scope > [data-inc-alert-dismiss]");
@@ -3359,25 +3798,109 @@ var IncAlertElement = class extends IncElement {
     button.className = "inc-close-button";
     button.setAttribute("part", "dismiss");
     button.setAttribute("aria-label", this.getAttribute("dismiss-label") || "Dismiss alert");
-    if (!button.childNodes.length) {
-      button.textContent = "\xD7";
-    }
+    button.textContent = "";
     return button;
   }
   removeDismissButton() {
     this.querySelectorAll(":scope > [data-inc-alert-dismiss]").forEach((node) => node.remove());
   }
-  hide() {
+  ensureProgressBar() {
+    let progress = this.querySelector(":scope > .inc-alert__progress");
+    if (!progress) {
+      progress = document.createElement("div");
+      progress.className = "inc-alert__progress";
+      progress.setAttribute("part", "progress");
+      progress.setAttribute("aria-hidden", "true");
+      this.append(progress);
+    }
+    return progress;
+  }
+  removeProgressBar() {
+    this.querySelectorAll(":scope > .inc-alert__progress").forEach((node) => node.remove());
+  }
+  syncIcon(tone) {
+    const explicitIcon = normalizeIconName(this.getAttribute("icon"));
+    const iconName = explicitIcon || ALERT_ICON_BY_TONE.get(tone) || "info";
+    let icon = this.querySelector(":scope > .inc-alert__icon");
+    const slotted = getDirectIconSlot(this);
+    if (!icon && (iconName !== "none" || slotted)) {
+      icon = document.createElement("span");
+      icon.className = "inc-alert__icon";
+      icon.setAttribute("part", "icon");
+      icon.setAttribute("aria-hidden", "true");
+      this.prepend(icon);
+    }
+    if (!(icon instanceof HTMLElement)) {
+      return;
+    }
+    if (slotted) {
+      slotted.removeAttribute("slot");
+      icon.replaceChildren(slotted);
+      icon.hidden = false;
+      return;
+    }
+    if (hasConsumerIcon(icon)) {
+      icon.hidden = false;
+      return;
+    }
+    if (iconName === "none") {
+      icon.remove();
+      return;
+    }
+    renderDecorativeIcon2(icon, iconName, { size: 18 });
+  }
+  startDismissTimer(timeoutMs) {
+    const progress = this.ensureProgressBar();
+    this.stopDismissTimer();
+    this._dismissTimeoutMs = timeoutMs;
+    this._dismissStartedAt = performance.now();
+    const tick = (now) => {
+      if (this.hidden || this.getAttribute("aria-hidden") === "true") {
+        this.stopDismissTimer();
+        return;
+      }
+      const elapsed = Math.max(0, now - this._dismissStartedAt);
+      const remaining = Math.max(0, timeoutMs - elapsed);
+      const ratio = timeoutMs > 0 ? remaining / timeoutMs : 0;
+      progress.style.transform = `scaleX(${ratio})`;
+      if (remaining <= 0) {
+        this.dismiss("timeout");
+        return;
+      }
+      this._dismissFrame = window.requestAnimationFrame(tick);
+    };
+    progress.style.transform = "scaleX(1)";
+    this._dismissFrame = window.requestAnimationFrame(tick);
+  }
+  stopDismissTimer() {
+    if (this._dismissFrame) {
+      window.cancelAnimationFrame(this._dismissFrame);
+      this._dismissFrame = 0;
+    }
+  }
+  dismiss(reason = "manual") {
+    this.hide(reason);
+  }
+  hide(reason = "manual") {
+    this.stopDismissTimer();
     this.hidden = true;
     this.setAttribute("aria-hidden", "true");
-    this.emit("dismiss", { hidden: true });
+    this.emit("dismiss", { hidden: true, reason });
   }
 };
 var IncEmptyStateElement = class extends IncElement {
+  static get observedAttributes() {
+    return ["icon"];
+  }
   connectedCallback() {
     addClass(this, "inc-empty-state");
     this.sync();
   }
+  attributeChangedCallback() {
+    if (this.isConnected) {
+      this.sync();
+    }
+  }
   sync() {
     addClass(this, "inc-empty-state");
     this.setAttribute("part", "empty-state content icon body actions");
@@ -3425,6 +3948,17 @@ var IncEmptyStateElement = class extends IncElement {
       }
       body.append(node);
     });
+    if (hasConsumerIcon(icon)) {
+      icon.hidden = false;
+      return;
+    }
+    const iconName = normalizeIconName(this.getAttribute("icon")) || "empty";
+    if (iconName === "none") {
+      icon.replaceChildren();
+      icon.hidden = true;
+      return;
+    }
+    renderDecorativeIcon2(icon, iconName, { size: 34 });
   }
 };
 var actionDefinitions = [
@@ -4422,3 +4956,31 @@ export {
   defineAll2 as defineAll,
   registerIncWebComponents
 };
+/*! Bundled license information:
+
+lucide/dist/esm/defaultAttributes.mjs:
+lucide/dist/esm/createElement.mjs:
+lucide/dist/esm/icons/circle-check.mjs:
+lucide/dist/esm/icons/circle-question-mark.mjs:
+lucide/dist/esm/icons/circle-x.mjs:
+lucide/dist/esm/icons/download.mjs:
+lucide/dist/esm/icons/external-link.mjs:
+lucide/dist/esm/icons/file-text.mjs:
+lucide/dist/esm/icons/folder-plus.mjs:
+lucide/dist/esm/icons/info.mjs:
+lucide/dist/esm/icons/lock.mjs:
+lucide/dist/esm/icons/pause.mjs:
+lucide/dist/esm/icons/play.mjs:
+lucide/dist/esm/icons/refresh-cw.mjs:
+lucide/dist/esm/icons/search-x.mjs:
+lucide/dist/esm/icons/settings.mjs:
+lucide/dist/esm/icons/shield-check.mjs:
+lucide/dist/esm/icons/triangle-alert.mjs:
+lucide/dist/esm/icons/upload.mjs:
+  (**
+   * @license lucide v1.17.0 - ISC
+   *
+   * This source code is licensed under the ISC license.
+   * See the LICENSE file in the root directory of this source tree.
+   *)
+*/