@lingxiteam/ebe-utils 0.2.22 → 0.2.24

package/lib/h5public/yarn.lock

@@ -3200,15 +3200,14 @@
   resolved "http://npm.iwhalecloud.com:8081/repository/npm-taobao/@lingxiteam/editor-types/-/editor-types-3.7.1.tgz#d6bb18884fa5ef68e636cffa74ac0b6af71e91bf"
   integrity sha512-I3u3XqcC74k9ecCcaJy5j7tQolCNfNRjBjc8wl6eZVY5YlZOSOApOG2pTgdF0yHNBYYcM0BMpexrjhZp4FVNAQ==
 
-"@lingxiteam/icons@0.0.3":
-  version "0.0.3"
-  resolved "https://registry.npmmirror.com/@lingxiteam/icons/-/icons-0.0.3.tgz#5948d8ace7f666fc64b410133cf4261b473fa694"
-  integrity sha512-w1t3LCBH4mKYK6dxpuVtY8qmQjXgO9Jgqg1x+H83AMfgMJ2qauM0M0O8Iwe5liBsyVMJtCNM0A7JJ2Cv/Pvppw==
+"@lingxiteam/icons@^4.3.1-alhpa.2":
+  version "4.3.1-alhpa.2"
+  resolved "http://npm.iwhalecloud.com:8081/repository/npm-taobao/@lingxiteam/icons/-/icons-4.3.1-alhpa.2.tgz#80f74d8ab6d8bab734a67dd5b41b4bd269fa1139"
+  integrity sha512-4wbfqGxXDV3BUdSqm5sFPYcuEIDtP5+9VBNVhJ5TPFpjcLsf3Dwnh4P7thXFu+3bSZVaXffGHQGzvWrgLeILsQ==
   dependencies:
-    "@ant-design/icons" "^4.0.0"
-    lodash.camelcase "4.3.0"
-    lodash.upperfirst "4.3.1"
-    rc-util "4.10.0"
+    "@ant-design/icons" "^4.7.0"
+    "@babel/runtime" "7.23.2"
+    rc-util "^4.10.0"
 
 "@lingxiteam/load-framework@0.2.1":
   version "0.2.1"

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

@@ -1,10 +1,11 @@
-import { LingxiForwardRef } from '@lingxiteam/types';
-import { Button } from 'antd';
+import Button from 'antd/es/button';
 import type { ButtonProps } from 'antd/lib/button';
 import React, { useImperativeHandle, useMemo } from 'react';
-import CommIcon from '../Icon';
 import type { IconCfg } from '../Icon/PropsType';
+import CommIcon from '../Icon';
+import { handleIsValidIconCfg } from '../Icon/hooks';
 import { useListenProps, useListenToggleBoolean } from '../utils';
+import { LingxiForwardRef } from '@lingxiteam/types';
 import useDoubleClick from '../utils/hooks/useDoubleClick';
 
 const WrapperButton = ({ children }: Record<string, any>) =>
