@baishuyun/chat-sdk 0.1.9 → 1.0.0

package/src/components/bs-ui/primary-entry-btn.tsx

@@ -1,48 +0,0 @@
-import { ReactNode } from 'react';
-import { Button, ButtonProps } from '../ui/button';
-import { BotIcon } from './bot-icon';
-import { cn } from '@/lib/utils';
-import { transCls } from '@/const/ui';
-
-export interface PrimaryEntryBtnProps extends ButtonProps {
-  minimal?: boolean;
-  entryVariant?: 'default' | 'ghost' | 'selected' | 'light';
-  icon?: ReactNode;
-}
-
-export const PrimaryEntryBtn = ({
-  children,
-  className,
-  minimal,
-  entryVariant = 'default',
-  icon,
-  ...rest
-}: PrimaryEntryBtnProps) => {
-  const variantStyles = {
-    // background: linear-gradient(180deg, #267AFF 0%, #B2EEFF 100%);
-    default:
-      "relative overflow-hidden bg-[linear-gradient(180deg,#DBE9FF_0%,#E9FFFD_100%)] h-[30px] hover:text-white before:content-[''] before:absolute before:inset-0 before:z-0 before:bg-[linear-gradient(180deg,#267AFF_0%,#B2EEFF_100%)] before:opacity-0 hover:before:opacity-100 before:transition-opacity before:duration-200 before:ease-out font-[500] text-[#0265ff]",
-    ghost: 'bg-transparent text-[#030303] font-[400] px-[10px] hover:bg-[#EFF0F6] h-[34px]',
-    light: 'text-[#030303] font-[400] px-[10px] bg-[#F0F6FF] hover:bg-[#d8dde5] h-[34px]',
-    selected: 'bg-[#EFF0F6] text-[#030303] font-[400] px-[10px]',
-  };
-
-  return (
-    <Button
-      {...rest}
-      variant="entry"
-      size="entry"
-      className={cn(
-        'rounded-[4px] cursor-pointer',
-        transCls,
-        variantStyles[entryVariant],
-        className
-      )}
-    >
-      <span className="relative z-10 inline-flex items-center gap-1.5">
-        {icon ?? <BotIcon />}
-        {minimal ? null : children}
-      </span>
-    </Button>
-  );
-};

package/src/components/bs-ui/scroll-to-bottom-btn.tsx

@@ -1,28 +0,0 @@
-import { cn } from '@/lib/utils';
-import { transCls } from '@/const/ui';
-import { ScrollArrowDownIcon } from './bs-icons';
-
-export interface ScrollToBottomProps {
-  onClick?: () => void;
-  className?: string;
-}
-
-export const ScrollToBottomBtn = ({ onClick, className }: ScrollToBottomProps) => {
-  return (
-    <button
-      type="button"
-      onClick={onClick}
-      className={cn(
-        'inline-flex items-center justify-center',
-        'w-[36px] h-[36px] rounded-full',
-        'bg-white text-[#666] shadow-[0px_0px_14px_0px_rgba(0,0,0,0.1)]',
-        'hover:shadow-[0px_14px_14px_0px_rgba(0,0,0,0.14)]',
-        'cursor-pointer hover:text-[#333] aspect-square',
-        transCls,
-        className
-      )}
-    >
-      <ScrollArrowDownIcon />
-    </button>
-  );
-};

package/src/components/bs-ui/split-line.tsx

@@ -1,9 +0,0 @@
-import { cn } from '@/lib/utils';
-
-export interface SplitLineProps {
-  className?: string;
-}
-
-export const SplitLine = ({ className }: SplitLineProps) => {
-  return <div className={cn('h-[1px] w-full bg-[#E0E0E0]', className)} />;
-};

package/src/components/bs-ui/square-checker.tsx

