@whitesev/pops 3.2.1 → 3.3.0

package/src/components/panel/types/components-select.ts

@@ -1,169 +1,169 @@
-import type { PopsPanelGeneralConfig } from "./components-common";
-import type { PopsPanelContainerConfig } from "./components-container";
-import type { PopsPanelViewConfig } from ".";
-import type { PopsAlertConfig } from "../../alert/types";
-export type PopsPanelSelectMode = "native" | "dialog" | "horizontal";
-
-/**
- * 分组配置
- *
- * 用在mode="dialog"里
- */
-export type PopsPanelSelectDialogGroupOption<T> = {
-  /**
-   * 是否是分组
-   * @default false
-   *
-   * + true 这时候text的值是显示的分组名，value是可以忽略的
-   */
-  isGroup?: boolean;
-  /**
-   * 分组内部选择是否是单选
-   * @default false
-   */
-  isSingleSelect?: boolean;
-  /**
-   * 分组数据列表
-   *
-   * 该数据仅在mode === "dialog"下生效
-   * @default []
-   */
-  groupDataOptions?: IFunction<Omit<PopsPanelSelectDataOption<T>, keyof PopsPanelSelectDialogGroupOption<T>>[]>;
-};
-/**
- * 选择项的配置数据
- */
-export type PopsPanelSelectDataOption<T> = {
-  /**
-   * 真正的值
-   */
-  value: T;
-  /**
-   * 显示的文字
-   */
-  text:
-    | string
-    | ((
-        /** 当前的值 */
-        value: T,
-        /**当前选中的配置信息 */
-        selectedInfo?: PopsPanelSelectDataOption<T>
-      ) => string);
-  /**
-   * 显示的文字是否是html
-   * @default false
-   */
-  isHTML?: boolean;
-  /**
-   * （可选）是否禁用项
-   * 触发条件：
-   * + 点击select元素
-   * + select元素触发change事件
-   * @param value 当前的值
-   * @param selectedInfo 当前选中的配置信息
-   */
-  disable?(value: T, selectedInfo?: PopsPanelSelectDataOption<T>): boolean;
-  /**
-   * 子配置，跟随切换改变
-   *
-   * 选中项后，根据配置添加到页面中
-   */
-  views?: IFunction<(PopsPanelContainerConfig | PopsPanelViewConfig)[]>;
-  /**
-   * （可选）是否是自定义输入的内容
-   * @default false
-   */
-  addCustomInput?: boolean;
-  /**
-   * （可选）自定义输入内容存储的key
-   *
-   * 该属性内部未做处理，仅为传递作用
-   */
-  customInputStoreKey?: string;
-  /**
-   * （可选）校验自定义输入内容
-   * @default () => {valid: true}
-   */
-  onValid?(dataOption: PopsPanelSelectDataOption<T>): {
-    /**
-     *
-     * + true: 校验通过
-     * + false: 校验失败，阻止关闭弹窗
-     */
-    valid: boolean;
-    message?: string;
-  };
-};
-/**
- * pops.panel的 select
- */
-export interface PopsPanelSelectConfig<T = any> extends PopsPanelGeneralConfig<PopsPanelSelectConfig<T>> {
-  /**
-   * 组件类型
-   */
-  type: "select";
-  /**
-   * 显示在左边的文字
-   */
-  text: string;
-  /**
-   * （可选）左边的文字下面的描述
-   * @default ""
-   */
-  description?: string;
-  /**
-   * （可选）是否禁用
-   * @default false
-   */
-  disabled?: IFunction<boolean>;
-  /**
-   * 提示文字
-   */
-  placeholder?: IFunction<string>;
-  /**
-   * 已选中文字的显示文字的对齐方式
-   *
-   * 也包括提示文字的对齐方式
-   * @default "left"
-   */
-  selectedTextAlign?: "left" | "center" | "right";
-  /**
-   * 获取该项的值的回调函数
-   */
-  getValue(): T;
-  /**
-   * 选择器的值改变触发的回调函数
-   * @param isSelectedInfo 当前已选中的信息，可能为空
-   */
-  callback?(isSelectedInfo?: PopsPanelSelectDataOption<T>): void;
-  /**
-   * 点击select元素触发该回调
-   * @param event 点击事件
-   * @param selectElement 当前的select元素
-   * @returns
-   * + false 阻止更新状态
-   */
-  clickCallBack?(
-    event: PointerEvent | MouseEvent,
-    /** 当前已选中的信息 */
-    isSelectedInfo: PopsPanelSelectDataOption<T>
-  ): void | boolean;
-  /**
-   * 选择列表内的数据
-   */
-  data: IFunction<PopsPanelSelectDataOption<T>[]>;
-  /**
-   * 显示模式
-   * @default "native"
-   */
-  mode?: PopsPanelSelectMode;
-  /**
-   * 宽度
-   * @default "200px"
-   */
-  width?: number | string;
-  /**
-   * 弹出的下拉列表弹窗的配置
-   */
-  selectConfirmDialogConfig?: Partial<PopsAlertConfig>;
-}
+import type { PopsPanelGeneralConfig } from "./components-common";
+import type { PopsPanelContainerConfig } from "./components-container";
+import type { PopsPanelViewConfig } from ".";
+import type { PopsAlertConfig } from "../../alert/types";
+export type PopsPanelSelectMode = "native" | "dialog" | "horizontal";
+
+/**
+ * 分组配置
+ *
+ * 用在mode="dialog"里
+ */
+export type PopsPanelSelectDialogGroupOption<T> = {
+  /**
+   * 是否是分组
+   * @default false
+   *
+   * + true 这时候text的值是显示的分组名，value是可以忽略的
+   */
+  isGroup?: boolean;
+  /**
+   * 分组内部选择是否是单选
+   * @default false
+   */
+  isSingleSelect?: boolean;
+  /**
+   * 分组数据列表
+   *
+   * 该数据仅在mode === "dialog"下生效
+   * @default []
+   */
+  groupDataOptions?: IFunction<Omit<PopsPanelSelectDataOption<T>, keyof PopsPanelSelectDialogGroupOption<T>>[]>;
+};
+/**
+ * 选择项的配置数据
+ */
+export type PopsPanelSelectDataOption<T> = {
+  /**
+   * 真正的值
+   */
+  value: T;
+  /**
+   * 显示的文字
+   */
+  text:
+    | string
+    | ((
+        /** 当前的值 */
+        value: T,
+        /**当前选中的配置信息 */
+        selectedInfo?: PopsPanelSelectDataOption<T>
+      ) => string);
+  /**
+   * 显示的文字是否是html
+   * @default false
+   */
+  isHTML?: boolean;
+  /**
+   * （可选）是否禁用项
+   * 触发条件：
+   * + 点击select元素
+   * + select元素触发change事件
+   * @param value 当前的值
+   * @param selectedInfo 当前选中的配置信息
+   */
+  disable?(value: T, selectedInfo?: PopsPanelSelectDataOption<T>): boolean;
+  /**
+   * 子配置，跟随切换改变
+   *
+   * 选中项后，根据配置添加到页面中
+   */
+  views?: IFunction<(PopsPanelContainerConfig | PopsPanelViewConfig)[]>;
+  /**
+   * （可选）是否是自定义输入的内容
+   * @default false
+   */
+  addCustomInput?: boolean;
+  /**
+   * （可选）自定义输入内容存储的key
+   *
+   * 该属性内部未做处理，仅为传递作用
+   */
+  customInputStoreKey?: string;
+  /**
+   * （可选）校验自定义输入内容
+   * @default () => {valid: true}
+   */
+  onValid?(dataOption: PopsPanelSelectDataOption<T>): {
+    /**
+     *
+     * + true: 校验通过
+     * + false: 校验失败，阻止关闭弹窗
+     */
+    valid: boolean;
+    message?: string;
+  };
+};
+/**
+ * pops.panel的 select
+ */
+export interface PopsPanelSelectConfig<T = any> extends PopsPanelGeneralConfig<PopsPanelSelectConfig<T>> {
+  /**
+   * 组件类型
+   */
+  type: "select";
+  /**
+   * 显示在左边的文字
+   */
+  text: string;
+  /**
+   * （可选）左边的文字下面的描述
+   * @default ""
+   */
+  description?: string;
+  /**
+   * （可选）是否禁用
+   * @default false
+   */
+  disabled?: IFunction<boolean>;
+  /**
+   * 提示文字
+   */
+  placeholder?: IFunction<string>;
+  /**
+   * 已选中文字的显示文字的对齐方式
+   *
+   * 也包括提示文字的对齐方式
+   * @default "left"
+   */
+  selectedTextAlign?: "left" | "center" | "right";
+  /**
+   * 获取该项的值的回调函数
+   */
+  getValue(): T;
+  /**
+   * 选择器的值改变触发的回调函数
+   * @param isSelectedInfo 当前已选中的信息，可能为空
+   */
+  callback?(isSelectedInfo?: PopsPanelSelectDataOption<T>): void;
+  /**
+   * 点击select元素触发该回调
+   * @param event 点击事件
+   * @param selectElement 当前的select元素
+   * @returns
+   * + false 阻止更新状态
+   */
+  clickCallBack?(
+    event: PointerEvent | MouseEvent,
+    /** 当前已选中的信息 */
+    isSelectedInfo: PopsPanelSelectDataOption<T>
+  ): void | boolean;
+  /**
+   * 选择列表内的数据
+   */
+  data: IFunction<PopsPanelSelectDataOption<T>[]>;
+  /**
+   * 显示模式
+   * @default "native"
+   */
+  mode?: PopsPanelSelectMode;
+  /**
+   * 宽度
+   * @default "200px"
+   */
+  width?: number | string;
+  /**
+   * 弹出的下拉列表弹窗的配置
+   */
+  selectConfirmDialogConfig?: Partial<PopsAlertConfig>;
+}

