@webiny/app-headless-cms 0.0.0-ee-vpcs.549378cf03

package/admin/components/FieldEditor/FieldEditorContext.js

@@ -0,0 +1,416 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FieldEditorProvider = exports.FieldEditorContext = void 0;
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _dotPropImmutable = _interopRequireDefault(require("dot-prop-immutable"));
+
+var _useDeepCompareEffect = _interopRequireDefault(require("use-deep-compare-effect"));
+
+var _plugins = require("@webiny/plugins");
+
+var utils = _interopRequireWildcard(require("./utils"));
+
+var _useModelFieldEditor = require("./useModelFieldEditor");
+
+var _utils2 = require("@webiny/utils");
+
+var FieldEditorContext = /*#__PURE__*/_react.default.createContext(undefined);
+/**
+ * We try to generate the random id string but with the check that it does not exist already.
+ * Chances that the same string exists are quite small, but let's check it anyway.
+ *
+ * In most cases, there will be no iterations anyway...
+ */
+
+
+exports.FieldEditorContext = FieldEditorContext;
+var maxGenerateIdIterations = 100;
+
+var generateFieldId = function generateFieldId(layout) {
+  var id = (0, _utils2.generateAlphaNumericLowerCaseId)(8);
+  var iteration = 0;
+
+  while (layout.includes(id) && iteration < maxGenerateIdIterations) {
+    id = (0, _utils2.generateAlphaNumericLowerCaseId)(8);
+    iteration++;
+  }
+
+  if (iteration >= maxGenerateIdIterations) {
+    throw new Error("Could not generate field ID in ".concat(maxGenerateIdIterations, " iterations."));
+  }
+
+  return id;
+};
+
+var FieldEditorProvider = function FieldEditorProvider(_ref) {
+  var parent = _ref.parent,
+      fields = _ref.fields,
+      layout = _ref.layout,
+      onChange = _ref.onChange,
+      children = _ref.children;
+  // We need to determine depth of this provider so we can render drop zones with correct z-indexes.
+  var depth = 0;
+
+  try {
+    var editor = (0, _useModelFieldEditor.useModelFieldEditor)();
+    depth = editor.depth + 1;
+  } catch (_unused) {// There's no parent provider, so this is the top-level one.
+  }
+
+  var _useState = (0, _react.useState)({
+    layout: layout,
+    fields: fields,
+    field: null,
+    dropTarget: {
+      row: -1,
+      index: null
+    }
+  }),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      state = _useState2[0],
+      setState = _useState2[1];
+
+  (0, _useDeepCompareEffect.default)(function () {
+    onChange({
+      fields: state.fields,
+      layout: state.layout
+    });
+  }, [state.fields, state.layout]);
+  var editField = (0, _react.useCallback)(function (field) {
+    setState(function (state) {
+      return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, state), {}, {
+        field: field
+      });
+    });
+  }, []);
+  var onDropTarget = {
+    dropTarget: parent ? parent.fieldId : null
+  };
+  var onFieldDrop = (0, _react.useCallback)(function (source, dropTarget) {
+    var pos = source.pos,
+        type = source.type,
+        fieldType = source.fieldType,
+        field = source.field,
+        _source$fields = source.fields,
+        fields = _source$fields === void 0 ? [] : _source$fields;
+    var parentId = parent ? parent.fieldId : null;
+
+    if (type === "row") {
+      if (parentId !== source.parent) {
+        // We're dragging an existing row from another fieldset
+        fields.forEach(function (field, index) {
+          insertField({
+            field: field,
+            position: {
+              row: dropTarget.row,
+              index: index === 0 ? null : index
+            }
+          });
+        });
+      } else if (pos && pos.row !== undefined) {
+        // We're dragging a row within the same fieldset
+        moveRow(pos.row, dropTarget.row);
+      }
+
+      return onDropTarget;
+    } // If source pos is set, we are moving an existing field.
+
+
+    if (pos) {
+      if (!field) {
+        return onDropTarget;
+      }
+
+      if (parentId !== source.parent) {
+        // We're dragging an existing field from another fieldset
+        insertField({
+          field: field,
+          position: dropTarget
+        });
+      } else {
+        // We're dragging a field within the same fieldset
+        moveField({
+          field: field,
+          position: dropTarget
+        });
+      }
+
+      return onDropTarget;
+    }
+
+    if (!fieldType) {
+      return null;
+    }
+
+    var plugin = getFieldPlugin(fieldType);
+
+    if (!plugin) {
+      return null;
+    }
+
+    var fieldData = plugin.field.createField();
+
+    if (plugin.field.canEditSettings !== false) {
+      editField(fieldData);
+      setState(function (state) {
+        return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, state), {}, {
+          dropTarget: dropTarget
+        });
+      });
+    } else {
+      insertField({
+        field: fieldData,
+        position: dropTarget
+      });
+    }
+
+    return null;
+  }, []);
+
+  var onEndDrag = function onEndDrag(_ref2, monitor) {
+    var type = _ref2.type,
+        field = _ref2.field,
+        fields = _ref2.fields;
+
+    if (!monitor.didDrop()) {
+      return;
+    } // Check if we dropped outside of the source fieldset, and if yes, remove the field from the original parent.
+
+
+    var _monitor$getDropResul = monitor.getDropResult(),
+        dropTarget = _monitor$getDropResul.dropTarget;
+
+    var parentId = parent ? parent.fieldId : null;
+
+    if (dropTarget === parentId) {
+      return;
+    }
+
+    var removeFields = type === "row" ? fields || [] : field ? [field] : [];
+    removeFields.forEach(function (field) {
+      return deleteField(field);
+    });
+  };
+
+  var getFieldsInLayout = function getFieldsInLayout() {
+    // Replace every field ID with actual field object.
+    return state.layout.filter(function (arr) {
+      return arr.length;
+    }).map(function (row) {
+      return row.map(function (id) {
+        return getField({
+          id: id
+        });
+      }).filter(Boolean);
+    }).filter(function (row) {
+      return row.length > 0;
+    });
+  };
+  /**
+   * Return field plugin.
+   */
+
+
+  var getFieldPlugin = function getFieldPlugin(type) {
+    return _plugins.plugins.byType("cms-editor-field-type").find(function (plugin) {
+      return plugin.field.type === type;
+    });
+  };
+
+  var getFieldRendererPlugin = function getFieldRendererPlugin(name) {
+    return _plugins.plugins.byType("cms-editor-field-renderer").find(function (plugin) {
+      return plugin.renderer.rendererName === name;
+    });
+  };
+  /**
+   * Checks if field of given type already exists in the list of fields.
+   */
+
+
+  var getField = function getField(query) {
+    return state.fields.find(function (field) {
+      for (var key in query) {
+        if (!(key in field)) {
+          return false;
+        } // TODO @ts-refactor figure if there is a way to fix this.
+        // @ts-ignore
+
+
+        if (field[key] !== query[key]) {
+          return false;
+        }
+      }
+
+      return true;
+    });
+  };
+  /**
+   * Inserts a new field into the target position.
+   */
+
+
+  var insertField = function insertField(_ref3) {
+    var field = _ref3.field,
+        position = _ref3.position;
+
+    if (!field.id) {
+      field.id = generateFieldId(layout.flat());
+    }
+
+    if (!field.type) {
+      throw new Error("Field \"type\" missing.");
+    }
+
+    var fieldPlugin = getFieldPlugin(field.type);
+
+    if (!fieldPlugin) {
+      throw new Error("No plugin found for field type \"".concat(field.type, "\"."));
+    }
+
+    setState(function (prev) {
+      var next = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, prev), {}, {
+        fields: (prev.fields || []).concat(field)
+      }); // Move field to position where it was dropped.
+
+      return utils.moveField({
+        field: field,
+        position: position,
+        data: next
+      });
+    });
+  };
+  /**
+   * Moves field to the given target position.
+   */
+
+
+  var moveField = function moveField(_ref4) {
+    var field = _ref4.field,
+        position = _ref4.position;
+    setState(function (data) {
+      return utils.moveField({
+        field: field,
+        position: position,
+        data: data
+      });
+    });
+  };
+  /**
+   * Moves row to a destination row.
+   */
+
+
+  var moveRow = function moveRow(source, destination) {
+    setState(function (data) {
+      return utils.moveRow({
+        data: data,
+        source: source,
+        destination: destination
+      });
+    });
+  };
+  /**
+   * Updates field.
+   */
+
+
+  var updateField = function updateField(field) {
+    setState(function (data) {
+      for (var i = 0; i < data.fields.length; i++) {
+        if (data.fields[i].id === field.id) {
+          return _dotPropImmutable.default.set(data, "fields.".concat(i), field);
+        }
+      }
+
+      return data;
+    });
+  };
+  /**
+   * Deletes a field (both from the list of field and the layout).
+   */
+
+
+  var deleteField = function deleteField(field) {
+    setState(function (data) {
+      return utils.deleteField({
+        field: field,
+        data: data
+      });
+    });
+  };
+
+  var noConflict = (0, _react.useCallback)(function (isVisible) {
+    return function (item) {
+      var sameParent = item.parent === onDropTarget.dropTarget;
+      var draggedFields = [];
+
+      switch (item.type) {
+        case "row":
+          (item.fields || []).forEach(function (field) {
+            return draggedFields.push(field.fieldId);
+          });
+          break;
+
+        case "field":
+          if (!item.field) {
+            break;
+          }
+
+          draggedFields.push(item.field.fieldId);
+          break;
+
+        default:
+          break;
+      }
+
+      if (draggedFields.length && !sameParent && fields.some(function (field) {
+        return draggedFields.includes(field.fieldId);
+      })) {
+        return false;
+      }
+
+      return typeof isVisible === "function" ? isVisible(item) : true;
+    };
+  }, [fields.map(function (f) {
+    return f.fieldId;
+  }).join(".")]);
+  var value = {
+    parent: parent,
+    depth: depth,
+    getFieldsInLayout: getFieldsInLayout,
+    getFieldPlugin: getFieldPlugin,
+    getFieldRendererPlugin: getFieldRendererPlugin,
+    getField: getField,
+    editField: editField,
+    field: state.field,
+    dropTarget: state.dropTarget,
+    onFieldDrop: onFieldDrop,
+    onEndDrag: onEndDrag,
+    insertField: insertField,
+    moveField: moveField,
+    moveRow: moveRow,
+    updateField: updateField,
+    deleteField: deleteField,
+    fields: getFieldsInLayout(),
+    noConflict: noConflict,
+    layout: state.layout
+  };
+  return /*#__PURE__*/_react.default.createElement(FieldEditorContext.Provider, {
+    value: value
+  }, children);
+};
+
+exports.FieldEditorProvider = FieldEditorProvider;

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

