@pactor-app/ui 1.7.0 → 1.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2,7 +2,7 @@ import {
2
2
  Icon,
3
3
  Menu,
4
4
  Sidebar
5
- } from "./chunk-ZM3WJZZ7.js";
5
+ } from "./chunk-PECP7DJB.js";
6
6
  import {
7
7
  Alert,
8
8
  AlertDescription,
@@ -141,7 +141,7 @@ import {
141
141
  chartColor,
142
142
  navigationMenuTriggerStyle,
143
143
  toast
144
- } from "./chunk-E2TD6JD2.js";
144
+ } from "./chunk-VT5XP4U4.js";
145
145
  import {
146
146
  Dialog,
147
147
  DialogContent,
@@ -176,7 +176,7 @@ import {
176
176
  Tooltip,
177
177
  TooltipContent,
178
178
  TooltipTrigger
179
- } from "./chunk-L4Z7MNYY.js";
179
+ } from "./chunk-VM4FESQB.js";
180
180
  import {
181
181
  Button,
182
182
  cn
@@ -217,8 +217,24 @@ var variantMap = {
217
217
  warning: "warning",
218
218
  error: "destructive"
219
219
  };
220
- function Alert2({ message, description, variant = "info", className, style }) {
220
+ var defaultIconMap = {
221
+ success: "check-circle",
222
+ info: "info",
223
+ warning: "warning",
224
+ error: "x-circle"
225
+ };
226
+ function Alert2({
227
+ message,
228
+ description,
229
+ variant = "info",
230
+ showIcon,
231
+ icon,
232
+ className,
233
+ style
234
+ }) {
235
+ const iconName = icon ?? (showIcon === true ? defaultIconMap[variant] : void 0);
221
236
  return /* @__PURE__ */ jsxs2(Alert, { variant: variantMap[variant], className, style, children: [
237
+ iconName ? /* @__PURE__ */ jsx2(Icon, { name: iconName, size: "sm" }) : null,
222
238
  message ? /* @__PURE__ */ jsx2(AlertTitle, { children: message }) : null,
223
239
  description ? /* @__PURE__ */ jsx2(AlertDescription, { children: description }) : null
224
240
  ] });
@@ -467,10 +483,11 @@ function Calendar2({
467
483
 
468
484
  // src/components/components/Card/index.tsx
469
485
  import { jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
470
- function Card2({ title, bordered = true, className, style, children }) {
486
+ function Card2({ title, bordered = true, rounded, className, style, children }) {
471
487
  return /* @__PURE__ */ jsxs8(
472
488
  Card,
473
489
  {
490
+ rounded,
474
491
  className: cn("gap-4 py-4", !bordered && "border-transparent shadow-none", className),
475
492
  style,
476
493
  children: [
@@ -2017,6 +2034,7 @@ function HoverCard2({ content, children, className, style }) {
2017
2034
  }
2018
2035
 
2019
2036
  // src/components/components/Input/index.tsx
2037
+ import { useI18n as useI18n6 } from "@pactor-app/runtime";
2020
2038
  import { useEffect as useEffect7, useId as useId4 } from "react";
2021
2039
  import { jsx as jsx35, jsxs as jsxs26 } from "react/jsx-runtime";
2022
2040
  function Input2({
@@ -2027,11 +2045,13 @@ function Input2({
2027
2045
  type = "text",
2028
2046
  placeholder,
2029
2047
  disabled,
2048
+ allowClear,
2030
2049
  onChange,
2031
2050
  className,
2032
2051
  style
2033
2052
  }) {
2034
2053
  const form = useFormContext();
2054
+ const { t } = useI18n6();
2035
2055
  const controlId = useId4();
2036
2056
  const inForm = form?.inForm === true && typeof name === "string" && name !== "";
2037
2057
  useEffect7(() => {
@@ -2041,8 +2061,56 @@ function Input2({
2041
2061
  }
2042
2062
  return void 0;
2043
2063
  });
2064
+ const fieldValue = inForm && form && name ? form.values[name] : void 0;
2065
+ const currentValue = typeof fieldValue === "string" ? fieldValue : inForm ? "" : value ?? "";
2066
+ const showClear = allowClear === true && disabled !== true && currentValue !== "";
2067
+ const handleClear = () => {
2068
+ if (inForm && form && name) {
2069
+ form.setValue(name, "");
2070
+ }
2071
+ onChange?.("");
2072
+ };
2073
+ const inFormRoot = inForm === true;
2074
+ const input = /* @__PURE__ */ jsx35(
2075
+ Input,
2076
+ {
2077
+ id: controlId,
2078
+ type,
2079
+ value: currentValue,
2080
+ placeholder,
2081
+ disabled,
2082
+ className: !inFormRoot && allowClear !== true ? className : void 0,
2083
+ style: !inFormRoot && allowClear !== true ? style : void 0,
2084
+ onChange: (event) => {
2085
+ if (inForm && form && name) {
2086
+ form.setValue(name, event.target.value);
2087
+ }
2088
+ onChange?.(event.target.value);
2089
+ }
2090
+ }
2091
+ );
2092
+ const clearButton = showClear ? /* @__PURE__ */ jsx35(
2093
+ "button",
2094
+ {
2095
+ type: "button",
2096
+ "aria-label": t("pactor.input.clear"),
2097
+ className: "shrink-0 cursor-pointer text-muted-foreground hover:text-foreground",
2098
+ onClick: handleClear,
2099
+ children: "\xD7"
2100
+ }
2101
+ ) : null;
2102
+ const control = allowClear === true ? /* @__PURE__ */ jsxs26(
2103
+ "span",
2104
+ {
2105
+ className: cn("flex items-center gap-1", !inFormRoot && className),
2106
+ style: inFormRoot ? void 0 : style,
2107
+ children: [
2108
+ input,
2109
+ clearButton
2110
+ ]
2111
+ }
2112
+ ) : input;
2044
2113
  if (inForm && form && name) {
2045
- const fieldValue = form.values[name];
2046
2114
  const error = form.errors[name];
2047
2115
  return /* @__PURE__ */ jsxs26(
2048
2116
  "div",
@@ -2059,37 +2127,13 @@ function Input2({
2059
2127
  children: label
2060
2128
  }
2061
2129
  ) : null,
2062
- /* @__PURE__ */ jsx35(
2063
- Input,
2064
- {
2065
- id: controlId,
2066
- type,
2067
- value: typeof fieldValue === "string" ? fieldValue : "",
2068
- placeholder,
2069
- disabled,
2070
- onChange: (event) => {
2071
- form.setValue(name, event.target.value);
2072
- onChange?.(event.target.value);
2073
- }
2074
- }
2075
- ),
2130
+ control,
2076
2131
  error ? /* @__PURE__ */ jsx35("div", { "data-slot": "form-error", className: "text-sm text-destructive", children: error }) : null
2077
2132
  ]
2078
2133
  }
2079
2134
  );
2080
2135
  }
2081
- return /* @__PURE__ */ jsx35(
2082
- Input,
2083
- {
2084
- type,
2085
- value: value ?? "",
2086
- placeholder,
2087
- disabled,
2088
- className,
2089
- style,
2090
- onChange: (event) => onChange?.(event.target.value)
2091
- }
2092
- );
2136
+ return control;
2093
2137
  }
2094
2138
 
2095
2139
  // src/components/components/InputGroup/index.tsx
@@ -2579,7 +2623,7 @@ function ScrollArea2({
2579
2623
  }
2580
2624
 
2581
2625
  // src/components/components/Select/index.tsx
2582
- import { useI18n as useI18n6 } from "@pactor-app/runtime";
2626
+ import { useI18n as useI18n7 } from "@pactor-app/runtime";
2583
2627
  import { useEffect as useEffect10, useId as useId6 } from "react";
2584
2628
  import { jsx as jsx53, jsxs as jsxs37 } from "react/jsx-runtime";
2585
2629
  function Select2({
@@ -2596,7 +2640,7 @@ function Select2({
2596
2640
  style
2597
2641
  }) {
2598
2642
  const form = useFormContext();
2599
- const { t } = useI18n6();
2643
+ const { t } = useI18n7();
2600
2644
  const controlId = useId6();
2601
2645
  const inForm = form?.inForm === true && typeof name === "string" && name !== "";
2602
2646
  useEffect10(() => {
@@ -2971,7 +3015,7 @@ function Switch2({
2971
3015
  }
2972
3016
 
2973
3017
  // src/components/components/Table/index.tsx
2974
- import { useI18n as useI18n7, useRenderer as useRenderer14 } from "@pactor-app/runtime";
3018
+ import { useI18n as useI18n8, useRenderer as useRenderer14 } from "@pactor-app/runtime";
2975
3019
  import { useState as useState12 } from "react";
2976
3020
  import { jsx as jsx63, jsxs as jsxs43 } from "react/jsx-runtime";
2977
3021
  function renderCellValue2(value) {
@@ -2994,7 +3038,7 @@ function Table2({
2994
3038
  style
2995
3039
  }) {
2996
3040
  const { renderChildren } = useRenderer14();
2997
- const { t } = useI18n7();
3041
+ const { t } = useI18n8();
2998
3042
  const [current, setCurrent] = useState12(1);
2999
3043
  const pageSize = pagination === false ? void 0 : pagination?.pageSize;
3000
3044
  const total = dataSource.length;
@@ -3062,7 +3106,7 @@ function Table2({
3062
3106
  // src/components/components/Tabs/index.tsx
3063
3107
  import { useRenderer as useRenderer15 } from "@pactor-app/runtime";
3064
3108
  import { jsx as jsx64, jsxs as jsxs44 } from "react/jsx-runtime";
3065
- function Tabs2({ items = [], activeKey, onChange, className, style }) {
3109
+ function Tabs2({ items = [], activeKey, variant, onChange, className, style }) {
3066
3110
  const { renderChildren } = useRenderer15();
3067
3111
  return /* @__PURE__ */ jsxs44(
3068
3112
  Tabs,
@@ -3073,7 +3117,7 @@ function Tabs2({ items = [], activeKey, onChange, className, style }) {
3073
3117
  className,
3074
3118
  style,
3075
3119
  children: [
3076
- /* @__PURE__ */ jsx64(TabsList, { children: items.map((item) => /* @__PURE__ */ jsx64(TabsTrigger, { value: item.key, children: item.label }, item.key)) }),
3120
+ /* @__PURE__ */ jsx64(TabsList, { variant, children: items.map((item) => /* @__PURE__ */ jsx64(TabsTrigger, { value: item.key, children: item.label }, item.key)) }),
3077
3121
  items.map((item) => /* @__PURE__ */ jsx64(TabsContent, { value: item.key, children: renderChildren(item.children) }, item.key))
3078
3122
  ]
3079
3123
  }
@@ -16,7 +16,7 @@ import {
16
16
  TooltipTrigger,
17
17
  useIsMobile,
18
18
  useSidebar
19
- } from "./chunk-L4Z7MNYY.js";
19
+ } from "./chunk-VM4FESQB.js";
20
20
  import {
21
21
  cn
22
22
  } from "./chunk-WKJUCGV4.js";
@@ -201,6 +201,7 @@ function InteractionProvider({
201
201
  children
202
202
  }) {
203
203
  const [confirmState, setConfirmState] = useState(null);
204
+ const [confirmOpen, setConfirmOpen] = useState(false);
204
205
  const [toasts, setToasts] = useState([]);
205
206
  const { t } = useI18n();
206
207
  const { modal, message } = useMemo(() => {
@@ -214,6 +215,7 @@ function InteractionProvider({
214
215
  const modalImpl = {
215
216
  confirm(config) {
216
217
  setConfirmState({ ...config });
218
+ setConfirmOpen(true);
217
219
  }
218
220
  };
219
221
  const messageImpl = {
@@ -234,12 +236,12 @@ function InteractionProvider({
234
236
  }, [bridge, modal, message]);
235
237
  const handleOk = () => {
236
238
  const state = confirmState;
237
- setConfirmState(null);
239
+ setConfirmOpen(false);
238
240
  state?.onOk?.();
239
241
  };
240
242
  const handleCancel = () => {
241
243
  const state = confirmState;
242
- setConfirmState(null);
244
+ setConfirmOpen(false);
243
245
  state?.onCancel?.();
244
246
  };
245
247
  return /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -249,12 +251,17 @@ function InteractionProvider({
249
251
  /* @__PURE__ */ jsx(
250
252
  Dialog,
251
253
  {
252
- open: confirmState !== null,
254
+ open: confirmOpen,
253
255
  onOpenChange: (open) => {
254
256
  if (!open) {
255
257
  handleCancel();
256
258
  }
257
259
  },
260
+ onOpenChangeComplete: (open) => {
261
+ if (!open) {
262
+ setConfirmState(null);
263
+ }
264
+ },
258
265
  children: /* @__PURE__ */ jsxs(DialogContent, { "data-slot": "confirm-dialog", className: "sm:max-w-sm", children: [
259
266
  /* @__PURE__ */ jsxs(DialogHeader, { children: [
260
267
  /* @__PURE__ */ jsx(DialogTitle, { children: confirmState?.title ?? "" }),
@@ -2,7 +2,7 @@ import {
2
2
  Icon,
3
3
  Menu,
4
4
  Sidebar
5
- } from "./chunk-ZM3WJZZ7.js";
5
+ } from "./chunk-PECP7DJB.js";
6
6
  import {
7
7
  Accordion,
8
8
  AccordionContent,
@@ -15,7 +15,7 @@ import {
15
15
  Popover,
16
16
  PopoverContent,
17
17
  PopoverTrigger
18
- } from "./chunk-L4Z7MNYY.js";
18
+ } from "./chunk-VM4FESQB.js";
19
19
  import {
20
20
  cn
21
21
  } from "./chunk-WKJUCGV4.js";
@@ -84,13 +84,27 @@ function AccordionContent({
84
84
 
85
85
  // src/ui/card.tsx
86
86
  import { jsx as jsx2 } from "react/jsx-runtime";
87
- function Card({ className, ...props }) {
87
+ var cardRoundedClasses = {
88
+ none: "rounded-none",
89
+ sm: "rounded-sm",
90
+ md: "rounded-md",
91
+ lg: "rounded-lg",
92
+ xl: "rounded-xl",
93
+ "2xl": "rounded-2xl",
94
+ "3xl": "rounded-3xl"
95
+ };
96
+ function Card({
97
+ className,
98
+ rounded = "lg",
99
+ ...props
100
+ }) {
88
101
  return /* @__PURE__ */ jsx2(
89
102
  "div",
90
103
  {
91
104
  "data-slot": "card",
92
105
  className: cn(
93
- "flex flex-col gap-6 rounded-xl border border-border bg-card py-6 text-card-foreground shadow-(--card-shadow)",
106
+ "flex flex-col gap-6 border border-border bg-card py-6 text-card-foreground shadow-(--card-shadow)",
107
+ cardRoundedClasses[rounded],
94
108
  className
95
109
  ),
96
110
  ...props
@@ -2,7 +2,7 @@ import {
2
2
  Popover,
3
3
  PopoverContent,
4
4
  PopoverTrigger
5
- } from "./chunk-L4Z7MNYY.js";
5
+ } from "./chunk-VM4FESQB.js";
6
6
  import {
7
7
  Button,
8
8
  buttonVariants,
@@ -2439,6 +2439,7 @@ function Switch({ className, ...props }) {
2439
2439
 
2440
2440
  // src/ui/tabs.tsx
2441
2441
  import { Tabs as TabsPrimitive } from "@base-ui/react/tabs";
2442
+ import { cva as cva4 } from "class-variance-authority";
2442
2443
  import { jsx as jsx39 } from "react/jsx-runtime";
2443
2444
  function Tabs({
2444
2445
  className,
@@ -2453,18 +2454,31 @@ function Tabs({
2453
2454
  }
2454
2455
  );
2455
2456
  }
2457
+ var tabsListVariants = cva4(
2458
+ "group/tabs-list inline-flex w-fit items-center justify-center text-muted-foreground",
2459
+ {
2460
+ variants: {
2461
+ variant: {
2462
+ default: "h-9 rounded-lg bg-muted p-[3px]",
2463
+ line: "h-auto gap-1 rounded-none border-b border-border bg-transparent p-0"
2464
+ }
2465
+ },
2466
+ defaultVariants: {
2467
+ variant: "default"
2468
+ }
2469
+ }
2470
+ );
2456
2471
  function TabsList({
2457
2472
  className,
2473
+ variant,
2458
2474
  ...props
2459
2475
  }) {
2460
2476
  return /* @__PURE__ */ jsx39(
2461
2477
  TabsPrimitive.List,
2462
2478
  {
2463
2479
  "data-slot": "tabs-list",
2464
- className: cn(
2465
- "inline-flex h-9 w-fit items-center justify-center rounded-lg bg-muted p-[3px] text-muted-foreground",
2466
- className
2467
- ),
2480
+ "data-variant": variant ?? "default",
2481
+ className: cn(tabsListVariants({ variant }), className),
2468
2482
  ...props
2469
2483
  }
2470
2484
  );
@@ -2478,7 +2492,12 @@ function TabsTrigger({
2478
2492
  {
2479
2493
  "data-slot": "tabs-trigger",
2480
2494
  className: cn(
2481
- "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",
2495
+ "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",
2496
+ // default 变体:激活态胶囊(边框 + 卡片底 + 阴影)
2497
+ "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",
2498
+ // line 变体:下划线指示——弱化未激活文字,激活态底部 2px 主色线
2499
+ //(叠在 List 的底边轨道上),无底色/圆角/阴影
2500
+ "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",
2482
2501
  className
2483
2502
  ),
2484
2503
  ...props
@@ -2501,9 +2520,9 @@ function TabsContent({
2501
2520
 
2502
2521
  // src/ui/toggle.tsx
2503
2522
  import { Toggle as TogglePrimitive } from "@base-ui/react/toggle";
2504
- import { cva as cva4 } from "class-variance-authority";
2523
+ import { cva as cva5 } from "class-variance-authority";
2505
2524
  import { jsx as jsx40 } from "react/jsx-runtime";
2506
- var toggleVariants = cva4(
2525
+ var toggleVariants = cva5(
2507
2526
  "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",
2508
2527
  {
2509
2528
  variants: {
@@ -2599,9 +2618,9 @@ function ToggleGroupItem({
2599
2618
  }
2600
2619
 
2601
2620
  // src/ui/typography.tsx
2602
- import { cva as cva5 } from "class-variance-authority";
2621
+ import { cva as cva6 } from "class-variance-authority";
2603
2622
  import { jsx as jsx42 } from "react/jsx-runtime";
2604
- var typographyVariants = cva5("", {
2623
+ var typographyVariants = cva6("", {
2605
2624
  variants: {
2606
2625
  variant: {
2607
2626
  h1: "scroll-m-20 text-4xl font-extrabold tracking-tight text-balance",