listpage-next 0.0.243 → 0.0.245

package/dist/api/client/client.js

@@ -59,6 +59,10 @@ function setupClient(HttpClient) {
                     message: error.response.data?.message || error.message,
                     data: error.response.data
                 };
+                notification.error({
+                    message: error.code,
+                    description: error.message
+                });
                 return Promise.reject(apiError);
             }
             const networkError = {

package/dist/ui/StatusTag/index.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from 'react';
+export type StatusTagProps = {
+    color?: string;
+    dotColor?: string;
+    status?: 'success' | 'warning' | 'processing' | 'error' | 'default';
+    children?: ReactNode;
+    loading?: boolean;
+};
+export declare const StatusTag: (props: StatusTagProps) => import("react/jsx-runtime").JSX.Element;

package/dist/ui/StatusTag/index.js

@@ -0,0 +1,57 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Loader2 } from "lucide-react";
+const StatusTag = (props)=>{
+    const { color, children, loading, status } = props;
+    const { dot: dotColor, text: textColor } = getColor(color);
+    return /*#__PURE__*/ jsxs("span", {
+        className: `inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium border ${textColor || getStatusColor(status)}`,
+        children: [
+            /*#__PURE__*/ jsx("span", {
+                className: `w-1.5 h-1.5 rounded-full ${dotColor || getDotColor(status)} mr-1.5 animate-pulse`
+            }),
+            loading && /*#__PURE__*/ jsx(Loader2, {
+                className: "w-3 h-3 mr-1.5 animate-spin"
+            }),
+            children
+        ]
+    });
+};
+const getColor = (color)=>{
+    if (!color) return {
+        dot: null,
+        text: null
+    };
+    return {
+        dot: `bg-${color}-500`,
+        text: `text-${color}-400 bg-${color}-400/10 border-${color}-400/20`
+    };
+};
+const getStatusColor = (status)=>{
+    switch(status){
+        case 'success':
+            return 'text-green-400 bg-green-400/10 border-green-400/20';
+        case 'processing':
+            return 'text-blue-400 bg-blue-400/10 border-blue-400/20';
+        case 'warning':
+            return 'text-yellow-400 bg-yellow-400/10 border-yellow-400/20';
+        case 'error':
+            return 'text-red-400 bg-red-400/10 border-red-400/20';
+        default:
+            return 'text-gray-400 bg-gray-400/10 border-gray-400/20';
+    }
+};
+const getDotColor = (status)=>{
+    switch(status){
+        case 'success':
+            return 'bg-green-500';
+        case 'processing':
+            return 'bg-blue-500';
+        case 'warning':
+            return 'bg-yellow-500';
+        case 'error':
+            return 'bg-red-500';
+        default:
+            return 'bg-gray-500';
+    }
+};
+export { StatusTag };

package/dist/ui/Tabs/index.d.ts

@@ -0,0 +1,13 @@
+import { ReactNode } from 'react';
+export interface TabsProps {
+    defaultActiveTab?: string;
+    activeTab?: string;
+    onTabChange?: (tab: string) => void;
+    tabs: {
+        icon?: ReactNode;
+        label: ReactNode;
+        value: string;
+    }[];
+    extra?: ReactNode;
+}
+export declare const Tabs: (props: TabsProps) => import("react/jsx-runtime").JSX.Element;

package/dist/ui/Tabs/index.js

@@ -0,0 +1,36 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useControllableValue } from "ahooks";
+const Tabs = (props)=>{
+    const { tabs = [], defaultActiveTab, extra } = props;
+    const [activeTab, setActiveTab] = useControllableValue(props, {
+        defaultValue: defaultActiveTab || tabs[0]?.value || '',
+        valuePropName: 'activeTab',
+        trigger: 'onTabChange'
+    });
+    return /*#__PURE__*/ jsxs("div", {
+        className: "h-10 bg-gray-900 border-b border-gray-800 flex items-center px-4 space-x-1 select-none shrink-0",
+        children: [
+            /*#__PURE__*/ jsx("div", {
+                className: "flex items-center space-x-1 shrink-0 grow",
+                children: tabs.map((tab)=>{
+                    const { icon, label, value } = tab;
+                    return /*#__PURE__*/ jsxs("button", {
+                        onClick: ()=>setActiveTab(value),
+                        className: `cursor-pointer flex items-center space-x-2 px-4 py-2 text-xs font-medium border-b-2 transition-colors ${activeTab === value ? 'border-indigo-500 text-white bg-gray-800/50' : 'border-transparent text-gray-500 hover:text-gray-300 hover:bg-gray-800/30'}`,
+                        children: [
+                            icon,
+                            /*#__PURE__*/ jsx("span", {
+                                children: label
+                            })
+                        ]
+                    }, value);
+                })
+            }),
+            /*#__PURE__*/ jsx("div", {
+                className: "flex shrink-0",
+                children: extra
+            })
+        ]
+    });
+};
+export { Tabs };