@@ -0,0 +1 @@
+{"version":3,"names":["FieldEditorContext","React","createContext","undefined","maxGenerateIdIterations","generateFieldId","layout","id","generateAlphaNumericLowerCaseId","iteration","includes","Error","FieldEditorProvider","parent","fields","onChange","children","depth","editor","useModelFieldEditor","useState","field","dropTarget","row","index","state","setState","useDeepCompareEffect","editField","useCallback","onDropTarget","fieldId","onFieldDrop","source","pos","type","fieldType","parentId","forEach","insertField","position","moveRow","moveField","plugin","getFieldPlugin","fieldData","createField","canEditSettings","onEndDrag","monitor","didDrop","getDropResult","removeFields","deleteField","getFieldsInLayout","filter","arr","length","map","getField","Boolean","plugins","byType","find","getFieldRendererPlugin","name","renderer","rendererName","query","key","flat","fieldPlugin","prev","next","concat","utils","data","destination","updateField","i","dot","set","noConflict","isVisible","item","sameParent","draggedFields","push","some","f","join","value"],"sources":["FieldEditorContext.tsx"],"sourcesContent":["import React, { useCallback, useState } from \"react\";\nimport dot from \"dot-prop-immutable\";\nimport useDeepCompareEffect from \"use-deep-compare-effect\";\nimport {\n    CmsModelField,\n    CmsEditorFieldId,\n    CmsEditorFieldRendererPlugin,\n    CmsEditorFieldsLayout,\n    CmsEditorFieldTypePlugin,\n    FieldLayoutPosition\n} from \"~/types\";\nimport { plugins } from \"@webiny/plugins\";\nimport * as utils from \"./utils\";\nimport { FieldEditorProps } from \"./FieldEditor\";\nimport { DragObjectWithType, DragSourceMonitor } from \"react-dnd\";\nimport { useModelFieldEditor } from \"~/admin/components/FieldEditor/useModelFieldEditor\";\nimport { generateAlphaNumericLowerCaseId } from \"@webiny/utils\";\n\ninterface DropTarget {\n    row: number;\n    index: number | null;\n}\n\ninterface Position {\n    row: number;\n    index: number;\n}\n\nexport interface DragSource extends DragObjectWithType {\n    parent?: string;\n    pos?: Partial<Position>;\n    type: \"row\" | \"field\" | \"newField\";\n    fieldType?: string;\n    field?: CmsModelField | null;\n    fields?: CmsModelField[];\n}\n\n/**\n * Property in GetFieldParams can be any key from CmsEditorField, but TS does not allow union types\n */\ninterface GetFieldParams {\n    id?: string;\n    fieldId?: string;\n}\ninterface InsertFieldParams {\n    field: CmsModelField;\n    position: FieldLayoutPosition;\n}\ninterface MoveFieldParams {\n    field: CmsEditorFieldId | CmsModelField;\n    position: FieldLayoutPosition;\n}\ninterface GetFieldsInLayoutCallable {\n    (): CmsModelField[][];\n}\ninterface GetFieldPluginCallable {\n    (type: string): CmsEditorFieldTypePlugin | undefined;\n}\ninterface GetFieldCallable {\n    (query: GetFieldParams): CmsModelField | undefined;\n}\ninterface GetFieldRendererCallable {\n    (rendererName: string): CmsEditorFieldRendererPlugin | undefined;\n}\ninterface OnFieldDropCallable {\n    (source: Partial<DragSource>, target: DropTarget): void;\n}\ninterface InsertFieldCallable {\n    (params: InsertFieldParams): void;\n}\ninterface MoveFieldCallable {\n    (params: MoveFieldParams): void;\n}\ninterface OnEndDragCallable {\n    (item: DragSource, monitor: DragSourceMonitor): void;\n}\ninterface MoveRowCallable {\n    (source: number, destination: number): void;\n}\ninterface UpdateFieldCallable {\n    (field: CmsModelField): void;\n}\ninterface DeleteFieldCallable {\n    (field: Pick<CmsModelField, \"id\">): void;\n}\nexport interface IsVisibleCallable {\n    (item: DragSource): boolean;\n}\ninterface NoConflictCallable {\n    (cb?: IsVisibleCallable): (item: DragSource) => boolean;\n}\nexport interface FieldEditorContext {\n    fields: CmsModelField[][];\n    noConflict: NoConflictCallable;\n    layout: CmsEditorFieldsLayout;\n    onChange?: (data: any) => void;\n    getFieldsInLayout: GetFieldsInLayoutCallable;\n    getFieldPlugin: GetFieldPluginCallable;\n    getField: GetFieldCallable;\n    getFieldRendererPlugin: GetFieldRendererCallable;\n    editField: (field: CmsModelField | null) => void;\n    field: CmsModelField | null;\n    parent?: CmsModelField;\n    depth: number;\n    dropTarget: DropTarget;\n    onFieldDrop: OnFieldDropCallable;\n    onEndDrag: OnEndDragCallable;\n    insertField: InsertFieldCallable;\n    moveField: MoveFieldCallable;\n    moveRow: MoveRowCallable;\n    updateField: UpdateFieldCallable;\n    deleteField: DeleteFieldCallable;\n}\n\ninterface FieldEditorProviderProps extends FieldEditorProps {\n    children: React.ReactElement;\n}\n\nexport const FieldEditorContext = React.createContext<FieldEditorContext | undefined>(undefined);\n/**\n * We try to generate the random id string but with the check that it does not exist already.\n * Chances that the same string exists are quite small, but let's check it anyway.\n *\n * In most cases, there will be no iterations anyway...\n */\nconst maxGenerateIdIterations = 100;\nconst generateFieldId = (layout: string[]): string => {\n    let id = generateAlphaNumericLowerCaseId(8);\n\n    let iteration = 0;\n    while (layout.includes(id) && iteration < maxGenerateIdIterations) {\n        id = generateAlphaNumericLowerCaseId(8);\n        iteration++;\n    }\n    if (iteration >= maxGenerateIdIterations) {\n        throw new Error(`Could not generate field ID in ${maxGenerateIdIterations} iterations.`);\n    }\n    return id;\n};\n\ninterface State {\n    layout: CmsEditorFieldsLayout;\n    fields: CmsModelField[];\n    field: CmsModelField | null;\n    dropTarget: DropTarget;\n}\nexport const FieldEditorProvider: React.FC<FieldEditorProviderProps> = ({\n    parent,\n    fields,\n    layout,\n    onChange,\n    children\n}) => {\n    // We need to determine depth of this provider so we can render drop zones with correct z-indexes.\n    let depth = 0;\n    try {\n        const editor = useModelFieldEditor();\n        depth = editor.depth + 1;\n    } catch {\n        // There's no parent provider, so this is the top-level one.\n    }\n\n    const [state, setState] = useState<State>({\n        layout,\n        fields,\n        field: null,\n        dropTarget: {\n            row: -1,\n            index: null\n        }\n    });\n\n    useDeepCompareEffect(() => {\n        onChange({ fields: state.fields, layout: state.layout });\n    }, [state.fields, state.layout]);\n\n    const editField = useCallback((field: CmsModelField | null) => {\n        setState(state => ({ ...state, field }));\n    }, []);\n\n    const onDropTarget = {\n        dropTarget: parent ? parent.fieldId : null\n    };\n\n    const onFieldDrop = useCallback<OnFieldDropCallable>((source, dropTarget) => {\n        const { pos, type, fieldType, field, fields = [] } = source;\n\n        const parentId = parent ? parent.fieldId : null;\n\n        if (type === \"row\") {\n            if (parentId !== source.parent) {\n                // We're dragging an existing row from another fieldset\n                fields.forEach((field, index) => {\n                    insertField({\n                        field,\n                        position: {\n                            row: dropTarget.row,\n                            index: index === 0 ? null : index\n                        }\n                    });\n                });\n            } else if (pos && pos.row !== undefined) {\n                // We're dragging a row within the same fieldset\n                moveRow(pos.row, dropTarget.row);\n            }\n\n            return onDropTarget;\n        }\n\n        // If source pos is set, we are moving an existing field.\n        if (pos) {\n            if (!field) {\n                return onDropTarget;\n            }\n            if (parentId !== source.parent) {\n                // We're dragging an existing field from another fieldset\n                insertField({ field, position: dropTarget });\n            } else {\n                // We're dragging a field within the same fieldset\n                moveField({ field, position: dropTarget });\n            }\n            return onDropTarget;\n        }\n\n        if (!fieldType) {\n            return null;\n        }\n        const plugin = getFieldPlugin(fieldType);\n        if (!plugin) {\n            return null;\n        }\n\n        const fieldData = plugin.field.createField() as CmsModelField;\n\n        if (plugin.field.canEditSettings !== false) {\n            editField(fieldData);\n            setState(state => ({\n                ...state,\n                dropTarget\n            }));\n        } else {\n            insertField({ field: fieldData, position: dropTarget });\n        }\n        return null;\n    }, []);\n\n    const onEndDrag: OnEndDragCallable = ({ type, field, fields }, monitor) => {\n        if (!monitor.didDrop()) {\n            return;\n        }\n\n        // Check if we dropped outside of the source fieldset, and if yes, remove the field from the original parent.\n        const { dropTarget } = monitor.getDropResult();\n        const parentId = parent ? parent.fieldId : null;\n        if (dropTarget === parentId) {\n            return;\n        }\n\n        const removeFields = type === \"row\" ? fields || [] : field ? [field] : [];\n        removeFields.forEach(field => deleteField(field));\n    };\n\n    const getFieldsInLayout: GetFieldsInLayoutCallable = () => {\n        // Replace every field ID with actual field object.\n        return state.layout\n            .filter(arr => arr.length)\n            .map(row => {\n                return row\n                    .map(id => {\n                        return getField({ id });\n                    })\n                    .filter(Boolean);\n            })\n            .filter(row => {\n                return row.length > 0;\n            }) as CmsModelField[][];\n    };\n\n    /**\n     * Return field plugin.\n     */\n    const getFieldPlugin: GetFieldPluginCallable = type => {\n        return plugins\n            .byType<CmsEditorFieldTypePlugin>(\"cms-editor-field-type\")\n            .find(plugin => plugin.field.type === type);\n    };\n\n    const getFieldRendererPlugin: GetFieldRendererCallable = name => {\n        return plugins\n            .byType<CmsEditorFieldRendererPlugin>(\"cms-editor-field-renderer\")\n            .find(plugin => plugin.renderer.rendererName === name);\n    };\n\n    /**\n     * Checks if field of given type already exists in the list of fields.\n     */\n    const getField: GetFieldCallable = query => {\n        return state.fields.find(field => {\n            for (const key in query) {\n                if (!(key in field)) {\n                    return false;\n                }\n                // TODO @ts-refactor figure if there is a way to fix this.\n                // @ts-ignore\n                if (field[key] !== query[key]) {\n                    return false;\n                }\n            }\n\n            return true;\n        });\n    };\n\n    /**\n     * Inserts a new field into the target position.\n     */\n    const insertField: InsertFieldCallable = ({ field, position }) => {\n        if (!field.id) {\n            field.id = generateFieldId(layout.flat());\n        }\n\n        if (!field.type) {\n            throw new Error(`Field \"type\" missing.`);\n        }\n\n        const fieldPlugin = getFieldPlugin(field.type);\n        if (!fieldPlugin) {\n            throw new Error(`No plugin found for field type \"${field.type}\".`);\n        }\n\n        setState(prev => {\n            const next: State = {\n                ...prev,\n                fields: (prev.fields || []).concat(field)\n            };\n\n            // Move field to position where it was dropped.\n            return utils.moveField({ field, position, data: next });\n        });\n    };\n\n    /**\n     * Moves field to the given target position.\n     */\n    const moveField: MoveFieldCallable = ({ field, position }) => {\n        setState(data => {\n            return utils.moveField<State>({ field, position, data });\n        });\n    };\n\n    /**\n     * Moves row to a destination row.\n     */\n    const moveRow: MoveRowCallable = (source, destination) => {\n        setState(data => {\n            return utils.moveRow({ data, source, destination });\n        });\n    };\n\n    /**\n     * Updates field.\n     */\n    const updateField: UpdateFieldCallable = field => {\n        setState(data => {\n            for (let i = 0; i < data.fields.length; i++) {\n                if (data.fields[i].id === field.id) {\n                    return dot.set(data, `fields.${i}`, field);\n                }\n            }\n            return data;\n        });\n    };\n\n    /**\n     * Deletes a field (both from the list of field and the layout).\n     */\n    const deleteField: DeleteFieldCallable = field => {\n        setState(data => {\n            return utils.deleteField({ field, data });\n        });\n    };\n\n    const noConflict: NoConflictCallable = useCallback(\n        (isVisible?: IsVisibleCallable) => item => {\n            const sameParent = item.parent === onDropTarget.dropTarget;\n            const draggedFields: string[] = [];\n            switch (item.type) {\n                case \"row\":\n                    (item.fields || []).forEach(field => draggedFields.push(field.fieldId));\n                    break;\n                case \"field\":\n                    if (!item.field) {\n                        break;\n                    }\n                    draggedFields.push(item.field.fieldId);\n                    break;\n                default:\n                    break;\n            }\n\n            if (\n                draggedFields.length &&\n                !sameParent &&\n                fields.some(field => draggedFields.includes(field.fieldId))\n            ) {\n                return false;\n            }\n\n            return typeof isVisible === \"function\" ? isVisible(item) : true;\n        },\n        [fields.map(f => f.fieldId).join(\".\")]\n    );\n\n    const value: FieldEditorContext = {\n        parent,\n        depth,\n        getFieldsInLayout,\n        getFieldPlugin,\n        getFieldRendererPlugin,\n        getField,\n        editField,\n        field: state.field,\n        dropTarget: state.dropTarget,\n        onFieldDrop,\n        onEndDrag,\n        insertField,\n        moveField,\n        moveRow,\n        updateField,\n        deleteField,\n        fields: getFieldsInLayout(),\n        noConflict,\n        layout: state.layout\n    };\n\n    return <FieldEditorContext.Provider value={value}>{children}</FieldEditorContext.Provider>;\n};\n"],"mappings":"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"}

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

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+/// <reference types="web" />
+/// <reference types="react" />
+export declare const RowContainer: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
+export declare const Row: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
+export declare const fieldContainer: string;
+export declare const rowHandle: string;
+export declare const fieldHandle: string;