@@ -1,87 +0,0 @@
-import * as React from 'react';
-import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
-import { cn } from '@/lib/utils';
-import { CheckerInBoxIcon } from './bs-icons';
-
-const SquareInBoxIcon = () => {
-  // size 8, border 1px svg
-  return (
-    <svg
-      width="8"
-      height="8"
-      viewBox="0 0 8 8"
-      // fill="currentColor"
-      xmlns="http://www.w3.org/2000/svg"
-    >
-      <rect x="0.5" y="0.5" width="7" height="7" rx="1" fill="#0265ff" />
-    </svg>
-  );
-};
-
-export type SquareCheckerProps = React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root> & {
-  /** Optional label rendered beside the checkbox */
-  children?: React.ReactNode;
-  readonly?: boolean;
-  intermediate?: boolean;
-};
-
-export const SquareChecker = React.forwardRef<
-  React.ElementRef<typeof CheckboxPrimitive.Root>,
-  SquareCheckerProps
->(({ className, children, id, readonly, disabled, intermediate, ...props }, ref) => {
-  const generatedId = React.useId();
-  const checkboxId = id ?? generatedId;
-
-  return (
-    <label
-      htmlFor={checkboxId}
-      className={cn(
-        'inline-flex items-center gap-[6px] select-none text-[#121111] text-[14px]',
-        disabled ? 'cursor-not-allowed' : 'cursor-pointer',
-        {
-          'pointer-events-none': readonly,
-        }
-      )}
-    >
-      <CheckboxPrimitive.Root
-        ref={ref}
-        id={checkboxId}
-        disabled={disabled}
-        className={cn(
-          // base layout
-          'inline-flex shrink-0 items-center justify-center',
-          'w-[16px] h-[16px] rounded-[2px] box-border border',
-          'transition-colors duration-200',
-          'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#0265FF] focus-visible:ring-offset-1',
-          // normal: gray border, white bg
-          'border-[#E0E0E0] bg-white',
-          // hover: blue border (browsers suppress hover on disabled <button>)
-          'hover:border-[#0265FF]',
-          // checked: blue fill
-          'data-[state=checked]:bg-[#0265FF] data-[state=checked]:border-[#0265FF]',
-          // disabled unchecked: gray bg + gray border
-          'disabled:cursor-not-allowed disabled:bg-[#F0F0F0] disabled:border-[#C2C2C2]',
-          // disabled checked: use muted gray fill
-          'disabled:data-[state=checked]:bg-[#C2C2C2] disabled:data-[state=checked]:border-[#C2C2C2]',
-          // indeterminate: blue fill
-          intermediate && 'bg-white border-[#0265FF] text-[#0265FF]',
-          className,
-          {
-            'opacity-50': readonly,
-          }
-        )}
-        {...props}
-      >
-        <CheckboxPrimitive.Indicator className="text-white" forceMount={intermediate || undefined}>
-          {intermediate ? <SquareInBoxIcon /> : <CheckerInBoxIcon />}
-        </CheckboxPrimitive.Indicator>
-      </CheckboxPrimitive.Root>
-
-      {children != null && (
-        <span className={cn('text-sm leading-none', disabled && 'text-[#C2C2C2]')}>{children}</span>
-      )}
-    </label>
-  );
-});
-
-SquareChecker.displayName = 'SquareChecker';

package/src/components/bs-ui/tab-radio-group.tsx

