@baishuyun/ui-base 2.0.0

package/dist/animations/index.d.ts

@@ -0,0 +1,118 @@
+/**
+ * 公共动画配置
+ * 用于各种浮层、下拉菜单等组件的进入退出动画
+ */
+export declare const PANEL_ANIMATION: {
+    readonly initial: {
+        readonly opacity: 0;
+        readonly scale: 0.95;
+        readonly y: -4;
+    };
+    readonly animate: {
+        readonly opacity: 1;
+        readonly scale: 1;
+        readonly y: 0;
+    };
+    readonly exit: {
+        readonly opacity: 0;
+        readonly scale: 0.95;
+        readonly y: -4;
+    };
+    readonly transition: {
+        readonly duration: 0.2;
+        readonly ease: "easeOut";
+    };
+};
+export declare const ICON_ANIMATION: {
+    readonly initial: {
+        readonly opacity: 0;
+        readonly scale: 0.8;
+    };
+    readonly animate: {
+        readonly opacity: 1;
+        readonly scale: 1;
+    };
+    readonly exit: {
+        readonly opacity: 0;
+        readonly scale: 0.8;
+    };
+    readonly transition: {
+        readonly duration: 0.2;
+    };
+};
+export declare const FADE_ANIMATION: {
+    readonly initial: {
+        readonly opacity: 0;
+    };
+    readonly animate: {
+        readonly opacity: 1;
+    };
+    readonly exit: {
+        readonly opacity: 0;
+    };
+    readonly transition: {
+        readonly duration: 0.2;
+    };
+};
+export declare const SLIDE_DOWN_ANIMATION: {
+    readonly initial: {
+        readonly opacity: 0;
+        readonly y: -10;
+    };
+    readonly animate: {
+        readonly opacity: 1;
+        readonly y: 0;
+    };
+    readonly exit: {
+        readonly opacity: 0;
+        readonly y: -10;
+    };
+    readonly transition: {
+        readonly duration: 0.2;
+        readonly ease: "easeOut";
+    };
+};
+export declare const SLIDE_UP_ANIMATION: {
+    readonly initial: {
+        readonly opacity: 0;
+        readonly y: 10;
+    };
+    readonly animate: {
+        readonly opacity: 1;
+        readonly y: 0;
+    };
+    readonly exit: {
+        readonly opacity: 0;
+        readonly y: 10;
+    };
+    readonly transition: {
+        readonly duration: 0.2;
+        readonly ease: "easeOut";
+    };
+};
+export declare const TOAST_ANIMATION: {
+    readonly initial: {
+        readonly opacity: 0;
+        readonly y: -50;
+        readonly scale: 0.8;
+    };
+    readonly animate: {
+        readonly opacity: 1;
+        readonly y: 0;
+        readonly scale: 1;
+    };
+    readonly exit: {
+        readonly opacity: 0;
+        readonly y: -50;
+        readonly scale: 0.8;
+        readonly transition: {
+            readonly duration: 0.3;
+            readonly ease: "easeOut";
+        };
+    };
+    readonly transition: {
+        readonly type: "spring";
+        readonly damping: 20;
+        readonly stiffness: 220;
+    };
+};

package/dist/components/Card/Card.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { CardProps } from './Card.type';
+declare const Card: React.FC<CardProps>;
+export default Card;

package/dist/components/Card/Card.type.d.ts

@@ -0,0 +1,42 @@
+import { ReactNode } from 'react';
+/**
+ * Card组件的属性接口
+ */
+export interface CardProps {
+    /**
+     * 卡片标题
+     */
+    title: string;
+    /**
+     * 卡片内容
+     */
+    children?: ReactNode;
+    /**
+     * 卡片最小宽度，默认240px
+     * @default 240
+     */
+    minWidth?: number;
+    /**
+     * 是否默认展开
+     * @default false
+     */
+    defaultExpanded?: boolean;
+    /**
+     * 自定义类名
+     */
+    className?: string;
+    /**
+     * 自定义样式
+     */
+    style?: React.CSSProperties;
+    styles?: {
+        /**
+         * 自定义头样式
+         */
+        header?: React.CSSProperties;
+        /**
+         * 自定义内容样式
+         */
+        body?: React.CSSProperties;
+    };
+}

package/dist/components/Card/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './Card';
+export type { CardProps } from './Card.type';

package/dist/components/ColorPicker/ColorPalettes.d.ts

