@cloudbase/weda-ui 2.0.27 → 3.1.1

package/src/web/components/tabs/tabs.pc.tsx

@@ -1,74 +0,0 @@
-import {
-  useCustomCompareEffect,
-  useMountEffect,
-  useSyncedRef,
-} from '@react-hookz/web';
-import * as React from 'react';
-import { Tabs as TeaTabs, TabPanel, ConfigProvider } from 'tea-component';
-import classNames from '../../utils/classnames';
-import isObjectEqual from '../../utils/isObjectEqual';
-import { useSyncValue } from '../../utils/useSyncValue';
-import { PropsType } from './index';
-
-export default function TabsPc({
-  tabs = [],
-  selectedIndex,
-  events,
-  className,
-  style,
-  isMultipleSlot = true,
-  ...restProps
-}: PropsType) {
-  const [activeIndex, setActiveIndex] = useSyncValue(selectedIndex);
-  const _tabs = React.useMemo(() => {
-    return (
-      Array.isArray(tabs) &&
-      tabs.length &&
-      tabs.map((item, index) => {
-        return {
-          id: index.toString(),
-          label: item.title,
-          value: item.value,
-        };
-      })
-    );
-  }, [tabs]);
-
-  const eventsRef = useSyncedRef(events);
-  useCustomCompareEffect(
-    () => {
-      eventsRef.current &&
-        eventsRef.current.change({
-          id: _tabs[activeIndex]?.id,
-          label: _tabs[activeIndex]?.label,
-          value: _tabs[activeIndex]?.value,
-        });
-    },
-    [activeIndex, _tabs],
-    isObjectEqual
-  );
-  const onActive = (e) => {
-    setActiveIndex(e.id);
-  };
-  return (
-    <ConfigProvider classPrefix="wedatea2td">
-      <TeaTabs
-        style={style}
-        tabs={_tabs}
-        activeId={String(activeIndex)}
-        onActive={onActive}
-        className={classNames('weda-tabs_pc', {
-          [className]: className,
-        })}
-      >
-        {_tabs?.map((item, index) => (
-          <TabPanel key={item.id} id={item.id}>
-            {isMultipleSlot
-              ? restProps[`panel${index + 1}`]
-              : restProps['panel1']}
-          </TabPanel>
-        ))}
-      </TeaTabs>
-    </ConfigProvider>
-  );
-}

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

@@ -1,60 +0,0 @@
-import * as React from 'react';
-import classNames from '../../utils/classnames';
-import type { CommonPropsType, unknownFunction } from '../../types';
-import './index.css';
-
-export interface PropsType extends CommonPropsType {
-  text: string;
-  level: string;
-  maxLines: number;
-  space: boolean;
-  userSelect: boolean;
-  textAlign: string;
-  textColor: string;
-  contenteditable: HTMLParagraphElement['contentEditable'];
-  onInput: unknownFunction;
-  onBlur: unknownFunction;
-}
-export default function Text({
-  text,
-  maxLines,
-  space,
-  userSelect,
-  style = {},
-  className,
-  events,
-  id,
-  level,
-  contenteditable,
-  onInput,
-  onBlur,
-}: PropsType) {
-  const textStyle: React.CSSProperties = {
-    WebkitLineClamp: maxLines,
-    whiteSpace: space ? 'pre-wrap' : 'pre-line',
-  };
-
-  if (!userSelect) {
-    textStyle.userSelect = 'none';
-  }
-  const levelName = level === '0' || !level ? '' : `level_${level}`;
-
-  const inlineStyle = React.useMemo(
-    () => ({ ...textStyle, ...style }),
-    [textStyle, style]
-  );
-  return (
-    <p
-      //@ts-expect-error contentEditable type def sucks
-      contentEditable={contenteditable}
-      onInput={onInput}
-      onBlur={onBlur}
-      style={inlineStyle}
-      className={classNames('weda-text', 'weda-ui', className, levelName)}
-      id={id}
-      onClick={(e) => events.tap({}, { originEvent: e })}
-    >
-      {text}
-    </p>
-  );
-}