package/dist/ui/index.d.ts

@@ -1,3 +1,5 @@
 export { PromptEditor, type PromptEditorProps } from './PromptEditor';
 export { Button, type ButtonProps } from './Button';
 export { LogPreview, type LogPreviewProps, type LogEntry } from './LogPreview';
+export { StatusTag, type StatusTagProps } from './StatusTag';
+export { Tabs, type TabsProps } from './Tabs';

package/dist/ui/index.js

@@ -1,4 +1,6 @@
 import { PromptEditor } from "./PromptEditor/index.js";
 import { Button } from "./Button/index.js";
 import { LogPreview } from "./LogPreview/index.js";
-export { Button, LogPreview, PromptEditor };
+import { StatusTag } from "./StatusTag/index.js";
+import { Tabs } from "./Tabs/index.js";
+export { Button, LogPreview, PromptEditor, StatusTag, Tabs };

package/dist/ui.css

@@ -7,20 +7,59 @@
       "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
     --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
       "Courier New", monospace;
+    --color-red-400: oklch(70.4% 0.191 22.216);
     --color-red-500: oklch(63.7% 0.237 25.331);
+    --color-orange-400: oklch(75% 0.183 55.934);
+    --color-orange-500: oklch(70.5% 0.213 47.604);
+    --color-amber-400: oklch(82.8% 0.189 84.429);
+    --color-amber-500: oklch(76.9% 0.188 70.08);
+    --color-yellow-400: oklch(85.2% 0.199 91.936);
     --color-yellow-500: oklch(79.5% 0.184 86.047);
+    --color-lime-400: oklch(84.1% 0.238 128.85);
+    --color-lime-500: oklch(76.8% 0.233 130.85);
+    --color-green-400: oklch(79.2% 0.209 151.711);
     --color-green-500: oklch(72.3% 0.219 149.579);
+    --color-emerald-400: oklch(76.5% 0.177 163.223);
+    --color-emerald-500: oklch(69.6% 0.17 162.48);
+    --color-teal-400: oklch(77.7% 0.152 181.912);
+    --color-teal-500: oklch(70.4% 0.14 182.503);
+    --color-cyan-400: oklch(78.9% 0.154 211.53);
+    --color-cyan-500: oklch(71.5% 0.143 215.221);
+    --color-sky-400: oklch(74.6% 0.16 232.661);
+    --color-sky-500: oklch(68.5% 0.169 237.323);
+    --color-blue-400: oklch(70.7% 0.165 254.624);
     --color-blue-500: oklch(62.3% 0.214 259.815);
     --color-blue-600: oklch(54.6% 0.245 262.881);
     --color-blue-900: oklch(37.9% 0.146 265.522);
+    --color-indigo-400: oklch(67.3% 0.182 276.935);
+    --color-indigo-500: oklch(58.5% 0.233 277.117);
+    --color-violet-400: oklch(70.2% 0.183 293.541);
+    --color-violet-500: oklch(60.6% 0.25 292.717);
+    --color-purple-400: oklch(71.4% 0.203 305.504);
+    --color-purple-500: oklch(62.7% 0.265 303.9);
+    --color-fuchsia-400: oklch(74% 0.238 322.16);
+    --color-fuchsia-500: oklch(66.7% 0.295 322.15);
+    --color-pink-400: oklch(71.8% 0.202 349.761);
+    --color-pink-500: oklch(65.6% 0.241 354.308);
+    --color-rose-400: oklch(71.2% 0.194 13.428);
+    --color-rose-500: oklch(64.5% 0.246 16.439);
     --color-slate-300: oklch(86.9% 0.022 252.894);
+    --color-slate-400: oklch(70.4% 0.04 256.788);
+    --color-slate-500: oklch(55.4% 0.046 257.417);
     --color-gray-300: oklch(87.2% 0.01 258.338);
