@siemens/ix-docs 4.3.0 → 5.0.0

package/build/static/demo/v2/preview/html/assets/flip-tile-C1ncfidh.js

@@ -0,0 +1,7 @@
+import "./global-DjWMysHf.js";
+import { a as addIcons } from "./ix-icon.entry-C28RAXb9.js";
+import { o as iconInfo } from "./index-vnsUAEMY.js";
+import "./init-CkDeqDdJ.js";
+addIcons({
+  iconInfo
+});

package/build/static/demo/v2/preview/html/assets/focus-proxy-BgLEsVE2-zgdA9p1m.js

@@ -0,0 +1,31 @@
+import { h } from "./global-DjWMysHf.js";
+const FocusProxy = (props) => {
+  return h("ul", { class: "proxy-list", role: "listbox", id: `${props.hostId}-${PROXY_LIST_ID_SUFFIX}`, ...props.otherProps });
+};
+const PROXY_LIST_ID_SUFFIX = "proxy-listbox";
+const PROXY_LISTITEM_ID_SUFFIX = "proxy-listbox-item";
+const updateFocusProxyList = (proxyListElement, items, modifyProxyElement) => {
+  if (proxyListElement && items.length > 0) {
+    const top = items[0].getBoundingClientRect().top - items[0].getBoundingClientRect().height + 8;
+    proxyListElement.innerHTML = "";
+    proxyListElement.style.top = top + "px";
+    proxyListElement.style.padding = "0px";
+    proxyListElement.style.margin = "0px";
+    proxyListElement.innerHTML = "";
+    items.forEach((item) => {
+      const li = document.createElement("li");
+      li.id = item.id + "-" + PROXY_LISTITEM_ID_SUFFIX;
+      if (modifyProxyElement) {
+        modifyProxyElement(item, li);
+      }
+      item.ariaHidden = "true";
+      proxyListElement.appendChild(li);
+    });
+  }
+};
+export {
+  FocusProxy as F,
+  PROXY_LISTITEM_ID_SUFFIX as P,
+  PROXY_LIST_ID_SUFFIX as a,
+  updateFocusProxyList as u
+};

package/build/static/demo/v2/preview/html/assets/focus-trap-DDLHqzV2-Cft0_sds.js

