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

package/src/stories/BorderAnimation.stories.tsx

@@ -1,116 +1,116 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
-
-import { BorderAnimation } from '../components/border-animation';
-
-const meta = {
-  title: 'Example/Animation/BorderAnimation',
-  component: BorderAnimation,
-  tags: ['autodocs'],
-  parameters: {
-    layout: 'centered',
-  },
-  args: {},
-} satisfies Meta<typeof BorderAnimation>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {
-  args: {
-    children: (
-      <div className="flex items-center gap-[6px] bg-white px-[10px] py-[4px] rounded-[4px]">
-        <span className="text-[#999] text-[14px]">
-          数据生成中，可点击下方按钮暂停
-        </span>
-      </div>
-    ),
-  },
-};
-
-export const WithCustomContent: Story = {
-  args: {
-    children: (
-      <div className="bg-white px-4 py-3 rounded-[4px]">
-        <h3 className="text-[16px] font-medium text-[#333]">标题内容</h3>
-        <p className="text-[14px] text-[#666] mt-1">
-          这是一段描述文字，展示边框动画效果。
-        </p>
-      </div>
-    ),
-  },
-};
-
-export const LargerRadius: Story = {
-  args: {
-    borderRadius: 12,
-    children: (
-      <div className="bg-white px-4 py-3 rounded-[12px]">
-        <p className="text-[14px] text-[#666]">圆角 12px 的边框动画</p>
-      </div>
-    ),
-  },
-};
-
-export const SlowAnimation: Story = {
-  args: {
-    duration: 5,
-    children: (
-      <div className="bg-white px-4 py-3 rounded-[4px]">
-        <p className="text-[14px] text-[#666]">慢速动画（5秒一圈）</p>
-      </div>
-    ),
-  },
-};
-
-export const FastAnimation: Story = {
-  args: {
-    duration: 1,
-    children: (
-      <div className="bg-white px-4 py-3 rounded-[4px]">
-        <p className="text-[14px] text-[#666]">快速动画（1秒一圈）</p>
-      </div>
-    ),
-  },
-};
-
-export const CustomGradient: Story = {
-  args: {
-    gradient:
-      'linear-gradient(180deg, #FF84B4 0%, #FF0265 50%, #FFB1FA 100%)',
-    children: (
-      <div className="bg-white px-4 py-3 rounded-[4px]">
-        <p className="text-[14px] text-[#666]">自定义渐变色（粉色系）</p>
-      </div>
-    ),
-  },
-};
-
-export const CustomClassName: Story = {
-  args: {
-    className: 'w-[300px]',
-    children: (
-      <div className="bg-white px-4 py-3 rounded-[4px]">
-        <p className="text-[14px] text-[#666]">自定义宽度 300px</p>
-      </div>
-    ),
-  },
-};
-
-export const FullWidth: Story = {
-  decorators: [
-    (Story) => (
-      <div style={{ width: '500px' }}>
-        <Story />
-      </div>
-    ),
-  ],
-  args: {
-    children: (
-      <div className="bg-white px-4 py-3 rounded-[4px]">
-        <p className="text-[14px] text-[#666]">
-          宽度 100%，自动填满父容器
-        </p>
-      </div>
-    ),
-  },
-};
+import type { Meta, StoryObj } from '@storybook/react-vite';
+
+import { BorderAnimation } from '../components/border-animation';
+
+const meta = {
+  title: 'Example/Animation/BorderAnimation',
+  component: BorderAnimation,
+  tags: ['autodocs'],
+  parameters: {
+    layout: 'centered',
+  },
+  args: {},
+} satisfies Meta<typeof BorderAnimation>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+  args: {
+    children: (
+      <div className="flex items-center gap-[6px] bg-white px-[10px] py-[4px] rounded-[4px]">
+        <span className="text-[#999] text-[14px]">
+          数据生成中，可点击下方按钮暂停
+        </span>
+      </div>
+    ),
+  },
+};
+
+export const WithCustomContent: Story = {
+  args: {
+    children: (
+      <div className="bg-white px-4 py-3 rounded-[4px]">
+        <h3 className="text-[16px] font-medium text-[#333]">标题内容</h3>
+        <p className="text-[14px] text-[#666] mt-1">
+          这是一段描述文字，展示边框动画效果。
+        </p>
+      </div>
+    ),
+  },
+};
+
+export const LargerRadius: Story = {
+  args: {
+    borderRadius: 12,
+    children: (
+      <div className="bg-white px-4 py-3 rounded-[12px]">
+        <p className="text-[14px] text-[#666]">圆角 12px 的边框动画</p>
+      </div>
+    ),
+  },
+};
+
+export const SlowAnimation: Story = {
+  args: {
+    duration: 5,
+    children: (
+      <div className="bg-white px-4 py-3 rounded-[4px]">
+        <p className="text-[14px] text-[#666]">慢速动画（5秒一圈）</p>
+      </div>
+    ),
+  },
+};
+
+export const FastAnimation: Story = {
+  args: {
+    duration: 1,
+    children: (
+      <div className="bg-white px-4 py-3 rounded-[4px]">
+        <p className="text-[14px] text-[#666]">快速动画（1秒一圈）</p>
+      </div>
+    ),
+  },
+};
+
+export const CustomGradient: Story = {
+  args: {
+    gradient:
+      'linear-gradient(180deg, #FF84B4 0%, #FF0265 50%, #FFB1FA 100%)',
+    children: (
+      <div className="bg-white px-4 py-3 rounded-[4px]">
+        <p className="text-[14px] text-[#666]">自定义渐变色（粉色系）</p>
+      </div>
+    ),
+  },
+};
+
+export const CustomClassName: Story = {
+  args: {
+    className: 'w-[300px]',
+    children: (
+      <div className="bg-white px-4 py-3 rounded-[4px]">
+        <p className="text-[14px] text-[#666]">自定义宽度 300px</p>
+      </div>
+    ),
+  },
+};
+
+export const FullWidth: Story = {
+  decorators: [
+    (Story) => (
+      <div style={{ width: '500px' }}>
+        <Story />
+      </div>
+    ),
+  ],
+  args: {
+    children: (
+      <div className="bg-white px-4 py-3 rounded-[4px]">
+        <p className="text-[14px] text-[#666]">
+          宽度 100%，自动填满父容器
+        </p>
+      </div>
+    ),
+  },
+};

