@pactor-app/ui 1.8.0 → 1.10.0

package/dist/{chunk-7YOIAVV6.js → chunk-M4PHRT2N.js}

@@ -141,7 +141,7 @@ import {
   chartColor,
   navigationMenuTriggerStyle,
   toast
-} from "./chunk-XUIXZJDQ.js";
+} from "./chunk-VT5XP4U4.js";
 import {
   Dialog,
   DialogContent,
@@ -153,7 +153,7 @@ import {
   DrawerContent,
   DrawerHeader,
   DrawerTitle
-} from "./chunk-F42SGQNW.js";
+} from "./chunk-XUHJ5YSG.js";
 import {
   Accordion,
   AccordionContent,
@@ -217,8 +217,24 @@ var variantMap = {
   warning: "warning",
   error: "destructive"
 };
-function Alert2({ message, description, variant = "info", className, style }) {
+var defaultIconMap = {
+  success: "check-circle",
+  info: "info",
+  warning: "warning",
+  error: "x-circle"
+};
+function Alert2({
+  message,
+  description,
+  variant = "info",
+  showIcon,
+  icon,
+  className,
+  style
+}) {
+  const iconName = icon ?? (showIcon === true ? defaultIconMap[variant] : void 0);
   return /* @__PURE__ */ jsxs2(Alert, { variant: variantMap[variant], className, style, children: [
+    iconName ? /* @__PURE__ */ jsx2(Icon, { name: iconName, size: "sm" }) : null,
     message ? /* @__PURE__ */ jsx2(AlertTitle, { children: message }) : null,
     description ? /* @__PURE__ */ jsx2(AlertDescription, { children: description }) : null
   ] });
@@ -2018,6 +2034,7 @@ function HoverCard2({ content, children, className, style }) {
 }
 
 // src/components/components/Input/index.tsx
+import { useI18n as useI18n6 } from "@pactor-app/runtime";
 import { useEffect as useEffect7, useId as useId4 } from "react";
 import { jsx as jsx35, jsxs as jsxs26 } from "react/jsx-runtime";
 function Input2({
@@ -2028,11 +2045,13 @@ function Input2({
   type = "text",
   placeholder,
   disabled,
+  allowClear,
   onChange,
   className,
   style
 }) {
   const form = useFormContext();
+  const { t } = useI18n6();
   const controlId = useId4();
   const inForm = form?.inForm === true && typeof name === "string" && name !== "";
   useEffect7(() => {
@@ -2042,8 +2061,56 @@ function Input2({
     }
     return void 0;
   });
+  const fieldValue = inForm && form && name ? form.values[name] : void 0;
+  const currentValue = typeof fieldValue === "string" ? fieldValue : inForm ? "" : value ?? "";
+  const showClear = allowClear === true && disabled !== true && currentValue !== "";
+  const handleClear = () => {
+    if (inForm && form && name) {
+      form.setValue(name, "");
+    }
+    onChange?.("");
+  };
+  const inFormRoot = inForm === true;
+  const input = /* @__PURE__ */ jsx35(
+    Input,
+    {
+      id: controlId,
+      type,
+      value: currentValue,
+      placeholder,
+      disabled,
+      className: !inFormRoot && allowClear !== true ? className : void 0,
+      style: !inFormRoot && allowClear !== true ? style : void 0,
+      onChange: (event) => {
+        if (inForm && form && name) {
+          form.setValue(name, event.target.value);
+        }
+        onChange?.(event.target.value);
+      }
+    }
+  );
+  const clearButton = showClear ? /* @__PURE__ */ jsx35(
+    "button",
+    {
+      type: "button",
+      "aria-label": t("pactor.input.clear"),
+      className: "shrink-0 cursor-pointer text-muted-foreground hover:text-foreground",
+      onClick: handleClear,
+      children: "\xD7"
+    }
+  ) : null;
+  const control = allowClear === true ? /* @__PURE__ */ jsxs26(
+    "span",
+    {
+      className: cn("flex items-center gap-1", !inFormRoot && className),
+      style: inFormRoot ? void 0 : style,
+      children: [
+        input,
+        clearButton
+      ]
+    }
+  ) : input;
   if (inForm && form && name) {
-    const fieldValue = form.values[name];
     const error = form.errors[name];
     return /* @__PURE__ */ jsxs26(
       "div",
@@ -2060,37 +2127,13 @@ function Input2({
               children: label
             }
           ) : null,
-          /* @__PURE__ */ jsx35(
-            Input,
-            {
-              id: controlId,
-              type,
-              value: typeof fieldValue === "string" ? fieldValue : "",
-              placeholder,
-              disabled,
-              onChange: (event) => {
-                form.setValue(name, event.target.value);
-                onChange?.(event.target.value);
-              }
-            }
-          ),
+          control,
           error ? /* @__PURE__ */ jsx35("div", { "data-slot": "form-error", className: "text-sm text-destructive", children: error }) : null
         ]
       }
     );
   }
-  return /* @__PURE__ */ jsx35(
-    Input,
-    {
-      type,
-      value: value ?? "",
-      placeholder,
-      disabled,
-      className,
-      style,
-      onChange: (event) => onChange?.(event.target.value)
-    }
-  );
+  return control;
 }
 
 // src/components/components/InputGroup/index.tsx
@@ -2470,6 +2513,7 @@ function RadioGroup2({
   label,
   rules,
   options = [],
+  direction = "vertical",
   value,
   disabled,
   onChange,
@@ -2501,10 +2545,14 @@ function RadioGroup2({
       onValueChange: handleChange,
       disabled,
       name: inForm ? name : void 0,
-      className: cn(!inForm && className),
+      className: cn(
+        direction === "horizontal" && "flex flex-wrap items-center gap-x-6 gap-y-2",
+        !inForm && className
+      ),
       style: inForm ? void 0 : style,
       children: options.map((option, index) => {
         const optionId = `${controlId}-${index}`;
+        const optionDisabled = disabled || option.disabled;
         return /* @__PURE__ */ jsxs35("span", { className: "inline-flex items-center gap-2", children: [
           /* @__PURE__ */ jsx50(
             RadioGroupItem,
@@ -2514,7 +2562,17 @@ function RadioGroup2({
               disabled: option.disabled
             }
           ),
-          /* @__PURE__ */ jsx50("label", { htmlFor: optionId, className: "text-sm leading-none font-medium", children: option.label })
+          /* @__PURE__ */ jsx50(
+            "label",
+            {
+              htmlFor: optionId,
+              className: cn(
+                "text-sm leading-none font-medium",
+                optionDisabled ? "cursor-not-allowed opacity-50" : "cursor-pointer"
+              ),
+              children: option.label
+            }
+          )
         ] }, String(option.value));
       })
     }
@@ -2580,7 +2638,7 @@ function ScrollArea2({
 }
 
 // src/components/components/Select/index.tsx
-import { useI18n as useI18n6 } from "@pactor-app/runtime";
+import { useI18n as useI18n7 } from "@pactor-app/runtime";
 import { useEffect as useEffect10, useId as useId6 } from "react";
 import { jsx as jsx53, jsxs as jsxs37 } from "react/jsx-runtime";
 function Select2({
@@ -2597,7 +2655,7 @@ function Select2({
   style
 }) {
   const form = useFormContext();
-  const { t } = useI18n6();
+  const { t } = useI18n7();
   const controlId = useId6();
   const inForm = form?.inForm === true && typeof name === "string" && name !== "";
   useEffect10(() => {
@@ -2972,7 +3030,7 @@ function Switch2({
 }
 
 // src/components/components/Table/index.tsx
-import { useI18n as useI18n7, useRenderer as useRenderer14 } from "@pactor-app/runtime";
+import { useI18n as useI18n8, useRenderer as useRenderer14 } from "@pactor-app/runtime";
 import { useState as useState12 } from "react";
 import { jsx as jsx63, jsxs as jsxs43 } from "react/jsx-runtime";
 function renderCellValue2(value) {
@@ -2995,7 +3053,7 @@ function Table2({
   style
 }) {
   const { renderChildren } = useRenderer14();
-  const { t } = useI18n7();
+  const { t } = useI18n8();
   const [current, setCurrent] = useState12(1);
   const pageSize = pagination === false ? void 0 : pagination?.pageSize;
   const total = dataSource.length;
@@ -3063,7 +3121,7 @@ function Table2({
 // src/components/components/Tabs/index.tsx
 import { useRenderer as useRenderer15 } from "@pactor-app/runtime";
 import { jsx as jsx64, jsxs as jsxs44 } from "react/jsx-runtime";
-function Tabs2({ items = [], activeKey, onChange, className, style }) {
+function Tabs2({ items = [], activeKey, variant, onChange, className, style }) {
   const { renderChildren } = useRenderer15();
   return /* @__PURE__ */ jsxs44(
     Tabs,
@@ -3074,7 +3132,7 @@ function Tabs2({ items = [], activeKey, onChange, className, style }) {
       className,
       style,
       children: [
-        /* @__PURE__ */ jsx64(TabsList, { children: items.map((item) => /* @__PURE__ */ jsx64(TabsTrigger, { value: item.key, children: item.label }, item.key)) }),
+        /* @__PURE__ */ jsx64(TabsList, { variant, children: items.map((item) => /* @__PURE__ */ jsx64(TabsTrigger, { value: item.key, children: item.label }, item.key)) }),
         items.map((item) => /* @__PURE__ */ jsx64(TabsContent, { value: item.key, children: renderChildren(item.children) }, item.key))
       ]
     }

package/dist/{chunk-7KC6DMKH.js → chunk-VRAVO5LE.js}

@@ -11,7 +11,7 @@ import {
   DrawerContent,
   DrawerHeader,
   DrawerTitle
-} from "./chunk-F42SGQNW.js";
+} from "./chunk-XUHJ5YSG.js";
 import {
   Button,
   cn
@@ -201,6 +201,7 @@ function InteractionProvider({
   children
 }) {
   const [confirmState, setConfirmState] = useState(null);
+  const [confirmOpen, setConfirmOpen] = useState(false);
   const [toasts, setToasts] = useState([]);
   const { t } = useI18n();
   const { modal, message } = useMemo(() => {
@@ -214,6 +215,7 @@ function InteractionProvider({
     const modalImpl = {
       confirm(config) {
         setConfirmState({ ...config });
+        setConfirmOpen(true);
       }
     };
     const messageImpl = {
@@ -234,12 +236,12 @@ function InteractionProvider({
   }, [bridge, modal, message]);
   const handleOk = () => {
     const state = confirmState;
-    setConfirmState(null);
+    setConfirmOpen(false);
     state?.onOk?.();
   };
   const handleCancel = () => {
     const state = confirmState;
-    setConfirmState(null);
+    setConfirmOpen(false);
     state?.onCancel?.();
   };
   return /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -249,12 +251,17 @@ function InteractionProvider({
         /* @__PURE__ */ jsx(
           Dialog,
           {
-            open: confirmState !== null,
+            open: confirmOpen,
             onOpenChange: (open) => {
               if (!open) {
                 handleCancel();
               }
             },
+            onOpenChangeComplete: (open) => {
+              if (!open) {
+                setConfirmState(null);
+              }
+            },
             children: /* @__PURE__ */ jsxs(DialogContent, { "data-slot": "confirm-dialog", className: "sm:max-w-sm", children: [
               /* @__PURE__ */ jsxs(DialogHeader, { children: [
                 /* @__PURE__ */ jsx(DialogTitle, { children: confirmState?.title ?? "" }),

package/dist/{chunk-XUIXZJDQ.js → chunk-VT5XP4U4.js}

@@ -2439,6 +2439,7 @@ function Switch({ className, ...props }) {
 
 // src/ui/tabs.tsx
 import { Tabs as TabsPrimitive } from "@base-ui/react/tabs";
+import { cva as cva4 } from "class-variance-authority";
 import { jsx as jsx39 } from "react/jsx-runtime";
 function Tabs({
   className,
@@ -2453,18 +2454,31 @@ function Tabs({
     }
   );
 }
+var tabsListVariants = cva4(
+  "group/tabs-list inline-flex w-fit items-center justify-center text-muted-foreground",
+  {
+    variants: {
+      variant: {
+        default: "h-9 rounded-lg bg-muted p-[3px]",
+        line: "h-auto gap-1 rounded-none border-b border-border bg-transparent p-0"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
 function TabsList({
   className,
+  variant,
   ...props
 }) {
   return /* @__PURE__ */ jsx39(
     TabsPrimitive.List,
     {
       "data-slot": "tabs-list",
-      className: cn(
-        "inline-flex h-9 w-fit items-center justify-center rounded-lg bg-muted p-[3px] text-muted-foreground",
-        className
-      ),
+      "data-variant": variant ?? "default",
+      className: cn(tabsListVariants({ variant }), className),
       ...props
     }
   );
@@ -2478,7 +2492,12 @@ function TabsTrigger({
     {
       "data-slot": "tabs-trigger",
       className: cn(
-        "inline-flex h-[calc(100%-1px)] flex-1 cursor-pointer items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap text-foreground transition-colors focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-active:border-border data-active:bg-card data-active:shadow-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "inline-flex h-[calc(100%-1px)] flex-1 cursor-pointer items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap text-foreground transition-colors focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        // default 变体：激活态胶囊（边框 + 卡片底 + 阴影）
+        "group-data-[variant=default]/tabs-list:data-active:border-border group-data-[variant=default]/tabs-list:data-active:bg-card group-data-[variant=default]/tabs-list:data-active:shadow-sm",
+        // line 变体：下划线指示——弱化未激活文字，激活态底部 2px 主色线
+        //（叠在 List 的底边轨道上），无底色/圆角/阴影
+        "group-data-[variant=line]/tabs-list:-mb-px group-data-[variant=line]/tabs-list:h-9 group-data-[variant=line]/tabs-list:rounded-none group-data-[variant=line]/tabs-list:border-x-0 group-data-[variant=line]/tabs-list:border-t-0 group-data-[variant=line]/tabs-list:border-b-2 group-data-[variant=line]/tabs-list:py-1.5 group-data-[variant=line]/tabs-list:text-muted-foreground group-data-[variant=line]/tabs-list:data-active:border-b-primary group-data-[variant=line]/tabs-list:data-active:text-foreground",
         className
       ),
       ...props
@@ -2501,9 +2520,9 @@ function TabsContent({
 
 // src/ui/toggle.tsx
 import { Toggle as TogglePrimitive } from "@base-ui/react/toggle";
-import { cva as cva4 } from "class-variance-authority";
+import { cva as cva5 } from "class-variance-authority";
 import { jsx as jsx40 } from "react/jsx-runtime";
-var toggleVariants = cva4(
+var toggleVariants = cva5(
   "inline-flex cursor-pointer items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap transition-colors outline-none hover:bg-muted hover:text-muted-foreground focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 data-pressed:bg-accent data-pressed:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
   {
     variants: {
@@ -2599,9 +2618,9 @@ function ToggleGroupItem({
 }
 
 // src/ui/typography.tsx
-import { cva as cva5 } from "class-variance-authority";
+import { cva as cva6 } from "class-variance-authority";
 import { jsx as jsx42 } from "react/jsx-runtime";
-var typographyVariants = cva5("", {
+var typographyVariants = cva6("", {
   variants: {
     variant: {
       h1: "scroll-m-20 text-4xl font-extrabold tracking-tight text-balance",

package/dist/{chunk-F42SGQNW.js → chunk-XUHJ5YSG.js}

@@ -35,7 +35,7 @@ function DialogOverlay({
     {
       "data-slot": "dialog-overlay",
       className: cn(
-        "fixed inset-0 z-50 bg-(--overlay-background) data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0",
+        "fixed inset-0 z-50 bg-(--overlay-background) data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0 data-closed:fill-mode-forwards",
         className
       ),
       ...props
@@ -55,7 +55,7 @@ function DialogContent({
       {
         "data-slot": "dialog-content",
         className: cn(
-          "fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border border-border bg-popover p-6 shadow-lg shadow-(color:--shadow-color) duration-200 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95 sm:max-w-lg",
+          "fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border border-border bg-popover p-6 shadow-lg shadow-(color:--shadow-color) duration-200 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95 data-closed:fill-mode-forwards sm:max-w-lg",
           className
         ),
         ...props,