amis-editor 5.2.0-beta.2 → 5.2.1-beta.15

package/esm/renderer/style-control/Display.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.0-beta.2
+ * amis-editor v5.2.1-beta.15
  * Copyright 2018-2022 @fex
  */
 
@@ -15,23 +15,20 @@ import { i18n } from 'i18n-runtime';
  * @file Display
  * @description 布局展示相关控件
  */
-
 var Display = function (props) {
   var onChange = props.onChange,
-      value = props.value,
-      render = props.render; // 下拉菜单通用渲染
-
+    value = props.value,
+    render = props.render;
+  // 下拉菜单通用渲染
   var menuTpl = {
     type: 'html',
     html: "<span>${label}</span><code class='ae-Code'>${value}</code>",
     className: 'ae-selection-code'
   };
   var displayContext = pick(isObject(value) ? value : {}, ['display', 'flexWrap', 'flexDirection', 'justifyContent', 'alignItems']);
-
   if (!displayContext.display) {
     displayContext.display = 'default';
   }
-
   var handleSubmit = function (form, action) {
     var displayValue = form.display === 'flex' ? form : mapValues(displayContext, function (value, key) {
       // 非flex布局/默认布局需要把不相关的参数干掉
@@ -39,7 +36,6 @@ var Display = function (props) {
     });
     onChange === null || onChange === void 0 ? void 0 : onChange(__assign(__assign({}, value), displayValue));
   };
-
   return React__default.createElement(React__default.Fragment, null, render('inner', {
     type: 'form',
     wrapWithPanel: false,
@@ -173,19 +169,19 @@ var Display = function (props) {
     onSubmit: handleSubmit
   }));
 };
-
-/** @class */
-(function (_super) {
+/** @class */(function (_super) {
   __extends(DisplayRenderer, _super);
-
   function DisplayRenderer() {
     return _super !== null && _super.apply(this, arguments) || this;
   }
-
-  DisplayRenderer.prototype.render = function () {
-    return React__default.createElement(Display, __assign({}, this.props));
-  };
-
+  Object.defineProperty(DisplayRenderer.prototype, "render", {
+    enumerable: false,
+    configurable: true,
+    writable: true,
+    value: function () {
+      return React__default.createElement(Display, __assign({}, this.props));
+    }
+  });
   DisplayRenderer = __decorate([FormItem({
     type: 'style-display'
   })], DisplayRenderer);

package/esm/renderer/style-control/Font.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.0-beta.2
+ * amis-editor v5.2.1-beta.15
  * Copyright 2018-2022 @fex
  */
 
@@ -16,20 +16,17 @@ import { i18n } from 'i18n-runtime';
  * @file Font
  * @description 文字样式相关控件
  */
-
 var Font = function (props) {
   var _a, _b, _c, _d, _e;
-
   var value = props.value,
-      onChange = props.onChange,
-      render = props.render;
+    onChange = props.onChange,
+    render = props.render;
   var validProps = ['color', 'fontFamily', 'fontSize', 'fontWeight', 'fontStyle', 'textAlign', 'letterSpacing', 'lineHeight'];
   var fontContext = isObject(value) ? __assign(__assign({}, pick(value, validProps)), {
     /** textDecoration 特殊处理一下，因为可以同时选择多个value */
     underline: !!~((_a = value === null || value === void 0 ? void 0 : value.textDecoration) !== null && _a !== void 0 ? _a : '').indexOf('underline') ? 'underline' : undefined,
     lineThrough: !!~((_b = value === null || value === void 0 ? void 0 : value.textDecoration) !== null && _b !== void 0 ? _b : '').indexOf('line-through') ? 'line-through' : undefined
   }) : {};
-
   var handleSubmit = function (formValue, action) {
     onChange === null || onChange === void 0 ? void 0 : onChange(__assign(__assign(__assign({}, value), mapValues(__assign(__assign({}, pick(formValue, validProps)), {
       textDecoration: [formValue.underline, formValue.lineThrough].filter(Boolean).join(' '),
@@ -42,7 +39,6 @@ var Font = function (props) {
       fontFamily: formValue.fontFamily
     }));
   };
-
   return React__default.createElement(React__default.Fragment, null, render('inner', {
     type: 'form',
     wrapWithPanel: false,
@@ -129,7 +125,8 @@ var Font = function (props) {
           className: 'ae-Font-group-rhs ae-Font-relative-right-2'
         }]
       }]
-    }, // TODO: 添加'justify-all', 'start', 'end', 'match-parent'类型
+    },
+    // TODO: 添加'justify-all', 'start', 'end', 'match-parent'类型
     {
       name: 'textAlign',
       label: i18n("d1b490c01d24a1a70e9c83a29ac38fde"),
@@ -184,19 +181,19 @@ var Font = function (props) {
     onSubmit: handleSubmit
   }));
 };
-
-/** @class */
-(function (_super) {
+/** @class */(function (_super) {
   __extends(FontRenderer, _super);
-
   function FontRenderer() {
     return _super !== null && _super.apply(this, arguments) || this;
   }
-
-  FontRenderer.prototype.render = function () {
-    return React__default.createElement(Font, __assign({}, this.props));
-  };
-
+  Object.defineProperty(FontRenderer.prototype, "render", {
+    enumerable: false,
+    configurable: true,
+    writable: true,
+    value: function () {
+      return React__default.createElement(Font, __assign({}, this.props));
+    }
+  });
   FontRenderer = __decorate([FormItem({
     type: 'style-font',
     renderLabel: false

package/esm/renderer/style-control/InsetBoxModel.d.ts

@@ -0,0 +1,17 @@
+/**
+ * @file  InsetBoxModel
+ * @description 盒模型控件，支持编辑 top、right、bottom、left
+ */
+import React from 'react';
+import type { FormControlProps } from 'amis-core';
+import type { PlainObject } from './types';
+export type Direction = 'left' | 'right' | 'top' | 'bottom';
+declare function InsetBoxModel({ value, onChange }: {
+    value?: PlainObject;
+    onChange: (value: PlainObject) => void;
+}): JSX.Element;
+declare const _default: typeof InsetBoxModel;
+export default _default;
+export declare class BoxModelRenderer extends React.Component<FormControlProps> {
+    render(): JSX.Element;
+}

package/esm/renderer/style-control/InsetBoxModel.js

@@ -0,0 +1,69 @@
+/**
+ * amis-editor v5.2.1-beta.15
+ * Copyright 2018-2022 @fex
+ */
+
+import { __extends, __assign, __decorate } from 'tslib';
+import cx from 'classnames';
+import React__default from 'react';
+import { observer } from 'mobx-react';
+import camelCase from 'lodash/camelCase';
+import { FormItem } from 'amis';
+import { isNumeric } from 'amis-editor-core';
+import { isAuto } from '../../util.js';
+
+/**
+ * @file  InsetBoxModel
+ * @description 盒模型控件，支持编辑 top、right、bottom、left
+ */
+function InsetBoxModel(_a) {
+    var value = _a.value, onChange = _a.onChange;
+    var directions = ['left', 'right', 'top', 'bottom'];
+    function handleChange(styleName) {
+        return function (e) {
+            var _a, _b;
+            var inputValue = e.target.value;
+            if (!inputValue) {
+                onChange(__assign(__assign({}, value), (_a = {}, _a[styleName] = '', _a)));
+                return;
+            }
+            // 数字类型或带有合法单位的字符串都支持
+            if (isNumeric(inputValue) ||
+                isAuto(inputValue) ||
+                /^(-?(\d*\.)?\d+)((px)|(em)|(%)|(ex)|(ch)|(rem)|(vw)|(vh)|(vmin)|(vmax)|(cm)|(mm)|(in)|(pt)|(pc))$/.test(inputValue)) {
+                onChange(__assign(__assign({}, value), (_b = {}, _b[styleName] = inputValue, _b)));
+            }
+        };
+    }
+    function renderBoxItem(item) {
+        return (React__default.createElement(React__default.Fragment, null,
+            directions.map(function (direction) {
+                var propsName = camelCase("".concat(item, "-").concat(direction));
+                return (React__default.createElement("input", { key: propsName, placeholder: "0", className: "ae-BoxModel-input ".concat(direction), type: "text", onChange: handleChange(propsName), value: (value === null || value === void 0 ? void 0 : value[propsName]) || '' }));
+            }),
+            React__default.createElement("div", { className: "ae-BoxModel-title" }, item.toUpperCase()),
+            ['lt', 'lb', 'rt', 'rb'].map(function (position) { return (React__default.createElement("div", { key: position, className: cx('ae-BoxModel-line', position) })); })));
+    }
+    return (React__default.createElement("div", { className: "mx-2 ae-BoxModel" },
+        React__default.createElement("div", { className: "ae-BoxModel-inner" }),
+        renderBoxItem('inset')));
+}
+observer(InsetBoxModel);
+/** @class */ ((function (_super) {
+    __extends(BoxModelRenderer, _super);
+    function BoxModelRenderer() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    Object.defineProperty(BoxModelRenderer.prototype, "render", {
+        enumerable: false,
+        configurable: true,
+        writable: true,
+        value: function () {
+            return React__default.createElement(InsetBoxModel, __assign({}, this.props));
+        }
+    });
+    BoxModelRenderer = __decorate([
+        FormItem({ type: 'inset-box-model' })
+    ], BoxModelRenderer);
+    return BoxModelRenderer;
+})(React__default.Component));

package/esm/renderer/style-control/font-family.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.0-beta.2
+ * amis-editor v5.2.1-beta.15
  * Copyright 2018-2022 @fex
  */
 
@@ -132,14 +132,13 @@ var fontFamilyList = [{
 //   value: 'Verdana'
 // }
 ];
+
 fontFamilyList.reduce(function (memo, current) {
   var _a;
-
   return __assign(__assign({}, memo), (_a = {}, _a[current.label] = current.value, _a));
 }, {});
 fontFamilyList.reduce(function (memo, current) {
   var _a;
-
   return __assign(__assign({}, memo), (_a = {}, _a[current.value] = current.label, _a));
 }, {});
 

package/esm/renderer/style-control/transformation.js

@@ -1,5 +1,5 @@
 /**
- * amis-editor v5.2.0-beta.2
+ * amis-editor v5.2.1-beta.15
  * Copyright 2018-2022 @fex
  */
 

package/esm/renderer/style-control/types.d.ts

@@ -2,7 +2,7 @@
  * @file control declaration
  * @description 公共控件相关声明
  */
-export declare type PlainObject = Record<string, any>;
-export declare type StyleObject = Record<'marginTop', any>;
-export declare type BoxShadowProps = 'x' | 'y' | 'blur' | 'spread' | 'color' | 'inset';
-export declare type LengthUnit = 'px' | 'em' | 'rem' | 'vw' | 'vh';
+export type PlainObject = Record<string, any>;
+export type StyleObject = Record<'marginTop', any>;
+export type BoxShadowProps = 'x' | 'y' | 'blur' | 'spread' | 'color' | 'inset';
+export type LengthUnit = 'px' | 'em' | 'rem' | 'vw' | 'vh';

package/esm/renderer/textarea-formula/FormulaPicker.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+export interface FormulaPickerProps {
+    onConfirm: (data: string) => void;
+    onClose: () => void;
+    variables: any[];
+    value?: string;
+    initable?: boolean;
+    variableMode?: 'tabs' | 'tree';
+    evalMode?: boolean;
+}
+declare const FormulaPicker: React.FC<FormulaPickerProps>;
+export default FormulaPicker;

package/esm/renderer/textarea-formula/FormulaPicker.js

@@ -0,0 +1,37 @@
+/**
+ * amis-editor v5.2.1-beta.15
+ * Copyright 2018-2022 @fex
+ */
+
+import React__default, { useEffect } from 'react';
+import { Modal, Button } from 'amis';
+import cx from 'classnames';
+import FormulaEditor from 'amis-ui/lib/components/formula/Editor';
+
+var FormulaPicker = function (props) {
+    var variables = props.variables, variableMode = props.variableMode, _a = props.evalMode, evalMode = _a === void 0 ? true : _a;
+    var _b = React__default.useState(''), formula = _b[0], setFormula = _b[1];
+    useEffect(function () {
+        var initable = props.initable, value = props.value;
+        if (initable && value) {
+            setFormula(value);
+        }
+    }, [props.value]);
+    var handleChange = function (data) {
+        setFormula(data);
+    };
+    var handleClose = function () {
+        props.onClose && props.onClose();
+    };
+    var handleConfirm = function () {
+        props.onConfirm && props.onConfirm(formula);
+    };
+    return (React__default.createElement(Modal, { className: cx('FormulaPicker-Modal'), size: "md", show: true, onHide: handleClose, closeOnEsc: true },
+        React__default.createElement(Modal.Body, null,
+            React__default.createElement(FormulaEditor, { header: "\u8868\u8FBE\u5F0F", variables: variables, variableMode: variableMode, value: formula, evalMode: evalMode, onChange: handleChange })),
+        React__default.createElement(Modal.Footer, null,
+            React__default.createElement(Button, { onClick: handleClose }, "\u53D6\u6D88"),
+            React__default.createElement(Button, { onClick: handleConfirm, level: "primary" }, "\u786E\u8BA4"))));
+};
+
+export { FormulaPicker as default };

package/esm/renderer/textarea-formula/TextareaFormulaControl.d.ts

@@ -0,0 +1,67 @@
+/**
+ * @file 长文本公式输入框
+ */
+/// <reference types="lodash" />
+import React from 'react';
+import { FormControlProps } from 'amis-core';
+import { FormulaPlugin } from './plugin';
+import CodeMirror from 'codemirror';
+import { VariableItem } from 'amis-ui/lib/components/formula/Editor';
+export interface TextareaFormulaControlProps extends FormControlProps {
+    /**
+     * 输入框的高度， 默认 100 px
+     */
+    height?: number;
+    /**
+     * 用于提示的变量集合，默认为空
+     */
+    variables?: Array<VariableItem> | Function;
+    /**
+     * 配合 variables 使用
+     * 当 props.variables 存在时， 是否再从 amis数据域中取变量集合，默认 false;
+     */
+    requiredDataPropsVariables?: boolean;
+    /**
+     * 变量展现模式，可选值：'tabs' ｜ 'tree'
+     */
+    variableMode?: 'tree' | 'tabs';
+    /**
+     *  附加底部按钮菜单项
+     */
+    additionalMenus?: Array<{
+        label: string;
+        onClick: () => void;
+        icon?: string;
+        className?: string;
+    }>;
+}
+interface TextareaFormulaControlState {
+    value: string;
+    variables: Array<VariableItem>;
+    formulaPickerOpen: boolean;
+    formulaPickerValue: string;
+    expressionBrace?: Array<CodeMirror.Position>;
+    isFullscreen: boolean;
+}
+export declare class TextareaFormulaControl extends React.Component<TextareaFormulaControlProps, TextareaFormulaControlState> {
+    static defaultProps: Partial<TextareaFormulaControlProps>;
+    isUnmount: boolean;
+    editorPlugin?: FormulaPlugin;
+    constructor(props: TextareaFormulaControlProps);
+    componentDidMount(): Promise<void>;
+    componentDidUpdate(prevProps: TextareaFormulaControlProps): Promise<void>;
+    componentWillUnmount(): void;
+    onExpressionClick(expression: string, brace?: Array<CodeMirror.Position>): void;
+    closeFormulaPicker(): void;
+    handleConfirm(value: any): void;
+    handleOnChange: import("lodash").DebouncedFunc<(value: any) => void>;
+    editorFactory(dom: HTMLElement, cm: any): CodeMirror.Editor;
+    handleEditorMounted(cm: any, editor: any): void;
+    handleFullscreenModeChange(): void;
+    handleFormulaClick(): void;
+    editorAutoMark(): void;
+    render(): JSX.Element;
+}
+export default class TextareaFormulaControlRenderer extends TextareaFormulaControl {
+}
+export {};