@fairys/taro-tools-simple-form 0.0.2 → 0.0.3

package/esm/components/popup.search/index.js

@@ -0,0 +1,157 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Text, View } from "@tarojs/components";
+import { Popup } from "@nutui/nutui-react-taro";
+import { Fragment, useEffect, useMemo } from "react";
+import { FairysTaroPopupSearchBaseInstanceContext, useFairysTaroPopupSearchBaseInstance, useFairysTaroPopupSearchBaseInstanceContext } from "./instance.js";
+import { FairysTaroPopupSearchFooterBase, FairysTaroPopupSearchInputBase } from "./base.js";
+import { FairysTaroPopupSearchListVirtual } from "./list.virtual.js";
+import { FairysTaroPopupSearchListTable } from "./list.table.js";
+import { FairysTaroTextClearBase } from "../clear/index.js";
+function RenderList() {
+    const [state, instance] = useFairysTaroPopupSearchBaseInstanceContext();
+    const renderList = instance.renderList;
+    const _tempFilterDataList = state._tempFilterDataList;
+    const operationStatus = state.operationStatus;
+    return renderList?.(_tempFilterDataList || [], operationStatus, instance) || /*#__PURE__*/ jsx(Fragment, {});
+}
+function FairysTaroPopupSearchBodyBase() {
+    const [state, instance] = useFairysTaroPopupSearchBaseInstanceContext();
+    const renderType = instance.renderType;
+    const showSearch = instance.showSearch;
+    const mode = instance.mode;
+    const columns = instance.columns;
+    const options = instance.options;
+    const isNeedManage = instance.isNeedManage;
+    const value = instance.value;
+    const visible = state.visible;
+    useMemo(()=>{
+        if (isNeedManage || instance.isUseOptions()) instance.updateState({
+            value,
+            _tempValue: value
+        });
+        else instance.updateState({
+            value,
+            _tempValue: void 0
+        });
+    }, [
+        value,
+        isNeedManage,
+        visible
+    ]);
+    useMemo(()=>instance.updateState({
+            dataList: options || [],
+            _tempFilterDataList: options || []
+        }), [
+        options
+    ]);
+    useMemo(()=>instance.updateState({
+            mode
+        }), [
+        mode
+    ]);
+    useMemo(()=>instance.updateState({
+            columns
+        }), [
+        columns
+    ]);
+    useEffect(()=>{
+        if (visible && 'function' == typeof instance.onLoadData) instance.onSearch('');
+    }, [
+        visible
+    ]);
+    return /*#__PURE__*/ jsxs(View, {
+        className: "fairys-taro-popup-search-content-inner fairystaroform__flex  fairystaroform__flex-1  fairystaroform__flex-col fairystaroform__overflow-hidden",
+        children: [
+            showSearch ? /*#__PURE__*/ jsx(FairysTaroPopupSearchInputBase, {}) : /*#__PURE__*/ jsx(Fragment, {}),
+            /*#__PURE__*/ jsx(View, {
+                style: {
+                    flex: 1,
+                    overflow: 'hidden'
+                },
+                children: 'list' === renderType ? /*#__PURE__*/ jsx(FairysTaroPopupSearchListVirtual, {}) : 'table' === renderType ? /*#__PURE__*/ jsx(FairysTaroPopupSearchListTable, {}) : 'custom' === renderType ? /*#__PURE__*/ jsx(RenderList, {}) : /*#__PURE__*/ jsx(Fragment, {})
+            }),
+            'multiple' === mode ? /*#__PURE__*/ jsx(FairysTaroPopupSearchFooterBase, {}) : /*#__PURE__*/ jsx(Fragment, {})
+        ]
+    });
+}
+function FairysTaroPopupSearchBase(props) {
+    const { placeholder = "\u8BF7\u9009\u62E9", className, style, value, onChange, onLoadData, otherRequestParams, maxWidth, maxHeight, renderText, renderListItemText, showRowDeleteButton = true, showSearch = true, renderList, options, columns, mode = 'single', rowKey = 'value', displayField = 'label', renderType = 'list', maxTagCount = 9, tableProps = {}, useTableProps, isNeedManage = false, isUseOptionsChecked = true, ...rest } = props;
+    const [state, instance] = useFairysTaroPopupSearchBaseInstance();
+    instance.maxWidth = maxWidth;
+    instance.maxHeight = maxHeight;
+    instance.renderText = renderText;
+    instance.renderList = renderList;
+    instance.onLoadData = onLoadData;
+    instance.otherRequestParams = otherRequestParams;
+    instance.onChange = onChange;
+    instance.renderListItemText = renderListItemText;
+    instance.tableProps = tableProps;
+    instance.useTableProps = useTableProps;
+    instance.isNeedManage = isNeedManage;
+    instance.isUseOptionsChecked = isUseOptionsChecked;
+    instance.rowKey = rowKey;
+    instance.displayField = displayField;
+    instance.mode = mode;
+    instance.columns = columns;
+    instance.renderType = renderType;
+    instance.showRowDeleteButton = showRowDeleteButton;
+    instance.showSearch = showSearch;
+    instance.maxTagCount = maxTagCount;
+    instance.options = options;
+    instance.value = value;
+    const operationStatus = state.operationStatus;
+    const visible = state.visible;
+    useMemo(()=>instance.ctor(), [
+        maxWidth,
+        maxHeight
+    ]);
+    const renderTextValue = useMemo(()=>{
+        if (instance.renderText) return instance.renderText(value, instance);
+        if ('multiple' === instance.mode) {
+            if (Array.isArray(value)) {
+                if (value.length > maxTagCount) return `${value.slice(0, maxTagCount).map((item)=>item[instance.displayField]).join(',')}...`;
+                return value.map((item)=>item[instance.displayField]).join(',');
+            }
+            return '';
+        }
+        return value?.[instance.displayField];
+    }, [
+        value,
+        mode,
+        maxTagCount
+    ]);
+    return /*#__PURE__*/ jsxs(View, {
+        className: `fairys-taro-popup-search ${className || ''}`,
+        style: style,
+        children: [
+            /*#__PURE__*/ jsx(FairysTaroTextClearBase, {
+                warpClassName: "fairys-taro-popup-search-text-container",
+                isValue: !!renderTextValue,
+                onTextClick: ()=>instance.updateState({
+                        visible: true
+                    }),
+                onClearClick: ()=>onChange?.(void 0),
+                children: renderTextValue || placeholder
+            }),
+            /*#__PURE__*/ jsx(Popup, {
+                lockScroll: true,
+                position: "bottom",
+                closeable: true,
+                ...rest,
+                left: 'multiple' === mode && isNeedManage ? /*#__PURE__*/ jsx(Text, {
+                    onClick: instance.updateOperationStatus,
+                    children: 'select' == operationStatus ? "\u7BA1\u7406" : "\u5B8C\u6210"
+                }) : /*#__PURE__*/ jsx(Fragment, {}),
+                visible: visible,
+                onClose: instance.onClose,
+                overlayClassName: "fairys-taro-popup-search-overlay",
+                className: "fairys-taro-popup-search-content fairystaroform__flex fairystaroform__flex-col fairystaroform__overflow-hidden",
+                children: /*#__PURE__*/ jsx(FairysTaroPopupSearchBaseInstanceContext.Provider, {
+                    value: instance,
+                    children: visible ? /*#__PURE__*/ jsx(FairysTaroPopupSearchBodyBase, {}) : /*#__PURE__*/ jsx(Fragment, {})
+                })
+            })
+        ]
+    });
+}
+export { FairysTaroPopupSearchBase };