@@ -0,0 +1,88 @@
+import { i as isMakeRef } from "./make-ref-Djkc69iv-BpP6uHEs.js";
+import { q as queryElements, e as focusableQueryString } from "./focus-utilities-DnaItyVQ-Degzwldb.js";
+const TRAP_FOCUS_EXCLUDE_ATTRIBUTE = "data-ix-focus-trap-exclude";
+const TRAP_FOCUS_INCLUDE_ATTRIBUTE = "data-ix-focus-trap-include";
+const addFocusTrap = async (element, options) => {
+  let ref = element;
+  if (options?.targetElement) {
+    if (options.targetElement instanceof HTMLElement) {
+      ref = options.targetElement;
+    } else if (isMakeRef(options.targetElement)) {
+      ref = await options.targetElement.waitForCurrent();
+    }
+  }
+  const onKeydown = (event) => {
+    const keyboardEvent = event;
+    if (keyboardEvent.key === "Tab") {
+      const focusTrapRoot = options?.trapFocusInShadowDom ? ref.shadowRoot : ref;
+      const focusableElements = queryElements(focusTrapRoot, `${focusableQueryString}, [${TRAP_FOCUS_INCLUDE_ATTRIBUTE}]`);
+      for (let index = 0; index < focusableElements.length; index++) {
+        const includeElement = focusableElements[index];
+        if (!includeElement.hasAttribute(TRAP_FOCUS_INCLUDE_ATTRIBUTE)) {
+          continue;
+        }
+        const includedFocusableElements = queryElements(options?.trapFocusInShadowDom && includeElement.shadowRoot ? includeElement.shadowRoot : includeElement, focusableQueryString).filter((element2) => element2 !== includeElement);
+        for (const includedElement of includedFocusableElements) {
+          const duplicateIndex = focusableElements.indexOf(includedElement);
+          if (duplicateIndex !== -1) {
+            focusableElements.splice(duplicateIndex, 1);
+            if (duplicateIndex < index) {
+              index--;
+            }
+          }
+        }
+        focusableElements.splice(index, 1, ...includedFocusableElements);
+        index += includedFocusableElements.length - 1;
+      }
+      if (focusableElements.length === 0) {
+        return;
+      }
+      if (options?.excludeElements) {
+        focusableElements.forEach((element2) => {
+          if (element2.hasAttribute(TRAP_FOCUS_EXCLUDE_ATTRIBUTE)) {
+            const index = focusableElements.indexOf(element2);
+            if (index !== -1) {
+              focusableElements.splice(index, 1);
+            }
+          }
+        });
+      }
+      if (focusableElements.length === 0) {
+        return;
+      }
+      const firstElement = focusableElements[0];
+      const lastElement = focusableElements[focusableElements.length - 1];
+      let activeElement = document.activeElement;
+      if (ref instanceof HTMLElement && ref.shadowRoot) {
+        activeElement = ref.shadowRoot.activeElement || activeElement;
+      }
+      if (activeElement?.hasAttribute(TRAP_FOCUS_INCLUDE_ATTRIBUTE) && activeElement?.shadowRoot && activeElement.shadowRoot.activeElement) {
+        activeElement = activeElement.shadowRoot.activeElement;
+      }
+      if (keyboardEvent.shiftKey) {
+        if (activeElement === firstElement) {
+          keyboardEvent.preventDefault();
+          lastElement.focus();
+        }
+      } else {
+        if (activeElement === lastElement) {
+          keyboardEvent.preventDefault();
+          firstElement.focus();
+        }
+      }
+      event.stopImmediatePropagation();
+    }
+  };
+  ref.addEventListener("keydown", onKeydown);
+  const destroy = () => {
+    ref.removeEventListener("keydown", onKeydown);
+  };
+  return {
+    destroy
+  };
+};
+export {
+  TRAP_FOCUS_EXCLUDE_ATTRIBUTE as T,
+  TRAP_FOCUS_INCLUDE_ATTRIBUTE as a,
+  addFocusTrap as b
+};

package/build/static/demo/v2/preview/html/assets/focus-utilities-DnaItyVQ-Degzwldb.js