@@ -0,0 +1,15 @@
+/**
+ * 预设颜色网格组件
+ */
+interface PresetColorsProps {
+    /** 当前选中的颜色 */
+    currentColor: string;
+    /** 颜色选择回调 */
+    onColorSelect: (color: string) => void;
+    /** 颜色选项 */
+    options: string[];
+    /** 网格样式 */
+    style?: React.CSSProperties;
+}
+declare const ColorPalettes: React.FC<PresetColorsProps>;
+export default ColorPalettes;

package/dist/components/ColorPicker/ColorPicker.d.ts

@@ -0,0 +1,3 @@
+import { ColorPickerProps } from './ColorPicker.type';
+declare const ColorPicker: React.FC<ColorPickerProps>;
+export { ColorPicker };

package/dist/components/ColorPicker/ColorPicker.type.d.ts

@@ -0,0 +1,25 @@
+import { ReactNode } from 'react';
+/**
+ * 颜色选择器的属性接口
+ */
+export interface ColorPickerProps {
+    /** 子元素，作为触发器 */
+    children: ReactNode;
+    /** 当前选中的颜色值（受控模式） */
+    value?: string;
+    /** 默认颜色值（非受控模式） */
+    /** @default '#0265ff' */
+    defaultValue?: string;
+    /** 颜色变化时的回调函数 */
+    onChange?: (color: string) => void;
+    /** 浮层的放置位置 */
+    /** @default 'bottom-start' */
+    placement?: 'top' | 'bottom' | 'left' | 'right' | 'top-start' | 'bottom-start';
+    /** 是否禁用 */
+    /** @default false */
+    disabled?: boolean;
+    /**
+     * 预设颜色
+     */
+    presetColors?: string[];
+}

package/dist/components/ColorPicker/constants.d.ts

@@ -0,0 +1,2 @@
+declare const COLOR_OPTIONS_RGBA: string[];
+export { COLOR_OPTIONS_RGBA };

package/dist/components/ColorPicker/index.d.ts

@@ -0,0 +1,3 @@
+export { ColorPicker as default } from './ColorPicker';
+export type { ColorPickerProps } from './ColorPicker.type';
+export { COLOR_OPTIONS_RGBA } from './constants';

package/dist/components/ColorPicker/useFloatingColorPicker.d.ts

@@ -0,0 +1,25 @@
+import { ReferenceType } from '@floating-ui/react';
+import { ColorPickerProps } from './ColorPicker.type';
+import { CSSProperties, Dispatch, SetStateAction } from 'react';
+/**
+ * useFloatingColorPicker 的返回类型
+ */
+interface UseFloatingColorPickerReturn {
+    isOpen: boolean;
+    refs: {
+        setReference: (node: ReferenceType | null) => void;
+        setFloating: (node: HTMLElement | null) => void;
+        reference: React.MutableRefObject<ReferenceType | null>;
+        floating: React.MutableRefObject<HTMLElement | null>;
+    };
+    floatingStyles: CSSProperties;
+    getReferenceProps: (userProps?: React.HTMLProps<Element>) => Record<string, unknown>;
+    getFloatingProps: (userProps?: React.HTMLProps<HTMLElement>) => Record<string, unknown>;
+    setIsOpen: Dispatch<SetStateAction<boolean>>;
+}
+/**
+ * 使用浮层颜色选择器的 hook
+ * 集成了 floating-ui 的完整功能
+ */
+declare const useFloatingColorPicker: (placement?: ColorPickerProps["placement"]) => UseFloatingColorPickerReturn;
+export default useFloatingColorPicker;

package/dist/components/DropDown/interface.d.ts