package/admin/components/FieldEditor/Styled.js

@@ -0,0 +1,61 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.rowHandle = exports.fieldHandle = exports.fieldContainer = exports.RowContainer = exports.Row = void 0;
+
+var _emotion = require("emotion");
+
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+
+var RowContainer = /*#__PURE__*/(0, _styled.default)("div", {
+  label: "RowContainer",
+  target: "e1pk1rsi0"
+})("position:relative;display:flex;flex-direction:column;margin-bottom:20px;border-radius:2px;background-color:var(--mdc-theme-surface);border:1px solid var(--mdc-theme-on-background);box-shadow:var(--mdc-theme-on-background) 1px 1px 1px,var(--mdc-theme-on-background) 1px 1px 2px;:last-child{margin-bottom:5px;}");
+exports.RowContainer = RowContainer;
+var Row = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "e1pk1rsi1",
+  label: "Row"
+})({
+  display: "flex",
+  flexDirection: "row",
+  backgroundColor: "var(--mdc-theme-surface)",
+  paddingLeft: 40,
+  paddingRight: 10,
+  position: "relative"
+});
+exports.Row = Row;
+var fieldContainer = /*#__PURE__*/(0, _emotion.css)({
+  position: "relative",
+  flex: "1 100%",
+  backgroundColor: "var(--mdc-theme-background)",
+  padding: "0 15px 5px",
+  margin: 10,
+  borderRadius: 2,
+  border: "1px solid var(--mdc-theme-on-background)",
+  transition: "box-shadow 225ms",
+  color: "var(--mdc-theme-on-surface)",
+  cursor: "grab",
+  "&:hover": {
+    boxShadow: "var(--mdc-theme-on-background) 1px 1px 1px, var(--mdc-theme-on-background) 1px 1px 2px"
+  }
+}, "label:fieldContainer;");
+exports.fieldContainer = fieldContainer;
+var rowHandle = /*#__PURE__*/(0, _emotion.css)({
+  width: 30,
+  cursor: "grab",
+  position: "absolute",
+  left: 10,
+  top: "50%",
+  transform: "translateY(-50%)",
+  zIndex: 1,
+  color: "var(--mdc-theme-on-surface)"
+}, "label:rowHandle;");
+exports.rowHandle = rowHandle;
+var fieldHandle = /*#__PURE__*/(0, _emotion.css)({
+  cursor: "grab"
+}, "label:fieldHandle;");
+exports.fieldHandle = fieldHandle;

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

