@lingxiteam/ebe-utils 0.2.4 → 0.2.5

package/lib/pcpublic/src/components/pcfactory/src/Input/index.tsx

@@ -7,12 +7,7 @@ import React, { useEffect, useMemo, useState } from 'react';
 import CommIcon from '../Icon';
 import { handleIsValidIconCfg } from '../Icon/hooks';
 import type { IconCfg } from '../Icon/PropsType';
-import {
-  FormFields,
-  getFieldsProps,
-  useCommonImperativeHandle,
-  useDataMask,
-} from '../utils';
+import { FormFields, getFieldsProps, useCommonImperativeHandle, useDataMask } from '../utils';
 import { checkNumber } from '../utils/common';
 import { useLocale } from '../utils/hooks/useLocale';
 import renderReadOnly from '../utils/renderReadOnly';
@@ -155,13 +150,7 @@ const Input = LingxiForwardRef<any, MyInputProps>((props, ref) => {
     ...restProps
   } = props;
 
-  const {
-    disabled,
-    required,
-    formFieldsRef,
-    readOnly,
-    finalRules: temRules,
-  } = useCommonImperativeHandle(ref, props);
+  const { disabled, required, formFieldsRef, readOnly, finalRules: temRules } = useCommonImperativeHandle(ref, props);
 
   const { getLocale, lang } = useLocale(getEngineApis?.());
   // Input控件值需要经过水印处理
@@ -173,14 +162,7 @@ const Input = LingxiForwardRef<any, MyInputProps>((props, ref) => {
   });
 
   const { type, theme } = icon || {};
-  const {
-    prefixIconIconFileInfo,
-    prefixIconIsIconFont,
-    prefixIconType,
-    prefixIconTheme,
-    prefixIconFontAddress,
-    prefixIconiconFile,
-  } = prefixIcon;
+  const { prefixIconIconFileInfo, prefixIconIsIconFont, prefixIconType, prefixIconTheme, prefixIconFontAddress, prefixIconiconFile } = prefixIcon;
 
   const ignoreReadOnlyFlag = useMemo(() => {
     // 只读模式并且 控件存在图标配置和事件
@@ -188,10 +170,7 @@ const Input = LingxiForwardRef<any, MyInputProps>((props, ref) => {
       return false;
     }
     // 旧数据 type 为后缀图标
-    if (
-      (props.icon?.type || props?.type || props?.postfix) &&
-      typeof props.onIconClick === 'function'
-    ) {
+    if ((props.icon?.type || props?.type || props?.postfix) && typeof props.onIconClick === 'function') {
       return true;
     }
     return false;
@@ -247,12 +226,7 @@ const Input = LingxiForwardRef<any, MyInputProps>((props, ref) => {
     };
     if (handleIsValidIconCfg(resolvedPrefixIcon)) {
       before = (
-        <CommIcon
-          className={disabled ? 'disabled' : ''}
-          icon={resolvedPrefixIcon}
-          getEngineApis={getEngineApis}
-          $$componentItem={$$componentItem}
-        />
+        <CommIcon className={disabled ? 'disabled' : ''} icon={resolvedPrefixIcon} getEngineApis={getEngineApis} $$componentItem={$$componentItem} />
       );
     }
 
@@ -299,10 +273,7 @@ const Input = LingxiForwardRef<any, MyInputProps>((props, ref) => {
       switch (postfixIconPosition) {
         case 'after':
           after = (
-            <span
-              className="postfix"
-              onClick={disabled ? null : onIconClick || undefined}
-            >
+            <span className="postfix" onClick={disabled ? null : onIconClick || undefined}>
               {postfix}
               {after}
             </span>
@@ -311,10 +282,7 @@ const Input = LingxiForwardRef<any, MyInputProps>((props, ref) => {
         case 'before':
         default:
           after = (
-            <span
-              className="postfix"
-              onClick={disabled ? null : onIconClick || undefined}
-            >
+            <span className="postfix" onClick={disabled ? null : onIconClick || undefined}>
               {after}
               {postfix}
             </span>
@@ -333,11 +301,7 @@ const Input = LingxiForwardRef<any, MyInputProps>((props, ref) => {
     let lengthRule;
     if (minLength === 0 && maxLength === 0) {
       lengthRule = undefined;
-    } else if (
-      checkNumber(minLength) &&
-      checkNumber(maxLength) &&
-      minLength < maxLength
-    ) {
+    } else if (checkNumber(minLength) && checkNumber(maxLength) && minLength < maxLength) {
       lengthRule = {
         pattern: new RegExp(`^.{${minLength},${maxLength}}$`),
         message: getLocale?.('Input.lenRule', { minLength, maxLength }),
@@ -362,16 +326,12 @@ const Input = LingxiForwardRef<any, MyInputProps>((props, ref) => {
     }
     return rules;
   }, [required, lang, temRules]);
-  const showCount = useMemo(
-    () => maxLength && checkNumber(maxLength),
-    [maxLength],
-  );
-
+  const showCount = useMemo(() => maxLength && checkNumber(maxLength), [maxLength]);
   return (
     <FormFields
       {...getFieldsProps(props)}
       rules={finalRules}
-      handleFormValue={(val) => {
+      handleFormValue={val => {
         return Number.isNaN(val) ? '' : val;
       }}
       trigger={trigger}
@@ -400,16 +360,14 @@ const Input = LingxiForwardRef<any, MyInputProps>((props, ref) => {
         showCount={showCount}
         defaultValue={defaultValue}
         value={value}
-        onChange={(e) => {
+        onChange={e => {
           if (onChange) {
             onChange(e);
           }
         }}
-        className={classnames(
-          prefixStyleClsName,
-          postfixStyleClsName,
-          className,
-        )}
+        className={classnames(prefixStyleClsName, postfixStyleClsName, className, {
+          'pcfactory-input-after-border-right-width': !!postfix,
+        })}
         addonBefore={getAddonBeforeBtn()}
         addonAfter={getAddonAfterBtn()}
       />

package/lib/pcpublic/src/components/pcfactory/src/InputNumber/index.tsx

@@ -2,11 +2,7 @@ import { InputNumber as AntdInputNumber, Tooltip } from 'antd';
 // @ts-ignore
 // import type { ValidationRule } from 'antd/es/form';
 import React, { useMemo, useState } from 'react';
-import {
-  FormFields,
-  getFieldsProps,
-  useCommonImperativeHandle,
-} from '../utils';
+import { FormFields, getFieldsProps, useCommonImperativeHandle } from '../utils';
 import { useLocale } from '../utils/hooks/useLocale';
 
 export interface InputNumberProps {
@@ -57,9 +53,7 @@ export interface WrapperInputNumberProps {
 const INPUTNUMBER_WRAPPER_CLASSNAME = 'ued-inputNumber-wrap';
 const WrapperInputNumber: React.FC<WrapperInputNumberProps> = ({ children }) =>
   React.cloneElement(children, {
-    className: `${INPUTNUMBER_WRAPPER_CLASSNAME} ${
-      children.props.className || ''
-    }`,
+    className: `${INPUTNUMBER_WRAPPER_CLASSNAME} ${children.props.className || ''}`,
   });
 const TOOLTIP_CLASSNAME = 'ued-inputNumber-tooltip-wrap';
 const TOOLTIP_CLASSNAME_NO_FORM = `${TOOLTIP_CLASSNAME} no-form`;
@@ -111,8 +105,7 @@ const InputNumber = React.forwardRef<any, InputNumberProps>((props, ref) => {
   const { sandBoxSafeRun } = engineApis;
 
   const { getLocale } = useLocale(engineApis);
-  const { disabled, required, formFieldsRef, finalRules, readOnly } =
-    useCommonImperativeHandle(ref, props);
+  const { disabled, required, formFieldsRef, finalRules, readOnly } = useCommonImperativeHandle(ref, props);
 
   const [digitText, setDigitText] = useState('');
 
@@ -170,10 +163,7 @@ const InputNumber = React.forwardRef<any, InputNumberProps>((props, ref) => {
           .replace(/,$/, '');
       // 只有小数点前的部分需要千位分隔符
       if (formatting === 'comma' && val.indexOf('.') > -1) {
-        return (
-          withComma(val.substring(0, val.indexOf('.'))) +
-          val.substring(val.indexOf('.'))
-        );
+        return withComma(val.substring(0, val.indexOf('.'))) + val.substring(val.indexOf('.'));
       }
       if (formatting === 'comma') {
         return withComma(`${val}`);
@@ -222,12 +212,7 @@ const InputNumber = React.forwardRef<any, InputNumberProps>((props, ref) => {
   return (
     <>
       {formatting === 'word' && digitText ? (
-        <Tooltip
-          overlayClassName={TOOLTIP_CLASSNAME_NO_FORM}
-          placement="topLeft"
-          title={digitText}
-          visible
-        />
+        <Tooltip overlayClassName={TOOLTIP_CLASSNAME_NO_FORM} placement="topLeft" title={digitText} visible />
       ) : null}
       <FormFields
         {...getFieldsProps(props)}

package/lib/pcpublic/src/components/pcfactory/src/LXPieChart/LXPieChart.tsx

@@ -8,16 +8,7 @@ const LXPieChart: LingXiFC<LXPieChartPorps> = (props, ref) => {
   const { style, visible = true, className } = props;
   const finalStyle = useHiddenStyle(visible, style);
 
-  return (
-    <LXChart
-      style={finalStyle}
-      className={className}
-      configProps={props}
-      isEditMode={false}
-      isMobile={false}
-      chartType="Pie"
-    />
-  );
+  return <LXChart style={finalStyle} className={className} configProps={props} isEditMode={false} isMobile={false} chartType="Pie" />;
 };
 
 export default LXPieChart;

package/lib/pcpublic/src/components/pcfactory/src/LXPieChart/loader.tsx

@@ -2,10 +2,7 @@ import Loadable from 'react-loadable';
 import { LoadingComponennt } from '../utils/LoaderHelper';
 
 const LoadableLXRadarChart = Loadable({
-  loader: async () =>
-    (await import(
-      /* webpackChunkName: 'pcFactory-LXPieChart' */ './LXPieChart'
-    )) as unknown as React.ComponentType<any>,
+  loader: async () => (await import(/* webpackChunkName: 'pcFactory-LXPieChart' */ './LXPieChart')) as unknown as React.ComponentType<any>,
   loading: LoadingComponennt,
 });
 

package/lib/pcpublic/src/components/pcfactory/src/LXRadarChart/LXRadarChat.tsx

@@ -10,16 +10,7 @@ const LXRadarChart: LingXiFC<LXRadarChartPorps> = (props, ref) => {
   const { style, visible = true, className } = props;
   const finalStyle = useHiddenStyle(visible, style);
 
-  return (
-    <LXChart
-      style={finalStyle}
-      className={className}
-      configProps={props}
-      isEditMode={false}
-      isMobile={false}
-      chartType="Radar"
-    />
-  );
+  return <LXChart style={finalStyle} className={className} configProps={props} isEditMode={false} isMobile={false} chartType="Radar" />;
 };
 
 export default LXRadarChart;

package/lib/pcpublic/src/components/pcfactory/src/LXRadarChart/index.tsx

@@ -3,15 +3,13 @@ import { useImperativeHandle } from 'react';
 import LXRadarChartLoader from './loader';
 import LXRadarChartProps from './PropsType';
 
-const LXRadarChar = LingxiForwardRef<unknown, LXRadarChartProps>(
-  (props, ref) => {
-    useImperativeHandle(ref, () => ({
-      // 这里暴漏部分指令方法
-      // 由于组件采用懒加载延迟执行组件，导致组件在未加载完成的时候已经执行了页面加载完成的生命周期，所以未来的指令方法不应放入懒加载中，避免页面加载完成时机无法调用指令。
-    }));
+const LXRadarChar = LingxiForwardRef<unknown, LXRadarChartProps>((props, ref) => {
+  useImperativeHandle(ref, () => ({
+    // 这里暴漏部分指令方法
+    // 由于组件采用懒加载延迟执行组件，导致组件在未加载完成的时候已经执行了页面加载完成的生命周期，所以未来的指令方法不应放入懒加载中，避免页面加载完成时机无法调用指令。
+  }));
 
-    return <LXRadarChartLoader {...props} />;
-  },
-);
+  return <LXRadarChartLoader {...props} />;
+});
 
 export default LXRadarChar;

package/lib/pcpublic/src/components/pcfactory/src/LXRadarChart/loader.tsx

@@ -2,10 +2,7 @@ import Loadable from 'react-loadable';
 import { LoadingComponennt } from '../utils/LoaderHelper';
 
 const LoadableLXRadarChart = Loadable({
-  loader: async () =>
-    (await import(
-      /* webpackChunkName: 'pcFactory-LXRadarChart' */ './LXRadarChat'
-    )) as unknown as React.ComponentType<any>,
+  loader: async () => (await import(/* webpackChunkName: 'pcFactory-LXRadarChart' */ './LXRadarChat')) as unknown as React.ComponentType<any>,
   loading: LoadingComponennt,
 });
 

package/lib/pcpublic/src/components/pcfactory/src/Layout/index.tsx

@@ -10,14 +10,8 @@ export interface LayoutProps {
   visible: boolean;
 }
 
-const Layout: LingXiFC<LayoutProps> = (props) => {
-  const {
-    children,
-    style,
-    layoutOptions,
-    visible = true,
-    ...restProps
-  } = props;
+const Layout: LingXiFC<LayoutProps> = props => {
+  const { children, style, layoutOptions, visible = true, getEngineApis, ...restProps } = props;
 
   const hiddenStyle = useHiddenStyle(visible);
   const myStyle: React.CSSProperties = useMemo(() => {
@@ -47,7 +41,7 @@ const Layout: LingXiFC<LayoutProps> = (props) => {
         return rowList.map((item, rowIndex) => {
           curChildren += item.length;
           return (
-            <>
+            <React.Fragment key={rowIndex}>
               {item.map((col, colIndex) => {
                 const span = parseInt(col, 10);
                 const itemCol = span > curGrid ? curGrid : span;
@@ -72,10 +66,10 @@ const Layout: LingXiFC<LayoutProps> = (props) => {
                       style={{
                         width: `${targetCol}%`,
                         paddingLeft: colIndex === 0 ? 0 : `${curColSpace}px`,
-                        paddingRight:
-                          colIndex === item.length - 1 ? 0 : `${curColSpace}px`,
+                        paddingRight: colIndex === item.length - 1 ? 0 : `${curColSpace}px`,
                         marginTop: rowIndex === 0 ? 0 : rowSpace,
                       }}
+                      key={colIndex}
                     >
                       {renderChildren}
                     </div>
@@ -83,7 +77,7 @@ const Layout: LingXiFC<LayoutProps> = (props) => {
                 }
                 return null;
               })}
-            </>
+            </React.Fragment>
           );
         });
       }
@@ -111,7 +105,10 @@ const Layout: LingXiFC<LayoutProps> = (props) => {
         </div>
       );
     }
-    return children;
+    if (React.isValidElement(children)) {
+      return children;
+    }
+    return null;
   }, [children, layoutOptions]);
 
   return (

package/lib/pcpublic/src/components/pcfactory/src/Layout/utils.ts

@@ -1,14 +1,9 @@
-export const findItemsSumThanNum = (
-  array: string[] | any[],
-  targetSum: number,
-) => {
+export const findItemsSumThanNum = (array: string[] | any[], targetSum: number) => {
   let next = 0;
   const result: any[][] = [];
   if (array && Array.isArray(array)) {
-    const newArray = array
-      .filter((item) => item)
-      .map((num) => parseInt(num, 10));
-    newArray.forEach((item) => {
+    const newArray = array.filter(item => item).map(num => parseInt(num, 10));
+    newArray.forEach(item => {
       if (next <= newArray.length && item) {
         let sum = newArray[next];
         let endIndex = next + 1;

package/lib/pcpublic/src/components/pcfactory/src/Link/index.tsx

@@ -18,19 +18,7 @@ export interface MyLinkProps {
 }
 
 const Link = LingxiForwardRef<any, MyLinkProps>((props, ref) => {
-  const {
-    visible = true,
-    linkValue,
-    download,
-    href,
-    style,
-    onClick,
-    className,
-    getEngineApis,
-    $$componentItem,
-    clickType,
-    ...restProps
-  } = props;
+  const { visible = true, linkValue, download, href, style, onClick, className, getEngineApis, $$componentItem, clickType, ...restProps } = props;
 
   const [compFileId, setCompFileId] = useListenProps(props.compFileId);
 
@@ -45,8 +33,7 @@ const Link = LingxiForwardRef<any, MyLinkProps>((props, ref) => {
   };
 
   if ((download && !clickType) || clickType === 'download') {
-    specialProps.download =
-      download || clickType === 'download' ? true : compFileId;
+    specialProps.download = download || clickType === 'download' ? true : compFileId;
     isBlobDownload = Boolean(aHref && download);
   }
 
@@ -77,17 +64,20 @@ const Link = LingxiForwardRef<any, MyLinkProps>((props, ref) => {
       xhr.setRequestHeader('X-B-TARGET-ID', $$componentItem.pageId);
       xhr.setRequestHeader('X-B-AUTH', '1');
       xhr.setRequestHeader('APP-ID', $$componentItem.appId);
+      // 添加自定义头部(在info.js写入)
+      const { lxRequestHeaders } = window as any;
+      if (lxRequestHeaders) {
+        Object.keys(lxRequestHeaders).forEach(header => {
+          xhr.setRequestHeader(header, lxRequestHeaders[header]); // 设置请求头参数
+        });
+      }
       xhr.onload = () => {
         const url = window.URL.createObjectURL(xhr.response);
         const a = document.createElement('a');
-        const suffix = getAfterString(
-          xhr.getResponseHeader('Content-Disposition'),
-          '.',
-        );
+        const suffix = getAfterString(xhr.getResponseHeader('Content-Disposition'), '.');
         a.href = url;
         // @ts-ignore
-        a.download =
-          download?.indexOf('.') > -1 ? download : `${download}.${suffix}`;
+        a.download = download?.indexOf('.') > -1 ? download : `${download}.${suffix}`;
         a.click();
       };
       xhr.send();
@@ -100,7 +90,7 @@ const Link = LingxiForwardRef<any, MyLinkProps>((props, ref) => {
       className={classnames('ued-link', className)}
       {...restProps}
       {...specialProps}
-      onClick={(e) => {
+      onClick={e => {
         if (isBindOnClick) {
           onClick(e);
         } else if (specialProps.download) {

package/lib/pcpublic/src/components/pcfactory/src/LoopList/IdleView.tsx

@@ -0,0 +1,32 @@
+import { Spin } from 'antd';
+import React, { useEffect, useState } from 'react';
+import { requestHostCallback } from './scheduler';
+
+const isIE = !!((window as any).ActiveXObject || 'ActiveXObject' in window);
+
+const IdleView: React.FC<any> = props => {
+  const [renderChild, setRenderChild] = useState(false);
+
+  useEffect(() => {
+    if (!isIE) return () => {};
+
+    const cancelIdle = requestHostCallback(() => {
+      setRenderChild(true);
+    });
+    return () => {
+      cancelIdle();
+    };
+  }, []);
+
+  if (!isIE) {
+    return props.children;
+  }
+
+  if (!renderChild) {
+    return <Spin />;
+  }
+
+  return props.children;
+};
+
+export default IdleView;