@baishuyun/chat-sdk 0.1.9 → 1.0.0

package/src/stories/CardField.stories.tsx

@@ -1,87 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
-
-import { CardField } from '@/components/bs-ui/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 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react-vite";
-
-// import { Header } from "./Header";
-import { ChatAreaHeader } from "@/components/bs-ui/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/CircleChecker.stories.tsx

@@ -1,89 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
-import { useState } from 'react';
-
-import { CircleChecker } from '@/components/bs-ui/circle-checker';
-
-const meta = {
-  title: 'Example/Chat/CircleChecker',
-  component: CircleChecker,
-  tags: ['autodocs'],
-  parameters: {
-    layout: 'centered',
-  },
-  args: {},
-} satisfies Meta<typeof CircleChecker>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {
-  args: {
-    children: 'TEST',
-  },
-};
-
-export const Checked: Story = {
-  args: {
-    defaultChecked: true,
-    children: 'TEST',
-  },
-};
-
-export const Unchecked: Story = {
-  args: {
-    defaultChecked: false,
-    children: 'TEST',
-  },
-};
-
-export const WithoutLabel: Story = {
-  args: {
-    defaultChecked: true,
-  },
-};
-
-export const Disabled: Story = {
-  args: {
-    disabled: true,
-    children: 'Disabled',
-  },
-};
-
-export const DisabledChecked: Story = {
-  args: {
-    disabled: true,
-    defaultChecked: true,
-    children: 'Disabled Checked',
-  },
-};
-
-const ControlledComponent = () => {
-  const [checked, setChecked] = useState(false);
-  return (
-    <div className="flex flex-col gap-4">
-      <CircleChecker checked={checked} onCheckedChange={setChecked}>
-        Controlled: {checked ? 'Checked' : 'Unchecked'}
-      </CircleChecker>
-      <button
-        className="px-3 py-1 bg-gray-200 rounded text-sm"
-        onClick={() => setChecked(!checked)}
-      >
-        Toggle from outside
-      </button>
-    </div>
-  );
-};
-
-export const Controlled: Story = {
-  render: () => <ControlledComponent />,
-};
-
-export const MultipleOptions: Story = {
-  render: () => (
-    <div className="flex flex-col gap-2">
-      <CircleChecker>Option A</CircleChecker>
-      <CircleChecker>Option B</CircleChecker>
-      <CircleChecker defaultChecked>Option C (default checked)</CircleChecker>
-    </div>
-  ),
-};

package/src/stories/CollapsibleTextMsg.stories.ts

@@ -1,44 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react-vite";
-
-import { CollapsibleTxtMsg } from "@/components/bs-ui/collapsible-txt-msg";
-
-const meta = {
-  title: "Example/Chat/CollapsibleTxtMsg",
-  component: CollapsibleTxtMsg,
-  // 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 CollapsibleTxtMsg>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-export const Base: Story = {
-  args: {
-    title: "表单分析",
-    content:
-      "一些文字描述，字段分析\n设计说明：表单按供应商管理逻辑设计，先填写供应商基础信息（ID、名称、联系人等），再通过子表单填写关联的产品信息（名称、型号、单价等），最后留备注补充。核心字段均设为必填确保信息完整。？试试下面建议吧！",
-    defaultOpen: true,
-  },
-};
-
-export const Collapsed: Story = {
-  args: {
-    title: "表单分析",
-    content:
-      "一些文字描述，字段分析\n设计说明：表单按供应商管理逻辑设计，先填写供应商基础信息（ID、名称、联系人等），再通过子表单填写关联的产品信息（名称、型号、单价等），最后留备注补充。核心字段均设为必填确保信息完整。？试试下面建议吧！",
-    defaultOpen: false,
-  },
-};
-
-export const ShortContent: Story = {
-  args: {
-    title: "简短说明",
-    content: "这是一个简短的内容示例。",
-    defaultOpen: true,
-  },
-};

package/src/stories/ConfirmDialog.stories.tsx

