@fangxinyan/lumina 0.6.1 → 0.6.3

package/dist/chunk-UKS23N3L.js

@@ -0,0 +1,191 @@
+import { Textarea } from './chunk-HLFH5HWR.js';
+import { Icon, isIconName, renderIconSlot } from './chunk-47VG2P34.js';
+import './tokens-BIIUTPKN.css';
+import './shared-NJHRNLRH.css';
+import './Input-HUBJ55OH.css';
+import * as React from 'react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+var InputBase = React.forwardRef(
+  ({
+    value,
+    defaultValue,
+    onChange,
+    onValueChange,
+    placeholder,
+    leadingIcon,
+    trailingIcon,
+    onLeadingIconClick,
+    onTrailingIconClick,
+    size = "md",
+    invalid,
+    disabled,
+    allowClear,
+    maxLength,
+    showCount,
+    prefix,
+    suffix,
+    className = "",
+    ...rest
+  }, ref) => {
+    const [inner, setInner] = React.useState(defaultValue ?? "");
+    const inputRef = React.useRef(null);
+    const isControlled = value !== void 0;
+    const currentValue = isControlled ? value : inner;
+    const setInputRef = React.useCallback(
+      (node) => {
+        inputRef.current = node;
+        if (typeof ref === "function") ref(node);
+        else if (ref) ref.current = node;
+      },
+      [ref]
+    );
+    const wrapCls = [
+      "input-wrap",
+      size !== "md" && size,
+      invalid && "invalid",
+      disabled && "disabled",
+      className
+    ].filter(Boolean).join(" ");
+    const handleIconClick = (handler) => handler ? (e) => {
+      e.stopPropagation();
+      if (!disabled) handler(e);
+    } : void 0;
+    const renderAffixIcon = (icon, side, handler) => {
+      if (icon == null || icon === false) return null;
+      const className2 = `${side}${handler ? " interactive" : ""}`;
+      if (isIconName(icon)) {
+        return /* @__PURE__ */ jsx(
+          Icon,
+          {
+            name: icon,
+            size: 14,
+            className: className2,
+            onClick: handleIconClick(handler)
+          }
+        );
+      }
+      return /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: className2,
+          onClick: handler ? (e) => {
+            e.stopPropagation();
+            if (!disabled) handler(e);
+          } : void 0,
+          children: renderIconSlot(icon)
+        }
+      );
+    };
+    const handleChange = (e) => {
+      if (!isControlled) setInner(e.target.value);
+      onChange?.(e);
+      onValueChange?.(e.target.value, e);
+    };
+    const handleClear = (e) => {
+      e.stopPropagation();
+      if (disabled) return;
+      if (!isControlled) setInner("");
+      if (inputRef.current) inputRef.current.value = "";
+      const synthetic = {
+        ...e,
+        target: inputRef.current ?? { value: "" },
+        currentTarget: inputRef.current ?? { value: "" }
+      };
+      onChange?.(synthetic);
+      onValueChange?.("", synthetic);
+    };
+    const showClear = !!allowClear && !!currentValue && !disabled;
+    const count = currentValue ? currentValue.length : 0;
+    const inputElement = /* @__PURE__ */ jsxs("div", { className: wrapCls, children: [
+      renderAffixIcon(leadingIcon, "lead", onLeadingIconClick),
+      prefix && /* @__PURE__ */ jsx("span", { className: "input-affix prefix", children: prefix }),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          ref: setInputRef,
+          className: "input",
+          value: isControlled ? value : void 0,
+          defaultValue: isControlled ? void 0 : defaultValue,
+          onChange: handleChange,
+          placeholder,
+          disabled,
+          maxLength,
+          ...rest
+        }
+      ),
+      suffix && /* @__PURE__ */ jsx("span", { className: "input-affix suffix", children: suffix }),
+      showClear && /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: "input-clear",
+          role: "button",
+          "aria-label": "Clear",
+          tabIndex: -1,
+          onMouseDown: (e) => e.preventDefault(),
+          onClick: handleClear,
+          children: /* @__PURE__ */ jsx(Icon, { name: "x", size: 12 })
+        }
+      ),
+      renderAffixIcon(trailingIcon, "trail", onTrailingIconClick)
+    ] });
+    if (!showCount) return inputElement;
+    return /* @__PURE__ */ jsxs("div", { className: "input-shell", children: [
+      inputElement,
+      /* @__PURE__ */ jsx("div", { className: "input-count", children: maxLength != null ? `${count} / ${maxLength}` : `${count}` })
+    ] });
+  }
+);
+InputBase.displayName = "Input";
+var InputPassword = React.forwardRef(
+  ({
+    visibilityToggle = true,
+    iconRender,
+    suffix,
+    onValueChange,
+    ...rest
+  }, ref) => {
+    const [visible, setVisible] = React.useState(false);
+    const renderedIcon = iconRender?.(visible);
+    const useCustomToggle = visibilityToggle !== false && !!renderedIcon;
+    const useDefaultToggle = visibilityToggle !== false && !renderedIcon;
+    const toggle = (e) => {
+      e.preventDefault();
+      e.stopPropagation();
+      setVisible((v) => !v);
+    };
+    const toggleNode = useCustomToggle ? /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "input-password-toggle",
+        tabIndex: -1,
+        onMouseDown: (e) => e.preventDefault(),
+        onClick: toggle,
+        "aria-label": visible ? "Hide password" : "Show password",
+        children: renderedIcon
+      }
+    ) : null;
+    return /* @__PURE__ */ jsx(
+      InputBase,
+      {
+        ref,
+        ...rest,
+        type: visible ? "text" : "password",
+        suffix: toggleNode ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          suffix,
+          toggleNode
+        ] }) : suffix,
+        trailingIcon: useDefaultToggle ? visible ? "eyeOff" : "eye" : void 0,
+        onTrailingIconClick: useDefaultToggle ? () => setVisible((v) => !v) : void 0,
+        onValueChange
+      }
+    );
+  }
+);
+InputPassword.displayName = "Input.Password";
+var Input = InputBase;
+Input.Password = InputPassword;
+Input.TextArea = Textarea;
+
+export { Input, InputPassword };

