@webiny/app-headless-cms 0.0.0-mt-1

package/admin/components/FieldEditor/FieldEditorContext.js

@@ -0,0 +1,330 @@
+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) {
+  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 = useFieldEditor();
+    depth = editor.depth + 1;
+  } 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 () {
+    onChange({
+      fields: state.fields,
+      layout: state.layout
+    });
+  }, [state.fields, state.layout]);
+  var editField = useCallback(function (field) {
+    setState(function (state) {
+      return _objectSpread(_objectSpread({}, state), {}, {
+        field: field
+      });
+    });
+  }, []);
+  var onDropTarget = {
+    dropTarget: parent ? parent.fieldId : null
+  };
+  var onFieldDrop = useCallback(function (source, dropTarget) {
+    var pos = source.pos,
+        type = source.type,
+        fieldType = source.fieldType,
+        field = source.field,
+        fields = 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 {
+        // 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 (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;
+    }
+
+    var plugin = getFieldPlugin(fieldType);
+    editField(plugin.field.createField());
+    setState(function (state) {
+      return _objectSpread(_objectSpread({}, state), {}, {
+        dropTarget: dropTarget
+      });
+    });
+  }, []);
+
+  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];
+    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 arr.length;
+    }));
+    fields.forEach(function (row, rowIndex) {
+      row.forEach(function (fieldId, fieldIndex) {
+        fields[rowIndex][fieldIndex] = getField({
+          id: fieldId
+        });
+      });
+    });
+    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;
+    });
+  };
+  /**
+   * 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;
+        }
+
+        if (field[key] !== query[key]) {
+          return null;
+        }
+      }
+
+      return true;
+    });
+  };
+  /**
+   * Inserts a new field into the target position.
+   */
+
+
+  var insertField = function insertField(_ref4) {
+    var field = _ref4.field,
+        position = _ref4.position;
+
+    if (!field.id) {
+      field.id = shortid.generate();
+    }
+
+    if (!field.type) {
+      throw new Error("Field \"type\" missing.");
+    }
+
+    var fieldPlugin = getFieldPlugin(field.type);
+
+    if (!fieldPlugin) {
+      throw new Error("Invalid field \"type\".");
+    }
+
+    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.
+
+      return utils.moveField({
+        field: field,
+        position: position,
+        data: data
+      });
+    });
+  };
+  /**
+   * Moves field to the given target position.
+   */
+
+
+  var moveField = function moveField(_ref5) {
+    var field = _ref5.field,
+        position = _ref5.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 dot.set(data, "fields.".concat(i), field);
+        }
+      }
+    });
+  };
+  /**
+   * 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 = 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":
+          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,
+    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.createElement(FieldEditorContext.Provider, {
+    value: value
+  }, children);
+};

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

@@ -0,0 +1,6 @@
+/// <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>;
+export declare const fieldContainer: string;
+export declare const rowHandle: string;
+export declare const fieldHandle: string;

package/admin/components/FieldEditor/Styled.js

@@ -0,0 +1,54 @@
+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"
+});
+export var Row = /*#__PURE__*/styled("div", {
+  target: "e1pk1rsi1",
+  label: "Row"
+})({
+  display: "flex",
+  flexDirection: "row",
+  backgroundColor: "var(--mdc-theme-surface)",
+  paddingLeft: 40,
+  paddingRight: 10,
+  position: "relative"
+});
+export var fieldContainer = /*#__PURE__*/css({
+  position: "relative",
+  flex: "1 100%",
+  backgroundColor: "var(--mdc-theme-background)",
+  padding: "0 15px",
+  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;");
+export var rowHandle = /*#__PURE__*/css({
+  width: 30,
+  cursor: "grab",
+  position: "absolute",
+  left: 10,
+  top: "50%",
+  transform: "translateY(-50%)",
+  zIndex: 1,
+  color: "var(--mdc-theme-on-surface)"
+}, "label:rowHandle;");
+export var fieldHandle = /*#__PURE__*/css({
+  cursor: "grab"
+}, "label:fieldHandle;");

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

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

package/admin/components/FieldEditor/index.js

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

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

@@ -0,0 +1 @@
+export declare function useFieldEditor(): import("./FieldEditorContext").FieldEditorContextValue;

package/admin/components/FieldEditor/useFieldEditor.js

@@ -0,0 +1,5 @@
+import { useContext } from "react";
+import { FieldEditorContext } from "./FieldEditorContext";
+export function useFieldEditor() {
+  return useContext(FieldEditorContext);
+}

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

@@ -0,0 +1,10 @@
+import { CmsEditorField, CmsEditorFieldsLayout } from "../../../../types";
+interface Data {
+    fields: CmsEditorField[];
+    layout: CmsEditorFieldsLayout;
+}
+declare const _default: ({ field, data }: {
+    field: CmsEditorField;
+    data: Data;
+}) => any;
+export default _default;

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

@@ -0,0 +1,34 @@
+import dot from "dot-prop-immutable";
+export default (function (_ref) {
+  var field = _ref.field,
+      data = _ref.data;
+  // Remove the field from fields list...
+  var fieldIndex = data.fields.findIndex(function (item) {
+    return item.id === field.id;
+  });
+  data = dot.delete(data, "fields.".concat(fieldIndex)); // ...and rebuild the layout object.
+
+  return dot.set(data, "layout", function (layout) {
+    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 true;
+        }
+
+        if (!Array.isArray(newLayout[currentRowIndex])) {
+          newLayout[currentRowIndex] = [];
+        }
+
+        newLayout[currentRowIndex].push(fieldId);
+      });
+      newLayout[currentRowIndex] && newLayout[currentRowIndex].length && currentRowIndex++;
+    });
+    return newLayout;
+  });
+});

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