@@ -0,0 +1,121 @@
+import { ReactNode } from 'react';
+
+
+/**
+ * 浮层偏移量接口
+ */
+export interface OffsetType {
+  /**
+   * x 轴偏移量
+   * @default 0
+   */
+  x: number;
+  /**
+   * y 轴偏移量
+   * @default 0
+   */
+  y: number;
+}
+
+/**
+ * 下拉菜单项接口
+ */
+export interface MenuItemType {
+  /**
+   * 菜单项的唯一标识
+   */
+  key: string;
+  /**
+   * 菜单项的显示内容，可以是字符串或 React 节点
+   */
+  label: ReactNode;
+  /**
+   * 菜单项的图标
+   */
+  icon?: ReactNode;
+  /**
+   * 是否禁用该菜单项
+   * @default false
+   */
+  disabled?: boolean;
+
+  /**
+   * 是否是系统字段
+   * @description 系统字段的颜色会比较突出，和其他字段仅文字样式的不同
+   */
+  systemField?: boolean;
+  /**
+   * 允许任意额外字段，用于自定义搜索或其他用途
+   */
+  [key: string]: any;
+}
+
+/**
+ * 下拉组件的属性接口
+ */
+export interface DropDownProps {
+  /**
+   * 触发器子元素
+   */
+  children: ReactNode;
+  /**
+   * 下拉菜单的菜单项列表
+   */
+  menus: MenuItemType[];
+  /**
+   * 菜单项点击时的回调函数
+   */
+  onClick?: (menuItem: MenuItemType) => void;
+  /**
+   * 下拉菜单打开/关闭状态变化时的回调函数
+   */
+  onOpenChange?: (open: boolean) => void;
+  /**
+   * 控制下拉菜单的显示隐藏状态（受控模式）
+   * @description 当传入此属性时，组件将变为受控模式
+   */
+  visible?: boolean;
+  /**
+   * 搜索框的占位符文本
+   * @default '搜索'
+   */
+  searchPlaceholder?: string;
+  /**
+   * 搜索值变化时的回调函数
+   */
+  onSearch?: (searchValue: string) => void;
+  /**
+   * 用于搜索的字段名
+   * @default 'label'
+   */
+  searchKey?: string;
+  /**
+   * 是否显示搜索框
+   * @default true
+   */
+  showSearch?: boolean;
+  /**
+   * 选择菜单项后是否关闭面板
+   * @default true
+   */
+  closeOnSelect?: boolean;
+  /**
+   * 浮层偏移量
+   * @default { x: 0, y: 0 }
+   */
+  offset?: OffsetType;
+  /**
+   * 自定义下拉菜单的样式
+   */
+  style?: React.CSSProperties;
+
+  /**
+   * 下拉面板浮层的 z-index
+   */
+  zIndex?: number;
+  /**
+   * 高亮的菜单项 key 数组
+   * @description 指定哪些菜单项应该被高亮显示
+   */
+  activeKey?: string[];
+}

package/dist/components/Icon/Icon.d.ts

@@ -0,0 +1,24 @@
+interface IconProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * 图标名称
+     */
+    name: string;
+    /**
+     * 图标样式
+     */
+    style?: React.CSSProperties;
+    /**
+     * 图标颜色
+     */
+    color?: string;
+    /**
+     * 图标类名
+     */
+    className?: string;
+    /**
+     * 图标大小
+     */
+    size?: number;
+}
+declare const Icon: React.FC<IconProps>;
+export { Icon };

package/dist/components/Icon/index.d.ts

@@ -0,0 +1 @@
+export { Icon as default } from './Icon';

package/dist/components/InputTag/InputTag.d.ts

@@ -0,0 +1,3 @@
+import { InputTagProps } from './interface';
+declare const InputTag: React.FC<InputTagProps>;
+export default InputTag;

package/dist/components/InputTag/constants.d.ts

@@ -0,0 +1,7 @@
+export declare const TAG_CONSTANTS: {
+    readonly GAP: 4;
+    readonly OFFSET: 3;
+    readonly INPUT_MIN_WIDTH: 80;
+    readonly CONTAINER_PADDING: 10;
+    readonly INPUT_MARGIN: 4;
+};

package/dist/components/InputTag/index.d.ts

@@ -0,0 +1,2 @@
+import { default as InputTag } from './InputTag';
+export default InputTag;

package/dist/components/InputTag/interface.d.ts

@@ -0,0 +1,32 @@
+type InputTagProps = {
+  /**
+   * 标签值，对象数组格式
+   */
+  value?: string[];
+  /**
+   * 标签值变化回调
+   */
+  onChange?: (value: string[]) => void;
+  /**
+   * 默认标签值
+   */
+  defaultValue?: string[];
+  /**
+   * 是否启用点击高亮功能
+   */
+  enableActive?: boolean;
+  /**
+   * 当前激活的标签索引（受控模式）
+   */
+  activeIndex?: number;
+  /**
+   * 默认激活的标签索引（非受控模式）
+   */
+  defaultActiveIndex?: number;
+  /**
+   * 激活标签索引变化回调
+   */
+  onActiveIndexChange?: (index: number, text: string) => void;
+};
+
+export type { InputTagProps };