+    --color-gray-400: oklch(70.7% 0.022 261.325);
     --color-gray-500: oklch(55.1% 0.027 264.364);
     --color-gray-600: oklch(44.6% 0.03 256.802);
     --color-gray-700: oklch(37.3% 0.034 259.733);
     --color-gray-800: oklch(27.8% 0.033 256.848);
     --color-gray-900: oklch(21% 0.034 264.665);
     --color-gray-950: oklch(13% 0.028 261.692);
+    --color-zinc-400: oklch(70.5% 0.015 286.067);
+    --color-zinc-500: oklch(55.2% 0.016 285.938);
+    --color-neutral-400: oklch(70.8% 0 0);
+    --color-neutral-500: oklch(55.6% 0 0);
+    --color-stone-400: oklch(70.9% 0.01 56.259);
+    --color-stone-500: oklch(55.3% 0.013 58.071);
     --color-white: #fff;
     --spacing: 0.25rem;
     --text-xs: 0.75rem;
@@ -31,6 +70,7 @@
     --font-weight-bold: 700;
     --radius-lg: 0.5rem;
     --animate-spin: spin 1s linear infinite;
+    --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
     --default-transition-duration: 150ms;
     --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
     --default-font-family: var(--font-sans);
@@ -213,6 +253,9 @@
       max-width: 96rem;
     }
   }
+  .mr-1\.5 {
+    margin-right: calc(var(--spacing) * 1.5);
+  }
   .mb-1 {
     margin-bottom: calc(var(--spacing) * 1);
   }
@@ -231,9 +274,24 @@
   .table {
     display: table;
   }
+  .h-1\.5 {
+    height: calc(var(--spacing) * 1.5);
+  }
+  .h-3 {
+    height: calc(var(--spacing) * 3);
+  }
+  .h-10 {
+    height: calc(var(--spacing) * 10);
+  }
   .h-full {
     height: 100%;
   }
+  .w-1\.5 {
+    width: calc(var(--spacing) * 1.5);
+  }
+  .w-3 {
+    width: calc(var(--spacing) * 3);
+  }
   .w-12 {
     width: calc(var(--spacing) * 12);
   }
@@ -249,12 +307,18 @@
   .flex-grow {
     flex-grow: 1;
   }
+  .grow {
+    flex-grow: 1;
+  }
   .border-collapse {
     border-collapse: collapse;
   }
   .transform {
     transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
   }
+  .animate-pulse {
+    animation: var(--animate-pulse);
+  }
   .animate-spin {
     animation: var(--animate-spin);
   }
@@ -276,6 +340,20 @@
   .gap-3 {
     gap: calc(var(--spacing) * 3);
   }
+  .space-x-1 {
+    :where(& > :not(:last-child)) {
+      --tw-space-x-reverse: 0;
+      margin-inline-start: calc(calc(var(--spacing) * 1) * var(--tw-space-x-reverse));
+      margin-inline-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-x-reverse)));
+    }
+  }
+  .space-x-2 {
+    :where(& > :not(:last-child)) {
+      --tw-space-x-reverse: 0;
+      margin-inline-start: calc(calc(var(--spacing) * 2) * var(--tw-space-x-reverse));
+      margin-inline-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-x-reverse)));
+    }
+  }
   .overflow-auto {
     overflow: auto;
   }
@@ -288,6 +366,9 @@
   .rounded {
     border-radius: 0.25rem;
   }
+  .rounded-full {
+    border-radius: calc(infinity * 1px);
+  }
   .rounded-lg {
     border-radius: var(--radius-lg);
   }
@@ -295,27 +376,383 @@
     border-style: var(--tw-border-style);
     border-width: 1px;
   }
