@baishuyun/ai-design 2.0.37 → 2.1.0-alpha.0

package/src/stories/BsTooltip.stories.tsx

@@ -1,32 +1,32 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
-
-import { BsTooltip } from '../components/tooltip';
-import { TooltipProvider } from '../components/ui/tooltip';
-import { IconBtn } from '../components/icon-btn';
-import { ColorfulEditIcon } from '../components/bs-icons';
-
-const meta: Meta<typeof BsTooltip> = {
-  title: 'Example/Chat/BsTooltip',
-  component: BsTooltip,
-  tags: ['autodocs'],
-  parameters: {
-    layout: 'centered',
-  },
-  decorators: [
-    (Story) => (
-      <TooltipProvider delayDuration={100}>
-        <Story />
-      </TooltipProvider>
-    ),
-  ],
-};
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {
-  args: {
-    children: <IconBtn icon={<ColorfulEditIcon />} />,
-    content: '编辑消息',
-  },
-};
+import type { Meta, StoryObj } from '@storybook/react-vite';
+
+import { BsTooltip } from '../components/tooltip';
+import { TooltipProvider } from '../components/ui/tooltip';
+import { IconBtn } from '../components/icon-btn';
+import { ColorfulEditIcon } from '../components/bs-icons';
+
+const meta: Meta<typeof BsTooltip> = {
+  title: 'Example/Chat/BsTooltip',
+  component: BsTooltip,
+  tags: ['autodocs'],
+  parameters: {
+    layout: 'centered',
+  },
+  decorators: [
+    (Story) => (
+      <TooltipProvider delayDuration={100}>
+        <Story />
+      </TooltipProvider>
+    ),
+  ],
+};
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+  args: {
+    children: <IconBtn icon={<ColorfulEditIcon />} />,
+    content: '编辑消息',
+  },
+};

package/src/stories/Card.stories.tsx

@@ -1,28 +1,28 @@
-import type { Meta, StoryObj } from "@storybook/react-vite";
-
-import { Card } from "../components/card";
-import { UserIcon } from "../components/bs-icons";
-
-const meta = {
-  title: "Example/Chat/Card",
-  component: Card,
-  // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/writing-docs/autodocs
-  tags: ["autodocs"],
-  parameters: {
-    // More on how to position stories at: https://storybook.js.org/docs/configure/story-layout
-    layout: "centered",
-  },
-  args: {},
-} satisfies Meta<typeof Card>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-export const Base: Story = {
-  args: {
-    title: "供应商管理，子表单为产品信息",
-    index: 1,
-    desc: "用于记录和管理企业供应商的基本信息、资质认证、合作状态等，便于采购部门进行供应商评估和选择。",
-    icon: <UserIcon />,
-  },
-};
+import type { Meta, StoryObj } from "@storybook/react-vite";
+
+import { Card } from "../components/card";
+import { UserIcon } from "../components/bs-icons";
+
+const meta = {
+  title: "Example/Chat/Card",
+  component: Card,
+  // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/writing-docs/autodocs
+  tags: ["autodocs"],
+  parameters: {
+    // More on how to position stories at: https://storybook.js.org/docs/configure/story-layout
+    layout: "centered",
+  },
+  args: {},
+} satisfies Meta<typeof Card>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Base: Story = {
+  args: {
+    title: "供应商管理，子表单为产品信息",
+    index: 1,
+    desc: "用于记录和管理企业供应商的基本信息、资质认证、合作状态等，便于采购部门进行供应商评估和选择。",
+    icon: <UserIcon />,
+  },
+};

package/src/stories/CardField.stories.tsx