package/src/components/panel/types/components-selectMultiple.ts

@@ -1,104 +1,105 @@
-import type { PopsAlertConfig } from "../../alert/types";
-import type { PopsPanelGeneralConfig } from "./components-common";
-
-export interface PopsPanelSelectMultipleDataOption<T> {
-  /**
-   * 真正的值
-   */
-  value: T;
-  /**
-   * 显示的文字
-   */
-  text:
-    | string
-    | ((
-        /** 当前的值 */
-        value: T,
-        /** 所有选中的配置信息 */
-        allSelectedInfo: PopsPanelSelectMultipleDataOption<T>[]
-      ) => string);
-  /**
-   * 显示的文字是否是html
-   * @default false
-   */
-  isHTML?: boolean;
-  /**
-   * （可选）是否禁用项
-   * 触发条件：
-   * + 点击select元素
-   * + select元素触发change事件
-   * @param value 当前的值
-   * @param allSelectedInfo 所有选中的配置信息
-   */
-  disable?(value: T, allSelectedInfo: PopsPanelSelectMultipleDataOption<T>[]): boolean;
-}
-/**
- * pops.panel的 select
- */
-export interface PopsPanelSelectMultipleConfig<T = any>
-  extends PopsPanelGeneralConfig<PopsPanelSelectMultipleConfig<T>> {
-  /**
-   * 组件类型
-   */
-  type: "select-multiple";
-  /**
-   * 显示在左边的文字
-   */
-  text: string;
-  /**
-   * （可选）左边的文字下面的描述
-   */
-  description?: string;
-  /**
-   * （可选）是否禁用
-   */
-  disabled?: boolean | (() => boolean);
-  /**
-   * 提示文字
-   */
-  placeholder?: string | (() => string);
-  /**
-   * 获取该项的值的回调函数
-   */
-  getValue(): T[];
-  /**
-   * 选择器的值改变触发的回调函数
-   * @param isSelectedInfo 当前已选中的信息
-   */
-  callback?(isSelectedInfo: PopsPanelSelectMultipleDataOption<T>[]): void;
-  /**
-   * 点击某个项的元素触发该回调
-   * @param event 点击事件
-   * @returns 如果返回boolean为false，则不会触发默认的点击事件
-   */
-  clickCallBack?(
-    event: PointerEvent | MouseEvent,
-    /** 当前已选中的信息 */
-    isSelectedInfo: PopsPanelSelectMultipleDataOption<T>[]
-  ): void | boolean;
-  /**
-   * 点击标签tag的关闭图标触发该回调
-   * 如果返回boolean类型且为false，则阻止默认的事件
-   */
-  closeIconClickCallBack?: (
-    event: PointerEvent | MouseEvent,
-    data: {
-      /** 标签元素 */
-      $tag: HTMLElement;
-      /** 关闭图标元素 */
-      $closeIcon: HTMLElement;
-      /** 值 */
-      value: T;
-      /** 显示的文字 */
-      text: PopsPanelSelectMultipleDataOption<T>["text"];
-    }
-  ) => void | boolean;
-  /**
-   * 选择列表内的数据
-   */
-  data: PopsPanelSelectMultipleDataOption<T>[];
-  /**
-   * 弹出的下拉列表弹窗的配置
-   */
-  selectConfirmDialogConfig?: Partial<PopsAlertConfig>;
-}
+import type { PopsAlertConfig } from "../../alert/types";
+import type { PopsPanelGeneralConfig } from "./components-common";
+
+export interface PopsPanelSelectMultipleDataOption<T> {
+  /**
+   * 真正的值
+   */
+  value: T;
+  /**
+   * 显示的文字
+   */
+  text:
+    | string
+    | ((
+        /** 当前的值 */
+        value: T,
+        /** 所有选中的配置信息 */
+        allSelectedInfo: PopsPanelSelectMultipleDataOption<T>[]
+      ) => string);
+  /**
+   * 显示的文字是否是html
+   * @default false
+   */
+  isHTML?: boolean;
+  /**
+   * （可选）是否禁用项
+   * 触发条件：
+   * + 点击select元素
+   * + select元素触发change事件
+   * @param value 当前的值
+   * @param allSelectedInfo 所有选中的配置信息
+   */
+  disable?(value: T, allSelectedInfo: PopsPanelSelectMultipleDataOption<T>[]): boolean;
+}
+/**
+ * pops.panel的 select
+ */
+export interface PopsPanelSelectMultipleConfig<T = any> extends PopsPanelGeneralConfig<
+  PopsPanelSelectMultipleConfig<T>
+> {
+  /**
+   * 组件类型
+   */
+  type: "select-multiple";
+  /**
+   * 显示在左边的文字
+   */
+  text: string;
+  /**
+   * （可选）左边的文字下面的描述
+   */
+  description?: string;
+  /**
+   * （可选）是否禁用
+   */
+  disabled?: boolean | (() => boolean);
+  /**
+   * 提示文字
+   */
+  placeholder?: string | (() => string);
+  /**
+   * 获取该项的值的回调函数
+   */
+  getValue(): T[];
+  /**
+   * 选择器的值改变触发的回调函数
+   * @param isSelectedInfo 当前已选中的信息
+   */
+  callback?(isSelectedInfo: PopsPanelSelectMultipleDataOption<T>[]): void;
+  /**
+   * 点击某个项的元素触发该回调
+   * @param event 点击事件
+   * @returns 如果返回boolean为false，则不会触发默认的点击事件
+   */
+  clickCallBack?(
+    event: PointerEvent | MouseEvent,
+    /** 当前已选中的信息 */
+    isSelectedInfo: PopsPanelSelectMultipleDataOption<T>[]
+  ): void | boolean;
+  /**
+   * 点击标签tag的关闭图标触发该回调
+   * 如果返回boolean类型且为false，则阻止默认的事件
+   */
+  closeIconClickCallBack?: (
+    event: PointerEvent | MouseEvent,
+    data: {
+      /** 标签元素 */
+      $tag: HTMLElement;
+      /** 关闭图标元素 */
+      $closeIcon: HTMLElement;
+      /** 值 */
+      value: T;
+      /** 显示的文字 */
+      text: PopsPanelSelectMultipleDataOption<T>["text"];
+    }
+  ) => void | boolean;
+  /**
+   * 选择列表内的数据
+   */
+  data: PopsPanelSelectMultipleDataOption<T>[];
+  /**
+   * 弹出的下拉列表弹窗的配置
+   */
+  selectConfirmDialogConfig?: Partial<PopsAlertConfig>;
+}

