@webiny/app-headless-cms 0.0.0-unstable.40876133bb → 0.0.0-unstable.496cf268ac

package/admin/components/FieldEditor/FieldEditor.js

@@ -1,70 +1,88 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.FieldEditor = void 0;
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _get = _interopRequireDefault(require("lodash/get"));
-
 var _Icon = require("@webiny/ui/Icon");
-
 var _i18n = require("@webiny/app/i18n");
-
 var _roundDrag_indicator24px = require("../../icons/round-drag_indicator-24px.svg");
-
 var _DropZone = require("../DropZone");
-
 var _Draggable = _interopRequireDefault(require("../Draggable"));
-
 var _EditFieldDialog = _interopRequireDefault(require("./EditFieldDialog"));
-
 var _Field = _interopRequireDefault(require("./Field"));
-
 var _Styled = require("./Styled");
-
-var _useFieldEditor2 = require("./useFieldEditor");
-
+var _useModelFieldEditor2 = require("./useModelFieldEditor");
 var _FieldEditorContext = require("./FieldEditorContext");
-
+var _ModelFieldProvider = require("../ModelFieldProvider");
 var _templateObject;
-
 var t = _i18n.i18n.namespace("app-headless-cms/admin/components/editor");
-
 var fieldTypes = ["field", "newField"];
-
 var Editor = function Editor() {
-  var _useFieldEditor = (0, _useFieldEditor2.useFieldEditor)(),
-      parent = _useFieldEditor.parent,
-      depth = _useFieldEditor.depth,
-      insertField = _useFieldEditor.insertField,
-      updateField = _useFieldEditor.updateField,
-      deleteField = _useFieldEditor.deleteField,
-      fields = _useFieldEditor.fields,
-      noConflict = _useFieldEditor.noConflict,
-      editField = _useFieldEditor.editField,
-      onFieldDrop = _useFieldEditor.onFieldDrop,
-      onEndDrag = _useFieldEditor.onEndDrag,
-      field = _useFieldEditor.field,
-      dropTarget = _useFieldEditor.dropTarget;
-
+  var _useModelFieldEditor = (0, _useModelFieldEditor2.useModelFieldEditor)(),
+    parent = _useModelFieldEditor.parent,
+    depth = _useModelFieldEditor.depth,
+    insertField = _useModelFieldEditor.insertField,
+    updateField = _useModelFieldEditor.updateField,
+    deleteField = _useModelFieldEditor.deleteField,
+    fields = _useModelFieldEditor.fields,
+    noConflict = _useModelFieldEditor.noConflict,
+    editField = _useModelFieldEditor.editField,
+    onFieldDrop = _useModelFieldEditor.onFieldDrop,
+    onEndDrag = _useModelFieldEditor.onEndDrag,
+    field = _useModelFieldEditor.field,
+    dropTarget = _useModelFieldEditor.dropTarget,
+    getFieldPlugin = _useModelFieldEditor.getFieldPlugin;
+  var canDropIntoField = function canDropIntoField(field, draggable) {
+    var fieldPlugin = getFieldPlugin(field.type);
+    var canAccept = fieldPlugin.field.canAccept;
+    if (typeof canAccept === "function" && !canAccept(field, draggable)) {
+      return false;
+    }
+    return true;
+  };
+  var isVerticalDropzoneVisible = function isVerticalDropzoneVisible(cb) {
+    return function (item) {
+      var _fieldPlugin$field$al;
+      if (!parent) {
+        return cb(item);
+      }
+      var fieldPlugin = getFieldPlugin(parent.type);
+      var allowLayout = (_fieldPlugin$field$al = fieldPlugin.field.allowLayout) !== null && _fieldPlugin$field$al !== void 0 ? _fieldPlugin$field$al : true;
+      if (!allowLayout) {
+        return false;
+      }
+      if (!canDropIntoField(parent, item)) {
+        return false;
+      }
+      return cb(item);
+    };
+  };
+  var isHorizontalDropzoneVisible = function isHorizontalDropzoneVisible(cb) {
+    return function (item) {
+      if (!parent) {
+        return cb(item);
+      }
+      if (!canDropIntoField(parent, item)) {
+        return false;
+      }
+      return cb(item);
+    };
+  };
   return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, fields.length === 0 && /*#__PURE__*/_react.default.createElement(_DropZone.Center, {
+    isDroppable: isHorizontalDropzoneVisible(function () {
+      return true;
+    }),
     onDrop: function onDrop(item) {
       return onFieldDrop(item, {
         row: 0,
         index: 0
       });
-    },
-    style: {
-      padding: "5px 0 15px 0"
     }
   }, t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Drop your first field here"])))), fields.map(function (row, index) {
     return /*#__PURE__*/_react.default.createElement(_Draggable.default, {
@@ -80,11 +98,9 @@ var Editor = function Editor() {
       key: row.map(function (f) {
         return f.fieldId;
       }).join(".")
-    }, function (_ref
-    /* RowContainer start - includes drag handle, drop zones and the Row itself. */
-    ) {
+    }, function (_ref /* RowContainer start - includes drag handle, drop zones and the Row itself. */) {
       var drag = _ref.drag,
-          isDragging = _ref.isDragging;
+        isDragging = _ref.isDragging;
       return /*#__PURE__*/_react.default.createElement(_Styled.RowContainer, {
         style: {
           opacity: isDragging ? 0.3 : 1
@@ -95,8 +111,8 @@ var Editor = function Editor() {
       }, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
         icon: /*#__PURE__*/_react.default.createElement(_roundDrag_indicator24px.ReactComponent, null)
       })), /*#__PURE__*/_react.default.createElement(_DropZone.Horizontal, {
+        isVisible: isHorizontalDropzoneVisible(noConflict()),
         "data-testid": "cms-editor-row-droppable-top-".concat(index),
-        isVisible: noConflict(),
         onDrop: function onDrop(item) {
           return onFieldDrop(item, {
             row: index,
@@ -106,8 +122,10 @@ var Editor = function Editor() {
       }), /*#__PURE__*/_react.default.createElement(_Styled.Row, {
         "data-testid": "cms.editor.field-row"
       }, row.map(function (field, fieldIndex) {
-        return /*#__PURE__*/_react.default.createElement(_Draggable.default, {
-          key: field.fieldId,
+        return /*#__PURE__*/_react.default.createElement(_ModelFieldProvider.ModelFieldProvider, {
+          field: field,
+          key: field.fieldId
+        }, /*#__PURE__*/_react.default.createElement(_Draggable.default, {
           beginDrag: {
             parent: parent ? parent.fieldId : null,
             type: "field",
@@ -131,9 +149,9 @@ var Editor = function Editor() {
                 index: fieldIndex
               });
             },
-            isVisible: noConflict(function (item) {
+            isVisible: isVerticalDropzoneVisible(noConflict(function (item) {
               return fieldTypes.includes(item.type) && (row.length < 4 || (0, _get.default)(item, "pos.row") === index);
-            })
+            }))
           }), /*#__PURE__*/_react.default.createElement("div", {
             className: _Styled.fieldHandle
           }, /*#__PURE__*/_react.default.createElement(_Field.default, {
@@ -144,9 +162,9 @@ var Editor = function Editor() {
           })), fieldIndex === row.length - 1 && /*#__PURE__*/_react.default.createElement(_DropZone.Vertical, {
             last: true,
             depth: depth,
-            isVisible: noConflict(function (item) {
+            isVisible: isVerticalDropzoneVisible(noConflict(function (item) {
               return fieldTypes.includes(item.type) && (row.length < 4 || (0, _get.default)(item, "pos.row") === index);
-            }),
+            })),
             onDrop: function onDrop(item) {
               return onFieldDrop(item, {
                 row: index,
@@ -154,21 +172,22 @@ var Editor = function Editor() {
               });
             }
           }));
-        });
-      })), index === fields.length - 1 && /*#__PURE__*/_react.default.createElement(_DropZone.Horizontal, {
+        }));
+      })), index === fields.length - 1 ? /*#__PURE__*/_react.default.createElement(_DropZone.Horizontal, {
         "data-testid": "cms-editor-row-droppable-bottom-".concat(index),
         last: true,
-        isVisible: noConflict(),
+        isVisible: isHorizontalDropzoneVisible(noConflict()),
         onDrop: function onDrop(item) {
           return onFieldDrop(item, {
             row: index + 1,
             index: null
           });
         }
-      }));
+      }) : null);
     });
