@giteeteam/apps-team-components 1.3.0-alpha.1 → 1.3.0-alpha.3

package/dist/components/fields/dropdown/BaseField.js

@@ -1,40 +1,41 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { jsxs, Fragment, jsx } from '@emotion/react/jsx-runtime';
+import { useMemo, useState, useRef, useEffect, useCallback } from 'react';
 import { Overlay } from 'react-overlays';
 import { DownOutlined } from '@ant-design/icons';
 import { ClassNames } from '@emotion/react';
-import { Checkbox, Col, Divider, Select as AntSelect, Spin } from 'antd';
+import { Checkbox, Divider, Spin, Select, Col } from 'antd';
 import debug from 'debug';
-import { isNil, isObject, isPlainObject, noop, xorWith } from 'lodash-es';
-import { emptyIconWrapper } from 'style/global';
+import { isObject, isPlainObject, isNil, xorWith, noop } from 'lodash-es';
+import { emptyIconWrapper } from '../../../style/global.js';
 import useSWR from 'swr';
-import EmptyField from 'components/common/EmptyField';
-import Expand, { EXPAND_TYPE_ENUM } from 'components/common/expand-component';
-import ItemIcon from 'components/common/item-icon/ItemIcon';
-import BaseOverflowTooltip from 'components/common/overflow-tooltip/BaseOverflowTooltip';
-import OverflowTooltip from 'components/common/overflow-tooltip/OverflowTooltip';
-import { defaultFilterOptions, getPopupContainerFun } from 'components/common/utils';
-import EmptyIcon from 'components/default-empty-icon';
-import { getFieldWidthStyle } from 'components/fields/base-component/utils';
-import { getRealValueByIqlTo } from 'components/filters/filter-search/utils';
-import { REMOTE_DATA_QUOTE_FIELD_TYPE } from 'lib/constants/field';
-import { BASE_FIELD_WIDTH, CURRENT_WORKSPACE, FIELD_CONTAINERS_PAGE, FIELD_TYPE_KEY_MAPPINGS } from 'lib/global';
-import useAntdConfig from 'lib/hooks/useAntdConfig';
-import useI18n from 'lib/hooks/useI18n';
-import { API_KEY } from 'lib/swr/constants';
-import useViewClass from '../hooks/useViewClass';
-import { EMPTY_OPTIONS, useCommonProps } from './hook';
-import { disabledClass, displayWrapClass, dropdownSelectDisabled, dropdownSelectOptionClass, dropdownSelectStyle, dropdownStyle, hiddenHoverClass, hoverIconClass, onlyWorkspaceDividerStyle, onlyWorkspaceStyle, optionDisplayWrapClass, valueOptionClass, valueOptionContentClass, valueOptionIconClass, valueOptionLabelClass, workspaceClass, } from './style';
+import EmptyField from '../../common/EmptyField.js';
+import Expand, { EXPAND_TYPE_ENUM } from '../../common/expand-component/index.js';
+import ItemIcon from '../../common/item-icon/ItemIcon.js';
+import BaseOverflowTooltip from '../../common/overflow-tooltip/BaseOverflowTooltip.js';
+import OverflowTooltip from '../../common/overflow-tooltip/OverflowTooltip.js';
+import { defaultFilterOptions, getPopupContainerFun } from '../../common/utils.js';
+import EmptyIcon from '../../default-empty-icon/index.js';
+import { getFieldWidthStyle } from '../base-component/utils.js';
+import { getRealValueByIqlTo } from '../../filters/filter-search/utils.js';
+import { REMOTE_DATA_QUOTE_FIELD_TYPE } from '../../../lib/constants/field.js';
+import { FIELD_CONTAINERS_PAGE, CURRENT_WORKSPACE, FIELD_TYPE_KEY_MAPPINGS, BASE_FIELD_WIDTH } from '../../../lib/global.js';
+import useAntdConfig from '../../../lib/hooks/useAntdConfig.js';
+import useI18n from '../../../lib/hooks/useI18n.js';
+import { API_KEY } from '../../../lib/swr/constants.js';
+import useViewClass from '../hooks/useViewClass.js';
+import { useCommonProps, EMPTY_OPTIONS } from './hook.js';
+import { dropdownSelectDisabled, onlyWorkspaceStyle, onlyWorkspaceDividerStyle, dropdownSelectStyle, optionDisplayWrapClass, dropdownSelectOptionClass, disabledClass, workspaceClass, dropdownStyle, hiddenHoverClass, displayWrapClass, valueOptionContentClass, valueOptionClass, valueOptionIconClass, valueOptionLabelClass, hoverIconClass } from './style.js';
+
 const loggers = debug('dropdown:BaseField');