package/dist/chunk-USQ43DJ5.js

@@ -0,0 +1,147 @@
+import './tokens-BIIUTPKN.css';
+import './shared-NJHRNLRH.css';
+import './Radio-GVFDPAZM.css';
+import * as React from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/components/Radio/Radio.tsx
+var RadioRoot = React.forwardRef(({
+  checked,
+  defaultChecked,
+  onChange,
+  disabled,
+  label,
+  className = "",
+  id,
+  ...rest
+}, ref) => {
+  const [inner, setInner] = React.useState(defaultChecked ?? false);
+  const isControlled = checked !== void 0;
+  const value = isControlled ? checked : inner;
+  const pick = () => {
+    if (disabled) return;
+    if (!isControlled) setInner(true);
+    onChange?.(true);
+  };
+  return /* @__PURE__ */ jsxs(
+    "label",
+    {
+      ref,
+      className: `radio ${value ? "checked" : ""} ${disabled ? "disabled" : ""} ${className}`,
+      onClick: pick,
+      ...rest,
+      children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            role: "radio",
+            "aria-checked": value,
+            disabled,
+            onClick: (event) => {
+              event.stopPropagation();
+              pick();
+            },
+            id,
+            className: "radio-dot"
+          }
+        ),
+        label && /* @__PURE__ */ jsx("span", { className: "radio-label", children: label })
+      ]
+    }
+  );
+});
+RadioRoot.displayName = "Radio";
+var RadioGroupInner = ({
+  options,
+  value,
+  defaultValue,
+  onChange,
+  direction,
+  variant = "default",
+  size = "md",
+  className = "",
+  ...rest
+}, ref) => {
+  const [inner, setInner] = React.useState(defaultValue);
+  const groupRef = React.useRef(null);
+  const [thumb, setThumb] = React.useState({ left: 0, width: 0, ready: false });
+  const isControlled = value !== void 0;
+  const current = isControlled ? value : inner;
+  const setGroupRef = React.useCallback(
+    (node) => {
+      groupRef.current = node;
+      if (typeof ref === "function") ref(node);
+      else if (ref) ref.current = node;
+    },
+    [ref]
+  );
+  const pick = (v) => {
+    if (!isControlled) setInner(v);
+    onChange?.(v);
+  };
+  const resolvedDirection = direction ?? (variant === "segmented" ? "horizontal" : "vertical");
+  React.useLayoutEffect(() => {
+    if (variant !== "segmented") return;
+    const group = groupRef.current;
+    if (!group) return;
+    const updateThumb = () => {
+      const active = group.querySelector(".radio.checked");
+      if (!active) {
+        setThumb((prev) => prev.ready ? { left: prev.left, width: prev.width, ready: false } : prev);
+        return;
+      }
+      const next = {
+        left: active.offsetLeft,
+        width: active.offsetWidth,
+        ready: true
+      };
+      setThumb(
+        (prev) => prev.left === next.left && prev.width === next.width && prev.ready === next.ready ? prev : next
+      );
+    };
+    updateThumb();
+    const frame = requestAnimationFrame(updateThumb);
+    const observer = typeof ResizeObserver !== "undefined" ? new ResizeObserver(updateThumb) : null;
+    if (observer) {
+      observer.observe(group);
+      group.querySelectorAll(".radio").forEach((item) => observer.observe(item));
+    }
+    window.addEventListener("resize", updateThumb);
+    return () => {
+      cancelAnimationFrame(frame);
+      observer?.disconnect();
+      window.removeEventListener("resize", updateThumb);
+    };
+  }, [current, options, size, variant]);
+  return /* @__PURE__ */ jsxs("div", { ref: setGroupRef, className: `radio-group ${resolvedDirection} ${variant} ${size} ${className}`, ...rest, children: [
+    variant === "segmented" && /* @__PURE__ */ jsx(
+      "span",
+      {
+        "aria-hidden": true,
+        className: "radio-segment-thumb",
+        style: {
+          width: thumb.width,
+          transform: `translateX(${thumb.left}px)`,
+          opacity: thumb.ready ? 1 : 0
+        }
+      }
+    ),
+    options.map((opt) => /* @__PURE__ */ jsx(
+      RadioRoot,
+      {
+        label: opt.label,
+        checked: current === opt.value,
+        disabled: opt.disabled,
+        onChange: () => pick(opt.value)
+      },
+      String(opt.value)
+    ))
+  ] });
+};
+var RadioGroup = React.forwardRef(RadioGroupInner);
+RadioGroup.displayName = "RadioGroup";
+var Radio = RadioRoot;
+Radio.Group = RadioGroup;
+
+export { Radio, RadioGroup };