@@ -1,123 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
-import { useState } from 'react';
-import { ConfirmDialog } from '@/components/bs-ui/confirm-dialog';
-
-const meta = {
-  title: 'Example/Chat/ConfirmDialog',
-  component: ConfirmDialog,
-  tags: ['autodocs'],
-  parameters: {
-    layout: 'centered',
-  },
-  args: {
-    open: true,
-    title: 'AI表单搭建有修改，是否保存？',
-    description: '您修改了AI表单搭建但没有保存，是否需要保存并继续？',
-  },
-  argTypes: {
-    open: { control: 'boolean' },
-    title: { control: 'text' },
-    description: { control: 'text' },
-    linkText: { control: 'text' },
-    cancelText: { control: 'text' },
-    confirmText: { control: 'text' },
-    showLink: { control: 'boolean' },
-    showCancel: { control: 'boolean' },
-    onLinkClick: { action: 'onLinkClick' },
-    onCancel: { action: 'onCancel' },
-    onConfirm: { action: 'onConfirm' },
-    onOpenChange: { action: 'onOpenChange' },
-  },
-} satisfies Meta<typeof ConfirmDialog>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-// Default story matching the Figma design
-export const Default: Story = {
-  args: {
-    open: true,
-    title: 'AI表单搭建有修改，是否保存？',
-    description: '您修改了AI表单搭建但没有保存，是否需要保存并继续？',
-    linkText: '留在此页',
-    cancelText: '不保存',
-    confirmText: '保存并继续',
-  },
-};
-
-// Without link button
-export const WithoutLink: Story = {
-  args: {
-    open: true,
-    title: '确认删除？',
-    description: '删除后将无法恢复，请确认是否继续。',
-    showLink: false,
-    cancelText: '取消',
-    confirmText: '删除',
-  },
-};
-
-// Without cancel button
-export const WithoutCancel: Story = {
-  args: {
-    open: true,
-    title: '操作成功',
-    description: '您的更改已保存。',
-    showLink: false,
-    showCancel: false,
-    confirmText: '确定',
-  },
-};
-
-// Simple confirmation
-export const SimpleConfirm: Story = {
-  args: {
-    open: true,
-    title: '确认退出？',
-    description: '退出后未保存的内容将会丢失。',
-    showLink: false,
-    cancelText: '取消',
-    confirmText: '确认退出',
-  },
-};
-
-// Interactive example with state management
-const InteractiveDialogWrapper = () => {
-  const [open, setOpen] = useState(false);
-
-  return (
-    <div>
-      <button
-        onClick={() => setOpen(true)}
-        className="px-4 py-2 bg-[#0265ff] text-white rounded cursor-pointer"
-      >
-        打开对话框
-      </button>
-      <ConfirmDialog
-        open={open}
-        onOpenChange={setOpen}
-        title="AI表单搭建有修改，是否保存？"
-        description="您修改了AI表单搭建但没有保存，是否需要保存并继续？"
-        onLinkClick={() => {
-          console.log('Link clicked');
-          setOpen(false);
-        }}
-        onCancel={() => {
-          console.log('Cancel clicked');
-          setOpen(false);
-        }}
-        onConfirm={() => {
-          console.log('Confirm clicked');
-          setOpen(false);
-        }}
-      />
-    </div>
-  );
-};
-
-export const Interactive: Story = {
-  render: () => <InteractiveDialogWrapper />,
-  args: {
-    open: false,
-  },
-};

package/src/stories/DashWidgetIcon.stories.tsx

