amis 1.4.0 → 1.4.2-beta.12

package/src/components/index.tsx

@@ -10,7 +10,7 @@ import {default as ContextMenu, openContextMenus} from './ContextMenu';
 import AsideNav from './AsideNav';
 import Button from './Button';
 import Checkbox from './Checkbox';
-import Checkboxes from './Checkboxes';
+import Checkboxes from './Selection';
 import Collapse from './Collapse';
 import DatePicker from './DatePicker';
 import DateRangePicker from './DateRangePicker';
@@ -41,19 +41,19 @@ import Tree from './Tree';
 import Alert2 from './Alert2';
 import Transfer from './Transfer';
 import TabsTransfer from './TabsTransfer';
-import ListCheckboxes from './ListCheckboxes';
-import TableCheckboxes from './TableCheckboxes';
-import TreeCheckboxes from './TreeCheckboxes';
-import ChainedCheckboxes from './ChainedCheckboxes';
 import ResultBox from './ResultBox';
 import InputBox from './InputBox';
-import ListRadios from './ListRadios';
-import TreeRadios from './TreeRadios';
 import ListGroup from './ListGroup';
 import NumberInput from './NumberInput';
 import ArrayInput from './ArrayInput';
 import SearchBox from './SearchBox';
 import AnchorNav from './AnchorNav';