@@ -1,82 +0,0 @@
-import * as React from 'react';
-import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
-
-import { cn } from '@/lib/utils';
-import { BsTooltip } from './tooltip';
-
-export interface TabRadioOption {
-  value: string;
-  label: React.ReactNode;
-  tooltips?: string;
-  className?: string;
-}
-
-export interface TabRadioGroupProps extends Omit<
-  React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>,
-  'children'
-> {
-  options: TabRadioOption[];
-}
-
-const TabRadioGroup = React.forwardRef<
-  React.ElementRef<typeof RadioGroupPrimitive.Root>,
-  TabRadioGroupProps
->(({ className, options, ...props }, ref) => {
-  return (
-    <RadioGroupPrimitive.Root
-      ref={ref}
-      className={cn(
-        'flex flex-col items-start justify-center p-[2px] rounded-[4px] bg-[#EFF0F6]',
-        className
-      )}
-      {...props}
-    >
-      <div className="flex gap-[2px] items-center w-full">
-        {options.map((option) => (
-          <TabRadioItem
-            key={option.value}
-            value={option.value}
-            tooltips={option.tooltips}
-            className={option.className}
-          >
-            {option.label}
-          </TabRadioItem>
-        ))}
-      </div>
-    </RadioGroupPrimitive.Root>
-  );
-});
-TabRadioGroup.displayName = 'TabRadioGroup';
-
-interface TabRadioItemProps extends React.ComponentPropsWithoutRef<
-  typeof RadioGroupPrimitive.Item
-> {
-  children: React.ReactNode;
-  tooltips?: string;
-}
-
-const TabRadioItem = React.forwardRef<
-  React.ElementRef<typeof RadioGroupPrimitive.Item>,
-  TabRadioItemProps
->(({ className, children, tooltips, ...props }, ref) => {
-  return (
-    <RadioGroupPrimitive.Item
-      ref={ref}
-      className={cn(
-        'flex-1 h-[30px] flex items-center justify-center px-[10px] py-[7px] rounded-[4px] text-[14px] text-[#121111] cursor-pointer',
-        'border border-solid border-[#EFF0F6] bg-transparent',
-        'transition-all ease-out duration-200',
-        'outline-none',
-        'hover:text-[#121111] hover:border-[#E0E0E0] hover:bg-white',
-        'data-[state=checked]:text-[#0265FF] data-[state=checked]:border-[#E0E0E0] data-[state=checked]:bg-white',
-        className
-      )}
-      {...props}
-    >
-      {tooltips ? <BsTooltip content={tooltips}>{children}</BsTooltip> : children}
-    </RadioGroupPrimitive.Item>
-  );
-});
-TabRadioItem.displayName = 'TabRadioItem';
-
-export { TabRadioGroup, TabRadioItem };

package/src/components/bs-ui/tooltip.tsx

@@ -1,53 +0,0 @@
-import React, { useEffect, useRef, useState } from 'react';
-import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';
-
-export const BsTooltip = ({
-  children,
-  content,
-}: {
-  children: React.ReactNode;
-  content: React.ReactNode;
-}) => {
-  const triggerRef = useRef<HTMLSpanElement | null>(null);
-  const [portalContainer, setPortalContainer] = useState<HTMLElement | null>(null);
-
-  useEffect(() => {
-    const triggerEl = triggerRef.current;
-    if (!triggerEl) {
-      return;
-    }
-
-    const rootNode = triggerEl.getRootNode();
-    if (rootNode instanceof ShadowRoot) {
-      const existing = rootNode.querySelector<HTMLElement>('[data-bs-tooltip-portal]');
-      if (existing) {
-        setPortalContainer(existing);
-        return;
-      }
-
-      const container = document.createElement('div');
-      container.setAttribute('data-bs-tooltip-portal', 'true');
-      rootNode.appendChild(container);
-      setPortalContainer(container);
-      return;
-    }
-
-    setPortalContainer(null);
-  }, []);
-
-  return (
-    <Tooltip>
-      <TooltipTrigger asChild>
-        <span ref={triggerRef} className="inline-flex">
-          {children}
-        </span>
-      </TooltipTrigger>
-      <TooltipContent
-        portalContainer={portalContainer}
-        className="rounded-[4px] bg-[#525867] px-[12px] !py-[7px] text-[12px] text-white leading-normal max-w-[288px] animate-in fade-in-0 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 duration-200"
-      >
-        {content}
-      </TooltipContent>
-    </Tooltip>
-  );
-};

package/src/components/bs-ui/user-txt-msg-bubble.tsx

@@ -1,19 +0,0 @@
-export interface UserTextMsgBubbleProps {
-  text?: string;
-  children?: string;
-}
-
-export const UserTextMsgBubble = ({ text, children }: UserTextMsgBubbleProps) => {
-  return (
-    <div
-      className="px-2.5 py-[7px] text-[#0265FF] text-[14px] w-fit"
-      style={{
-        borderRadius: `10px 0 10px 10px`,
-        wordWrap: 'break-word',
-        background: `linear-gradient(180deg, #DBE9FF 0%, #E9FFFD 100%)`,
-      }}
-    >
-      {text || children}
-    </div>
-  );
-};

package/src/components/bs-ui/warning-msg.tsx

