@cloudbase/weda-ui 2.0.12 → 2.0.26

package/src/web/utils/platform.js

@@ -141,3 +141,16 @@ const reg =
   /(((^https?:(?:\/\/)?)(?:[-;:&=\+\$,\w]+@)?[A-Za-z0-9.-]+(?::\d+)?|(?:www.|[-;:&=\+\$,\w]+@)[A-Za-z0-9.-]+)((?:\/[\+~%\/.\w-_]*)?\??(?:[-\+=&;%@.\w_]*)#?(?:[\w]*))?)$/;
 
 export const isUrl = (path) => reg.test(path);
+
+/**
+ * 生成随机数
+ */
+export const randomUuid = () => {
+  var s = [];
+  var hexDigits = '0123456789abcdef';
+  for (var i = 0; i < 32; i++) {
+    s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
+  }
+  var uuid = s.join('');
+  return uuid;
+};

package/src/web/weda-ui.css

@@ -40,19 +40,13 @@ body .weda-ui {
   background-color: var(--weui-TAG-TEXT-BLUE);
 }
 
-.weda-ui .wedatea2td-form__controls {
-  font-size: 1rem;
-}
-
 @media (min-width: 1024px) {
   .weda-ui .weui-cells {
     /* prettier-ignore */
-    font-size: 14PX;
+    font-size: 1em;
   }
 }
 @media (min-width: 1024px) {
-  .weda-ui .weui-cell {
-  }
   .weui .weui-cell_active:active {
     background-color: unset !important;
   }
@@ -67,14 +61,18 @@ body .weda-ui {
 }
 
 .weda-ui .weui-cell {
-  font-size: 16px; /* 修改默认weui的17为16 */
+  font-size: inherit; /* 要让内联样式生效 */
+}
+
+.weda-ui .weui-cells {
+  font-size: 1em;
 }
 
 .weui-picker a:link:hover {
   text-decoration: none;
 }
 
-.wedatea2td-form.wedatea2td-form--vertical .wedatea2td-form__label label {
+.weda-formcells__pc.vertical .wedatea2td-form__label label {
   width: auto; /* vertcal 情况下label不固定宽度 */
 }
 

package/src/docs/common/format.tsx

@@ -1,115 +0,0 @@
-export interface ICompsConfig {
-  type: String;
-  name: string;
-  title: string;
-  description: string;
-  'x-platforms': string[];
-  default: string;
-  platforms: string;
-  'x-index': number;
-}
-export type TCompsConfig = ICompsConfig;
-
-export const sortBy = (props) => {
-  return function (a, b) {
-    return a[props] - b[props];
-  };
-};
-
-export const objFormat = (args: any, type, origin) => {
-  //判断属性title值是否为拓展写法
-  const uuidReg = /(?<=text)\('(.*)(?=',)/;
-  let transformData: any = [];
-  for (let i in args) {
-    if (type && type == 'event') {
-      transformData.push({
-        name: origin == 'lowCode' ? args[i]?.name : args[i]?.title,
-        title: origin == 'lowCode' ? args[i]?.eventName : args[i]?.name,
-        description: args[i]?.remarks || '-',
-        platforms: args[i]['x-platforms']
-          ? args[i]['x-platforms'].indexOf('MP') > -1
-            ? '小程序端'
-            : args[i]['x-platforms'].indexOf('WEB') > -1
-            ? 'web端'
-            : '兼容三端'
-          : '兼容三端',
-      });
-    } else if (type && type == 'attribute' && args[i].type != 'slot') {
-      if (
-        args[i]?.display == false ||
-        args[i]?.isReactNode == true ||
-        args[i]['x-component'] == 'sub-category-title' ||
-        args[i]['x-component'] == 'Divider'
-      ) {
-        continue;
-      }
-      transformData.push({
-        code: i,
-        title:
-          args[i].title.indexOf('{{') != -1
-            ? args[i]?.title.match(uuidReg)[1]
-            : args[i]?.title,
-        description: args[i]?.remarks || '-',
-        type: args[i]?.type || '-',
-        default: JSON.stringify(args[i]?.default) || '-',
-        'x-index': args[i]['x-index'] ? args[i]['x-index'] : 999999,
-        'x-category': args[i]['x-category']
-          ? args[i]['x-category']
-          : '基础属性',
-      });
-    } else if (type && type == 'slot' && args[i].type == 'slot') {
-      transformData.push({
-        code: i,
-        title: args[i]?.title,
-        description: args[i]?.description || '-',
-      });
-    }
-  }
-
-  if (type && type == 'attribute') transformData.sort(sortBy('x-index'));
-
-  if (type && type == 'attribute') {
-    transformData = groupByType(transformData, 'x-category');
-  }
-  return transformData;
-};
-function groupByType(arr, param) {
-  var map = {};
-  var dest = [];
-  var structureMap = [];
-  var storgeType = [];
-  for (var i = 0; i < arr.length; i++) {
-    var ai = arr[i];
-    if (ai[param] && !map[ai[param]]) {
-      dest.push({
-        name: ai[param],
-        data: [ai],
-      });
-      map[ai[param]] = ai;
-    } else if (!ai[param]) {
-      dest.push({
-        name: '基础属性',
-        data: [ai],
-      });
-      map[ai[param]] = ai;
-    } else {
-      for (var j = 0; j < dest.length; j++) {
-        var dj = dest[j];
-        if (dj.name == ai[param]) {
-          dj.data.push(ai);
-          break;
-        }
-      }
-    }
-  }
-  for (var k = 0; k < dest.length; k++) {
-    if (k == 0 && dest[k]?.name != '基础属性') {
-      storgeType = storgeType.concat(dest[k]?.data);
-      continue;
-    }
-    structureMap = structureMap.concat(dest[k]?.data);
-  }
-
-  storgeType.length != 0 ? structureMap.push(...storgeType) : null;
-  return structureMap;
-}

package/src/docs/common/tableView.css

@@ -1,164 +0,0 @@
-.tableview {
-  width: 700px;
-  table-layout: fixed;
-}
-.tr-width-1 {
-  width: 100px;
-}
-.tr-width-2 {
-  width: 200px;
-}
-.tr-width-3 {
-  width: 300px;
-}
-.tr-width-4 {
-  width: 400px;
-}
-.tr-width-6 {
-  width: 600px;
-}
-.tr-width-7 {
-  width: 700px;
-}
-.custom-table--body-wrapper.is-fixed {
-  overflow-y: hidden;
-}
-
-.custom-table--fixed-wrapper {
-  box-shadow: 4px 0px 4px rgba(0, 0, 0, 0.1);
-
-  left: 0;
-  top: 0;
-  bottom: 0;
-  width: 800px;
-  background-color: #fff;
-}
-
-.custom-table td,
-.custom-table th {
-  white-space: nowrap;
-  overflow: hidden;
-  height: 42px;
-  padding: 2px !important;
-}
-.custom-table .table {
-  table-layout: fixed;
-  margin-bottom: 0;
-}
-/** 底部边框 */
-.custom-table::after {
-  content: '';
-  display: block;
-  height: 0px;
-  position: relative;
-  top: -1px;
-  border-bottom: 1px solid #ddd;
-}
-/** 右侧边框 */
-.custom-table::before {
-  content: '';
-  display: block;
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  right: 0;
-  border-right: 1px solid #ddd;
-}
-.custom-table th.gutter {
-  width: 15px;
-  padding: 0;
-}
-.tea-table__header {
-  overflow: hidden;
-  margin-bottom: -18px;
-}
-.tea-table__box {
-  border-collapse: collapse;
-  table-layout: fixed;
-  width: 100%;
-  position: relative;
-  border-spacing: 0px;
-}
-.tea-text-overflow,
-.tea-text-truncate {
-  display: flex;
-  vertical-align: middle;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  max-width: 100%;
-  overflow: hidden;
-}
-.tea-table__header thead {
-  background-color: transparent;
-  border-width: 0px;
-  border-style: initial;
-  border-color: initial;
-  border-image: initial;
-}
-colgroup {
-  display: table-column-group;
-}
-.tea-table__box tr {
-  outline: none 0px;
-  transition: background-color 0.1s linear 0s;
-}
-.tea-table__box th {
-  position: relative;
-  padding: 10px;
-  border-bottom: 1px solid rgb(231, 234, 239);
-}
-.tea-table__box th > div {
-  position: relative;
-  color: rgb(0 0 0 / 77%);
-  padding: 0px;
-  display: inline-block;
-  vertical-align: middle;
-  font-size: 16px;
-  width: 100%;
-  overflow-wrap: break-word;
-  word-break: break-word;
-}
-.tea-table__box tr > td {
-  color: rgb(0 0 0);
-  padding: 10px;
-  vertical-align: middle;
-  font-size: 16px;
-  vertical-align: top;
-}
-.tea-table__box tr > td > code {
-  color: #c7254e;
-  font-size: 85%;
-  border: none;
-}
-.tea-text-overflow,
-.tea-text-truncate {
-  display: flex;
-  vertical-align: middle;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  max-width: 100%;
-  overflow: hidden;
-}
-table {
-  display: table;
-  border-collapse: separate;
-  box-sizing: border-box;
-  text-indent: initial;
-  border-spacing: 2px;
-  border-color: grey;
-}
-.tea-table__body {
-  border-bottom: 1px solid rgb(207, 213, 222);
-  overflow: auto;
-}
-colgroup {
-  display: table-column-group;
-}
-col {
-  display: table-column;
-}
-.hash-link {
-  opacity: 0;
-  padding-left: 0.5rem;
-  transition: opacity var(--ifm-transition-fast);
-}

package/src/docs/common/tableView.tsx

@@ -1,283 +0,0 @@
-import React, { useRef, useContext } from 'react';
-import { components } from '../../configs/index';
-import { objFormat, ICompsConfig } from './format';
-import './tableView.css';
-export interface ComponentDocument {
-  exampleMap?: {
-    [key: string]: {
-      component: React.ComponentType;
-      code: string;
-    };
-  };
-  codeMap?: {
-    [key: string]: {
-      code: string;
-    };
-  };
-  data?: {
-    [key: string]: {
-      code: string;
-    };
-  };
-}
-function createFragment(nodes: React.ReactNodeArray) {
-  return React.createElement(React.Fragment, {}, ...nodes);
-}
-export interface TableLayoutViewProps {
-  componentKey?: string;
-  document: ComponentDocument;
-  variables?: object;
-}
-
-function getCompsMeta(key, type, origin) {
-  var compsMeta: ICompsConfig;
-  try {
-    switch (origin) {
-      case 'lowCode':
-        var metaLowcode = require('/docs/lowcode/components/wedaUI/lowcode-comps/weda_standard/comps/' +
-          key +
-          '.comp.json');
-        if (type && type == 'event') {
-          compsMeta = metaLowcode['emitEvents'];
-        } else if (type && (type == 'attribute' || type == 'slot')) {
-          compsMeta = metaLowcode['dataForm'];
-        } else if (type && type == 'description') {
-          compsMeta = metaLowcode['meta'];
-        }
-
-        return compsMeta;
-      case 'sourceCode':
-        if (type && type == 'event') {
-          compsMeta = components[key]['events'] || {};
-        } else if (type && (type == 'attribute' || type == 'slot')) {
-          compsMeta = components[key]['data']['properties'] || {};
-        } else if (type && type == 'description') {
-          compsMeta = components[key]['meta'] || {};
-        }
-        return compsMeta;
-    }
-  } catch (e) {
-    return null;
-  }
-}
-export default function TableLayoutView({ componentKey, type, origin }) {
-  var compsMeta = getCompsMeta(componentKey, type, origin);
-  var tableView = [];
-  if (compsMeta && type != 'description') {
-    tableView = objFormat(compsMeta, type, origin);
-  } else {
-    tableView.push(compsMeta);
-  }
-
-  return (
-    <>
-      {type == 'attribute' && tableView.length > 0 && (
-        <>
-          <div className="tea-table__header">
-            <table className="tea-table__box">
-              <colgroup>
-                <col style={{ width: '18%' }}></col>
-                <col style={{ width: '10%' }}></col>
-                <col style={{ width: '15%' }}></col>
-                <col style={{ width: '25%' }}></col>
-                <col style={{ width: 'auto' }}></col>
-              </colgroup>
-              <thead>
-                <tr>
-                  <th className="">
-                    <div>
-                      <span className="tea-text-overflow" title="属性名">
-                        属性名
-                      </span>
-                    </div>
-                  </th>
-                  <th className="">
-                    <div>
-                      <span className="tea-text-overflow" title="类型">
-                        类型
-                      </span>
-                    </div>
-                  </th>
-                  <th className="">
-                    <div>
-                      <span className="tea-text-overflow" title="属性分组">
-                        属性分组
-                      </span>
-                    </div>
-                  </th>
-                  <th className="">
-                    <div>
-                      <span className="tea-text-overflow" title="默认值">
-                        默认值
-                      </span>
-                    </div>
-                  </th>
-                  <th className="">
-                    <div>
-                      <span className="tea-text-overflow" title="说明">
-                        说明
-                      </span>
-                    </div>
-                  </th>
-                </tr>
-              </thead>
-            </table>
-          </div>
-          <table className="tea-table__box">
-            <colgroup>
-              <col style={{ width: '18%' }}></col>
-              <col style={{ width: '10%' }}></col>
-              <col style={{ width: '15%' }}></col>
-              <col style={{ width: '25%' }}></col>
-              <col style={{ width: 'auto' }}></col>
-            </colgroup>
-            <tbody>
-              {tableView.map((row, index) => (
-                <tr key={index}>
-                  <td>{row.title}</td>
-                  <td>
-                    <code>{row.type}</code>
-                  </td>
-                  <td>{row['x-category']}</td>
-                  <td>{row.default}</td>
-                  <td>{row.description}</td>
-                </tr>
-              ))}
-            </tbody>
-          </table>
-        </>
-      )}
-      {type == 'slot' && tableView.length > 0 && (
-        <>
-          <div className="tea-table__header">
-            <table className="tea-table__box">
-              <colgroup>
-                <col style={{ width: '18%' }}></col>
-                <col style={{ width: 'auto' }}></col>
-              </colgroup>
-              <thead>
-                <tr>
-                  <th className="">
-                    <div>
-                      <span className="tea-text-overflow" title="属性名">
-                        名称
-                      </span>
-                    </div>
-                  </th>
-                  <th className="">
-                    <div>
-                      <span className="tea-text-overflow" title="类型">
-                        说明
-                      </span>
-                    </div>
-                  </th>
-                </tr>
-              </thead>
-            </table>
-          </div>
-          <table className="tea-table__box">
-            <colgroup>
-              <col style={{ width: '18%' }}></col>
-              <col style={{ width: 'auto' }}></col>
-            </colgroup>
-            <tbody>
-              {tableView.map((row, index) => (
-                <tr key={index}>
-                  <td>{row.code}</td>
-                  <td>{row.description}</td>
-                </tr>
-              ))}
-            </tbody>
-          </table>
-        </>
-      )}
-      {type == 'event' && tableView.length > 0 && (
-        <>
-          <div className="tea-table__header">
-            <table className="tea-table__box">
-              <colgroup>
-                <col style={{ width: '18%' }}></col>
-                <col style={{ width: '25%' }}></col>
-                <col style={{ width: '16%' }}></col>
-                <col style={{ width: 'auto' }}></col>
-              </colgroup>
-              <thead>
-                <tr>
-                  <th className="">
-                    <div>
-                      <span className="tea-text-overflow" title="事件名">
-                        事件名
-                      </span>
-                    </div>
-                  </th>
-                  <th className="">
-                    <div>
-                      <span className="tea-text-overflow" title="事件code">
-                        事件code
-                      </span>
-                    </div>
-                  </th>
-                  <th className="">
-                    <div>
-                      <span className="tea-text-overflow" title="适用情况">
-                        适用情况
-                      </span>
-                    </div>
-                  </th>
-                  <th className="">
-                    <div>
-                      <span className="tea-text-overflow" title="说明">
-                        说明
-                      </span>
-                    </div>
-                  </th>
-                </tr>
-              </thead>
-            </table>
-          </div>
-          <table className="tea-table__box">
-            <colgroup>
-              <col style={{ width: '18%' }}></col>
-              <col style={{ width: '25%' }}></col>
-              <col style={{ width: '16%' }}></col>
-              <col style={{ width: 'auto' }}></col>
-            </colgroup>
-            <tbody>
-              {tableView.map((row, index) => (
-                <tr key={index}>
-                  <td>{row.name}</td>
-                  <td>
-                    <code>{row.title}</code>
-                  </td>
-                  <td>{row.platforms}</td>
-                  <td>{row.description}</td>
-                </tr>
-              ))}
-            </tbody>
-          </table>
-        </>
-      )}
-      {type == 'description' && tableView.length > 0 && (
-        <>
-          <h2>
-            <a
-              aria-hidden="true"
-              className="anchor enhancedAnchor_node_modules-@docusaurus-theme-classic-lib-next-theme-Heading-styles-module"
-              id="适用场景"
-            ></a>
-            适用场景
-            <a className="hash-link" href="#适用场景" title="标题的直接链接">
-              #
-            </a>
-          </h2>
-          <p>
-            {tableView[0]?.description
-              ? tableView[0]?.description
-              : tableView[0]?.desc}
-          </p>
-        </>
-      )}
-      {tableView.length == 0 && <p>无</p>}
-    </>
-  );
-}