@icen.ai/ui 0.4.0 → 0.8.0

package/dist/behaviors/popover.d.mts

@@ -0,0 +1,46 @@
+interface PopoverRect {
+    left: number;
+    top: number;
+    right: number;
+    bottom: number;
+    width: number;
+    height: number;
+}
+interface PopoverViewport {
+    width: number;
+    height: number;
+}
+type PopoverSide = 'top' | 'bottom';
+type PopoverAlign = 'start' | 'center' | 'end' | 'stretch';
+interface PopoverLayoutOptions {
+    side?: PopoverSide;
+    align?: PopoverAlign;
+    offset?: number;
+    margin?: number;
+    minWidth?: number;
+    maxWidth?: number;
+    minHeight?: number;
+    maxHeight?: number;
+    /** 内容预期高度：避免用被裁剪的实测高度参与选侧 */
+    contentHeightHint?: number;
+}
+interface PopoverLayout {
+    side: PopoverSide;
+    left: number;
+    top: number;
+    width: number;
+    maxHeight: number;
+}
+interface OpenPopoverOptions extends PopoverLayoutOptions {
+    anchor: Element | PopoverRect;
+    /** 关闭（含外点/Esc 触发的关闭）后的回调 */
+    onClose?: () => void;
+}
+/** 视口智能布局：返回 {side, left, top, width, maxHeight}。 */
+declare function computePopoverLayout(anchor: PopoverRect, viewport: PopoverViewport, opts?: PopoverLayoutOptions): PopoverLayout;
+/** 打开浮层：panel 移入 body 并按 anchor 布局；重复调用同一 panel 为先关后开。 */
+declare function openPopover(panel: HTMLElement, options: OpenPopoverOptions): void;
+/** 关闭浮层：移除监听并把 panel 还原到打开前的位置与 hidden 状态。 */
+declare function closePopover(panel: HTMLElement): void;
+
+export { type OpenPopoverOptions, type PopoverAlign, type PopoverLayout, type PopoverLayoutOptions, type PopoverRect, type PopoverSide, type PopoverViewport, closePopover, computePopoverLayout, openPopover };

package/dist/behaviors/popover.mjs