package/dist/{chunk-G2K6ETP4.cjs → chunk-UUHFKIWP.cjs}

@@ -28,6 +28,11 @@ function _interopNamespace(e) {
 
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
+var normalizePlacement = (placement) => {
+  const base = placement.startsWith("top") ? "top" : placement.startsWith("bottom") ? "bottom" : placement.startsWith("left") ? "left" : placement.startsWith("right") ? "right" : placement;
+  const alignCross = placement.endsWith("Left") || placement.endsWith("Top") ? "start" : placement.endsWith("Right") || placement.endsWith("Bottom") ? "end" : "center";
+  return { placement: base, alignCross };
+};
 var Popover = React__namespace.forwardRef(({
   content,
   title,
@@ -38,18 +43,24 @@ var Popover = React__namespace.forwardRef(({
   width,
   defaultOpen = false,
   open,
+  visible,
   onOpenChange,
+  onVisibleChange,
   children,
   className = "",
+  overlayClassName = "",
+  popupClassName = "",
   onClick,
   onMouseEnter,
   onMouseLeave,
   ...rest
 }, ref) => {
   const [inner, setInner] = React__namespace.useState(defaultOpen);
-  const isControlled = open !== void 0;
-  const show = isControlled ? open : inner;
+  const controlledOpen = open ?? visible;
+  const isControlled = controlledOpen !== void 0;
+  const show = isControlled ? controlledOpen : inner;
   const panelWidth = width === "auto" ? 160 : width ?? 240;
+  const normalized = normalizePlacement(placement);
   const {
     triggerRef,
     floatingRef,
@@ -57,15 +68,16 @@ var Popover = React__namespace.forwardRef(({
     placement: resolved
   } = chunkYB3IWIOJ_cjs.useFloating({
     open: show,
-    placement,
+    placement: normalized.placement,
     panelWidth,
     panelHeight: 160,
-    alignCross: "center"
+    alignCross: normalized.alignCross
   });
   const set = React__namespace.useCallback((v) => {
     if (!isControlled) setInner(v);
     onOpenChange?.(v);
-  }, [isControlled, onOpenChange]);
+    onVisibleChange?.(v);
+  }, [isControlled, onOpenChange, onVisibleChange]);
   const setTriggerRef = React__namespace.useCallback(
     (node) => {
       triggerRef.current = node;
@@ -130,7 +142,7 @@ var Popover = React__namespace.forwardRef(({
         "div",
         {
           ref: floatingRef,
-          className: `popover popover-${resolved}`,
+          className: `popover popover-${resolved} ${overlayClassName} ${popupClassName}`,
           style: { ...floatingStyle, ...widthStyle },
           ...panelHover,
           children: [