+  .border-b {
+    border-bottom-style: var(--tw-border-style);
+    border-bottom-width: 1px;
+  }
+  .border-b-2 {
+    border-bottom-style: var(--tw-border-style);
+    border-bottom-width: 2px;
+  }
+  .border-amber-400\/20 {
+    border-color: color-mix(in srgb, oklch(82.8% 0.189 84.429) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-amber-400) 20%, transparent);
+    }
+  }
+  .border-blue-400\/20 {
+    border-color: color-mix(in srgb, oklch(70.7% 0.165 254.624) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-blue-400) 20%, transparent);
+    }
+  }
+  .border-cyan-400\/20 {
+    border-color: color-mix(in srgb, oklch(78.9% 0.154 211.53) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-cyan-400) 20%, transparent);
+    }
+  }
+  .border-emerald-400\/20 {
+    border-color: color-mix(in srgb, oklch(76.5% 0.177 163.223) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-emerald-400) 20%, transparent);
+    }
+  }
+  .border-fuchsia-400\/20 {
+    border-color: color-mix(in srgb, oklch(74% 0.238 322.16) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-fuchsia-400) 20%, transparent);
+    }
+  }
+  .border-gray-400\/20 {
+    border-color: color-mix(in srgb, oklch(70.7% 0.022 261.325) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-gray-400) 20%, transparent);
+    }
+  }
   .border-gray-700 {
     border-color: var(--color-gray-700);
   }
   .border-gray-800 {
     border-color: var(--color-gray-800);
   }
+  .border-green-400\/20 {
+    border-color: color-mix(in srgb, oklch(79.2% 0.209 151.711) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-green-400) 20%, transparent);
+    }
+  }
+  .border-indigo-400\/20 {
+    border-color: color-mix(in srgb, oklch(67.3% 0.182 276.935) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-indigo-400) 20%, transparent);
+    }
+  }
+  .border-indigo-500 {
+    border-color: var(--color-indigo-500);
+  }
+  .border-lime-400\/20 {
+    border-color: color-mix(in srgb, oklch(84.1% 0.238 128.85) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-lime-400) 20%, transparent);
+    }
+  }
+  .border-neutral-400\/20 {
+    border-color: color-mix(in srgb, oklch(70.8% 0 0) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-neutral-400) 20%, transparent);
+    }
+  }
+  .border-orange-400\/20 {
+    border-color: color-mix(in srgb, oklch(75% 0.183 55.934) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-orange-400) 20%, transparent);
+    }
+  }
+  .border-pink-400\/20 {
+    border-color: color-mix(in srgb, oklch(71.8% 0.202 349.761) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-pink-400) 20%, transparent);
+    }
+  }
+  .border-purple-400\/20 {
+    border-color: color-mix(in srgb, oklch(71.4% 0.203 305.504) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-purple-400) 20%, transparent);
+    }
+  }
+  .border-red-400\/20 {
+    border-color: color-mix(in srgb, oklch(70.4% 0.191 22.216) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-red-400) 20%, transparent);
+    }
+  }
+  .border-rose-400\/20 {
+    border-color: color-mix(in srgb, oklch(71.2% 0.194 13.428) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-rose-400) 20%, transparent);
+    }
+  }
+  .border-sky-400\/20 {
+    border-color: color-mix(in srgb, oklch(74.6% 0.16 232.661) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-sky-400) 20%, transparent);
+    }
+  }
+  .border-slate-400\/20 {
+    border-color: color-mix(in srgb, oklch(70.4% 0.04 256.788) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-slate-400) 20%, transparent);
+    }
+  }
+  .border-stone-400\/20 {
+    border-color: color-mix(in srgb, oklch(70.9% 0.01 56.259) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-stone-400) 20%, transparent);
+    }
+  }
+  .border-teal-400\/20 {
+    border-color: color-mix(in srgb, oklch(77.7% 0.152 181.912) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-teal-400) 20%, transparent);
+    }
+  }
+  .border-transparent {
+    border-color: transparent;
+  }
+  .border-violet-400\/20 {
+    border-color: color-mix(in srgb, oklch(70.2% 0.183 293.541) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-violet-400) 20%, transparent);
+    }
+  }
+  .border-yellow-400\/20 {
+    border-color: color-mix(in srgb, oklch(85.2% 0.199 91.936) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-yellow-400) 20%, transparent);
+    }
+  }
+  .border-zinc-400\/20 {
+    border-color: color-mix(in srgb, oklch(70.5% 0.015 286.067) 20%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-zinc-400) 20%, transparent);
+    }
+  }
   .bg-\[\#0B1120\] {
     background-color: #0B1120;
   }
+  .bg-amber-400\/10 {
+    background-color: color-mix(in srgb, oklch(82.8% 0.189 84.429) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-amber-400) 10%, transparent);
+    }
+  }
+  .bg-amber-500 {
+    background-color: var(--color-amber-500);
+  }
+  .bg-blue-400\/10 {
+    background-color: color-mix(in srgb, oklch(70.7% 0.165 254.624) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-blue-400) 10%, transparent);
+    }
+  }
+  .bg-blue-500 {
+    background-color: var(--color-blue-500);
+  }
   .bg-blue-600 {
     background-color: var(--color-blue-600);
   }