package/dist/components/Modal/Modal.d.ts

@@ -0,0 +1,4 @@
+import { PropsWithChildren } from 'react';
+import { ModalProps } from './Modal.type';
+declare const Modal: React.FC<PropsWithChildren<ModalProps>>;
+export { Modal };

package/dist/components/Modal/Modal.type.d.ts

@@ -0,0 +1,22 @@
+export interface ModalProps {
+    /**
+     * 标题
+     */
+    title?: string;
+    /**
+     * 是否打开
+     */
+    open?: boolean;
+    /**
+     * 打开状态变化
+     */
+    onOpenChange?: (open: boolean) => void;
+    /**
+     * 宽度
+     */
+    width?: string;
+    /**
+     * 是否全屏和默认宽度切换
+     */
+    fullSwitch?: boolean;
+}

package/dist/components/Modal/index.d.ts

@@ -0,0 +1 @@
+export { Modal as default } from './Modal';

package/dist/components/index.d.ts

@@ -0,0 +1,5 @@
+export { default as Icon } from './Icon';
+export { LocaleProvider } from '../locale/LocaleProvider';
+export { default as Card } from './Card';
+export { default as Modal } from './Modal';
+export { default as ColorPicker } from './ColorPicker';

package/dist/hooks/useDropdownSearch.d.ts

@@ -0,0 +1,17 @@
+import { MenuItemType } from '../components/DropDown/interface';
+interface UseDropdownSearchProps {
+    menus: MenuItemType[];
+    searchValue: string;
+    enableInternalFilter: boolean;
+    searchKey: string;
+}
+interface UseDropdownSearchReturn {
+    filteredMenus: MenuItemType[];
+    hasNoResults: boolean;
+}
+/**
+ * DropDown 搜索 hook
+ * 提供基于 fuse.js 的模糊搜索功能
+ */
+export declare const useDropdownSearch: ({ menus, searchValue, enableInternalFilter, searchKey, }: UseDropdownSearchProps) => UseDropdownSearchReturn;
+export {};

package/dist/hooks/useFloatingPortal.d.ts

@@ -0,0 +1,20 @@
+import { UseFloatingReturn, UseInteractionsReturn } from '@floating-ui/react';
+type FloatingPortalProps = {
+    isOpen: boolean;
+    close: () => void;
+    showMask?: boolean;
+    zIndex?: number;
+    zIndexMask?: number;
+    offset?: {
+        x?: number;
+        y?: number;
+    };
+    /**
+     * @description 自定义浮层宽度，如果不传则使用参考元素宽度
+     */
+    popupMinWidth?: number | string;
+};
+declare const useFloatingPortal: (props: FloatingPortalProps) => Pick<UseFloatingReturn, "refs" | "floatingStyles" | "context"> & Pick<UseInteractionsReturn, "getReferenceProps" | "getFloatingProps"> & {
+    referenceStyle: React.CSSProperties;
+};
+export default useFloatingPortal;

package/dist/hooks/useLocale.d.ts

@@ -0,0 +1,12 @@
+import { default as zhCN } from '../locale/lang/zh-CN.json';
+type FlattenObjectKeys<T, K extends keyof T = keyof T> = K extends string ? T[K] extends object ? `${K}.${FlattenObjectKeys<T[K]>}` : `${K}` : never;
+export type LocaleKeys = FlattenObjectKeys<typeof zhCN>;
+interface ILocaleContext {
+    locale: string;
+    t: (key: LocaleKeys) => string;
+}
+/**
+ * 获取当前语言
+ */
+export declare const useLocale: () => ILocaleContext;
+export {};

package/dist/hooks/useTagScrollWidth.d.ts

@@ -0,0 +1,3 @@
+import { RefObject } from 'react';
+declare const useTagScrollWidth: (tagContainerRef: RefObject<HTMLDivElement>, tagsLength: number) => number;
+export default useTagScrollWidth;

package/dist/index.js

