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

package/README.md

@@ -1,28 +1,21 @@
-# @giteeteam/apps-team-components
-
-- gitee team components
-
-## 注意
-插件使用需要加上speedy:false，防止切换应用时css会丢失
-
-```jsx
-import { LibraryProvider } from "@giteeteam/apps-team-components";
-
-const Demo = ({children}) => {
-  return (
-    <LibraryProvider emotionCacheOptions={{ key: "appKey", speedy: false }}>
-      {children}
-    </LibraryProvider>
-  )
-}
-```
-
-## TODO
-- SimpleOverflowTooltip 统一为 BaseOverflowToolTip 导出
-- 去除 BaseOverflowToolTip 的 maxline
-
-# 1.1.x版本
-- team最低版本为4.16.0
-
-# 1.2.x版本
-- team最低版本为4.21.0
+# @giteeteam/apps-team-components
+
+- gitee team components
+
+## 安装
+
+```bash
+pnpm i
+```
+
+## 预览
+**开发前务必先阅读预览首页文档**
+```
+pnpm storybook
+```
+
+# 1.1.x版本
+- team最低版本为4.16.0
+
+# 1.2.x版本
+- team最低版本为4.21.0

package/dist/components/common/PriceTag.js

@@ -3,26 +3,26 @@ import { useMemo } from 'react';
 import { ClassNames } from '@emotion/react';
 import { i18n } from '../../lib/i18n';
 import SimpleOverflowToolTip from './overflow-tooltip/SimpleOverflowToolTip';
-export const containerStyle = `
-  display: inline-flex;
-  align-items: center;
-  max-width: 100%;
+export const containerStyle = `
+  display: inline-flex;
+  align-items: center;
+  max-width: 100%;
 `;
-export const textStyle = `
-  flex: 1;
-  width: 0;
+export const textStyle = `
+  flex: 1;
+  width: 0;
 `;