-  }), /*#__PURE__*/_react.default.createElement(_EditFieldDialog.default, {
-    field: field,
+  }), field ? /*#__PURE__*/_react.default.createElement(_ModelFieldProvider.ModelFieldProvider, {
+    field: field
+  }, /*#__PURE__*/_react.default.createElement(_EditFieldDialog.default, {
     onClose: function onClose() {
       return editField(null);
     },
@@ -178,18 +197,15 @@ var Editor = function Editor() {
         editField(null);
         return;
       }
-
       insertField({
         field: field,
         position: dropTarget
       });
       editField(null);
     }
-  }));
+  })) : null);
 };
-
 var FieldEditor = function FieldEditor(props) {
   return /*#__PURE__*/_react.default.createElement(_FieldEditorContext.FieldEditorProvider, props, /*#__PURE__*/_react.default.createElement(Editor, null));
 };
-
 exports.FieldEditor = FieldEditor;

package/admin/components/FieldEditor/FieldEditor.js.map

@@ -1 +1 @@
-{"version":3,"names":["t","i18n","namespace","fieldTypes","Editor","useFieldEditor","parent","depth","insertField","updateField","deleteField","fields","noConflict","editField","onFieldDrop","onEndDrag","field","dropTarget","length","item","row","index","padding","map","fieldId","type","pos","f","join","drag","isDragging","opacity","rowHandle","fieldIndex","fieldContainer","includes","get","fieldHandle","id","position","FieldEditor","props"],"sources":["FieldEditor.tsx"],"sourcesContent":["import React, { Fragment } from \"react\";\nimport get from \"lodash/get\";\nimport { Icon } from \"@webiny/ui/Icon\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { ReactComponent as HandleIcon } from \"~/admin/icons/round-drag_indicator-24px.svg\";\nimport { Center, Vertical, Horizontal } from \"../DropZone\";\nimport Draggable from \"../Draggable\";\nimport EditFieldDialog from \"./EditFieldDialog\";\nimport Field from \"./Field\";\nimport { rowHandle, fieldHandle, fieldContainer, Row, RowContainer } from \"./Styled\";\nimport { useFieldEditor } from \"./useFieldEditor\";\nimport { FieldEditorProvider } from \"./FieldEditorContext\";\nimport { CmsEditorField, CmsEditorFieldsLayout } from \"~/types\";\n\nconst t = i18n.namespace(\"app-headless-cms/admin/components/editor\");\n\nconst fieldTypes: string[] = [\"field\", \"newField\"];\n\nconst Editor: React.FC = () => {\n    const {\n        parent,\n        depth,\n        insertField,\n        updateField,\n        deleteField,\n        fields,\n        noConflict,\n        editField,\n        onFieldDrop,\n        onEndDrag,\n        field,\n        dropTarget\n    } = useFieldEditor();\n\n    return (\n        <Fragment>\n            {fields.length === 0 && (\n                <Center\n                    onDrop={item =>\n                        onFieldDrop(item, {\n                            row: 0,\n                            index: 0\n                        })\n                    }\n                    style={{ padding: \"5px 0 15px 0\" }}\n                >\n                    {t`Drop your first field here`}\n                </Center>\n            )}\n\n            {fields.map((row, index) => (\n                <Draggable\n                    beginDrag={{\n                        parent: parent ? parent.fieldId : null,\n                        type: \"row\",\n                        fields: row,\n                        pos: { row: index }\n                    }}\n                    endDrag={onEndDrag}\n                    key={row.map(f => f.fieldId).join(\".\")}\n                >\n                    {(\n                        {\n                            drag,\n                            isDragging\n                        } /* RowContainer start - includes drag handle, drop zones and the Row itself. */\n                    ) => (\n                        <RowContainer style={{ opacity: isDragging ? 0.3 : 1 }}>\n                            <div className={rowHandle} ref={drag}>\n                                <Icon icon={<HandleIcon />} />\n                            </div>\n                            <Horizontal\n                                data-testid={`cms-editor-row-droppable-top-${index}`}\n                                isVisible={noConflict()}\n                                onDrop={item => onFieldDrop(item, { row: index, index: null })}\n                            />\n                            {/* Row start - includes field drop zones and fields */}\n                            <Row data-testid={\"cms.editor.field-row\"}>\n                                {row.map((field, fieldIndex) => (\n                                    <Draggable\n                                        key={field.fieldId}\n                                        beginDrag={{\n                                            parent: parent ? parent.fieldId : null,\n                                            type: \"field\",\n                                            field,\n                                            pos: {\n                                                row: index,\n                                                index: fieldIndex\n                                            }\n                                        }}\n                                        endDrag={onEndDrag}\n                                    >\n                                        {({ drag }) => (\n                                            <div className={fieldContainer} ref={drag}>\n                                                <Vertical\n                                                    depth={depth}\n                                                    onDrop={item =>\n                                                        onFieldDrop(item, {\n                                                            row: index,\n                                                            index: fieldIndex\n                                                        })\n                                                    }\n                                                    isVisible={noConflict(\n                                                        item =>\n                                                            fieldTypes.includes(item.type) &&\n                                                            (row.length < 4 ||\n                                                                get(item, \"pos.row\") === index)\n                                                    )}\n                                                />\n\n                                                <div className={fieldHandle}>\n                                                    <Field\n                                                        parent={parent}\n                                                        field={field}\n                                                        onEdit={editField}\n                                                        onDelete={deleteField}\n                                                    />\n                                                </div>\n\n                                                {/* Field end */}\n                                                {fieldIndex === row.length - 1 && (\n                                                    <Vertical\n                                                        last\n                                                        depth={depth}\n                                                        isVisible={noConflict(\n                                                            item =>\n                                                                fieldTypes.includes(item.type) &&\n                                                                (row.length < 4 ||\n                                                                    get(item, \"pos.row\") === index)\n                                                        )}\n                                                        onDrop={item =>\n                                                            onFieldDrop(item, {\n                                                                row: index,\n                                                                index: fieldIndex + 1\n                                                            })\n                                                        }\n                                                    />\n                                                )}\n                                            </div>\n                                        )}\n                                    </Draggable>\n                                ))}\n                            </Row>\n                            {/* Row end */}\n                            {index === fields.length - 1 && (\n                                <Horizontal\n                                    data-testid={`cms-editor-row-droppable-bottom-${index}`}\n                                    last\n                                    isVisible={noConflict()}\n                                    onDrop={item =>\n                                        onFieldDrop(item, {\n                                            row: index + 1,\n                                            index: null\n                                        })\n                                    }\n                                />\n                            )}\n                        </RowContainer>\n                    )}\n                </Draggable>\n            ))}\n\n            <EditFieldDialog\n                field={field}\n                onClose={() => editField(null)}\n                onSubmit={field => {\n                    if (field.id) {\n                        updateField(field);\n                        editField(null);\n                        return;\n                    }\n                    insertField({ field, position: dropTarget });\n\n                    editField(null);\n                }}\n            />\n        </Fragment>\n    );\n};\n\nexport interface FieldEditorProps {\n    parent?: CmsEditorField;\n    layout: CmsEditorFieldsLayout;\n    fields: CmsEditorField[];\n    onChange: (params: { fields: CmsEditorField[]; layout: CmsEditorFieldsLayout }) => void;\n}\n\nexport const FieldEditor: React.FC<FieldEditorProps> = props => {\n    return (\n        <FieldEditorProvider {...props}>\n            <Editor />\n        </FieldEditorProvider>\n    );\n};\n"],"mappings":"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"}
+{"version":3,"names":["t","i18n","namespace","fieldTypes","Editor","useModelFieldEditor","parent","depth","insertField","updateField","deleteField","fields","noConflict","editField","onFieldDrop","onEndDrag","field","dropTarget","getFieldPlugin","canDropIntoField","draggable","fieldPlugin","type","canAccept","isVerticalDropzoneVisible","cb","item","allowLayout","isHorizontalDropzoneVisible","length","row","index","map","fieldId","pos","f","join","drag","isDragging","opacity","rowHandle","fieldIndex","fieldContainer","includes","get","fieldHandle","id","position","FieldEditor","props"],"sources":["FieldEditor.tsx"],"sourcesContent":["import React, { Fragment } from \"react\";\nimport get from \"lodash/get\";\nimport { Icon } from \"@webiny/ui/Icon\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { ReactComponent as HandleIcon } from \"~/admin/icons/round-drag_indicator-24px.svg\";\nimport { Center, Vertical, Horizontal } from \"../DropZone\";\nimport Draggable from \"../Draggable\";\nimport EditFieldDialog from \"./EditFieldDialog\";\nimport Field from \"./Field\";\nimport { rowHandle, fieldHandle, fieldContainer, Row, RowContainer } from \"./Styled\";\nimport { useModelFieldEditor } from \"./useModelFieldEditor\";\nimport { DragSource, FieldEditorProvider, IsVisibleCallable } from \"./FieldEditorContext\";\nimport { CmsModelField, CmsEditorFieldsLayout, CmsModelFieldTypePlugin } from \"~/types\";\nimport { ModelFieldProvider } from \"~/admin/components/ModelFieldProvider\";\n\nconst t = i18n.namespace(\"app-headless-cms/admin/components/editor\");\n\nconst fieldTypes: string[] = [\"field\", \"newField\"];\n\nconst Editor: React.FC = () => {\n    const {\n        parent,\n        depth,\n        insertField,\n        updateField,\n        deleteField,\n        fields,\n        noConflict,\n        editField,\n        onFieldDrop,\n        onEndDrag,\n        field,\n        dropTarget,\n        getFieldPlugin\n    } = useModelFieldEditor();\n\n    const canDropIntoField = (field: CmsModelField, draggable: DragSource) => {\n        const fieldPlugin = getFieldPlugin(field.type) as CmsModelFieldTypePlugin;\n        const canAccept = fieldPlugin.field.canAccept;\n        if (typeof canAccept === \"function\" && !canAccept(field, draggable)) {\n            return false;\n        }\n\n        return true;\n    };\n\n    const isVerticalDropzoneVisible = (cb: IsVisibleCallable) => {\n        return (item: DragSource) => {\n            if (!parent) {\n                return cb(item);\n            }\n\n            const fieldPlugin = getFieldPlugin(parent.type) as CmsModelFieldTypePlugin;\n            const allowLayout = fieldPlugin.field.allowLayout ?? true;\n            if (!allowLayout) {\n                return false;\n            }\n\n            if (!canDropIntoField(parent, item)) {\n                return false;\n            }\n\n            return cb(item);\n        };\n    };\n\n    const isHorizontalDropzoneVisible = (cb: IsVisibleCallable) => {\n        return (item: DragSource) => {\n            if (!parent) {\n                return cb(item);\n            }\n\n            if (!canDropIntoField(parent, item)) {\n                return false;\n            }\n\n            return cb(item);\n        };\n    };\n\n    return (\n        <Fragment>\n            {fields.length === 0 && (\n                <Center\n                    isDroppable={isHorizontalDropzoneVisible(() => true)}\n                    onDrop={item =>\n                        onFieldDrop(item, {\n                            row: 0,\n                            index: 0\n                        })\n                    }\n                >\n                    {t`Drop your first field here`}\n                </Center>\n            )}\n\n            {fields.map((row, index) => (\n                <Draggable\n                    beginDrag={{\n                        parent: parent ? parent.fieldId : null,\n                        type: \"row\",\n                        fields: row,\n                        pos: { row: index }\n                    }}\n                    endDrag={onEndDrag}\n                    key={row.map(f => f.fieldId).join(\".\")}\n                >\n                    {(\n                        {\n                            drag,\n                            isDragging\n                        } /* RowContainer start - includes drag handle, drop zones and the Row itself. */\n                    ) => (\n                        <RowContainer style={{ opacity: isDragging ? 0.3 : 1 }}>\n                            <div className={rowHandle} ref={drag}>\n                                <Icon icon={<HandleIcon />} />\n                            </div>\n                            <Horizontal\n                                isVisible={isHorizontalDropzoneVisible(noConflict())}\n                                data-testid={`cms-editor-row-droppable-top-${index}`}\n                                onDrop={item => onFieldDrop(item, { row: index, index: null })}\n                            />\n                            {/* Row start - includes field drop zones and fields */}\n                            <Row data-testid={\"cms.editor.field-row\"}>\n                                {row.map((field, fieldIndex) => (\n                                    <ModelFieldProvider field={field} key={field.fieldId}>\n                                        <Draggable\n                                            beginDrag={{\n                                                parent: parent ? parent.fieldId : null,\n                                                type: \"field\",\n                                                field,\n                                                pos: {\n                                                    row: index,\n                                                    index: fieldIndex\n                                                }\n                                            }}\n                                            endDrag={onEndDrag}\n                                        >\n                                            {({ drag }) => (\n                                                <div className={fieldContainer} ref={drag}>\n                                                    <Vertical\n                                                        depth={depth}\n                                                        onDrop={item =>\n                                                            onFieldDrop(item, {\n                                                                row: index,\n                                                                index: fieldIndex\n                                                            })\n                                                        }\n                                                        isVisible={isVerticalDropzoneVisible(\n                                                            noConflict(\n                                                                item =>\n                                                                    fieldTypes.includes(\n                                                                        item.type\n                                                                    ) &&\n                                                                    (row.length < 4 ||\n                                                                        get(item, \"pos.row\") ===\n                                                                            index)\n                                                            )\n                                                        )}\n                                                    />\n\n                                                    <div className={fieldHandle}>\n                                                        <Field\n                                                            parent={parent}\n                                                            field={field}\n                                                            onEdit={editField}\n                                                            onDelete={deleteField}\n                                                        />\n                                                    </div>\n\n                                                    {/* Field end */}\n                                                    {fieldIndex === row.length - 1 && (\n                                                        <Vertical\n                                                            last\n                                                            depth={depth}\n                                                            isVisible={isVerticalDropzoneVisible(\n                                                                noConflict(item => {\n                                                                    return (\n                                                                        fieldTypes.includes(\n                                                                            item.type\n                                                                        ) &&\n                                                                        (row.length < 4 ||\n                                                                            get(item, \"pos.row\") ===\n                                                                                index)\n                                                                    );\n                                                                })\n                                                            )}\n                                                            onDrop={item =>\n                                                                onFieldDrop(item, {\n                                                                    row: index,\n                                                                    index: fieldIndex + 1\n                                                                })\n                                                            }\n                                                        />\n                                                    )}\n                                                </div>\n                                            )}\n                                        </Draggable>\n                                    </ModelFieldProvider>\n                                ))}\n                            </Row>\n                            {/* Row end */}\n                            {index === fields.length - 1 ? (\n                                <Horizontal\n                                    data-testid={`cms-editor-row-droppable-bottom-${index}`}\n                                    last\n                                    isVisible={isHorizontalDropzoneVisible(noConflict())}\n                                    onDrop={item =>\n                                        onFieldDrop(item, {\n                                            row: index + 1,\n                                            index: null\n                                        })\n                                    }\n                                />\n                            ) : null}\n                        </RowContainer>\n                    )}\n                </Draggable>\n            ))}\n\n            {field ? (\n                <ModelFieldProvider field={field}>\n                    <EditFieldDialog\n                        onClose={() => editField(null)}\n                        onSubmit={field => {\n                            if (field.id) {\n                                updateField(field);\n                                editField(null);\n                                return;\n                            }\n                            insertField({ field, position: dropTarget });\n\n                            editField(null);\n                        }}\n                    />\n                </ModelFieldProvider>\n            ) : null}\n        </Fragment>\n    );\n};\n\nexport interface FieldEditorProps {\n    parent?: CmsModelField;\n    layout: CmsEditorFieldsLayout;\n    fields: CmsModelField[];\n    onChange: (params: { fields: CmsModelField[]; layout: CmsEditorFieldsLayout }) => void;\n}\n\nexport const FieldEditor: React.FC<FieldEditorProps> = props => {\n    return (\n        <FieldEditorProvider {...props}>\n            <Editor />\n        </FieldEditorProvider>\n    );\n};\n"],"mappings":";;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAA2E;AAE3E,IAAMA,CAAC,GAAGC,UAAI,CAACC,SAAS,CAAC,0CAA0C,CAAC;AAEpE,IAAMC,UAAoB,GAAG,CAAC,OAAO,EAAE,UAAU,CAAC;AAElD,IAAMC,MAAgB,GAAG,SAAnBA,MAAgB,GAAS;EAC3B,2BAcI,IAAAC,yCAAmB,GAAE;IAbrBC,MAAM,wBAANA,MAAM;IACNC,KAAK,wBAALA,KAAK;IACLC,WAAW,wBAAXA,WAAW;IACXC,WAAW,wBAAXA,WAAW;IACXC,WAAW,wBAAXA,WAAW;IACXC,MAAM,wBAANA,MAAM;IACNC,UAAU,wBAAVA,UAAU;IACVC,SAAS,wBAATA,SAAS;IACTC,WAAW,wBAAXA,WAAW;IACXC,SAAS,wBAATA,SAAS;IACTC,KAAK,wBAALA,KAAK;IACLC,UAAU,wBAAVA,UAAU;IACVC,cAAc,wBAAdA,cAAc;EAGlB,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAgB,CAAIH,KAAoB,EAAEI,SAAqB,EAAK;IACtE,IAAMC,WAAW,GAAGH,cAAc,CAACF,KAAK,CAACM,IAAI,CAA4B;IACzE,IAAMC,SAAS,GAAGF,WAAW,CAACL,KAAK,CAACO,SAAS;IAC7C,IAAI,OAAOA,SAAS,KAAK,UAAU,IAAI,CAACA,SAAS,CAACP,KAAK,EAAEI,SAAS,CAAC,EAAE;MACjE,OAAO,KAAK;IAChB;IAEA,OAAO,IAAI;EACf,CAAC;EAED,IAAMI,yBAAyB,GAAG,SAA5BA,yBAAyB,CAAIC,EAAqB,EAAK;IACzD,OAAO,UAACC,IAAgB,EAAK;MAAA;MACzB,IAAI,CAACpB,MAAM,EAAE;QACT,OAAOmB,EAAE,CAACC,IAAI,CAAC;MACnB;MAEA,IAAML,WAAW,GAAGH,cAAc,CAACZ,MAAM,CAACgB,IAAI,CAA4B;MAC1E,IAAMK,WAAW,4BAAGN,WAAW,CAACL,KAAK,CAACW,WAAW,yEAAI,IAAI;MACzD,IAAI,CAACA,WAAW,EAAE;QACd,OAAO,KAAK;MAChB;MAEA,IAAI,CAACR,gBAAgB,CAACb,MAAM,EAAEoB,IAAI,CAAC,EAAE;QACjC,OAAO,KAAK;MAChB;MAEA,OAAOD,EAAE,CAACC,IAAI,CAAC;IACnB,CAAC;EACL,CAAC;EAED,IAAME,2BAA2B,GAAG,SAA9BA,2BAA2B,CAAIH,EAAqB,EAAK;IAC3D,OAAO,UAACC,IAAgB,EAAK;MACzB,IAAI,CAACpB,MAAM,EAAE;QACT,OAAOmB,EAAE,CAACC,IAAI,CAAC;MACnB;MAEA,IAAI,CAACP,gBAAgB,CAACb,MAAM,EAAEoB,IAAI,CAAC,EAAE;QACjC,OAAO,KAAK;MAChB;MAEA,OAAOD,EAAE,CAACC,IAAI,CAAC;IACnB,CAAC;EACL,CAAC;EAED,oBACI,6BAAC,eAAQ,QACJf,MAAM,CAACkB,MAAM,KAAK,CAAC,iBAChB,6BAAC,gBAAM;IACH,WAAW,EAAED,2BAA2B,CAAC;MAAA,OAAM,IAAI;IAAA,EAAE;IACrD,MAAM,EAAE,gBAAAF,IAAI;MAAA,OACRZ,WAAW,CAACY,IAAI,EAAE;QACdI,GAAG,EAAE,CAAC;QACNC,KAAK,EAAE;MACX,CAAC,CAAC;IAAA;EACL,GAEA/B,CAAC,8GAET,EAEAW,MAAM,CAACqB,GAAG,CAAC,UAACF,GAAG,EAAEC,KAAK;IAAA,oBACnB,6BAAC,kBAAS;MACN,SAAS,EAAE;QACPzB,MAAM,EAAEA,MAAM,GAAGA,MAAM,CAAC2B,OAAO,GAAG,IAAI;QACtCX,IAAI,EAAE,KAAK;QACXX,MAAM,EAAEmB,GAAG;QACXI,GAAG,EAAE;UAAEJ,GAAG,EAAEC;QAAM;MACtB,CAAE;MACF,OAAO,EAAEhB,SAAU;MACnB,GAAG,EAAEe,GAAG,CAACE,GAAG,CAAC,UAAAG,CAAC;QAAA,OAAIA,CAAC,CAACF,OAAO;MAAA,EAAC,CAACG,IAAI,CAAC,GAAG;IAAE,GAEtC,eAIK;MAAA,IAFEC,IAAI,QAAJA,IAAI;QACJC,UAAU,QAAVA,UAAU;MAAA,oBAGd,6BAAC,oBAAY;QAAC,KAAK,EAAE;UAAEC,OAAO,EAAED,UAAU,GAAG,GAAG,GAAG;QAAE;MAAE,gBACnD;QAAK,SAAS,EAAEE,iBAAU;QAAC,GAAG,EAAEH;MAAK,gBACjC,6BAAC,UAAI;QAAC,IAAI,eAAE,6BAAC,uCAAU;MAAI,EAAG,CAC5B,eACN,6BAAC,oBAAU;QACP,SAAS,EAAET,2BAA2B,CAAChB,UAAU,EAAE,CAAE;QACrD,sDAA6CmB,KAAK,CAAG;QACrD,MAAM,EAAE,gBAAAL,IAAI;UAAA,OAAIZ,WAAW,CAACY,IAAI,EAAE;YAAEI,GAAG,EAAEC,KAAK;YAAEA,KAAK,EAAE;UAAK,CAAC,CAAC;QAAA;MAAC,EACjE,eAEF,6BAAC,WAAG;QAAC,eAAa;MAAuB,GACpCD,GAAG,CAACE,GAAG,CAAC,UAAChB,KAAK,EAAEyB,UAAU;QAAA,oBACvB,6BAAC,sCAAkB;UAAC,KAAK,EAAEzB,KAAM;UAAC,GAAG,EAAEA,KAAK,CAACiB;QAAQ,gBACjD,6BAAC,kBAAS;UACN,SAAS,EAAE;YACP3B,MAAM,EAAEA,MAAM,GAAGA,MAAM,CAAC2B,OAAO,GAAG,IAAI;YACtCX,IAAI,EAAE,OAAO;YACbN,KAAK,EAALA,KAAK;YACLkB,GAAG,EAAE;cACDJ,GAAG,EAAEC,KAAK;cACVA,KAAK,EAAEU;YACX;UACJ,CAAE;UACF,OAAO,EAAE1B;QAAU,GAElB;UAAA,IAAGsB,IAAI,SAAJA,IAAI;UAAA,oBACJ;YAAK,SAAS,EAAEK,sBAAe;YAAC,GAAG,EAAEL;UAAK,gBACtC,6BAAC,kBAAQ;YACL,KAAK,EAAE9B,KAAM;YACb,MAAM,EAAE,gBAAAmB,IAAI;cAAA,OACRZ,WAAW,CAACY,IAAI,EAAE;gBACdI,GAAG,EAAEC,KAAK;gBACVA,KAAK,EAAEU;cACX,CAAC,CAAC;YAAA,CACL;YACD,SAAS,EAAEjB,yBAAyB,CAChCZ,UAAU,CACN,UAAAc,IAAI;cAAA,OACAvB,UAAU,CAACwC,QAAQ,CACfjB,IAAI,CAACJ,IAAI,CACZ,KACAQ,GAAG,CAACD,MAAM,GAAG,CAAC,IACX,IAAAe,YAAG,EAAClB,IAAI,EAAE,SAAS,CAAC,KAChBK,KAAK,CAAC;YAAA,EACrB;UACH,EACJ,eAEF;YAAK,SAAS,EAAEc;UAAY,gBACxB,6BAAC,cAAK;YACF,MAAM,EAAEvC,MAAO;YACf,KAAK,EAAEU,KAAM;YACb,MAAM,EAAEH,SAAU;YAClB,QAAQ,EAAEH;UAAY,EACxB,CACA,EAGL+B,UAAU,KAAKX,GAAG,CAACD,MAAM,GAAG,CAAC,iBAC1B,6BAAC,kBAAQ;YACL,IAAI;YACJ,KAAK,EAAEtB,KAAM;YACb,SAAS,EAAEiB,yBAAyB,CAChCZ,UAAU,CAAC,UAAAc,IAAI,EAAI;cACf,OACIvB,UAAU,CAACwC,QAAQ,CACfjB,IAAI,CAACJ,IAAI,CACZ,KACAQ,GAAG,CAACD,MAAM,GAAG,CAAC,IACX,IAAAe,YAAG,EAAClB,IAAI,EAAE,SAAS,CAAC,KAChBK,KAAK,CAAC;YAEtB,CAAC,CAAC,CACJ;YACF,MAAM,EAAE,gBAAAL,IAAI;cAAA,OACRZ,WAAW,CAACY,IAAI,EAAE;gBACdI,GAAG,EAAEC,KAAK;gBACVA,KAAK,EAAEU,UAAU,GAAG;cACxB,CAAC,CAAC;YAAA;UACL,EAER,CACC;QAAA,CACT,CACO,CACK;MAAA,CACxB,CAAC,CACA,EAELV,KAAK,KAAKpB,MAAM,CAACkB,MAAM,GAAG,CAAC,gBACxB,6BAAC,oBAAU;QACP,yDAAgDE,KAAK,CAAG;QACxD,IAAI;QACJ,SAAS,EAAEH,2BAA2B,CAAChB,UAAU,EAAE,CAAE;QACrD,MAAM,EAAE,gBAAAc,IAAI;UAAA,OACRZ,WAAW,CAACY,IAAI,EAAE;YACdI,GAAG,EAAEC,KAAK,GAAG,CAAC;YACdA,KAAK,EAAE;UACX,CAAC,CAAC;QAAA;MACL,EACH,GACF,IAAI,CACG;IAAA,CAClB,CACO;EAAA,CACf,CAAC,EAEDf,KAAK,gBACF,6BAAC,sCAAkB;IAAC,KAAK,EAAEA;EAAM,gBAC7B,6BAAC,wBAAe;IACZ,OAAO,EAAE;MAAA,OAAMH,SAAS,CAAC,IAAI,CAAC;IAAA,CAAC;IAC/B,QAAQ,EAAE,kBAAAG,KAAK,EAAI;MACf,IAAIA,KAAK,CAAC8B,EAAE,EAAE;QACVrC,WAAW,CAACO,KAAK,CAAC;QAClBH,SAAS,CAAC,IAAI,CAAC;QACf;MACJ;MACAL,WAAW,CAAC;QAAEQ,KAAK,EAALA,KAAK;QAAE+B,QAAQ,EAAE9B;MAAW,CAAC,CAAC;MAE5CJ,SAAS,CAAC,IAAI,CAAC;IACnB;EAAE,EACJ,CACe,GACrB,IAAI,CACD;AAEnB,CAAC;AASM,IAAMmC,WAAuC,GAAG,SAA1CA,WAAuC,CAAGC,KAAK,EAAI;EAC5D,oBACI,6BAAC,uCAAmB,EAAKA,KAAK,eAC1B,6BAAC,MAAM,OAAG,CACQ;AAE9B,CAAC;AAAC"}