@@ -0,0 +1 @@
+{"version":3,"names":["RowContainer","styled","Row","display","flexDirection","backgroundColor","paddingLeft","paddingRight","position","fieldContainer","css","flex","padding","margin","borderRadius","border","transition","color","cursor","boxShadow","rowHandle","width","left","top","transform","zIndex","fieldHandle"],"sources":["Styled.ts"],"sourcesContent":["import { css } from \"emotion\";\nimport styled from \"@emotion/styled\";\n\nexport const RowContainer = styled.div`\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    margin-bottom: 20px;\n    border-radius: 2px;\n    background-color: var(--mdc-theme-surface);\n    border: 1px solid var(--mdc-theme-on-background);\n    box-shadow: var(--mdc-theme-on-background) 1px 1px 1px,\n        var(--mdc-theme-on-background) 1px 1px 2px;\n    :last-child {\n        margin-bottom: 5px;\n    }\n`;\n\nexport const Row = styled(\"div\")({\n    display: \"flex\",\n    flexDirection: \"row\",\n    backgroundColor: \"var(--mdc-theme-surface)\",\n    paddingLeft: 40,\n    paddingRight: 10,\n    position: \"relative\"\n});\n\nexport const fieldContainer = css({\n    position: \"relative\",\n    flex: \"1 100%\",\n    backgroundColor: \"var(--mdc-theme-background)\",\n    padding: \"0 15px 5px\",\n    margin: 10,\n    borderRadius: 2,\n    border: \"1px solid var(--mdc-theme-on-background)\",\n    transition: \"box-shadow 225ms\",\n    color: \"var(--mdc-theme-on-surface)\",\n    cursor: \"grab\",\n    \"&:hover\": {\n        boxShadow:\n            \"var(--mdc-theme-on-background) 1px 1px 1px, var(--mdc-theme-on-background) 1px 1px 2px\"\n    }\n});\n\nexport const rowHandle = css({\n    width: 30,\n    cursor: \"grab\",\n    position: \"absolute\",\n    left: 10,\n    top: \"50%\",\n    transform: \"translateY(-50%)\",\n    zIndex: 1,\n    color: \"var(--mdc-theme-on-surface)\"\n});\n\nexport const fieldHandle = css({\n    cursor: \"grab\"\n});\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AAEO,IAAMA,YAAY,oBAAGC,eAAH;EAAA;EAAA;AAAA,0TAAlB;;AAeA,IAAMC,GAAG,oBAAGD,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EAC7BE,OAAO,EAAE,MADoB;EAE7BC,aAAa,EAAE,KAFc;EAG7BC,eAAe,EAAE,0BAHY;EAI7BC,WAAW,EAAE,EAJgB;EAK7BC,YAAY,EAAE,EALe;EAM7BC,QAAQ,EAAE;AANmB,CAAjB,CAAT;;AASA,IAAMC,cAAc,gBAAG,IAAAC,YAAA,EAAI;EAC9BF,QAAQ,EAAE,UADoB;EAE9BG,IAAI,EAAE,QAFwB;EAG9BN,eAAe,EAAE,6BAHa;EAI9BO,OAAO,EAAE,YAJqB;EAK9BC,MAAM,EAAE,EALsB;EAM9BC,YAAY,EAAE,CANgB;EAO9BC,MAAM,EAAE,0CAPsB;EAQ9BC,UAAU,EAAE,kBARkB;EAS9BC,KAAK,EAAE,6BATuB;EAU9BC,MAAM,EAAE,MAVsB;EAW9B,WAAW;IACPC,SAAS,EACL;EAFG;AAXmB,CAAJ,0BAAvB;;AAiBA,IAAMC,SAAS,gBAAG,IAAAV,YAAA,EAAI;EACzBW,KAAK,EAAE,EADkB;EAEzBH,MAAM,EAAE,MAFiB;EAGzBV,QAAQ,EAAE,UAHe;EAIzBc,IAAI,EAAE,EAJmB;EAKzBC,GAAG,EAAE,KALoB;EAMzBC,SAAS,EAAE,kBANc;EAOzBC,MAAM,EAAE,CAPiB;EAQzBR,KAAK,EAAE;AARkB,CAAJ,qBAAlB;;AAWA,IAAMS,WAAW,gBAAG,IAAAhB,YAAA,EAAI;EAC3BQ,MAAM,EAAE;AADmB,CAAJ,uBAApB"}

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

@@ -0,0 +1,2 @@
+export { FieldEditor } from "./FieldEditor";
+export { useModelFieldEditor } from "./useModelFieldEditor";

package/admin/components/FieldEditor/index.js

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "FieldEditor", {
+  enumerable: true,
+  get: function get() {
+    return _FieldEditor.FieldEditor;
+  }
+});
+Object.defineProperty(exports, "useModelFieldEditor", {
+  enumerable: true,
+  get: function get() {
+    return _useModelFieldEditor.useModelFieldEditor;
+  }
+});
+
+var _FieldEditor = require("./FieldEditor");
+
+var _useModelFieldEditor = require("./useModelFieldEditor");

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

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { FieldEditor } from \"./FieldEditor\";\nexport { useModelFieldEditor } from \"./useModelFieldEditor\";\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;AACA"}

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

