@webiny/app-headless-cms 0.0.0-mt-2 → 0.0.0-unstable.5e7233243f

package/admin/components/FieldEditor/Field.js

@@ -1,29 +1,63 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-import _objectSpread from "@babel/runtime/helpers/objectSpread2";
-import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
-
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
-
-import _regeneratorRuntime from "@babel/runtime/regenerator";
-import React, { Fragment, useCallback } from "react";
-import { css } from "emotion";
-import styled from "@emotion/styled";
-import { IconButton } from "@webiny/ui/Button";
-import { Typography } from "@webiny/ui/Typography";
-import { ReactComponent as EditIcon } from "@svgr/webpack!../../icons/edit.svg";
-import { ReactComponent as DeleteIcon } from "@svgr/webpack!../../icons/delete.svg";
-import { ReactComponent as TitleIcon } from "@svgr/webpack!../../icons/title-24px.svg";
-import { ReactComponent as MoreVerticalIcon } from "@svgr/webpack!../../icons/more_vert.svg";
-import { Menu, MenuItem } from "@webiny/ui/Menu";
-import { plugins } from "@webiny/plugins";
-import { ListItemGraphic } from "@webiny/ui/List";
-import { Icon } from "@webiny/ui/Icon";
-import { i18n } from "@webiny/app/i18n";
-import { useSnackbar } from "@webiny/app-admin/hooks/useSnackbar";
-import { useContentModelEditor } from "../ContentModelEditor/useContentModelEditor";
-import { useFieldEditor } from "./useFieldEditor";
-var t = i18n.ns("app-headless-cms/admin/components/editor/field");
-var FieldContainer = /*#__PURE__*/styled("div", {
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _regeneratorRuntime2 = _interopRequireDefault(require("@babel/runtime/helpers/regeneratorRuntime"));
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _emotion = require("emotion");
+
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+
+var _Button = require("@webiny/ui/Button");
+
+var _Typography = require("@webiny/ui/Typography");
+
+var _edit = require("../../icons/edit.svg");
+
+var _delete = require("../../icons/delete.svg");
+
+var _title24px = require("../../icons/title-24px.svg");
+
+var _more_vert = require("../../icons/more_vert.svg");
+
+var _Menu = require("@webiny/ui/Menu");
+
+var _plugins = require("@webiny/plugins");
+
+var _List = require("@webiny/ui/List");
+
+var _Icon = require("@webiny/ui/Icon");
+
+var _i18n = require("@webiny/app/i18n");
+
+var _useSnackbar2 = require("@webiny/app-admin/hooks/useSnackbar");
+
+var _useContentModelEditor = require("../ContentModelEditor/useContentModelEditor");
+
+var _useFieldEditor2 = require("./useFieldEditor");
+
+var _appAdmin = require("@webiny/app-admin");
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
+
+var t = _i18n.i18n.ns("app-headless-cms/admin/components/editor/field");
+
+var FieldContainer = /*#__PURE__*/(0, _styled.default)("div", {
   target: "erv8xml0",
   label: "FieldContainer"
 })({
@@ -32,7 +66,7 @@ var FieldContainer = /*#__PURE__*/styled("div", {
   justifyContent: "space-between",
   alignItems: "center"
 });
-var Info = /*#__PURE__*/styled("div", {
+var Info = /*#__PURE__*/(0, _styled.default)("div", {
   target: "erv8xml1",
   label: "Info"
 })({
@@ -43,7 +77,7 @@ var Info = /*#__PURE__*/styled("div", {
     lineHeight: "150%"
   }
 });
-var Actions = /*#__PURE__*/styled("div", {
+var Actions = /*#__PURE__*/(0, _styled.default)("div", {
   target: "erv8xml2",
   label: "Actions"
 })({
@@ -54,7 +88,7 @@ var Actions = /*#__PURE__*/styled("div", {
     flex: "1 100%"
   }
 });
-var menuStyles = /*#__PURE__*/css({
+var menuStyles = /*#__PURE__*/(0, _emotion.css)({
   width: 220,
   right: -105,
   left: "auto !important",
@@ -80,28 +114,45 @@ var Field = function Field(props) {
       onEdit = props.onEdit,
       parent = props.parent;
 
-  var _useSnackbar = useSnackbar(),
+  var _useSnackbar = (0, _useSnackbar2.useSnackbar)(),
       showSnackbar = _useSnackbar.showSnackbar;
 
-  var _useContentModelEdito = useContentModelEditor(),
+  var _useContentModelEdito = (0, _useContentModelEditor.useContentModelEditor)(),
       setData = _useContentModelEdito.setData,
       data = _useContentModelEdito.data;
 
-  var _useFieldEditor = useFieldEditor(),
+  var _useFieldEditor = (0, _useFieldEditor2.useFieldEditor)(),
       getFieldPlugin = _useFieldEditor.getFieldPlugin;
 
-  var onDelete = useCallback(function () {
-    props.onDelete(field);
-  }, [field.fieldId]);
-  var setAsTitle = useCallback( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+  var _useConfirmationDialo = (0, _appAdmin.useConfirmationDialog)({
+    title: t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Warning - You are trying to delete a locked field!"]))),
+    message: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("p", null, t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["You are about to delete a field which is used in the data storage"])))), /*#__PURE__*/_react.default.createElement("p", null, t(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["All data in that field will be lost and there is no going back!"])))), /*#__PURE__*/_react.default.createElement("p", null, "\xA0"), /*#__PURE__*/_react.default.createElement("p", null, t(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["Are you sure you want to continue?"])))))
+  }),
+      showConfirmation = _useConfirmationDialo.showConfirmation;
+
+  var lockedFields = data ? data.lockedFields || [] : [];
+  var isLocked = lockedFields.some(function (lockedField) {
+    return lockedField.fieldId === field.storageId;
+  });
+  var onDelete = (0, _react.useCallback)(function () {
+    if (!isLocked) {
+      props.onDelete(field);
+      return;
+    }
+
+    showConfirmation(function () {
+      props.onDelete(field);
+    });
+  }, [field.fieldId, lockedFields]);
+  var setAsTitle = (0, _react.useCallback)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee() {
     var response;
-    return _regeneratorRuntime.wrap(function _callee$(_context) {
+    return (0, _regeneratorRuntime2.default)().wrap(function _callee$(_context) {
       while (1) {
         switch (_context.prev = _context.next) {
           case 0:
             _context.next = 2;
             return setData(function (data) {
-              return _objectSpread(_objectSpread({}, data), {}, {
+              return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, data), {}, {
                 titleFieldId: field.fieldId
               });
             });
@@ -109,7 +160,7 @@ var Field = function Field(props) {
           case 2:
             response = _context.sent;
 
-            if (!response.error) {
+            if (!(response && response.error)) {
               _context.next = 5;
               break;
             }
@@ -117,7 +168,7 @@ var Field = function Field(props) {
             return _context.abrupt("return", showSnackbar(response.error.message));
 
           case 5:
-            showSnackbar(t(_templateObject || (_templateObject = _taggedTemplateLiteral(["Title field set successfully."]))));
+            showSnackbar(t(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["Title field set successfully."]))));
 
           case 6:
           case "end":
@@ -125,49 +176,45 @@ var Field = function Field(props) {
         }
       }
     }, _callee);
-  })), [field.fieldId]);
+  })), [field.fieldId, setData]);
   var fieldPlugin = getFieldPlugin(field.type);
-  var editorFieldOptionPlugins = plugins.byType("cms-editor-field-option");
+
+  var editorFieldOptionPlugins = _plugins.plugins.byType("cms-editor-field-option");
 
   if (!fieldPlugin) {
     return null;
   }
 
-  var lockedFields = data.lockedFields || [];
-  return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(FieldContainer, null, /*#__PURE__*/React.createElement(Info, null, /*#__PURE__*/React.createElement(Typography, {
+  var isTitleField = data && field.fieldId === data.titleFieldId && !parent;
+  return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(FieldContainer, null, /*#__PURE__*/_react.default.createElement(Info, null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "subtitle1"
-  }, field.label), /*#__PURE__*/React.createElement(Typography, {
+  }, field.label), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "caption"
-  }, fieldPlugin.field.label, " ", field.multipleValues && /*#__PURE__*/React.createElement(React.Fragment, null, "(", t(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["multiple values"]))), ")"), field.fieldId === data.titleFieldId && /*#__PURE__*/React.createElement(React.Fragment, null, "(", t(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["entry title"]))), ")"))), /*#__PURE__*/React.createElement(Actions, null, /*#__PURE__*/React.createElement(IconButton, {
+  }, fieldPlugin.field.label, " ", field.multipleValues && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "(", t(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["multiple values"]))), ")"), isTitleField && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "(", t(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["entry title"]))), ")"))), /*#__PURE__*/_react.default.createElement(Actions, null, /*#__PURE__*/_react.default.createElement(_Button.IconButton, {
     "data-testid": "cms.editor.edit-field",
-    icon: /*#__PURE__*/React.createElement(EditIcon, null),
+    icon: /*#__PURE__*/_react.default.createElement(_edit.ReactComponent, null),
     onClick: function onClick() {
       return onEdit(field);
     }
-  }), /*#__PURE__*/React.createElement(Menu, {
+  }), /*#__PURE__*/_react.default.createElement(_Menu.Menu, {
     className: menuStyles,
-    handle: /*#__PURE__*/React.createElement(IconButton, {
-      icon: /*#__PURE__*/React.createElement(MoreVerticalIcon, null)
+    handle: /*#__PURE__*/_react.default.createElement(_Button.IconButton, {
+      icon: /*#__PURE__*/_react.default.createElement(_more_vert.ReactComponent, null)
     })
   }, editorFieldOptionPlugins.map(function (pl) {
-    return /*#__PURE__*/React.cloneElement(pl.render(), {
+    return /*#__PURE__*/_react.default.cloneElement(pl.render(), {
       key: pl.name
     });
-  }), /*#__PURE__*/React.createElement(MenuItem, {
+  }), /*#__PURE__*/_react.default.createElement(_Menu.MenuItem, {
     disabled: !isFieldAllowedToBeTitle(field, parent),
     onClick: setAsTitle
-  }, /*#__PURE__*/React.createElement(ListItemGraphic, null, /*#__PURE__*/React.createElement(Icon, {
-    icon: /*#__PURE__*/React.createElement(TitleIcon, null)
-  })), t(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["Use as title"])))), /*#__PURE__*/React.createElement(MenuItem, {
-    disabled: lockedFields.some(function (lockedField) {
-      return lockedField.fieldId === field.fieldId;
-    }),
+  }, /*#__PURE__*/_react.default.createElement(_List.ListItemGraphic, null, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
+    icon: /*#__PURE__*/_react.default.createElement(_title24px.ReactComponent, null)
+  })), t(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["Use as title"])))), /*#__PURE__*/_react.default.createElement(_Menu.MenuItem, {
     onClick: onDelete
-  }, /*#__PURE__*/React.createElement(ListItemGraphic, null, /*#__PURE__*/React.createElement(Icon, {
-    icon: /*#__PURE__*/React.createElement(DeleteIcon, null)
-  })), lockedFields.find(function (lockedField) {
-    return lockedField.fieldId === field.fieldId;
-  }) ? t(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["Cannot delete"]))) : t(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["Delete"]))))))), /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/_react.default.createElement(_List.ListItemGraphic, null, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
+    icon: /*#__PURE__*/_react.default.createElement(_delete.ReactComponent, null)
+  })), t(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["Delete"]))))))), /*#__PURE__*/_react.default.createElement("div", {
     className: "field-extra"
   }, fieldPlugin.field.render && fieldPlugin.field.render({
     field: field,
@@ -176,4 +223,6 @@ var Field = function Field(props) {
   })));
 };
 