@@ -1,27 +0,0 @@
-import { cn } from '@/lib/utils';
-import { WarningImgUrl } from '@/const/ui';
-
-export interface WarningMessageProps {
-  message?: string;
-  className?: string;
-}
-
-export const WarningMessage = ({
-  message = '程序错误，请刷新页面重试',
-  className,
-}: WarningMessageProps) => {
-  return (
-    <div className={cn('flex flex-col items-center gap-[10px]', className)}>
-      <div
-        className="bg-no-repeat bg-center"
-        style={{
-          backgroundImage: WarningImgUrl,
-          backgroundSize: '100% 100%',
-          width: 120,
-          height: 77,
-        }}
-      />
-      <p className="text-[12px] text-[#999] leading-normal">{message}</p>
-    </div>
-  );
-};

package/src/stories/AbsFullscreenGradientBg.stories.tsx

@@ -1,36 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
-
-import { AbsFullscreenGradientBg } from '@/components/bs-ui/abs-fullscreen-gradient-bg';
-
-const meta = {
-  title: 'Example/Chat/AbsFullscreenGradientBg',
-  component: AbsFullscreenGradientBg,
-  tags: ['autodocs'],
-  parameters: {
-    layout: 'fullscreen',
-  },
-  args: {
-    zIndex: 1,
-  },
-} satisfies Meta<typeof AbsFullscreenGradientBg>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {
-  args: {
-    zIndex: 1,
-  },
-};
-
-export const WithContent: Story = {
-  args: {
-    zIndex: 1,
-    children: (
-      <div style={{ position: 'relative', zIndex: 1, padding: '40px', color: '#333' }}>
-        <h1>Content over gradient background</h1>
-        <p>This demonstrates how content can be placed over the gradient background.</p>
-      </div>
-    ),
-  },
-};

package/src/stories/AttachmentPart.stories.tsx

@@ -1,122 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
-
-import { AttachmentPart, FilePart } from '@/components/bs-ui/attachment-part';
-
-const meta = {
-  title: 'Example/Chat/AttachmentPart',
-  component: AttachmentPart,
-  tags: ['autodocs'],
-  parameters: {
-    layout: 'centered',
-  },
-} satisfies Meta<typeof AttachmentPart>;
-
-export default meta;
-
-type Story = StoryObj<typeof meta>;
-
-const imagePart: FilePart = {
-  type: 'file',
-  url: 'https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=400',
-  name: 'mountain.jpg',
-  mediaType: 'image/jpeg',
-};
-
-const excelPart: FilePart = {
-  type: 'file',
-  url: 'http://example.com/test.xlsx',
-  name: 'bot_files/uuid/test excel upload.xlsx',
-  mediaType: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
-};
-
-const csvPart: FilePart = {
-  type: 'file',
-  url: 'http://example.com/data.csv',
-  name: 'data.csv',
-  mediaType: 'text/csv',
-};
-
-const txtPart: FilePart = {
-  type: 'file',
-  url: 'http://example.com/readme.txt',
-  name: 'readme.txt',
-  mediaType: 'text/plain',
-};
-
-const tsPart: FilePart = {
-  type: 'file',
-  url: 'http://example.com/useFormChat.ts',
-  name: 'bot_files/uuid/useFormChat_Version3.ts',
-  mediaType: 'application/octet-stream',
-};
-
-const unknownPart: FilePart = {
-  type: 'file',
-  url: 'http://example.com/unknown.bin',
-  name: 'unknown.bin',
-  mediaType: 'application/x-unknown',
-};
-
-export const Image: Story = {
-  args: {
-    part: imagePart,
-  },
-};
-
-export const Excel: Story = {
-  args: {
-    part: excelPart,
-  },
-};
-
-export const CSV: Story = {
-  args: {
-    part: csvPart,
-  },
-};
-
-export const TXT: Story = {
-  args: {
-    part: txtPart,
-  },
-};
-
-export const TypeScript: Story = {
-  args: {
-    part: tsPart,
-  },
-};
-
-export const Unknown: Story = {
-  args: {
-    part: unknownPart,
-  },
-};
-
-export const LargeSize: Story = {
-  args: {
-    part: excelPart,
-    size: 150,
-  },
-};
-
-export const SmallSize: Story = {
-  args: {
-    part: csvPart,
-    size: 64,
-    iconOnly: true,
-  },
-};
-
-export const AllTypes = {
-  render: () => (
-    <div className="flex gap-4 flex-wrap">
-      <AttachmentPart part={imagePart} />
-      <AttachmentPart part={excelPart} />
-      <AttachmentPart part={csvPart} />
-      <AttachmentPart part={txtPart} />
-      <AttachmentPart part={tsPart} />
-      <AttachmentPart part={unknownPart} />
-    </div>
-  ),
-};