@@ -1,132 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
-import { IDashWidgetType } from '@baishuyun/types';
-import { DashWidgetIcon } from '@/components/biz-comp/dash-widget-icon';
-
-const DASH_WIDGET_TYPES: IDashWidgetType[] = [
-  'metric_table',
-  'gauge_chart',
-  'column_chart',
-  'funnel_chart',
-  'line_chart',
-  'pie_chart',
-  'area_chart',
-  'radar_chart',
-  'bar_chart',
-  'gantt',
-  'multi_axes_chart',
-  'data_table',
-  'background_table',
-  'pivot_table',
-  'map_chart',
-  'newMap',
-  'card',
-  'rili',
-  'description',
-  'image',
-  'gauge_imageMore',
-];
-
-const DASH_WIDGET_TYPE_LABEL: Record<IDashWidgetType, string> = {
-  metric_table: '指标图',
-  gauge_chart: '仪表盘',
-  column_chart: '柱形图',
-  funnel_chart: '漏斗图',
-  line_chart: '折线图',
-  pie_chart: '饼图',
-  area_chart: '面积图',
-  radar_chart: '雷达图',
-  bar_chart: '条形图',
-  gantt: '甘特图',
-  multi_axes_chart: '双轴图',
-  data_table: '数据表',
-  background_table: '背景表',
-  pivot_table: '透视图',
-  map_chart: '地图',
-  newMap: '新地图',
-  card: '卡片',
-  rili: '日历',
-  description: '富文本',
-  image: '图片',
-  gauge_imageMore: '仪表盘更多',
-};
-
-const meta: Meta<typeof DashWidgetIcon> = {
-  title: 'Example/Icons/DashWidgetIcon',
-  component: DashWidgetIcon,
-  tags: ['autodocs'],
-  parameters: {
-    layout: 'centered',
-  },
-  argTypes: {
-    type: {
-      control: 'select',
-      options: DASH_WIDGET_TYPES,
-    },
-  },
-};
-
-export default meta;
-type Story = StoryObj<typeof DashWidgetIcon>;
-
-// 默认：指标图
-export const MetricTable: Story = {
-  args: { type: 'metric_table' },
-};
-
-// 仪表盘
-export const GaugeChart: Story = {
-  args: { type: 'gauge_chart' },
-};
-
-// 柱形图
-export const ColumnChart: Story = {
-  args: { type: 'column_chart' },
-};
-
-// 折线图
-export const LineChart: Story = {
-  args: { type: 'line_chart' },
-};
-
-// 饼图
-export const PieChart: Story = {
-  args: { type: 'pie_chart' },
-};
-
-// 条形图
-export const BarChart: Story = {
-  args: { type: 'bar_chart' },
-};
-
-// 所有图标类型一览
-export const AllTypes: Story = {
-  args: { type: 'metric_table' },
-  render: () => (
-    <div
-      style={{
-        display: 'grid',
-        gridTemplateColumns: 'repeat(4, 1fr)',
-        gap: '16px',
-      }}
-    >
-      {DASH_WIDGET_TYPES.map((t) => (
-        <div
-          key={t}
-          style={{
-            display: 'flex',
-            flexDirection: 'column',
-            alignItems: 'center',
-            gap: '4px',
-            padding: '12px',
-            border: '1px solid #eee',
-            borderRadius: '8px',
-          }}
-        >
-          <DashWidgetIcon type={t} style={{ fontSize: 24 }} />
-          <span style={{ fontSize: 12, color: '#666' }}>{DASH_WIDGET_TYPE_LABEL[t]}</span>
-          <span style={{ fontSize: 10, color: '#aaa' }}>{t}</span>
-        </div>
-      ))}
-    </div>
-  ),
-};

package/src/stories/FormInfoEditor.stories.tsx