package/src/components/panel/types/components-slider.ts

@@ -1,55 +1,55 @@
-import type { PopsPanelGeneralConfig } from "./components-common";
-
-/**
- * pops.panel的 slider
- */
-export interface PopsPanelSliderConfig extends PopsPanelGeneralConfig<PopsPanelSliderConfig> {
-  /**
-   * 组件类型
-   */
-  type: "slider";
-  /**
-   * 显示在左边的文字
-   */
-  text: string;
-  /**
-   * （可选）左边的文字下面的描述
-   * @default ""
-   */
-  description?: string;
-  /**
-   * （可选）是否禁用
-   * @default false
-   */
-  disabled?: boolean | (() => boolean);
-  /**
-   * 是否显示滑块的hover提示
-   * @default true
-   */
-  isShowHoverTip?: boolean | (() => boolean);
-  /**
-   * 获取该项的值的回调函数
-   */
-  getValue(): number;
-  /**
-   * 滑块的值改变触发的回调函数
-   */
-  callback(event: InputEvent, value: number): void;
-  /**
-   * 获取tooltip的提示内容，可自定义，默认为slider的值
-   */
-  getToolTipContent?(value: number): string;
-  /**
-   * 滑块的最小值
-   */
-  min: number;
-  /**
-   * 滑块的最大值
-   */
-  max: number;
-  /**
-   * （可选）每次滑动的间隔值
-   * @default 1
-   */
-  step?: number;
-}
+import type { PopsPanelGeneralConfig } from "./components-common";
+
+/**
+ * pops.panel的 slider
+ */
+export interface PopsPanelSliderConfig extends PopsPanelGeneralConfig<PopsPanelSliderConfig> {
+  /**
+   * 组件类型
+   */
+  type: "slider";
+  /**
+   * 显示在左边的文字
+   */
+  text: string;
+  /**
+   * （可选）左边的文字下面的描述
+   * @default ""
+   */
+  description?: string;
+  /**
+   * （可选）是否禁用
+   * @default false
+   */
+  disabled?: boolean | (() => boolean);
+  /**
+   * 是否显示滑块的hover提示
+   * @default true
+   */
+  isShowHoverTip?: boolean | (() => boolean);
+  /**
+   * 获取该项的值的回调函数
+   */
+  getValue(): number;
+  /**
+   * 滑块的值改变触发的回调函数
+   */
+  callback(event: InputEvent, value: number): void;
+  /**
+   * 获取tooltip的提示内容，可自定义，默认为slider的值
+   */
+  getToolTipContent?(value: number): string;
+  /**
+   * 滑块的最小值
+   */
+  min: number;
+  /**
+   * 滑块的最大值
+   */
+  max: number;
+  /**
+   * （可选）每次滑动的间隔值
+   * @default 1
+   */
+  step?: number;
+}