+  .bg-cyan-400\/10 {
+    background-color: color-mix(in srgb, oklch(78.9% 0.154 211.53) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-cyan-400) 10%, transparent);
+    }
+  }
+  .bg-cyan-500 {
+    background-color: var(--color-cyan-500);
+  }
+  .bg-emerald-400\/10 {
+    background-color: color-mix(in srgb, oklch(76.5% 0.177 163.223) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-emerald-400) 10%, transparent);
+    }
+  }
+  .bg-emerald-500 {
+    background-color: var(--color-emerald-500);
+  }
+  .bg-fuchsia-400\/10 {
+    background-color: color-mix(in srgb, oklch(74% 0.238 322.16) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-fuchsia-400) 10%, transparent);
+    }
+  }
+  .bg-fuchsia-500 {
+    background-color: var(--color-fuchsia-500);
+  }
+  .bg-gray-400\/10 {
+    background-color: color-mix(in srgb, oklch(70.7% 0.022 261.325) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-gray-400) 10%, transparent);
+    }
+  }
+  .bg-gray-500 {
+    background-color: var(--color-gray-500);
+  }
+  .bg-gray-800\/50 {
+    background-color: color-mix(in srgb, oklch(27.8% 0.033 256.848) 50%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-gray-800) 50%, transparent);
+    }
+  }
+  .bg-gray-900 {
+    background-color: var(--color-gray-900);
+  }
   .bg-gray-950 {
     background-color: var(--color-gray-950);
   }
+  .bg-green-400\/10 {
+    background-color: color-mix(in srgb, oklch(79.2% 0.209 151.711) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-green-400) 10%, transparent);
+    }
+  }
+  .bg-green-500 {
+    background-color: var(--color-green-500);
+  }
+  .bg-indigo-400\/10 {
+    background-color: color-mix(in srgb, oklch(67.3% 0.182 276.935) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-indigo-400) 10%, transparent);
+    }
+  }
+  .bg-indigo-500 {
+    background-color: var(--color-indigo-500);
+  }
+  .bg-lime-400\/10 {
+    background-color: color-mix(in srgb, oklch(84.1% 0.238 128.85) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-lime-400) 10%, transparent);
+    }
+  }
+  .bg-lime-500 {
+    background-color: var(--color-lime-500);
+  }
+  .bg-neutral-400\/10 {
+    background-color: color-mix(in srgb, oklch(70.8% 0 0) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-neutral-400) 10%, transparent);
+    }
+  }
+  .bg-neutral-500 {
+    background-color: var(--color-neutral-500);
+  }
+  .bg-orange-400\/10 {
+    background-color: color-mix(in srgb, oklch(75% 0.183 55.934) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-orange-400) 10%, transparent);
+    }
+  }
+  .bg-orange-500 {
+    background-color: var(--color-orange-500);
+  }
+  .bg-pink-400\/10 {
+    background-color: color-mix(in srgb, oklch(71.8% 0.202 349.761) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-pink-400) 10%, transparent);
+    }
+  }
+  .bg-pink-500 {
+    background-color: var(--color-pink-500);
+  }
+  .bg-purple-400\/10 {
+    background-color: color-mix(in srgb, oklch(71.4% 0.203 305.504) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-purple-400) 10%, transparent);
+    }
+  }
+  .bg-purple-500 {
+    background-color: var(--color-purple-500);
+  }
+  .bg-red-400\/10 {
+    background-color: color-mix(in srgb, oklch(70.4% 0.191 22.216) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-red-400) 10%, transparent);
+    }
+  }
+  .bg-red-500 {
+    background-color: var(--color-red-500);
+  }
+  .bg-rose-400\/10 {
+    background-color: color-mix(in srgb, oklch(71.2% 0.194 13.428) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-rose-400) 10%, transparent);
+    }
+  }
+  .bg-rose-500 {
+    background-color: var(--color-rose-500);
+  }
+  .bg-sky-400\/10 {
+    background-color: color-mix(in srgb, oklch(74.6% 0.16 232.661) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-sky-400) 10%, transparent);
+    }
+  }
+  .bg-sky-500 {
+    background-color: var(--color-sky-500);
+  }
+  .bg-slate-400\/10 {
+    background-color: color-mix(in srgb, oklch(70.4% 0.04 256.788) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-slate-400) 10%, transparent);
+    }
+  }
+  .bg-slate-500 {
+    background-color: var(--color-slate-500);
+  }
+  .bg-stone-400\/10 {
+    background-color: color-mix(in srgb, oklch(70.9% 0.01 56.259) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-stone-400) 10%, transparent);
+    }
+  }
+  .bg-stone-500 {
+    background-color: var(--color-stone-500);
+  }
+  .bg-teal-400\/10 {
+    background-color: color-mix(in srgb, oklch(77.7% 0.152 181.912) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-teal-400) 10%, transparent);
+    }
+  }
+  .bg-teal-500 {
+    background-color: var(--color-teal-500);
+  }
+  .bg-violet-400\/10 {
+    background-color: color-mix(in srgb, oklch(70.2% 0.183 293.541) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-violet-400) 10%, transparent);
+    }
+  }
+  .bg-violet-500 {
+    background-color: var(--color-violet-500);
+  }
+  .bg-yellow-400\/10 {
+    background-color: color-mix(in srgb, oklch(85.2% 0.199 91.936) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-yellow-400) 10%, transparent);
+    }
+  }
+  .bg-yellow-500 {
+    background-color: var(--color-yellow-500);
+  }
+  .bg-zinc-400\/10 {
+    background-color: color-mix(in srgb, oklch(70.5% 0.015 286.067) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-zinc-400) 10%, transparent);
+    }
+  }
+  .bg-zinc-500 {
+    background-color: var(--color-zinc-500);
+  }
   .p-0\.5 {
     padding: calc(var(--spacing) * 0.5);
   }
   .p-4 {
     padding: calc(var(--spacing) * 4);
   }