package/esm/components/popup.search/instance.d.ts

@@ -0,0 +1,169 @@
+import { TableColumnProps, TaroTableProps } from '@nutui/nutui-react-taro';
+export declare class FairysTaroPopupSearchBaseInstanceMount<T = any> {
+    /**选中项改变时触发*/
+    onChange?: (value: T[] | T | undefined) => void;
+    onLoadData?: (params: any, instance: FairysTaroPopupSearchBaseInstanceMount<T>) => Promise<T[]>;
+    /**其他请求参数*/
+    otherRequestParams?: (params: any, instance: FairysTaroPopupSearchBaseInstanceMount<T>) => any;
+    /**自定义输入框显示文本*/
+    renderText?: (data: T | T[], instance: FairysTaroPopupSearchBaseInstanceMount<T>) => React.ReactNode;
+    /**自定义渲染列表项文本*/
+    renderListItemText?: (data: T, instance: FairysTaroPopupSearchBaseInstanceMount<T>) => React.ReactNode;
+    /**自定义渲染列表数据*/
+    renderList?: (dataList: T[], type: 'select' | 'manage', instance: FairysTaroPopupSearchBaseInstanceMount<T>) => React.ReactNode;
+    /**选择模式*/
+    mode?: 'multiple' | 'single';
+    /**列表项的唯一键值*/
+    rowKey?: string;
+    /**提示框 显示字段*/
+    displayField?: string;
+    /**列表列配置*/
+    columns?: TableColumnProps[];
+    /**最大弹窗宽度*/
+    maxWidth?: number;
+    /**最大弹窗高度*/
+    maxHeight?: number;
+    /**是否需要管理已选择的数据*/
+    isNeedManage?: boolean;
+    /**是否选中状态，在使用 options 参数渲染固定列数据的时候是否需要选中状态*/
+    isUseOptionsChecked?: boolean;
+    /**
+     * 渲染类型
+     * @default 'list'
+     * */
+    renderType?: 'list' | 'table' | 'custom';
+    /**表格属性*/
+    tableProps?: Partial<TaroTableProps>;
+    /**自定义表格属性*/
+    useTableProps?: (tableProps: Partial<TaroTableProps>, instance: FairysTaroPopupSearchBaseInstanceMount<T>) => Partial<TaroTableProps>;
+    /**是否显示删除按钮*/
+    showRowDeleteButton?: boolean;
+    /**是否显示搜索框*/
+    showSearch?: boolean;
+    /**选中项*/
+    value?: T | T[];
+    /**选择数据*/
+    options?: ({
+        label?: string;
+        value?: string | number;
+        [x: string]: any;
+    } & T)[];
+    /**
+     * 最大渲染个数数量
+     */
+    maxTagCount?: number;
+}
+export interface FairysTaroPopupSearchBaseInstanceState<T = any> {
+    /**无用默认值*/
+    __defaultValue: string;
+    visible: boolean;
+    /**选中项*/
+    value: T | T[] | undefined;
+    dataList: T[];
+    /**
+     * 临时过滤数据列表
+     * 使用 options 参数并且在 operationStatus = select 时使用，根据主键字段值和显示字段值进行过滤
+     * 在 operationStatus = manage 时，过滤 _tempValue 中的值，根据主键字段值和显示字段值进行过滤
+     */
+    _tempFilterDataList: T[];
+    search?: string;
+    /**
+     * 临时值(多选时使用)，用于临时存在，点击保存后赋值给 value
+     */
+    _tempValue: T | T[] | undefined;
+    /**操作状态
+     * @default 'select'
+     */
+    operationStatus: 'manage' | 'select';
+    /**选中列表数据*/
+    manageSelectedDataList: T[];
+    /**全选按钮是否选中状态*/
+    allChecked: boolean;
+    /**选择模式
+     * @default 'single'
+     */
+    mode?: 'multiple' | 'single';
+    /**列表列配置*/
+    columns?: TableColumnProps[];
+}
+export declare class FairysTaroPopupSearchBaseInstance<T = any> extends FairysTaroPopupSearchBaseInstanceMount<T> {
+    /**窗口高度*/
+    windowHeight: number;
+    /**窗口宽度*/
+    windowWidth: number;
+    /**弹窗宽度*/
+    popupWidth: number;
+    /**弹窗高度*/
+    popupHeight: number;
+    state: FairysTaroPopupSearchBaseInstanceState<T>;
+    ctor(): void;
+    /**更新状态*/
+    updateState: (state: Partial<typeof this.state>) => void;
+    /**判断是否使用 options 参数,并且不是管理模式*/
+    isUseOptions: () => boolean;
+    /**搜索*/
+    onSearch: (keyword: string) => Promise<void>;
+    /**保存数据*/
+    onSave: () => void;
+    /**清空数据*/
+    onClear: () => void;
+    /**是否选中数据*/
+    isCheckedData: (data: T) => boolean;
+    /**单个选中数据*/
+    onCheckedData: (data: T, checked: boolean) => void;
+    /**全选按钮*/
+    onAllChecked: () => void;
+    /**关闭弹窗*/
+    onClose: () => void;
+    /**更新操作状态*/
+    updateOperationStatus: () => void;
+    /**删除选中数据*/
+    onDeleteData: (data?: T) => void;
+}
+export declare function useFairysTaroPopupSearchBaseInstance<T = any>(): readonly [{
+    readonly __defaultValue: string;
+    readonly visible: boolean;
+    readonly value: import("valtio").Snapshot<T> | readonly import("valtio").Snapshot<T>[];
+    readonly dataList: readonly import("valtio").Snapshot<T>[];
+    readonly _tempFilterDataList: readonly import("valtio").Snapshot<T>[];
+    readonly search?: string;
+    readonly _tempValue: import("valtio").Snapshot<T> | readonly import("valtio").Snapshot<T>[];
+    readonly operationStatus: "manage" | "select";
+    readonly manageSelectedDataList: readonly import("valtio").Snapshot<T>[];
+    readonly allChecked: boolean;
+    readonly mode?: "multiple" | "single";
+    readonly columns?: readonly {
+        readonly key: string;
+        readonly title?: string;
+        readonly align?: string;
+        readonly sorter?: ((a: any, b: any) => number) | boolean | string;
+        readonly render?: (rowData: any, rowIndex: number) => string | import("react").ReactNode;
+        readonly fixed?: import("@nutui/nutui-react-taro").PositionX;
+        readonly width?: number;
+    }[];
+}, FairysTaroPopupSearchBaseInstance<T>, string];
+export declare const FairysTaroPopupSearchBaseInstanceContext: import("react").Context<FairysTaroPopupSearchBaseInstance<any>>;
+export declare function useFairysTaroPopupSearchBaseInstanceContext<T = any>(options?: {
+    sync?: boolean;
+}): readonly [{
+    readonly __defaultValue: string;
+    readonly visible: boolean;
+    readonly value: import("valtio").Snapshot<T> | readonly import("valtio").Snapshot<T>[];
+    readonly dataList: readonly import("valtio").Snapshot<T>[];
+    readonly _tempFilterDataList: readonly import("valtio").Snapshot<T>[];
+    readonly search?: string;
+    readonly _tempValue: import("valtio").Snapshot<T> | readonly import("valtio").Snapshot<T>[];
+    readonly operationStatus: "manage" | "select";
+    readonly manageSelectedDataList: readonly import("valtio").Snapshot<T>[];
+    readonly allChecked: boolean;
+    readonly mode?: "multiple" | "single";
+    readonly columns?: readonly {
+        readonly key: string;
+        readonly title?: string;
+        readonly align?: string;
+        readonly sorter?: ((a: any, b: any) => number) | boolean | string;
+        readonly render?: (rowData: any, rowIndex: number) => string | import("react").ReactNode;
+        readonly fixed?: import("@nutui/nutui-react-taro").PositionX;
+        readonly width?: number;
+    }[];
+}, FairysTaroPopupSearchBaseInstance<T>, string];

