@cloudbase/weda-ui 0.2.16 → 0.2.21-alpha.1

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

@@ -1,50 +0,0 @@
-import * as React from 'react';
-import { Tabs as TeaTabs, TabPanel, ConfigProvider } from 'tea-component';
-import classNames from '../../utils/classnames';
-import { useSyncValue } from '../../utils/useSyncValue';
-import { PropsType } from './index';
-
-
-export default function TabsPc({
-  tabs,
-  selectedIndex,
-  events,
-  className,
-  style,
-  ...restProps
-}: PropsType) {
-
-  const [activeIndex, setActiveIndex] = useSyncValue(selectedIndex);
-  const _tabs = Array.isArray(tabs) && tabs.length && tabs.map((item, index) => {
-    return {
-      id: index.toString(),
-      label: item.title
-    };
-  });
-
-  const onActive = (e) => {
-    setActiveIndex(e.id);
-    events && events.change(e);
-  };
-  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}
-          >
-            {restProps[`panel${index + 1}`]}
-          </TabPanel>
-        )
-        )}
-    </TeaTabs>
-  </ConfigProvider>
-  );
-}

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

@@ -1,26 +0,0 @@
-.weda-text {
-  text-overflow: ellipsis;
-  overflow: hidden;
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
-  /* -webkit-line-clamp: 1;
-  white-space: pre-line; */
-}
-.weda-text.level_1 {
-  font-size: 64px !important;
-}
-.weda-text.level_2 {
-  font-size: 56px !important;
-}
-.weda-text.level_3 {
-  font-size: 48px !important;
-}
-.weda-text.level_4 {
-  font-size: 40px !important;
-}
-.weda-text.level_5 {
-  font-size: 32px !important;
-}
-.weda-text.level_6 {
-  font-size: 24px !important;
-}

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

