weifuwu 0.36.2 → 0.38.0

package/dist/client/index.js

@@ -29,6 +29,58 @@ function normalizeProps(props) {
 }
 
 // src/client/render.ts
+var mutationMethods = ["push", "pop", "splice", "shift", "unshift", "sort", "reverse"];
+var wrappedCache = /* @__PURE__ */ new WeakMap();
+function wrapDeep(val, dirty) {
+  if (val === null || typeof val !== "object") return val;
+  if (val instanceof Node) return val;
+  if (typeof Blob !== "undefined" && val instanceof Blob) return val;
+  if (wrappedCache.has(val)) return wrappedCache.get(val);
+  const handler = Array.isArray(val) ? {
+    get(target, key, receiver) {
+      const v = Reflect.get(target, key, receiver);
+      if (typeof key === "string" && mutationMethods.includes(key) && typeof v === "function") {
+        return function(...args) {
+          const r = v.apply(target, args);
+          dirty();
+          return r;
+        };
+      }
+      return wrapDeep(v, dirty);
+    },
+    set(target, key, v) {
+      Reflect.set(target, key, wrapDeep(v, dirty));
+      dirty();
+      return true;
+    }
+  } : {
+    get(_target, key, receiver) {
+      const v = Reflect.get(_target, key, receiver);
+      return wrapDeep(v, dirty);
+    },
+    set(target, key, v) {
+      Reflect.set(target, key, wrapDeep(v, dirty));
+      dirty();
+      return true;
+    }
+  };
+  const proxy = new Proxy(val, handler);
+  wrappedCache.set(val, proxy);
+  return proxy;
+}
+function createComponentProxy(target, dirty) {
+  return new Proxy(target, {
+    set(t, k, v) {
+      if (t[k] === v) return true;
+      t[k] = wrapDeep(v, dirty);
+      dirty();
+      return true;
+    },
+    get(t, k) {
+      return wrapDeep(t[k], dirty);
+    }
+  });
+}
 function render(input, ctx) {
   return renderValue(input, ctx);
 }