-export const tagStyle = `
-  height: 18px;
-  padding: 0 4px;
-  margin-left: 8px;
-  font-size: 12px;
-  font-weight: 500;
-  line-height: 18px;
-  color: #fff;
-  background: linear-gradient(230deg, #66dbff 0%, #3683ff 100%);
-  border-radius: 5px 0;
-  white-space: nowrap;
+export const tagStyle = `
+  height: 18px;
+  padding: 0 4px;
+  margin-left: 8px;
+  font-size: 12px;
+  font-weight: 500;
+  line-height: 18px;
+  color: #fff;
+  background: linear-gradient(230deg, #66dbff 0%, #3683ff 100%);
+  border-radius: 5px 0;
+  white-space: nowrap;
 `;
 export const PriceTag = ({ text, className, edition, expired }) => {
     const isTagVisible = useMemo(() => {

package/dist/components/common/expand-component/index.d.ts

@@ -0,0 +1,23 @@
+/// <reference types="react" />
+export declare enum EXPAND_TYPE_ENUM {
+    TEXT = "text",
+    TAG = "tag"
+}
+export declare const EXPAND_MAP: {
+    tag: {
+        maxline: number;
+        lineHeight: number;
+    };
+    text: {
+        maxline: number;
+        lineHeight: number;
+    };
+};
+interface ExpandProps {
+    children: React.ReactNode;
+    expandType?: EXPAND_TYPE_ENUM;
+    editing?: boolean;
+    readonly: boolean;
+}
+declare const Expand: React.FC<ExpandProps>;
+export default Expand;

package/dist/components/common/expand-component/index.js

@@ -0,0 +1,65 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { ClassNames } from '@emotion/react';
+import { useListener } from '@giteeteam/proxima-sdk-js';
+import { debounce } from 'lodash-es';
+import BaseOverflowTooltip from 'components/common/overflow-tooltip/BaseOverflowTooltip';
+import { cancelIdleCallback, requestIdleCallback } from 'lib/app/utils';
+import useI18n from 'lib/hooks/useI18n';
+import { expandBtn, expandFooter } from './style';
+const buttonHeight = 20;
+export var EXPAND_TYPE_ENUM;
+(function (EXPAND_TYPE_ENUM) {
+    EXPAND_TYPE_ENUM["TEXT"] = "text";
+    EXPAND_TYPE_ENUM["TAG"] = "tag";
+})(EXPAND_TYPE_ENUM || (EXPAND_TYPE_ENUM = {}));
+export const EXPAND_MAP = {
+    [EXPAND_TYPE_ENUM.TAG]: {
+        maxline: 10,
+        lineHeight: 28,
+    },
+    [EXPAND_TYPE_ENUM.TEXT]: {
+        maxline: 15,
+        lineHeight: 22,
+    },
+};
+const Expand = ({ children, editing, expandType = EXPAND_TYPE_ENUM.TAG }) => {
+    const [currentLine, setCurrentLine] = useState(0);
+    const [isExpand, setExpand] = useState(false);
+    const ref = useRef();
+    const { t } = useI18n();
+    const { maxline, lineHeight } = useMemo(() => {
+        const map = EXPAND_MAP[expandType];
+        return map || EXPAND_MAP[EXPAND_TYPE_ENUM.TAG];
+    }, [expandType]);
+    const showButton = useMemo(() => {
+        return currentLine > maxline;
+    }, [currentLine, maxline]);
+    const toggle = e => {
+        e.stopPropagation();
+        setExpand(prev => !prev);
+    };
+    const calculate = useCallback(() => {
+        if (editing || !ref.current)
+            return;
+        const height = ref.current.offsetHeight;
+        const line = Math.ceil(height / lineHeight);
+        setCurrentLine(line);
+    }, [editing, lineHeight]);
+    useListener('itemDetailModalResize', calculate);
+    useEffect(() => {
+        const id = requestIdleCallback(() => calculate());
+        return () => {
+            cancelIdleCallback(id);
+        };
+    }, [calculate]);
+    useEffect(() => {
+        const handle = debounce(calculate, 200);
+        window.addEventListener('resize', handle);
+        return () => {
+            window.removeEventListener('resize', handle);
+        };
+    }, [calculate]);
+    return (_jsxs("div", { className: "expand-wrapper", style: { padding: currentLine > 1 && expandType === EXPAND_TYPE_ENUM.TEXT ? '5px 0' : 0 }, children: [_jsx("div", { className: "expand-content", children: _jsx(BaseOverflowTooltip, { maxline: isExpand ? 999 : maxline, children: _jsx("span", { ref: ref, children: children }) }) }), showButton && (_jsx(ClassNames, { children: ({ cx, css }) => (_jsx("div", { className: cx(css(expandFooter)), style: { height: `${buttonHeight}px`, lineHeight: `${buttonHeight}px` }, children: _jsx("span", { className: cx(css(expandBtn)), onClick: toggle, children: isExpand ? t('global.collapse') : t('global.expand') }) })) }))] }));
+};
+export default Expand;

package/dist/components/common/expand-component/style.d.ts

@@ -0,0 +1,2 @@
+export declare const expandFooter = "\n  font-size: 12px;\n  color: #0c62ff;\n  text-align: right;\n";
+export declare const expandBtn = "\n  cursor: pointer;\n";

package/dist/components/common/expand-component/style.js

@@ -0,0 +1,8 @@
+export const expandFooter = `
+  font-size: 12px;
+  color: #0c62ff;
+  text-align: right;
+`;
+export const expandBtn = `
+  cursor: pointer;
+`;

package/dist/components/common/item-icon/ItemIcon.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+interface ItemProps {
+    icon?: string;
+    label?: string | React.ReactNode;
+    className?: string;
+}
+declare const ItemIcon: React.FC<ItemProps>;
+export default ItemIcon;

package/dist/components/common/item-icon/ItemIcon.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import ItemTypeIcon from 'components/fields/item-type/ItemTypeIcon';
+const ItemIcon = ({ icon, label, className }) => {
+    return (_jsxs(_Fragment, { children: [icon ? _jsx(ItemTypeIcon, { icon: icon, className: className }) : null, label] }));
+};
+export default ItemIcon;

package/dist/components/common/overflow-tooltip/OverflowTooltip.d.ts

@@ -0,0 +1,19 @@
+import { CSSProperties } from 'react';
+interface OverflowTooltip {
+    trigger?: 'hover' | 'focus' | 'click' | 'contextMenu';
+    className?: string;
+    title?: React.ReactNode;
+    children: any;
+    disabled?: boolean;
+    maxline?: number;
+    mountOnCurrentNode?: boolean;
+    overlayClassName?: string;
+    style?: CSSProperties;
+    placement?: 'top' | 'left' | 'right' | 'bottom' | 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight' | 'leftTop' | 'leftBottom' | 'rightTop' | 'rightBottom';
+    alwaysShowTooltip?: boolean;
+    defaultVisible?: boolean;
+    enterable?: boolean;
+}
+declare const OverflowTooltip: React.FC<OverflowTooltip>;
+declare const _default: import("react").NamedExoticComponent<OverflowTooltip>;
+export default _default;

package/dist/components/common/overflow-tooltip/OverflowTooltip.js

@@ -0,0 +1,54 @@
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { memo, useCallback, useEffect, useRef, useState } from 'react';
+import { ClassNames } from '@emotion/react';
+import { Tooltip } from 'antd';
+import { getTooltipMaxlineStyle, tooltipOverflowStyle } from './style';
+const isTextOverflow = element => {
+    return new Promise(resolve => {
+        window.requestAnimationFrame(() => {
+            resolve((element && element.clientHeight < element.scrollHeight) || false);
+        });
+    });
+};
+const overlayStyle = {
+    wordBreak: 'break-word',
+    whiteSpace: 'pre-wrap',
+};
+const getCurrentNodeContainer = target => target.parentNode;
+const getPopupContainer = () => document.body;
+const OverflowTooltip = props => {
+    const { trigger = 'hover', className = '', title = '', children, disabled = false, placement = 'top', maxline = 1, overlayClassName, mountOnCurrentNode = false, style, alwaysShowTooltip, defaultVisible = false, enterable, } = props;
+    const [visible, setVisible] = useState(defaultVisible);
+    const elRef = useRef();
+    const getContainer = mountOnCurrentNode ? getCurrentNodeContainer : getPopupContainer;
+    const updateVisible = useCallback(visible => {
+        setVisible(visible);
+    }, [setVisible]);
+    const handleVisibleChange = useCallback(async (visible) => {
+        const overflow = await isTextOverflow(elRef.current);
+        if (visible && alwaysShowTooltip && !disabled) {
+            updateVisible(true);
+            setVisible(true);
+        }
+        if (visible && overflow && !disabled) {
+            updateVisible(visible);
+            setVisible(visible);
+        }
+        if (!visible) {
+            updateVisible(visible);
+        }
+    }, [disabled, updateVisible, alwaysShowTooltip]);
+    useEffect(() => {
+        if (disabled) {
+            setVisible(false);
+        }
+    }, [disabled]);
+    if (!children) {
+        return null;
+    }
+    const content = (_jsx(ClassNames, { children: ({ cx, css }) => (_jsx("span", { ref: elRef, className: cx(css(tooltipOverflowStyle), css(getTooltipMaxlineStyle(maxline)), className), style: style, onMouseLeave: () => {
+                !enterable && setVisible(false);
+            }, children: children })) }));
+    return (_jsx(Tooltip, { trigger: trigger, placement: placement, overlayStyle: overlayStyle, overlayClassName: overlayClassName, title: title, open: visible, onOpenChange: handleVisibleChange, getPopupContainer: getContainer, destroyTooltipOnHide: true, children: content }));
+};
+export default memo(OverflowTooltip);

package/dist/components/common/overflow-tooltip/style/index.js

@@ -1,18 +1,18 @@
-export const tooltipOverflowStyle = `
-  display: -webkit-box;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  word-break: break-all;
-  white-space: pre-line !important;
-  -webkit-box-orient: vertical;
+export const tooltipOverflowStyle = `
+  display: -webkit-box;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  word-break: break-all;
+  white-space: pre-line !important;
+  -webkit-box-orient: vertical;
 `;
-export const simpleTooltipStyle = `
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
+export const simpleTooltipStyle = `
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 `;
 export const getTooltipMaxlineStyle = (n) => {
-    return `
-    -webkit-line-clamp: ${n};
+    return `
+    -webkit-line-clamp: ${n};
   `;
 };