@@ -0,0 +1,98 @@
+const IX_FOCUS_VISIBLE_ACTIVE = "ix-focused";
+const IX_FOCUS_VISIBLE = "ix-focusable";
+const FOCUS_KEYS = /* @__PURE__ */ new Set([
+  "Tab",
+  "ArrowDown",
+  "Space",
+  "Escape",
+  " ",
+  "Shift",
+  "Enter",
+  "ArrowLeft",
+  "ArrowRight",
+  "ArrowUp",
+  "Home",
+  "End"
+]);
+function queryElements(dropdownElement, query) {
+  if (!dropdownElement) {
+    return [];
+  }
+  let items = [];
+  if (dropdownElement.querySelectorAll("slot").length > 0) {
+    const slotElements = Array.from(dropdownElement.querySelectorAll("slot"));
+    items = slotElements.flatMap((slot) => Array.from(slot.assignedElements({ flatten: true })).flatMap((el) => {
+      if (el?.matches(query)) {
+        return [el];
+      }
+      return Array.from(el.querySelectorAll(query));
+    }));
+  }
+  items = [
+    ...items,
+    ...Array.from(dropdownElement.querySelectorAll(query))
+  ];
+  return items;
+}
+function tryFocusElement(element, options) {
+  if (!(element instanceof HTMLElement)) {
+    return;
+  }
+  try {
+    element.focus(options);
+  } catch {
+  }
+}
+const focusFirstDescendant = (ref, fallbackElement, options) => {
+  if (options?.focusCheckedItem) {
+    const checkedQueryString = buildFocusableQueryString("[checked]");
+    const checkedElements = queryElements(ref, checkedQueryString);
+    if (checkedElements.length > 0) {
+      focusElementInContext(checkedElements[0], ref);
+      return;
+    }
+  }
+  const inputs = queryElements(ref, focusableQueryString);
+  const firstInput = inputs.length > 0 ? inputs[0] : null;
+  focusElementInContext(firstInput, ref);
+};
+const focusLastDescendant = (ref, fallbackElement) => {
+  const inputs = queryElements(ref, focusableQueryString);
+  const lastInput = inputs.length > 0 ? inputs[inputs.length - 1] : null;
+  focusElementInContext(lastInput, ref);
+};
+const focusElementInContext = (hostToFocus, fallbackElement) => {
+  let elementToFocus = hostToFocus;
+  const shadowRoot = hostToFocus?.shadowRoot;
+  if (shadowRoot) {
+    elementToFocus = shadowRoot.querySelector(focusableQueryString) || hostToFocus;
+  }
+  if (elementToFocus) {
+    focusElement(elementToFocus);
+  } else {
+    focusElement(fallbackElement);
+  }
+};
+const focusElement = (element, options) => {
+  if (!element) {
+    return;
+  }
+  element.focus(options);
+};
+const focusableBase = ':not([tabindex^="-"]):not([hidden]):not([disabled])';
+const customTags = ["ix-dropdown-item", "ix-select-item"];
+const buildCustom = (additionalSelector) => customTags.map((tag) => `${tag}${focusableBase}${additionalSelector}`).join(", ");
+const focusableQueryString = `[tabindex]${focusableBase}, ${buildCustom("")}`;
+const buildFocusableQueryString = (additionalSelector = "") => `[tabindex]${focusableBase}${additionalSelector}, ${buildCustom(additionalSelector)}`;
+export {
+  FOCUS_KEYS as F,
+  IX_FOCUS_VISIBLE as I,
+  IX_FOCUS_VISIBLE_ACTIVE as a,
+  focusElementInContext as b,
+  focusFirstDescendant as c,
+  focusLastDescendant as d,
+  focusableQueryString as e,
+  focusElement as f,
+  queryElements as q,
+  tryFocusElement as t
+};

package/build/static/demo/v2/preview/html/assets/focus-visible.mixin-CoMZ6z5Z-ZlXaILhq.js

@@ -0,0 +1,40 @@
+import { a as registerInstance } from "./global-DjWMysHf.js";
+import { a as a11yBoolean } from "./a11y-B5k8YVR0-BOSd6BQK.js";
+const FocusVisibleMixin = (Base) => {
+  const FocusVisibleMixinCtor = class extends Base {
+    /**
+     * @internal
+     */
+    ixFocusVisible = false;
+    /**
+     * When `true`, do not map keyboard focus visibility to `aria-selected` on the host.
+     * Use when selection state must not mirror roving focus (e.g. `ix-select-item`).
+     *
+     * @internal
+     */
+    disableAriaSelectHandling = false;
+    constructor(hostRef, ...args) {
+      super(...args);
+      registerInstance(this, hostRef);
+    }
+    componentDidLoad() {
+      if (super.componentDidLoad) {
+        super.componentDidLoad();
+      }
+    }
+    $internal_checkAriaSelected(focusVisible) {
+      if (!this.hostElement) {
+        return;
+      }
+      if (this.disableAriaSelectHandling) {
+        this.hostElement.removeAttribute("aria-selected");
+        return;
+      }
+      this.hostElement.ariaSelected = a11yBoolean(focusVisible);
+    }
+  };
+  return FocusVisibleMixinCtor;
+};
+export {
+  FocusVisibleMixin as F
+};