zs_library 0.5.3 → 0.6.3

package/dist/components/desktop/config.d.ts

@@ -1,6 +1,75 @@
-import { SortItemBaseConfig } from './types';
-export declare const appConfig: SortItemBaseConfig;
-export declare const groupConfig: SortItemBaseConfig;
-export declare const configMap: {
-    [key: string]: SortItemBaseConfig;
+import { SortItemDefaultConfig, TypeConfigMap, SizeConfig, DataTypeMenuConfigMap } from './types';
+/** 通用尺寸配置 */
+export declare const commonSizeConfigs: {
+    readonly "1x1": {
+        readonly name: "1x1";
+        readonly col: 1;
+        readonly row: 1;
+    };
+    readonly "2x1": {
+        readonly name: "2x1";
+        readonly col: 2;
+        readonly row: 1;
+    };
+    readonly "1x2": {
+        readonly name: "1x2";
+        readonly col: 1;
+        readonly row: 2;
+    };
+    readonly "2x2": {
+        readonly name: "2x2";
+        readonly col: 2;
+        readonly row: 2;
+    };
+    readonly "3x2": {
+        readonly name: "3x2";
+        readonly col: 3;
+        readonly row: 2;
+    };
+    readonly "4x3": {
+        readonly name: "4x3";
+        readonly col: 4;
+        readonly row: 3;
+    };
 };
+/** 通用尺寸配置数组（用于需要数组格式的场景） */
+export declare const commonSizeConfigsArray: SizeConfig[];
+/** app类型的默认配置 */
+export declare const appDefaultConfig: SortItemDefaultConfig;
+/** group类型的默认配置 */
+export declare const groupDefaultConfig: SortItemDefaultConfig;
+/** 内置默认配置映射表 */
+export declare const builtinConfigMap: TypeConfigMap;
+/**
+ * 获取指定类型的默认配置
+ * @param type 类型名称
+ * @param customConfigMap 自定义类型配置映射表
+ * @returns 默认配置对象，如果类型不存在则返回app类型的配置
+ */
+export declare function getDefaultConfig(type: string, customConfigMap?: TypeConfigMap): SortItemDefaultConfig;
+/**
+ * 根据尺寸配置ID获取具体的尺寸信息
+ * @param sizeId 尺寸配置ID
+ * @param sizeConfigs 可用的尺寸配置列表
+ * @param defaultSizeId 默认尺寸配置ID
+ * @returns 尺寸配置对象
+ */
+export declare function getSizeConfig(sizeId: string | undefined, sizeConfigs: SizeConfig[], defaultSizeId: string): SizeConfig;
+/**
+ * 获取项目的实际尺寸（col和row）
+ * @param type 项目类型
+ * @param sizeId 尺寸配置ID
+ * @param customConfigMap 自定义类型配置映射表
+ * @returns 包含col和row的对象
+ */
+export declare function getItemSize(type: string, sizeId?: string, customConfigMap?: TypeConfigMap): {
+    col: number;
+    row: number;
+};
+/**
+ * 获取dataType对应的菜单配置
+ * @param dataType 数据类型
+ * @param customConfigMap 自定义dataType菜单配置映射表
+ * @returns 菜单配置数组
+ */
+export declare function getDataTypeMenuConfig(dataType: string, customConfigMap?: DataTypeMenuConfigMap): import('./types').MenuItemConfig[];

package/dist/components/desktop/context/config/context.d.ts

@@ -1,7 +1,7 @@
 import { default as React } from 'react';
-import { Theme } from '../../theme';
+import { Theme } from '../../themes';
 import { ContextMenuProps } from '../../context-menu';
-import { SortItem } from '../../types';
+import { SortItem, ListItem, TypeConfigMap, DataTypeMenuConfigMap } from '../../types';
 /**
  * 需要跨多个组件传递的配置，使用 context 传递
  */
@@ -11,6 +11,14 @@ export interface SortableConfig<D, C> {
      * 是否不显示名称
      */
     noLetters?: boolean;
+    /**
+     * 类型配置映射表
+     */
+    typeConfigMap?: TypeConfigMap;
+    /**
+     * dataType菜单配置映射表
+     */
+    dataTypeMenuConfigMap?: DataTypeMenuConfigMap;
     /**
      * 右键菜单设置
      */
@@ -25,7 +33,7 @@ export interface SortableConfig<D, C> {
      * @param index 分页项索引
      * @param isActive 是否为当前选中页
      */
-    pagingDotBuilder?: (item: SortItem<D, C>, index: number, isActive: boolean) => React.JSX.Element;
+    pagingDotBuilder?: (item: ListItem<D, C>, index: number, isActive: boolean) => React.JSX.Element;
     /**
      * 自定义 item 渲染
      */

package/dist/components/desktop/context/state/context.d.ts

@@ -1,5 +1,5 @@
 import { default as React } from 'react';
-import { SortItem } from '../../types';
+import { SortItem, ListItem } from '../../types';
 interface ContextMenu {
     rect: DOMRect;
     data: any;
@@ -8,7 +8,7 @@ interface ContextMenu {
 }
 type ListStatus = "onMove";
 export interface SortableState {
-    list: SortItem[];
+    list: ListItem[];
     setList: any;
     contextMenu: ContextMenu | null;
     setContextMenu: (e: ContextMenu | null) => void;
@@ -28,7 +28,7 @@ export interface SortableState {
     updateItemConfig: (id: string | number, config: any) => void;
     removeItem: (id: string) => void;
     addItem: (data: SortItem, parentIds: (string | number)[]) => void;
-    addRootItem: (data: SortItem) => void;
+    addRootItem: (data: ListItem) => void;
     updateRootItem: (id: string | number, data: any) => void;
     removeRootItem: (id: string | number) => void;
     /** 当前移动的元素id */
@@ -37,17 +37,20 @@ export interface SortableState {
     /** 当前元素将要移动到的元素id */
     moveTargetId: string | number | null;
     setMoveTargetId: (e: string | number | null) => void;
+    /** 当前拖拽的元素 */
+    dragItem: SortItem | null;
+    setDragItem: (e: SortItem | null) => void;
 }
 export declare const SortableStateContext: React.Context<SortableState>;
 export interface SortableStateProviderProps<D, C> {
     /**
      * 列表数据
      */
-    list?: SortItem<D, C>[];
+    list?: ListItem<D, C>[];
     /**
      * 列表数据变更事件
      */
-    onChange?: (list: SortItem<D, C>[]) => void;
+    onChange?: (list: ListItem<D, C>[]) => void;
     /**
      * 本地存储 key
      */

package/dist/components/desktop/context-menu/index.d.ts

@@ -7,6 +7,8 @@ export interface ContextMenuProps<D, C> {
     onShareClick?: (item: SortItem<D, C>) => void;
     onInfoClick?: (item: SortItem<D, C>) => void;
     onRemoveClick?: (item: SortItem<D, C>, remove: (id: string) => void) => void;
+    animationOrigin?: string;
+    isOpen?: boolean;
 }
 declare const ContextMenu: <D, C>(props: ContextMenuProps<D, C>) => import("react/jsx-runtime").JSX.Element;
 export default ContextMenu;

package/dist/components/desktop/context-menu/portal.d.ts

@@ -0,0 +1,3 @@
+import { ContextMenuProps } from './index';
+declare const GlobalContextMenu: <D, C>(props: ContextMenuProps<D, C>) => import("react/jsx-runtime").JSX.Element | null;
+export default GlobalContextMenu;

package/dist/components/desktop/dock/dock.d.ts

@@ -0,0 +1,50 @@
+import { default as React } from 'react';
+import { SortItem } from '../types';
+export interface DockProps {
+    /**
+     * dock 项目列表
+     */
+    items?: SortItem[];
+    /**
+     * 固定项目列表（在sortable之前显示，不可拖拽排序）
+     */
+    fixedItems?: SortItem[];
+    /**
+     * dock 位置
+     */
+    position?: "top" | "bottom" | "left" | "right";
+    /**
+     * dock 样式类名
+     */
+    className?: string;
+    /**
+     * dock 项目点击事件
+     */
+    onItemClick?: (item: SortItem) => void;
+    /**
+     * 自定义项目渲染
+     */
+    itemBuilder?: (item: SortItem, index: number) => React.ReactNode;
+    /**
+     * 自定义固定项目渲染
+     */
+    fixedItemBuilder?: (item: SortItem, index: number) => React.ReactNode;
+    /**
+     * 是否显示启动台按钮
+     */
+    showLaunchpad?: boolean;
+    /**
+     * 启动台按钮点击事件
+     */
+    onLaunchpadClick?: () => void;
+    /**
+     * 拖放事件
+     */
+    onDrop?: () => void;
+    /**
+     * dock 项目列表变更事件
+     */
+    onDockItemsChange?: (items: SortItem[]) => void;
+}
+declare const Dock: React.FC<DockProps>;
+export default Dock;

package/dist/components/desktop/dock/index.d.ts

@@ -0,0 +1,6 @@
+export { default as Dock } from './dock';
+export { default as LaunchpadModal } from './launchpad-modal';
+export { default as LaunchpadButton } from './launchpad-button';
+export type { DockProps } from './dock';
+export type { LaunchpadModalProps } from './launchpad-modal';
+export type { LaunchpadButtonProps } from './launchpad-button';

package/dist/components/desktop/dock/launchpad-button.d.ts

@@ -0,0 +1,17 @@
+import { default as React } from 'react';
+export interface LaunchpadButtonProps {
+    /**
+     * 启动台按钮点击事件
+     */
+    onClick?: () => void;
+    /**
+     * 自定义样式类名
+     */
+    className?: string;
+    /**
+     * dock 位置，用于调整分隔线样式
+     */
+    position?: "top" | "bottom" | "left" | "right";
+}
+declare const LaunchpadButton: React.FC<LaunchpadButtonProps>;
+export default LaunchpadButton;

package/dist/components/desktop/dock/launchpad-modal.d.ts

@@ -0,0 +1,17 @@
+import { SortItem } from '../types';
+export interface LaunchpadModalProps<D, C> {
+    /**
+     * 是否显示启动台
+     */
+    visible: boolean;
+    /**
+     * 关闭启动台
+     */
+    onClose: () => void;
+    /**
+     * 项目点击事件
+     */
+    onItemClick?: (item: SortItem<D, C>) => void;
+}
+declare const LaunchpadModal: <D, C>({ visible, onClose, onItemClick }: LaunchpadModalProps<D, C>) => import("react/jsx-runtime").JSX.Element;
+export default LaunchpadModal;

package/dist/components/desktop/dock/search-box.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+interface SearchBoxProps {
+    value: string;
+    onChange: (value: string) => void;
+    placeholder?: string;
+    className?: string;
+}
+declare const SearchBox: React.FC<SearchBoxProps>;
+export default SearchBox;

package/dist/components/desktop/dock/stacked-icon.d.ts

@@ -0,0 +1,13 @@
+import { default as React } from 'react';
+export interface StackedIconProps {
+    /**
+     * 点击事件
+     */
+    onClick?: () => void;
+    /**
+     * 自定义类名
+     */
+    className?: string;
+}
+declare const StackedIcon: React.FC<StackedIconProps>;
+export default StackedIcon;

package/dist/components/desktop/drag-styles.d.ts

@@ -0,0 +1,74 @@
+/**
+ * 统一的拖拽容器样式
+ * iOS风格的拖拽区域样式，包含毛玻璃效果和过渡动画
+ */
+export declare const dragContainerStyle: string;
+/**
+ * 主要拖拽容器样式（用于sortable组件）
+ * 针对主界面的拖拽区域优化
+ */
+export declare const mainDragContainerStyle: string;
+/**
+ * 拖拽幽灵元素样式
+ * 增强版的ghostClass，提供更好的iOS风格视觉反馈
+ */
+export declare const enhancedGhostClass: string;
+/**
+ * 拖拽区域悬停效果
+ * 当拖拽元素进入可放置区域时的样式
+ */
+export declare const dragDropZoneStyle: string;
+/**
+ * 拖拽状态指示器样式
+ * 显示当前拖拽状态的视觉指示器
+ */
+export declare const dragStatusIndicatorStyle: string;
+/**
+ * 通用拖拽配置
+ * 统一的拖拽配置选项，确保一致的交互体验
+ */
+export declare const commonDragConfig: {
+    animation: number;
+    easing: string;
+    fallbackOnBody: boolean;
+    swapThreshold: number;
+    ghostClass: string;
+    chosenClass: string;
+    dragClass: string;
+    fallbackClass: string;
+};
+/**
+ * 模态框特定的拖拽配置
+ * 针对模态框内的拖拽操作优化的配置
+ */
+export declare const modalDragConfig: {
+    group: {
+        name: string;
+        pull: boolean;
+        put: boolean;
+    };
+    animation: number;
+    easing: string;
+    fallbackOnBody: boolean;
+    swapThreshold: number;
+    ghostClass: string;
+    chosenClass: string;
+    dragClass: string;
+    fallbackClass: string;
+};
+/**
+ * 主界面拖拽配置
+ * 针对主界面拖拽操作优化的配置
+ */
+export declare const mainDragConfig: {
+    swapThreshold: number;
+    filter: string;
+    animation: number;
+    easing: string;
+    fallbackOnBody: boolean;
+    ghostClass: string;
+    chosenClass: string;
+    dragClass: string;
+    fallbackClass: string;
+    group: string;
+};

package/dist/components/desktop/drag-trigger-pagination.d.ts

@@ -0,0 +1,44 @@
+import { default as React } from 'react';
+import { default as Slider } from 'react-slick';
+export interface DragTriggerPaginationRef {
+    handleDragMove: (e: React.DragEvent) => void;
+}
+export interface DragTriggerPaginationProps {
+    /**
+     * Slider 实例引用
+     */
+    sliderRef: React.RefObject<Slider>;
+    /**
+     * 当前激活的幻灯片索引
+     */
+    activeSlide: number;
+    /**
+     * 总页数
+     */
+    totalSlides: number;
+    /**
+     * 是否正在拖拽
+     */
+    isDragging: boolean;
+    /**
+     * 拖拽触发延迟时间（毫秒）
+     * @default 800
+     */
+    triggerDelay?: number;
+    /**
+     * 触发区域宽度（像素）
+     * @default 80
+     */
+    triggerZoneWidth?: number;
+    /**
+     * 容器引用
+     */
+    containerRef: React.RefObject<HTMLDivElement>;
+    /**
+     * 创建新页面的回调函数
+     */
+    onCreateNewPage?: () => void;
+}
+declare const DragTriggerPagination: React.ForwardRefExoticComponent<DragTriggerPaginationProps & React.RefAttributes<DragTriggerPaginationRef>>;
+export default DragTriggerPagination;
+export { DragTriggerPagination };

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

@@ -3,6 +3,10 @@ import { SortableProps } from './sortable';
 import { SortableConfigProviderProps, SortableConfig } from './context/config/context';
 import { SortableStateProviderProps, SortableState } from './context/state/context';
 export interface DesktopProps<D = any, C = any> extends SortableProps<D, C>, Omit<SortableStateProviderProps<D, C>, "children">, Omit<SortableConfigProviderProps<D, C>, "children"> {
+    /** 类型配置映射表，用于定义不同类型的默认配置 */
+    typeConfigMap?: import('./types').TypeConfigMap;
+    /** dataType菜单配置映射表，用于定义不同dataType的菜单项 */
+    dataTypeMenuConfigMap?: import('./types').DataTypeMenuConfigMap;
 }
 export interface DesktopHandle<D = any, C = any> {
     state: SortableState;
@@ -11,4 +15,10 @@ export interface DesktopHandle<D = any, C = any> {
 declare const Desktop: <D = any, C = any>(props: DesktopProps<D, C> & {
     ref?: React.ForwardedRef<DesktopHandle<D, C>>;
 }) => JSX.Element;
+export type { SortItem, ListItem, SortItemBaseConfig, SortItemBaseData, SortItemDefaultConfig, SortItemUserConfig, SortableItemData, TypeConfigMap, SizeConfig, MenuItemConfig, DataTypeMenuConfigMap, } from './types';
+export { appDefaultConfig as desktopAppDefaultConfig, groupDefaultConfig as desktopGroupDefaultConfig, builtinConfigMap as desktopBuiltinConfigMap, getDefaultConfig as getDesktopDefaultConfig, commonSizeConfigs as desktopCommonSizeConfigs, getSizeConfig as getDesktopSizeConfig, getItemSize as getDesktopItemSize, getDataTypeMenuConfig as getDesktopDataTypeMenuConfig, } from './config';
+export type { Theme, ThemeType } from './themes';
+export { themeLight as desktopThemeLight, themeDark as desktopThemeDark, defaultTheme as desktopDefaultTheme, themes as desktopThemes, } from './themes';
+export { Dock, LaunchpadModal, LaunchpadButton } from './dock';
+export type { DockProps, LaunchpadModalProps, LaunchpadButtonProps } from './dock';
 export default Desktop;

package/dist/components/desktop/items/item-name.d.ts

@@ -0,0 +1,10 @@
+import { SortItem } from '../types';
+export interface ItemNameProps<D, C> {
+    data: SortItem<D, C>;
+    noLetters?: boolean;
+    name?: string;
+    defaultName?: string;
+    className?: string;
+}
+declare const ItemName: <D, C>(props: ItemNameProps<D, C>) => import("react/jsx-runtime").JSX.Element;
+export default ItemName;

package/dist/components/desktop/items/modal/editable-title.d.ts

@@ -0,0 +1,9 @@
+import { FC } from 'react';
+interface EditableTitleProps {
+    value: string;
+    onChange: (value: string) => void;
+    onBlur?: () => void;
+    placeholder?: string;
+}
+declare const EditableTitle: FC<EditableTitleProps>;
+export default EditableTitle;

package/dist/components/desktop/items/modal/index.d.ts

@@ -0,0 +1,3 @@
+export { default as EditableTitle } from './editable-title';
+export { default as GroupItemModal } from './group-item-modal';
+export { default as ItemInfoModal } from './info-modal';

package/dist/components/desktop/items/sortable-item.d.ts

@@ -13,6 +13,10 @@ export interface SortableItemProps<D, C> {
     childrenLength?: number;
     contextMenuProps?: false | Partial<ContextMenuProps<D, C>>;
     icon?: React.ReactNode;
+    /**
+     * 来源 当前仅支持 dock
+     */
+    from?: string;
 }
 export declare const SortableItemDefaultContent: <D, C>(props: SortableItemProps<D, C>) => import("react/jsx-runtime").JSX.Element;
 declare const SortableItem: <D, C>(props: SortableItemProps<D, C>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/desktop/modal/base-modal.d.ts

@@ -0,0 +1,17 @@
+import { ReactNode } from 'react';
+interface BaseModalProps {
+    visible: boolean;
+    onClose: () => void;
+    title?: ReactNode;
+    children?: ReactNode;
+    width?: number;
+    mousePosition?: {
+        x: number;
+        y: number;
+    } | null;
+    destroyOnClose?: boolean;
+    closable?: boolean;
+    footer?: ReactNode;
+}
+declare const BaseModal: (props: BaseModalProps) => import("react/jsx-runtime").JSX.Element;
+export default BaseModal;

package/dist/components/desktop/modal/index.d.ts

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

package/dist/components/desktop/pagination/index.d.ts

@@ -0,0 +1,33 @@
+import { default as React } from 'react';
+export interface PaginationProps {
+    /**
+     * 当前活跃的页面索引
+     */
+    activeSlide: number;
+    /**
+     * 拖拽进入分页点的回调
+     */
+    onDragEnter: (index: number) => void;
+    /**
+     * 点击分页点的回调
+     */
+    onClick?: (index: number) => void;
+    /**
+     * 自定义分页点容器构建器
+     */
+    pagingDotsBuilder?: (dots: React.ReactNode[]) => React.ReactNode;
+    /**
+     * react-slick 生成的分页点数组
+     */
+    slickDots: React.ReactNode[];
+    /**
+     * 是否禁用分页显示
+     */
+    disabled?: boolean;
+    /**
+     * 额外的CSS类名
+     */
+    className?: string;
+}
+declare const Pagination: ({ pagingDotsBuilder, slickDots, disabled, className }: PaginationProps) => import("react/jsx-runtime").JSX.Element;
+export default Pagination;

package/dist/components/desktop/pagination/utils.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+import { ListItem } from '../types';
+export declare const createCustomPagingDot: <D, C>(list: ListItem<D, C>[], activeSlide: number, pagingDotBuilder?: (item: ListItem<D, C>, index: number, isActive: boolean) => React.ReactElement) => (index: number) => React.ReactElement;

package/dist/components/desktop/sortable.d.ts

@@ -1,6 +1,7 @@
 import { default as React } from 'react';
 import { default as Slider, Settings } from 'react-slick';
 import { SortItem } from './types';
+import { DockProps } from './dock/dock';
 export interface Pagination {
     position?: "top" | "bottom" | "left" | "right";
 }
@@ -30,6 +31,39 @@ export interface SortableProps<D, C> {
      * 自定义额外项目，将显示在子项列表末尾
      */
     extraItems?: (listItem: SortItem<D, C>) => React.ReactNode;
+    /**
+     * dock 配置
+     */
+    dock?: {
+        /**
+         * 是否显示 dock
+         */
+        enabled?: boolean;
+        /**
+         * dock 位置
+         */
+        position?: "top" | "bottom" | "left" | "right";
+        /**
+         * dock 样式类名
+         */
+        className?: string;
+        /**
+         * 自定义 dock 项目渲染
+         */
+        itemBuilder?: DockProps["itemBuilder"];
+        /**
+         * 自定义固定项目渲染
+         */
+        fixedItemBuilder?: DockProps["fixedItemBuilder"];
+        /**
+         * 固定项目列表（在sortable之前显示，不可拖拽排序）
+         */
+        fixedItems?: DockProps["fixedItems"];
+        /**
+         * 是否显示启动台按钮
+         */
+        showLaunchpad?: boolean;
+    };
 }
 declare const Sortable: <D, C>(props: SortableProps<D, C>) => import("react/jsx-runtime").JSX.Element;
 export default Sortable;

package/dist/components/desktop/themes/dark.d.ts

@@ -0,0 +1,2 @@
+import { Theme } from '.';
+export declare const themeDark: Theme;

package/dist/components/desktop/themes/index.d.ts

@@ -0,0 +1,42 @@
+import { themeDark } from './dark';
+import { themeLight } from './light';
+export interface DockTheme {
+    backgroundColor?: string;
+    borderColor?: string;
+    boxShadowColor?: string;
+    divider?: {
+        color?: string;
+    };
+}
+export interface LaunchpadTheme {
+    button?: {
+        backgroundColor?: string;
+        subBackgroundColor?: string;
+        thirdBackgroundColor?: string;
+        borderColor?: string;
+        hoverBackgroundColor?: string;
+    };
+    modal?: {};
+}
+export interface Theme {
+    token: {
+        itemNameColor?: string;
+        itemIconBackgroundColor?: string;
+        itemIconShadowColor?: string;
+        groupItemIconBackgroundColor?: string;
+        groupItemIconShadowColor?: string;
+        groupItemModalBackgroundColor?: string;
+        contextMenuTextColor?: string;
+        contextMenuActiveColor?: string;
+        contextMenuBackgroundColor?: string;
+        contextMenuShadowColor?: string;
+        dock?: DockTheme;
+    };
+}
+export declare const defaultTheme: Theme;
+export declare const themes: {
+    light: Theme;
+    dark: Theme;
+};
+export type ThemeType = keyof typeof themes;
+export { themeLight, themeDark };

package/dist/components/desktop/themes/light.d.ts

@@ -0,0 +1,2 @@
+import { Theme } from '.';
+export declare const themeLight: Theme;