package/dist/components/common/style/global.js

@@ -1,3 +1,3 @@
-export const fieldValueOverlayStyle = `
-  width: 100%;
+export const fieldValueOverlayStyle = `
+  width: 100%;
 `;

package/dist/components/common/style/mixin.d.ts

@@ -0,0 +1,2 @@
+export declare const hoverStyle = "\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  height: 32px;\n  padding: 0 8px !important;\n  color: rgb(226 236 255 50%);\n  border: 1px solid #F1F2F4;\n  border-radius: 4px;\n";
+export declare const hoverIconStyle = "\n  display: none;\n  font-size: 12px;\n  color: #C1C5CF;\n";

package/dist/components/common/style/mixin.js

@@ -0,0 +1,17 @@
+import { gray4, gray6 } from 'style/common';
+export const hoverStyle = `
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: 32px;
+  padding: 0 8px !important;
+  color: rgb(226 236 255 50%);
+  border: 1px solid ${gray4};
+  border-radius: 4px;
+`;
+export const hoverIconStyle = `
+  display: none;
+  font-size: 12px;
+  color: ${gray6};
+`;

package/dist/components/common/user-field/style/index.js

@@ -1,25 +1,25 @@
 const avatarSize = '20px';
-export const avatarItemStyle = `
-  flex-shrink: 0;
+export const avatarItemStyle = `
+  flex-shrink: 0;
 `;