@@ -87,14 +88,14 @@ const MyButton = LingxiForwardRef<any, MyButtonProps>((props, ref) => {
       if (contentData?.name) {
         setBtnText(contentData.name);
         delete contentData.name;
-        if (contentData?.theme) {
-          setHasIcon(true);
-          if (!iconPosition) {
-            setIconPosition('left');
-          }
-          // icon 接收的是type 需要转化
-          setIcon({ ...contentData, type: contentData.iconType });
+      }
+
+      if (handleIsValidIconCfg(contentData)) {
+        setHasIcon(true);
+        if (!iconPosition) {
+          setIconPosition('left');
         }
+        setIcon(contentData);
       }
     },
     setLoading,

package/lib/pcpublic/src/components/pcfactory/src/Card/CardTitle/index.tsx

@@ -1,5 +1,6 @@
+import React, { useEffect, useState, useRef, useMemo } from 'react';
 import { Tooltip } from 'antd';
-import React, { useEffect, useMemo, useRef, useState } from 'react';
+import { useEventListener } from 'ahooks';
 
 interface CardTitleProps {
   title?: any;
@@ -15,7 +16,7 @@ interface CardTitleProps {
   subTitleClassName?: string;
 }
 
-const CardTitle: React.FC<CardTitleProps> = props => {
+const CardTitle: React.FC<CardTitleProps> = (props) => {
   const {
     title,
     subTitle,
@@ -39,16 +40,16 @@ const CardTitle: React.FC<CardTitleProps> = props => {
   const [showSubPopover, setShowSubPopover] = useState(false);
 
   const mainTitle = useMemo(() => {
+    let lineHeight = titleLineHeight;
+    // 为了兼容一些设置了行高为auto的历史数据
+    if (titleLineHeight && ['auto', 'fit-content', 'autopx', 'fit-contentpx'].includes(titleLineHeight)) {
+      lineHeight = undefined;
+    }
     return (
       <div
         className="main"
         ref={mainTitleRef}
-        style={{
-          color: titleColor,
-          fontSize: titleFont,
-          lineHeight: titleLineHeight,
-          fontWeight: titleFontWeight,
-        }}
+        style={{ color: titleColor, fontSize: titleFont, lineHeight, fontWeight: titleFontWeight }}
       >
         {title}
       </div>
@@ -56,16 +57,16 @@ const CardTitle: React.FC<CardTitleProps> = props => {
   }, [title, titleColor, titleFont, titleLineHeight, titleFontWeight]);
 
   const secondTitle = useMemo(() => {
+    let lineHeight = subTitleLineHeight;
+    // 为了兼容一些设置了行高为auto的历史数据
+    if (subTitleLineHeight && ['auto', 'fit-content', 'autopx', 'fit-contentpx'].includes(subTitleLineHeight)) {
+      lineHeight = undefined;
+    }
     return (
       <div
         className="sub"
         ref={subTitleRef}
-        style={{
-          color: subTitleColor,
-          fontSize: subTitleFont,
-          lineHeight: subTitleLineHeight,
-          fontWeight: subTitleFontWeight,
-        }}
+        style={{ color: subTitleColor, fontSize: subTitleFont, lineHeight, fontWeight: subTitleFontWeight }}
       >
         {subTitle}
       </div>
@@ -88,21 +89,27 @@ const CardTitle: React.FC<CardTitleProps> = props => {
     }
   };
 
-  useEffect(() => {
-    const resizeObserver = new ResizeObserver(entries => {
-      checkTitleIsElipsis();
-    });
-    // 使用ResizeObserver来监听窗口尺寸变化
-    resizeObserver.observe(document.body);
-    return () => {
-      resizeObserver.unobserve(document.body);
-    };
-  }, []);
+  // resizeObserver Api太新ie不支持，使用ahook的方法
+  // useEffect(() => {
+  //   const resizeObserver = new ResizeObserver((entries) => {
+  //     checkTitleIsElipsis();
+  //   });
+  //   // 使用ResizeObserver来监听窗口尺寸变化
+  //   resizeObserver.observe(document.body);
+  //   return (() => {
+  //     resizeObserver.unobserve(document.body);
+  //   });
+  // }, []);
+
+  useEventListener('resize', () => {
+    checkTitleIsElipsis();
+  });
 
   useEffect(() => {
     checkTitleIsElipsis();
   }, [mainTitle, secondTitle]);
 
+ 
   return (
     <>
       {showMainPopover && (

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

@@ -1,13 +1,13 @@
-import { LingxiForwardRef } from '@lingxiteam/types';
 import { Card, Skeleton } from 'antd';
 import type { CardProps } from 'antd/lib/card';
 import classnames from 'classnames';
 import React, { useImperativeHandle, useMemo, useState } from 'react';
 import CommIcon from '../Icon';
-import { useHiddenStyle } from '../utils';
 import useBackgroundStyle from '../View/useBackgroundStyle';
-import CardTitle from './CardTitle';
+import { useHiddenStyle } from '../utils';
+import { LingxiForwardRef } from '@lingxiteam/types';
 import useExtendBtn from './useExtendBtn';
+import CardTitle from './CardTitle';
 
 export type FunctionHandleType = (e: any) => void;
 
@@ -70,11 +70,11 @@ const MyCard = LingxiForwardRef<any, MyCardProps>((props, ref) => {
     pageState,
     pagePublicState,
     className,
-    cardIconType,
+    cardIconType = '',
     titleColor,
     backgroundType,
     appId,
-    prefixIcon = {},
+    prefixIcon,
     getEngineApis,
     subTitle,
     titleFont,
@@ -89,7 +89,7 @@ const MyCard = LingxiForwardRef<any, MyCardProps>((props, ref) => {
   const [loading, setLoading] = useState(props.loading);
   const engineApis = getEngineApis?.() || {};
 
-  const { padding, ...restStyle } = style || {};
+  const { padding, headPadding, ...restStyle } = style || {} as any;
   const { backgroundStyle } = useBackgroundStyle({
     engineApis,
     backgroundType,
@@ -106,6 +106,9 @@ const MyCard = LingxiForwardRef<any, MyCardProps>((props, ref) => {
     }
     if (hasHeader === false) {
       s.display = 'none';
+    } else {
+      s.display = 'flex';
+      s.alignItems = 'center';
     }
     return s;
   }, [headerColor, hasHeader]);
@@ -138,14 +141,24 @@ const MyCard = LingxiForwardRef<any, MyCardProps>((props, ref) => {
     if (hasIcon || cardIconType) {
       switch (cardIconType) {
         case 'middle':
-          return <div className="ued-card-title">{cardTitle}</div>;
+        case 'middleDivider':
+          return <div className="ued-card-title ued-card-title-middle">{cardTitle}</div>;
         case 'left':
+        case 'leftNoDivider':
           return <div className="ued-card-title ued-card-title-icon-left">{cardTitle}</div>;
         case 'auto': {
-          const { prefixIconIsIconFont, prefixIconFontAddress, prefixIconTheme, prefixIconType, prefixIconiconFile, prefixIconIconFileInfo } =
-            prefixIcon;
+          const {
+            prefixIconIsIconFont,
+            prefixIconFontAddress,
+            prefixIconTheme,
+            prefixIconType,
+            prefixIconiconFile,
+            prefixIconIconFileInfo,
+            isSystem,
+            systemIconKey,
+          } = prefixIcon || {};
           return (
-            <div className="ued-card-title ued-card-title-icon-auto">
+            <div className={classnames('ued-card-title ued-card-title-icon-auto', prefixIcon && 'ued-card-title-icon-custom')}>
               <CommIcon
                 icon={{
                   type: prefixIconType,
@@ -154,6 +167,8 @@ const MyCard = LingxiForwardRef<any, MyCardProps>((props, ref) => {
                   fontAddress: prefixIconFontAddress,
                   iconFile: prefixIconiconFile,
                   iconFileInfo: prefixIconIconFileInfo,
+                  isSystem,
+                  systemIconKey,
                 }}
                 engineApis={engineApis}
                 getEngineApis={getEngineApis}
@@ -162,8 +177,7 @@ const MyCard = LingxiForwardRef<any, MyCardProps>((props, ref) => {
               />
               {cardTitle}
             </div>
-          );
-        }
+          ); }
         case 'none':
           return <div className="ued-card-style-less-title">{cardTitle}</div>;
         default:
@@ -189,11 +203,15 @@ const MyCard = LingxiForwardRef<any, MyCardProps>((props, ref) => {
       style={finalStyle}
       {...restProps}
       className={classnames('ued-card', className, {
-        'ued-card-simple': cardIconType === 'middle',
+        'ued-card-simple': ['leftNoDivider', 'middle'].includes(cardIconType),
       })}
       size={size}
       title={renderTitle()}
-      headStyle={headStyle}
+      headStyle={{
+        padding: headPadding,
+        ...headStyle,
+        display: ['flex', 'table', undefined].includes(headStyle.display) ? 'block' : headStyle.display,
+      }}
       bodyStyle={padding ? { padding, ...backgroundStyle, ...bodyStyleRelative } : { ...backgroundStyle, ...bodyStyleRelative }}
       extra={<div className="ued-card-extend">{renderExtendBtn()}</div>}
     >

package/lib/pcpublic/src/components/pcfactory/src/Card/useExtendBtn.tsx

@@ -1,28 +1,27 @@
-import { Icon } from '@lingxiteam/icons';
-import { Button, Popover, Tooltip } from 'antd';
 import { ButtonType } from 'antd/lib/button';
-import { SizeType } from 'antd/lib/config-provider/SizeContext';
-import CommIcon from '../Icon';
 import type { IconCfg } from '../Icon/PropsType';
+import { Button, Popover, Tooltip } from 'antd';
+import { Icon } from '@lingxiteam/icons';
+import CommIcon from '../Icon';
+import React from 'react';
 import { useLocale } from '../utils/hooks/useLocale';
+import { SizeType } from 'antd/lib/config-provider/SizeContext';
 
 interface ExtendProps {
-  extend?: Array<{
-    icon: IconCfg;
-    iconPos: 'left' | 'right';
-    id: string;
-    btnType?: ButtonType;
-    btnSize?: SizeType;
-    isIcon?: boolean;
-    rule?: string;
-    visible?: boolean;
-    checked?: boolean;
+  extend?: Array<{icon: IconCfg,
+    iconPos: 'left' | 'right',
+    id: string,
+    btnType?: ButtonType,
+    btnSize?: SizeType,
+    isIcon?: boolean,
+    rule?: string,
+    visible?: boolean,
+    checked?: boolean,
     value?: string;
-    disabled?: boolean;
-  }>;
-  getEngineApis: any;
-  extendNum?: number;
-  $$componentItem?: any;
+    disabled?: boolean}>,
+    getEngineApis: any;
+    extendNum?: number;
+    $$componentItem?: any;
   prefixCls?: string;
   [key: string | number]: unknown;
 }
@@ -35,14 +34,30 @@ const useExtendBtn = (props: ExtendProps) => {
   const renderBtn = (btnList: any, isPopover = false, clicks: any) => {
     if (Array.isArray(btnList)) {
       return btnList.map((c, i) => {
-        const { icon, iconPos, id, btnType, btnSize, isIcon, rule, visible: buttonVisible = true, disabled } = c;
+        const {
+          icon,
+          iconPos,
+          id,
+          btnType,
+          btnSize,
+          isIcon,
+          rule,
+          visible: buttonVisible = true,
+          disabled,
+        } = c;
         const handleOnClick = (e: any) => {
           if (clicks[i] && typeof clicks[i] === 'function') {
             clicks[i](e);
           }
         };
         const BtnIcon = icon ? (
-          <Button className={`${prefixCls}-extend-iconBtn`} type="link" disabled={disabled} key={isIcon && id} onClick={isIcon && handleOnClick}>
+          <Button
+            className={`${prefixCls}-extend-iconBtn`}
+            type="link"
+            disabled={disabled}
+            key={isIcon && id}
+            onClick={isIcon && handleOnClick}
+          >
             {/** @ts-ignore */}
             <CommIcon icon={icon} engineApis={engineApis} getEngineApis={getEngineApis} />
           </Button>
@@ -66,37 +81,55 @@ const useExtendBtn = (props: ExtendProps) => {
               )
             ) : isPopover ? (
               <div>
-                <Button disabled={disabled} key={id} type="link" size={btnSize} onClick={handleOnClick}>
-                  {iconPos && iconPos === 'left' && icon && (
-                    <CommIcon
-                      icon={icon}
-                      engineApis={engineApis}
-                      getEngineApis={getEngineApis}
-                      $$componentItem={props.$$componentItem}
-                      className=""
-                    />
-                  )}
+                <Button
+                  disabled={disabled}
+                  key={id}
+                  type="link"
+                  size={btnSize}
+                  onClick={handleOnClick}
+                >
+                  {iconPos && iconPos === 'left' && icon &&
+                  <CommIcon
+                    icon={icon}
+                    engineApis={engineApis}
+                    getEngineApis={getEngineApis}
+                    $$componentItem={props.$$componentItem}
+                    className=""
+                  />}
                   {c.title}
-                  {iconPos && iconPos === 'right' && icon && (
-                    <CommIcon
-                      icon={icon}
-                      engineApis={engineApis}
-                      getEngineApis={getEngineApis}
-                      $$componentItem={props.$$componentItem}
-                      className=""
-                    />
-                  )}
+                  {iconPos && iconPos === 'right' && icon && <CommIcon
+                    icon={icon}
+                    engineApis={engineApis}
+                    getEngineApis={getEngineApis}
+                    $$componentItem={props.$$componentItem}
+                    className=""
+                  />}
                 </Button>
               </div>
             ) : (
-              <Button disabled={disabled} key={id} className={`${prefixCls}-extend-btn`} type={btnType} size={btnSize} onClick={handleOnClick}>
-                {iconPos && iconPos === 'left' && icon && (
-                  <CommIcon icon={icon} engineApis={engineApis} getEngineApis={getEngineApis} $$componentItem={props.$$componentItem} className="" />
-                )}
+              <Button
+                disabled={disabled}
+                key={id}
+                className={`${prefixCls}-extend-btn`}
+                type={btnType}
+                size={btnSize}
+                onClick={handleOnClick}
+              >
+                {iconPos && iconPos === 'left' && icon && <CommIcon
+                  icon={icon}
+                  engineApis={engineApis}
+                  getEngineApis={getEngineApis}
+                  $$componentItem={props.$$componentItem}
+                  className=""
+                />}
                 {c.title}
-                {iconPos && iconPos === 'right' && icon && (
-                  <CommIcon icon={icon} engineApis={engineApis} getEngineApis={getEngineApis} $$componentItem={props.$$componentItem} className="" />
-                )}
+                {iconPos && iconPos === 'right' && icon && <CommIcon
+                  icon={icon}
+                  engineApis={engineApis}
+                  getEngineApis={getEngineApis}
+                  $$componentItem={props.$$componentItem}
+                  className=""
+                />}
               </Button>
             )
           ) : null
@@ -120,7 +153,11 @@ const useExtendBtn = (props: ExtendProps) => {
       const clicks = [...showBtnClick];
       const preBtn = btnList.splice(0, extendNum);
       const preClicks = clicks.splice(0, extendNum);
-      const content = <div className={`${prefixCls}-extend-btn-pop`}>{renderBtn(btnList, true, clicks)}</div>;
+      const content = (
+        <div className={`${prefixCls}-extend-btn-pop`}>
+          {renderBtn(btnList, true, clicks)}
+        </div>
+      );
       return (
         <>
           {renderBtn(preBtn, false, preClicks)}

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

@@ -1,17 +1,35 @@
-import { LXChart } from '@lingxiteam/charts-common';
+import React from 'react';
 import { LingXiFC } from '@lingxiteam/types';
-import { useHiddenStyle } from '../utils';
 import { useFuncExpExecute } from '../utils/hooks/useFuncExpExecute';
-import { useLocale } from '../utils/hooks/useLocale';
 import ChartLineProps from './PropsType';
+import { LXChart } from '@lingxiteam/charts-common';
+import { useHiddenStyle } from '../utils';
+import useBackgroundStyle from '../View/useBackgroundStyle';
+import { useLocale } from '../utils/hooks/useLocale';
+
 
 const ChartLine: LingXiFC<ChartLineProps> = (props, ref) => {
-  const { style, className, getEngineApis, exampleData, dataSource, dataSourceTop, visible = true, $$componentItem, ...restProps } = props;
+  const {
+    style,
+    className,
+    getEngineApis,
+    exampleData,
+    dataSource,
+    dataSourceTop,
+    visible = true,
+    $$componentItem,
+    backgroundType,
+    ...restProps
+  } = props;
 
   const finalStyle = useHiddenStyle(visible, style);
   const engineApis = getEngineApis?.();
+  const { backgroundStyle } = useBackgroundStyle({ backgroundType, engineApis, appId: $$componentItem?.appId, mode: 'engine' });
+
   const { getLocale } = useLocale(engineApis);
-  const { sandBoxSafeRun } = engineApis || {};
+  const {
+    sandBoxSafeRun,
+  } = engineApis || {};
 
   const funcExpExecute = useFuncExpExecute(sandBoxSafeRun as any, getLocale);
 
@@ -24,7 +42,7 @@ const ChartLine: LingXiFC<ChartLineProps> = (props, ref) => {
 
   return (
     <LXChart
-      style={finalStyle}
+      style={{ ...backgroundStyle, ...(finalStyle || {}) }}
       className={className}
       configProps={configProps}
       isEditMode={false}

package/lib/pcpublic/src/components/pcfactory/src/ChartLine/PropsType.ts

@@ -28,7 +28,16 @@ export default interface ChartLineProps {
   yAxisMaxRight?: number;
   yAxisFormatterRight?: string;
   color: any[]; // 颜色
-  layout: 'top' | 'left' | 'leftTop' | 'rightTop' | 'bottom' | 'right' | 'rightBottom' | 'leftBottom' | 'horizontal'; // 图标布局
+  layout:
+    | 'top'
+    | 'left'
+    | 'leftTop'
+    | 'rightTop'
+    | 'bottom'
+    | 'right'
+    | 'rightBottom'
+    | 'leftBottom'
+    | 'horizontal'; // 图标布局
   smooth?: boolean; // 平滑曲线
   lineType: 'solid' | 'dashed' | 'dotted'; // 线类型
   stacked?: any; // 堆叠
@@ -42,11 +51,27 @@ export default interface ChartLineProps {
   tooltipFormatter?: string; // 提示内容值后缀
   label?: any; // 标签支持扩展
   showLable?: boolean; // 数字标签显隐
-  symbol: 'circle' | 'rect' | 'roundRect' | 'triangle' | 'diamond' | 'pin' | 'arrow' | 'none'; // 标记图形 - 只有折线图存在symbol
+  symbol:
+    | 'circle'
+    | 'rect'
+    | 'roundRect'
+    | 'triangle'
+    | 'diamond'
+    | 'pin'
+    | 'arrow'
+    | 'none'; // 标记图形 - 只有折线图存在symbol
   symbolSize: number; // 标记大小
   markPoint?: any; // 标签支持扩展
   showMarkPoint?: boolean; // 标注显隐
-  markPointSymbol?: 'circle' | 'rect' | 'roundRect' | 'triangle' | 'diamond' | 'pin' | 'arrow' | 'none'; // 标注图形
+  markPointSymbol?:
+    | 'circle'
+    | 'rect'
+    | 'roundRect'
+    | 'triangle'
+    | 'diamond'
+    | 'pin'
+    | 'arrow'
+    | 'none'; // 标注图形
   markPointType: 'min' | 'max' | 'average'; // 标注纬度
   markLine?: any; // 标线支持扩展
   showMarkLine?: boolean; // 标线显隐
@@ -59,5 +84,6 @@ export default interface ChartLineProps {
   barGap?: number; // 组内间距
   getEngineApis?: any; // 运行态api
   funcExpExecute?: any;
-  // eslint-disable-next-line no-extra-semi
-}
+  backgroundType?:any;
+// eslint-disable-next-line no-extra-semi
+};

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

@@ -1,7 +1,8 @@
+import React, { useImperativeHandle } from 'react';
 import { LingxiForwardRef } from '@lingxiteam/types';
-import { useImperativeHandle } from 'react';
 import CharBarLoader from './loader';
 import ChartLineProps from './PropsType';
+import classNames from 'classnames';
 
 const ChartLine = LingxiForwardRef<unknown, ChartLineProps>((props, ref) => {
   useImperativeHandle(ref, () => ({
@@ -9,7 +10,7 @@ const ChartLine = LingxiForwardRef<unknown, ChartLineProps>((props, ref) => {
     // 由于组件采用懒加载延迟执行组件，导致组件在未加载完成的时候已经执行了页面加载完成的生命周期，所以未来的指令方法不应放入懒加载中，避免页面加载完成时机无法调用指令。
   }));
 
-  return <CharBarLoader {...props} />;
+  return <CharBarLoader {...props} className={classNames(props.className, 'ued-chartLine')} />;
 });
 
 export default ChartLine;

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

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