@@ -1,87 +1,87 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
-
-import { CardField } from '../components/card-field';
-
-const meta: Meta<typeof CardField> = {
-  title: 'Example/Chat/CardField',
-  component: CardField,
-  tags: ['autodocs'],
-  parameters: {
-    layout: 'centered',
-  },
-  args: {},
-  decorators: [
-    (Story) => (
-      <div className="w-[400px]">
-        <Story />
-      </div>
-    ),
-  ],
-};
-
-export default meta;
-type Story = StoryObj<typeof CardField>;
-
-// 基础用法
-export const Base: Story = {
-  args: {
-    label: '维度（行）',
-    children: '仓库、产品名称、产品编码、日期（年-月）',
-  },
-};
-
-// label 过长省略展示
-export const LongLabel: Story = {
-  args: {
-    label: '这是一个非常长的标签文字需要省略展示',
-    children: '内容区域',
-  },
-};
-
-// 无 children 时显示「无」
-export const NoChildren: Story = {
-  args: {
-    label: '空字段',
-  },
-};
-
-// children 为空字符串
-export const EmptyChildren: Story = {
-  args: {
-    label: '字段名称',
-    children: '',
-  },
-};
-
-// children 内容较长换行展示
-export const LongContent: Story = {
-  args: {
-    label: '详细描述',
-    children:
-      '这是一段很长的内容，用于测试换行效果。内容区域支持自动换行，确保文字不会溢出容器，保持良好的阅读体验。',
-  },
-};
-
-// 多个 CardField 组合使用
-export const MultipleFields: Story = {
-  args: {
-    label: '维度（行）',
-    children: '仓库、产品名称、产品编码、日期（年-月）',
-  },
-  render: () => (
-    <div className="flex flex-col gap-2">
-      <CardField label="维度（行）">仓库、产品名称、产品编码、日期（年-月）</CardField>
-      <CardField label="维度（列）">产品类别</CardField>
-      <CardField label="指标">销售额、销售量、库存量</CardField>
-      <CardField label="筛选条件" />
-    </div>
-  ),
-};
-
-// children 为自定义 ReactNode
-export const CustomChildren: Story = {
-  args: {
-    label: '状态',
-    children: <span className="text-green-500 font-medium">已完成</span>,
-  },
-};
+import type { Meta, StoryObj } from '@storybook/react-vite';
+
+import { CardField } from '../components/card-field';
+
+const meta: Meta<typeof CardField> = {
+  title: 'Example/Chat/CardField',
+  component: CardField,
+  tags: ['autodocs'],
+  parameters: {
+    layout: 'centered',
+  },
+  args: {},
+  decorators: [
+    (Story) => (
+      <div className="w-[400px]">
+        <Story />
+      </div>
+    ),
+  ],
+};
+
+export default meta;
+type Story = StoryObj<typeof CardField>;
+
+// 基础用法
+export const Base: Story = {
+  args: {
+    label: '维度（行）',
+    children: '仓库、产品名称、产品编码、日期（年-月）',
+  },
+};
+
+// label 过长省略展示
+export const LongLabel: Story = {
+  args: {
+    label: '这是一个非常长的标签文字需要省略展示',
+    children: '内容区域',
+  },
+};
+
+// 无 children 时显示「无」
+export const NoChildren: Story = {
+  args: {
+    label: '空字段',
+  },
+};
+
+// children 为空字符串
+export const EmptyChildren: Story = {
+  args: {
+    label: '字段名称',
+    children: '',
+  },
+};
+
+// children 内容较长换行展示
+export const LongContent: Story = {
+  args: {
+    label: '详细描述',
+    children:
+      '这是一段很长的内容，用于测试换行效果。内容区域支持自动换行，确保文字不会溢出容器，保持良好的阅读体验。',
+  },
+};
+
+// 多个 CardField 组合使用
+export const MultipleFields: Story = {
+  args: {
+    label: '维度（行）',
+    children: '仓库、产品名称、产品编码、日期（年-月）',
+  },
+  render: () => (
+    <div className="flex flex-col gap-2">
+      <CardField label="维度（行）">仓库、产品名称、产品编码、日期（年-月）</CardField>
+      <CardField label="维度（列）">产品类别</CardField>
+      <CardField label="指标">销售额、销售量、库存量</CardField>
+      <CardField label="筛选条件" />
+    </div>
+  ),
+};
+
+// children 为自定义 ReactNode
+export const CustomChildren: Story = {
+  args: {
+    label: '状态',
+    children: <span className="text-green-500 font-medium">已完成</span>,
+  },
+};

