@fangxinyan/lumina 0.6.18 → 0.8.0

package/dist/chunk-SF7BPXDJ.cjs

@@ -0,0 +1,518 @@
+'use strict';
+
+var chunkGFKWSDD6_cjs = require('./chunk-GFKWSDD6.cjs');
+var chunkFJB3243S_cjs = require('./chunk-FJB3243S.cjs');
+var chunkSTQDKMS5_cjs = require('./chunk-STQDKMS5.cjs');
+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('./Select-TU37MAHZ.css');
+var React = require('react');
+var reactDom = require('react-dom');
+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 isGroup = (it) => Array.isArray(it.options);
+var flatten = (items) => items.flatMap((it) => isGroup(it) ? it.options : [it]);
+var defaultFilter = (input, opt, optionFilterProp) => {
+  const q = input.toLowerCase();
+  const propValue = optionFilterProp ? opt[optionFilterProp] : void 0;
+  const txt = propValue != null ? String(propValue) : opt.text ?? (typeof opt.label === "string" ? opt.label : String(opt.value));
+  return txt.toLowerCase().includes(q);
+};
+var getOptionAriaLabel = (option) => {
+  if (option.ariaLabel) return option.ariaLabel;
+  if (typeof option.label === "string" || typeof option.label === "number") {
+    return void 0;
+  }
+  return option.text ?? String(option.value);
+};
+var SelectInner = (props, forwardedRef) => {
+  const {
+    options,
+    placeholder = "\u8BF7\u9009\u62E9\u2026",
+    disabled,
+    size = "md",
+    invalid,
+    clearable,
+    allowClear,
+    searchable,
+    showSearch,
+    filterOption,
+    optionFilterProp,
+    loading,
+    emptyContent,
+    optionRender,
+    selectedRender,
+    listHeight = 260,
+    popupStyle,
+    getOptionDisabled,
+    open: openProp,
+    defaultOpen,
+    onOpenChange,
+    className = "",
+    menuClassName = "",
+    popupClassName = "",
+    dropdownClassName = "",
+    onKeyDown: onRootKeyDown,
+    onBlur: onRootBlur,
+    tabIndex: triggerTabIndex,
+    id: fieldId,
+    "aria-invalid": ariaInvalid,
+    "aria-describedby": ariaDescribedBy,
+    "aria-labelledby": ariaLabelledBy,
+    "aria-label": ariaLabel,
+    "aria-required": ariaRequired,
+    multiple,
+    value: _value,
+    defaultValue: _defaultValue,
+    onChange: _selectionChange,
+    onClear: _onClear,
+    maxTagCount,
+    maxCount,
+    ...rest
+  } = props;
+  const isMulti = multiple === true;
+  const mergedClearable = clearable ?? !!allowClear;
+  const mergedClearIcon = typeof allowClear === "object" ? allowClear.clearIcon : void 0;
+  const mergedSearchable = searchable ?? !!showSearch;
+  const mergedListHeight = Number.isFinite(listHeight) && listHeight > 0 ? listHeight : 260;
+  const mergedMenuClassName = [menuClassName, popupClassName, dropdownClassName].filter(Boolean).join(" ");
+  const [innerSingle, setInnerSingle] = React__namespace.useState(
+    !isMulti ? props.defaultValue : void 0
+  );
+  const [innerMulti, setInnerMulti] = React__namespace.useState(
+    isMulti && Array.isArray(props.defaultValue) ? props.defaultValue : []
+  );
+  const [innerOpen, setInnerOpen] = React__namespace.useState(defaultOpen ?? false);
+  const [query, setQuery] = React__namespace.useState("");
+  const [activeIdx, setActiveIdx] = React__namespace.useState(-1);
+  const searchRef = React__namespace.useRef(null);
+  const portalContainer = chunkEE5KXDRK_cjs.usePortalContainer();
+  const portalTheme = chunkNRJXZPZR_cjs.useComponentPortalTheme([
+    "Select",
+    "Pagination",
+    "Table",
+    "TablePro"
+  ]);
+  const themedPopupStyle = portalTheme.styles.popup;
+  const hasCustomPopupWidth = [themedPopupStyle, popupStyle].some(
+    (styleValue) => styleValue?.width != null || styleValue?.minWidth != null || styleValue?.maxWidth != null
+  );
+  const resolvedPopupWidth = popupStyle?.width ?? themedPopupStyle?.width;
+  const listboxId = React__namespace.useId();
+  const openControlled = openProp !== void 0;
+  const requestedOpen = openControlled ? openProp : innerOpen;
+  const open = !disabled && requestedOpen;
+  const setOpen = (v) => {
+    if (disabled && v) return;
+    if (!openControlled) setInnerOpen(v);
+    onOpenChange?.(v);
+    if (!v) setQuery("");
+  };
+  React__namespace.useEffect(() => {
+    if (!disabled || openControlled || !innerOpen) return;
+    setInnerOpen(false);
+    onOpenChange?.(false);
+  }, [disabled, innerOpen, onOpenChange, openControlled]);
+  const { triggerRef, floatingRef: menuRef, floatingStyle, zIndex: menuZIndex } = chunkFJB3243S_cjs.useFloating({
+    open,
+    placement: "bottom",
+    matchTriggerWidth: !hasCustomPopupWidth,
+    panelWidth: typeof resolvedPopupWidth === "number" ? resolvedPopupWidth : 360,
+    panelHeight: mergedListHeight + (mergedSearchable ? 58 : 12)
+  });
+  chunkHSDMJUB6_cjs.useOverlayLayer({
+    open: open && portalContainer != null,
+    containerRef: menuRef,
+    ownerRef: triggerRef,
+    zIndex: menuZIndex,
+    onEscape: () => setOpen(false),
+    restoreFocus: true
+  });
+  const setTriggerRef = React__namespace.useCallback(
+    (node) => {
+      triggerRef.current = node;
+      if (typeof forwardedRef === "function") forwardedRef(node);
+      else if (forwardedRef) forwardedRef.current = node;
+    },
+    [forwardedRef, triggerRef]
+  );
+  const singleControlled = !isMulti && props.value !== void 0;
+  const multiControlled = isMulti && props.value !== void 0;
+  const singleValue = singleControlled ? props.value : innerSingle;
+  const controlledMultiValue = props.value;
+  const multiValue = multiControlled ? Array.isArray(controlledMultiValue) ? controlledMultiValue : [] : innerMulti;
+  const selectedValues = React__namespace.useMemo(
+    () => isMulti ? multiValue : singleValue !== void 0 ? [singleValue] : [],
+    [isMulti, multiValue, singleValue]
+  );
+  const selectionLimit = maxCount !== void 0 && Number.isFinite(maxCount) ? Math.max(0, Math.floor(maxCount)) : void 0;
+  const isOptionDisabled = React__namespace.useCallback((option) => {
+    const selected = selectedValues.includes(option.value);
+    return !!option.disabled || !!getOptionDisabled?.(option, selectedValues) || isMulti && !selected && selectionLimit !== void 0 && selectedValues.length >= selectionLimit;
+  }, [getOptionDisabled, isMulti, selectedValues, selectionLimit]);
+  React__namespace.useEffect(() => {
+    if (!open) return;
+    const h = (e) => {
+      const t = e.target;
+      if (triggerRef.current?.contains(t)) return;
+      if (menuRef.current?.contains(t)) return;
+      setOpen(false);
+    };
+    document.addEventListener("mousedown", h);
+    return () => document.removeEventListener("mousedown", h);
+  }, [open]);
+  React__namespace.useEffect(() => {
+    if (open && mergedSearchable) {
+      requestAnimationFrame(() => searchRef.current?.focus());
+    }
+    if (!open) setActiveIdx(-1);
+  }, [open, mergedSearchable]);
+  const allFlat = React__namespace.useMemo(() => flatten(options), [options]);
+  const filteredFlat = React__namespace.useMemo(() => {
+    if (!query.trim()) return allFlat;
+    if (filterOption === false) return allFlat;
+    const f = typeof filterOption === "function" ? filterOption : (input, option) => defaultFilter(input, option, optionFilterProp);
+    return allFlat.filter((o) => f(query, o));
+  }, [allFlat, query, filterOption, optionFilterProp]);
+  const filteredItems = React__namespace.useMemo(() => {
+    if (!query.trim()) return options;
+    return options.map((it) => {
+      if (!isGroup(it)) {
+        return filteredFlat.includes(it) ? it : null;
+      }
+      const kept = it.options.filter((o) => filteredFlat.includes(o));
+      return kept.length ? { label: it.label, options: kept } : null;
+    }).filter((x) => x !== null);
+  }, [options, filteredFlat, query]);
+  React__namespace.useEffect(() => {
+    setActiveIdx((current) => {
+      if (current >= 0 && current < filteredFlat.length && !isOptionDisabled(filteredFlat[current])) {
+        return current;
+      }
+      return filteredFlat.findIndex((option) => !isOptionDisabled(option));
+    });
+  }, [filteredFlat, isOptionDisabled]);
+  const pickSingle = (opt) => {
+    if (disabled || isOptionDisabled(opt)) return;
+    if (!singleControlled) setInnerSingle(opt.value);
+    props.onChange?.(opt.value);
+    setOpen(false);
+  };
+  const toggleMulti = (opt) => {
+    if (disabled || isOptionDisabled(opt)) return;
+    const cur = multiValue ?? [];
+    const next = cur.includes(opt.value) ? cur.filter((v) => v !== opt.value) : [...cur, opt.value];
+    if (!multiControlled) setInnerMulti(next);
+    props.onChange?.(next);
+  };
+  const clearAll = () => {
+    if (disabled) return;
+    if (isMulti) {
+      if (!multiControlled) setInnerMulti([]);
+      props.onChange?.([]);
+      props.onClear?.();
+    } else {
+      if (!singleControlled) setInnerSingle(void 0);
+      props.onChange?.(void 0);
+      props.onClear?.();
+    }
+  };
+  const isSelected = (val) => isMulti ? (multiValue ?? []).includes(val) : singleValue === val;
+  const onKeyDown = (e) => {
+    if ((e.key === "Backspace" || e.key === "Delete") && showClear) {
+      e.preventDefault();
+      clearAll();
+      return;
+    }
+    if (!open) {
+      if (e.key === "Enter" || e.key === " " || e.key === "ArrowDown") {
+        e.preventDefault();
+        setOpen(true);
+      }
+      return;
+    }
+    if (e.key === "Escape") {
+      e.preventDefault();
+      setOpen(false);
+      return;
+    }
+    if (e.key === "ArrowDown") {
+      e.preventDefault();
+      setActiveIdx((i) => {
+        for (let step = 1; step <= filteredFlat.length; step++) {
+          const next = (Math.max(i, -1) + step) % filteredFlat.length;
+          if (filteredFlat[next] && !isOptionDisabled(filteredFlat[next])) return next;
+        }
+        return i;
+      });
+      return;
+    }
+    if (e.key === "ArrowUp") {
+      e.preventDefault();
+      setActiveIdx((i) => {
+        for (let step = 1; step <= filteredFlat.length; step++) {
+          const next = (i - step + filteredFlat.length) % filteredFlat.length;
+          if (filteredFlat[next] && !isOptionDisabled(filteredFlat[next])) return next;
+        }
+        return i;
+      });
+      return;
+    }
+    if (e.key === "Enter") {
+      e.preventDefault();
+      const opt = filteredFlat[activeIdx];
+      if (opt && !isOptionDisabled(opt)) {
+        if (isMulti) toggleMulti(opt);
+        else pickSingle(opt);
+      }
+      return;
+    }
+  };
+  const renderTrigger = () => {
+    if (isMulti) {
+      const selected = (multiValue ?? []).map((v) => allFlat.find((o) => o.value === v)).filter((o) => !!o);
+      const max = maxTagCount;
+      const shown = max != null ? selected.slice(0, max) : selected;
+      const overflow = selected.length - shown.length;
+      if (selected.length === 0) {
+        return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "placeholder", children: placeholder });
+      }
+      return /* @__PURE__ */ jsxRuntime.jsx(chunkNRJXZPZR_cjs.InternalComponentThemePart, { components: "Tag", children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "select-tags", children: [
+        shown.map((o) => /* @__PURE__ */ jsxRuntime.jsx(
+          chunkGFKWSDD6_cjs.Tag,
+          {
+            tone: "accent",
+            removable: !disabled,
+            onRemove: () => {
+              const cur = multiValue ?? [];
+              const next = cur.filter((v) => v !== o.value);
+              if (!multiControlled) setInnerMulti(next);
+              props.onChange?.(next);
+            },
+            onClick: (e) => e.stopPropagation(),
+            children: selectedRender?.(o, { value: o.value, multiple: true }) ?? o.label
+          },
+          String(o.value)
+        )),
+        overflow > 0 && /* @__PURE__ */ jsxRuntime.jsxs(chunkGFKWSDD6_cjs.Tag, { tone: "neutral", children: [
+          "+",
+          overflow
+        ] })
+      ] }) });
+    }
+    const current = allFlat.find((o) => o.value === singleValue);
+    if (!current) return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "placeholder", children: placeholder });
+    if (selectedRender) {
+      return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "select-value select-value-custom", children: selectedRender(current, { value: current.value, multiple: false }) });
+    }
+    return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "select-value", children: [
+      chunk2AUXUZ3Z_cjs.renderIconSlot(current.icon, { size: 14, className: "select-icon" }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "select-value-label", children: current.label })
+    ] });
+  };
+  const hasSelection = isMulti ? multiValue.length > 0 : singleValue != null;
+  const showClear = mergedClearable && hasSelection && !disabled;
+  let renderIdx = -1;
+  const renderOption = (o) => {
+    renderIdx += 1;
+    const idx = renderIdx;
+    const sel = isSelected(o.value);
+    const active = idx === activeIdx;
+    const optionDisabled = isOptionDisabled(o);
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "button",
+      {
+        id: `${listboxId}-option-${idx}`,
+        type: "button",
+        role: "option",
+        "aria-selected": sel,
+        "aria-label": getOptionAriaLabel(o),
+        disabled: optionDisabled,
+        className: `menu-item ${sel ? "active" : ""} ${active ? "highlight" : ""}`,
+        onMouseEnter: () => {
+          if (!optionDisabled) setActiveIdx(idx);
+        },
+        onClick: () => isMulti ? toggleMulti(o) : pickSingle(o),
+        children: [
+          isMulti && /* @__PURE__ */ jsxRuntime.jsx("span", { className: `menu-check ${sel ? "on" : ""}`, "aria-hidden": true, children: sel && /* @__PURE__ */ jsxRuntime.jsx(chunk2AUXUZ3Z_cjs.Icon, { name: "check", size: 11, stroke: 3 }) }),
+          optionRender ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "menu-item-custom", children: optionRender(o, { index: idx, selected: sel, active }) }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            chunk2AUXUZ3Z_cjs.renderIconSlot(o.icon, { size: 14, className: "menu-item-icon" }),
+            /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "menu-item-body", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "menu-item-label", children: o.label }),
+              o.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "menu-item-desc", children: o.description })
+            ] })
+          ] }),
+          !isMulti && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "tick", children: /* @__PURE__ */ jsxRuntime.jsx(chunk2AUXUZ3Z_cjs.Icon, { name: "check", size: 12, stroke: 3 }) })
+        ]
+      },
+      String(o.value)
+    );
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ref: setTriggerRef,
+      ...rest,
+      className: `select ${size} ${isMulti ? "multi" : ""} ${open ? "open" : ""} ${disabled ? "disabled" : ""} ${invalid ? "invalid" : ""} ${className}`,
+      onKeyDown: (e) => {
+        onRootKeyDown?.(e);
+        if (!e.defaultPrevented && e.target.classList.contains("select-trigger")) onKeyDown(e);
+      },
+      onBlur: (event) => {
+        onRootBlur?.(event);
+        if (!open) return;
+        const nextTarget = event.relatedTarget;
+        if (nextTarget) {
+          if (!triggerRef.current?.contains(nextTarget) && !menuRef.current?.contains(nextTarget)) {
+            setOpen(false);
+          }
+          return;
+        }
+        const ownerDocument = event.currentTarget.ownerDocument;
+        window.requestAnimationFrame(() => {
+          const activeElement = ownerDocument.activeElement;
+          if (!triggerRef.current?.contains(activeElement) && !menuRef.current?.contains(activeElement)) {
+            setOpen(false);
+          }
+        });
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: "select-trigger",
+            onClick: () => !disabled && setOpen(!open),
+            tabIndex: disabled ? -1 : triggerTabIndex ?? 0,
+            id: fieldId,
+            role: "combobox",
+            "aria-disabled": disabled || void 0,
+            "aria-label": ariaLabel,
+            "aria-labelledby": ariaLabelledBy,
+            "aria-invalid": ariaInvalid,
+            "aria-required": ariaRequired,
+            "aria-describedby": ariaDescribedBy,
+            "aria-haspopup": "listbox",
+            "aria-expanded": open,
+            "aria-controls": open ? listboxId : void 0,
+            "aria-activedescendant": open && activeIdx >= 0 ? `${listboxId}-option-${activeIdx}` : void 0,
+            children: [
+              renderTrigger(),
+              /* @__PURE__ */ jsxRuntime.jsx(chunk2AUXUZ3Z_cjs.Icon, { name: "chevDown", size: 14, className: "select-caret" })
+            ]
+          }
+        ),
+        showClear && /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            className: "select-clear",
+            "aria-label": "Clear",
+            onPointerDown: (event) => event.stopPropagation(),
+            onMouseDown: (event) => event.stopPropagation(),
+            onClick: (event) => {
+              event.stopPropagation();
+              clearAll();
+            },
+            children: mergedClearIcon ?? /* @__PURE__ */ jsxRuntime.jsx(chunk2AUXUZ3Z_cjs.Icon, { name: "x", size: 12 })
+          }
+        ),
+        open && portalContainer && reactDom.createPortal(
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              ref: menuRef,
+              id: listboxId,
+              className: `menu ${mergedMenuClassName}`,
+              role: "listbox",
+              "aria-multiselectable": isMulti || void 0,
+              ...portalTheme.dataAttributes,
+              style: {
+                ...floatingStyle,
+                ...portalTheme.style,
+                ...portalTheme.styles.popup,
+                ...popupStyle
+              },
+              children: [
+                mergedSearchable && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "menu-search", children: /* @__PURE__ */ jsxRuntime.jsx(chunkNRJXZPZR_cjs.InternalComponentThemePart, { components: "Input", children: /* @__PURE__ */ jsxRuntime.jsx(
+                  chunkSTQDKMS5_cjs.Input,
+                  {
+                    ref: searchRef,
+                    size: "sm",
+                    leadingIcon: "search",
+                    value: query,
+                    placeholder: "\u641C\u7D22...",
+                    role: "combobox",
+                    "aria-autocomplete": "list",
+                    "aria-expanded": open,
+                    "aria-controls": listboxId,
+                    "aria-activedescendant": activeIdx >= 0 ? `${listboxId}-option-${activeIdx}` : void 0,
+                    onValueChange: setQuery,
+                    onKeyDown: (e) => {
+                      if (e.key === "Escape" || e.key === "ArrowDown" || e.key === "ArrowUp" || e.key === "Enter") {
+                        e.preventDefault();
+                        onKeyDown(e);
+                      }
+                    }
+                  }
+                ) }) }),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "div",
+                  {
+                    className: "menu-options",
+                    style: { maxHeight: mergedListHeight },
+                    children: loading ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "menu-state", children: [
+                      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "menu-state-ico", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "spinner" }) }),
+                      /* @__PURE__ */ jsxRuntime.jsx("span", { children: "\u52A0\u8F7D\u4E2D..." })
+                    ] }) : filteredItems.length === 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "menu-state", children: [
+                      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "menu-state-ico", children: /* @__PURE__ */ jsxRuntime.jsx(chunk2AUXUZ3Z_cjs.Icon, { name: "search", size: 16 }) }),
+                      /* @__PURE__ */ jsxRuntime.jsx("span", { children: emptyContent ?? "\u6682\u65E0\u5339\u914D\u9879" })
+                    ] }) : filteredItems.map(
+                      (it, gi) => isGroup(it) ? /* @__PURE__ */ jsxRuntime.jsxs(React__namespace.Fragment, { children: [
+                        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "menu-group-label", children: it.label }),
+                        it.options.map(renderOption)
+                      ] }, `g-${gi}`) : renderOption(it)
+                    )
+                  }
+                )
+              ]
+            }
+          ),
+          portalContainer
+        )
+      ]
+    }
+  );
+};
+var SelectBase = React__namespace.forwardRef(SelectInner);
+SelectBase.displayName = "Select";
+var Select = chunkNRJXZPZR_cjs.withComponentTheme(
+  SelectBase,
+  "Select",
+  ["select", "input", "tag"]
+);
+
+exports.Select = Select;