@cloudbase/weda-ui 2.0.9 → 2.0.12

package/src/web/components/form/textarea/index.tsx

@@ -6,7 +6,7 @@ import { ConfigProvider, Input } from 'tea-component';
 import { usePlatform } from '../../../utils/platform';
 import { renderDecorator } from '../renderDecorator';
 import { useSyncValue } from '../../../utils/useSyncValue';
-import { CommonFormPropsType } from '../types';
+import type { CommonFormPropsType } from '../types';
 
 export default function Textarea({
   // 系统属性
@@ -26,7 +26,7 @@ export default function Textarea({
   requiredFlag = false,
   counterVisible = true,
   size = 'l',
-  decorator
+  decorator,
 }: PropsType) {
   const platform = usePlatform();
 
@@ -44,7 +44,7 @@ export default function Textarea({
 
   // 两次默认值不同时, 需要刷新value
   const [value, setValue] = useSyncValue(defaultValue);
-  const counter = React.useMemo(() => (value?.length || 0), [value]);
+  const counter = React.useMemo(() => value?.length || 0, [value]);
 
   const onChange = function (e) {
     const text = typeof e === 'string' ? e : e.target.value;
@@ -53,7 +53,7 @@ export default function Textarea({
   };
 
   let textAreaElement;
-  if(platform === 'h5') {
+  if (platform === 'h5') {
     textAreaElement = (
       <div className={subCls}>
         <div className="weui-cell__bd">
@@ -77,32 +77,33 @@ export default function Textarea({
   } else {
     textAreaElement = (
       <ConfigProvider classPrefix="wedatea2td">
-          <Input.TextArea
-            size={size}
-            placeholder={placeholder}
-            value={value}
-            onChange={onChange}
-            maxLength={maxLength}
-            disabled={disabled}
-            autoFocus={autoFocus}
-            showCount
-          ></Input.TextArea>
+        <Input.TextArea
+          size={size}
+          placeholder={placeholder}
+          value={value}
+          onChange={onChange}
+          maxLength={maxLength}
+          disabled={disabled}
+          autoFocus={autoFocus}
+          showCount
+        ></Input.TextArea>
       </ConfigProvider>
     );
   }
 
-  return renderDecorator(textAreaElement, decorator)(
-    {
-      id,
-      className: cls,
-      style,
-      label: labelVisible ? label : null,
-      layout,
-      multiCell: false,
-      requiredFlag,
-      size
-    }
-  );
+  return renderDecorator(
+    textAreaElement,
+    decorator
+  )({
+    id,
+    className: cls,
+    style,
+    label: labelVisible ? label : null,
+    layout,
+    multiCell: false,
+    requiredFlag,
+    size,
+  });
 }
 export interface PropsType extends CommonFormPropsType {
   defaultValue?: string;

package/src/web/components/form/types.d.ts

@@ -1,12 +1,12 @@
-import * as React from "react";
-import { CommonPropsType } from "../../types";
+import * as React from 'react';
+import type { CommonPropsType } from '../../types';
 
 export interface CommonFormPropsType extends CommonPropsType {
-    name?: string;
-    label?: string;
-    labelVisible?: boolean;
-    layout?: "horizontal" | "vertical";
-    disabled?: boolean;
-    requiredFlag?: boolean;
-    decorator?: React.FC<any>;
-}
+  name?: string;
+  label?: string;
+  labelVisible?: boolean;
+  layout?: 'horizontal' | 'vertical';
+  disabled?: boolean;
+  requiredFlag?: boolean;
+  decorator?: React.FC<any>;
+}

package/src/web/components/form/uploader/uploader.h5.tsx

@@ -6,7 +6,7 @@ import isObjectEqual from '../../../utils/isObjectEqual';
 import { useSyncValue } from '../../../utils/useSyncValue';
 import { isCloudFileID } from '../../../utils/platform';
 import { IMAGE_TYPES } from './uploader.pc';
-import { CommonFormPropsType } from '../types';
+import type { CommonFormPropsType } from '../types';
 import { v4 } from 'uuid';
 
 const uploadPath = 'weda-uploader';
@@ -122,7 +122,7 @@ export function ImageUploaderH5({
   }, [acceptTypes]);
 
   const showAdd = React.useMemo(() => {
-    if(single) {
+    if (single) {
       // single 模式时，仅当数组为空时显示
       return fileIdList.length < 1;
     }
@@ -132,7 +132,13 @@ export function ImageUploaderH5({
     <div className={cls} id={id} style={style}>
       <div className={classNames('weui-uploader', layout)}>
         <div className={classNames('weui-uploader__hd', layout)}>
-          <UploaderLabel layout={layout} title={title} currentCount={fileIdList.length} maxCount={finalMaxImgCount} requiredFlag={requiredFlag} />
+          <UploaderLabel
+            layout={layout}
+            title={title}
+            currentCount={fileIdList.length}
+            maxCount={finalMaxImgCount}
+            requiredFlag={requiredFlag}
+          />
         </div>
 
         <div className="weui-uploader__bd">
@@ -142,9 +148,7 @@ export function ImageUploaderH5({
             ))}
             {uploading && (
               <li className="weui-uploader__file weui-uploader__file_status">
-                <div className="weui-uploader__file-content">
-                  {progress}%
-                </div>
+                <div className="weui-uploader__file-content">{progress}%</div>
               </li>
             )}
           </ul>
@@ -251,11 +255,17 @@ export interface H5UploaderProps extends CommonFormPropsType {
   onChange?: (v: any) => void;
 }
 
-const UploaderLabel = ({layout, title, currentCount, maxCount, requiredFlag}) => {
-  if(layout === 'horizontal') {
+const UploaderLabel = ({
+  layout,
+  title,
+  currentCount,
+  maxCount,
+  requiredFlag,
+}) => {
+  if (layout === 'horizontal') {
     return (
       <React.Fragment>
-        <div className='weda-formcells__label weui-cell'>
+        <div className="weda-formcells__label weui-cell">
           <div>
             <p className="weui-uploader__title">{title}</p>
             <div className="weui-uploader__info">
@@ -263,25 +273,21 @@ const UploaderLabel = ({layout, title, currentCount, maxCount, requiredFlag}) =>
               {`/${maxCount}`}
             </div>
           </div>
-          {requiredFlag && (
-              <label className="weda-formcells__flag">*</label>
-          )}
+          {requiredFlag && <label className="weda-formcells__flag">*</label>}
         </div>
       </React.Fragment>
-    )
+    );
   }
   return (
-    <div className='weda-formcells__label weui-cell'>
-      <div className='weui-uploader__label'>
+    <div className="weda-formcells__label weui-cell">
+      <div className="weui-uploader__label">
         <p className="weui-uploader__title">{title}</p>
-        {requiredFlag && (
-                <label className="weda-formcells__flag">*</label>
-        )}
+        {requiredFlag && <label className="weda-formcells__flag">*</label>}
       </div>
       <div className="weui-uploader__info">
         <span id="uploadCount">{currentCount}</span>
         {`/${maxCount}`}
       </div>
     </div>
-  )
-}
+  );
+};

package/src/web/components/form/uploaderFile/index.jsx

@@ -1,6 +1,5 @@
 /* eslint-disable react/prop-types */
 import * as React from 'react';
-import * as PropTypes from 'prop-types';
 import { usePlatform } from '../../../utils/platform';
 import { UploadFileH5 as UploaderH5 } from './uploadFile.h5';
 import { UploadFilePc } from './uploadFile.pc';
@@ -24,7 +23,3 @@ export default function UploaderFile(props) {
     <UploadFilePc {...props} />
   );
 }
-
-UploaderFile.propTypes = {
-  showType: PropTypes.string, // 强制展示某个平台 pc | h5
-};

package/src/web/components/form/uploaderFile/uploadFile.h5.tsx

@@ -1,13 +1,10 @@
 import * as React from 'react';
-import * as PropTypes from 'prop-types';
 import weui from '../../../utils/weui';
-import { CommonFormPropsType } from '../types';
+import type { CommonFormPropsType } from '../types';
 import isObjectEqual from '../../../utils/isObjectEqual';
 import {
-  Upload,
   ConfigProvider,
   Button,
-  message,
   Icon,
   Text,
   List,
@@ -74,18 +71,25 @@ export function UploadFileH5({
   onChange = null,
   isEdit = true,
 }: IUploadFileH5) {
-  const [fileIDList, setfileIDList] = React.useState(filterStrList([].concat(defaultValue, value))); // 上传成功文件ID列表，fileID[]
+  const [fileIDList, setfileIDList] = React.useState(
+    filterStrList([].concat(defaultValue, value))
+  ); // 上传成功文件ID列表，fileID[]
   const [fileList, setFileList] = React.useState([]); // 上传中的文件列表，file[]，file为原始文件 + uuid属性
   const [fileSizeObj, setFileSizeObj] = React.useState({}); // 管理上传文件大小 {uuid:size}
-    // 两次默认值不同, 需要刷新
-    const prevDefaultRef = React.useRef<any>([]);
-    React.useMemo(()=>{
+  // 两次默认值不同, 需要刷新
+  const prevDefaultRef = React.useRef<any>([]);
+  React.useMemo(() => {
     //有有效默认值时不刷新，解决初次渲染默认值不显示问题
-   if(defaultValue&&!isObjectEqual(prevDefaultRef.current,defaultValue)&&(JSON.stringify(prevDefaultRef.current)=='[]'||!prevDefaultRef.current)){
-   prevDefaultRef.current =defaultValue;
+    if (
+      defaultValue &&
+      !isObjectEqual(prevDefaultRef.current, defaultValue) &&
+      (JSON.stringify(prevDefaultRef.current) == '[]' ||
+        !prevDefaultRef.current)
+    ) {
+      prevDefaultRef.current = defaultValue;
       setfileIDList(filterStrList([].concat(defaultValue)));
     }
-    },[defaultValue]);
+  }, [defaultValue]);
   React.useEffect(() => {
     // 外部 onChange 事件
     const pureFileIDList = fileIDList.filter(

package/src/web/components/form/uploaderFile/uploadFile.pc.tsx

@@ -21,7 +21,7 @@ import {
 import { getCloudInstance, getTempFileURL } from '../../../utils/tcb';
 import classNames from '../../../utils/classnames';
 import { renderDecorator } from '../renderDecorator';
-import { CommonFormPropsType } from '../types';
+import type { CommonFormPropsType } from '../types';
 import isObjectEqual from '../../../utils/isObjectEqual';
 
 // 默认组件类前缀
@@ -68,20 +68,25 @@ export function UploadFilePc({
   onChange = null,
   isEdit = true,
 }: IUploaderFilePc) {
-
-
-  const [fileIDList, setfileIDList] = React.useState(filterStrList([].concat(defaultValue, value))); // 上传成功文件ID列表，fileID[]
+  const [fileIDList, setfileIDList] = React.useState(
+    filterStrList([].concat(defaultValue, value))
+  ); // 上传成功文件ID列表，fileID[]
   const [fileList, setFileList] = React.useState([]); // 上传中的文件列表，file[]，file为原始文件 + uuid属性
   const [fileSizeObj, setFileSizeObj] = React.useState({}); // 管理上传文件大小 {uuid:size}
-    // 两次默认值不同, 需要刷新
+  // 两次默认值不同, 需要刷新
   const prevDefaultRef = React.useRef<any>([]);
-  React.useMemo(()=>{
+  React.useMemo(() => {
     //有有效默认值时不刷新，解决初次渲染默认值不显示问题
-   if(defaultValue&&!isObjectEqual(prevDefaultRef.current,defaultValue)&&(JSON.stringify(prevDefaultRef.current)=='[]'||!prevDefaultRef.current)){
-      prevDefaultRef.current =defaultValue;
+    if (
+      defaultValue &&
+      !isObjectEqual(prevDefaultRef.current, defaultValue) &&
+      (JSON.stringify(prevDefaultRef.current) == '[]' ||
+        !prevDefaultRef.current)
+    ) {
+      prevDefaultRef.current = defaultValue;
       setfileIDList(filterStrList([].concat(defaultValue)));
     }
-    },[defaultValue]);
+  }, [defaultValue]);
   React.useEffect(() => {
     // 外部 onChange 事件
     const pureFileIDList = fileIDList.filter(

package/src/web/components/image/image.tsx

@@ -109,7 +109,7 @@ export function ImageInner({
               const windowHeight = window.innerHeight;
               const windowWidth = window.innerWidth;
               let ratio = realWidth.current / realHeight.current;
-              if(Number.isNaN(ratio)) {
+              if (Number.isNaN(ratio)) {
                 ratio = 1;
               }
               const height = windowWidth / ratio;
@@ -184,4 +184,4 @@ export function ImageInner({
       </ConfigProvider>
     );
   }
-}
+}

package/src/web/components/image/index.css

@@ -42,11 +42,13 @@
 }
 .weda-image:not([src]):before,
 .weda-image-error::before {
-    content: '';
-    background: #f5f5f5 url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgdmlld0JveD0iMCAwIDMyIDMyIiBmaWxsPSJub25lIj4KICA8cGF0aCBkPSJNMjUuMzIgMTYuMzU5N0MyNi4wNzY0IDE2LjM1OTcgMjYuODI1NCAxNi41MDg3IDI3LjUyNDMgMTYuNzk4MUMyOC4yMjMxIDE3LjA4NzYgMjguODU4MSAxNy41MTE5IDI5LjM5MjkgMTguMDQ2OEMyOS45Mjc4IDE4LjU4MTYgMzAuMzUyMSAxOS4yMTY2IDMwLjY0MTYgMTkuOTE1NEMzMC45MzEgMjAuNjE0MyAzMS4wOCAyMS4zNjMzIDMxLjA4IDIyLjExOTdDMzEuMDggMjIuODc2MSAzMC45MzEgMjMuNjI1MSAzMC42NDE2IDI0LjMyMzlDMzAuMzUyMSAyNS4wMjI4IDI5LjkyNzggMjUuNjU3OCAyOS4zOTI5IDI2LjE5MjZDMjguODU4MSAyNi43Mjc1IDI4LjIyMzEgMjcuMTUxOCAyNy41MjQzIDI3LjQ0MTJDMjYuODI1NCAyNy43MzA3IDI2LjA3NjQgMjcuODc5NyAyNS4zMiAyNy44Nzk3QzIzLjc5MjQgMjcuODc5NyAyMi4zMjczIDI3LjI3MjggMjEuMjQ3MSAyNi4xOTI2QzIwLjE2NjkgMjUuMTEyNCAxOS41NiAyMy42NDczIDE5LjU2IDIyLjExOTdDMTkuNTYgMjAuNTkyIDIwLjE2NjkgMTkuMTI3IDIxLjI0NzEgMTguMDQ2OEMyMi4zMjczIDE2Ljk2NjUgMjMuNzkyNCAxNi4zNTk3IDI1LjMyIDE2LjM1OTdaTTI4IDMuNTU5NjlWMTQuODc2OEMyNy4xNzc3IDE0LjU4NjYgMjYuMTkyIDE0LjQzODggMjUuMzIgMTQuNDM5N0MyNC4wMzEgMTQuNDM5NyAyMi44MTU3IDE0Ljc1NzEgMjEuNzQ4OCAxNS4zMTg0TDIwLjc5NTIgMTMuMTU5N0wxNi4wMjU5IDIwLjAyNzVMOC40NDU3NiAxNi40NDFMMy41NiAyMy4zOTk3SDE3Ljc0NjJDMTcuOTg2NyAyNC44MjkgMTguNjI4MiAyNi4xNjA2IDE5LjU5NTggMjcuMjM5N0gxVjMuNTU5NjlIMjhaTTI1Ljk2IDI0LjAzOTdIMjQuNjhWMjUuMzE5N0gyNS45NlYyNC4wMzk3Wk0yNS45NiAxOC45MTk3SDI0LjY4VjIzLjM5OTdIMjUuOTZWMTguOTE5N1pNNi4xMiAxMC41OTk3QzYuMTIgMTEuOTk4MSA3LjE5OTA0IDEzLjEwODUgOC42MDc2OCAxMy4xNTg0QzEwLjAyMDggMTMuMjA3NyAxMS4yNCAxMi4wNDggMTEuMjQgMTAuNTk5N0MxMS4yNCA5LjI0NjA5IDEwLjA2NDMgOC4wODU3NyA4Ljc1MjMyIDguMDQwOTdDNy4yOTU2OCA3Ljk5MTY5IDYuMTIgOS4xNTEzNyA2LjEyIDEwLjU5OTdaIiBmaWxsPSIjQkNDNEQwIj48L3BhdGg+Cjwvc3ZnPgo=') no-repeat center / 50% 50%;
-    position: absolute;
-    left: 0;
-    top: 0;
-    width: 100%;
-    height: 100%;
+  content: '';
+  background: #f5f5f5
+    url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgdmlld0JveD0iMCAwIDMyIDMyIiBmaWxsPSJub25lIj4KICA8cGF0aCBkPSJNMjUuMzIgMTYuMzU5N0MyNi4wNzY0IDE2LjM1OTcgMjYuODI1NCAxNi41MDg3IDI3LjUyNDMgMTYuNzk4MUMyOC4yMjMxIDE3LjA4NzYgMjguODU4MSAxNy41MTE5IDI5LjM5MjkgMTguMDQ2OEMyOS45Mjc4IDE4LjU4MTYgMzAuMzUyMSAxOS4yMTY2IDMwLjY0MTYgMTkuOTE1NEMzMC45MzEgMjAuNjE0MyAzMS4wOCAyMS4zNjMzIDMxLjA4IDIyLjExOTdDMzEuMDggMjIuODc2MSAzMC45MzEgMjMuNjI1MSAzMC42NDE2IDI0LjMyMzlDMzAuMzUyMSAyNS4wMjI4IDI5LjkyNzggMjUuNjU3OCAyOS4zOTI5IDI2LjE5MjZDMjguODU4MSAyNi43Mjc1IDI4LjIyMzEgMjcuMTUxOCAyNy41MjQzIDI3LjQ0MTJDMjYuODI1NCAyNy43MzA3IDI2LjA3NjQgMjcuODc5NyAyNS4zMiAyNy44Nzk3QzIzLjc5MjQgMjcuODc5NyAyMi4zMjczIDI3LjI3MjggMjEuMjQ3MSAyNi4xOTI2QzIwLjE2NjkgMjUuMTEyNCAxOS41NiAyMy42NDczIDE5LjU2IDIyLjExOTdDMTkuNTYgMjAuNTkyIDIwLjE2NjkgMTkuMTI3IDIxLjI0NzEgMTguMDQ2OEMyMi4zMjczIDE2Ljk2NjUgMjMuNzkyNCAxNi4zNTk3IDI1LjMyIDE2LjM1OTdaTTI4IDMuNTU5NjlWMTQuODc2OEMyNy4xNzc3IDE0LjU4NjYgMjYuMTkyIDE0LjQzODggMjUuMzIgMTQuNDM5N0MyNC4wMzEgMTQuNDM5NyAyMi44MTU3IDE0Ljc1NzEgMjEuNzQ4OCAxNS4zMTg0TDIwLjc5NTIgMTMuMTU5N0wxNi4wMjU5IDIwLjAyNzVMOC40NDU3NiAxNi40NDFMMy41NiAyMy4zOTk3SDE3Ljc0NjJDMTcuOTg2NyAyNC44MjkgMTguNjI4MiAyNi4xNjA2IDE5LjU5NTggMjcuMjM5N0gxVjMuNTU5NjlIMjhaTTI1Ljk2IDI0LjAzOTdIMjQuNjhWMjUuMzE5N0gyNS45NlYyNC4wMzk3Wk0yNS45NiAxOC45MTk3SDI0LjY4VjIzLjM5OTdIMjUuOTZWMTguOTE5N1pNNi4xMiAxMC41OTk3QzYuMTIgMTEuOTk4MSA3LjE5OTA0IDEzLjEwODUgOC42MDc2OCAxMy4xNTg0QzEwLjAyMDggMTMuMjA3NyAxMS4yNCAxMi4wNDggMTEuMjQgMTAuNTk5N0MxMS4yNCA5LjI0NjA5IDEwLjA2NDMgOC4wODU3NyA4Ljc1MjMyIDguMDQwOTdDNy4yOTU2OCA3Ljk5MTY5IDYuMTIgOS4xNTEzNyA2LjEyIDEwLjU5OTdaIiBmaWxsPSIjQkNDNEQwIj48L3BhdGg+Cjwvc3ZnPgo=')
+    no-repeat center / 50% 50%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
 }

package/src/web/components/image/index.tsx

@@ -4,17 +4,33 @@ import { useState, useEffect } from 'react';
 import classNames from '../../utils/classnames';
 import './index.css';
 import { ImageInner } from './image';
-import { CommonPropsType } from '../../types';
+import type { CommonPropsType } from '../../types';
 
-
-const defaultSrc = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODAiIGhlaWdodD0iODAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48Y2lyY2xlIGN4PSI0MCIgY3k9IjQwIiByPSI0MCIgZmlsbD0iI0VCRUZGNSIvPjxwYXRoIGZpbGw9IiNGRkYiIGQ9Ik0yMCA1NlYyNGg0MHYzMnoiLz48cGF0aCBmaWxsPSIjQzFDQ0REIiBkPSJNMjYgMzdoMjh2MkgyNnptMCA3aDIwdjJIMjZ6bS02LTIwaDQwdjdIMjB6Ii8+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNDggNDQpIj48Y2lyY2xlIGZpbGw9IiNGRkYiIGN4PSIxMCIgY3k9IjEwIiByPSI3Ii8+PHBhdGggZD0iTTEwIDJhOCA4IDAgMSAxIDAgMTYgOCA4IDAgMCAxIDAtMTZ6bTEgMTBIOXYyaDJ2LTJ6bTAtNkg5djVoMlY2eiIgZmlsbD0iIzAwNkVGRiIvPjwvZz48L2c+PC9zdmc+';
-type TMode = 'scaleToFill' | 'aspectFit' | 'aspectFill' | 'widthFix' | 'heightFix' | 'top' | 'bottom' | 'center' | 'left' | 'right' | 'top left' | 'top right' | 'bottom left' | 'bottom right';
-export interface PropsType extends CommonPropsType, Pick<HTMLImageElement, 'src'|'alt'> {
-  mode: TMode,
-  lazyLoad: boolean,
-  maskClosable: boolean,
-  imgPreview: boolean,
-  fit: React.CSSProperties['objectFit']
+const defaultSrc =
+  'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODAiIGhlaWdodD0iODAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48Y2lyY2xlIGN4PSI0MCIgY3k9IjQwIiByPSI0MCIgZmlsbD0iI0VCRUZGNSIvPjxwYXRoIGZpbGw9IiNGRkYiIGQ9Ik0yMCA1NlYyNGg0MHYzMnoiLz48cGF0aCBmaWxsPSIjQzFDQ0REIiBkPSJNMjYgMzdoMjh2MkgyNnptMCA3aDIwdjJIMjZ6bS02LTIwaDQwdjdIMjB6Ii8+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNDggNDQpIj48Y2lyY2xlIGZpbGw9IiNGRkYiIGN4PSIxMCIgY3k9IjEwIiByPSI3Ii8+PHBhdGggZD0iTTEwIDJhOCA4IDAgMSAxIDAgMTYgOCA4IDAgMCAxIDAtMTZ6bTEgMTBIOXYyaDJ2LTJ6bTAtNkg5djVoMlY2eiIgZmlsbD0iIzAwNkVGRiIvPjwvZz48L2c+PC9zdmc+';
+type TMode =
+  | 'scaleToFill'
+  | 'aspectFit'
+  | 'aspectFill'
+  | 'widthFix'
+  | 'heightFix'
+  | 'top'
+  | 'bottom'
+  | 'center'
+  | 'left'
+  | 'right'
+  | 'top left'
+  | 'top right'
+  | 'bottom left'
+  | 'bottom right';
+export interface PropsType
+  extends CommonPropsType,
+    Pick<HTMLImageElement, 'src' | 'alt'> {
+  mode: TMode;
+  lazyLoad: boolean;
+  maskClosable: boolean;
+  imgPreview: boolean;
+  fit: React.CSSProperties['objectFit'];
 }
 
 export default function Image({
@@ -75,8 +91,9 @@ export default function Image({
   ) : null;
 }
 
-
-function getObjectFitByWxImageMode(mode: TMode): React.CSSProperties['objectFit'] {
+function getObjectFitByWxImageMode(
+  mode: TMode
+): React.CSSProperties['objectFit'] {
   const array = [
     {
       mode: 'scaleToFill',

package/src/web/components/index.js

@@ -47,6 +47,7 @@ export { default as Link } from './link';
 export { default as Drawer } from './drawer';
 export { default as UploaderView } from './uploaderView';
 export { default as UploaderFileView } from './uploaderFileView';
+export { default as WedaVideo } from './wedaVideo/index';
 
 export { default as Picker } from './picker/picker';
 export { default as DatePicker } from './picker/datePicker';

package/src/web/components/link/index.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { CommonPropsType } from '../../types';
+import type { CommonPropsType } from '../../types';
 import classNames from '../../utils/classnames';
 import './index.css';
 
@@ -7,17 +7,17 @@ export interface PropsType extends CommonPropsType {
   /**
    * 内容
    */
-   content?: string;
-   /**
-    * 链接地址
-    */
-   url?: string;
-   /**
-    * 参数
-    */
-   params?: {key: string, value: string}[];
-   contentSlot?: React.ReactNode;
-   isOpenInNewWindow: boolean;
+  content?: string;
+  /**
+   * 链接地址
+   */
+  url?: string;
+  /**
+   * 参数
+   */
+  params?: { key: string; value: string }[];
+  contentSlot?: React.ReactNode;
+  isOpenInNewWindow: boolean;
 }
 
 // 所有绝对地址直接交由浏览器，新开窗口交由浏览器
@@ -110,7 +110,7 @@ export default function Link({
           }
         }
       }}
-      rel='noopener noreferrer'
+      rel="noopener noreferrer"
     >
       {contentSlot && <div className="weda-link-slot">{contentSlot}</div>}
       {content}