@@ -0,0 +1,61 @@
+import { I as W } from "./Icon/Icon-C0bjP9U6.js";
+import { jsx as p } from "react/jsx-runtime";
+import { useMemo as o, useCallback as u } from "react";
+import { z as s, L as f } from "./ColorPicker/ColorPicker-CpPLwHR2.js";
+import { C as Y } from "./ColorPicker/ColorPicker-CpPLwHR2.js";
+import { C as _ } from "./Card/Card-DMXtN2pu.js";
+import { M as te } from "./Modal/Modal-C1LEJ6Y0.js";
+const C = "Please select", U = "search", I = "No search data", L = "Select All", k = "Please enter the content", A = "No Data", P = "No Data Found", S = "Data Searching...", h = "Select All by Search", y = "Left Align", N = "Center Align", x = "Right Align", R = "Underline", F = "Link", v = "Hyper Link", z = "Show Content", w = "Link Address", D = "Open in New Tab", M = "Confirm", b = "Cancel", E = "Cancel Link", O = "preset color", T = { linkTip: "Support https://link or @form alias", bold: "Bold", italic: "Italic", fontSize: "Font Size", fontColor: "Font Color", fill: "fill", alignment: "Alignment", centerAlign: "Center Align", rightAlign: "Right Align", uploadImage: "Upload Image", imageUrl: "Image URL", imageUrlPlaceholder: "Please enter image URL", imageUrlRequired: "Please enter image URL", imageUrlInvalid: "Please enter a valid image URL", imageUrlNote: "Note: Enter image URL to insert image", inputImageUrl: "Enter Image URL", uploadImageNote: "Note: Single image size cannot exceed 1MB", uploadImageText: "Click or drag to upload image", previewImage: "Preview Image", underline: "Underline", imageFormatOnly: "Only image formats are supported", uploadImageFirst: "Please upload image first", imageAddSuccess: "Image added successfully", operationFailed: "Operation failed", onlyImageFormatsSupported: "Only image formats are supported", pleaseUploadImageFirst: "Please upload image first", imageSizeNote: "Image size cannot exceed 1MB", clickOrDragToUpload: "Click or drag to upload image", enterImageUrl: "Enter image URL", pleaseEnterImageUrl: "Please enter image URL", pleaseEnterValidImageUrl: "Please enter a valid image URL", linkAddressEmpty: "Link address cannot be empty" }, B = "Picture", V = "Custom Color", j = "Add Picture", q = {
+  select: C,
+  search: U,
+  noFindData: I,
+  allSelect: L,
+  context: k,
+  noData: A,
+  noDataFound: P,
+  dataSearching: S,
+  allSelectedBySearch: h,
+  leftAlign: y,
+  centerAlign: N,
+  rightAlign: x,
+  underline: R,
+  link: F,
+  hyperLink: v,
+  showContent: z,
+  linkAddress: w,
+  openInNewTab: D,
+  confirm: M,
+  cancel: b,
+  cancelLink: E,
+  presetColors: O,
+  editor: T,
+  picture: B,
+  customColor: V,
+  addPicture: j
+}, J = ({ children: c, locale: t = "zh-CN", messages: a = {} }) => {
+  const r = o(() => ({ "zh-CN": s, "en-US": q, ...a }), [a]), l = o(() => r[t] || s, [t, r]), i = u(
+    (n) => {
+      const m = n.split(".");
+      let e = l;
+      for (const d of m)
+        if (e = e[d], !e)
+          return console.warn(`[LocaleProvider] Cannot find translation for key: ${n}`), n;
+      return typeof e == "string" ? e : n;
+    },
+    [l]
+  ), g = o(
+    () => ({
+      locale: t,
+      t: i
+    }),
+    [t, i]
+  );
+  return /* @__PURE__ */ p(f.Provider, { value: g, children: c });
+};
+export {
+  _ as Card,
+  Y as ColorPicker,
+  W as Icon,
+  J as LocaleProvider,
+  te as Modal
+};

package/dist/locale/LocaleContext.d.ts

@@ -0,0 +1,9 @@
+import { LocaleKeys } from '../hooks/useLocale';
+import { Locale } from './index';
+/**
+ * @description 国际化上下文
+ */
+export declare const LocaleContext: import('react').Context<{
+    locale: Locale;
+    t: (key: LocaleKeys) => string;
+}>;

package/dist/locale/LocaleProvider.d.ts

@@ -0,0 +1,6 @@
+import { PropsWithChildren } from 'react';
+import { Locale } from './index';
+export declare const LocaleProvider: React.FC<{
+    locale?: Locale;
+    messages?: Record<string, any>;
+} & PropsWithChildren>;

package/dist/locale/index.d.ts

@@ -0,0 +1 @@
+export type Locale = 'zh-CN' | 'en-US';