@@ -139,7 +139,8 @@ function closePopover(panel) {
   if (!state) return;
   openPanels.delete(panel);
   panel.style.visibility = state.prevVisibility;
-  panel.hidden = state.wasHidden;
+  if (typeof state.wasHidden === "string") panel.setAttribute("hidden", state.wasHidden);
+  else panel.hidden = state.wasHidden;
   panel.style.left = "";
   panel.style.top = "";
   panel.style.width = "";

package/dist/behaviors/select.d.mts

@@ -0,0 +1,4 @@
+/** 为 root 下每个 [data-select] 容器初始化（root 自身是 [data-select] 也算）。 */
+declare function initSelect(root?: ParentNode): void;
+
+export { initSelect };

package/dist/behaviors/select.mjs

@@ -1,4 +1,101 @@
+// src/behaviors/popover.ts
+var DEFAULT_MIN_WIDTH = 220;
+var DEFAULT_MAX_WIDTH = 420;
+var DEFAULT_MIN_HEIGHT = 120;
+var DEFAULT_MAX_HEIGHT = 420;
+function clamp(value, min, max) {
+  if (max < min) return min;
+  return Math.min(max, Math.max(min, value));
+}
+function chooseSide(preferredSide, availableTop, availableBottom, desiredHeight) {
+  const preferredSpace = preferredSide === "top" ? availableTop : availableBottom;
+  const oppositeSpace = preferredSide === "top" ? availableBottom : availableTop;
+  if (preferredSpace >= desiredHeight) return preferredSide;
+  if (oppositeSpace >= desiredHeight) return preferredSide === "top" ? "bottom" : "top";
+  if (preferredSpace >= oppositeSpace) return preferredSide;
+  return preferredSide === "top" ? "bottom" : "top";
+}
+function horizontalAnchor(anchor, width, align) {
+  if (align === "center") return anchor.left + anchor.width / 2 - width / 2;
+  if (align === "end") return anchor.right - width;
+  return anchor.left;
+}
+function computePopoverLayout(anchor, viewport, opts = {}) {
+  const margin = opts.margin ?? 12;
+  const offset = opts.offset ?? 8;
+  const availableWidth = Math.max(80, viewport.width - margin * 2);
+  const requestedMinWidth = Math.max(1, opts.minWidth ?? DEFAULT_MIN_WIDTH);
+  const requestedMaxWidth = Math.max(requestedMinWidth, opts.maxWidth ?? DEFAULT_MAX_WIDTH);
+  const maxWidth = Math.min(requestedMaxWidth, availableWidth);
+  const minWidth = Math.min(requestedMinWidth, maxWidth);
+  const preferredSide = opts.side ?? "top";
+  const align = opts.align ?? "start";
+  const availableTop = Math.max(0, anchor.top - margin - offset);
+  const availableBottom = Math.max(0, viewport.height - anchor.bottom - margin - offset);
+  const availableHeight = Math.max(80, viewport.height - margin * 2);
+  const minHeight = Math.min(Math.max(80, opts.minHeight ?? DEFAULT_MIN_HEIGHT), availableHeight);
+  const requestedMaxHeight = Math.max(minHeight, opts.maxHeight ?? DEFAULT_MAX_HEIGHT);
+  const fallbackHeight = Math.min(260, requestedMaxHeight);
+  const contentHeight = Math.max(opts.contentHeightHint ?? 0, fallbackHeight);
+  const desiredHeight = clamp(contentHeight, minHeight, Math.min(requestedMaxHeight, availableHeight));
+  const side = chooseSide(preferredSide, availableTop, availableBottom, desiredHeight);
+  const sideSpace = side === "top" ? availableTop : availableBottom;
+  const maxHeight = Math.min(
+    requestedMaxHeight,
+    Math.max(80, sideSpace || Math.max(availableTop, availableBottom)),
+    availableHeight
+  );
+  const positionedHeight = clamp(desiredHeight, 40, maxHeight);
+  const width = align === "stretch" ? clamp(anchor.width, minWidth, maxWidth) : maxWidth;
+  const left = clamp(horizontalAnchor(anchor, width, align), margin, viewport.width - margin - width);
+  const desiredTop = side === "top" ? anchor.top - offset - positionedHeight : anchor.bottom + offset;
+  const top = clamp(desiredTop, margin, viewport.height - margin - positionedHeight);
+  return { side, left, top, width, maxHeight };
+}
+
 // src/behaviors/select.ts
+var openSelect = null;
+var globalBound = false;
+var PANEL_OFFSET = 4;
+var PANEL_MAX_HEIGHT = 240;
+function onGlobalPointerDown(ev) {
+  const cur = openSelect;
+  if (!cur) return;
+  const t = ev.target;
+  if (!(t instanceof Node)) return;
+  if (cur.container.contains(t) || cur.panel.contains(t)) return;
+  cur.close();
+}
+function onGlobalKeyDown(ev) {
+  if (ev.key !== "Escape") return;
+  const cur = openSelect;
+  if (!cur) return;
+  cur.close();
+  cur.trigger.focus();
+}
+function onWindowChange() {
+  const cur = openSelect;
+  if (!cur) return;
+  if (!cur.trigger.isConnected) {
+    cur.close();
+    return;
+  }
+  cur.reposition();
+}
+function bindGlobalListeners() {
+  if (globalBound) return;
+  globalBound = true;
+  document.addEventListener("pointerdown", onGlobalPointerDown);
+  document.addEventListener("keydown", onGlobalKeyDown);
+}
+function bindOpenListeners() {
+  window.addEventListener("scroll", onWindowChange, true);
+  window.addEventListener("resize", onWindowChange);
+}
+function unbindOpenListeners() {
+  window.removeEventListener("scroll", onWindowChange, true);
+  window.removeEventListener("resize", onWindowChange);
+}
 function setup(container) {
   const el = container;
   if (el.__icenSelectInit) return;
@@ -10,21 +107,39 @@ function setup(container) {
   if (!triggerEl || !panelEl) return;
   const trigger = triggerEl;
   const panel = panelEl;
-  const options = () => Array.from(panel.querySelectorAll(".select-option"));
-  const isOpen = () => !panel.hidden;
+  const isMultiple = container.hasAttribute("data-select-multiple");
+  const isSearchable = container.hasAttribute("data-select-search");
+  const maxSelect = Number(container.getAttribute("data-select-max")) || 0;
+  const placeholder = container.getAttribute("data-select-placeholder") ?? (valueEl?.classList.contains("is-empty") ? valueEl?.textContent ?? "" : "");
+  if (isMultiple) panel.setAttribute("data-select-multiple", "");
+  let searchInput = null;
   let focusIdx = -1;
+  if (isSearchable && !panel.querySelector(".select-search-input")) {
+    const searchWrap = document.createElement("div");
+    searchWrap.className = "select-search";
+    const input = document.createElement("input");
+    input.className = "select-search-input";
+    input.type = "search";
+    input.placeholder = "\u641C\u7D22\u2026";
+    searchWrap.appendChild(input);
+    panel.insertBefore(searchWrap, panel.firstChild);
+  }
+  searchInput = panel.querySelector(".select-search-input");
+  const allOptions = () => Array.from(panel.querySelectorAll(".select-option"));
+  const visibleOptions = () => allOptions().filter((o) => !o.hidden);
+  const isOpen = () => !panel.hidden;
   function setFocus(idx) {
-    const opts = options();
+    const opts = visibleOptions();
     focusIdx = Math.max(-1, Math.min(idx, opts.length - 1));
     opts.forEach((o, i) => o.classList.toggle("is-focused", i === focusIdx));
     const cur = focusIdx >= 0 ? opts[focusIdx] : void 0;
     cur?.scrollIntoView({ block: "nearest" });
   }
   function firstEnabled() {
-    return options().findIndex((o) => !o.classList.contains("is-disabled"));
+    return visibleOptions().findIndex((o) => !o.classList.contains("is-disabled"));
   }
   function moveFocus(delta) {
-    const opts = options();
+    const opts = visibleOptions();
     if (opts.length === 0) return;
     let n = focusIdx;
     for (let guard = 0; guard < opts.length; guard++) {
@@ -34,13 +149,83 @@ function setup(container) {
     }
     setFocus(n);
   }
+  let emptyEl = panel.querySelector(".select-empty");
+  if (!emptyEl) {
+    emptyEl = document.createElement("div");
+    emptyEl.className = "select-empty";
+    emptyEl.textContent = "\u65E0\u5339\u914D\u9879";
+    emptyEl.hidden = true;
+    panel.appendChild(emptyEl);
+  }
+  function updateEmptyState() {
+    const hasVisible = visibleOptions().length > 0;
+    if (emptyEl) emptyEl.hidden = hasVisible;
+  }
+  function filterOptions(query) {
+    const q = query.trim().toLowerCase();
+    const groups = Array.from(panel.querySelectorAll(".select-group"));
+    for (const opt of allOptions()) {
+      const text = (opt.textContent ?? "").toLowerCase();
+      const kw = (opt.getAttribute("data-keywords") ?? "").toLowerCase();
+      opt.hidden = q !== "" && !text.includes(q) && !kw.includes(q);
+    }
+    for (const g of groups) {
+      const hasVisible = Array.from(g.querySelectorAll(".select-option")).some((o) => !o.hidden);
+      g.hidden = !hasVisible;
+    }
+    updateEmptyState();
+    setFocus(firstEnabled());
+  }
+  if (searchInput) {
+    searchInput.addEventListener("input", () => filterOptions(searchInput.value));
+    searchInput.addEventListener("keydown", (ev) => {
+      if (ev.key === "Escape") {
+        ev.stopPropagation();
+        searchInput.value = "";
+        filterOptions("");
+        searchInput.focus();
+      }
+    });
+  }
+  function positionPanel() {
+    const rect = trigger.getBoundingClientRect();
+    const layout = computePopoverLayout(
+      rect,
+      { width: window.innerWidth, height: window.innerHeight },
+      {
+        side: "bottom",
+        align: "stretch",
+        offset: PANEL_OFFSET,
+        minWidth: rect.width,
+        maxWidth: rect.width,
+        maxHeight: PANEL_MAX_HEIGHT
+      }
+    );
+    panel.style.left = `${layout.left + window.scrollX}px`;
+    panel.style.top = `${layout.top + window.scrollY}px`;
+    panel.style.minWidth = `${layout.width}px`;
+    panel.style.width = `${layout.width}px`;
+    panel.style.maxHeight = `${layout.maxHeight}px`;
+    panel.dataset.side = layout.side;
+  }
   function openPanel() {
     if (isOpen()) return;
+    openSelect?.close();
+    if (panel.parentElement !== document.body) document.body.appendChild(panel);
     panel.hidden = false;
     container.classList.add("is-open");
     trigger.setAttribute("aria-expanded", "true");
-    const sel = options().findIndex((o) => o.classList.contains("is-selected"));
-    setFocus(sel >= 0 ? sel : firstEnabled());
+    positionPanel();
+    openSelect = { container, trigger, panel, close: closePanel, reposition: positionPanel };
+    bindOpenListeners();
+    if (searchInput) {
+      searchInput.value = "";
+      filterOptions("");
+      setTimeout(() => searchInput?.focus(), 0);
+    } else {
+      const sel = allOptions().findIndex((o) => o.classList.contains("is-selected"));
+      setFocus(sel >= 0 ? sel : firstEnabled());
+    }
   }
   function closePanel() {
     if (!isOpen()) return;
@@ -48,22 +233,77 @@ function setup(container) {
     container.classList.remove("is-open");
     trigger.setAttribute("aria-expanded", "false");
     setFocus(-1);
+    if (openSelect?.panel === panel) openSelect = null;
+    unbindOpenListeners();
   }
-  function choose(opt) {
-    if (opt.classList.contains("is-disabled")) return;
-    options().forEach((o) => o.classList.toggle("is-selected", o === opt));
-    if (valueEl) {
-      valueEl.textContent = opt.textContent ?? "";
+  function getSelectedValues() {
+    return allOptions().filter((o) => o.classList.contains("is-selected")).map((o) => o.getAttribute("data-value") ?? "");
+  }
+  function updateMultiTrigger() {
+    if (!valueEl) return;
+    const selected = allOptions().filter((o) => o.classList.contains("is-selected"));
+    if (selected.length === 0) {
+      valueEl.textContent = placeholder;
+      valueEl.classList.add("is-empty");
+      container.removeAttribute("data-value");
+    } else {
       valueEl.classList.remove("is-empty");
+      const maxLabel = Number(container.getAttribute("data-select-max-label")) || 2;
+      if (selected.length <= maxLabel) {
+        valueEl.textContent = selected.map((o) => o.textContent ?? "").join("\u3001");
+      } else {
+        valueEl.textContent = `\u5DF2\u9009 ${selected.length} \u9879`;
+      }
     }
-    const v = opt.getAttribute("data-value") ?? "";
-    container.setAttribute("data-value", v);
-    if (hiddenInput) {
-      hiddenInput.value = v;
-      hiddenInput.dispatchEvent(new Event("change", { bubbles: true }));
+    if (maxSelect > 0) {
+      const atMax = selected.length >= maxSelect;
+      allOptions().forEach((o) => {
+        if (!o.classList.contains("is-selected")) {
+          o.classList.toggle("is-disabled", atMax);
+        }
+      });
     }
-    closePanel();
-    trigger.focus();
+  }
+  function syncHiddenInput() {
+    if (!hiddenInput) return;
+    const values = getSelectedValues();
+    hiddenInput.value = isMultiple ? values.join(",") : values[0] ?? "";
+    hiddenInput.dispatchEvent(new Event("change", { bubbles: true }));
+  }
+  function choose(opt) {
+    if (opt.classList.contains("is-disabled")) return;
+    if (isMultiple) {
+      opt.classList.toggle("is-selected");
+      container.setAttribute(
+        "data-value",
+        getSelectedValues().join(",")
+      );
+      updateMultiTrigger();
+      syncHiddenInput();
+      if (searchInput) searchInput.focus();
+      else opt.focus();
+    } else {
+      allOptions().forEach((o) => o.classList.toggle("is-selected", o === opt));
+      if (valueEl) {
+        valueEl.textContent = opt.textContent ?? "";
+        valueEl.classList.remove("is-empty");
+      }
+      const v = opt.getAttribute("data-value") ?? "";
+      container.setAttribute("data-value", v);
+      syncHiddenInput();
+      closePanel();
+      trigger.focus();
+    }
+  }
+  const clearBtn = container.querySelector(".select-clear");
+  if (clearBtn && isMultiple) {
+    clearBtn.addEventListener("click", (ev) => {
+      ev.stopPropagation();
+      allOptions().forEach((o) => o.classList.remove("is-selected"));
+      updateMultiTrigger();
+      syncHiddenInput();
+    });
+    clearBtn.addEventListener("pointerdown", (ev) => ev.stopPropagation());
   }
   trigger.addEventListener("click", () => isOpen() ? closePanel() : openPanel());
   trigger.addEventListener("keydown", (ev) => {
@@ -86,7 +326,7 @@ function setup(container) {
       case "Enter":
       case " ": {
         ev.preventDefault();
-        const opt = options()[focusIdx];
+        const opt = visibleOptions()[focusIdx];
         if (opt) choose(opt);
         break;
       }
@@ -106,25 +346,19 @@ function setup(container) {
     const t = ev.target;
     if (!(t instanceof Element)) return;
     const opt = t.closest(".select-option");
-    if (!opt) return;
-    const idx = options().indexOf(opt);
+    if (!opt || opt.hidden) return;
+    const idx = visibleOptions().indexOf(opt);
     if (idx >= 0 && !opt.classList.contains("is-disabled")) setFocus(idx);
   });
-  document.addEventListener("pointerdown", (ev) => {
-    if (isOpen() && ev.target instanceof Node && !container.contains(ev.target)) closePanel();
-  });
-  document.addEventListener("keydown", (ev) => {
-    if (ev.key === "Escape" && isOpen()) {
-      closePanel();
-      trigger.focus();
-    }
-  });
+  if (isMultiple) updateMultiTrigger();
 }
-function initSelect(root = document) {
+function initSelect(root) {
   if (typeof document === "undefined") return;
+  const scope = root ?? document;
+  bindGlobalListeners();
   const containers = [];
-  if (root instanceof Element && root.matches("[data-select]")) containers.push(root);
-  containers.push(...Array.from(root.querySelectorAll("[data-select]")));
+  if (scope instanceof Element && scope.matches("[data-select]")) containers.push(scope);
+  containers.push(...Array.from(scope.querySelectorAll("[data-select]")));
   for (const c of containers) setup(c);
 }
 export {

package/dist/behaviors/sidebar.d.mts

@@ -0,0 +1,4 @@
+/** 为 root 下每个 .sidebar 初始化（root 自身是 .sidebar 也算）。 */
+declare function initSidebar(root?: ParentNode): void;
+
+export { initSidebar };

package/dist/behaviors/sidebar.mjs

@@ -27,11 +27,12 @@ function setup(sidebar) {
     }));
   });
 }
-function initSidebar(root = document) {
+function initSidebar(root) {
   if (typeof document === "undefined") return;
+  const scope = root ?? document;
   const sidebars = [];
-  if (root instanceof Element && root.matches(".sidebar")) sidebars.push(root);
-  sidebars.push(...Array.from(root.querySelectorAll(".sidebar")));
+  if (scope instanceof Element && scope.matches(".sidebar")) sidebars.push(scope);
+  sidebars.push(...Array.from(scope.querySelectorAll(".sidebar")));
   for (const s of sidebars) setup(s);
 }
 export {

package/dist/behaviors/slider.d.mts

@@ -0,0 +1,4 @@
+/** 为 root 下每个 .slider 容器初始化（root 自身是 .slider 也算）。 */
+declare function initSlider(root?: ParentNode): void;
+
+export { initSlider };

package/dist/behaviors/slider.mjs

@@ -92,11 +92,12 @@ function setup(slider) {
   if (slider.classList.contains("slider--dual")) setupDual(slider, natives);
   else setupSingle(slider, natives[0]);
 }
-function initSlider(root = document) {
+function initSlider(root) {
   if (typeof document === "undefined") return;
+  const scope = root ?? document;
   const containers = [];
-  if (root instanceof Element && root.matches(".slider")) containers.push(root);
-  containers.push(...Array.from(root.querySelectorAll(".slider")));
+  if (scope instanceof Element && scope.matches(".slider")) containers.push(scope);
+  containers.push(...Array.from(scope.querySelectorAll(".slider")));
   for (const c of containers) setup(c);
 }
 export {

package/dist/behaviors/split-pane.d.mts

@@ -0,0 +1,4 @@
+/** 为 root 下每个 .split-pane[data-split-pane] 初始化（root 自身匹配也算）。 */
+declare function initSplitPane(root?: ParentNode): void;
+
+export { initSplitPane };

package/dist/behaviors/split-pane.mjs

@@ -0,0 +1,102 @@
+// src/behaviors/split-pane.ts
+function numOr(value, fallback) {
+  if (value === void 0 || value === "") return fallback;
+  const n = Number(value);
+  return Number.isFinite(n) ? n : fallback;
+}
+function pct(value, min, max) {
+  return Math.min(max, Math.max(min, value));
+}
+function setup(container) {
+  const el = container;
+  if (el.__icenSplitPaneInit) return;
+  el.__icenSplitPaneInit = true;
+  const dividerQuery = el.querySelector(".split-pane-divider");
+  if (!dividerQuery) return;
+  const divider = dividerQuery;
+  const min = numOr(el.dataset.splitMin, 10);
+  const max = numOr(el.dataset.splitMax, 90);
+  const step = numOr(el.dataset.splitStep, 2);
+  const vertical = el.classList.contains("split-pane--vertical");
+  const orientation = vertical ? "vertical" : "horizontal";
+  divider.setAttribute("role", "separator");
+  divider.setAttribute("aria-orientation", orientation === "vertical" ? "horizontal" : "vertical");
+  divider.setAttribute("aria-valuemin", String(min));
+  divider.setAttribute("aria-valuemax", String(max));
+  divider.tabIndex = 0;
+  function readCurrent() {
+    const v = parseFloat(getComputedStyle(el).getPropertyValue("--split"));
+    return Number.isFinite(v) ? v : 50;
+  }
+  function write(p) {
+    const v = pct(p, min, max);
+    el.style.setProperty("--split", v + "%");
+    divider.setAttribute("aria-valuenow", String(Math.round(v)));
+  }
+  if (!el.style.getPropertyValue("--split")) write(50);
+  divider.setAttribute("aria-valuenow", String(Math.round(readCurrent())));
+  let dragging = false;
+  divider.addEventListener("pointerdown", (ev) => {
+    dragging = true;
+    divider.classList.add("is-dragging");
+    divider.setPointerCapture(ev.pointerId);
+    el.style.userSelect = "none";
+  });
+  const onUp = (ev) => {
+    if (!dragging) return;
+    dragging = false;
+    divider.classList.remove("is-dragging");
+    try {
+      divider.releasePointerCapture(ev.pointerId);
+    } catch {
+    }
+    el.style.userSelect = "";
+  };
+  divider.addEventListener("pointerup", onUp);
+  divider.addEventListener("pointercancel", () => {
+    dragging = false;
+    divider.classList.remove("is-dragging");
+    el.style.userSelect = "";
+  });
+  divider.addEventListener("pointermove", (ev) => {
+    if (!dragging) return;
+    const rect = el.getBoundingClientRect();
+    if (vertical) {
+      if (rect.height <= 0) return;
+      const p = (ev.clientY - rect.top) / rect.height * 100;
+      write(p);
+    } else {
+      if (rect.width <= 0) return;
+      const p = (ev.clientX - rect.left) / rect.width * 100;
+      write(p);
+    }
+  });
+  divider.addEventListener("dblclick", () => write(50));
+  divider.addEventListener("keydown", (ev) => {
+    const current = readCurrent();
+    let next = null;
+    if (vertical) {
+      if (ev.key === "ArrowUp") next = current - step;
+      else if (ev.key === "ArrowDown") next = current + step;
+    } else {
+      if (ev.key === "ArrowLeft") next = current - step;
+      else if (ev.key === "ArrowRight") next = current + step;
+    }
+    if (ev.key === "Home") next = min;
+    else if (ev.key === "End") next = max;
+    if (next === null) return;
+    ev.preventDefault();
+    write(next);
+  });
+}
+function initSplitPane(root) {
+  if (typeof document === "undefined") return;
+  const scope = root ?? document;
+  const panes = [];
+  if (scope instanceof Element && scope.matches(".split-pane[data-split-pane]")) panes.push(scope);
+  panes.push(...Array.from(scope.querySelectorAll(".split-pane[data-split-pane]")));
+  for (const p of panes) setup(p);
+}
+export {
+  initSplitPane
+};

package/dist/behaviors/tabs.d.mts

@@ -0,0 +1,8 @@
+/**
+ * 为 root 下每个 [data-tabs] 容器初始化（root 自身是 [data-tabs] 也算）。
+ * 返回销毁函数：调用后移除所有容器监听与 window hashchange，并复位幂等标记
+ * （销毁后的容器可被再次 initTabs 重新接管）。SSR 下返回 no-op 函数。
+ */
+declare function initTabs(root?: ParentNode): () => void;
+
+export { initTabs };