@@ -0,0 +1,6 @@
+import { FieldLayoutPosition } from "../../../../types";
+declare const _default: ({ field, data }: {
+    field: any;
+    data: any;
+}) => FieldLayoutPosition;
+export default _default;

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

@@ -0,0 +1,20 @@
+export default (function (_ref) {
+  var field = _ref.field,
+      data = _ref.data;
+  var id = typeof field === "string" ? field : field.id;
+
+  for (var i = 0; i < data.layout.length; i++) {
+    var row = data.layout[i];
+
+    for (var j = 0; j < row.length; j++) {
+      if (row[j] === id) {
+        return {
+          row: i,
+          index: j
+        };
+      }
+    }
+  }
+
+  return null;
+});

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

@@ -0,0 +1,4 @@
+export { default as getFieldPosition } from "./getFieldPosition";
+export { default as moveField } from "./moveField";
+export { default as deleteField } from "./deleteField";
+export { default as moveRow } from "./moveRow";

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

@@ -0,0 +1,4 @@
+export { default as getFieldPosition } from "./getFieldPosition";
+export { default as moveField } from "./moveField";
+export { default as deleteField } from "./deleteField";
+export { default as moveRow } from "./moveRow";

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

@@ -0,0 +1,7 @@
+import { CmsEditorField, CmsEditorFieldId, FieldLayoutPosition } from "../../../../types";
+declare const _default: (params: {
+    field: CmsEditorFieldId | CmsEditorField;
+    position: FieldLayoutPosition;
+    data: object;
+}) => any;
+export default _default;

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