+  .px-2\.5 {
+    padding-inline: calc(var(--spacing) * 2.5);
+  }
   .px-3 {
     padding-inline: calc(var(--spacing) * 3);
   }
@@ -365,30 +802,99 @@
   .whitespace-pre-wrap {
     white-space: pre-wrap;
   }
+  .text-amber-400 {
+    color: var(--color-amber-400);
+  }
+  .text-blue-400 {
+    color: var(--color-blue-400);
+  }
   .text-blue-500 {
     color: var(--color-blue-500);
   }
+  .text-cyan-400 {
+    color: var(--color-cyan-400);
+  }
+  .text-emerald-400 {
+    color: var(--color-emerald-400);
+  }
+  .text-fuchsia-400 {
+    color: var(--color-fuchsia-400);
+  }
   .text-gray-300 {
     color: var(--color-gray-300);
   }
+  .text-gray-400 {
+    color: var(--color-gray-400);
+  }
+  .text-gray-500 {
+    color: var(--color-gray-500);
+  }
   .text-gray-600 {
     color: var(--color-gray-600);
   }
+  .text-green-400 {
+    color: var(--color-green-400);
+  }
   .text-green-500 {
     color: var(--color-green-500);
   }
+  .text-indigo-400 {
+    color: var(--color-indigo-400);
+  }
+  .text-lime-400 {
+    color: var(--color-lime-400);
+  }
+  .text-neutral-400 {
+    color: var(--color-neutral-400);
+  }
+  .text-orange-400 {
+    color: var(--color-orange-400);
+  }
+  .text-pink-400 {
+    color: var(--color-pink-400);
+  }
+  .text-purple-400 {
+    color: var(--color-purple-400);
+  }
+  .text-red-400 {
+    color: var(--color-red-400);
+  }
   .text-red-500 {
     color: var(--color-red-500);
   }
+  .text-rose-400 {
+    color: var(--color-rose-400);
+  }
+  .text-sky-400 {
+    color: var(--color-sky-400);
+  }
   .text-slate-300 {
     color: var(--color-slate-300);
   }
+  .text-slate-400 {
+    color: var(--color-slate-400);
+  }
+  .text-stone-400 {
+    color: var(--color-stone-400);
+  }
+  .text-teal-400 {
+    color: var(--color-teal-400);
+  }
+  .text-violet-400 {
+    color: var(--color-violet-400);
+  }
   .text-white {
     color: var(--color-white);
   }