-export default /*#__PURE__*/React.memo(Field);
+var _default = /*#__PURE__*/_react.default.memo(Field);
+
+exports.default = _default;

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

@@ -0,0 +1 @@
+{"version":3,"names":["t","i18n","ns","FieldContainer","styled","display","flexDirection","justifyContent","alignItems","Info","flex","lineHeight","Actions","menuStyles","css","width","right","left","opacity","pointerEvents","allowedTitleFieldTypes","isFieldAllowedToBeTitle","field","parent","multipleValues","includes","type","Field","props","onEdit","useSnackbar","showSnackbar","useContentModelEditor","setData","data","useFieldEditor","getFieldPlugin","useConfirmationDialog","title","message","showConfirmation","lockedFields","isLocked","some","lockedField","fieldId","storageId","onDelete","useCallback","setAsTitle","titleFieldId","response","error","fieldPlugin","editorFieldOptionPlugins","plugins","byType","isTitleField","label","map","pl","React","cloneElement","render","key","name","memo"],"sources":["Field.tsx"],"sourcesContent":["import React, { Fragment, useCallback } from \"react\";\nimport { css } from \"emotion\";\nimport styled from \"@emotion/styled\";\nimport { IconButton } from \"@webiny/ui/Button\";\nimport { Typography } from \"@webiny/ui/Typography\";\nimport { ReactComponent as EditIcon } from \"~/admin/icons/edit.svg\";\nimport { ReactComponent as DeleteIcon } from \"~/admin/icons/delete.svg\";\nimport { ReactComponent as TitleIcon } from \"~/admin/icons/title-24px.svg\";\nimport { ReactComponent as MoreVerticalIcon } from \"~/admin/icons/more_vert.svg\";\nimport { Menu, MenuItem } from \"@webiny/ui/Menu\";\nimport { plugins } from \"@webiny/plugins\";\nimport { CmsEditorField, CmsEditorFieldOptionPlugin } from \"~/types\";\nimport { ListItemGraphic } from \"@webiny/ui/List\";\nimport { Icon } from \"@webiny/ui/Icon\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { useSnackbar } from \"@webiny/app-admin/hooks/useSnackbar\";\nimport { useContentModelEditor } from \"~/admin/components/ContentModelEditor/useContentModelEditor\";\nimport { useFieldEditor } from \"~/admin/components/FieldEditor/useFieldEditor\";\nimport { useConfirmationDialog } from \"@webiny/app-admin\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/components/editor/field\");\n\nconst FieldContainer = styled(\"div\")({\n    display: \"flex\",\n    flexDirection: \"row\",\n    justifyContent: \"space-between\",\n    alignItems: \"center\"\n});\n\nconst Info = styled(\"div\")({\n    display: \"flex\",\n    flexDirection: \"column\",\n    \"> *\": {\n        flex: \"1 100%\",\n        lineHeight: \"150%\"\n    }\n});\n\nconst Actions = styled(\"div\")({\n    display: \"flex\",\n    flexDirection: \"row\",\n    alignItems: \"right\",\n    \"> *\": {\n        flex: \"1 100%\"\n    }\n});\n\nconst menuStyles = css({\n    width: 220,\n    right: -105,\n    left: \"auto !important\",\n    \".disabled\": {\n        opacity: 0.5,\n        pointerEvents: \"none\"\n    }\n});\n\nconst allowedTitleFieldTypes: string[] = [\"text\", \"number\"];\n\nconst isFieldAllowedToBeTitle = (field: CmsEditorField, parent?: CmsEditorField) => {\n    if (field.multipleValues || parent) {\n        return false;\n    } else if (allowedTitleFieldTypes.includes(field.type) === false) {\n        return false;\n    }\n    return true;\n};\n\nexport interface FieldProps {\n    field: CmsEditorField;\n    onDelete: (field: CmsEditorField) => void;\n    onEdit: (field: CmsEditorField) => void;\n    parent?: CmsEditorField;\n}\nconst Field: React.FC<FieldProps> = props => {\n    const { field, onEdit, parent } = props;\n    const { showSnackbar } = useSnackbar();\n    const { setData, data } = useContentModelEditor();\n    const { getFieldPlugin } = useFieldEditor();\n\n    const { showConfirmation } = useConfirmationDialog({\n        title: t`Warning - You are trying to delete a locked field!`,\n        message: (\n            <>\n                <p>{t`You are about to delete a field which is used in the data storage`}</p>\n                <p>{t`All data in that field will be lost and there is no going back!`}</p>\n                <p>&nbsp;</p>\n                <p>{t`Are you sure you want to continue?`}</p>\n            </>\n        )\n    });\n    const lockedFields = data ? data.lockedFields || [] : [];\n    const isLocked = lockedFields.some(lockedField => lockedField.fieldId === field.storageId);\n\n    const onDelete = useCallback(() => {\n        if (!isLocked) {\n            props.onDelete(field);\n            return;\n        }\n        showConfirmation(() => {\n            props.onDelete(field);\n        });\n    }, [field.fieldId, lockedFields]);\n\n    const setAsTitle = useCallback(async (): Promise<void> => {\n        const response = await setData(data => {\n            return { ...data, titleFieldId: field.fieldId };\n        });\n\n        if (response && response.error) {\n            return showSnackbar(response.error.message);\n        }\n\n        showSnackbar(t`Title field set successfully.`);\n    }, [field.fieldId, setData]);\n\n    const fieldPlugin = getFieldPlugin(field.type);\n    const editorFieldOptionPlugins =\n        plugins.byType<CmsEditorFieldOptionPlugin>(\"cms-editor-field-option\");\n\n    if (!fieldPlugin) {\n        return null;\n    }\n\n    const isTitleField = data && field.fieldId === data.titleFieldId && !parent;\n\n    return (\n        <Fragment>\n            <FieldContainer>\n                <Info>\n                    <Typography use={\"subtitle1\"}>{field.label}</Typography>\n                    <Typography use={\"caption\"}>\n                        {fieldPlugin.field.label}{\" \"}\n                        {field.multipleValues && <>({t`multiple values`})</>}\n                        {isTitleField && <>({t`entry title`})</>}\n                    </Typography>\n                </Info>\n                <Actions>\n                    <IconButton\n                        data-testid={\"cms.editor.edit-field\"}\n                        icon={<EditIcon />}\n                        onClick={() => onEdit(field)}\n                    />\n                    <Menu\n                        className={menuStyles}\n                        handle={<IconButton icon={<MoreVerticalIcon />} />}\n                    >\n                        {editorFieldOptionPlugins.map(pl =>\n                            React.cloneElement(pl.render(), { key: pl.name })\n                        )}\n                        {/* We only allow this action for top-level fields. */}\n                        <MenuItem\n                            disabled={!isFieldAllowedToBeTitle(field, parent)}\n                            onClick={setAsTitle}\n                        >\n                            <ListItemGraphic>\n                                <Icon icon={<TitleIcon />} />\n                            </ListItemGraphic>\n                            {t`Use as title`}\n                        </MenuItem>\n                        <MenuItem onClick={onDelete}>\n                            <ListItemGraphic>\n                                <Icon icon={<DeleteIcon />} />\n                            </ListItemGraphic>\n                            {t`Delete`}\n                        </MenuItem>\n                    </Menu>\n                </Actions>\n            </FieldContainer>\n            <div className={\"field-extra\"}>\n                {fieldPlugin.field.render && fieldPlugin.field.render({ field, data, setData })}\n            </div>\n        </Fragment>\n    );\n};\n\nexport default React.memo(Field);\n"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import { CmsEditorField, CmsEditorFieldsLayout } from "../../../types";
 export interface FieldEditorProps {
     parent?: CmsEditorField;
@@ -9,4 +9,4 @@ export interface FieldEditorProps {
         layout: CmsEditorFieldsLayout;
     }) => void;
 }
-export declare const FieldEditor: (props: FieldEditorProps) => JSX.Element;
+export declare const FieldEditor: React.FC<FieldEditorProps>;

package/admin/components/FieldEditor/FieldEditor.js

@@ -1,24 +1,48 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FieldEditor = void 0;
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _get = _interopRequireDefault(require("lodash/get"));
+
+var _Icon = require("@webiny/ui/Icon");
+
+var _i18n = require("@webiny/app/i18n");
+
+var _roundDrag_indicator24px = require("../../icons/round-drag_indicator-24px.svg");
+
+var _DropZone = require("../DropZone");
+
+var _Draggable = _interopRequireDefault(require("../Draggable"));
+
+var _EditFieldDialog = _interopRequireDefault(require("./EditFieldDialog"));
+
+var _Field = _interopRequireDefault(require("./Field"));
+
+var _Styled = require("./Styled");
+
+var _useFieldEditor2 = require("./useFieldEditor");
+
+var _FieldEditorContext = require("./FieldEditorContext");
 
 var _templateObject;
 
-import React, { Fragment } from "react";
-import get from "lodash/get";
-import { Icon } from "@webiny/ui/Icon";
-import { i18n } from "@webiny/app/i18n";
-import { ReactComponent as HandleIcon } from "@svgr/webpack!../../icons/round-drag_indicator-24px.svg";
-import { Center, Vertical, Horizontal } from "../DropZone";
-import Draggable from "../Draggable";
-import EditFieldDialog from "./EditFieldDialog";
-import Field from "./Field";
-import { rowHandle, fieldHandle, fieldContainer, Row, RowContainer } from "./Styled";
-import { useFieldEditor } from "./useFieldEditor";
-import { FieldEditorProvider } from "./FieldEditorContext";
-var t = i18n.namespace("app-headless-cms/admin/components/editor");
+var t = _i18n.i18n.namespace("app-headless-cms/admin/components/editor");
+
 var fieldTypes = ["field", "newField"];
 
 var Editor = function Editor() {
-  var _useFieldEditor = useFieldEditor(),
+  var _useFieldEditor = (0, _useFieldEditor2.useFieldEditor)(),
       parent = _useFieldEditor.parent,
       depth = _useFieldEditor.depth,
       insertField = _useFieldEditor.insertField,
@@ -32,7 +56,7 @@ var Editor = function Editor() {
       field = _useFieldEditor.field,
       dropTarget = _useFieldEditor.dropTarget;
 
-  return /*#__PURE__*/React.createElement(Fragment, null, fields.length === 0 && /*#__PURE__*/React.createElement(Center, {
+  return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, fields.length === 0 && /*#__PURE__*/_react.default.createElement(_DropZone.Center, {
     onDrop: function onDrop(item) {
       return onFieldDrop(item, {
         row: 0,
@@ -42,8 +66,8 @@ var Editor = function Editor() {
     style: {
       padding: "5px 0 15px 0"
     }
-  }, t(_templateObject || (_templateObject = _taggedTemplateLiteral(["Drop your first field here"])))), fields.map(function (row, index) {
-    return /*#__PURE__*/React.createElement(Draggable, {
+  }, t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Drop your first field here"])))), fields.map(function (row, index) {
+    return /*#__PURE__*/_react.default.createElement(_Draggable.default, {
       beginDrag: {
         parent: parent ? parent.fieldId : null,
         type: "row",
@@ -61,16 +85,16 @@ var Editor = function Editor() {
     ) {
       var drag = _ref.drag,
           isDragging = _ref.isDragging;
-      return /*#__PURE__*/React.createElement(RowContainer, {
+      return /*#__PURE__*/_react.default.createElement(_Styled.RowContainer, {
         style: {
           opacity: isDragging ? 0.3 : 1
         }
-      }, /*#__PURE__*/React.createElement("div", {
-        className: rowHandle,
+      }, /*#__PURE__*/_react.default.createElement("div", {
+        className: _Styled.rowHandle,
         ref: drag
-      }, /*#__PURE__*/React.createElement(Icon, {
-        icon: /*#__PURE__*/React.createElement(HandleIcon, null)
-      })), /*#__PURE__*/React.createElement(Horizontal, {
+      }, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
+        icon: /*#__PURE__*/_react.default.createElement(_roundDrag_indicator24px.ReactComponent, null)
+      })), /*#__PURE__*/_react.default.createElement(_DropZone.Horizontal, {
         "data-testid": "cms-editor-row-droppable-top-".concat(index),
         isVisible: noConflict(),
         onDrop: function onDrop(item) {
@@ -79,10 +103,10 @@ var Editor = function Editor() {
             index: null
           });
         }
-      }), /*#__PURE__*/React.createElement(Row, {
+      }), /*#__PURE__*/_react.default.createElement(_Styled.Row, {
         "data-testid": "cms.editor.field-row"
       }, row.map(function (field, fieldIndex) {
-        return /*#__PURE__*/React.createElement(Draggable, {
+        return /*#__PURE__*/_react.default.createElement(_Draggable.default, {
           key: field.fieldId,
           beginDrag: {
             parent: parent ? parent.fieldId : null,
@@ -96,10 +120,10 @@ var Editor = function Editor() {
           endDrag: onEndDrag
         }, function (_ref2) {
           var drag = _ref2.drag;
-          return /*#__PURE__*/React.createElement("div", {
-            className: fieldContainer,
+          return /*#__PURE__*/_react.default.createElement("div", {
+            className: _Styled.fieldContainer,
             ref: drag
-          }, /*#__PURE__*/React.createElement(Vertical, {
+          }, /*#__PURE__*/_react.default.createElement(_DropZone.Vertical, {
             depth: depth,
             onDrop: function onDrop(item) {
               return onFieldDrop(item, {
@@ -108,20 +132,20 @@ var Editor = function Editor() {
               });
             },
             isVisible: noConflict(function (item) {
-              return fieldTypes.includes(item.type) && (row.length < 4 || get(item, "pos.row") === index);
+              return fieldTypes.includes(item.type) && (row.length < 4 || (0, _get.default)(item, "pos.row") === index);
             })
-          }), /*#__PURE__*/React.createElement("div", {
-            className: fieldHandle
-          }, /*#__PURE__*/React.createElement(Field, {
+          }), /*#__PURE__*/_react.default.createElement("div", {
+            className: _Styled.fieldHandle
+          }, /*#__PURE__*/_react.default.createElement(_Field.default, {
             parent: parent,
             field: field,
             onEdit: editField,
             onDelete: deleteField
-          })), fieldIndex === row.length - 1 && /*#__PURE__*/React.createElement(Vertical, {
+          })), fieldIndex === row.length - 1 && /*#__PURE__*/_react.default.createElement(_DropZone.Vertical, {
             last: true,
             depth: depth,
             isVisible: noConflict(function (item) {
-              return fieldTypes.includes(item.type) && (row.length < 4 || get(item, "pos.row") === index);
+              return fieldTypes.includes(item.type) && (row.length < 4 || (0, _get.default)(item, "pos.row") === index);
             }),
             onDrop: function onDrop(item) {
               return onFieldDrop(item, {
@@ -131,7 +155,7 @@ var Editor = function Editor() {
             }
           }));
         });
-      })), index === fields.length - 1 && /*#__PURE__*/React.createElement(Horizontal, {
+      })), index === fields.length - 1 && /*#__PURE__*/_react.default.createElement(_DropZone.Horizontal, {
         "data-testid": "cms-editor-row-droppable-bottom-".concat(index),
         last: true,
         isVisible: noConflict(),
@@ -143,24 +167,29 @@ var Editor = function Editor() {
         }
       }));
     });
-  }), /*#__PURE__*/React.createElement(EditFieldDialog, {
+  }), /*#__PURE__*/_react.default.createElement(_EditFieldDialog.default, {
     field: field,
-    onClose: editField,
+    onClose: function onClose() {
+      return editField(null);
+    },
     onSubmit: function onSubmit(field) {
       if (field.id) {
         updateField(field);
-      } else {
-        insertField({
-          field: field,
-          position: dropTarget
-        });
+        editField(null);
+        return;
       }
 
+      insertField({
+        field: field,
+        position: dropTarget
+      });
       editField(null);
     }
   }));
 };
 
-export var FieldEditor = function FieldEditor(props) {
-  return /*#__PURE__*/React.createElement(FieldEditorProvider, props, /*#__PURE__*/React.createElement(Editor, null));
-};
+var FieldEditor = function FieldEditor(props) {
+  return /*#__PURE__*/_react.default.createElement(_FieldEditorContext.FieldEditorProvider, props, /*#__PURE__*/_react.default.createElement(Editor, null));
+};
+
+exports.FieldEditor = FieldEditor;

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

@@ -0,0 +1 @@
+{"version":3,"names":["t","i18n","namespace","fieldTypes","Editor","useFieldEditor","parent","depth","insertField","updateField","deleteField","fields","noConflict","editField","onFieldDrop","onEndDrag","field","dropTarget","length","item","row","index","padding","map","fieldId","type","pos","f","join","drag","isDragging","opacity","rowHandle","fieldIndex","fieldContainer","includes","get","fieldHandle","id","position","FieldEditor","props"],"sources":["FieldEditor.tsx"],"sourcesContent":["import React, { Fragment } from \"react\";\nimport get from \"lodash/get\";\nimport { Icon } from \"@webiny/ui/Icon\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { ReactComponent as HandleIcon } from \"~/admin/icons/round-drag_indicator-24px.svg\";\nimport { Center, Vertical, Horizontal } from \"../DropZone\";\nimport Draggable from \"../Draggable\";\nimport EditFieldDialog from \"./EditFieldDialog\";\nimport Field from \"./Field\";\nimport { rowHandle, fieldHandle, fieldContainer, Row, RowContainer } from \"./Styled\";\nimport { useFieldEditor } from \"./useFieldEditor\";\nimport { FieldEditorProvider } from \"./FieldEditorContext\";\nimport { CmsEditorField, CmsEditorFieldsLayout } from \"~/types\";\n\nconst t = i18n.namespace(\"app-headless-cms/admin/components/editor\");\n\nconst fieldTypes: string[] = [\"field\", \"newField\"];\n\nconst Editor: React.FC = () => {\n    const {\n        parent,\n        depth,\n        insertField,\n        updateField,\n        deleteField,\n        fields,\n        noConflict,\n        editField,\n        onFieldDrop,\n        onEndDrag,\n        field,\n        dropTarget\n    } = useFieldEditor();\n\n    return (\n        <Fragment>\n            {fields.length === 0 && (\n                <Center\n                    onDrop={item =>\n                        onFieldDrop(item, {\n                            row: 0,\n                            index: 0\n                        })\n                    }\n                    style={{ padding: \"5px 0 15px 0\" }}\n                >\n                    {t`Drop your first field here`}\n                </Center>\n            )}\n\n            {fields.map((row, index) => (\n                <Draggable\n                    beginDrag={{\n                        parent: parent ? parent.fieldId : null,\n                        type: \"row\",\n                        fields: row,\n                        pos: { row: index }\n                    }}\n                    endDrag={onEndDrag}\n                    key={row.map(f => f.fieldId).join(\".\")}\n                >\n                    {(\n                        {\n                            drag,\n                            isDragging\n                        } /* RowContainer start - includes drag handle, drop zones and the Row itself. */\n                    ) => (\n                        <RowContainer style={{ opacity: isDragging ? 0.3 : 1 }}>\n                            <div className={rowHandle} ref={drag}>\n                                <Icon icon={<HandleIcon />} />\n                            </div>\n                            <Horizontal\n                                data-testid={`cms-editor-row-droppable-top-${index}`}\n                                isVisible={noConflict()}\n                                onDrop={item => onFieldDrop(item, { row: index, index: null })}\n                            />\n                            {/* Row start - includes field drop zones and fields */}\n                            <Row data-testid={\"cms.editor.field-row\"}>\n                                {row.map((field, fieldIndex) => (\n                                    <Draggable\n                                        key={field.fieldId}\n                                        beginDrag={{\n                                            parent: parent ? parent.fieldId : null,\n                                            type: \"field\",\n                                            field,\n                                            pos: {\n                                                row: index,\n                                                index: fieldIndex\n                                            }\n                                        }}\n                                        endDrag={onEndDrag}\n                                    >\n                                        {({ drag }) => (\n                                            <div className={fieldContainer} ref={drag}>\n                                                <Vertical\n                                                    depth={depth}\n                                                    onDrop={item =>\n                                                        onFieldDrop(item, {\n                                                            row: index,\n                                                            index: fieldIndex\n                                                        })\n                                                    }\n                                                    isVisible={noConflict(\n                                                        item =>\n                                                            fieldTypes.includes(item.type) &&\n                                                            (row.length < 4 ||\n                                                                get(item, \"pos.row\") === index)\n                                                    )}\n                                                />\n\n                                                <div className={fieldHandle}>\n                                                    <Field\n                                                        parent={parent}\n                                                        field={field}\n                                                        onEdit={editField}\n                                                        onDelete={deleteField}\n                                                    />\n                                                </div>\n\n                                                {/* Field end */}\n                                                {fieldIndex === row.length - 1 && (\n                                                    <Vertical\n                                                        last\n                                                        depth={depth}\n                                                        isVisible={noConflict(\n                                                            item =>\n                                                                fieldTypes.includes(item.type) &&\n                                                                (row.length < 4 ||\n                                                                    get(item, \"pos.row\") === index)\n                                                        )}\n                                                        onDrop={item =>\n                                                            onFieldDrop(item, {\n                                                                row: index,\n                                                                index: fieldIndex + 1\n                                                            })\n                                                        }\n                                                    />\n                                                )}\n                                            </div>\n                                        )}\n                                    </Draggable>\n                                ))}\n                            </Row>\n                            {/* Row end */}\n                            {index === fields.length - 1 && (\n                                <Horizontal\n                                    data-testid={`cms-editor-row-droppable-bottom-${index}`}\n                                    last\n                                    isVisible={noConflict()}\n                                    onDrop={item =>\n                                        onFieldDrop(item, {\n                                            row: index + 1,\n                                            index: null\n                                        })\n                                    }\n                                />\n                            )}\n                        </RowContainer>\n                    )}\n                </Draggable>\n            ))}\n\n            <EditFieldDialog\n                field={field}\n                onClose={() => editField(null)}\n                onSubmit={field => {\n                    if (field.id) {\n                        updateField(field);\n                        editField(null);\n                        return;\n                    }\n                    insertField({ field, position: dropTarget });\n\n                    editField(null);\n                }}\n            />\n        </Fragment>\n    );\n};\n\nexport interface FieldEditorProps {\n    parent?: CmsEditorField;\n    layout: CmsEditorFieldsLayout;\n    fields: CmsEditorField[];\n    onChange: (params: { fields: CmsEditorField[]; layout: CmsEditorFieldsLayout }) => void;\n}\n\nexport const FieldEditor: React.FC<FieldEditorProps> = props => {\n    return (\n        <FieldEditorProvider {...props}>\n            <Editor />\n        </FieldEditorProvider>\n    );\n};\n"],"mappings":"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"}