@@ -66,6 +118,8 @@ function renderComponent(Comp, props, vnode, ctx) {
   if (!prev$) vnode._$ = {};
   ctx.ui = ctx.ui ?? {};
   ctx.ui.ready = !!prev$;
+  const _target = vnode._$;
+  ctx.ui.$ = createComponentProxy(_target, () => ctx.ui?.dirty?.());
   let childVNode;
   try {
     childVNode = Comp(props, ctx);
@@ -169,6 +223,8 @@ function patchValue(parent, oldNode, oldInput, newInput, ctx) {
     if (oldV._$) newV._$ = oldV._$;
     ctx.ui = ctx.ui ?? {};
     ctx.ui.ready = !!newV._$;
+    const _tgt = newV._$;
+    ctx.ui.$ = createComponentProxy(_tgt, () => ctx.ui?.dirty?.());
     const childNew = comp(newV.props, ctx);
     newV._child = childNew;
     return patchValue(parent, oldNode, oldV._child, childNew, ctx);
@@ -211,7 +267,9 @@ function patchProps(el, oldProps, newProps) {
   const newKeys = newProps ? Object.keys(newProps).filter((k) => k !== "children" && k !== "key" && k !== "ref") : [];
   for (const key of oldKeys) {
     if (!newKeys.includes(key)) {
-      if (key === "value" && (el instanceof HTMLInputElement || el instanceof HTMLTextAreaElement)) {
+      if (key.startsWith("on") && typeof oldProps[key] === "function") {
+        el.removeEventListener(key.slice(2).toLowerCase(), oldProps[key]);
+      } else if (key === "value" && (el instanceof HTMLInputElement || el instanceof HTMLTextAreaElement)) {
         ;
         el.value = "";
       } else {
@@ -277,6 +335,14 @@ function normalize(children) {
   return result;
 }
 function patchSimpleChildren(parent, oldChildren, newChildren, ctx) {
+  for (let i = oldChildren.length - 1; i >= newChildren.length; i--) {
+    const oldChild = oldChildren[i];
+    const node = parent.childNodes[i];
+    if (node) {
+      callRefCleanup(oldChild);
+      node.remove();
+    }
+  }
   const max = Math.max(oldChildren.length, newChildren.length);
   for (let i = 0; i < max; i++) {
     const oldChild = oldChildren[i];
@@ -285,12 +351,7 @@ function patchSimpleChildren(parent, oldChildren, newChildren, ctx) {
     if (oldChild === void 0 && newChild !== void 0) {
       const node = renderValue(newChild, ctx);
       parent.appendChild(node);
-    } else if (newChild === void 0) {
-      if (existingNode) {
-        callRefCleanup(oldChild);
-        existingNode.remove();
-      }
-    } else {
+    } else if (oldChild !== void 0 && newChild !== void 0) {
       patchValue(parent, existingNode, oldChild, newChild, ctx);
     }
   }
@@ -413,18 +474,21 @@ function router(opts) {
           params[match.keys[i]] = decodeURIComponent(m[i + 1]);
         }
       }
+      const last = match.chain[match.chain.length - 1];
       return {
         path: match.def.path,
         params,
         query: Object.fromEntries(new URLSearchParams(window.location.search)),
-        chain: match.chain
+        chain: match.chain,
+        title: last?.title ?? ""
       };
     }
-    return { path, params: {}, query: {}, chain: [] };
+    return { path, params: {}, query: {}, chain: [], title: "" };
   }
   return (ctx) => {
     const resolved = resolve(getPath());
     ctx.route = resolved;
+    if (resolved.title) document.title = resolved.title;
     if (!ctx.app) ctx.app = {};
     ctx.app.navigate = (path) => {
       if (mode === "hash") {
@@ -436,11 +500,13 @@ function router(opts) {
         const resolved2 = resolve(path);
         ctx.route = resolved2;
       }
+      if (ctx.route?.title) document.title = ctx.route.title;
       ctx.ui?.render();
     };
     const onPop = () => {
       const resolved2 = resolve(getPath());
       ctx.route = resolved2;
+      if (ctx.route?.title) document.title = ctx.route.title;
       ctx.ui?.render();
     };
     window.addEventListener("popstate", onPop);
@@ -466,48 +532,6 @@ function RouteView(_props, ctx) {
 }
 
 // src/client/app.ts
-var mutationMethods = ["push", "pop", "splice", "shift", "unshift", "sort", "reverse"];
-var wrappedCache = /* @__PURE__ */ new WeakMap();
-function wrapDeep(val, dirty) {
-  if (val === null || typeof val !== "object") return val;
-  if (val instanceof Node) return val;
-  if (wrappedCache.has(val)) return wrappedCache.get(val);
-  let proxy;
-  if (Array.isArray(val)) {
-    proxy = new Proxy(val, {
-      get(target, key, receiver) {
-        const v = Reflect.get(target, key, receiver);
-        if (typeof key === "string" && mutationMethods.includes(key) && typeof v === "function") {
-          return function(...args) {
-            const r = v.apply(target, args);
-            dirty();
-            return r;
-          };
-        }
-        return wrapDeep(v, dirty);
-      },
-      set(target, key, val2) {
-        target[key] = wrapDeep(val2, dirty);
-        dirty();
-        return true;
-      }
-    });
-  } else {
-    proxy = new Proxy(val, {
-      get(_target, key, receiver) {
-        const v = Reflect.get(_target, key, receiver);
-        return wrapDeep(v, dirty);
-      },
-      set(target, key, val2) {
-        target[key] = wrapDeep(val2, dirty);
-        dirty();
-        return true;
-      }
-    });
-  }
-  wrappedCache.set(val, proxy);
-  return proxy;
-}
 function createApp() {
   const middlewares = [];
   let ctx = {};
@@ -542,7 +566,7 @@ function createApp() {
           ctx.ui.render();
         });
       }
-      const $target = {};
+      ;
       ctx.ui = {
         render: () => {
           if (!container || !rootComponent || !oldVNode) return;
@@ -559,13 +583,11 @@ function createApp() {
         dirty: () => {
           scheduleRender();
         },
-        $: new Proxy($target, {
-          set(_target, key, val) {
-            _target[key] = wrapDeep(val, scheduleRender);
-            scheduleRender();
-            return true;
-          }
-        }),
+        /**
+         * 组件级 $ — 在 renderComponent 中被覆盖为每个组件独立的 Proxy。
+         * 这里保留占位，组件实际使用 ctx.ui.$ 时拿到的是 vnode._$ 上的 Proxy。
+         */
+        $: {},
         ready: false
       };
       oldVNode = wrapComponent(RootComponent, ctx);
@@ -875,6 +897,239 @@ function ErrorBoundary(props, ctx) {
     return fb ?? null;
   }
 }
+
+// src/client/locale/zh_CN.ts
+var zhCN = {
+  components: {
+    Button: { loading: "\u52A0\u8F7D\u4E2D..." },
+    FileUpload: {
+      placeholder: "\u70B9\u51FB\u6216\u62D6\u62FD\u4E0A\u4F20\u6587\u4EF6",
+      supportedFormats: "\u652F\u6301\u683C\u5F0F: ",
+      maxSize: "\u6700\u5927 ",
+      remove: "\u5220\u9664"
+    },
+    Pagination: { ariaLabel: "\u5206\u9875" },
+    ProgressBar: { ariaLabel: "\u8FDB\u5EA6" },
+    Switch: { ariaLabel: "\u5207\u6362" },
+    Breadcrumb: { ariaLabel: "\u9762\u5305\u5C51" },
+    Modal: { ariaLabel: "\u5F39\u7A97" },
+    Drawer: { ariaLabel: "\u4FA7\u8FB9\u9762\u677F" }
+  }
+};
+
+// src/client/locale/en_US.ts
+var enUS = {
+  components: {
+    Button: { loading: "Loading..." },
+    FileUpload: {
+      placeholder: "Click or drag to upload",
+      supportedFormats: "Supported formats: ",
+      maxSize: "Max size: ",
+      remove: "Remove"
+    },
+    Pagination: { ariaLabel: "Pagination" },
+    ProgressBar: { ariaLabel: "Progress" },
+    Switch: { ariaLabel: "Toggle" },
+    Breadcrumb: { ariaLabel: "Breadcrumb" },
+    Modal: { ariaLabel: "Dialog" },
+    Drawer: { ariaLabel: "Panel" }
+  }
+};
+
+// src/client/i18n.ts
+var LOCALE_PACKAGES = {
+  "zh-CN": zhCN,
+  "en-US": enUS
+};
+function resolveLang(locale) {
+  if (LOCALE_PACKAGES[locale]) return locale;
+  const prefix = locale.split("-")[0];
+  const match = Object.keys(LOCALE_PACKAGES).find((k) => k.startsWith(prefix));
+  return match ?? "zh-CN";
+}
+function i18n(opts = {}) {
+  const { locale: raw = "zh-CN", messages = {}, components = {} } = opts;
+  const lang = resolveLang(raw);
+  const pkg = LOCALE_PACKAGES[lang];
+  let merged = mergeLocales(pkg, messages, components);
+  const state = {
+    locale: lang,
+    t: (key, fallback) => merged.messages?.[key] ?? fallback ?? key,
+    setLocale: () => {
+    },
+    components: merged.components
+  };
+  return (ctx) => {
+    ;
+    ctx.i18n = state;
+    state.setLocale = (raw2) => {
+      const lang2 = resolveLang(raw2);
+      const pkg2 = LOCALE_PACKAGES[lang2];
+      if (!pkg2) return;
+      merged = mergeLocales(pkg2, messages, components);
+      state.locale = lang2;
+      state.components = merged.components;
+      ctx?.ui?.render();
+    };
+    return ctx;
+  };
+}
+function mergeLocales(pkg, userMessages, userComponents) {
+  return {
+    messages: { ...pkg?.messages, ...userMessages },
+    components: deepMerge(pkg?.components ?? {}, userComponents)
+  };
+}
+function deepMerge(a, b) {
+  const result = { ...a };
+  for (const key of Object.keys(b)) {
+    if (typeof b[key] === "object" && b[key] !== null && typeof result[key] === "object") {
+      result[key] = { ...result[key], ...b[key] };
+    } else {
+      result[key] = b[key];
+    }
+  }
+  return result;
+}
+
+// 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/client/confirm.ts
+function createConfirmModal(message, options) {
+  return new Promise((resolve) => {
+    const {
+      title = "\u786E\u8BA4\u64CD\u4F5C",
+      confirmText = "\u786E\u5B9A",
+      cancelText = "\u53D6\u6D88",
+      variant = "primary"
+    } = options;
+    const overlay = document.createElement("div");
+    overlay.className = "wf-modal";
+    overlay.style.cssText = "position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center";
+    const bg = document.createElement("div");
+    bg.style.cssText = "position:fixed;inset:0;background:rgba(0,0,0,0.4);z-index:-1";
+    const box = document.createElement("div");
+    box.style.cssText = `background:var(--wf-color-bg,#fff);border-radius:var(--wf-radius-md,8px);box-shadow:var(--wf-shadow-lg,0 4px 24px rgba(0,0,0,0.12));min-width:360px;max-width:90vw;z-index:1`;
+    if (title) {
+      const header = document.createElement("div");
+      header.style.cssText = "display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--wf-color-border,#e5e7eb);font-family:var(--wf-font-sans);font-size:var(--wf-font-size-lg);font-weight:var(--wf-font-weight-semibold);color:var(--wf-color-text);line-height:1.4";
+      header.textContent = title;
+      box.appendChild(header);
+    }
+    const body = document.createElement("div");
+    body.style.cssText = "padding:20px;font-family:var(--wf-font-sans);font-size:var(--wf-font-size-sm);color:var(--wf-color-text);line-height:var(--wf-line-height-normal)";
+    body.textContent = message;
+    box.appendChild(body);
+    const footer = document.createElement("div");
+    footer.style.cssText = "display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:12px 20px;border-top:1px solid var(--wf-color-border,#e5e7eb)";
+    const cancelBtn = document.createElement("button");
+    cancelBtn.className = "wf-btn wf-btn--secondary wf-btn--md";
+    cancelBtn.textContent = cancelText;
+    const confirmBtn = document.createElement("button");
+    confirmBtn.className = `wf-btn wf-btn--${variant} wf-btn--md`;
+    confirmBtn.textContent = confirmText;
+    footer.appendChild(cancelBtn);
+    footer.appendChild(confirmBtn);
+    box.appendChild(footer);
+    overlay.appendChild(bg);
+    overlay.appendChild(box);
+    document.body.appendChild(overlay);
+    lockScroll();
+    const close = (result) => {
+      unlockScroll();
+      overlay.remove();
+      resolve(result);
+    };
+    const onKeyDown = (e) => {
+      if (e.key === "Escape") close(false);
+    };
+    document.addEventListener("keydown", onKeyDown);
+    cancelBtn.onclick = () => {
+      document.removeEventListener("keydown", onKeyDown);
+      close(false);
+    };
+    confirmBtn.onclick = () => {
+      document.removeEventListener("keydown", onKeyDown);
+      close(true);
+    };
+    bg.onclick = () => {
+      document.removeEventListener("keydown", onKeyDown);
+      close(false);
+    };
+  });
+}
+function confirm() {
+  return (ctx) => {
+    ;
+    ctx.confirm = (message, options) => createConfirmModal(message, options ?? {});
+    return ctx;
+  };
+}
 export {
   ApiError,
   ErrorBoundary,
@@ -882,12 +1137,19 @@ export {
   RouteView,
   api,
   auth,
+  confirm,
   createApp,
+  enUS,
   extendCtx,
   h,
+  i18n,
   jsx,
   jsxDEV,
   jsxs,
+  lockScroll,
   router,
-  ws
+  trapFocus,
+  unlockScroll,
+  ws,
+  zhCN
 };

package/dist/client/locale/en_US.d.ts

@@ -0,0 +1,34 @@
+/**
+ * weifuwu i18n — 英文组件文案
+ */
+export declare const enUS: {
+    components: {
+        Button: {
+            loading: string;
+        };
+        FileUpload: {
+            placeholder: string;
+            supportedFormats: string;
+            maxSize: string;
+            remove: string;
+        };
+        Pagination: {
+            ariaLabel: string;
+        };
+        ProgressBar: {
+            ariaLabel: string;
+        };
+        Switch: {
+            ariaLabel: string;
+        };
+        Breadcrumb: {
+            ariaLabel: string;
+        };
+        Modal: {
+            ariaLabel: string;
+        };
+        Drawer: {
+            ariaLabel: string;
+        };
+    };
+};

package/dist/client/locale/zh_CN.d.ts

@@ -0,0 +1,34 @@
+/**
+ * weifuwu i18n — 中文组件文案（缺省值）
+ */
+export declare const zhCN: {
+    components: {
+        Button: {
+            loading: string;
+        };
+        FileUpload: {
+            placeholder: string;
+            supportedFormats: string;
+            maxSize: string;
+            remove: string;
+        };
+        Pagination: {
+            ariaLabel: string;
+        };
+        ProgressBar: {
+            ariaLabel: string;
+        };
+        Switch: {
+            ariaLabel: string;
+        };
+        Breadcrumb: {
+            ariaLabel: string;
+        };
+        Modal: {
+            ariaLabel: string;
+        };
+        Drawer: {
+            ariaLabel: string;
+        };
+    };
+};

package/dist/client/scroll-lock.d.ts

@@ -0,0 +1,5 @@
+/**
+ * weifuwu/client — ScrollLock
+ */
+export declare function lockScroll(): void;
+export declare function unlockScroll(): void;

package/dist/components/Accordion/Accordion.d.ts

@@ -0,0 +1,11 @@
+import type { Component } from '../../client/vnode.ts';
+export interface AccordionItem {
+    key: string;
+    title: string;
+    content?: any;
+}
+export interface AccordionProps {
+    items?: AccordionItem[];
+    multiple?: boolean;
+}
+export declare const Accordion: Component<AccordionProps>;

package/dist/components/Alert/Alert.d.ts

@@ -0,0 +1,9 @@
+import type { Component } from '../../client/vnode.ts';
+export type AlertVariant = 'info' | 'success' | 'warning' | 'error';
+export interface AlertProps {
+    variant?: AlertVariant;
+    closable?: boolean;
+    onClose?: () => void;
+    children?: any;
+}
+export declare const Alert: Component<AlertProps>;

package/dist/components/Avatar/Avatar.d.ts

@@ -0,0 +1,7 @@
+import type { Component } from '../../client/vnode.ts';
+export interface AvatarProps {
+    name?: string;
+    src?: string;
+    size?: 'sm' | 'md' | 'lg';
+}
+export declare const Avatar: Component<AvatarProps>;

package/dist/components/Badge/Badge.d.ts

@@ -0,0 +1,8 @@
+import type { Component } from '../../client/vnode.ts';
+export type BadgeVariant = 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'info';
+export interface BadgeProps {
+    variant?: BadgeVariant;
+    dot?: boolean;
+    children?: any;
+}
+export declare const Badge: Component<BadgeProps>;

package/dist/components/Breadcrumb/Breadcrumb.d.ts

@@ -0,0 +1,9 @@
+import type { Component } from '../../client/vnode.ts';
+export interface BreadcrumbItem {
+    label: string;
+    href?: string;
+}
+export interface BreadcrumbProps {
+    items: BreadcrumbItem[];
+}
+export declare const Breadcrumb: Component<BreadcrumbProps>;

package/dist/components/Button/Button.d.ts

@@ -0,0 +1,12 @@
+import type { Component } from '../../client/vnode.ts';
+export interface ButtonProps {
+    variant?: 'primary' | 'secondary' | 'ghost' | 'danger';
+    size?: 'sm' | 'md' | 'lg';
+    block?: boolean;
+    loading?: boolean;
+    disabled?: boolean;
+    type?: 'button' | 'submit';
+    onClick?: (e: MouseEvent) => void;
+    children?: any;
+}
+export declare const Button: Component<ButtonProps>;

package/dist/components/Card/Card.d.ts

@@ -0,0 +1,9 @@
+import type { Component } from '../../client/vnode.ts';
+export interface CardProps {
+    variant?: 'default' | 'outlined';
+    padding?: 'sm' | 'md' | 'lg';
+    clickable?: boolean;
+    onClick?: () => void;
+    children?: any;
+}
+export declare const Card: Component<CardProps>;

package/dist/components/Checkbox/Checkbox.d.ts

@@ -0,0 +1,8 @@
+import type { Component } from '../../client/vnode.ts';
+export interface CheckboxProps {
+    label?: string;
+    checked?: boolean;
+    disabled?: boolean;
+    onChange?: (checked: boolean) => void;
+}
+export declare const Checkbox: Component<CheckboxProps>;

package/dist/components/Divider/Divider.d.ts

@@ -0,0 +1,6 @@
+import type { Component } from '../../client/vnode.ts';
+export interface DividerProps {
+    vertical?: boolean;
+    children?: any;
+}
+export declare const Divider: Component<DividerProps>;

package/dist/components/Drawer/Drawer.d.ts

@@ -0,0 +1,14 @@
+/**
+ * weifuwu/components — Drawer
+ */
+import type { Component } from '../../client/vnode.ts';
+export type DrawerPosition = 'left' | 'right';
+export interface DrawerProps {
+    open?: boolean;
+    title?: string;
+    position?: DrawerPosition;
+    onClose?: () => void;
+    children?: any;
+    footer?: any;
+}
+export declare const Drawer: Component<DrawerProps>;

package/dist/components/Dropdown/Dropdown.d.ts

@@ -0,0 +1,14 @@
+import type { Component } from '../../client/vnode.ts';
+export interface DropdownItem {
+    label: string;
+    value?: string;
+    disabled?: boolean;
+    variant?: 'default' | 'danger';
+    onClick?: () => void;
+}
+export interface DropdownProps {
+    trigger: any;
+    items?: DropdownItem[];
+    open?: boolean;
+}
+export declare const Dropdown: Component<DropdownProps>;