@@ -1,173 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
-import { useState } from 'react';
-
-import { FormInfoEditor, FormIconOption } from '@/components/bs-ui/form-info-editor';
-import { FORM_ICON_OPTIONS } from '@/const/ui';
-
-const meta: Meta<typeof FormInfoEditor> = {
-  title: 'Example/Chat/FormInfoEditor',
-  component: FormInfoEditor,
-  tags: ['autodocs'],
-  parameters: {
-    layout: 'centered',
-  },
-  args: {
-    name: '供应商管理表',
-  },
-  decorators: [
-    (Story) => (
-      <div className="w-[328px]">
-        <Story />
-      </div>
-    ),
-  ],
-};
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-// Default collapsed state
-export const Default: Story = {
-  args: {
-    name: '供应商管理表',
-    selectedIcon: FORM_ICON_OPTIONS[0],
-  },
-};
-
-// Expanded edit state
-export const Expanded: Story = {
-  args: {
-    name: '供应商管理表',
-    expanded: true,
-    selectedIcon: FORM_ICON_OPTIONS[0],
-  },
-};
-
-// With icon options in expanded state (using all 36 form icons)
-export const WithIconOptions: Story = {
-  args: {
-    name: '供应商管理表',
-    expanded: true,
-    iconOptions: FORM_ICON_OPTIONS,
-    selectedIcon: FORM_ICON_OPTIONS[20],
-  },
-  decorators: [
-    (Story) => (
-      <div className="w-[360px]">
-        <Story />
-      </div>
-    ),
-  ],
-};
-
-// Interactive example with state management
-const InteractiveTemplate = () => {
-  const [name, setName] = useState('供应商管理表');
-  const [expanded, setExpanded] = useState(false);
-  const [selectedIcon, setSelectedIcon] = useState<FormIconOption>(FORM_ICON_OPTIONS[0]);
-
-  return (
-    <FormInfoEditor
-      name={name}
-      onNameChange={setName}
-      expanded={expanded}
-      onExpandedChange={setExpanded}
-      iconOptions={FORM_ICON_OPTIONS}
-      selectedIcon={selectedIcon}
-      onIconChange={setSelectedIcon}
-      onConfirm={() => {
-        alert(`表单名称: ${name}\n图标: ${selectedIcon.label}`);
-      }}
-    />
-  );
-};
-
-export const Interactive: Story = {
-  render: () => <InteractiveTemplate />,
-  decorators: [
-    (Story) => (
-      <div className="w-[360px]">
-        <Story />
-      </div>
-    ),
-  ],
-};
-
-// Long form name - test ellipsis
-export const LongName: Story = {
-  args: {
-    name: '这是一个很长的表单名称用于测试文本溢出情况显示省略号',
-    selectedIcon: FORM_ICON_OPTIONS[5],
-  },
-};
-
-// Custom width
-export const CustomWidth: Story = {
-  args: {
-    name: '供应商管理表',
-    className: 'w-[400px]',
-    selectedIcon: FORM_ICON_OPTIONS[0],
-  },
-  decorators: [
-    (Story) => (
-      <div className="w-[420px]">
-        <Story />
-      </div>
-    ),
-  ],
-};
-
-// Expanded with long name
-export const ExpandedLongName: Story = {
-  args: {
-    name: '这是一个很长的表单名称用于测试文本溢出情况',
-    expanded: true,
-    iconOptions: FORM_ICON_OPTIONS.slice(0, 18), // Show 18 icons (3 rows)
-    selectedIcon: FORM_ICON_OPTIONS[0],
-  },
-};
-
-// Empty name
-export const EmptyName: Story = {
-  args: {
-    name: '',
-    expanded: true,
-    selectedIcon: FORM_ICON_OPTIONS[0],
-  },
-};
-
-// Side by side comparison
-export const SideBySide: Story = {
-  render: () => (
-    <div className="flex flex-col gap-4 w-[328px]">
-      <div>
-        <p className="text-sm text-gray-500 mb-2">默认状态 (收起)</p>
-        <FormInfoEditor name="供应商管理表" expanded={false} selectedIcon={FORM_ICON_OPTIONS[0]} />
-      </div>
-      <div>
-        <p className="text-sm text-gray-500 mb-2">长名称 (带省略号)</p>
-        <FormInfoEditor
-          name="这是一个超长的表单名称用于测试省略号效果"
-          expanded={false}
-          selectedIcon={FORM_ICON_OPTIONS[10]}
-        />
-      </div>
-      <div>
-        <p className="text-sm text-gray-500 mb-2">展开状态 (编辑)</p>
-        <FormInfoEditor
-          name="供应商管理表"
-          expanded={true}
-          iconOptions={FORM_ICON_OPTIONS}
-          selectedIcon={FORM_ICON_OPTIONS[5]}
-        />
-      </div>
-    </div>
-  ),
-  decorators: [
-    (Story) => (
-      <div className="w-[380px]">
-        <Story />
-      </div>
-    ),
-  ],
-};