package/src/web/components/uploaderFileView/index.jsx

@@ -1,84 +0,0 @@
-import * as React from 'react';
-import { UploadFilePc } from '../form/uploaderFile/uploadFile.pc';
-import { UploadFileH5 } from '../form/uploaderFile/uploadFile.h5';
-import {
-  filterStrList,
-  isCloudFileID,
-  downloadFile,
-  usePlatform,
-  transFileCloudidToName,
-} from '../../utils/platform';
-import { getTempFileURL } from '../../utils/tcb';
-import './index.css';
-
-const CLASS_PREFIX = 'weda-uploader-file-view';
-
-/**
- * 上传文件回显，传showType强制展示某端样式，否则根据平台自动判断
- */
-export default function UploaderFileView({
-  value,
-  className,
-  single = true, // 展示为单行 a 标签
-  showType, // 展示端为 pc 还是 h5 样式
-  ...rest
-}) {
-  const fileIDList = filterStrList(value);
-  if (single) {
-    return <FileView fileID={fileIDList[0]} />;
-  } else {
-    const platform = usePlatform();
-    const showTypeMix = showType ? (showType === 'h5' ? 'h5' : 'pc') : platform;
-    const uploadFileProps = {
-      ...rest,
-      className: `${CLASS_PREFIX} ${className}`,
-      decorator: null,
-      labelVisible: false,
-      value: fileIDList,
-      isEdit: false,
-    };
-    return showTypeMix === 'pc' ? (
-      <UploadFilePc {...uploadFileProps} />
-    ) : (
-      <UploadFileH5 {...uploadFileProps} />
-    );
-  }
-}
-
-/**
- * 单个文件回显，用在表格里面
- */
-const FileView = ({ fileID }) => {
-  const [src, setSrc] = React.useState('');
-
-  React.useEffect(() => {
-    const fetchFileId = async (id) => {
-      if (isCloudFileID(id)) {
-        try {
-          const fileSrc = await getTempFileURL(id);
-          setSrc(fileSrc);
-        } catch (e) {}
-      } else {
-        setSrc(id);
-      }
-    };
-    fetchFileId(fileID);
-  }, [fileID]);
-
-  const title = React.useMemo(() => {
-    if (isCloudFileID(fileID)) {
-      return transFileCloudidToName(fileID);
-    } else {
-      return fileID;
-    }
-  }, [fileID]);
-  return (
-    <a
-      title={title}
-      onClick={() => downloadFile(src)}
-      className={`${CLASS_PREFIX}__single`}
-    >
-      {title}
-    </a>
-  );
-};

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