package/esm/components/popup.search/instance.js

@@ -0,0 +1,319 @@
+import { createContext, useContext, useRef } from "react";
+import { proxy, ref, useSnapshot } from "valtio";
+import taro from "@tarojs/taro";
+class FairysTaroPopupSearchBaseInstanceMount {
+    onChange;
+    onLoadData;
+    otherRequestParams;
+    renderText;
+    renderListItemText;
+    renderList;
+    mode = 'single';
+    rowKey = 'value';
+    displayField = 'label';
+    columns = [];
+    maxWidth;
+    maxHeight;
+    isNeedManage = false;
+    isUseOptionsChecked = true;
+    renderType = 'list';
+    tableProps = {};
+    useTableProps;
+    showRowDeleteButton;
+    showSearch;
+    value;
+    options;
+    maxTagCount;
+}
+class FairysTaroPopupSearchBaseInstance extends FairysTaroPopupSearchBaseInstanceMount {
+    windowHeight = 0;
+    windowWidth = 0;
+    popupWidth = 0;
+    popupHeight = 0;
+    state = proxy({
+        mode: 'single',
+        columns: [],
+        __defaultValue: '',
+        visible: false,
+        value: void 0,
+        dataList: [],
+        _tempFilterDataList: [],
+        search: '',
+        _tempValue: void 0,
+        operationStatus: 'select',
+        manageSelectedDataList: [],
+        allChecked: false
+    });
+    ctor() {
+        const isWeb = taro.getEnv() === taro.ENV_TYPE.WEB;
+        if (isWeb) {
+            this.windowHeight = window.document.documentElement.clientHeight;
+            this.windowWidth = window.document.documentElement.clientWidth;
+        } else {
+            const windowInfo = taro.getWindowInfo();
+            this.windowHeight = windowInfo.windowHeight;
+            this.windowWidth = windowInfo.windowWidth;
+        }
+        this.popupHeight = 0.6 * this.windowHeight;
+        if (this.maxHeight) this.popupHeight = Math.min(this.popupHeight, this.maxHeight);
+        this.popupWidth = 0.8 * this.windowWidth;
+        if (this.maxWidth) this.popupWidth = Math.min(this.popupWidth, this.maxWidth);
+    }
+    updateState = (state)=>{
+        for(const key in state){
+            const value = state[key];
+            if (Array.isArray(value) || '[object Object]' === Object.prototype.toString.call(value)) this.state[key] = ref(value);
+            else this.state[key] = value;
+        }
+    };
+    isUseOptions = ()=>{
+        if (Array.isArray(this.options) && !this.onLoadData && !this.isNeedManage) return this.isUseOptionsChecked;
+        return false;
+    };
+    onSearch = async (keyword)=>{
+        this.state.search = keyword;
+        const _keyword = `${keyword || ''}`.trim();
+        try {
+            if (this.onLoadData && 'select' === this.state.operationStatus) {
+                await new Promise((resolve)=>setTimeout(resolve, 500));
+                const search = {
+                    keyword: _keyword
+                };
+                const dataList = await this.onLoadData(this.otherRequestParams?.(search, this) || search, this);
+                if (Array.isArray(dataList)) this.updateState({
+                    _tempFilterDataList: dataList || [],
+                    dataList: dataList || []
+                });
+                else this.updateState({
+                    _tempFilterDataList: []
+                });
+            } else if ('select' === this.state.operationStatus) {
+                if (!_keyword) return void this.updateState({
+                    _tempFilterDataList: this.state.dataList || []
+                });
+                const filterData = (this.state.dataList || []).filter((item)=>{
+                    const displayText = item[this.displayField]?.toString() || '';
+                    const valueText = item[this.rowKey]?.toString() || '';
+                    return displayText.includes(_keyword) || valueText.includes(_keyword);
+                });
+                this.updateState({
+                    _tempFilterDataList: filterData
+                });
+            } else if ('multiple' === this.mode) {
+                const v = this.state._tempValue;
+                if (Array.isArray(v)) {
+                    if (!_keyword) return void this.updateState({
+                        _tempFilterDataList: v || []
+                    });
+                    const filterData = v.filter((item)=>{
+                        const displayText = item[this.displayField]?.toString() || '';
+                        const valueText = item[this.rowKey]?.toString() || '';
+                        return displayText.includes(_keyword) || valueText.includes(_keyword);
+                    });
+                    this.updateState({
+                        _tempFilterDataList: filterData
+                    });
+                }
+            }
+        } catch (error) {
+            console.error(error);
+        }
+    };
+    onSave = ()=>{
+        if ('multiple' === this.mode) {
+            const dataList = this.state._tempValue || [];
+            this.updateState({
+                value: dataList,
+                _tempValue: dataList,
+                allChecked: false
+            });
+            this.onChange?.(dataList);
+            this.onClose();
+        }
+    };
+    onClear = ()=>{
+        this.state.value = void 0;
+        this.state._tempValue = void 0;
+        this.state.allChecked = false;
+        this.onChange?.(void 0);
+    };
+    isCheckedData = (data)=>{
+        if ('multiple' === this.mode) {
+            if ('manage' === this.state.operationStatus) return -1 !== (this.state.manageSelectedDataList || []).findIndex((item)=>item[this.rowKey] === data[this.rowKey]);
+            if (Array.isArray(this.state._tempValue)) {
+                const findx = this.state._tempValue.findIndex((item)=>item[this.rowKey] === data[this.rowKey]);
+                return -1 !== findx;
+            }
+        } else if (this.state._tempValue) return this.state._tempValue?.[this.rowKey] === data?.[this.rowKey];
+        return false;
+    };
+    onCheckedData = (data, checked)=>{
+        if ('multiple' === this.mode) {
+            if ('manage' === this.state.operationStatus) {
+                if (checked) {
+                    const newList = (this.state.manageSelectedDataList || []).filter((item)=>item[this.rowKey] !== data[this.rowKey]);
+                    this.updateState({
+                        manageSelectedDataList: [
+                            ...newList
+                        ]
+                    });
+                } else {
+                    const newList = [
+                        ...this.state.manageSelectedDataList || []
+                    ].concat([
+                        data
+                    ]);
+                    this.updateState({
+                        manageSelectedDataList: newList
+                    });
+                }
+                return;
+            }
+            const _tempValue = this.state._tempValue || [];
+            if (Array.isArray(_tempValue)) if (checked) {
+                const newList = _tempValue.filter((item)=>item[this.rowKey] !== data[this.rowKey]);
+                this.updateState({
+                    _tempValue: [
+                        ...newList
+                    ]
+                });
+            } else {
+                const findx = _tempValue.find((item)=>item[this.rowKey] === data[this.rowKey]);
+                if (!findx) {
+                    const newList = [
+                        ..._tempValue
+                    ].concat([
+                        data
+                    ]);
+                    this.updateState({
+                        _tempValue: newList
+                    });
+                }
+            }
+        } else {
+            this.updateState({
+                value: data,
+                _tempValue: data
+            });
+            this.onChange?.(data);
+            this.onClose();
+        }
+    };
+    onAllChecked = ()=>{
+        if ('multiple' === this.mode) if (this.state.allChecked) {
+            if ('manage' === this.state.operationStatus) {
+                const _tempFilterDataList = this.state._tempFilterDataList || [];
+                const manageSelectedDataList = this.state.manageSelectedDataList || [];
+                const selectedList = manageSelectedDataList.filter((item)=>!_tempFilterDataList.find((dataItem)=>dataItem[this.rowKey] === item[this.rowKey]));
+                this.updateState({
+                    manageSelectedDataList: [
+                        ...selectedList
+                    ],
+                    allChecked: false
+                });
+                return;
+            }
+            const _tempValue = this.state._tempValue || [];
+            const dataList = this.state.dataList || [];
+            const newList = _tempValue.filter((item)=>!dataList.find((dataItem)=>dataItem[this.rowKey] === item[this.rowKey]));
+            this.updateState({
+                _tempValue: newList,
+                allChecked: false
+            });
+        } else {
+            if ('manage' === this.state.operationStatus) {
+                console.log(this.state._tempFilterDataList);
+                this.updateState({
+                    manageSelectedDataList: this.state._tempFilterDataList || [],
+                    allChecked: true
+                });
+                return;
+            }
+            const _tempValue = this.state._tempValue || [];
+            const dataList = this.state.dataList || [];
+            const newList = [
+                ..._tempValue
+            ].concat(dataList);
+            this.updateState({
+                _tempValue: newList,
+                allChecked: true
+            });
+        }
+    };
+    onClose = ()=>{
+        this.updateState({
+            visible: false,
+            allChecked: false,
+            manageSelectedDataList: [],
+            search: '',
+            _tempValue: this.state.value,
+            operationStatus: 'select',
+            _tempFilterDataList: this.state.dataList || []
+        });
+    };
+    updateOperationStatus = ()=>{
+        if ('multiple' === this.mode) if ('manage' === this.state.operationStatus) this.updateState({
+            operationStatus: 'select',
+            manageSelectedDataList: [],
+            _tempFilterDataList: this.state.dataList || [],
+            allChecked: false,
+            search: ''
+        });
+        else this.updateState({
+            operationStatus: 'manage',
+            manageSelectedDataList: [],
+            _tempFilterDataList: this.state._tempValue || [],
+            allChecked: false,
+            search: ''
+        });
+    };
+    onDeleteData = (data)=>{
+        if ('multiple' === this.mode) if (data) {
+            const _newValue = this.state._tempValue || [];
+            const _tempFilterDataList = this.state._tempFilterDataList || [];
+            if (Array.isArray(_newValue)) {
+                const newList = _newValue.filter((item)=>item[this.rowKey] !== data[this.rowKey]);
+                const newFilterList = _tempFilterDataList.filter((item)=>item[this.rowKey] !== data[this.rowKey]);
+                this.updateState({
+                    _tempValue: newList,
+                    _tempFilterDataList: newFilterList
+                });
+            }
+        } else {
+            const manageSelectedDataList = this.state.manageSelectedDataList || [];
+            const _newValue = this.state._tempValue || [];
+            const _tempFilterDataList = this.state._tempFilterDataList || [];
+            if (Array.isArray(_newValue)) {
+                const newList = _newValue.filter((item)=>!manageSelectedDataList.find((manageItem)=>manageItem[this.rowKey] === item[this.rowKey]));
+                const newFilterList = _tempFilterDataList.filter((item)=>!manageSelectedDataList.find((manageItem)=>manageItem[this.rowKey] === item[this.rowKey]));
+                this.updateState({
+                    _tempValue: newList,
+                    _tempFilterDataList: newFilterList,
+                    manageSelectedDataList: []
+                });
+            }
+        }
+    };
+}
+function useFairysTaroPopupSearchBaseInstance() {
+    const instanceRef = useRef(new FairysTaroPopupSearchBaseInstance());
+    const state = useSnapshot(instanceRef.current.state);
+    const __defaultValue = state.__defaultValue;
+    return [
+        state,
+        instanceRef.current,
+        __defaultValue
+    ];
+}
+const FairysTaroPopupSearchBaseInstanceContext = createContext(new FairysTaroPopupSearchBaseInstance());
+function useFairysTaroPopupSearchBaseInstanceContext(options) {
+    const instance = useContext(FairysTaroPopupSearchBaseInstanceContext);
+    const state = useSnapshot(instance.state, options);
+    const __defaultValue = state.__defaultValue;
+    return [
+        state,
+        instance,
+        __defaultValue
+    ];
+}
+export { FairysTaroPopupSearchBaseInstance, FairysTaroPopupSearchBaseInstanceContext, FairysTaroPopupSearchBaseInstanceMount, useFairysTaroPopupSearchBaseInstance, useFairysTaroPopupSearchBaseInstanceContext };

package/esm/components/popup.search/list.table.d.ts

@@ -0,0 +1 @@
+export declare function FairysTaroPopupSearchListTable<T = any>(): import("react/jsx-runtime").JSX.Element;