-export const avatarStyle = `
-  display: inline-block;
-  width: ${avatarSize};
-  height: ${avatarSize};
-  margin-right: 3px;
-  vertical-align: middle;
-  background: #fff center/contain no-repeat;
-  border-radius: 50%;
+export const avatarStyle = `
+  display: inline-block;
+  width: ${avatarSize};
+  height: ${avatarSize};
+  margin-right: 3px;
+  vertical-align: middle;
+  background: #fff center/contain no-repeat;
+  border-radius: 50%;
 `;
-export const defaultAvatarStyle = `
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: ${avatarSize};
-  height: ${avatarSize};
-  margin-right: 6px;
-  font-size: 12px;
-  color: #fff;
-  background: #5243aa;
-  border-radius: 50%;
+export const defaultAvatarStyle = `
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: ${avatarSize};
+  height: ${avatarSize};
+  margin-right: 6px;
+  font-size: 12px;
+  color: #fff;
+  background: #5243aa;
+  border-radius: 50%;
 `;

package/dist/components/common/utils.d.ts

@@ -3,3 +3,9 @@ export declare const getBackgroundColor: (s?: string) => {
     background: string;
 };
 export declare const dateFormat: (time: string, type?: string) => string;
+export declare const defaultFilterOptions: (inputValue: string, option: any) => boolean;
+type GetCondition = (dom: HTMLElement, className: string) => boolean;
+export declare const getParentEle: (dom: HTMLElement, className: string, conditionFunc?: GetCondition) => HTMLElement;
+export declare const getPopupContainerFun: (getPopupContainer: (node?: HTMLElement) => HTMLElement, triggerNode: HTMLElement, apply: string, page?: string) => HTMLElement;
+export declare const isChinese: (text: string) => boolean;
+export {};

package/dist/components/common/utils.js

@@ -34,3 +34,57 @@ export const dateFormat = (time, type) => {
         }
     }
 };