package/src/stories/BorderColorAnimation.stories.tsx

@@ -1,63 +1,63 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
-
-import { BorderColorAnimation } from '../components/border-color-animation';
-
-const meta = {
-  title: 'Example/Animation/BorderColorAnimation',
-  component: BorderColorAnimation,
-  tags: ['autodocs'],
-  parameters: {
-    layout: 'centered',
-  },
-  args: {},
-} satisfies Meta<typeof BorderColorAnimation>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {
-  args: {
-    width: '600px',
-    height: '400px',
-  },
-};
-
-export const WithContent: Story = {
-  args: {
-    width: '600px',
-    height: '400px',
-  },
-  render: (args) => (
-    <BorderColorAnimation {...args}>
-      <div
-        style={{
-          display: 'flex',
-          alignItems: 'center',
-          flexDirection: 'column',
-          justifyContent: 'center',
-          height: '100%',
-          color: '#333',
-        }}
-      >
-        <div style={{ textAlign: 'center' }}>
-          <h2 style={{ margin: '0 0 12px 0' }}>Animated Border</h2>
-          <p style={{ margin: 0 }}>Content inside the animated border frame</p>
-        </div>
-      </div>
-    </BorderColorAnimation>
-  ),
-};
-
-export const SmallSize: Story = {
-  args: {
-    width: '300px',
-    height: '200px',
-  },
-};
-
-export const SquareSize: Story = {
-  args: {
-    width: '400px',
-    height: '400px',
-  },
-};
+import type { Meta, StoryObj } from '@storybook/react-vite';
+
+import { BorderColorAnimation } from '../components/border-color-animation';
+
+const meta = {
+  title: 'Example/Animation/BorderColorAnimation',
+  component: BorderColorAnimation,
+  tags: ['autodocs'],
+  parameters: {
+    layout: 'centered',
+  },
+  args: {},
+} satisfies Meta<typeof BorderColorAnimation>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+  args: {
+    width: '600px',
+    height: '400px',
+  },
+};
+
+export const WithContent: Story = {
+  args: {
+    width: '600px',
+    height: '400px',
+  },
+  render: (args) => (
+    <BorderColorAnimation {...args}>
+      <div
+        style={{
+          display: 'flex',
+          alignItems: 'center',
+          flexDirection: 'column',
+          justifyContent: 'center',
+          height: '100%',
+          color: '#333',
+        }}
+      >
+        <div style={{ textAlign: 'center' }}>
+          <h2 style={{ margin: '0 0 12px 0' }}>Animated Border</h2>
+          <p style={{ margin: 0 }}>Content inside the animated border frame</p>
+        </div>
+      </div>
+    </BorderColorAnimation>
+  ),
+};
+
+export const SmallSize: Story = {
+  args: {
+    width: '300px',
+    height: '200px',
+  },
+};
+
+export const SquareSize: Story = {
+  args: {
+    width: '400px',
+    height: '400px',
+  },
+};

package/src/stories/BotAvatarAndName.stories.ts

@@ -1,24 +1,24 @@
-import type { Meta, StoryObj } from "@storybook/react-vite";
-
-import { BotAvatarAndName } from "../components/bot-avatar-name";
-
-const meta = {
-  title: "Example/Chat/Bot Avatar And Name",
-  component: BotAvatarAndName,
-  // 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 BotAvatarAndName>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-export const Base: Story = {
-  args: {
-    name: "AI表单搭建",
-  },
-};
+import type { Meta, StoryObj } from "@storybook/react-vite";
+
+import { BotAvatarAndName } from "../components/bot-avatar-name";
+
+const meta = {
+  title: "Example/Chat/Bot Avatar And Name",
+  component: BotAvatarAndName,
+  // 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 BotAvatarAndName>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Base: Story = {
+  args: {
+    name: "AI表单搭建",
+  },
+};

package/src/stories/BotIcon.stories.ts

@@ -1,22 +1,22 @@
-import type { Meta, StoryObj } from "@storybook/react-vite";
-
-import { BotIcon } from "../components/bot-icon";
-
-const meta = {
-  title: "Example/Icons/BotIcon",
-  component: BotIcon,
-  // 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 BotIcon>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-export const Base: Story = {
-  args: {},
-};
+import type { Meta, StoryObj } from "@storybook/react-vite";
+
+import { BotIcon } from "../components/bot-icon";
+
+const meta = {
+  title: "Example/Icons/BotIcon",
+  component: BotIcon,
+  // 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 BotIcon>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Base: Story = {
+  args: {},
+};