package/src/stories/ChatAreaHeader.stories.ts

@@ -1,26 +1,26 @@
-import type { Meta, StoryObj } from "@storybook/react-vite";
-
-// import { Header } from "./Header";
-import { ChatAreaHeader } from "../components/chat-area-header";
-
-const meta = {
-  title: "Example/Chat/ChatAreaHeader",
-  component: ChatAreaHeader,
-  // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/writing-docs/autodocs
-  tags: ["autodocs"],
-  parameters: {
-    // More on how to position stories at: https://storybook.js.org/docs/configure/story-layout
-    layout: "centered",
-  },
-  args: {},
-} satisfies Meta<typeof ChatAreaHeader>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-export const Base: Story = {
-  args: {
-    title: "TEST",
-    width: 0,
-  },
-};
+import type { Meta, StoryObj } from "@storybook/react-vite";
+
+// import { Header } from "./Header";
+import { ChatAreaHeader } from "../components/chat-area-header";
+
+const meta = {
+  title: "Example/Chat/ChatAreaHeader",
+  component: ChatAreaHeader,
+  // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/writing-docs/autodocs
+  tags: ["autodocs"],
+  parameters: {
+    // More on how to position stories at: https://storybook.js.org/docs/configure/story-layout
+    layout: "centered",
+  },
+  args: {},
+} satisfies Meta<typeof ChatAreaHeader>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Base: Story = {
+  args: {
+    title: "TEST",
+    width: 0,
+  },
+};

package/src/stories/CheckCard.stories.tsx