+export const defaultFilterOptions = (inputValue, option) => {
+    var _a, _b, _c;
+    const lowerInputValue = inputValue.toLocaleLowerCase();
+    try {
+        if (typeof option.children === 'string') {
+            return option.children.toLowerCase().indexOf(lowerInputValue) >= 0;
+        }
+        else if (option.children && typeof ((_a = option.children.props) === null || _a === void 0 ? void 0 : _a.label) === 'string') {
+            return option.children.props.label.toLowerCase().indexOf(lowerInputValue) >= 0;
+        }
+        else if (option.children) {
+            const label = (_c = (_b = option === null || option === void 0 ? void 0 : option.children) === null || _b === void 0 ? void 0 : _b.props) === null || _c === void 0 ? void 0 : _c.label;
+            const str = label !== null && label !== void 0 ? label : JSON.stringify(option);
+            return str.toLowerCase().indexOf(lowerInputValue) >= 0;
+        }
+        else if (option.label) {
+            return option.label.toLowerCase().indexOf(lowerInputValue) >= 0;
+        }
+    }
+    catch (e) {
+        if (option.children) {
+            const cloneOption = { ...option };
+            delete cloneOption.children;
+            const str = JSON.stringify(cloneOption);
+            return str.toLowerCase().indexOf(lowerInputValue) >= 0;
+        }
+        return false;
+    }
+    return false;
+};
+const defaultConditionFunc = (dom, className) => dom.parentElement.className.includes(className);
+export const getParentEle = (dom, className, conditionFunc = defaultConditionFunc) => {
+    if (conditionFunc(dom, className)) {
+        return dom.parentElement;
+    }
+    else if (dom.parentElement === document.body) {
+        return document.body;
+    }
+    else {
+        return getParentEle(dom.parentElement, className);
+    }
+};
+export const getPopupContainerFun = (getPopupContainer, triggerNode, apply, page) => {
+    if (getPopupContainer) {
+        return getPopupContainer();
+    }
+    const ele = getParentEle(triggerNode, page + '-page-class');
+    if (apply === 'cell' || !ele) {
+        return document.body;
+    }
+    return ele;
+};
+const zhReg = /[\u4e00-\u9fa5]/g;
+export const isChinese = (text) => zhReg.test(text);

package/dist/components/default-empty-icon/config.d.ts

@@ -0,0 +1,2 @@
+import { ConfigType } from './types';
+export declare const config: ConfigType;

package/dist/components/default-empty-icon/config.js

@@ -0,0 +1,19 @@
+import { LargeItem, LargeWorkspace, SmallDefault } from 'icons/empty-icon';
+import { largeItemClass, largeWorkspaceClass, smallDefaultClass } from './style';
+export const config = {
+    smallDefault: {
+        text: 'views.common.searchSelect.emptyData.noData',
+        url: SmallDefault,
+        className: smallDefaultClass,
+    },
+    largeItem: {
+        text: 'views.tableComponents.TableEmpty.noDataTip',
+        url: LargeItem,
+        className: largeItemClass,
+    },
+    largeWorkspace: {
+        text: 'pages.workspaces.default.emptyDataDefaultProps.operationInfo',
+        url: LargeWorkspace,
+        className: largeWorkspaceClass,
+    },
+};

package/dist/components/default-empty-icon/index.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import { PropType } from './types';
+declare const EmptyIcon: FC<PropType>;
+export default EmptyIcon;
+export { EmptyType } from './types';

package/dist/components/default-empty-icon/index.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { ClassNames } from '@emotion/react';
+import useI18n from 'lib/hooks/useI18n';
+import { config } from './config';
+import { autoMarginClass, emptyIconWrapper, largeMarginClass, noMarginClass, smallMarginClass, smallTextClass, textClass, } from './style';
+import { EmptyType } from './types';
+const EmptyIcon = ({ type = EmptyType.SMALL_DEFAULT, text, extra, className, style, center, smallText, smallMargin, largeMargin, noMargin, autoMargin, }) => {
+    const { t } = useI18n();
+    const { text: defaultText, url, className: defaultClass } = config[type] || {};
+    return (_jsx(ClassNames, { children: ({ cx, css }) => (_jsxs("div", { className: cx(css(emptyIconWrapper), {
+                center,
+                [smallTextClass]: smallText,
+                [smallMarginClass]: smallMargin,
+                [largeMarginClass]: largeMargin,
+                [noMarginClass]: noMargin,
+                [autoMarginClass]: autoMargin,
+            }, className), style: style, children: [_jsx("img", { className: cx(defaultClass), src: url, alt: "" }), _jsx("p", { className: cx(textClass), children: text || t(defaultText) }), extra] })) }));
+};
+export default EmptyIcon;
+EmptyIcon.defaultProps = {
+    type: EmptyType.SMALL_DEFAULT,
+};
+export { EmptyType } from './types';

package/dist/components/default-empty-icon/style.d.ts

@@ -0,0 +1,11 @@
+export declare const centerClass: string;
+export declare const smallTextClass: string;
+export declare const smallMarginClass: string;
+export declare const textClass: string;
+export declare const largeMarginClass: string;
+export declare const noMarginClass: string;
+export declare const autoMarginClass: string;
+export declare const smallDefaultClass: string;
+export declare const largeWorkspaceClass: string;
+export declare const largeItemClass: string;
+export declare const emptyIconWrapper: string;