@@ -1,92 +0,0 @@
-import * as React from 'react';
-import * as PropTypes from 'prop-types';
-import { TcbImage } from '../form/uploader/uploader.pc';
-import classNames from '../../utils/classnames';
-import './index.css';
-import { CommonPropsType } from '../../types';
-
-const CLASS_PREFIX = 'g-uploader-view';
-
-/**
- * 图片上传-展示组件
- */
-export default function UploaderView({
-  srcList, // 兼容 cloud:和https: 协议，兼容 字符串和字符串数组
-  alt = '[加载失败]',
-  gutter = 8,
-  height = 100,
-  width = 100,
-  events = {},
-  isZoom = true,
-  isEmptyPlace = true,
-  className,
-  id,
-  style,
-}: PropsType) {
-  const cls = classNames({
-    [CLASS_PREFIX]: true,
-    [className]: className,
-  });
-
-  // 成功事件，返回加载成功的链接
-  const [successList, setSuccessList] = React.useState([]);
-  // 失败事件，返回加载失败的链接
-  const [errorList, setErrorList] = React.useState([]);
-
-  React.useEffect(() => {
-    events.load && events.load({ success: successList, error: errorList });
-  }, [successList, errorList]);
-
-  const boxStyle = {
-    marginRight: gutter,
-    marginBottom: gutter,
-    height: height,
-    width: width,
-  };
-
-  const values = []
-    .concat(srcList)
-    .filter((d) => typeof d === 'string' && d !== '');
-
-  return (
-    <div className={cls} id={id} style={style}>
-      <div className={`${CLASS_PREFIX}__image-list`}>
-        {values.map((d, i) => {
-          const imgProps = {
-            fileID: d,
-            className: `${CLASS_PREFIX}__image`,
-            alt: alt,
-            isZoom,
-            onLoad: () => setSuccessList((list) => [...list, d]),
-            onError: () => setErrorList((list) => [...list, d]),
-          };
-          return (
-            <div
-              className={`${CLASS_PREFIX}__image-box`}
-              key={`${d}-${i}`}
-              style={boxStyle}
-              title={d}
-            >
-              <TcbImage {...imgProps} />
-            </div>
-          );
-        })}
-        {values.length === 0 && isEmptyPlace && (
-          <div className={`${CLASS_PREFIX}__image-box`} style={boxStyle}>
-            <img className={`${CLASS_PREFIX}__image`} alt="暂无图片" />
-          </div>
-        )}
-      </div>
-    </div>
-  );
-}
-
-export interface PropsType extends CommonPropsType {
-  srcList?: string[] | string;
-  alt?: string; // 替代文字
-  isZoom?: boolean; // 能否点击放大
-  gutter?: number; // 图片间距
-  height?: number; // 图片最大高度
-  width?: number; // 图片最大宽度
-  isEmptyPlace?: boolean; // 是否显示空值
-}

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

@@ -1,30 +0,0 @@
-import * as React from 'react';
-import Button from '../../components/button';
-import { CommonPropsType } from '../../types';
-
-const UserInfo = (props: PropsType) => <Button {...props} />;
-
-export interface PropsType extends CommonPropsType {
-  /**
-   * 按钮标题
-   */
-  text?: string;
-  /**
-   * 按钮风格
-   */
-  type?: 'primary' | 'warn' | 'wechat' | 'default';
-  /**
-   * 按钮大小
-   */
-  size?: 'default' | 'mini' | 'large';
-  /**
-   * 信息用途
-   */
-  usage?: string;
-  /**
-   * 语言
-   */
-  language?: string;
-}
-
-export default UserInfo;

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