+import Selection from './Selection';
+import GroupedSelection from './GroupedSelection';
+import ChainedSelection from './ChainedSelection';
+import TableSelection from './TableSelection';
+import TreeSelection from './TreeSelection';
+import AssociatedSelection from './AssociatedSelection';
 
 export {
   NotFound,
@@ -99,15 +99,15 @@ export {
   Tree,
   Transfer,
   TabsTransfer,
-  ListCheckboxes,
-  TableCheckboxes,
-  TreeCheckboxes,
-  ChainedCheckboxes,
+  Selection,
+  GroupedSelection,
+  ChainedSelection,
+  TableSelection,
+  TreeSelection,
+  AssociatedSelection,
   ResultBox,
   InputBox,
-  ListRadios,
   SearchBox,
-  TreeRadios,
   ListGroup,
   NumberInput,
   ArrayInput,

package/src/envOverwrite.ts

@@ -4,7 +4,6 @@
 
 import {SchemaNode, Schema} from './types';
 import {RendererProps, RendererConfig, addSchemaFilter} from './factory';
-
 const isMobile = (window as any).matchMedia?.('(max-width: 768px)').matches
   ? true
   : false;

package/src/factory.tsx

@@ -4,7 +4,16 @@ import {getEnv, destroy} from 'mobx-state-tree';
 import {wrapFetcher} from './utils/api';
 import {normalizeLink} from './utils/normalizeLink';
 import {findIndex, promisify, qsparse, string2regExp} from './utils/helper';
-import {Api, fetcherResult, Payload, SchemaNode, Schema, Action} from './types';
+import {
+  Api,
+  fetcherResult,
+  Payload,
+  SchemaNode,
+  Schema,
+  Action,
+  EventTrack,
+  PlainObject
+} from './types';
 import {observer} from 'mobx-react';
 import Scoped from './Scoped';
 import {getTheme, ThemeInstance, ThemeProps} from './theme';
@@ -58,6 +67,10 @@ export interface RendererProps extends ThemeProps, LocaleProps {
   };
   defaultData?: object;
   className?: any;
+  /**
+   * 是否使用移动端交互
+   */
+  useMobileUI?: boolean;
   [propName: string]: any;
 }
 
@@ -320,6 +333,8 @@ const defaultOptions: RenderOptions = {
   copy(contents: string) {
     console.error('copy contents', contents);
   },
+  // 用于跟踪用户在界面中的各种操作
+  tracker(eventTrack: EventTrack, props: PlainObject) {},
   rendererResolver: resolveRenderer
 };
 let stores: {
@@ -345,7 +360,7 @@ export function render(
       ...defaultOptions,
       ...options,
       fetcher: options.fetcher
-        ? wrapFetcher(options.fetcher)
+        ? wrapFetcher(options.fetcher, options.tracker)
         : defaultOptions.fetcher,
       confirm: promisify(
         options.confirm || defaultOptions.confirm || window.confirm
@@ -416,7 +431,7 @@ export function updateEnv(options: Partial<RenderOptions>, session = 'global') {
   };
 
   if (options.fetcher) {
-    options.fetcher = wrapFetcher(options.fetcher) as any;
+    options.fetcher = wrapFetcher(options.fetcher, options.tracker) as any;
   }
 
   if (options.confirm) {

package/src/hooks/index.ts

@@ -0,0 +1,5 @@
+/**
+ * @file 常用 hooks
+ */
+export {default as useSetState} from './use-set-state';
+export {default as useUpdateEffect} from './use-update-effect';

package/src/hooks/use-set-state.ts

@@ -0,0 +1,19 @@
+import {useCallback, useState} from 'react';
+import isFunction from 'lodash/isFunction';
+
+const useSetState = <T extends object>(
+  initialState: T = {} as T
+): [T, (patch: Partial<T> | ((prevState: T) => Partial<T>)) => void] => {
+  const [state, setState] = useState<T>(initialState);
+
+  const setMergeState = useCallback(patch => {
+    setState(prevState => ({
+      ...prevState,
+      ...(isFunction(patch) ? patch(prevState) : patch)
+    }));
+  }, []);
+
+  return [state, setMergeState];
+};
+
+export default useSetState;

package/src/hooks/use-touch.ts

@@ -0,0 +1,100 @@
+import {useCallback, useRef} from 'react';
+
+const MIN_DISTANCE = 10;
+
+type Direction = '' | 'vertical' | 'horizontal';
+
+function getDirection(x: number, y: number) {
+  if (x > y && x > MIN_DISTANCE) {
+    return 'horizontal';
+  }
+  if (y > x && y > MIN_DISTANCE) {
+    return 'vertical';
+  }
+  return '';
+}
+
+const INITIAL_STATE = {
+  startX: 0,
+  startY: 0,
+  deltaX: 0,
+  deltaY: 0,
+  offsetX: 0,
+  offsetY: 0,
+  direction: '' as Direction
+};
+
+type StateType = Partial<typeof INITIAL_STATE>;
+type StateFunctionType = (value: StateType) => typeof INITIAL_STATE;
+
+const useTouch = () => {
+  const refState = useRef(INITIAL_STATE);
+  const innerState = refState.current;
+
+  const update = (value: StateType | StateFunctionType) => {
+    if (typeof value === 'function') {
+      value = value(refState.current);
+    }
+    Object.entries(value).forEach(([k, v]) => {
+      //@ts-ignore
+      refState.current[k] = v;
+    });
+  };
+
+  const isVertical = useCallback(
+    () => innerState.direction === 'vertical',
+    [innerState.direction]
+  );
+  const isHorizontal = useCallback(
+    () => innerState.direction === 'horizontal',
+    [innerState.direction]
+  );
+
+  const reset = () => {
+    update({
+      deltaX: 0,
+      deltaY: 0,
+      offsetX: 0,
+      offsetY: 0,
+      direction: ''
+    });
+  };
+
+  const start = ((event: TouchEvent) => {
+    reset();
+    update({
+      startX: event.touches[0].clientX,
+      startY: event.touches[0].clientY
+    });
+  }) as EventListener;
+
+  const move = ((event: TouchEvent) => {
+    const touch = event.touches[0];
+
+    update(value => {
+      // Fix: Safari back will set clientX to negative number
+      const newState = {...value} as typeof innerState;
+
+      newState.deltaX = touch.clientX < 0 ? 0 : touch.clientX - newState.startX;
+      newState.deltaY = touch.clientY - newState.startY;
+      newState.offsetX = Math.abs(newState.deltaX);
+      newState.offsetY = Math.abs(newState.deltaY);
+
+      if (!newState.direction) {
+        newState.direction = getDirection(newState.offsetX, newState.offsetY);
+      }
+      return newState;
+    });
+  }) as EventListener;
+
+  return {
+    ...innerState,
+    move,
+    start,
+    reset,
+    isVertical,
+    isHorizontal
+  };
+};
+
+export default useTouch;

package/src/hooks/use-update-effect.ts

@@ -0,0 +1,16 @@
+import {useEffect, useRef} from 'react';
+
+const useUpdateEffect: typeof useEffect = (effect, deps) => {
+  const isMounted = useRef(false);
+
+  useEffect(() => {
+    if (!isMounted.current) {
+      isMounted.current = true;
+    } else {
+      return effect();
+    }
+    return undefined;
+  }, deps);
+};
+
+export default useUpdateEffect;

package/src/icons/clock.svg

@@ -0,0 +1 @@
+<svg width="24px" height="24px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><title>ic_时间</title><g id="ic_时间" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><circle id="1-FL" stroke="#000" cx="8" cy="8" r="6.5" stroke-width="1px" fill="none" stroke-linecap="butt" stroke-linejoin="round"/><polyline id="2-FLW" stroke="#000" points="7.87443646 5.5 7.87443646 8.53778873 5.5 9.28133409" stroke-width="1px" fill="none" stroke-linecap="butt" stroke-linejoin="round"/></g></svg>

package/src/icons/loading-outline.svg

@@ -0,0 +1,4 @@
+<svg viewBox="0 0 1024 1024" focusable="false" data-icon="loading" width="1em" height="1em" fill="currentColor" aria-hidden="true">
+    <path d="M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 00-94.3-139.9 437.71 437.71 0 00-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z">
+    </path>
+</svg>

package/src/icons/status-close.svg

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>关闭</title>
+    <g id="关闭" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="图标-关闭">
+            <rect id="矩形" stroke="#979797" fill="#D8D8D8" opacity="0" x="0.5" y="0.5" width="15" height="15"></rect>
+            <path d="M12.549,2.65 L13.256,3.357 L8.659,7.952 L13.2563,12.549 L12.5493,13.257 L7.953,8.659 L3.357,13.257 L2.65,12.549 L7.246,7.952 L2.6503,3.357 L3.3573,2.65 L7.953,7.245 L12.549,2.65 Z" id="图标-填色" fill="#080E1A" opacity="0.5"></path>
+        </g>
+    </g>
+</svg>

package/src/icons/status-fail.svg

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>状态-失败</title>
+    <g id="状态-失败" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="图示-图标">
+            <rect id="矩形" stroke="#979797" stroke-width="1.33333333" fill="#D8D8D8" opacity="0" x="0.666666667" y="0.666666667" width="14.6666667" height="14.6666667"></rect>
+            <path d="M10.4361,11.0054 L7.9531,8.5394 L5.4861,11.0224 L4.7771,10.3184 L7.2431,7.8344 L4.7601,5.3674 L5.4651,4.6584 L7.9481,7.1244 L10.4151,4.6424 L11.1241,5.3464 L8.6571,7.8294 L11.1411,10.2964 L10.4361,11.0054 Z M1.00001937,8.0244 C1.0131,11.8894 4.1581,15.0134 8.0231,14.9994934 C11.8901,14.9864 15.0131,11.8424 15.0001806,7.9764 C14.9871,4.1104 11.8421,0.9864 7.9771,1.00030657 C4.1101,1.0134 0.9871,4.1574 1.00001937,8.0244 Z" id="图标-填色" fill="#E8684A"></path>
+        </g>
+    </g>
+</svg>

package/src/icons/status-info.svg

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>6.图标/6.提示/通知/面</title>
+    <g id="6.图标/6.提示/通知/面" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <polygon id="Clip-2" points="1.0001 1 15 1 15 14.9999 1.0001 14.9999"></polygon>
+        <path d="M8.0001,0.9999 C11.8661,0.9999 15.0001,4.1349 15.0001,7.9999 C15.0001,11.8659 11.8661,14.9999 8.0001,14.9999 C4.1341,14.9999 1.0001,11.8659 1.0001,7.9999 C1.0001,4.1349 4.1341,0.9999 8.0001,0.9999 Z M8.5001,6.5459 L7.5001,6.5459 L7.5001,11.9999 L8.5001,11.9999 L8.5001,6.5459 Z M8.0001,3.9999 C7.6681,3.9999 7.4001,4.2679 7.4001,4.5999 C7.4001,4.9309 7.6681,5.1999 8.0001,5.1999 C8.3321,5.1999 8.6001,4.9309 8.6001,4.5999 C8.6001,4.2679 8.3321,3.9999 8.0001,3.9999 Z" id="图标-填色" fill="#2468F2"></path>
+    </g>
+</svg>

package/src/icons/status-success.svg

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>状态-成功</title>
+    <g id="状态-成功" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="图标-提示">
+            <rect id="矩形" stroke="#979797" stroke-width="1.33333333" fill="#D8D8D8" opacity="0" x="0.666666667" y="0.666666667" width="14.6666667" height="14.6666667"></rect>
+            <path d="M7.0286,11.0408 L6.3196,10.3358 L6.3206,10.3348 L4.1896,8.2188 L4.8946,7.5088 L7.0256,9.6258 L11.2526,5.3698 L11.9616,6.0738 L7.0286,11.0408 Z M7.9766,0.999759561 C4.1106,1.0138 0.9866,4.1578 0.999559574,8.0228 C1.0126,11.8898 4.1576,15.0138 8.0236,14.9998469 C11.8896,14.9868 15.0126,11.8428 14.9996404,7.9768 C14.9866,4.1098 11.8426,0.9868 7.9766,0.999759561 L7.9766,0.999759561 Z" id="图标-填色" fill="#0BC280"></path>
+        </g>
+    </g>
+</svg>

package/src/icons/status-warning.svg

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>6.图标/6.提示/异常/面</title>
+    <g id="6.图标/6.提示/异常/面" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <polygon id="Clip-2" points="1.0001 1 15 1 15 14.9997 1.0001 14.9997"></polygon>
+        <path d="M8.0001,0.9997 C11.8661,0.9997 15.0001,4.1347 15.0001,7.9997 C15.0001,11.8657 11.8661,14.9997 8.0001,14.9997 C4.1341,14.9997 1.0001,11.8657 1.0001,7.9997 C1.0001,4.1347 4.1341,0.9997 8.0001,0.9997 Z M8.0001,10.7997 C7.6681,10.7997 7.4001,11.0687 7.4001,11.3997 C7.4001,11.7307 7.6681,11.9997 8.0001,11.9997 C8.3321,11.9997 8.6001,11.7307 8.6001,11.3997 C8.6001,11.0687 8.3321,10.7997 8.0001,10.7997 Z M8.5001,3.9997 L7.5001,3.9997 L7.5001,9.4547 L8.5001,9.4547 L8.5001,3.9997 Z" id="形状结合" fill="#FFB200"></path>
+    </g>
+</svg>

package/src/index.tsx

@@ -111,12 +111,14 @@ import './renderers/Form/InputColor';
 import './renderers/Form/ChainedSelect';
 import './renderers/Form/NestedSelect';
 import './renderers/Form/Transfer';
+import './renderers/Form/TransferPicker';
 import './renderers/Form/InputTable';
 import './renderers/Form/Picker';
 import './renderers/Form/IconPicker';
 import './renderers/Form/Formula';
 import './renderers/Form/FieldSet';
 import './renderers/Form/TabsTransfer';
+import './renderers/Form/TabsTransferPicker';
 import './renderers/Form/Group';
 import './renderers/Form/InputGroup';
 import './renderers/Grid';
@@ -133,6 +135,7 @@ import './renderers/PaginationWrapper';
 import './renderers/Panel';
 import './renderers/Plain';
 import './renderers/Property';
+import './renderers/Portlet';
 import './renderers/Spinner';
 import './renderers/Table/index';
 import './renderers/Tabs';

package/src/locale/de-DE.ts

@@ -172,6 +172,8 @@ register('de-DE', {
   'Table.startSort': 'Klicken, um Sortierung zu starten',
   'Table.valueField': 'valueField muss vorhanden sein',
   'Table.index': 'Index',
+  'Table.toggleColumn': 'Spalten anzeigen',
+  'Table.searchFields': 'Abfragefelder setzen',
   'Tag.placeholder': 'Noch kein Tag',
   'Tag.tip': 'Kürzlich verwendetes Tag',
   'Text.add': 'Neu {{label}}',
@@ -179,6 +181,7 @@ register('de-DE', {
   'Transfer.configError': 'Konfigurationsfehler',
   'Transfer.refreshIcon': 'Zum Aktualisieren klicken',
   'Transfer.searchKeyword': 'Stichwörter eingeben',
+  'Transfer.available': 'Verfügbar',
   'Transfer.selectd': 'Ausgewählt',
   'Transfer.selectFromLeft': 'Von links auswählen',
   'Tree.addChild': 'Untergeordnetes Element hinzufügen',
@@ -220,6 +223,7 @@ register('de-DE', {
   'Wizard.saveAndNext': 'Speichern & Weiter',
   'year-to-year': '{{from}} - {{to}}',
   'Year.placeholder': 'Wählen Sie ein Jahr',
+  'reload': 'Neu laden',
   'rotate': 'Drehen',
   'Editor.fullscreen': 'Schirmfüllend Modus',
   'Editor.exitFullscreen': 'Zurücktreten Schirmfüllend Modus',

package/src/locale/en-US.ts

@@ -173,6 +173,8 @@ register('en-US', {
   'Table.startSort': 'Click to start sorting',
   'Table.valueField': 'Must have valueField',
   'Table.index': 'Index',
+  'Table.toggleColumn': 'Display columns',
+  'Table.searchFields': 'Set query fields',
   'Tag.placeholder': 'No tag yet',
   'Tag.tip': 'Recently used tag',
   'Text.add': 'New {{label}}',
@@ -180,6 +182,7 @@ register('en-US', {
   'Transfer.configError': 'Config error',
   'Transfer.refreshIcon': 'Click to refresh',
   'Transfer.searchKeyword': 'Enter keywords',
+  'Transfer.available': 'Available',
   'Transfer.selectd': 'Selected',
   'Transfer.selectFromLeft': 'Select from the left',
   'Tree.addChild': 'Add child',
@@ -221,6 +224,7 @@ register('en-US', {
   'Wizard.saveAndNext': 'Save & Next',
   'year-to-year': '{{from}} - {{to}}',
   'Year.placeholder': 'Select a Year',
+  'reload': 'Reload',
   'rotate': 'Rotate',
   'Editor.fullscreen': 'full screen',
   'Editor.exitFullscreen': 'exit fullscreen mode',

package/src/locale/zh-CN.ts

@@ -99,7 +99,7 @@ register('zh-CN', {
   'File.start': '开始上传',
   'File.upload': '上传文件',
   'File.uploadFailed': '接口返回错误，请仔细检查',
-  'File.uploading': '文件上传中',
+  'File.uploading': '上传中...',
   'Form.loadOptionsFailed': '加载选项失败，原因：{{reason}}',
   'Form.submit': '提交',
   'Form.title': '表单',
@@ -177,6 +177,8 @@ register('zh-CN', {
   'Table.startSort': '点击开始排序',
   'Table.valueField': '请配置 valueField',
   'Table.index': '序号',
+  'Table.toggleColumn': '显示列',
+  'Table.searchFields': '设置查询字段',
   'Tag.placeholder': '暂无标签',
   'Tag.tip': '最近使用的标签',
   'Text.add': '新增：{{label}}',
@@ -184,8 +186,9 @@ register('zh-CN', {
   'Transfer.configError': '配置错误，选项无法与左侧选项对应',
   'Transfer.refreshIcon': '点击刷新重新加载',
   'Transfer.searchKeyword': '请输入关键字',
-  'Transfer.selectd': '当前选择',
-  'Transfer.selectFromLeft': '请从左侧选择数据',
+  'Transfer.available': '可选项',
+  'Transfer.selectd': '已选项',
+  'Transfer.selectFromLeft': '请选择左侧数据',
   'Tree.addChild': '添加子节点',
   'Tree.addRoot': '添加一级节点',
   'Tree.editNode': '编辑该节点',
@@ -225,6 +228,7 @@ register('zh-CN', {
   'Wizard.saveAndNext': '保存并下一步',
   'year-to-year': '{{from}} 年 - {{to}} 年',
   'Year.placeholder': '请选择年',
+  'reload': '刷新',
   'rotate': '旋转',
   'Editor.fullscreen': '全屏',
   'Editor.exitFullscreen': '退出全屏',