@@ -1,114 +1,114 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
-import { useState } from 'react';
-
-import { CheckCard } from '../components/check-card';
-
-const meta = {
-  title: 'AI Office/CheckCard',
-  component: CheckCard,
-  tags: ['autodocs'],
-  parameters: { layout: 'centered' },
-  args: {},
-} satisfies Meta<typeof CheckCard>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {
-  args: {
-    title: '表单提交数据',
-  },
-};
-
-export const WithDescription: Story = {
-  args: {
-    title: '表单提交数据',
-    description: '提交表单中的所有数据到服务器',
-  },
-};
-
-export const Checked: Story = {
-  args: {
-    title: '表单提交数据',
-    description: '提交表单中的所有数据到服务器',
-    defaultChecked: true,
-  },
-};
-
-export const Disabled: Story = {
-  args: {
-    title: '表单提交数据',
-    description: '提交表单中的所有数据到服务器',
-    disabled: true,
-  },
-};
-
-export const DisabledChecked: Story = {
-  args: {
-    title: '表单提交数据',
-    description: '提交表单中的所有数据到服务器',
-    disabled: true,
-    defaultChecked: true,
-  },
-};
-
-const ControlledComponent = () => {
-  const [checked, setChecked] = useState(false);
-  return (
-    <div style={{ display: 'flex', flexDirection: 'column', gap: 12, alignItems: 'center' }}>
-      <CheckCard
-        title="表单提交数据"
-        description="提交表单中的所有数据到服务器"
-        checked={checked}
-        onCheckedChange={(v) => setChecked(!!v)}
-      />
-      <button onClick={() => setChecked(!checked)}>
-        Toggle from outside (current: {checked ? 'checked' : 'unchecked'})
-      </button>
-    </div>
-  );
-};
-
-export const Controlled: Story = {
-  args: {} as any,
-  render: () => <ControlledComponent />,
-};
-
-const MultipleOptionsComponent = () => {
-  const [selected, setSelected] = useState<string[]>(['dialog']);
-  const toggle = (key: string) => {
-    setSelected((prev) =>
-      prev.includes(key) ? prev.filter((k) => k !== key) : [...prev, key]
-    );
-  };
-  return (
-    <div style={{ display: 'flex', gap: 8 }}>
-      <CheckCard
-        className="shrink-0 grow w-[30%]"
-        title="支持对话框模式"
-        description="应用将以对话框形式弹出"
-        checked={selected.includes('dialog')}
-        onCheckedChange={() => toggle('dialog')}
-      />
-      <CheckCard
-        className="shrink-0 grow w-[30%]"
-        title="支持侧边栏模式"
-        description="应用将以侧边栏形式展示"
-        checked={selected.includes('sidebar')}
-        onCheckedChange={() => toggle('sidebar')}
-      />
-      <CheckCard
-        className="shrink-0 grow w-[30%]"
-        title="支持全屏模式"
-        description="应用将全屏展示"
-        checked={selected.includes('fullscreen')}
-        onCheckedChange={() => toggle('fullscreen')}
-      />
-    </div>
-  );
-};
-
-export const MultipleOptions: Story = {
-  args: {} as any,
-  render: () => <MultipleOptionsComponent />,
-};
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { useState } from 'react';
+
+import { CheckCard } from '../components/check-card';
+
+const meta = {
+  title: 'AI Office/CheckCard',
+  component: CheckCard,
+  tags: ['autodocs'],
+  parameters: { layout: 'centered' },
+  args: {},
+} satisfies Meta<typeof CheckCard>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+  args: {
+    title: '表单提交数据',
+  },
+};
+
+export const WithDescription: Story = {
+  args: {
+    title: '表单提交数据',
+    description: '提交表单中的所有数据到服务器',
+  },
+};
+
+export const Checked: Story = {
+  args: {
+    title: '表单提交数据',
+    description: '提交表单中的所有数据到服务器',
+    defaultChecked: true,
+  },
+};
+
+export const Disabled: Story = {
+  args: {
+    title: '表单提交数据',
+    description: '提交表单中的所有数据到服务器',
+    disabled: true,
+  },
+};
+
+export const DisabledChecked: Story = {
+  args: {
+    title: '表单提交数据',
+    description: '提交表单中的所有数据到服务器',
+    disabled: true,
+    defaultChecked: true,
+  },
+};
+
+const ControlledComponent = () => {
+  const [checked, setChecked] = useState(false);
+  return (
+    <div style={{ display: 'flex', flexDirection: 'column', gap: 12, alignItems: 'center' }}>
+      <CheckCard
+        title="表单提交数据"
+        description="提交表单中的所有数据到服务器"
+        checked={checked}
+        onCheckedChange={(v) => setChecked(!!v)}
+      />
+      <button onClick={() => setChecked(!checked)}>
+        Toggle from outside (current: {checked ? 'checked' : 'unchecked'})
+      </button>
+    </div>
+  );
+};
+
+export const Controlled: Story = {
+  args: {} as any,
+  render: () => <ControlledComponent />,
+};
+
+const MultipleOptionsComponent = () => {
+  const [selected, setSelected] = useState<string[]>(['dialog']);
+  const toggle = (key: string) => {
+    setSelected((prev) =>
+      prev.includes(key) ? prev.filter((k) => k !== key) : [...prev, key]
+    );
+  };
+  return (
+    <div style={{ display: 'flex', gap: 8 }}>
+      <CheckCard
+        className="shrink-0 grow w-[30%]"
+        title="支持对话框模式"
+        description="应用将以对话框形式弹出"
+        checked={selected.includes('dialog')}
+        onCheckedChange={() => toggle('dialog')}
+      />
+      <CheckCard
+        className="shrink-0 grow w-[30%]"
+        title="支持侧边栏模式"
+        description="应用将以侧边栏形式展示"
+        checked={selected.includes('sidebar')}
+        onCheckedChange={() => toggle('sidebar')}
+      />
+      <CheckCard
+        className="shrink-0 grow w-[30%]"
+        title="支持全屏模式"
+        description="应用将全屏展示"
+        checked={selected.includes('fullscreen')}
+        onCheckedChange={() => toggle('fullscreen')}
+      />
+    </div>
+  );
+};
+
+export const MultipleOptions: Story = {
+  args: {} as any,
+  render: () => <MultipleOptionsComponent />,
+};