+  .text-yellow-400 {
+    color: var(--color-yellow-400);
+  }
   .text-yellow-500 {
     color: var(--color-yellow-500);
   }
+  .text-zinc-400 {
+    color: var(--color-zinc-400);
+  }
   .italic {
     font-style: italic;
   }
@@ -453,6 +959,16 @@
       }
     }
   }
+  .hover\:bg-gray-800\/30 {
+    &:hover {
+      @media (hover: hover) {
+        background-color: color-mix(in srgb, oklch(27.8% 0.033 256.848) 30%, transparent);
+        @supports (color: color-mix(in lab, red, red)) {
+          background-color: color-mix(in oklab, var(--color-gray-800) 30%, transparent);
+        }
+      }
+    }
+  }
   .hover\:bg-gray-900\/50 {
     &:hover {
       @media (hover: hover) {
@@ -463,6 +979,13 @@
       }
     }
   }
+  .hover\:text-gray-300 {
+    &:hover {
+      @media (hover: hover) {
+        color: var(--color-gray-300);
+      }
+    }
+  }
   .hover\:text-white {
     &:hover {
       @media (hover: hover) {
@@ -545,6 +1068,11 @@
   syntax: "*";
   inherits: false;
 }
+@property --tw-space-x-reverse {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0;
+}
 @property --tw-border-style {
   syntax: "*";
   inherits: false;
@@ -686,6 +1214,11 @@
     transform: rotate(360deg);
   }
 }
+@keyframes pulse {
+  50% {
+    opacity: 0.5;
+  }
+}
 @layer properties {
   @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
     *, ::before, ::after, ::backdrop {
@@ -694,6 +1227,7 @@
       --tw-rotate-z: initial;
       --tw-skew-x: initial;
       --tw-skew-y: initial;
+      --tw-space-x-reverse: 0;
       --tw-border-style: solid;
       --tw-font-weight: initial;
       --tw-shadow: 0 0 #0000;

package/dist/utils/prisma/index.d.ts

@@ -0,0 +1,14 @@
+export interface PrismaClientOptions {
+    baseURL: string;
+    headers?: Record<string, string>;
+}
+export declare class PrismaClient {
+    private options;
+    constructor(options: PrismaClientOptions);
+    /**
+     * 创建模型代理 (Model Delegate)
+     * 拦截 db.user.findMany() 中的 .findMany
+     */
+    private createModelDelegate;
+    private request;
+}

package/dist/utils/prisma/index.js

@@ -0,0 +1,44 @@
+class PrismaClient {
+    options;
+    constructor(options){
+        this.options = options;
+        return new Proxy(this, {
+            get: (target, prop)=>{
+                if (prop in target || 'string' != typeof prop || 'then' === prop) return target[prop];
+                return this.createModelDelegate(prop);
+            }
+        });
+    }
+    createModelDelegate(modelName) {
+        return new Proxy({}, {
+            get: (_target, actionName)=>{
+                if ('string' != typeof actionName || 'then' === actionName) return;
+                return async (args)=>this.request(modelName, actionName, args);
+            }
+        });
+    }
+    async request(modelName, actionName, args) {
+        const baseUrl = this.options.baseURL;
+        try {
+            const response = await fetch(baseUrl, {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                    ...this.options.headers
+                },
+                body: JSON.stringify({
+                    model: modelName,
+                    action: actionName,
+                    args: args || {}
+                })
+            });
+            const responseData = await response.json();
+            if (!response.ok) throw new Error(responseData?.error || `Prisma Request Failed: ${response.statusText}`);
+            return void 0 !== responseData.result ? responseData.result : responseData;
+        } catch (error) {
+            console.error(`[PrismaClient] Error executing ${modelName}.${actionName}:`, error);
+            throw error;
+        }
+    }
+}
+export { PrismaClient };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "listpage-next",
-  "version": "0.0.243",
+  "version": "0.0.245",
   "description": "A React component library for creating filter forms with Ant Design",
   "type": "module",
   "main": "./dist/index.js",
@@ -18,6 +18,10 @@
       "types": "./dist/features/*/index.d.ts",
       "import": "./dist/features/*/index.js"
     },
+    "./utils/*": {
+      "types": "./dist/utils/*/index.d.ts",
+      "import": "./dist/utils/*/index.js"
+    },
     "./ui.css": "./dist/ui.css"
   },
   "types": "./dist/index.d.ts",