package/dist/components/default-empty-icon/style.js

@@ -0,0 +1,64 @@
+import { randomClassName } from 'style/common';
+export const centerClass = randomClassName('center');
+export const smallTextClass = randomClassName('small-text');
+export const smallMarginClass = randomClassName('small-margin');
+export const textClass = randomClassName('text');
+export const largeMarginClass = randomClassName('large-margin');
+export const noMarginClass = randomClassName('no-margin');
+export const autoMarginClass = randomClassName('auto-margin');
+export const smallDefaultClass = randomClassName('small-default');
+export const largeWorkspaceClass = randomClassName('large-workspace');
+export const largeItemClass = randomClassName('large-item');
+export const emptyIconWrapper = `
+  margin-top: 12px;
+  text-align: center;
+
+  &.${centerClass} {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    user-select: none;
+  }
+
+  &.${smallTextClass} {
+    .${textClass} {
+      font-size: 12px;
+    }
+  }
+
+  &.${smallMarginClass} {
+    margin-top: 16px;
+  }
+
+  &.${largeMarginClass} {
+    margin-top: 48px;
+  }
+
+  &.${noMarginClass} {
+    margin: 0;
+  }
+
+  &.${autoMarginClass} {
+    margin: auto;
+  }
+
+  .${smallDefaultClass} {
+    width: 90px;
+    height: 90px;
+  }
+
+  .${largeWorkspaceClass},
+  .${largeItemClass} {
+    width: 180px;
+    height: 180px;
+  }
+
+  .${textClass} {
+    padding: 0;
+    margin: 12px 0;
+    font-size: 14px;
+    line-height: 22px;
+    color: #848c9f;
+  }
+`;

package/dist/components/default-empty-icon/types.d.ts

@@ -0,0 +1,29 @@
+import { CSSProperties, ReactNode } from 'react';
+export interface PropType {
+    type?: EmptyType;
+    text?: string;
+    extra?: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+    center?: boolean;
+    smallText?: boolean;
+    smallMargin?: boolean;
+    largeMargin?: boolean;
+    noMargin?: boolean;
+    autoMargin?: boolean;
+}
+export declare enum EmptyType {
+    SMALL_DEFAULT = "smallDefault",
+    LARGE_ITEM = "largeItem",
+    LARGE_WS = "largeWorkspace"
+}
+export interface ConfigType {
+    smallDefault: ConfigItem;
+    largeItem: ConfigItem;
+    largeWorkspace: ConfigItem;
+}
+export interface ConfigItem {
+    text: string;
+    url: string;
+    className: string;
+}

package/dist/components/default-empty-icon/types.js

@@ -0,0 +1,6 @@
+export var EmptyType;
+(function (EmptyType) {
+    EmptyType["SMALL_DEFAULT"] = "smallDefault";
+    EmptyType["LARGE_ITEM"] = "largeItem";
+    EmptyType["LARGE_WS"] = "largeWorkspace";
+})(EmptyType || (EmptyType = {}));

package/dist/components/field-behavior/fields/type.js

@@ -1,4 +1,4 @@
-import { FIELD_TYPE_KEY_MAPPINGS } from '../../../lib/global';
+import { FIELD_TYPE_KEY_MAPPINGS } from 'lib/global';
 export const SUPPORT_USER_KEYS = [
     FIELD_TYPE_KEY_MAPPINGS.User,
     FIELD_TYPE_KEY_MAPPINGS.Assignee,

package/dist/components/fields/base-component/types.d.ts

@@ -5,3 +5,4 @@ export interface CellProps {
 export interface FieldProps {
     readonly?: boolean;
 }
+export type IScreenLabelProps = 'left' | 'right' | 'top';

package/dist/components/fields/base-component/utils.d.ts

@@ -0,0 +1,2 @@
+import { IScreenLabelProps } from './types';
+export declare const getFieldWidthStyle: (labelWidth: number, labelAlign: IScreenLabelProps, hiddenLabel: boolean, apply: string) => any;