@@ -1,208 +0,0 @@
-import * as React from 'react';
-import videojs from 'video.js';
-import 'video.js/dist/video-js.css';
-import './index.css';
-import { usePlatform, isCloudFileID, isInIde } from '../../utils/platform';
-import { getTempFileURL } from '../../utils/tcb';
-import classNames from '../../utils/classnames';
-import type { CommonPropsType } from '../../types';
-import { ConfigProvider, Icon } from 'tea-component';
-
-const { useEffect, useRef, useMemo, useState } = React;
-export interface VideoProps {
-  videoDataSource: string;
-  posterImage: string;
-  autoPlay: boolean;
-  loopPlay: boolean;
-  mutePlay: boolean;
-  controlBarStatus: boolean;
-  startTime: number;
-  endTime: number;
-}
-
-export type WedaVideoProps = Partial<CommonPropsType & VideoProps>;
-
-const MimetypesKind = {
-  opus: 'video/ogg',
-  ogv: 'video/ogg',
-  mp4: 'video/mp4',
-  mov: 'video/mp4',
-  m4v: 'video/mp4',
-  mkv: 'video/x-matroska',
-  m4a: 'audio/mp4',
-  mp3: 'audio/mpeg',
-  aac: 'audio/aac',
-  caf: 'audio/x-caf',
-  flac: 'audio/flac',
-  oga: 'audio/ogg',
-  wav: 'audio/wav',
-  m3u8: 'application/x-mpegURL',
-  jpg: 'image/jpeg',
-  jpeg: 'image/jpeg',
-  gif: 'image/gif',
-  png: 'image/png',
-  svg: 'image/svg+xml',
-  webp: 'image/webp',
-};
-
-const CLASS_PREFIX = 'weda-ui_video';
-
-const WedaVideo: React.FC<WedaVideoProps> = ({
-  className,
-  style,
-  id,
-  videoDataSource,
-  posterImage,
-  autoPlay,
-  loopPlay,
-  mutePlay,
-  controlBarStatus,
-  startTime,
-  endTime,
-}) => {
-  const platform = usePlatform();
-  const cls = classNames({
-    [className]: className,
-    [CLASS_PREFIX]: true,
-    [`${CLASS_PREFIX}-h5`]: platform === 'h5',
-    'weda-ui_video_control': !controlBarStatus,
-  });
-  const videoRef = useRef<HTMLVideoElement>(null);
-  const playerRef = useRef(null);
-
-  const [realSrc, setRealSrc] = useState(null);
-  const [videoModalStatus, setVideoModalStatus] = useState(true);
-  const [videoErrMsg, setVideoErrMsg] = useState('');
-
-  const videoType = useMemo(() => {
-    return realSrc?.substring(realSrc.lastIndexOf('.') + 1).toLowerCase();
-  }, [realSrc]);
-
-  useEffect(() => {
-    async function getCloudUrl(fileID) {
-      if (isCloudFileID(fileID)) {
-        try {
-          const fileSrc = await getTempFileURL(fileID);
-          setVideoErrMsg('');
-          setRealSrc(fileSrc);
-        } catch (err) {
-          console.error('getCloudUrl error', err);
-          setVideoErrMsg('获取云文件资源失败');
-          setRealSrc('');
-        }
-      } else {
-        setRealSrc(videoDataSource);
-      }
-    }
-    getCloudUrl(videoDataSource);
-  }, [videoDataSource]);
-
-  useEffect(() => {
-    const videoElement = videoRef.current;
-    if (!playerRef.current) {
-      const videoOptions = {
-        poster: posterImage,
-        autoplay: autoPlay, //自动播放
-        bigPlayButton: true, //全屏按钮
-        loop: loopPlay, //循环播放
-        muted: mutePlay, // 是否静音
-        controls: controlBarStatus, //显示控制栏
-        language: 'zh-CN', // 设置语言
-        fluid: true, // 自适应宽高
-        controlBar: {
-          children: [
-            { name: 'playToggle' }, // 底部暂停按钮
-            { name: 'currentTimeDisplay' }, // 当前已播放时间
-            { name: 'progressControl' }, // 进度条
-            { name: 'durationDisplay' }, // 总时间
-            {
-              name: 'volumePanel', // 音量控制
-              inline: false, // 不使用水平方式
-            },
-            { name: 'FullscreenToggle' }, // 全屏按钮
-          ],
-        },
-        sources: [
-          {
-            src: realSrc || 'no',
-            type: MimetypesKind[videoType] || 'video/mp4',
-          },
-        ],
-      };
-      playerRef.current = videojs(videoElement, videoOptions, () => {
-        players.currentTime(startTime); //指定播放时间
-        setVideoModalStatus(false);
-        setVideoErrMsg('');
-      });
-      const players = playerRef.current;
-      // 指定结束时间
-      if (endTime) {
-        players.on('timeupdate', () => {
-          //播放时间改变
-          const currentTime = players.currentTime();
-          if (startTime >= endTime) return;
-          if (currentTime > endTime) {
-            players.currentTime(startTime);
-            setTimeout(() => {
-              !loopPlay && players.pause();
-            }, 200);
-          }
-        });
-      }
-      players.on('canplaythrough', function () {
-        setVideoModalStatus(false);
-        setVideoErrMsg('');
-      });
-      players.on('error', function () {
-        let errorMsg = `视频资源加载出错，错误信息：${
-          players?.error().message
-        }`;
-        let pattern = new RegExp('^(((https?)://)|/resources/)[^\\s]+$');
-        if (
-          isInIde() &&
-          !pattern.test(videoDataSource) &&
-          !isCloudFileID(videoDataSource)
-        ) {
-          errorMsg = '请在预览区查看视频效果';
-        }
-        console.log('player error', errorMsg);
-        setVideoErrMsg(errorMsg);
-        setVideoModalStatus(true);
-      });
-    }
-  }, [videoRef]);
-
-  useEffect(() => {
-    // 切换视频源
-    if (playerRef.current && videoType) {
-      let srcOption = [
-        {
-          src: realSrc,
-          type: MimetypesKind[videoType],
-        },
-      ];
-      playerRef.current.src(srcOption);
-      playerRef.current.load(realSrc);
-    }
-  }, [realSrc]);
-
-  return (
-    <ConfigProvider classPrefix="wedatea2td">
-      <div className={cls} id={id} style={style} data-testid="wedaVideo">
-        <div data-vjs-player>
-          <video
-            ref={videoRef}
-            className={`video-js vjs-big-play-centered ${CLASS_PREFIX}__video-wrap`}
-          />
-        </div>
-        {videoModalStatus && (
-          <div className={`${CLASS_PREFIX}__video-loading`}>
-            {realSrc === null ? <Icon type="loading" /> : videoErrMsg}
-          </div>
-        )}
-      </div>
-    </ConfigProvider>
-  );
-};
-
-export default WedaVideo;