@@ -0,0 +1,51 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import dot from "dot-prop-immutable";
+import getFieldPosition from "./getFieldPosition";
+
+var moveField = function moveField(_ref) {
+  var field = _ref.field,
+      position = _ref.position,
+      data = _ref.data;
+  var row = position.row,
+      index = position.index;
+  var fieldId = typeof field === "string" ? field : field.id;
+  var existingPosition = getFieldPosition({
+    field: fieldId,
+    data: data
+  });
+
+  if (existingPosition) {
+    data = dot.delete(data, "layout.".concat(existingPosition.row, ".").concat(existingPosition.index));
+  } // Setting a form field into a new non-existing row.
+
+
+  if (!data.layout[row]) {
+    return dot.set(data, "layout.".concat(row), [fieldId]);
+  } // Drop the field at the specified index.
+
+
+  if (index === null) {
+    // Create a new row with the new field at the given row index,
+    return dot.set(data, "layout", function (layout) {
+      var newLayout = _toConsumableArray(layout);
+
+      newLayout.splice(row, 0, [fieldId]);
+      return newLayout;
+    });
+  }
+
+  return dot.set(data, "layout.".concat(row), function (layout) {
+    var newLayout = _toConsumableArray(layout);
+
+    newLayout.splice(index, 0, fieldId);
+    return newLayout;
+  });
+};
+
+export default (function (params) {
+  return dot.set(moveField(params), "layout", function (layout) {
+    return _toConsumableArray(layout).filter(function (row) {
+      return row.length > 0;
+    });
+  });
+});

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

@@ -0,0 +1,9 @@
+import { CmsEditorFieldsLayout } from "../../../../types";
+declare const _default: ({ data, source, destination }: {
+    source: number;
+    destination: number;
+    data: {
+        layout: CmsEditorFieldsLayout;
+    };
+}) => any;
+export default _default;

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

@@ -0,0 +1,10 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import dot from "dot-prop-immutable";
+export default (function (_ref) {
+  var data = _ref.data,
+      source = _ref.source,
+      destination = _ref.destination;
+  return dot.set(data, "layout", function (layout) {
+    return source < destination ? [].concat(_toConsumableArray(layout.slice(0, source)), _toConsumableArray(layout.slice(source + 1, destination)), [layout[source]], _toConsumableArray(layout.slice(destination))) : [].concat(_toConsumableArray(layout.slice(0, destination)), [layout[source]], _toConsumableArray(layout.slice(destination, source)), _toConsumableArray(layout.slice(source + 1)));
+  });
+});

package/admin/constants/statusLabels.d.ts

@@ -0,0 +1,8 @@
+declare const _default: {
+    draft: any;
+    published: any;
+    unpublished: any;
+    changesRequested: any;
+    reviewRequested: any;
+};
+export default _default;

package/admin/constants/statusLabels.js

@@ -0,0 +1,13 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+
+import { i18n } from "@webiny/app/i18n";
+var t = i18n.ns("app-headless-cms/admin/content-entries/status");
+export default {
+  draft: t(_templateObject || (_templateObject = _taggedTemplateLiteral(["Draft"]))),
+  published: t(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["Published"]))),
+  unpublished: t(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["Unpublished"]))),
+  changesRequested: t(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["Changes Requested"]))),
+  reviewRequested: t(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["Review Requested"])))
+};

package/admin/contexts/Cms/NetworkError.d.ts

@@ -0,0 +1,2 @@
+declare const GET_ERROR: import("graphql").DocumentNode;
+export { GET_ERROR };

package/admin/contexts/Cms/NetworkError.js

@@ -0,0 +1,7 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+
+var _templateObject;
+
+import gql from "graphql-tag";
+var GET_ERROR = gql(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    {\n        networkError\n    }\n"])));
+export { GET_ERROR };

package/admin/contexts/Cms/index.d.ts

@@ -0,0 +1,16 @@
+import React from "react";
+import ApolloClient from "apollo-client";
+export interface CmsContextValue {
+    getApolloClient(locale: string): ApolloClient<any>;
+    createApolloClient: CmsProviderProps["createApolloClient"];
+    apolloClient: ApolloClient<any>;
+}
+export declare const CmsContext: React.Context<CmsContextValue>;
+declare type CmsProviderProps = {
+    createApolloClient: (params: {
+        uri: string;
+    }) => ApolloClient<any>;
+    children: React.ReactNode;
+};
+export declare function CmsProvider(props: CmsProviderProps): JSX.Element;
+export {};