@@ -0,0 +1,2 @@
+import { FieldEditorContext } from "./FieldEditorContext";
+export declare function useModelFieldEditor(): FieldEditorContext;

package/admin/components/FieldEditor/useModelFieldEditor.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useModelFieldEditor = useModelFieldEditor;
+
+var _react = require("react");
+
+var _FieldEditorContext = require("./FieldEditorContext");
+
+function useModelFieldEditor() {
+  var context = (0, _react.useContext)(_FieldEditorContext.FieldEditorContext);
+
+  if (!context) {
+    throw Error("FieldEditorContext is missing in the component tree. Are you useing the \"useFieldEditor()\" hook in the right place?");
+  }
+
+  return context;
+}

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

@@ -0,0 +1 @@
+{"version":3,"names":["useModelFieldEditor","context","useContext","FieldEditorContext","Error"],"sources":["useModelFieldEditor.ts"],"sourcesContent":["import { useContext } from \"react\";\nimport { FieldEditorContext } from \"./FieldEditorContext\";\n\nexport function useModelFieldEditor() {\n    const context = useContext(FieldEditorContext);\n    if (!context) {\n        throw Error(\n            `FieldEditorContext is missing in the component tree. Are you useing the \"useFieldEditor()\" hook in the right place?`\n        );\n    }\n\n    return context;\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEO,SAASA,mBAAT,GAA+B;EAClC,IAAMC,OAAO,GAAG,IAAAC,iBAAA,EAAWC,sCAAX,CAAhB;;EACA,IAAI,CAACF,OAAL,EAAc;IACV,MAAMG,KAAK,yHAAX;EAGH;;EAED,OAAOH,OAAP;AACH"}

package/admin/components/FieldEditor/utils/deleteField.d.ts

@@ -0,0 +1,8 @@
+import { CmsModelField, CmsModel } from "../../../../types";
+declare type DeleteFieldParamsData = Pick<CmsModel, "fields" | "layout">;
+interface DeleteFieldParams {
+    field: Pick<CmsModelField, "id">;
+    data: DeleteFieldParamsData;
+}
+declare const _default: (params: DeleteFieldParams) => any;
+export default _default;

package/admin/components/FieldEditor/utils/deleteField.js

@@ -0,0 +1,52 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _dotPropImmutable = _interopRequireDefault(require("dot-prop-immutable"));
+
+var _default = function _default(params) {
+  var field = params.field,
+      prev = params.data; // Remove the field from fields list...
+
+  var fieldIndex = prev.fields.findIndex(function (item) {
+    return item.id === field.id;
+  });
+
+  var data = _dotPropImmutable.default.delete(prev, "fields.".concat(fieldIndex)); // ...and rebuild the layout object.
+
+
+  return _dotPropImmutable.default.set(data, "layout", function (layout) {
+    if (!layout) {
+      return [];
+    }
+
+    var newLayout = [];
+    var currentRowIndex = 0;
+    layout.forEach(function (row) {
+      row.forEach(function (fieldId) {
+        var field = data.fields.find(function (item) {
+          return item.id === fieldId;
+        });
+
+        if (!field) {
+          return;
+        }
+
+        if (!Array.isArray(newLayout[currentRowIndex])) {
+          newLayout[currentRowIndex] = [];
+        }
+
+        newLayout[currentRowIndex].push(fieldId);
+      });
+      newLayout[currentRowIndex] && newLayout[currentRowIndex].length && currentRowIndex++;
+    });
+    return newLayout;
+  });
+};
+
+exports.default = _default;