@webiny/app-headless-cms 0.0.0-mt-2 → 0.0.0-unstable.13771d80a8

package/admin/components/FieldEditor/FieldEditorContext.js

@@ -1,48 +1,76 @@
-import _objectSpread from "@babel/runtime/helpers/objectSpread2";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import React, { useCallback, useState } from "react";
-import dot from "dot-prop-immutable";
-import shortid from "shortid";
-import cloneDeep from "lodash/cloneDeep";
-import useDeepCompareEffect from "use-deep-compare-effect";
-import { plugins } from "@webiny/plugins";
-import * as utils from "./utils";
-import { useFieldEditor } from "./useFieldEditor";
-export var FieldEditorContext = /*#__PURE__*/React.createContext(null);
-export var FieldEditorProvider = function FieldEditorProvider(_ref) {
+"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;
+    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 = useFieldEditor();
+    var editor = (0, _useModelFieldEditor.useModelFieldEditor)();
     depth = editor.depth + 1;
-  } catch (_unused) {// There's no parent provider, so this is the top-level one.
+  } catch (_unused) {
+    // There's no parent provider, so this is the top-level one.
   }
-
-  var _useState = useState({
-    layout: layout,
-    fields: fields,
-    field: null,
-    dropTarget: null
-  }),
-      _useState2 = _slicedToArray(_useState, 2),
-      state = _useState2[0],
-      setState = _useState2[1];
-
-  useDeepCompareEffect(function () {
+  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 = useCallback(function (field) {
+  var editField = (0, _react.useCallback)(function (field) {
     setState(function (state) {
-      return _objectSpread(_objectSpread({}, state), {}, {
+      return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, state), {}, {
         field: field
       });
     });
@@ -50,14 +78,14 @@ export var FieldEditorProvider = function FieldEditorProvider(_ref) {
   var onDropTarget = {
     dropTarget: parent ? parent.fieldId : null
   };
-  var onFieldDrop = useCallback(function (source, dropTarget) {
+  var onFieldDrop = (0, _react.useCallback)(function (source, dropTarget) {
     var pos = source.pos,
-        type = source.type,
-        fieldType = source.fieldType,
-        field = source.field,
-        fields = source.fields;
+      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
@@ -70,16 +98,18 @@ export var FieldEditorProvider = function FieldEditorProvider(_ref) {
             }
           });
         });
-      } else {
+      } 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 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({
@@ -93,136 +123,135 @@ export var FieldEditorProvider = function FieldEditorProvider(_ref) {
           position: dropTarget
         });
       }
-
       return onDropTarget;
     }
-
+    if (!fieldType) {
+      return null;
+    }
     var plugin = getFieldPlugin(fieldType);
-    editField(plugin.field.createField());
-    setState(function (state) {
-      return _objectSpread(_objectSpread({}, state), {}, {
-        dropTarget: dropTarget
+    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;
-
+      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.
-
+    }
 
+    // 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;
-
+      dropTarget = _monitor$getDropResul.dropTarget;
     var parentId = parent ? parent.fieldId : null;
-
     if (dropTarget === parentId) {
       return;
     }
-
-    var removeFields = type === "row" ? fields : [field];
+    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.
-    var fields = cloneDeep(state.layout.filter(function (arr) {
+    return state.layout.filter(function (arr) {
       return arr.length;
-    }));
-    fields.forEach(function (row, rowIndex) {
-      row.forEach(function (fieldId, fieldIndex) {
-        fields[rowIndex][fieldIndex] = getField({
-          id: fieldId
+    }).map(function (row) {
+      return row.map(function (id) {
+        return getField({
+          id: id
         });
-      });
+      }).filter(Boolean);
+    }).filter(function (row) {
+      return row.length > 0;
     });
-    return fields;
   };
+
   /**
    * Return field plugin.
    */
-
-
   var getFieldPlugin = function getFieldPlugin(type) {
-    return plugins.byType("cms-editor-field-type").find(function (_ref3) {
-      var field = _ref3.field;
-      return field.type === 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 null;
+          return false;
         }
-
+        // TODO @ts-refactor figure if there is a way to fix this.
+        // @ts-ignore
         if (field[key] !== query[key]) {
-          return null;
+          return false;
         }
       }
-
       return true;
     });
   };
+
   /**
    * Inserts a new field into the target position.
    */
-
-
-  var insertField = function insertField(_ref4) {
-    var field = _ref4.field,
-        position = _ref4.position;
-
+  var insertField = function insertField(_ref3) {
+    var field = _ref3.field,
+      position = _ref3.position;
     if (!field.id) {
-      field.id = shortid.generate();
+      field.id = generateFieldId(layout.flat());
     }
-
     if (!field.type) {
       throw new Error("Field \"type\" missing.");
     }
-
     var fieldPlugin = getFieldPlugin(field.type);
-
     if (!fieldPlugin) {
-      throw new Error("Invalid field \"type\".");
+      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)
+      });
 
-    setState(function (data) {
-      data = dot.set(data, "fields", function (fields) {
-        if (Array.isArray(fields)) {
-          return fields.concat(field);
-        }
-
-        return [field];
-      }); // Move field to position where it was dropped.
-
+      // Move field to position where it was dropped.
       return utils.moveField({
         field: field,
         position: position,
-        data: data
+        data: next
       });
     });
   };
+
   /**
    * Moves field to the given target position.
    */
-
-
-  var moveField = function moveField(_ref5) {
-    var field = _ref5.field,
-        position = _ref5.position;
+  var moveField = function moveField(_ref4) {
+    var field = _ref4.field,
+      position = _ref4.position;
     setState(function (data) {
       return utils.moveField({
         field: field,
@@ -231,11 +260,10 @@ export var FieldEditorProvider = function FieldEditorProvider(_ref) {
       });
     });
   };
+
   /**
    * Moves row to a destination row.
    */
-
-
   var moveRow = function moveRow(source, destination) {
     setState(function (data) {
       return utils.moveRow({
@@ -245,25 +273,24 @@ export var FieldEditorProvider = function FieldEditorProvider(_ref) {
       });
     });
   };
+
   /**
    * 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 dot.set(data, "fields.".concat(i), field);
+          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({
@@ -272,33 +299,30 @@ export var FieldEditorProvider = function FieldEditorProvider(_ref) {
       });
     });
   };
-
-  var noConflict = useCallback(function (isVisible) {
+  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) {
+          (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) {
@@ -309,6 +333,7 @@ export var FieldEditorProvider = function FieldEditorProvider(_ref) {
     depth: depth,
     getFieldsInLayout: getFieldsInLayout,
     getFieldPlugin: getFieldPlugin,
+    getFieldRendererPlugin: getFieldRendererPlugin,
     getField: getField,
     editField: editField,
     field: state.field,
@@ -324,7 +349,8 @@ export var FieldEditorProvider = function FieldEditorProvider(_ref) {
     noConflict: noConflict,
     layout: state.layout
   };
-  return /*#__PURE__*/React.createElement(FieldEditorContext.Provider, {
+  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

@@ -1,6 +1,14 @@
 /// <reference types="react" />
-export declare const RowContainer: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "hidden" | "dir" | "slot" | "style" | "title" | "color" | "translate" | "children" | "defaultValue" | "id" | "onError" | "className" | "onBlur" | "onClick" | "onContextMenu" | "onCopy" | "onCut" | "onAuxClick" | "onDoubleClick" | "onDragEnd" | "onDragStart" | "onDrop" | "onFocus" | "onInput" | "onInvalid" | "onKeyDown" | "onKeyPress" | "onKeyUp" | "onMouseDown" | "onMouseUp" | "onPaste" | "onPause" | "onPlay" | "onPointerCancel" | "onPointerDown" | "onPointerUp" | "onRateChange" | "onReset" | "onSeeked" | "onSubmit" | "onTouchCancel" | "onTouchEnd" | "onTouchStart" | "onVolumeChange" | "onAbort" | "onAnimationEnd" | "onAnimationIteration" | "onAnimationStart" | "onCanPlay" | "onCanPlayThrough" | "onDrag" | "onDragEnter" | "onDragExit" | "onDragLeave" | "onDragOver" | "onDurationChange" | "onEmptied" | "onEncrypted" | "onEnded" | "onGotPointerCapture" | "onLoad" | "onLoadedData" | "onLoadedMetadata" | "onLoadStart" | "onLostPointerCapture" | "onMouseMove" | "onMouseOut" | "onMouseOver" | "onPlaying" | "onPointerMove" | "onPointerOut" | "onPointerOver" | "onProgress" | "onScroll" | "onSeeking" | "onStalled" | "onSuspend" | "onTimeUpdate" | "onTouchMove" | "onTransitionEnd" | "onWaiting" | "onWheel" | "onMouseEnter" | "onMouseLeave" | "onPointerEnter" | "onPointerLeave" | "onChange" | "onSelect" | "onBeforeInput" | "onCompositionEnd" | "onCompositionStart" | "onCompositionUpdate" | "placeholder" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "lang" | "spellCheck" | "tabIndex" | "inputMode" | "is" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopyCapture" | "onCutCapture" | "onPasteCapture" | "onCompositionEndCapture" | "onCompositionStartCapture" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInputCapture" | "onInputCapture" | "onResetCapture" | "onSubmitCapture" | "onInvalidCapture" | "onLoadCapture" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbortCapture" | "onCanPlayCapture" | "onCanPlayThroughCapture" | "onDurationChangeCapture" | "onEmptiedCapture" | "onEncryptedCapture" | "onEndedCapture" | "onLoadedDataCapture" | "onLoadedMetadataCapture" | "onLoadStartCapture" | "onPauseCapture" | "onPlayCapture" | "onPlayingCapture" | "onProgressCapture" | "onRateChangeCapture" | "onSeekedCapture" | "onSeekingCapture" | "onStalledCapture" | "onSuspendCapture" | "onTimeUpdateCapture" | "onVolumeChangeCapture" | "onWaitingCapture" | "onAuxClickCapture" | "onClickCapture" | "onContextMenuCapture" | "onDoubleClickCapture" | "onDragCapture" | "onDragEndCapture" | "onDragEnterCapture" | "onDragExitCapture" | "onDragLeaveCapture" | "onDragOverCapture" | "onDragStartCapture" | "onDropCapture" | "onMouseDownCapture" | "onMouseMoveCapture" | "onMouseOutCapture" | "onMouseOverCapture" | "onMouseUpCapture" | "onSelectCapture" | "onTouchCancelCapture" | "onTouchEndCapture" | "onTouchMoveCapture" | "onTouchStartCapture" | "onPointerDownCapture" | "onPointerMoveCapture" | "onPointerUpCapture" | "onPointerCancelCapture" | "onPointerEnterCapture" | "onPointerLeaveCapture" | "onPointerOverCapture" | "onPointerOutCapture" | "onGotPointerCaptureCapture" | "onLostPointerCaptureCapture" | "onScrollCapture" | "onWheelCapture" | "onAnimationStartCapture" | "onAnimationEndCapture" | "onAnimationIterationCapture" | "onTransitionEndCapture">, object>;
-export declare const Row: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "hidden" | "dir" | "slot" | "style" | "title" | "color" | "translate" | "children" | "defaultValue" | "id" | "onError" | "className" | "onBlur" | "onClick" | "onContextMenu" | "onCopy" | "onCut" | "onAuxClick" | "onDoubleClick" | "onDragEnd" | "onDragStart" | "onDrop" | "onFocus" | "onInput" | "onInvalid" | "onKeyDown" | "onKeyPress" | "onKeyUp" | "onMouseDown" | "onMouseUp" | "onPaste" | "onPause" | "onPlay" | "onPointerCancel" | "onPointerDown" | "onPointerUp" | "onRateChange" | "onReset" | "onSeeked" | "onSubmit" | "onTouchCancel" | "onTouchEnd" | "onTouchStart" | "onVolumeChange" | "onAbort" | "onAnimationEnd" | "onAnimationIteration" | "onAnimationStart" | "onCanPlay" | "onCanPlayThrough" | "onDrag" | "onDragEnter" | "onDragExit" | "onDragLeave" | "onDragOver" | "onDurationChange" | "onEmptied" | "onEncrypted" | "onEnded" | "onGotPointerCapture" | "onLoad" | "onLoadedData" | "onLoadedMetadata" | "onLoadStart" | "onLostPointerCapture" | "onMouseMove" | "onMouseOut" | "onMouseOver" | "onPlaying" | "onPointerMove" | "onPointerOut" | "onPointerOver" | "onProgress" | "onScroll" | "onSeeking" | "onStalled" | "onSuspend" | "onTimeUpdate" | "onTouchMove" | "onTransitionEnd" | "onWaiting" | "onWheel" | "onMouseEnter" | "onMouseLeave" | "onPointerEnter" | "onPointerLeave" | "onChange" | "onSelect" | "onBeforeInput" | "onCompositionEnd" | "onCompositionStart" | "onCompositionUpdate" | "placeholder" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "lang" | "spellCheck" | "tabIndex" | "inputMode" | "is" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopyCapture" | "onCutCapture" | "onPasteCapture" | "onCompositionEndCapture" | "onCompositionStartCapture" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInputCapture" | "onInputCapture" | "onResetCapture" | "onSubmitCapture" | "onInvalidCapture" | "onLoadCapture" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbortCapture" | "onCanPlayCapture" | "onCanPlayThroughCapture" | "onDurationChangeCapture" | "onEmptiedCapture" | "onEncryptedCapture" | "onEndedCapture" | "onLoadedDataCapture" | "onLoadedMetadataCapture" | "onLoadStartCapture" | "onPauseCapture" | "onPlayCapture" | "onPlayingCapture" | "onProgressCapture" | "onRateChangeCapture" | "onSeekedCapture" | "onSeekingCapture" | "onStalledCapture" | "onSuspendCapture" | "onTimeUpdateCapture" | "onVolumeChangeCapture" | "onWaitingCapture" | "onAuxClickCapture" | "onClickCapture" | "onContextMenuCapture" | "onDoubleClickCapture" | "onDragCapture" | "onDragEndCapture" | "onDragEnterCapture" | "onDragExitCapture" | "onDragLeaveCapture" | "onDragOverCapture" | "onDragStartCapture" | "onDropCapture" | "onMouseDownCapture" | "onMouseMoveCapture" | "onMouseOutCapture" | "onMouseOverCapture" | "onMouseUpCapture" | "onSelectCapture" | "onTouchCancelCapture" | "onTouchEndCapture" | "onTouchMoveCapture" | "onTouchStartCapture" | "onPointerDownCapture" | "onPointerMoveCapture" | "onPointerUpCapture" | "onPointerCancelCapture" | "onPointerEnterCapture" | "onPointerLeaveCapture" | "onPointerOverCapture" | "onPointerOutCapture" | "onGotPointerCaptureCapture" | "onLostPointerCaptureCapture" | "onScrollCapture" | "onWheelCapture" | "onAnimationStartCapture" | "onAnimationEndCapture" | "onAnimationIterationCapture" | "onTransitionEndCapture">, object>;
+/// <reference types="react" />
+/// <reference types="web" />
+export declare const RowContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Row: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const fieldContainer: string;
 export declare const rowHandle: string;
 export declare const fieldHandle: string;

package/admin/components/FieldEditor/Styled.js

@@ -1,19 +1,18 @@
-import { css } from "emotion";
-import styled from "@emotion/styled";
-export var RowContainer = /*#__PURE__*/styled("div", {
-  target: "e1pk1rsi0",
-  label: "RowContainer"
-})({
-  position: "relative",
-  display: "flex",
-  flexDirection: "column",
-  marginBottom: 20,
-  borderRadius: 2,
-  backgroundColor: "var(--mdc-theme-surface)",
-  border: "1px solid var(--mdc-theme-on-background)",
-  boxShadow: "var(--mdc-theme-on-background) 1px 1px 1px, var(--mdc-theme-on-background) 1px 1px 2px"
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
 });
-export var Row = /*#__PURE__*/styled("div", {
+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"
 })({
@@ -24,11 +23,12 @@ export var Row = /*#__PURE__*/styled("div", {
   paddingRight: 10,
   position: "relative"
 });
-export var fieldContainer = /*#__PURE__*/css({
+exports.Row = Row;
+var fieldContainer = /*#__PURE__*/(0, _emotion.css)({
   position: "relative",
   flex: "1 100%",
   backgroundColor: "var(--mdc-theme-background)",
-  padding: "0 15px",
+  padding: "2px 15px 2px",
   margin: 10,
   borderRadius: 2,
   border: "1px solid var(--mdc-theme-on-background)",
@@ -39,7 +39,8 @@ export var fieldContainer = /*#__PURE__*/css({
     boxShadow: "var(--mdc-theme-on-background) 1px 1px 1px, var(--mdc-theme-on-background) 1px 1px 2px"
   }
 }, "label:fieldContainer;");
-export var rowHandle = /*#__PURE__*/css({
+exports.fieldContainer = fieldContainer;
+var rowHandle = /*#__PURE__*/(0, _emotion.css)({
   width: 30,
   cursor: "grab",
   position: "absolute",
@@ -49,6 +50,8 @@ export var rowHandle = /*#__PURE__*/css({
   zIndex: 1,
   color: "var(--mdc-theme-on-surface)"
 }, "label:rowHandle;");
-export var fieldHandle = /*#__PURE__*/css({
+exports.rowHandle = rowHandle;
+var fieldHandle = /*#__PURE__*/(0, _emotion.css)({
   cursor: "grab"
-}, "label:fieldHandle;");
+}, "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: \"2px 15px 2px\",\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,eAAM;EAAA;EAAA;AAAA,0TAajC;AAAC;AAEK,IAAMC,GAAG,oBAAGD,eAAM,EAAC,KAAK;EAAA;EAAA;AAAA,GAAE;EAC7BE,OAAO,EAAE,MAAM;EACfC,aAAa,EAAE,KAAK;EACpBC,eAAe,EAAE,0BAA0B;EAC3CC,WAAW,EAAE,EAAE;EACfC,YAAY,EAAE,EAAE;EAChBC,QAAQ,EAAE;AACd,CAAC,CAAC;AAAC;AAEI,IAAMC,cAAc,gBAAG,IAAAC,YAAG,EAAC;EAC9BF,QAAQ,EAAE,UAAU;EACpBG,IAAI,EAAE,QAAQ;EACdN,eAAe,EAAE,6BAA6B;EAC9CO,OAAO,EAAE,cAAc;EACvBC,MAAM,EAAE,EAAE;EACVC,YAAY,EAAE,CAAC;EACfC,MAAM,EAAE,0CAA0C;EAClDC,UAAU,EAAE,kBAAkB;EAC9BC,KAAK,EAAE,6BAA6B;EACpCC,MAAM,EAAE,MAAM;EACd,SAAS,EAAE;IACPC,SAAS,EACL;EACR;AACJ,CAAC,0BAAC;AAAC;AAEI,IAAMC,SAAS,gBAAG,IAAAV,YAAG,EAAC;EACzBW,KAAK,EAAE,EAAE;EACTH,MAAM,EAAE,MAAM;EACdV,QAAQ,EAAE,UAAU;EACpBc,IAAI,EAAE,EAAE;EACRC,GAAG,EAAE,KAAK;EACVC,SAAS,EAAE,kBAAkB;EAC7BC,MAAM,EAAE,CAAC;EACTR,KAAK,EAAE;AACX,CAAC,qBAAC;AAAC;AAEI,IAAMS,WAAW,gBAAG,IAAAhB,YAAG,EAAC;EAC3BQ,MAAM,EAAE;AACZ,CAAC,uBAAC;AAAC"}

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

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