@fangxinyan/lumina 0.6.18 → 0.7.0

package/dist/{chunk-FYSXJXNW.js → chunk-PQOBBASY.js}

@@ -1,17 +1,17 @@
-import './tokens-RYJ3DFTU.css';
+import { withComponentTheme } from './chunk-DRDDQCDD.js';
+import './tokens-CEJVVA3G.css';
 import './shared-NJHRNLRH.css';
-import './Spin-GONGPV4Q.css';
+import './Spin-F5YIEENO.css';
 import * as React from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
-// src/components/Spin/Spin.tsx
 var SIZE_PX = {
   small: 14,
   default: 20,
   large: 32
 };
 var resolveSize = (size) => typeof size === "number" ? size : SIZE_PX[size];
-var Spin = React.forwardRef(({
+var SpinBase = React.forwardRef(({
   size = "default",
   tone = "accent",
   tip,
@@ -38,13 +38,13 @@ var Spin = React.forwardRef(({
     const finalClassName = extraClassName ?? indicatorClass;
     const finalStyle = { ...indicatorStyle, ...extraStyle };
     if (variant === "dots") {
-      return /* @__PURE__ */ jsxs("span", { className: finalClassName, style: finalStyle, "aria-label": "Loading", ...indicatorRest, children: [
+      return /* @__PURE__ */ jsxs("span", { className: finalClassName, style: finalStyle, role: "status", "aria-label": "\u52A0\u8F7D\u4E2D", ...indicatorRest, children: [
         /* @__PURE__ */ jsx("i", {}),
         /* @__PURE__ */ jsx("i", {}),
         /* @__PURE__ */ jsx("i", {})
       ] });
     }
-    return /* @__PURE__ */ jsx("span", { className: finalClassName, style: finalStyle, "aria-label": "Loading", ...indicatorRest });
+    return /* @__PURE__ */ jsx("span", { className: finalClassName, style: finalStyle, role: "status", "aria-label": "\u52A0\u8F7D\u4E2D", ...indicatorRest });
   };
   if (!text) {
     return renderIndicator({
@@ -54,11 +54,12 @@ var Spin = React.forwardRef(({
       ...rest
     });
   }
-  return /* @__PURE__ */ jsxs("span", { ref, className: rootClass, style, ...rest, children: [
-    renderIndicator(),
+  return /* @__PURE__ */ jsxs("span", { ref, className: rootClass, style, role: "status", "aria-live": "polite", ...rest, children: [
+    renderIndicator({ "aria-hidden": true }),
     /* @__PURE__ */ jsx("span", { className: "spin-label", children: text })
   ] });
 });
-Spin.displayName = "Spin";
+SpinBase.displayName = "Spin";
+var Spin = withComponentTheme(SpinBase, "Spin", "spin");
 
 export { Spin };

package/dist/chunk-Q565GDVK.cjs

@@ -0,0 +1,205 @@
+'use strict';
+
+var chunkHSDMJUB6_cjs = require('./chunk-HSDMJUB6.cjs');
+var chunk2AUXUZ3Z_cjs = require('./chunk-2AUXUZ3Z.cjs');
+var chunkNRJXZPZR_cjs = require('./chunk-NRJXZPZR.cjs');
+var chunkEE5KXDRK_cjs = require('./chunk-EE5KXDRK.cjs');
+require('./tokens-CEJVVA3G.css');
+require('./shared-NJHRNLRH.css');
+require('./Message-OTZWQTQ5.css');
+var React = require('react');
+var reactDom = require('react-dom');
+var client = require('react-dom/client');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var listeners = /* @__PURE__ */ new Set();
+var items = [];
+var uid = 0;
+var autoMounted = false;
+var timers = /* @__PURE__ */ new Map();
+function clearMessageTimer(id) {
+  const timer = timers.get(id);
+  if (timer != null && typeof window !== "undefined") window.clearTimeout(timer);
+  timers.delete(id);
+}
+function scheduleMessageTimer(item) {
+  clearMessageTimer(item.id);
+  if (!item.duration || item.duration <= 0 || typeof window === "undefined") return;
+  const timer = window.setTimeout(() => message.dismissById(item.id), item.duration);
+  timers.set(item.id, timer);
+}
+function emit() {
+  if (listeners.size === 0 && !autoMounted && typeof document !== "undefined") {
+    autoMounted = true;
+    const div = document.createElement("div");
+    document.body.appendChild(div);
+    client.createRoot(div).render(React__namespace.createElement(MessageContainer));
+  }
+  listeners.forEach((l) => l(items));
+}
+var isMessageConfig = (value) => {
+  if (value == null || typeof value !== "object" || Array.isArray(value) || React__namespace.isValidElement(value)) return false;
+  const prototype = Object.getPrototypeOf(value);
+  return prototype === Object.prototype || prototype === null;
+};
+var normalizeConfig = (type, content, durationOrTitle, onClose) => {
+  if (isMessageConfig(content)) return { type, ...content };
+  const node = content;
+  if (typeof durationOrTitle === "number") {
+    return { type, content: node, duration: durationOrTitle, onClose };
+  }
+  return { type, content: node, title: durationOrTitle, onClose };
+};
+function removeMessages(predicate) {
+  const removed = items.filter(predicate);
+  if (removed.length === 0) return;
+  const removedIds = new Set(removed.map((item) => item.id));
+  items = items.filter((item) => !removedIds.has(item.id));
+  removed.forEach((item) => {
+    clearMessageTimer(item.id);
+    item.onClose?.();
+  });
+  emit();
+}
+var message = {
+  open(config) {
+    const generatedId = ++uid;
+    const existing = config.key == null ? -1 : items.findIndex((item) => item.key === config.key);
+    const id = existing >= 0 ? items[existing].id : generatedId;
+    const next = {
+      id,
+      key: config.key,
+      type: config.type ?? "info",
+      title: config.title,
+      content: config.content ?? config.message,
+      duration: config.duration ?? 3200,
+      onClose: config.onClose
+    };
+    if (existing >= 0) {
+      items = items.map((item, index) => index === existing ? next : item);
+      emit();
+      scheduleMessageTimer(next);
+      return id;
+    }
+    items = [...items, next];
+    emit();
+    scheduleMessageTimer(next);
+    return id;
+  },
+  show(config) {
+    return message.open(config);
+  },
+  info: (content, durationOrTitle, onClose) => message.open(normalizeConfig("info", content, durationOrTitle, onClose)),
+  success: (content, durationOrTitle, onClose) => message.open(normalizeConfig("success", content, durationOrTitle, onClose)),
+  warning: (content, durationOrTitle, onClose) => message.open(normalizeConfig("warning", content, durationOrTitle, onClose)),
+  warn: (content, durationOrTitle, onClose) => message.open(normalizeConfig("warning", content, durationOrTitle, onClose)),
+  error: (content, durationOrTitle, onClose) => message.open(normalizeConfig("error", content, durationOrTitle, onClose)),
+  dismissById(id) {
+    removeMessages((item) => item.id === id);
+  },
+  dismissByKey(key) {
+    removeMessages((item) => item.key === key);
+  },
+  dismiss(idOrKey) {
+    if (items.some((item) => item.key === idOrKey)) message.dismissByKey(idOrKey);
+    else if (typeof idOrKey === "number") message.dismissById(idOrKey);
+  },
+  destroy(idOrKey) {
+    if (idOrKey == null) message.clear();
+    else message.dismiss(idOrKey);
+  },
+  clear() {
+    const removed = items;
+    items = [];
+    removed.forEach((item) => {
+      clearMessageTimer(item.id);
+      item.onClose?.();
+    });
+    emit();
+  }
+};
+var MessageContainerBase = React__namespace.forwardRef(({ placement = "top-right", className = "", style, ...rest }, ref) => {
+  const portalContainer = chunkEE5KXDRK_cjs.usePortalContainer();
+  const portalTheme = chunkNRJXZPZR_cjs.useComponentPortalTheme("MessageContainer");
+  const [list, setList] = React__namespace.useState(items);
+  const explicitZIndex = typeof style?.zIndex === "number" ? style.zIndex : void 0;
+  const overlayZIndex = chunkHSDMJUB6_cjs.useOverlayZIndex(list.length > 0, explicitZIndex);
+  React__namespace.useEffect(() => {
+    listeners.add(setList);
+    return () => {
+      listeners.delete(setList);
+    };
+  }, []);
+  if (!portalContainer) return null;
+  return reactDom.createPortal(
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref,
+        className: `message-container ${placement} ${className}`,
+        ...portalTheme.dataAttributes,
+        style: {
+          ...portalTheme.style,
+          ...portalTheme.styles.root,
+          ...style,
+          zIndex: style?.zIndex ?? overlayZIndex
+        },
+        ...rest,
+        children: list.map((t) => {
+          const iconName = t.type === "success" ? "check2" : t.type === "warning" || t.type === "error" ? "alert" : "info";
+          return /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              className: `message ${t.type}`,
+              role: t.type === "error" || t.type === "warning" ? "alert" : "status",
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(chunk2AUXUZ3Z_cjs.Icon, { name: iconName, size: 18, className: "message-icon" }),
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "message-body", children: [
+                  t.title != null && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "message-title", children: t.title }),
+                  t.content != null && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "message-content", children: t.content })
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: "message-close", onClick: () => message.dismissById(t.id), "aria-label": "Dismiss", children: /* @__PURE__ */ jsxRuntime.jsx(chunk2AUXUZ3Z_cjs.Icon, { name: "x", size: 14 }) })
+              ]
+            },
+            t.id
+          );
+        })
+      }
+    ),
+    portalContainer
+  );
+});
+MessageContainerBase.displayName = "MessageContainer";
+var MessageContainer = chunkNRJXZPZR_cjs.withComponentTheme(
+  MessageContainerBase,
+  "MessageContainer",
+  "message",
+  { portalOnly: true }
+);
+var toast = message;
+var ToastContainer = MessageContainer;
+
+exports.MessageContainer = MessageContainer;
+exports.ToastContainer = ToastContainer;
+exports.message = message;
+exports.toast = toast;

package/dist/{chunk-FDUQPAQE.cjs → chunk-Q5HLC56A.cjs}

@@ -1,8 +1,10 @@
 'use strict';
 
-require('./tokens-RYJ3DFTU.css');
+var chunkHSDMJUB6_cjs = require('./chunk-HSDMJUB6.cjs');
+var chunkNRJXZPZR_cjs = require('./chunk-NRJXZPZR.cjs');
+require('./tokens-CEJVVA3G.css');
 require('./shared-NJHRNLRH.css');
-require('./Form-NGCQWTMZ.css');
+require('./Form-DNEDZRJA.css');
 var React = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 
@@ -26,7 +28,6 @@ function _interopNamespace(e) {
 
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
-// src/components/Form/Form.tsx
 function makeStore() {
   return {
     values: {},
@@ -35,7 +36,8 @@ function makeStore() {
     initial: {},
     fields: /* @__PURE__ */ new Map(),
     fieldSubs: /* @__PURE__ */ new Map(),
-    formSubs: /* @__PURE__ */ new Set()
+    formSubs: /* @__PURE__ */ new Set(),
+    validationVersions: /* @__PURE__ */ new Map()
   };
 }
 var EMAIL_RE = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
@@ -46,9 +48,10 @@ async function validateSingle(rule, value) {
   if (rule.required && isEmpty) return msg ?? "\u5FC5\u586B\u9879";
   if (rule.whitespace && typeof value === "string" && value.trim() === "") return msg ?? "\u4E0D\u80FD\u4E3A\u7A7A";
   if (isEmpty) return null;
-  if (rule.type === "email" && typeof value === "string" && !EMAIL_RE.test(value)) return msg ?? "\u90AE\u7BB1\u683C\u5F0F\u4E0D\u6B63\u786E";
-  if (rule.type === "url" && typeof value === "string" && !URL_RE.test(value)) return msg ?? "\u94FE\u63A5\u683C\u5F0F\u4E0D\u6B63\u786E";
-  if (rule.type === "number" && typeof value !== "number" && isNaN(Number(value))) return msg ?? "\u5FC5\u987B\u662F\u6570\u5B57";
+  if (rule.type === "email" && (typeof value !== "string" || !EMAIL_RE.test(value))) return msg ?? "\u90AE\u7BB1\u683C\u5F0F\u4E0D\u6B63\u786E";
+  if (rule.type === "url" && (typeof value !== "string" || !URL_RE.test(value))) return msg ?? "\u94FE\u63A5\u683C\u5F0F\u4E0D\u6B63\u786E";
+  if (rule.type === "string" && typeof value !== "string") return msg ?? "\u5FC5\u987B\u662F\u5B57\u7B26\u4E32";
+  if (rule.type === "number" && (typeof value !== "number" || Number.isNaN(value))) return msg ?? "\u5FC5\u987B\u662F\u6570\u5B57";
   if (rule.type === "array" && !Array.isArray(value)) return msg ?? "\u5FC5\u987B\u662F\u6570\u7EC4";
   if (rule.pattern && typeof value === "string" && !rule.pattern.test(value)) return msg ?? "\u683C\u5F0F\u4E0D\u6B63\u786E";
   const strLen = typeof value === "string" ? value.length : Array.isArray(value) ? value.length : void 0;
@@ -71,12 +74,17 @@ async function validateSingle(rule, value) {
 async function validateField(store, name) {
   const entry = store.fields.get(name);
   if (!entry) return [];
+  const version = (store.validationVersions.get(name) ?? 0) + 1;
+  store.validationVersions.set(name, version);
   const value = store.values[name];
   const errs = [];
   for (const rule of entry.rules) {
     const err = await validateSingle(rule, value);
     if (err) errs.push(err);
   }
+  if (store.validationVersions.get(name) !== version) {
+    return store.errors[name] ?? [];
+  }
   store.errors[name] = errs;
   return errs;
 }
@@ -120,6 +128,7 @@ function buildInstance(store) {
     resetFields: (names) => {
       const keys = names ?? Array.from(store.fields.keys());
       for (const k of keys) {
+        store.validationVersions.set(k, (store.validationVersions.get(k) ?? 0) + 1);
         store.values[k] = store.initial[k];
         store.errors[k] = [];
         store.touched.delete(k);
@@ -223,8 +232,13 @@ var FormRootInner = (props, ref) => {
     }
   ) });
 };
-var FormRoot = React__namespace.forwardRef(FormRootInner);
-FormRoot.displayName = "Form";
+var FormRootBase = React__namespace.forwardRef(FormRootInner);
+FormRootBase.displayName = "Form";
+var FormRoot = chunkNRJXZPZR_cjs.withComponentTheme(
+  FormRootBase,
+  "Form",
+  "form"
+);
 var extractValue = (valuePropName, args) => {
   const first = args[0];
   if (first && typeof first === "object") {
@@ -235,13 +249,29 @@ var extractValue = (valuePropName, args) => {
   }
   return first;
 };
-var FormItem = ({
+function getFormControlName(element) {
+  const type = element.type;
+  if (typeof type === "string") return type;
+  return type.displayName ?? type.name;
+}
+function getEmptyFormControlValue(element, valuePropName) {
+  if (valuePropName === "checked") return false;
+  const controlName = getFormControlName(element);
+  if (controlName === "Cascader") return [];
+  if (controlName === "Select" && element.props?.multiple) return [];
+  if (["InputNumber", "DatePicker", "DateTimePicker", "TimePicker", "Calendar", "Select", "RadioGroup"].includes(controlName ?? "")) {
+    return null;
+  }
+  return "";
+}
+var FormItemBase = React__namespace.forwardRef(({
   name,
   label,
   rules,
   noStyle,
   valuePropName = "value",
   trigger = "onChange",
+  validateTrigger = "onChange",
   initialValue,
   help,
   extra,
@@ -249,17 +279,22 @@ var FormItem = ({
   hidden,
   children,
   className = "",
-  style
-}) => {
+  style,
+  ...rest
+}, ref) => {
   const ctx = React__namespace.useContext(FormCtx);
   const [, tick] = React__namespace.useReducer((n) => n + 1, 0);
+  const generatedId = React__namespace.useId();
+  if (ctx && name && initialValue !== void 0) {
+    const hasFormInitial = Object.prototype.hasOwnProperty.call(ctx.store.initial, name);
+    if (!hasFormInitial) ctx.store.initial[name] = initialValue;
+    if (!Object.prototype.hasOwnProperty.call(ctx.store.values, name)) {
+      ctx.store.values[name] = ctx.store.initial[name];
+    }
+  }
   React__namespace.useEffect(() => {
     if (!ctx || !name) return;
     const store2 = ctx.store;
-    if (initialValue !== void 0) {
-      if (store2.initial[name] === void 0) store2.initial[name] = initialValue;
-      if (store2.values[name] === void 0) store2.values[name] = initialValue;
-    }
     store2.fields.set(name, { rules: rules ?? [], initial: initialValue });
     let subs = store2.fieldSubs.get(name);
     if (!subs) {
@@ -283,7 +318,7 @@ var FormItem = ({
   if (!hasName) {
     const content = children;
     if (noStyle) return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: content });
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `form-item ${className}`, style, children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: `form-item ${className}`, style, ...rest, children: [
       label && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "form-item-label", children: label }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "form-item-control", children: content }),
       help && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "form-item-help", children: help }),
@@ -294,35 +329,94 @@ var FormItem = ({
   const value = store?.values[name];
   const errors = store?.errors[name] ?? [];
   const hasError = errors.length > 0;
-  const bound = React__namespace.isValidElement(children) ? React__namespace.cloneElement(children, {
-    [valuePropName]: value ?? (valuePropName === "checked" ? false : ""),
+  const childElement = React__namespace.isValidElement(children) ? children : null;
+  const controlId = childElement?.props?.id ?? `lumina-field-${generatedId.replace(/:/g, "")}`;
+  const labelId = `${controlId}-label`;
+  const messageId = `${controlId}-${hasError ? "error" : "help"}`;
+  const validationEvents = Array.isArray(validateTrigger) ? validateTrigger : [validateTrigger];
+  const childDescribedBy = childElement?.props?.["aria-describedby"];
+  const childLabelledBy = childElement?.props?.["aria-labelledby"];
+  const childAriaLabel = childElement?.props?.["aria-label"];
+  const describedBy = [childDescribedBy, hasError || help ? messageId : void 0].filter(Boolean).join(" ") || void 0;
+  const runValidation = () => {
+    if (!store) return;
+    void validateField(store, name).then(() => notifyField(store, name));
+  };
+  const callChildHandler = (eventName, args) => {
+    const childHandler = childElement?.props?.[eventName];
+    if (typeof childHandler === "function") childHandler(...args);
+  };
+  const runEventValidation = (eventName, args) => {
+    if (eventName !== "onBlur") {
+      runValidation();
+      return;
+    }
+    const event = args[0];
+    const owner = event?.currentTarget;
+    if (!owner) {
+      runValidation();
+      return;
+    }
+    if (chunkHSDMJUB6_cjs.isTargetWithinOverlayScope(owner, event.relatedTarget)) return;
+    if (event.relatedTarget) {
+      runValidation();
+      return;
+    }
+    const view = owner.ownerDocument.defaultView;
+    if (!view) {
+      runValidation();
+      return;
+    }
+    view.requestAnimationFrame(() => {
+      if (!chunkHSDMJUB6_cjs.isTargetWithinOverlayScope(owner, owner.ownerDocument.activeElement)) {
+        runValidation();
+      }
+    });
+  };
+  const bound = childElement ? React__namespace.cloneElement(childElement, {
+    [valuePropName]: value ?? getEmptyFormControlValue(childElement, valuePropName),
     [trigger]: (...args) => {
       const next = extractValue(valuePropName, args);
       store?.values && (store.values[name] = next);
       store?.touched.add(name);
       if (store) {
-        void validateField(store, name).then(() => notifyField(store, name));
+        if (validationEvents.includes(trigger)) runEventValidation(trigger, args);
         notifyField(store, name);
         notifyAll(store);
         store.onValuesChange?.({ [name]: next }, { ...store.values });
       }
-      const childTrigger = children.props?.[trigger];
-      if (typeof childTrigger === "function") childTrigger(...args);
+      callChildHandler(trigger, args);
     },
-    disabled: children.props?.disabled ?? ctx?.disabled,
-    ...hasError ? { invalid: true } : {}
+    disabled: ctx?.disabled || children.props?.disabled || void 0,
+    id: controlId,
+    "aria-invalid": hasError || childElement.props?.["aria-invalid"] || void 0,
+    "aria-required": isRequired || childElement.props?.["aria-required"] || void 0,
+    "aria-describedby": describedBy,
+    "aria-labelledby": childLabelledBy ?? (!childAriaLabel && label ? labelId : void 0),
+    ...hasError ? { invalid: true } : {},
+    ...Object.fromEntries(
+      validationEvents.filter((eventName) => eventName !== trigger).map((eventName) => [
+        eventName,
+        (...args) => {
+          callChildHandler(eventName, args);
+          runEventValidation(eventName, args);
+        }
+      ])
+    )
   }) : children;
   if (noStyle) return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: bound });
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `form-item ${hasError ? "has-error" : ""} ${className}`, style, children: [
-    label && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "form-item-label", children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: `form-item ${hasError ? "has-error" : ""} ${className}`, style, ...rest, children: [
+    label && /* @__PURE__ */ jsxRuntime.jsxs("label", { id: labelId, className: "form-item-label", htmlFor: controlId, children: [
       isRequired && ctx?.requiredMark !== false && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "form-item-required", "aria-hidden": true, children: "*" }),
       label
     ] }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "form-item-control", children: bound }),
-    hasError ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "form-item-error", children: errors[0] }) : help ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "form-item-help", children: help }) : null,
+    hasError ? /* @__PURE__ */ jsxRuntime.jsx("div", { id: messageId, className: "form-item-error", role: "alert", children: errors[0] }) : help ? /* @__PURE__ */ jsxRuntime.jsx("div", { id: messageId, className: "form-item-help", children: help }) : null,
     extra && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "form-item-extra", children: extra })
   ] });
-};
+});
+FormItemBase.displayName = "FormItem";
+var FormItem = chunkNRJXZPZR_cjs.withComponentTheme(FormItemBase, "FormItem", "form");
 var Form = FormRoot;
 Form.Item = FormItem;
 Form.useForm = useForm;