package/admin/components/FieldEditor/FieldEditorContext.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { CmsEditorField, CmsEditorFieldId, CmsEditorFieldsLayout, CmsEditorFieldTypePlugin, FieldLayoutPosition } from "../../../types";
+import { CmsModelField, CmsEditorFieldId, CmsEditorFieldRendererPlugin, CmsEditorFieldsLayout, CmsEditorFieldTypePlugin, FieldLayoutPosition } from "../../../types";
 import { FieldEditorProps } from "./FieldEditor";
 import { DragObjectWithType, DragSourceMonitor } from "react-dnd";
 interface DropTarget {
@@ -15,8 +15,8 @@ export interface DragSource extends DragObjectWithType {
     pos?: Partial<Position>;
     type: "row" | "field" | "newField";
     fieldType?: string;
-    field?: CmsEditorField | null;
-    fields?: CmsEditorField[];
+    field?: CmsModelField | null;
+    fields?: CmsModelField[];
 }
 /**
  * Property in GetFieldParams can be any key from CmsEditorField, but TS does not allow union types
@@ -26,21 +26,24 @@ interface GetFieldParams {
     fieldId?: string;
 }
 interface InsertFieldParams {
-    field: CmsEditorField;
+    field: CmsModelField;
     position: FieldLayoutPosition;
 }
 interface MoveFieldParams {
-    field: CmsEditorFieldId | CmsEditorField;
+    field: CmsEditorFieldId | CmsModelField;
     position: FieldLayoutPosition;
 }
 interface GetFieldsInLayoutCallable {
-    (): CmsEditorField[][];
+    (): CmsModelField[][];
 }
 interface GetFieldPluginCallable {
     (type: string): CmsEditorFieldTypePlugin | undefined;
 }
 interface GetFieldCallable {
-    (query: GetFieldParams): CmsEditorField | undefined;
+    (query: GetFieldParams): CmsModelField | undefined;
+}
+interface GetFieldRendererCallable {
+    (rendererName: string): CmsEditorFieldRendererPlugin | undefined;
 }
 interface OnFieldDropCallable {
     (source: Partial<DragSource>, target: DropTarget): void;
@@ -58,28 +61,29 @@ interface MoveRowCallable {
     (source: number, destination: number): void;
 }
 interface UpdateFieldCallable {
-    (field: Pick<CmsEditorField, "id">): void;
+    (field: CmsModelField): void;
 }
 interface DeleteFieldCallable {
-    (field: Pick<CmsEditorField, "id">): void;
+    (field: Pick<CmsModelField, "id">): void;
 }
-interface IsVisibleCallable {
+export interface IsVisibleCallable {
     (item: DragSource): boolean;
 }
 interface NoConflictCallable {
     (cb?: IsVisibleCallable): (item: DragSource) => boolean;
 }
-export interface FieldEditorContextValue {
-    fields: CmsEditorField[][];
+export interface FieldEditorContext {
+    fields: CmsModelField[][];
     noConflict: NoConflictCallable;
     layout: CmsEditorFieldsLayout;
     onChange?: (data: any) => void;
     getFieldsInLayout: GetFieldsInLayoutCallable;
     getFieldPlugin: GetFieldPluginCallable;
     getField: GetFieldCallable;
-    editField: (field: CmsEditorField | null) => void;
-    field: CmsEditorField | null;
-    parent?: CmsEditorField;
+    getFieldRendererPlugin: GetFieldRendererCallable;
+    editField: (field: CmsModelField | null) => void;
+    field: CmsModelField | null;
+    parent?: CmsModelField;
     depth: number;
     dropTarget: DropTarget;
     onFieldDrop: OnFieldDropCallable;
@@ -93,6 +97,6 @@ export interface FieldEditorContextValue {
 interface FieldEditorProviderProps extends FieldEditorProps {
     children: React.ReactElement;
 }
-export declare const FieldEditorContext: React.Context<FieldEditorContextValue>;
+export declare const FieldEditorContext: React.Context<FieldEditorContext | undefined>;
 export declare const FieldEditorProvider: React.FC<FieldEditorProviderProps>;
 export {};