package/src/web/types.d.ts

@@ -1,21 +0,0 @@
-/// <reference types="resize-observer-browser" />
-
-import { any } from 'prop-types';
-import * as React from 'react';
-export type unknownFunction = (...args: unknown[]) => unknown;
-export interface CommonPropsType {
-  style?: React.CSSProperties;
-  id?: string;
-  events?: Record<string, unknownFunction>;
-  className?: string;
-  children?: React.ReactNode | undefined;
-}
-
-declare global {
-  var app: any;
-  interface Window {
-    app: any;
-    qq: any;
-    TMap: any;
-  }
-}

package/src/web/utils/classnames.js

@@ -1,39 +0,0 @@
-/* !
-  Copyright (c) 2018 Jed Watson.
-  Licensed under the MIT License (MIT), see
-  http://jedwatson.github.io/classnames
-*/
-
-function classNames(...args) {
-  const classes = [];
-
-  for (let i = 0; i < args.length; i++) {
-    const arg = args[i];
-    if (!arg) continue;
-
-    const argType = typeof arg;
-
-    if (argType === 'string' || argType === 'number') {
-      classes.push(arg);
-    } else if (Array.isArray(arg)) {
-      if (arg.length) {
-        const inner = classes.push(classNames(...arg));
-        if (inner) {
-          classes.push(inner);
-        }
-      }
-    } else if (argType === 'object') {
-      if (arg.toString === Object.prototype.toString) {
-        Object.keys(arg).forEach((key) => {
-          arg[key] && classes.push(key);
-        });
-      } else {
-        classes.push(arg.toString());
-      }
-    }
-  }
-
-  return classes.join(' ');
-}
-
-export default classNames;

package/src/web/utils/constant.ts