package/src/stories/AttachmentPartGroup.stories.tsx

@@ -1,151 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
-
-import { AttachmentPartGroup } from '@/components/bs-ui/attachment-part-group';
-import { FilePart } from '@/components/bs-ui/attachment-part';
-
-const meta = {
-  title: 'Example/Chat/AttachmentPartGroup',
-  component: AttachmentPartGroup,
-  tags: ['autodocs'],
-  parameters: {
-    layout: 'centered',
-  },
-} satisfies Meta<typeof AttachmentPartGroup>;
-
-export default meta;
-
-type Story = StoryObj<typeof meta>;
-
-const imageParts: FilePart[] = [
-  {
-    type: 'file',
-    url: 'https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=400',
-    name: 'mountain1.jpg',
-    mediaType: 'image/jpeg',
-  },
-  {
-    type: 'file',
-    url: 'https://images.unsplash.com/photo-1519681393784-d120267933ba?w=400',
-    name: 'mountain2.jpg',
-    mediaType: 'image/jpeg',
-  },
-  {
-    type: 'file',
-    url: 'https://images.unsplash.com/photo-1454496522488-7a8e488e8606?w=400',
-    name: 'mountain3.jpg',
-    mediaType: 'image/jpeg',
-  },
-];
-
-const mixedParts: FilePart[] = [
-  {
-    type: 'file',
-    url: 'https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=400',
-    name: 'photo1.jpg',
-    mediaType: 'image/jpeg',
-  },
-  {
-    type: 'file',
-    url: 'https://images.unsplash.com/photo-1519681393784-d120267933ba?w=400',
-    name: 'photo2.jpg',
-    mediaType: 'image/jpeg',
-  },
-  {
-    type: 'file',
-    url: 'https://images.unsplash.com/photo-1454496522488-7a8e488e8606?w=400',
-    name: 'photo3.jpg',
-    mediaType: 'image/jpeg',
-  },
-  {
-    type: 'file',
-    url: 'https://images.unsplash.com/photo-1464822759023-fed622ff2c3b?w=400',
-    name: 'photo4.jpg',
-    mediaType: 'image/jpeg',
-  },
-  {
-    type: 'file',
-    url: 'https://images.unsplash.com/photo-1486870591958-9b9d0d1dda99?w=400',
-    name: 'photo5.jpg',
-    mediaType: 'image/jpeg',
-  },
-  {
-    type: 'file',
-    url: 'http://example.com/test.xlsx',
-    name: '生产小工单.excel',
-    mediaType: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
-  },
-];
-
-const fileParts: FilePart[] = [
-  {
-    type: 'file',
-    url: 'http://example.com/report.xlsx',
-    name: 'report.xlsx',
-    mediaType: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
-  },
-  {
-    type: 'file',
-    url: 'http://example.com/data.csv',
-    name: 'data.csv',
-    mediaType: 'text/csv',
-  },
-  {
-    type: 'file',
-    url: 'http://example.com/readme.txt',
-    name: 'readme.txt',
-    mediaType: 'text/plain',
-  },
-  {
-    type: 'file',
-    url: 'http://example.com/unknown.bin',
-    name: 'unknown.bin',
-    mediaType: 'application/x-unknown',
-  },
-];
-
-export const ImagesOnly: Story = {
-  args: {
-    parts: imageParts,
-  },
-};
-
-export const MixedContent: Story = {
-  args: {
-    parts: mixedParts,
-  },
-};
-
-export const FilesOnly: Story = {
-  args: {
-    parts: fileParts,
-  },
-};
-
-export const IconOnly: Story = {
-  args: {
-    parts: fileParts,
-    iconOnly: true,
-  },
-};
-
-export const SmallSize: Story = {
-  args: {
-    parts: mixedParts,
-    size: 80,
-  },
-};
-
-export const LargeGap: Story = {
-  args: {
-    parts: mixedParts,
-    gap: 20,
-  },
-};
-
-export const ConstrainedWidth = {
-  render: () => (
-    <div style={{ width: 330 }}>
-      <AttachmentPartGroup parts={mixedParts} />
-    </div>
-  ),
-};