weifuwu 0.36.2 → 0.38.0

package/dist/components/index.js

@@ -0,0 +1,1064 @@
+// src/client/vnode.ts
+var Fragment = /* @__PURE__ */ Symbol("Fragment");
+function h(type, props, ...children) {
+  const p = normalizeProps(props ?? {});
+  if (children.length > 0) {
+    p.children = children.length === 1 ? children[0] : children;
+  }
+  return { type, props: p, key: props?.key ?? void 0 };
+}
+function normalizeProps(props) {
+  if (!props) return {};
+  const result = {};
+  for (const key of Object.keys(props)) {
+    if (key === "key") continue;
+    result[key] = props[key];
+  }
+  return result;
+}
+
+// src/components/Button/Button.ts
+var Button = (props, ctx) => {
+  const { variant = "primary", size = "md", block, loading, disabled, type, onClick, children } = props;
+  const cls = [
+    "wf-btn",
+    `wf-btn--${variant}`,
+    `wf-btn--${size}`,
+    block && "wf-btn--block",
+    loading && "wf-btn--loading"
+  ].filter(Boolean).join(" ");
+  const L = ctx?.i18n?.components?.Button ?? {};
+  return h("button", {
+    class: cls,
+    type: type ?? "button",
+    disabled: disabled || loading || void 0,
+    "aria-busy": loading || void 0,
+    onClick
+  }, loading ? L.loading ?? "\u52A0\u8F7D\u4E2D..." : children);
+};
+
+// src/components/Input/Input.ts
+var Input = (props) => {
+  const { label, type = "text", value, placeholder, required, disabled, error, hint, onInput, onChange } = props;
+  const inputEl = h("input", {
+    class: "wf-input",
+    type,
+    value: value ?? "",
+    placeholder,
+    required: required || void 0,
+    disabled: disabled || void 0,
+    onInput,
+    onChange
+  });
+  if (!label && !error && !hint) return inputEl;
+  const children = [];
+  if (label) {
+    const labelContent = [label];
+    if (required) labelContent.push(h("span", { class: "wf-input-req" }, "*"));
+    children.push(h("label", { class: "wf-input-label" }, labelContent));
+  }
+  children.push(inputEl);
+  if (error) children.push(h("div", { class: "wf-input-err" }, error));
+  if (hint && !error) children.push(h("div", { class: "wf-input-hint" }, hint));
+  return h("div", { class: `wf-input-wrap${error ? " wf-input--err" : ""}` }, children);
+};
+
+// src/components/Textarea/Textarea.ts
+var Textarea = (props, _ctx) => {
+  const { label, value, placeholder, required, disabled, error, hint, rows = 3, onInput } = props;
+  const textareaEl = h("textarea", {
+    class: "wf-textarea",
+    value: value ?? "",
+    placeholder,
+    required: required || void 0,
+    disabled: disabled || void 0,
+    rows,
+    onInput
+  });
+  const children = [];
+  if (label) {
+    const labelContent = [label];
+    if (required) labelContent.push(h("span", { class: "wf-textarea-req" }, "*"));
+    children.push(h("label", { class: "wf-textarea-label" }, labelContent));
+  }
+  children.push(textareaEl);
+  if (error) children.push(h("div", { class: "wf-textarea-err" }, error));
+  if (hint && !error) children.push(h("div", { class: "wf-textarea-hint" }, hint));
+  return h("div", { class: `wf-textarea-wrap${error ? " wf-textarea--err" : ""}` }, children);
+};
+
+// src/components/Select/Select.ts
+var Select = (props, _ctx) => {
+  const { label, value, options, placeholder, required, disabled, error, onChange, children } = props;
+  const optionEls = [];
+  if (placeholder) {
+    optionEls.push(h("option", { value: "", disabled: true }, placeholder));
+  }
+  if (options) {
+    for (const opt of options) {
+      optionEls.push(h("option", { value: opt.value, disabled: opt.disabled }, opt.label));
+    }
+  }
+  const selectEl = h("select", {
+    class: "wf-select",
+    value: value ?? "",
+    required: required || void 0,
+    disabled: disabled || void 0,
+    onChange
+  }, children ?? optionEls);
+  const wrapChildren = [];
+  if (label) {
+    const labelContent = [label];
+    if (required) labelContent.push(h("span", { class: "wf-select-req" }, "*"));
+    wrapChildren.push(h("label", { class: "wf-select-label" }, labelContent));
+  }
+  wrapChildren.push(selectEl);
+  if (error) wrapChildren.push(h("div", { class: "wf-select-err" }, error));
+  return h("div", { class: `wf-select-wrap${error ? " wf-select--err" : ""}` }, wrapChildren);
+};
+
+// src/components/Checkbox/Checkbox.ts
+var Checkbox = (props, _ctx) => {
+  const { label, checked, disabled, onChange } = props;
+  const input = h("input", {
+    type: "checkbox",
+    class: "wf-checkbox-input",
+    checked: checked || void 0,
+    disabled: disabled || void 0,
+    onChange: onChange ? (e) => onChange(e.target.checked) : void 0
+  });
+  const visual = h("span", { class: "wf-checkbox-visual" });
+  if (!label) return h("label", { class: "wf-checkbox" }, [input, visual]);
+  return h("label", { class: "wf-checkbox" }, [
+    input,
+    visual,
+    h("span", { class: "wf-checkbox-label" }, label)
+  ]);
+};
+
+// src/components/Switch/Switch.ts
+var Switch = (props, ctx) => {
+  const { label, checked, disabled, onChange } = props;
+  const input = h("input", {
+    type: "checkbox",
+    class: "wf-switch-input",
+    checked: checked || void 0,
+    disabled: disabled || void 0,
+    role: "switch",
+    "aria-checked": String(!!checked),
+    onChange: onChange ? (e) => onChange(e.target.checked) : void 0
+  });
+  const track = h("span", { class: "wf-switch-track" });
+  const SL = ctx?.i18n?.components?.Switch ?? {};
+  if (!label) return h("label", { class: "wf-switch", "aria-label": SL.ariaLabel ?? "\u5207\u6362" }, [input, track]);
+  return h("label", { class: "wf-switch" }, [
+    input,
+    track,
+    h("span", { class: "wf-switch-label" }, label)
+  ]);
+};
+
+// src/components/RadioGroup/RadioGroup.ts
+var RadioGroup = (props, _ctx) => {
+  const { name, value, options = [], inline, onChange } = props;
+  const radios = options.map((opt) => {
+    const input = h("input", {
+      type: "radio",
+      class: "wf-radio-input",
+      name: name ?? "radio",
+      value: opt.value,
+      checked: value === opt.value || void 0,
+      disabled: opt.disabled || void 0,
+      onChange: onChange ? () => onChange(opt.value) : void 0
+    });
+    const visual = h("span", { class: "wf-radio-visual" });
+    const label = h("span", { class: "wf-radio-label-text" }, opt.label);
+    return h("label", {
+      class: "wf-radio",
+      key: opt.value
+    }, [input, visual, label]);
+  });
+  return h("div", {
+    class: `wf-radio-group${inline ? " wf-radio-group--inline" : ""}`
+  }, radios);
+};
+
+// src/components/Table/Table.ts
+var Table = (props, _ctx) => {
+  const { data = [], columns, onRowClick } = props;
+  const headerCells = columns.map(
+    (col) => h("th", {
+      class: "wf-table-th",
+      scope: "col",
+      style: col.width ? { width: col.width } : void 0
+    }, col.label)
+  );
+  const headerRow = h("tr", { class: "wf-table-tr" }, headerCells);
+  const thead = h("thead", { class: "wf-table-thead" }, headerRow);
+  const bodyRows = data.map((row, i) => {
+    const cells = columns.map((col) => {
+      const val = row[col.key];
+      const content = col.render ? col.render(val, row, i) : String(val ?? "");
+      return h("td", { class: "wf-table-td" }, content);
+    });
+    return h("tr", {
+      class: "wf-table-tr",
+      onClick: onRowClick ? (e) => {
+        onRowClick(row, i);
+      } : void 0,
+      style: onRowClick ? { cursor: "pointer" } : void 0
+    }, cells);
+  });
+  const tbody = h("tbody", { class: "wf-table-tbody" }, bodyRows);
+  return h("table", { class: "wf-table" }, [thead, tbody]);
+};
+
+// src/client/scroll-lock.ts
+var lockedCount = 0;
+var originalOverflow = "";
+var originalPosition = "";
+var originalTop = "";
+var originalWidth = "";
+var scrollY = 0;
+function canLock() {
+  return typeof window !== "undefined" && typeof document !== "undefined";
+}
+function lockScroll() {
+  lockedCount++;
+  if (lockedCount > 1) return;
+  if (!canLock()) return;
+  scrollY = window.scrollY;
+  const body = document.body;
+  originalOverflow = body.style.overflow;
+  originalPosition = body.style.position;
+  originalTop = body.style.top;
+  originalWidth = body.style.width;
+  body.style.overflow = "hidden";
+  const isIOS = /iPhone|iPad|iPod/.test(navigator.platform) || /Mac/.test(navigator.platform) && "ontouchend" in document;
+  if (isIOS) {
+    body.style.position = "fixed";
+    body.style.top = `-${scrollY}px`;
+    body.style.width = "100%";
+  }
+}
+function unlockScroll() {
+  lockedCount--;
+  if (lockedCount > 0) return;
+  if (!canLock()) return;
+  const body = document.body;
+  body.style.overflow = originalOverflow;
+  body.style.position = originalPosition;
+  body.style.top = originalTop;
+  body.style.width = originalWidth;
+  if (scrollY > 0) window.scrollTo(0, scrollY);
+}
+
+// src/client/focus-trap.ts
+var FOCUSABLE = 'a[href], button:not([disabled]), input:not([disabled]), textarea:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex="-1"])';
+function trapFocus(container) {
+  const focusable = container.querySelectorAll(FOCUSABLE);
+  if (focusable.length === 0) return () => {
+  };
+  const first = focusable[0];
+  const last = focusable[focusable.length - 1];
+  const handler = (e) => {
+    if (e.key !== "Tab") return;
+    if (e.shiftKey && document.activeElement === first) {
+      e.preventDefault();
+      last.focus();
+    } else if (!e.shiftKey && document.activeElement === last) {
+      e.preventDefault();
+      first.focus();
+    }
+  };
+  const prevFocused = document.activeElement;
+  first.focus();
+  container.addEventListener("keydown", handler);
+  return () => {
+    container.removeEventListener("keydown", handler);
+    prevFocused?.focus();
+  };
+}
+
+// src/components/Modal/Modal.ts
+var Modal = (props, ctx) => {
+  const { open, title, onClose, children, footer } = props;
+  const $ = ctx.ui.$;
+  if (!ctx.ui.ready) {
+    $.exiting = false;
+    $.prevOpen = open;
+  }
+  if ($.prevOpen !== open) {
+    $.prevOpen = open;
+    if (open && $.exiting) $.exiting = false;
+  }
+  const startClose = () => {
+    $.exiting = true;
+  };
+  const onExitEnd = () => {
+    $.exiting = false;
+    onClose?.();
+  };
+  if (!open && !$.exiting) return null;
+  const isClosing = $.exiting;
+  const handleKeyDown = (e) => {
+    if (e.key === "Escape" && !isClosing) startClose();
+  };
+  const modalRef = (el) => {
+    if (!el) return;
+    lockScroll();
+    const cleanupFocus = trapFocus(el);
+    return () => {
+      unlockScroll();
+      cleanupFocus();
+    };
+  };
+  const overlay = h("div", {
+    class: "wf-modal-overlay",
+    onClick: isClosing ? void 0 : startClose
+  });
+  const closeBtn = h("button", {
+    class: "wf-modal-close",
+    onClick: isClosing ? void 0 : startClose,
+    type: "button"
+  }, "\u2715");
+  const titleEl = title ? h("div", { class: "wf-modal-header" }, [title, closeBtn]) : null;
+  const bodyEl = h("div", { class: "wf-modal-body" }, children);
+  const footerEl = footer ? h("div", { class: "wf-modal-footer" }, footer) : null;
+  const content = h("div", {
+    class: "wf-modal-content",
+    onClick: (e) => e.stopPropagation()
+  }, [titleEl, bodyEl, footerEl].filter(Boolean));
+  const ML = ctx?.i18n?.components?.Modal ?? {};
+  const cls = isClosing ? "wf-modal wf-modal--exit" : "wf-modal wf-modal--enter";
+  return h("div", {
+    class: cls,
+    role: "dialog",
+    "aria-modal": "true",
+    "aria-label": title ?? (ML.ariaLabel ?? "\u5F39\u7A97"),
+    onKeyDown: handleKeyDown,
+    onAnimationEnd: isClosing ? onExitEnd : void 0,
+    ref: modalRef
+  }, [overlay, content]);
+};
+
+// src/components/Toast/Toast.ts
+var Toast = (props, _ctx) => {
+  const { toasts = [], onRemove } = props;
+  if (toasts.length === 0) return null;
+  const items = toasts.map(
+    (t) => h("div", {
+      class: `wf-toast wf-toast--${t.type}`,
+      key: t.id,
+      onClick: onRemove ? () => onRemove(t.id) : void 0
+    }, [
+      h("span", { class: "wf-toast-icon" }, iconFor(t.type)),
+      h("span", { class: "wf-toast-msg" }, t.message)
+    ])
+  );
+  return h("div", { class: "wf-toast-container" }, items);
+};
+function iconFor(type) {
+  switch (type) {
+    case "success":
+      return "\u2713";
+    case "error":
+      return "\u2715";
+    case "warning":
+      return "\u26A0";
+    case "info":
+      return "\u2139";
+  }
+}
+
+// src/components/Alert/Alert.ts
+var Alert = (props, _ctx) => {
+  const { variant = "info", closable, onClose, children } = props;
+  if (!children) return null;
+  const icon = h("span", { class: "wf-alert-icon" }, iconFor2(variant));
+  const closeBtn = closable ? h("button", { class: "wf-alert-close", onClick: onClose, type: "button" }, "\u2715") : null;
+  const msg = h("span", { class: "wf-alert-msg" }, children);
+  return h("div", { class: `wf-alert wf-alert--${variant}`, role: "alert" }, [icon, msg, closeBtn].filter(Boolean));
+};
+function iconFor2(variant) {
+  switch (variant) {
+    case "success":
+      return "\u2713";
+    case "error":
+      return "\u2715";
+    case "warning":
+      return "\u26A0";
+    case "info":
+      return "\u2139";
+  }
+}
+
+// src/components/Loading/Loading.ts
+var Loading = (props, _ctx) => {
+  const { text = "\u52A0\u8F7D\u4E2D..." } = props;
+  return h("div", { class: "wf-loading", role: "status", "aria-live": "polite" }, [
+    h("div", { class: "wf-loading-spinner" }),
+    h("span", { class: "wf-loading-text" }, text)
+  ]);
+};
+
+// src/components/EmptyState/EmptyState.ts
+var EmptyState = (props, _ctx) => {
+  const { icon = "\u{1F4E6}", text = "\u6682\u65E0\u6570\u636E", hint, children } = props;
+  const parts = [
+    h("div", { class: "wf-empty-icon" }, icon),
+    h("div", { class: "wf-empty-text" }, text)
+  ];
+  if (hint) parts.push(h("div", { class: "wf-empty-hint" }, hint));
+  if (children) parts.push(h("div", { class: "wf-empty-action" }, children));
+  return h("div", { class: "wf-empty", role: "status" }, parts);
+};
+
+// src/components/Tabs/Tabs.ts
+var Tabs = (props, _ctx) => {
+  const { items = [], active, onChange } = props;
+  if (items.length === 0) return null;
+  const activeKey = active ?? items[0].key;
+  const tabList = items.map(
+    (tab) => h("button", {
+      class: `wf-tab${tab.key === activeKey ? " wf-tab--active" : ""}`,
+      key: tab.key,
+      role: "tab",
+      "aria-selected": tab.key === activeKey ? "true" : "false",
+      onClick: tab.key !== activeKey && onChange ? () => onChange(tab.key) : void 0
+    }, tab.label)
+  );
+  const activeTab = items.find((t) => t.key === activeKey);
+  const content = activeTab?.content ? h("div", { class: "wf-tab-content" }, activeTab.content) : null;
+  return h("div", { class: "wf-tabs", role: "tablist" }, [
+    h("div", { class: "wf-tab-list" }, tabList),
+    content
+  ].filter(Boolean));
+};
+
+// src/components/Dropdown/Dropdown.ts
+var Dropdown = (props, _ctx) => {
+  const { trigger, items = [], open } = props;
+  const menuItems = items.map(
+    (item, i) => h("button", {
+      class: `wf-dropdown-item${item.variant === "danger" ? " wf-dropdown-item--danger" : ""}`,
+      key: item.value ?? i,
+      disabled: item.disabled || void 0,
+      role: "menuitem",
+      onClick: item.onClick
+    }, item.label)
+  );
+  const menu = open ? h("div", { class: "wf-dropdown-menu", role: "menu" }, menuItems) : null;
+  return h("div", { class: `wf-dropdown${open ? " wf-dropdown--open" : ""}` }, [
+    trigger,
+    menu
+  ].filter(Boolean));
+};
+
+// src/components/Pagination/Pagination.ts
+var Pagination = (props, ctx) => {
+  const { total, page = 1, pageSize = 20, onChange } = props;
+  const totalPages = Math.max(1, Math.ceil(total / pageSize));
+  if (totalPages <= 1) return null;
+  const pages = [];
+  pages.push(h("button", {
+    class: `wf-page-btn${page <= 1 ? " wf-page-btn--disabled" : ""}`,
+    disabled: page <= 1,
+    onClick: page > 1 && onChange ? () => onChange(page - 1) : void 0
+  }, "\u2039"));
+  const range = getPageRange(page, totalPages);
+  for (const p of range) {
+    if (p === "...") {
+      pages.push(h("span", { class: "wf-page-ellipsis" }, "..."));
+    } else {
+      pages.push(h("button", {
+        class: `wf-page-btn${p === page ? " wf-page-btn--active" : ""}`,
+        "aria-current": p === page ? "page" : void 0,
+        onClick: p !== page && onChange ? () => onChange(p) : void 0
+      }, String(p)));
+    }
+  }
+  pages.push(h("button", {
+    class: `wf-page-btn${page >= totalPages ? " wf-page-btn--disabled" : ""}`,
+    disabled: page >= totalPages,
+    onClick: page < totalPages && onChange ? () => onChange(page + 1) : void 0
+  }, "\u203A"));
+  const PL = ctx?.i18n?.components?.Pagination ?? {};
+  return h("nav", { class: "wf-pagination", "aria-label": PL.ariaLabel ?? "\u5206\u9875" }, pages);
+};
+function getPageRange(current, total) {
+  if (total <= 7) return Array.from({ length: total }, (_, i) => i + 1);
+  const pages = [1];
+  if (current > 3) pages.push("...");
+  const start = Math.max(2, current - 1);
+  const end = Math.min(total - 1, current + 1);
+  for (let i = start; i <= end; i++) pages.push(i);
+  if (current < total - 2) pages.push("...");
+  pages.push(total);
+  return pages;
+}
+
+// src/components/Card/Card.ts
+var Card = (props, _ctx) => {
+  const { variant = "default", padding = "md", clickable, onClick, children } = props;
+  const cls = [
+    "wf-card",
+    `wf-card--${variant}`,
+    `wf-card--pad-${padding}`,
+    clickable && "wf-card--clickable"
+  ].filter(Boolean).join(" ");
+  return h("div", { class: cls, onClick, role: clickable ? "button" : void 0, tabindex: clickable ? 0 : void 0 }, children);
+};
+
+// src/components/Badge/Badge.ts
+var Badge = (props, _ctx) => {
+  const { variant = "default", dot, children } = props;
+  if (dot) {
+    return h("span", { class: `wf-badge-dot wf-badge-dot--${variant}` });
+  }
+  return h("span", { class: `wf-badge wf-badge--${variant}` }, children ?? "");
+};
+
+// src/components/Avatar/Avatar.ts
+var COLORS = ["#4f6ef7", "#22c55e", "#f59e0b", "#ef4444", "#8b5cf6", "#06b6d4", "#ec4899"];
+function hashColor(name) {
+  let hash = 0;
+  for (let i = 0; i < name.length; i++) hash = name.charCodeAt(i) + ((hash << 5) - hash);
+  return COLORS[Math.abs(hash) % COLORS.length];
+}
+var Avatar = (props, _ctx) => {
+  const { name = "", src, size = "md" } = props;
+  const initial = name.trim()[0]?.toUpperCase() ?? "?";
+  if (src) {
+    return h("img", {
+      class: `wf-avatar wf-avatar--${size}`,
+      src,
+      alt: name
+    });
+  }
+  return h("div", {
+    class: `wf-avatar wf-avatar--${size}`,
+    style: { background: hashColor(name) }
+  }, initial);
+};
+
+// src/components/Tag/Tag.ts
+var Tag = (props, _ctx) => {
+  const { closable, onClose, variant = "default", children } = props;
+  const closeBtn = closable ? h("button", { class: "wf-tag-close", onClick: onClose, type: "button" }, "\u2715") : null;
+  return h("span", { class: `wf-tag wf-tag--${variant}` }, [
+    h("span", { class: "wf-tag-text" }, children),
+    closeBtn
+  ].filter(Boolean));
+};
+
+// src/components/StatCard/StatCard.ts
+var StatCard = (props, _ctx) => {
+  const { label, value, trend, trendLabel, icon } = props;
+  const children = [];
+  if (icon) children.push(h("div", { class: "wf-stat-icon" }, icon));
+  children.push(h("div", { class: "wf-stat-value" }, String(value)));
+  children.push(h("div", { class: "wf-stat-label" }, label));
+  if (trend) {
+    children.push(h("div", {
+      class: `wf-stat-trend wf-stat-trend--${trend}`
+    }, [
+      h("span", { class: "wf-stat-trend-arrow" }, trend === "up" ? "\u2191" : "\u2193"),
+      trendLabel ? h("span", { class: "wf-stat-trend-label" }, trendLabel) : null
+    ].filter(Boolean)));
+  }
+  return h("div", { class: "wf-stat" }, children);
+};
+
+// src/components/Steps/Steps.ts
+var Steps = (props, _ctx) => {
+  const { items = [], active, current = 0 } = props;
+  const activeKey = active ?? items[current]?.key;
+  const steps = items.map((item, i) => {
+    const idx = items.findIndex((s) => s.key === activeKey);
+    const isDone = i < idx;
+    const isCurrent = i === idx;
+    const cls = [
+      "wf-step",
+      isDone && "wf-step--done",
+      isCurrent && "wf-step--current"
+    ].filter(Boolean).join(" ");
+    const num = isDone ? h("span", { class: "wf-step-num" }, "\u2713") : h("span", { class: "wf-step-num" }, String(i + 1));
+    const label = h("span", { class: "wf-step-label" }, item.label);
+    const desc = item.description ? h("span", { class: "wf-step-desc" }, item.description) : null;
+    const connector = i < items.length - 1 ? h("span", { class: `wf-step-connector${isDone ? " wf-step-connector--done" : ""}` }) : null;
+    return h("div", { class: cls, key: item.key }, [
+      num,
+      label,
+      desc,
+      connector
+    ].filter(Boolean));
+  });
+  return h("div", { class: "wf-steps" }, steps);
+};
+
+// src/components/Form/Form.ts
+var Form = (props, _ctx) => {
+  const { onSubmit, children } = props;
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    onSubmit?.();
+  };
+  return h("form", {
+    class: "wf-form",
+    onSubmit: handleSubmit
+  }, children);
+};
+
+// src/components/Field/Field.ts
+var Field = (props, _ctx) => {
+  const { label, required, error, hint, children } = props;
+  const parts = [];
+  if (label) {
+    const labelContent = [label];
+    if (required) labelContent.push(h("span", { class: "wf-field-req" }, "*"));
+    parts.push(h("label", { class: "wf-field-label" }, labelContent));
+  }
+  parts.push(children);
+  if (error) parts.push(h("div", { class: "wf-field-err" }, error));
+  if (hint && !error) parts.push(h("div", { class: "wf-field-hint" }, hint));
+  return h("div", { class: `wf-field${error ? " wf-field--err" : ""}` }, parts);
+};
+
+// src/components/Slider/Slider.ts
+var Slider = (props, _ctx) => {
+  const { label, value = 0, min = 0, max = 100, step = 1, onChange } = props;
+  const numVal = Number(value);
+  const input = h("input", {
+    type: "range",
+    class: "wf-slider-input",
+    value: numVal,
+    min,
+    max,
+    step,
+    onChange: onChange ? (e) => onChange(Number(e.target.value)) : void 0
+  });
+  const display = h("span", { class: "wf-slider-value" }, String(numVal));
+  if (!label) return h("div", { class: "wf-slider" }, [input, display]);
+  return h("div", { class: "wf-slider-wrap" }, [
+    h("label", { class: "wf-slider-label" }, label),
+    h("div", { class: "wf-slider" }, [input, display])
+  ]);
+};
+
+// src/components/SearchInput/SearchInput.ts
+var SearchInput = (props, _ctx) => {
+  const { value = "", placeholder = "\u641C\u7D22...", onInput, onClear } = props;
+  const clearBtn = value && onClear ? h("button", {
+    class: "wf-search-clear",
+    type: "button",
+    onClick: onClear
+  }, "\u2715") : null;
+  const icon = h("span", { class: "wf-search-icon" }, "\u{1F50D}");
+  return h("div", { class: "wf-search" }, [
+    icon,
+    h("input", {
+      class: "wf-search-input",
+      type: "search",
+      value,
+      placeholder,
+      onInput
+    }),
+    clearBtn
+  ].filter(Boolean));
+};
+
+// src/components/ProgressBar/ProgressBar.ts
+var ProgressBar = (props, ctx) => {
+  const { value = 0, max = 100, label, showValue } = props;
+  const pct = Math.min(100, Math.max(0, value / max * 100));
+  const PBL = ctx?.i18n?.components?.ProgressBar ?? {};
+  const bar = h("div", {
+    class: "wf-progress",
+    role: "progressbar",
+    "aria-valuenow": Math.round(value),
+    "aria-valuemin": 0,
+    "aria-valuemax": Math.round(max),
+    "aria-label": label ?? (PBL.ariaLabel ?? "\u8FDB\u5EA6")
+  }, [
+    h("div", {
+      class: "wf-progress-fill",
+      style: { width: `${pct}%` }
+    })
+  ]);
+  if (!label && !showValue) return bar;
+  const parts = [];
+  if (label) parts.push(h("span", { class: "wf-progress-label" }, label));
+  parts.push(bar);
+  if (showValue) parts.push(h("span", { class: "wf-progress-value" }, `${Math.round(pct)}%`));
+  return h("div", { class: "wf-progress-wrap" }, parts);
+};
+
+// src/components/Accordion/Accordion.ts
+var Accordion = (props, _ctx) => {
+  const { items = [], multiple } = props;
+  if (items.length === 0) return null;
+  const panels = items.map(
+    (item) => h("details", { class: "wf-accordion-item", key: item.key, open: true }, [
+      h("summary", { class: "wf-accordion-summary", "aria-expanded": "true" }, item.title),
+      item.content ? h("div", { class: "wf-accordion-content" }, item.content) : null
+    ].filter(Boolean))
+  );
+  return h("div", { class: "wf-accordion" }, panels);
+};
+
+// src/components/PageHeader/PageHeader.ts
+var PageHeader = (props, _ctx) => {
+  const { title, sub, children } = props;
+  return h("div", { class: "wf-page-head" }, [
+    h("div", { class: "wf-page-head-left" }, [
+      h("h2", { class: "wf-page-title" }, title),
+      sub ? h("p", { class: "wf-page-sub" }, sub) : null
+    ].filter(Boolean)),
+    children ? h("div", { class: "wf-page-head-actions" }, children) : null
+  ].filter(Boolean));
+};
+
+// src/components/Breadcrumb/Breadcrumb.ts
+var Breadcrumb = (props, ctx) => {
+  const { items } = props;
+  const children = items.flatMap((item, i) => {
+    const isLast = i === items.length - 1;
+    const el = isLast ? h("span", { class: "wf-breadcrumb-current", "aria-current": "page" }, item.label) : item.href ? h("a", { class: "wf-breadcrumb-link", href: item.href }, item.label) : h("span", { class: "wf-breadcrumb-text" }, item.label);
+    if (isLast) return el;
+    return [el, h("span", { class: "wf-breadcrumb-sep", "aria-hidden": "true" }, "/")];
+  });
+  const BL = ctx?.i18n?.components?.Breadcrumb ?? {};
+  return h("nav", { class: "wf-breadcrumb", "aria-label": BL.ariaLabel ?? "\u9762\u5305\u5C51" }, children);
+};
+
+// src/components/Divider/Divider.ts
+var Divider = (props, _ctx) => {
+  const { vertical, children } = props;
+  if (vertical) {
+    return h("div", { class: "wf-divider wf-divider--vertical", role: "separator" });
+  }
+  const cls = children ? "wf-divider wf-divider--with-text" : "wf-divider";
+  return h(
+    "div",
+    { class: cls, role: "separator" },
+    children ? h("span", { class: "wf-divider-text" }, children) : void 0
+  );
+};
+
+// src/components/FileUpload/FileUpload.ts
+function formatSize(bytes) {
+  if (bytes < 1024) return `${bytes}B`;
+  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)}KB`;
+  return `${(bytes / (1024 * 1024)).toFixed(1)}MB`;
+}
+var FileUpload = (props, ctx) => {
+  const { accept, multiple, maxSize, disabled, error, hint, value, onChange, children } = props;
+  const FL = ctx?.i18n?.components?.FileUpload ?? {};
+  const files = value ?? [];
+  let dragOver = false;
+  const handleChange = (e) => {
+    const input = e.target;
+    const selected = Array.from(input.files ?? []);
+    if (maxSize) {
+      const oversized = selected.filter((f) => f.size > maxSize);
+      if (oversized.length > 0) return;
+    }
+    onChange?.(selected);
+    input.value = "";
+  };
+  const handleDrop = (e) => {
+    e.preventDefault();
+    dragOver = false;
+    if (disabled) return;
+    const dropped = Array.from(e.dataTransfer?.files ?? []);
+    if (maxSize) {
+      const oversized = dropped.filter((f) => f.size > maxSize);
+      if (oversized.length > 0) return;
+    }
+    onChange?.(dropped);
+  };
+  const handleDragOver = (e) => {
+    e.preventDefault();
+    dragOver = true;
+  };
+  const handleDragLeave = () => {
+    dragOver = false;
+  };
+  const handleRemove = (i) => {
+    const updated = files.filter((_, idx) => idx !== i);
+    onChange?.(updated);
+  };
+  const inputEl = h("input", {
+    type: "file",
+    class: "wf-upload-input",
+    accept: accept || void 0,
+    multiple: multiple || void 0,
+    disabled: disabled || void 0,
+    onChange: handleChange,
+    style: { display: "none" }
+  });
+  const dropZone = h("div", {
+    class: `wf-upload-zone${disabled ? " wf-upload-zone--disabled" : ""}${error ? " wf-upload-zone--err" : ""}`,
+    onClick: disabled ? void 0 : () => {
+      const input = document.querySelector(".wf-upload-input");
+      input?.click();
+    },
+    onDrop: handleDrop,
+    onDragOver: handleDragOver,
+    onDragLeave: handleDragLeave
+  }, children ?? h("div", { class: "wf-upload-placeholder" }, [
+    h("span", { class: "wf-upload-icon" }, "\u{1F4C1}"),
+    h("span", { class: "wf-upload-text" }, FL.placeholder ?? "\u70B9\u51FB\u6216\u62D6\u62FD\u4E0A\u4F20\u6587\u4EF6"),
+    accept ? h("span", { class: "wf-upload-hint" }, `${FL.supportedFormats ?? "\u652F\u6301\u683C\u5F0F: "}${accept}`) : null,
+    maxSize ? h("span", { class: "wf-upload-hint" }, `${FL.maxSize ?? "\u6700\u5927 "}${formatSize(maxSize)}`) : null
+  ].filter(Boolean)));
+  const fileList = files.length > 0 ? h(
+    "ul",
+    { class: "wf-upload-list" },
+    files.map(
+      (f, i) => h(
+        "li",
+        { class: "wf-upload-item", key: f.name + f.size },
+        h("span", { class: "wf-upload-item-info" }, [
+          h("span", { class: "wf-upload-item-name" }, f.name),
+          h("span", { class: "wf-upload-item-size" }, formatSize(f.size))
+        ]),
+        h("button", {
+          class: "wf-upload-item-remove",
+          "aria-label": `${FL.remove ?? "\u5220\u9664"} ${f.name}`,
+          onClick: () => handleRemove(i)
+        }, "\u2715")
+      )
+    )
+  ) : null;
+  const parts = [inputEl, dropZone, fileList];
+  if (error) parts.push(h("div", { class: "wf-upload-err" }, error));
+  if (hint && !error) parts.push(h("div", { class: "wf-upload-hint" }, hint));
+  return h("div", { class: "wf-upload" }, parts);
+};
+
+// src/components/Tooltip/Tooltip.ts
+var Tooltip = (props, ctx) => {
+  const { content, position = "top", children, disabled } = props;
+  const $ = ctx.ui.$;
+  if (!ctx.ui.ready) {
+    $.show = false;
+  }
+  const show = () => {
+    $.show = true;
+  };
+  const hide = () => {
+    $.show = false;
+  };
+  const tip = $.show && !disabled ? h("div", {
+    class: `wf-tooltip wf-tooltip--${position}`,
+    role: "tooltip"
+  }, [
+    h("div", { class: "wf-tooltip-arrow" }),
+    h("div", { class: "wf-tooltip-content" }, content)
+  ]) : null;
+  return h("div", {
+    class: "wf-tooltip-wrap",
+    onMouseEnter: show,
+    onMouseLeave: hide,
+    onFocus: show,
+    onBlur: hide
+  }, [children, tip].filter(Boolean));
+};
+
+// src/components/Drawer/Drawer.ts
+var Drawer = (props, ctx) => {
+  const { open, title, position = "right", onClose, children, footer } = props;
+  const $ = ctx.ui.$;
+  if (!ctx.ui.ready) {
+    $.exiting = false;
+    $.prevOpen = open;
+  }
+  if ($.prevOpen !== open) {
+    $.prevOpen = open;
+    if (open && $.exiting) $.exiting = false;
+  }
+  const startClose = () => {
+    $.exiting = true;
+  };
+  const onExitEnd = () => {
+    $.exiting = false;
+    onClose?.();
+  };
+  if (!open && !$.exiting) return null;
+  const isClosing = $.exiting;
+  const handleKeyDown = (e) => {
+    if (e.key === "Escape" && !isClosing) startClose();
+  };
+  const drawerRef = (el) => {
+    if (!el) return;
+    lockScroll();
+    const cleanupFocus = trapFocus(el);
+    return () => {
+      unlockScroll();
+      cleanupFocus();
+    };
+  };
+  const overlay = h("div", {
+    class: "wf-drawer-overlay",
+    onClick: isClosing ? void 0 : startClose
+  });
+  const closeBtn = h("button", {
+    class: "wf-drawer-close",
+    onClick: isClosing ? void 0 : startClose,
+    type: "button",
+    "aria-label": "\u5173\u95ED"
+  }, "\u2715");
+  const titleEl = title ? h("div", { class: "wf-drawer-header" }, [title, closeBtn]) : null;
+  const bodyEl = h("div", { class: "wf-drawer-body" }, children);
+  const footerEl = footer ? h("div", { class: "wf-drawer-footer" }, footer) : null;
+  const panel = h("div", {
+    class: `wf-drawer-panel wf-drawer-panel--${position}`,
+    onClick: (e) => e.stopPropagation(),
+    onAnimationEnd: isClosing ? onExitEnd : void 0
+  }, [titleEl, bodyEl, footerEl].filter(Boolean));
+  const DL = ctx?.i18n?.components?.Drawer ?? {};
+  const cls = isClosing ? `wf-drawer wf-drawer--${position} wf-drawer--exit` : `wf-drawer wf-drawer--${position} wf-drawer--enter`;
+  return h("div", {
+    class: cls,
+    role: "dialog",
+    "aria-modal": "true",
+    "aria-label": title ?? (DL.ariaLabel ?? "\u4FA7\u8FB9\u9762\u677F"),
+    onKeyDown: handleKeyDown,
+    ref: drawerRef
+  }, [overlay, panel]);
+};
+
+// src/components/Popover/Popover.ts
+var Popover = (props, ctx) => {
+  const {
+    content,
+    trigger = "click",
+    position = "bottom",
+    open,
+    onOpenChange,
+    disabled,
+    children
+  } = props;
+  const $ = ctx.ui.$;
+  if (!ctx.ui.ready) {
+    $.show = false;
+  }
+  const isOpen = open !== void 0 ? open : $.show;
+  const setOpen = (v) => {
+    if (open === void 0) $.show = v;
+    onOpenChange?.(v);
+  };
+  const onClick = trigger === "click" && !disabled ? () => setOpen(!isOpen) : void 0;
+  const hoverProps = {};
+  if (trigger === "hover" && !disabled) {
+    hoverProps.onMouseEnter = () => setOpen(true);
+    hoverProps.onMouseLeave = () => setOpen(false);
+    hoverProps.onFocus = () => setOpen(true);
+    hoverProps.onBlur = () => setOpen(false);
+  }
+  const overlay = isOpen ? h("div", {
+    class: "wf-popover-overlay",
+    onMouseDown: () => setOpen(false)
+  }) : null;
+  const panel = isOpen ? h("div", {
+    class: `wf-popover wf-popover--${position}`,
+    role: "dialog",
+    "aria-modal": "true",
+    "aria-label": "\u5F39\u51FA\u9762\u677F",
+    onMouseDown: (e) => e.stopPropagation()
+  }, [
+    h("div", { class: "wf-popover-arrow" }),
+    h("div", { class: "wf-popover-content" }, content)
+  ]) : null;
+  return h("div", {
+    class: `wf-popover-wrap${isOpen ? " wf-popover-wrap--open" : ""}`,
+    ...hoverProps
+  }, [
+    h("div", { class: "wf-popover-trigger", onClick }, children),
+    overlay,
+    panel
+  ].filter(Boolean));
+};
+
+// src/components/Skeleton/Skeleton.ts
+var Skeleton = (props) => {
+  const { variant = "text", lines = 1, width, height, className } = props;
+  const style = {};
+  if (width !== void 0) style.width = typeof width === "number" ? `${width}px` : width;
+  if (height !== void 0) style.height = typeof height === "number" ? `${height}px` : height;
+  const cls = [
+    "wf-skeleton",
+    `wf-skeleton--${variant}`,
+    className
+  ].filter(Boolean).join(" ");
+  if (lines <= 1) {
+    return h("div", { class: cls, style: Object.keys(style).length ? style : void 0 });
+  }
+  const items = Array.from({ length: lines }, (_, i) => {
+    const itemCls = i === lines - 1 && lines > 1 ? `${cls} wf-skeleton--short` : cls;
+    return h("div", { class: itemCls, style: Object.keys(style).length ? style : void 0 });
+  });
+  return h(Fragment, null, items);
+};
+
+// src/components/Img/Img.ts
+var Img = (props) => {
+  const { src, alt = "", fallback, loading, width, height, className, style } = props;
+  const imgProps = {
+    class: ["wf-image", className].filter(Boolean).join(" "),
+    src: src ?? fallback ?? "",
+    alt,
+    loading: loading ?? "lazy"
+  };
+  if (width !== void 0) imgProps.width = width;
+  if (height !== void 0) imgProps.height = height;
+  if (style) imgProps.style = style;
+  if (fallback) {
+    imgProps.onError = (e) => {
+      const el = e.currentTarget;
+      if (el.src !== fallback) el.src = fallback;
+    };
+  }
+  return h("img", imgProps);
+};
+export {
+  Accordion,
+  Alert,
+  Avatar,
+  Badge,
+  Breadcrumb,
+  Button,
+  Card,
+  Checkbox,
+  Divider,
+  Drawer,
+  Dropdown,
+  EmptyState,
+  Field,
+  FileUpload,
+  Form,
+  Img,
+  Input,
+  Loading,
+  Modal,
+  PageHeader,
+  Pagination,
+  Popover,
+  ProgressBar,
+  RadioGroup,
+  SearchInput,
+  Select,
+  Skeleton,
+  Slider,
+  StatCard,
+  Steps,
+  Switch,
+  Table,
+  Tabs,
+  Tag,
+  Textarea,
+  Toast,
+  Tooltip
+};