@@ -1,23 +0,0 @@
-export const TitleType = {
-  LEFT: 'left',
-  TOP: 'top',
-  NONE: 'none',
-} as const;
-
-export const LOAD_ERR_IMG_BASE64 =
-  'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgdmlld0JveD0iMCAwIDMyIDMyIiBmaWxsPSJub25lIj4KICA8cGF0aCBkPSJNMjUuMzIgMTYuMzU5N0MyNi4wNzY0IDE2LjM1OTcgMjYuODI1NCAxNi41MDg3IDI3LjUyNDMgMTYuNzk4MUMyOC4yMjMxIDE3LjA4NzYgMjguODU4MSAxNy41MTE5IDI5LjM5MjkgMTguMDQ2OEMyOS45Mjc4IDE4LjU4MTYgMzAuMzUyMSAxOS4yMTY2IDMwLjY0MTYgMTkuOTE1NEMzMC45MzEgMjAuNjE0MyAzMS4wOCAyMS4zNjMzIDMxLjA4IDIyLjExOTdDMzEuMDggMjIuODc2MSAzMC45MzEgMjMuNjI1MSAzMC42NDE2IDI0LjMyMzlDMzAuMzUyMSAyNS4wMjI4IDI5LjkyNzggMjUuNjU3OCAyOS4zOTI5IDI2LjE5MjZDMjguODU4MSAyNi43Mjc1IDI4LjIyMzEgMjcuMTUxOCAyNy41MjQzIDI3LjQ0MTJDMjYuODI1NCAyNy43MzA3IDI2LjA3NjQgMjcuODc5NyAyNS4zMiAyNy44Nzk3QzIzLjc5MjQgMjcuODc5NyAyMi4zMjczIDI3LjI3MjggMjEuMjQ3MSAyNi4xOTI2QzIwLjE2NjkgMjUuMTEyNCAxOS41NiAyMy42NDczIDE5LjU2IDIyLjExOTdDMTkuNTYgMjAuNTkyIDIwLjE2NjkgMTkuMTI3IDIxLjI0NzEgMTguMDQ2OEMyMi4zMjczIDE2Ljk2NjUgMjMuNzkyNCAxNi4zNTk3IDI1LjMyIDE2LjM1OTdaTTI4IDMuNTU5NjlWMTQuODc2OEMyNy4xNzc3IDE0LjU4NjYgMjYuMTkyIDE0LjQzODggMjUuMzIgMTQuNDM5N0MyNC4wMzEgMTQuNDM5NyAyMi44MTU3IDE0Ljc1NzEgMjEuNzQ4OCAxNS4zMTg0TDIwLjc5NTIgMTMuMTU5N0wxNi4wMjU5IDIwLjAyNzVMOC40NDU3NiAxNi40NDFMMy41NiAyMy4zOTk3SDE3Ljc0NjJDMTcuOTg2NyAyNC44MjkgMTguNjI4MiAyNi4xNjA2IDE5LjU5NTggMjcuMjM5N0gxVjMuNTU5NjlIMjhaTTI1Ljk2IDI0LjAzOTdIMjQuNjhWMjUuMzE5N0gyNS45NlYyNC4wMzk3Wk0yNS45NiAxOC45MTk3SDI0LjY4VjIzLjM5OTdIMjUuOTZWMTguOTE5N1pNNi4xMiAxMC41OTk3QzYuMTIgMTEuOTk4MSA3LjE5OTA0IDEzLjEwODUgOC42MDc2OCAxMy4xNTg0QzEwLjAyMDggMTMuMjA3NyAxMS4yNCAxMi4wNDggMTEuMjQgMTAuNTk5N0MxMS4yNCA5LjI0NjA5IDEwLjA2NDMgOC4wODU3NyA4Ljc1MjMyIDguMDQwOTdDNy4yOTU2OCA3Ljk5MTY5IDYuMTIgOS4xNTEzNyA2LjEyIDEwLjU5OTdaIiBmaWxsPSIjQkNDNEQwIj48L3BhdGg+Cjwvc3ZnPgo=' as const;
-
-export const REL_DICT = {
-  equal: 'eq', // 等于
-  unequal: 'neq', // 不等于
-  include: 'search', // 包含
-  exclude: '_exclude', // 不包含
-  begin_with: '_begin_with', // 开头是
-  greater: 'gt', // 大于
-  greater_or_equal: 'gte', // 大于等于
-  bigger_or_equal: 'gte', //大于等于
-  less: 'lt', // 小于
-  less_or_equal: 'lte', // 小于等于
-  in: 'in', // 多选值
-  not_in: 'nin', // 不在多选值
-} as const;