-export const isNilFilter = function (value) {
+const isNilFilter = function (value) {
     var _a;
     return (_a = value === null || value === void 0 ? void 0 : value.filter) === null || _a === void 0 ? void 0 : _a.call(value, val => !isNil(val));
 };
-export const handleValue = function (value) {
+const handleValue = function (value) {
     return isObject(value) ? value === null || value === void 0 ? void 0 : value.value : value;
 };
-export const getFormattedLabel = ({ label, style = {} } = {}) => {
-    return _jsx("span", { style: { borderRadius: 2, color: style === null || style === void 0 ? void 0 : style.color, background: style === null || style === void 0 ? void 0 : style.background }, children: label });
+const getFormattedLabel = ({ label, style = {} } = {}) => {
+    return jsx("span", { style: { borderRadius: 2, color: style === null || style === void 0 ? void 0 : style.color, background: style === null || style === void 0 ? void 0 : style.background }, children: label });
 };
 const Dropdown = props => {
     const { onSelect = noop, onBlur, onChange = noop, labelWidth = BASE_FIELD_WIDTH, labelAlign, readonly: propsReadonly = false, options: _propsOptions = EMPTY_OPTIONS, editMode = false, apply, mode, hiddenLabel, allowClear = true, useChange = false, objectId, getPopupContainer, dataQuoteInit, userData, workspace, valueDisplayWrap, optionDisplayWrap, onOptionsChange, page, disabledSwr, onlyValue, screenMode, displayValueHidden = false, disabledLineThrough = false, displayWorkspace = false, isShowOnlyWorkspace = false, fieldTypeKey, iqlKey = 'value', fetchOnFocus, isCascaded, clickFetch, iqlToNeedMore = false, ...defaultProps } = props;
@@ -51,6 +52,7 @@ const Dropdown = props => {
     const valueRef = useRef([]);
     const containerRef = useRef(null);
     const targetRef = useRef(null);
+    const onBlurRef = useRef({ time: 0, e: null });
     const [isClicked, setClicked] = useState(false);
     const optionLoadedRef = useRef(false);
     const loadMoreRef = useRef(false);
@@ -298,7 +300,7 @@ const Dropdown = props => {
                     return null;
                 showValue = valueArr.map((item, index) => {
                     const content = _optionsMap[item] ? getFormattedLabel(_optionsMap[item]) : item;
-                    return index === value.length - 1 ? content : _jsxs(_Fragment, { children: [content, ","] });
+                    return index === value.length - 1 ? content : jsxs(Fragment, { children: [content, ","] });
                 });
             }
         }
@@ -309,7 +311,7 @@ const Dropdown = props => {
                 const opt = _options.filter(item => item.value === handleValue(val));
                 const label = ((_a = opt[0]) === null || _a === void 0 ? void 0 : _a.label) || handleValue(val);
                 if (opt.length >= 1) {
-                    showValue = (_jsx("span", { className: cx({ [css(dropdownSelectDisabled)]: ((_b = opt[0]) === null || _b === void 0 ? void 0 : _b.disabled) || !opt.length }), children: ((_c = opt[0]) === null || _c === void 0 ? void 0 : _c.icon) ? (_jsx(ItemIcon, { icon: (_d = opt[0]) === null || _d === void 0 ? void 0 : _d.icon, label: label })) : !screenMode && _optionsMap[label] ? (getFormattedLabel(_optionsMap[label])) : (label) }));
+                    showValue = (jsx("span", { className: cx({ [css(dropdownSelectDisabled)]: ((_b = opt[0]) === null || _b === void 0 ? void 0 : _b.disabled) || !opt.length }), children: ((_c = opt[0]) === null || _c === void 0 ? void 0 : _c.icon) ? (jsx(ItemIcon, { icon: (_d = opt[0]) === null || _d === void 0 ? void 0 : _d.icon, label: label })) : !screenMode && _optionsMap[label] ? (getFormattedLabel(_optionsMap[label])) : (label) }));
                 }
             }
         }
@@ -429,6 +431,7 @@ const Dropdown = props => {
     const handleBlur = useCallback(e => {
         var _a;
         if (open) {
+            onBlurRef.current = { time: Date.now(), e: e };
             return;
         }
         if (!editMode) {
@@ -496,6 +499,15 @@ const Dropdown = props => {
             });
         }
     }, [isMultiple]);
+    useEffect(() => {
+        if (!open) {
+            const now = Date.now();
+            if (now > onBlurRef.current.time && now - onBlurRef.current.time < 200) {
+                handleBlur(onBlurRef.current.e);
+                onBlurRef.current.time = 0;
+            }
+        }
+    }, [handleBlur, open]);
     const dropdownRender = useCallback(({ cx, css }) => {
         return menu => {
             if (!isShowOnlyWorkspace)
@@ -503,24 +515,24 @@ const Dropdown = props => {
             const message = t('pages.fields.default.onlyWorkspace', {
                 name: props.onlyWorkspaceTip || t(`pages.fields.fieldName.${fieldTypeKey}`),
             });
-            return (_jsxs(_Fragment, { children: [_jsx("div", { className: cx(css(onlyWorkspaceStyle)), children: _jsx(Checkbox, { checked: onlyWorkspace, onChange: onChangeCurrent, onClick: e => {
+            return (jsxs(Fragment, { children: [jsx("div", { className: cx(css(onlyWorkspaceStyle)), children: jsx(Checkbox, { checked: onlyWorkspace, onChange: onChangeCurrent, onClick: e => {
                                 e.stopPropagation();
-                            }, children: _jsx(BaseOverflowTooltip, { title: message, children: message }) }) }), _jsx(Divider, { className: cx(css(onlyWorkspaceDividerStyle)) }), menu] }));
+                            }, children: jsx(BaseOverflowTooltip, { title: message, children: message }) }) }), jsx(Divider, { className: cx(css(onlyWorkspaceDividerStyle)) }), menu] }));
         };
     }, [fieldTypeKey, isShowOnlyWorkspace, onChangeCurrent, onlyWorkspace, props.onlyWorkspaceTip, t]);
     const notFoundContentMemo = useMemo(() => {
-        return loading && canAsyncFetchOption ? (_jsx(Spin, { size: "small" })) : (_jsx(ClassNames, { children: ({ css, cx }) => (_jsx("div", { className: cx(css(emptyIconWrapper)), children: _jsx(EmptyIcon, { noMargin: true }) })) }));
+        return loading && canAsyncFetchOption ? (jsx(Spin, { size: "small" })) : (jsx(ClassNames, { children: ({ css, cx }) => (jsx("div", { className: cx(css(emptyIconWrapper)), children: jsx(EmptyIcon, { noMargin: true }) })) }));
     }, [canAsyncFetchOption, loading]);
     const style = getFieldWidthStyle(labelWidth, labelAlign, hiddenLabel, apply);
     const hiddenHover = readonly || editMode || editing || apply === 'cell' || isView;
     const overlayRender = useMemo(() => {
-        return (_jsx(ClassNames, { children: ({ cx, css }) => {
+        return (jsx(ClassNames, { children: ({ cx, css }) => {
                 const cxDropdownRender = dropdownRender({ cx, css });
-                return (_jsx("div", { className: 'field-value-overlay', children: _jsx(AntSelect, { getPopupContainer: triggerNode => getPopupContainerFun(getPopupContainer, triggerNode, apply, page), filterOption: filterOptionProp, ...defaultProps, className: cx('field-value-overlay-component', disabledLineThrough || displayValueHidden ? css(dropdownSelectStyle(antPrefix)) : '', {
+                return (jsx("div", { className: 'field-value-overlay', children: jsx(Select, { getPopupContainer: triggerNode => getPopupContainerFun(getPopupContainer, triggerNode, apply, page), filterOption: filterOptionProp, ...defaultProps, className: cx('field-value-overlay-component', disabledLineThrough || displayValueHidden ? css(dropdownSelectStyle(antPrefix)) : '', {
                             [optionDisplayWrapClass]: optionDisplayWrap,
                         }), mode: mode, ref: targetRef, value: selectValue, showSearch: true, maxTagCount: optionDisplayWrap || isView ? null : 'responsive', onSelect: handleSelect, onClear: handleClear, onBlur: handleBlur, open: open, onDropdownVisibleChange: onDropdownVisibleChange, onFocus: handleFocus, onChange: handleChange, allowClear: allowClear, onSearch: handleSearch, defaultOpen: !editMode, listItemHeight: 32, listHeight: 200, optionLabelProp: fieldTypeKey === FIELD_TYPE_KEY_MAPPINGS.Version ? 'label' : 'children', notFoundContent: notFoundContentMemo, dropdownRender: cxDropdownRender, children: _options.map(item => {
                             var _a, _b, _c;
-                            return (_jsxs(AntSelect.Option, { value: item.value, label: item.label, disabled: item.disabled, values: item.values, children: [_jsx("span", { className: cx({ [dropdownSelectOptionClass]: disabledLineThrough || displayValueHidden }, { [disabledClass]: item === null || item === void 0 ? void 0 : item.disabled }), children: _jsxs(BaseOverflowTooltip, { title: (_a = item === null || item === void 0 ? void 0 : item.label) === null || _a === void 0 ? void 0 : _a.toString(), className: "custom-overflow", children: [_jsx(ItemIcon, { icon: item.icon, label: item.label }), fieldTypeKey === FIELD_TYPE_KEY_MAPPINGS.Version && item.archived && (_jsxs("span", { children: ["(", t('workspaceArchived.archived'), ")"] }))] }) }), displayWorkspace ? (_jsx("div", { className: cx(workspaceClass), children: _jsx(BaseOverflowTooltip, { title: (_b = item === null || item === void 0 ? void 0 : item.workspace) === null || _b === void 0 ? void 0 : _b.name, children: (_c = item === null || item === void 0 ? void 0 : item.workspace) === null || _c === void 0 ? void 0 : _c.name }) })) : null] }, item.value));
+                            return (jsxs(Select.Option, { value: item.value, label: item.label, disabled: item.disabled, values: item.values, children: [jsx("span", { className: cx({ [dropdownSelectOptionClass]: disabledLineThrough || displayValueHidden }, { [disabledClass]: item === null || item === void 0 ? void 0 : item.disabled }), children: jsxs(BaseOverflowTooltip, { title: (_a = item === null || item === void 0 ? void 0 : item.label) === null || _a === void 0 ? void 0 : _a.toString(), className: "custom-overflow", children: [jsx(ItemIcon, { icon: item.icon, label: item.label }), fieldTypeKey === FIELD_TYPE_KEY_MAPPINGS.Version && item.archived && (jsxs("span", { children: ["(", t('workspaceArchived.archived'), ")"] }))] }) }), displayWorkspace ? (jsx("div", { className: cx(workspaceClass), children: jsx(BaseOverflowTooltip, { title: (_b = item === null || item === void 0 ? void 0 : item.workspace) === null || _b === void 0 ? void 0 : _b.name, children: (_c = item === null || item === void 0 ? void 0 : item.workspace) === null || _c === void 0 ? void 0 : _c.name }) })) : null] }, item.value));
                         }) }) }));
             } }));
     }, [
@@ -553,13 +565,14 @@ const Dropdown = props => {
         selectValue,
         t,
     ]);
-    return (_jsx(ClassNames, { children: ({ cx, css }) => {
+    return (jsx(ClassNames, { children: ({ cx, css }) => {
             const cxShowValue = showValue({ cx, css });
-            return (_jsxs(Col, { style: style, ref: containerRef, className: cx(css(dropdownStyle(antPrefix)), 'field-value', viewClassNames, { [hiddenHoverClass]: hiddenHover }, { [displayWrapClass]: valueDisplayWrap }, { [css(dropdownSelectStyle(antPrefix))]: disabledLineThrough || displayValueHidden }), onClick: handleClick, children: [(readonly || (!editMode && !editing)) &&
-                        (cxShowValue ? (!valueDisplayWrap ? (isView && isMultiple ? (_jsx(Expand, { readonly: readonly, editing: editing, expandType: EXPAND_TYPE_ENUM.TAG, children: valueOptions.map(item => (_jsx("span", { className: "field-common-view-tag", children: _jsx(BaseOverflowTooltip, { title: item.label, children: item.label }) }, item.value))) })) : (_jsx(OverflowTooltip, { title: cxShowValue, children: cxShowValue }))) : (_jsx("div", { className: cx(valueOptionContentClass), children: valueOptions.map(ele => {
-                                return (_jsxs("div", { className: cx(valueOptionClass), title: ele.label, children: [_jsx(ItemIcon, { className: cx(valueOptionIconClass), icon: ele.icon }), _jsx("span", { className: cx(valueOptionLabelClass), children: ele.label })] }, ele.value));
-                            }) }))) : (_jsx(EmptyField, { readonly: readonly }))), !readonly && (editMode || editing) && containerRef && (_jsx(Overlay, { show: true, rootClose: true, container: containerRef, target: containerRef, onHide: noop, children: () => overlayRender })), _jsx(DownOutlined, { className: cx(hoverIconClass) })] }));
+            return (jsxs(Col, { style: style, ref: containerRef, className: cx(css(dropdownStyle(antPrefix)), 'field-value', viewClassNames, { [hiddenHoverClass]: hiddenHover }, { [displayWrapClass]: valueDisplayWrap }, { [css(dropdownSelectStyle(antPrefix))]: disabledLineThrough || displayValueHidden }), onClick: handleClick, children: [(readonly || (!editMode && !editing)) &&
+                        (cxShowValue ? (!valueDisplayWrap ? (isView && isMultiple ? (jsx(Expand, { readonly: readonly, editing: editing, expandType: EXPAND_TYPE_ENUM.TAG, children: valueOptions.map(item => (jsx("span", { className: "field-common-view-tag", children: jsx(BaseOverflowTooltip, { title: item.label, children: item.label }) }, item.value))) })) : (jsx(OverflowTooltip, { title: cxShowValue, children: cxShowValue }))) : (jsx("div", { className: cx(valueOptionContentClass), children: valueOptions.map(ele => {
+                                return (jsxs("div", { className: cx(valueOptionClass), title: ele.label, children: [jsx(ItemIcon, { className: cx(valueOptionIconClass), icon: ele.icon }), jsx("span", { className: cx(valueOptionLabelClass), children: ele.label })] }, ele.value));
+                            }) }))) : (jsx(EmptyField, { readonly: readonly }))), !readonly && (editMode || editing) && containerRef && (jsx(Overlay, { show: true, rootClose: true, container: containerRef, target: containerRef, onHide: noop, children: () => overlayRender })), jsx(DownOutlined, { className: cx(hoverIconClass) })] }));
         } }));
 };
 Dropdown.displayName = 'DropdownBaseField';
-export default Dropdown;
+
+export { Dropdown as default, getFormattedLabel, handleValue, isNilFilter };

package/dist/components/fields/dropdown/Cell.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { BaseDropdownProps } from './hook';
 declare const DropdownCell: React.FC<BaseDropdownProps>;
 export default DropdownCell;

package/dist/components/fields/dropdown/Cell.js

@@ -1,6 +1,8 @@
-import { jsx as _jsx } from "@emotion/react/jsx-runtime";
-import BaseField from './BaseField';
+import { jsx } from '@emotion/react/jsx-runtime';
+import Dropdown from './BaseField.js';
+
 const DropdownCell = props => {
-    return _jsx(BaseField, { ...props, apply: "cell" });
+    return jsx(Dropdown, { ...props, apply: "cell" });
 };
-export default DropdownCell;
+
+export { DropdownCell as default };

package/dist/components/fields/dropdown/ReadView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ReadViewBaseProps } from '../types';
 type DropdownReadViewProps = ReadViewBaseProps & {
     userData?: Record<string, any>;

package/dist/components/fields/dropdown/ReadView.js

@@ -1,15 +1,16 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { jsxs, Fragment, jsx } from '@emotion/react/jsx-runtime';
 import { memo, useMemo } from 'react';
-import EmptyField from '../../common/EmptyField';
-import SimpleOverflowToolTip from '../../common/overflow-tooltip/SimpleOverflowToolTip';
-import { handleValue } from './BaseField';
+import EmptyField from '../../common/EmptyField.js';
+import SimpleOverflowToolTip from '../../common/overflow-tooltip/SimpleOverflowToolTip.js';
+import { handleValue } from './BaseField.js';
+
 var MUTIPLE_MODE;
 (function (MUTIPLE_MODE) {
     MUTIPLE_MODE["multiple"] = "multiple";
     MUTIPLE_MODE["tags"] = "tags";
 })(MUTIPLE_MODE || (MUTIPLE_MODE = {}));
 const getFormattedLabel = ({ label, style = {}, }) => {
-    return _jsx("span", { style: { borderRadius: 2, color: style === null || style === void 0 ? void 0 : style.color, background: style === null || style === void 0 ? void 0 : style.background }, children: label });
+    return jsx("span", { style: { borderRadius: 2, color: style === null || style === void 0 ? void 0 : style.color, background: style === null || style === void 0 ? void 0 : style.background }, children: label });
 };
 const DropdownReadView = memo(props => {
     const { value, options, readonly: propsReadonly, userData, mode } = props;
@@ -45,7 +46,7 @@ const DropdownReadView = memo(props => {
                 return '';
             return valueArr.map((item, index) => {
                 const content = optionsMap[item] ? getFormattedLabel(optionsMap[item]) : item;
-                return index === value.length - 1 ? content : _jsxs(_Fragment, { children: [content, ","] });
+                return index === value.length - 1 ? content : jsxs(Fragment, { children: [content, ","] });
             });
         }
         else {
@@ -73,7 +74,8 @@ const DropdownReadView = memo(props => {
             .join(',');
         return result;
     }, [options, value]);
-    return showValue ? (_jsx(SimpleOverflowToolTip, { title: showValueTitle, children: showValue })) : (_jsx(EmptyField, { readonly: readonly }));
+    return showValue ? (jsx(SimpleOverflowToolTip, { title: showValueTitle, children: showValue })) : (jsx(EmptyField, { readonly: readonly }));
 });
 DropdownReadView.displayName = 'DropdownReadView';
-export default DropdownReadView;
+
+export { DropdownReadView as default };

package/dist/components/fields/dropdown/data.d.ts

@@ -5,5 +5,5 @@ interface FetchDropdownParams {
     page?: string;
     propsValue?: string;
 }
-export declare const useFetchDropdown: () => (data: FetchDropdownParams) => Promise<any>;
+export declare const useFetchDropdown: () => ((data: FetchDropdownParams) => Promise<any>);
 export {};

package/dist/components/fields/dropdown/data.js

@@ -1,7 +1,8 @@
 import { useCallback } from 'react';
-import useFetch from 'lib/fetch';
-import { throttleFetch } from 'lib/throttleFetch';
-export const useFetchDropdown = () => {
+import useFetch from '../../../lib/fetch.js';
+import { throttleFetch } from '../../../lib/throttleFetch.js';
+
+const useFetchDropdown = () => {
     const fetch = useFetch();
     const fetchDropdownData = useCallback(({ keyword, workspaceId, page, fieldId, propsValue }) => {
         return throttleFetch({ keyword, workspaceId, page, fieldId }, async () => {
@@ -24,3 +25,5 @@ export const useFetchDropdown = () => {
     }, [fetch]);
     return fetchDropdownData;
 };
+
+export { useFetchDropdown };

package/dist/components/fields/dropdown/hook.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { SelectProps } from 'antd';
 import { Item, ItemType, PointerObject } from 'lib/types/models';
 import { FieldProps, IScreenLabelProps } from '../base-component/types';

package/dist/components/fields/dropdown/hook.js

@@ -1,9 +1,10 @@
-import { useCallback, useMemo, useRef, useState } from 'react';
-import { debounce, uniqWith } from 'lodash-es';
-import { getArrayValue } from 'lib/array';
-import { REMOTE_DATA_QUOTE_FIELD_TYPE } from 'lib/constants/field';
-import { FIELD_TYPE_KEY_MAPPINGS } from 'lib/global';
-import { useFetchDropdown } from './data';
+import { useState, useMemo, useRef, useCallback } from 'react';
+import { uniqWith, debounce } from 'lodash-es';
+import { getArrayValue } from '../../../lib/array.js';
+import { REMOTE_DATA_QUOTE_FIELD_TYPE } from '../../../lib/constants/field.js';
+import { FIELD_TYPE_KEY_MAPPINGS } from '../../../lib/global.js';
+import { useFetchDropdown } from './data.js';
+
 const useGenerateFetchFunction = ({ workspaceId, page, fieldId, propsValue, needFetchDataSource, defaultFetchValues, defaultFetchOptions, }) => {
     const fetchDropdownData = useFetchDropdown();
     const fetchOptions = useMemo(() => {
@@ -38,8 +39,8 @@ const useGenerateFetchFunction = ({ workspaceId, page, fieldId, propsValue, need
         fetchValues,
     };
 };
-export const EMPTY_OPTIONS = [];
-export const useCommonProps = (props) => {
+const EMPTY_OPTIONS = [];
+const useCommonProps = (props) => {
     var _a;
     const { value: propsValue, options: _propsOptions = EMPTY_OPTIONS, fetchValues: _fetchValues, fetchOptions: _fetchOptions, debounceTimeout = 600, objectId, userData, workspace, page, fetchChange, onlyWorkspace, setOnlyWorkspace, fieldTypeKey, detailKey, isCascaded, cascadeCustomData, workspaceId, dataSource, } = props;
     const [loading, setLoading] = useState(true);
@@ -150,3 +151,5 @@ export const useCommonProps = (props) => {
         value,
     };
 };
+
+export { EMPTY_OPTIONS, useCommonProps };

package/dist/components/fields/dropdown/style.js

@@ -1,90 +1,93 @@
-import { randomClassName } from 'style/common';
-import { hoverIconStyle, hoverStyle } from 'components/common/style/mixin';
-export const dropdownSelectDisabled = `
-  text-decoration: line-through;
+import { randomClassName } from '../../../style/common.js';
+import { hoverStyle, hoverIconStyle } from '../../common/style/mixin.js';
+
+const dropdownSelectDisabled = `
+  text-decoration: line-through;
 `;
-export const onlyWorkspaceStyle = `
-  padding: 5px 12px;
+const onlyWorkspaceStyle = `
+  padding: 5px 12px;
 `;
-export const onlyWorkspaceDividerStyle = `
-  &:not(.add-weights) {
-    margin: 4px 0;
-  }
+const onlyWorkspaceDividerStyle = `
+  &:not(.add-weights) {
+    margin: 4px 0;
+  }
 `;
-export const hiddenHoverClass = randomClassName('hidden-hover');
-export const displayWrapClass = randomClassName('display-wrap');
-export const valueOptionClass = randomClassName('value-option');
-export const valueOptionContentClass = randomClassName('value-option-content');
-export const valueOptionIconClass = randomClassName('value-option-icon');
-export const valueOptionLabelClass = randomClassName('value-option-label');
-export const workspaceClass = randomClassName('workspace');
-export const hoverIconClass = randomClassName('hover-icon');
-export const optionDisplayWrapClass = randomClassName('option-display-wrap');
-export const dropdownStyle = (antPrefix) => `
-  width: 100%;
-
-  &:not(.${hiddenHoverClass}) &:not(.${displayWrapClass}) :hover {
-    ${hoverStyle}
-
-    .${hoverIconClass} {
-      display: inline-block;
-    }
-  }
-
-  .${hoverIconClass} {
-    ${hoverIconStyle}
-  }
-
-  .${antPrefix}-select {
-    width: 100%;
-  }
-
-  .${antPrefix}-select-selection-item) {
-    .${workspaceClass} {
-      display: none;
-    }
-  }
-
-  .${valueOptionClass} {
-    margin-bottom: 8px;
-  }
-
-  .${valueOptionContentClass} {
-    width: 100%;
-    padding-top: 6px;
-
-    .${valueOptionIconClass} {
-      position: absolute;
-      margin-top: 3px;
-    }
-
-    .${valueOptionLabelClass} {
-      display: inline-block;
-      width: ~'calc(100% - 22px)';
-      margin-left: 22px;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-    }
-  }
-
-  .${optionDisplayWrapClass} {
-    .${antPrefix}-select-selection-overflow {
-      display: block;
-      .${antPrefix}-select-selection-overflow-item {
-        width: fit-content;
-      }
-    }
-  }
+const hiddenHoverClass = randomClassName('hidden-hover');
+const displayWrapClass = randomClassName('display-wrap');
+const valueOptionClass = randomClassName('value-option');
+const valueOptionContentClass = randomClassName('value-option-content');
+const valueOptionIconClass = randomClassName('value-option-icon');
+const valueOptionLabelClass = randomClassName('value-option-label');
+const workspaceClass = randomClassName('workspace');
+const hoverIconClass = randomClassName('hover-icon');
+const optionDisplayWrapClass = randomClassName('option-display-wrap');
+const dropdownStyle = (antPrefix) => `
+  width: 100%;
+
+  &:not(.${hiddenHoverClass}) &:not(.${displayWrapClass}) :hover {
+    ${hoverStyle}
+
+    .${hoverIconClass} {
+      display: inline-block;
+    }
+  }
+
+  .${hoverIconClass} {
+    ${hoverIconStyle}
+  }
+
+  .${antPrefix}-select {
+    width: 100%;
+  }
+
+  .${antPrefix}-select-selection-item) {
+    .${workspaceClass} {
+      display: none;
+    }
+  }
+
+  .${valueOptionClass} {
+    margin-bottom: 8px;
+  }
+
+  .${valueOptionContentClass} {
+    width: 100%;
+    padding-top: 6px;
+
+    .${valueOptionIconClass} {
+      position: absolute;
+      margin-top: 3px;
+    }
+
+    .${valueOptionLabelClass} {
+      display: inline-block;
+      width: ~'calc(100% - 22px)';
+      margin-left: 22px;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+  }
+
+  .${optionDisplayWrapClass} {
+    .${antPrefix}-select-selection-overflow {
+      display: block;
+      .${antPrefix}-select-selection-overflow-item {
+        width: fit-content;
+      }
+    }
+  }
 `;
-export const dropdownSelectOptionClass = randomClassName('dropdown-select-option');
-export const disabledClass = randomClassName('disabled');
-export const dropdownSelectStyle = (antPrefix) => `
-  .${dropdownSelectOptionClass}.${disabledClass} {
-    text-decoration: line-through;
-  }
-
-  .${antPrefix}-select-selection-item-content {
-    text-decoration: line-through;   
-  }
+const dropdownSelectOptionClass = randomClassName('dropdown-select-option');
+const disabledClass = randomClassName('disabled');
+const dropdownSelectStyle = (antPrefix) => `
+  .${dropdownSelectOptionClass}.${disabledClass} {
+    text-decoration: line-through;
+  }
+
+  .${antPrefix}-select-selection-item-content {
+    text-decoration: line-through;   
+  }
 `;
+
+export { disabledClass, displayWrapClass, dropdownSelectDisabled, dropdownSelectOptionClass, dropdownSelectStyle, dropdownStyle, hiddenHoverClass, hoverIconClass, onlyWorkspaceDividerStyle, onlyWorkspaceStyle, optionDisplayWrapClass, valueOptionClass, valueOptionContentClass, valueOptionIconClass, valueOptionLabelClass, workspaceClass };

package/dist/components/fields/file/ReadView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ReadViewBaseProps } from '../types';
 declare const FileReadView: import("react").NamedExoticComponent<ReadViewBaseProps>;
 export default FileReadView;

package/dist/components/fields/file/ReadView.js

@@ -1,7 +1,8 @@
-import { jsx as _jsx, Fragment as _Fragment } from "@emotion/react/jsx-runtime";
+import { jsx, Fragment } from '@emotion/react/jsx-runtime';
 import { memo } from 'react';
-import EmptyField from '../../common/EmptyField';
-import SimpleOverflowToolTip from '../../common/overflow-tooltip/SimpleOverflowToolTip';
+import EmptyField from '../../common/EmptyField.js';
+import SimpleOverflowToolTip from '../../common/overflow-tooltip/SimpleOverflowToolTip.js';
+
 const FileReadView = memo(({ value }) => {
     const showValue = (value === null || value === void 0 ? void 0 : value.length)
         ? value
@@ -9,6 +10,7 @@ const FileReadView = memo(({ value }) => {
             .filter(Boolean)
             .join(',')
         : '';
-    return (_jsx(_Fragment, { children: showValue ? (_jsx(SimpleOverflowToolTip, { title: showValue, children: showValue })) : (_jsx(EmptyField, { readonly: true })) }));
+    return (jsx(Fragment, { children: showValue ? (jsx(SimpleOverflowToolTip, { title: showValue, children: showValue })) : (jsx(EmptyField, { readonly: true })) }));
 });
-export default FileReadView;
+
+export { FileReadView as default };

package/dist/components/fields/formula/ReadView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export type FormulaReadViewProps = {
     value?: string | number | boolean | undefined;
     placeholder?: string;

package/dist/components/fields/formula/ReadView.js

@@ -1,7 +1,8 @@
-import { jsx as _jsx, Fragment as _Fragment } from "@emotion/react/jsx-runtime";
+import { jsx, Fragment } from '@emotion/react/jsx-runtime';
 import { memo, useMemo } from 'react';
-import EmptyField from '../../common/EmptyField';
-import SimpleOverflowToolTip from '../../common/overflow-tooltip/SimpleOverflowToolTip';
+import EmptyField from '../../common/EmptyField.js';
+import SimpleOverflowToolTip from '../../common/overflow-tooltip/SimpleOverflowToolTip.js';
+
 const FormulaReadView = memo(({ value, addonBefore = '', addonAfter = '' }) => {
     const showValue = useMemo(() => {
         return (value === null || value === void 0 ? void 0 : value.toString()) || '';
@@ -9,6 +10,7 @@ const FormulaReadView = memo(({ value, addonBefore = '', addonAfter = '' }) => {
     const valueWithPrefix = useMemo(() => {
         return `${addonBefore}${showValue || ''}${addonAfter}`;
     }, [addonBefore, showValue, addonAfter]);
-    return (_jsx(_Fragment, { children: valueWithPrefix ? (_jsx(SimpleOverflowToolTip, { title: valueWithPrefix, children: valueWithPrefix })) : (_jsx(EmptyField, { readonly: true })) }));
+    return (jsx(Fragment, { children: valueWithPrefix ? (jsx(SimpleOverflowToolTip, { title: valueWithPrefix, children: valueWithPrefix })) : (jsx(EmptyField, { readonly: true })) }));
 });
-export default FormulaReadView;
+
+export { FormulaReadView as default };

package/dist/components/fields/hooks/useViewClass.js

@@ -1,5 +1,6 @@
 import { useMemo } from 'react';
-import { SCREEN_TYPE } from 'lib/global';
+import { SCREEN_TYPE } from '../../../lib/global.js';
+
 const useViewClass = ({ screenMode, editing, readonly }) => {
     const isView = useMemo(() => {
         return screenMode === SCREEN_TYPE.View;
@@ -15,4 +16,5 @@ const useViewClass = ({ screenMode, editing, readonly }) => {
         isView,
     };
 };
-export default useViewClass;
+
+export { useViewClass as default };

package/dist/components/fields/hyper-link/ReadView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { CellProps } from '../base-component/types';
 export interface BaseFieldProps {
     value: {

package/dist/components/fields/hyper-link/ReadView.js

@@ -1,17 +1,19 @@
-import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { jsx, jsxs } from '@emotion/react/jsx-runtime';
 import { memo, useMemo } from 'react';
 import { css } from '@emotion/react';
 import { Popover } from 'antd';
-import EmptyField from '../../common/EmptyField';
-import { hyperLinkItemStyle, hyperLinkListStyle, hyperLinkTipItem } from './style';
+import EmptyField from '../../common/EmptyField.js';
+import { hyperLinkTipItem, hyperLinkListStyle, hyperLinkItemStyle } from './style/index.js';
+
 const HyperLinkCell = memo(props => {
     const { value } = props;
     const list = useMemo(() => {
         return value === null || value === void 0 ? void 0 : value.filter(item => item === null || item === void 0 ? void 0 : item.value);
     }, [value]);
     const content = useMemo(() => {
-        return list === null || list === void 0 ? void 0 : list.map(item => (_jsx("a", { href: item.value, target: "_blank", rel: "noreferrer", css: css(hyperLinkTipItem), children: item.label }, item.id)));
+        return list === null || list === void 0 ? void 0 : list.map(item => (jsx("a", { href: item.value, target: "_blank", rel: "noreferrer", css: css(hyperLinkTipItem), children: item.label }, item.id)));
     }, [list]);
-    return (list === null || list === void 0 ? void 0 : list.length) > 0 ? (_jsx(Popover, { content: content, destroyTooltipOnHide: true, children: _jsx("div", { css: css(hyperLinkListStyle), children: list.map((item, index) => (_jsxs("a", { href: item.value, target: "_blank", rel: "noreferrer", css: css(hyperLinkItemStyle), children: [item.label, index + 1 !== list.length && _jsx("span", { children: ",\u00A0" })] }, item.id))) }) })) : (_jsx(EmptyField, { readonly: true }));
+    return (list === null || list === void 0 ? void 0 : list.length) > 0 ? (jsx(Popover, { content: content, destroyTooltipOnHide: true, children: jsx("div", { css: css(hyperLinkListStyle), children: list.map((item, index) => (jsxs("a", { href: item.value, target: "_blank", rel: "noreferrer", css: css(hyperLinkItemStyle), children: [item.label, index + 1 !== list.length && jsx("span", { children: ",\u00A0" })] }, item.id))) }) })) : (jsx(EmptyField, { readonly: true }));
 });
-export default HyperLinkCell;
+
+export { HyperLinkCell as default };