@@ -1,69 +0,0 @@
-import * as React from 'react';
-import classNames from '../../utils/classnames';
-import { 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 = 2,
-  space = false,
-  userSelect = true,
-  textAlign = '',
-  textColor = '',
-  style = {},
-  className,
-  events,
-  id,
-  level = '0',
-  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}`;
-
-  // 添加文本颜色属性
-  let style2 = {};
-  if (textColor !== "") {
-    style2 = {color: textColor};
-  }
-
-  // 添加对齐属性
-  if (textAlign !== "") {
-    style2 = {...style2, textAlign};
-  }
-  return (
-    <p
-      //@ts-expect-error contentEditable type def sucks
-      contentEditable={contenteditable}
-      onInput={onInput}
-      onBlur={onBlur}
-      style={{  ...style, ...textStyle, ...style2 }}
-      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/index.js

@@ -1,4 +0,0 @@
-import * as components from './components';
-import * as actions from './actions';
-
-export default { components, actions };

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.js

@@ -1,7 +0,0 @@
-export const TitleType = {
-  LEFT: 'left',
-  TOP: 'top',
-  NONE: 'none',
-};
-
-export const LOAD_ERR_IMG_BASE64 = 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgdmlld0JveD0iMCAwIDMyIDMyIiBmaWxsPSJub25lIj4KICA8cGF0aCBkPSJNMjUuMzIgMTYuMzU5N0MyNi4wNzY0IDE2LjM1OTcgMjYuODI1NCAxNi41MDg3IDI3LjUyNDMgMTYuNzk4MUMyOC4yMjMxIDE3LjA4NzYgMjguODU4MSAxNy41MTE5IDI5LjM5MjkgMTguMDQ2OEMyOS45Mjc4IDE4LjU4MTYgMzAuMzUyMSAxOS4yMTY2IDMwLjY0MTYgMTkuOTE1NEMzMC45MzEgMjAuNjE0MyAzMS4wOCAyMS4zNjMzIDMxLjA4IDIyLjExOTdDMzEuMDggMjIuODc2MSAzMC45MzEgMjMuNjI1MSAzMC42NDE2IDI0LjMyMzlDMzAuMzUyMSAyNS4wMjI4IDI5LjkyNzggMjUuNjU3OCAyOS4zOTI5IDI2LjE5MjZDMjguODU4MSAyNi43Mjc1IDI4LjIyMzEgMjcuMTUxOCAyNy41MjQzIDI3LjQ0MTJDMjYuODI1NCAyNy43MzA3IDI2LjA3NjQgMjcuODc5NyAyNS4zMiAyNy44Nzk3QzIzLjc5MjQgMjcuODc5NyAyMi4zMjczIDI3LjI3MjggMjEuMjQ3MSAyNi4xOTI2QzIwLjE2NjkgMjUuMTEyNCAxOS41NiAyMy42NDczIDE5LjU2IDIyLjExOTdDMTkuNTYgMjAuNTkyIDIwLjE2NjkgMTkuMTI3IDIxLjI0NzEgMTguMDQ2OEMyMi4zMjczIDE2Ljk2NjUgMjMuNzkyNCAxNi4zNTk3IDI1LjMyIDE2LjM1OTdaTTI4IDMuNTU5NjlWMTQuODc2OEMyNy4xNzc3IDE0LjU4NjYgMjYuMTkyIDE0LjQzODggMjUuMzIgMTQuNDM5N0MyNC4wMzEgMTQuNDM5NyAyMi44MTU3IDE0Ljc1NzEgMjEuNzQ4OCAxNS4zMTg0TDIwLjc5NTIgMTMuMTU5N0wxNi4wMjU5IDIwLjAyNzVMOC40NDU3NiAxNi40NDFMMy41NiAyMy4zOTk3SDE3Ljc0NjJDMTcuOTg2NyAyNC44MjkgMTguNjI4MiAyNi4xNjA2IDE5LjU5NTggMjcuMjM5N0gxVjMuNTU5NjlIMjhaTTI1Ljk2IDI0LjAzOTdIMjQuNjhWMjUuMzE5N0gyNS45NlYyNC4wMzk3Wk0yNS45NiAxOC45MTk3SDI0LjY4VjIzLjM5OTdIMjUuOTZWMTguOTE5N1pNNi4xMiAxMC41OTk3QzYuMTIgMTEuOTk4MSA3LjE5OTA0IDEzLjEwODUgOC42MDc2OCAxMy4xNTg0QzEwLjAyMDggMTMuMjA3NyAxMS4yNCAxMi4wNDggMTEuMjQgMTAuNTk5N0MxMS4yNCA5LjI0NjA5IDEwLjA2NDMgOC4wODU3NyA4Ljc1MjMyIDguMDQwOTdDNy4yOTU2OCA3Ljk5MTY5IDYuMTIgOS4xNTEzNyA2LjEyIDEwLjU5OTdaIiBmaWxsPSIjQkNDNEQwIj48L3BhdGg+Cjwvc3ZnPgo=';

package/src/web/utils/debounce.js

@@ -1,98 +0,0 @@
-function isObject(value) {
-  const type = typeof value;
-  return value != null && (type === 'object' || type === 'function');
-}
-function debounce(func, wait, options) {
-  let lastArgs, lastThis, maxWait, result, timerId, lastCallTime;
-  let lastInvokeTime = 0;
-  let leading = false;
-  let maxing = false;
-  let trailing = true;
-  if (typeof func !== 'function') {
-    throw new TypeError('Expected a function');
-  }
-  wait = +wait || 0;
-  if (isObject(options)) {
-    leading = !!options.leading;
-    maxing = 'maxWait' in options;
-    maxWait = maxing ? Math.max(+options.maxWait || 0, wait) : maxWait;
-    trailing = 'trailing' in options ? !!options.trailing : trailing;
-  }
-  function invokeFunc(time) {
-    const args = lastArgs;
-    const thisArg = lastThis;
-
-    lastArgs = lastThis = undefined;
-    lastInvokeTime = time;
-    result = func.apply(thisArg, args);
-    return result;
-  }
-  function startTimer(pendingFunc, wait) {
-    return setTimeout(pendingFunc, wait);
-  }
-  function leadingEdge(time) {
-    lastInvokeTime = time;
-    timerId = startTimer(timerExpired, wait);
-    return leading ? invokeFunc(time) : result;
-  }
-  function remainingWait(time) {
-    const timeSinceLastCall = time - lastCallTime;
-    const timeSinceLastInvoke = time - lastInvokeTime;
-    const timeWaiting = wait - timeSinceLastCall;
-
-    return maxing
-      ? Math.min(timeWaiting, maxWait - timeSinceLastInvoke)
-      : timeWaiting;
-  }
-  function shouldInvoke(time) {
-    const timeSinceLastCall = time - lastCallTime;
-    const timeSinceLastInvoke = time - lastInvokeTime;
-    return (
-      lastCallTime === undefined ||
-      timeSinceLastCall >= wait ||
-      timeSinceLastCall < 0 ||
-      (maxing && timeSinceLastInvoke >= maxWait)
-    );
-  }
-  function timerExpired() {
-    const time = Date.now();
-    if (shouldInvoke(time)) {
-      return trailingEdge(time);
-    }
-    timerId = startTimer(timerExpired, remainingWait(time));
-  }
-  function trailingEdge(time) {
-    timerId = undefined;
-    if (trailing && lastArgs) {
-      return invokeFunc(time);
-    }
-    lastArgs = lastThis = undefined;
-    return result;
-  }
-
-  //debouncedFunc
-  function debounced(...args) {
-    const time = Date.now();
-    const isInvoking = shouldInvoke(time);
-
-    lastArgs = args;
-    lastThis = this;
-    lastCallTime = time;
-
-    if (isInvoking) {
-      if (timerId === undefined) {
-        return leadingEdge(lastCallTime);
-      }
-      if (maxing) {
-        timerId = startTimer(timerExpired, wait);
-        return invokeFunc(lastCallTime);
-      }
-    }
-    if (timerId === undefined) {
-      timerId = startTimer(timerExpired, wait);
-    }
-    return result;
-  }
-  return debounced;
-}
-export default debounce;

package/src/web/utils/events.js

@@ -1,2 +0,0 @@
-// eslint-disable-next-line no-unused-vars
-export const events = (evs) => {};

package/src/web/utils/getLocalCounter.js

@@ -1,5 +0,0 @@
-let localCounter = 1;
-
-export default function getLocalCounter() {
-  return localCounter++;
-}

package/src/web/utils/isObjectEqual.js

@@ -1,14 +0,0 @@
-import isEqual from 'lodash.isequal';
-
-export function serde(a) {
-  return JSON.parse(JSON.stringify(a));
-}
-
-const isObj = (a) => typeof a === 'object' && a !== null;
-
-export default function (a, b, shouldSerde = false) {
-  if(shouldSerde && isObj(a) && isObj(b)) { // for Proxy created by mbox
-    return isEqual(serde(a), serde(b));
-  }
-  return isEqual(a, b);
-}

package/src/web/utils/loading-fallback.tsx

@@ -1,2 +0,0 @@
-import * as React from "react";
-export const fallback =  <div>组件加载中...</div>;

package/src/web/utils/platform.js

@@ -1,134 +0,0 @@
-// 平台类方法，如 BOM、DOM、区分 h5 和 pc 端
-import { useMediaQuery } from '@react-hookz/web';
-/**
- * 当前环境是否为 H5 端
- */
-export const isH5Platform = () => {
-  if (window.matchMedia) {
-    return window.matchMedia('(max-width: 1024px)')?.matches;
-  } else {
-    let is = false;
-    try {
-      const ua = navigator && navigator.userAgent;
-      is = /Android|webOS|BlackBerry|iPhone|iPad|iPod|iOS/i.test(ua);
-    } catch (e) {
-      null;
-    }
-    return is;
-  }
-};
-
-/**
- * 判断当前是否是 cloud 开头的文件协议
- */
-export const isCloudFileID = (url) => {
-  return /^cloud:\/\/.*/.test(url);
-};
-
-/**
- * 判断当前是否是 http/https 开头的文件协议
- */
-export const isHttpFileID = (url) => {
-  return /^http(s?):\/\/.*/.test(url);
-};
-
-export function usePlatform() {
-  const smallScreen = useMediaQuery('(max-width: 1024px)') ?? isH5Platform();
-  const touchDevice = useMediaQuery('(pointer:coarse)') ?? smallScreen;
-  return touchDevice || smallScreen ? 'h5' : 'pc';
-}
-
-/**
- * 在h5下，判断当前是否是移动浏览器
- */
-export function inH5IsMobile() {
-  try {
-    // 区分h5是在编辑器还是移动浏览器
-    let is_mobile_ua = false;
-    const ua = navigator && navigator.userAgent;
-    is_mobile_ua = /Android|webOS|BlackBerry|iPhone|iPad|iPod|iOS/i.test(ua);
-    return is_mobile_ua;
-  } catch (e) {
-    console.log('isMobile err', e);
-  }
-}
-
-/**
- * 过滤非字符串，返回字符串数组
- * 用于兼容单个组件和组件数组
- */
-export const filterStrList = (value) => {
-  return [].concat(value).filter((d) => typeof d === 'string' && d !== '');
-};
-
-/**
- * 文件字节转换
- */
-export const transSize = (size) => {
-  const b = parseInt(size) || 0;
-  const getBig = (d) => Math.ceil(d / 1024) || 0;
-  if (b < 1024) {
-    return `${size}B`;
-  }
-  const k = getBig(size);
-  if (k < 1024) {
-    return `${k}K`;
-  }
-  const m = getBig(k);
-  if (m < 1024) {
-    return `${m}M`;
-  }
-  const g = getBig(m);
-  return `${g}G`;
-};
-
-/**
- * 链接转换为下载
- */
-export const downloadFile = (url) => {
-  if (!url) {
-    return;
-  }
-  const urlObj = new URL(url);
-  urlObj.searchParams.append('response-content-disposition', 'attawchment');
-  const urls = urlObj.toString();
-  window.open(urls);
-  setTimeout(() => {
-    window.URL.revokeObjectURL(urls);
-  }, 0);
-};
-
-/**
- * 文件名截取，保留后缀类型
- */
-export const cutFileTitle = (str = '', count = 10) => {
-  let [title, type] = [str, ''];
-  const dotIndex = `${str}`.lastIndexOf('.');
-  if (dotIndex > -1) {
-    type = str.slice(dotIndex + 1);
-    title = str.slice(0, dotIndex);
-  }
-  if (title.length > count) {
-    title = `${title.slice(0, 7)}...${title.slice(-3)}`;
-  }
-  if (type) {
-    title = `${title}.${type}`;
-  }
-  return title;
-};
-
-/**
- * 判断是否在 ide 中
- */
-export const isInIde = () => !!window?.app?.cloud?.IS_WEDA_IDE;
-
-/**
- * cloudid和文件名转换
- */
-export const transFileCloudidToName = (fileID) => {
-  const uuidReg = /(file-)?[0-9a-f]{8}(-[0-9a-f]{4}){3}-[0-9a-f]{12}-/;
-  const lastIndex = `${fileID}`.lastIndexOf('/');
-  const name = `${fileID}`.slice(lastIndex + 1);
-  const title = name.replace(uuidReg, '');
-  return title;
-};