@webiny/app-headless-cms 5.27.0-beta.0 → 5.28.0

package/admin/components/ContentModelEditor/Editor.js

@@ -1,42 +1,74 @@
-import _objectSpread from "@babel/runtime/helpers/objectSpread2";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-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.Editor = exports.EditContainer = void 0;
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _reactRouter = require("@webiny/react-router");
+
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+
+var _emotion = require("emotion");
+
+var _i18n = require("@webiny/app/i18n");
+
+var _Progress = require("@webiny/ui/Progress");
+
+var _SplitView = require("@webiny/app-admin/components/SplitView");
+
+var _Icon = require("@webiny/ui/Icon");
+
+var _Typography = require("@webiny/ui/Typography");
+
+var _Tabs = require("@webiny/ui/Tabs");
+
+var _roundAssignment24px = require("./icons/round-assignment-24px.svg");
+
+var _FieldsSidebar = require("./FieldsSidebar");
+
+var _FieldEditor = require("../FieldEditor");
+
+var _PreviewTab = require("./PreviewTab");
+
+var _Header = _interopRequireDefault(require("./Header"));
+
+var _DragPreview = _interopRequireDefault(require("../DragPreview"));
+
+var _useContentModelEditor = require("./useContentModelEditor");
 
 var _templateObject;
 
-import React, { useRef, useState } from "react";
-import { Prompt } from "@webiny/react-router";
-import styled from "@emotion/styled";
-import { css } from "emotion";
-import { i18n } from "@webiny/app/i18n";
-import { CircularProgress } from "@webiny/ui/Progress";
-import { LeftPanel, RightPanel, SplitView } from "@webiny/app-admin/components/SplitView";
-import { Icon } from "@webiny/ui/Icon";
-import { Typography } from "@webiny/ui/Typography";
-import { Tab, Tabs } from "@webiny/ui/Tabs";
-import { ReactComponent as FormIcon } from "./icons/round-assignment-24px.svg";
-import { FieldsSidebar } from "./FieldsSidebar";
-import { FieldEditor } from "../FieldEditor";
-import { PreviewTab } from "./PreviewTab";
-import Header from "./Header";
-import DragPreview from "../DragPreview";
-import { useContentModelEditor } from "./useContentModelEditor";
-var t = i18n.ns("app-headless-cms/admin/editor");
-var prompt = t(_templateObject || (_templateObject = _taggedTemplateLiteral(["There are some unsaved changes! Are you sure you want to navigate away and discard all changes?"])));
-var ContentContainer = /*#__PURE__*/styled("div", {
+var t = _i18n.i18n.ns("app-headless-cms/admin/editor");
+
+var prompt = t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["There are some unsaved changes! Are you sure you want to navigate away and discard all changes?"])));
+var ContentContainer = /*#__PURE__*/(0, _styled.default)("div", {
   target: "epn2fgg0",
   label: "ContentContainer"
 })({
   paddingTop: 65
 });
-export var EditContainer = /*#__PURE__*/styled("div", {
+var EditContainer = /*#__PURE__*/(0, _styled.default)("div", {
   target: "epn2fgg1",
   label: "EditContainer"
 })({
   padding: 40,
   position: "relative"
 });
-var LeftBarTitle = /*#__PURE__*/styled("div", {
+exports.EditContainer = EditContainer;
+var LeftBarTitle = /*#__PURE__*/(0, _styled.default)("div", {
   target: "epn2fgg2",
   label: "LeftBarTitle"
 })({
@@ -46,12 +78,12 @@ var LeftBarTitle = /*#__PURE__*/styled("div", {
   padding: 25,
   color: "var(--mdc-theme-on-surface)"
 });
-var titleIcon = /*#__PURE__*/css({
+var titleIcon = /*#__PURE__*/(0, _emotion.css)({
   height: 24,
   marginRight: 15,
   color: "var(--mdc-theme-primary)"
 }, "label:titleIcon;");
-var LeftBarFieldList = /*#__PURE__*/styled("div", {
+var LeftBarFieldList = /*#__PURE__*/(0, _styled.default)("div", {
   target: "epn2fgg3",
   label: "LeftBarFieldList"
 })({
@@ -59,23 +91,24 @@ var LeftBarFieldList = /*#__PURE__*/styled("div", {
   overflow: "auto",
   height: "calc(100vh - 250px)"
 });
-var formTabs = /*#__PURE__*/css({
+var formTabs = /*#__PURE__*/(0, _emotion.css)({
   "&.webiny-ui-tabs": {
     ".webiny-ui-tabs__tab-bar": {
       backgroundColor: "var(--mdc-theme-surface)"
     }
   }
 }, "label:formTabs;");
-export var Editor = function Editor() {
-  var _useContentModelEdito = useContentModelEditor(),
+
+var Editor = function Editor() {
+  var _useContentModelEdito = (0, _useContentModelEditor.useContentModelEditor)(),
       data = _useContentModelEdito.data,
       setData = _useContentModelEdito.setData,
       isPristine = _useContentModelEdito.isPristine;
 
-  var tabsRef = useRef(null);
+  var tabsRef = (0, _react.useRef)(null);
 
-  var _useState = useState(0),
-      _useState2 = _slicedToArray(_useState, 2),
+  var _useState = (0, _react.useState)(0),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
       activeTabIndex = _useState2[0],
       setActiveTabIndex = _useState2[1];
 
@@ -83,7 +116,7 @@ export var Editor = function Editor() {
     var fields = _ref.fields,
         layout = _ref.layout;
     setData(function (data) {
-      return _objectSpread(_objectSpread({}, data), {}, {
+      return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, data), {}, {
         fields: fields,
         layout: layout
       });
@@ -91,24 +124,24 @@ export var Editor = function Editor() {
   };
 
   if (!data) {
-    return /*#__PURE__*/React.createElement(CircularProgress, {
+    return /*#__PURE__*/_react.default.createElement(_Progress.CircularProgress, {
       label: "Loading content model..."
     });
   }
 
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/_react.default.createElement("div", {
     className: "content-model-editor"
-  }, /*#__PURE__*/React.createElement(Prompt, {
+  }, /*#__PURE__*/_react.default.createElement(_reactRouter.Prompt, {
     when: !isPristine,
     message: prompt
-  }), /*#__PURE__*/React.createElement(Header, null), /*#__PURE__*/React.createElement(ContentContainer, null, /*#__PURE__*/React.createElement(SplitView, null, /*#__PURE__*/React.createElement(LeftPanel, {
+  }), /*#__PURE__*/_react.default.createElement(_Header.default, null), /*#__PURE__*/_react.default.createElement(ContentContainer, null, /*#__PURE__*/_react.default.createElement(_SplitView.SplitView, null, /*#__PURE__*/_react.default.createElement(_SplitView.LeftPanel, {
     span: 4
-  }, /*#__PURE__*/React.createElement(LeftBarTitle, null, /*#__PURE__*/React.createElement(Icon, {
+  }, /*#__PURE__*/_react.default.createElement(LeftBarTitle, null, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
     className: titleIcon,
-    icon: /*#__PURE__*/React.createElement(FormIcon, null)
-  }), /*#__PURE__*/React.createElement(Typography, {
+    icon: /*#__PURE__*/_react.default.createElement(_roundAssignment24px.ReactComponent, null)
+  }), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "headline6"
-  }, "Fields")), /*#__PURE__*/React.createElement(LeftBarFieldList, null, /*#__PURE__*/React.createElement(FieldsSidebar, {
+  }, "Fields")), /*#__PURE__*/_react.default.createElement(LeftBarFieldList, null, /*#__PURE__*/_react.default.createElement(_FieldsSidebar.FieldsSidebar, {
     onFieldDragStart: function onFieldDragStart() {
       if (!tabsRef.current) {
         return;
@@ -116,25 +149,27 @@ export var Editor = function Editor() {
 
       tabsRef.current.switchTab(0);
     }
-  }))), /*#__PURE__*/React.createElement(RightPanel, {
+  }))), /*#__PURE__*/_react.default.createElement(_SplitView.RightPanel, {
     span: 8
-  }, /*#__PURE__*/React.createElement(Tabs, {
+  }, /*#__PURE__*/_react.default.createElement(_Tabs.Tabs, {
     className: formTabs,
     ref: tabsRef,
     onActivate: function onActivate(e) {
       return setActiveTabIndex(e);
     }
-  }, /*#__PURE__*/React.createElement(Tab, {
+  }, /*#__PURE__*/_react.default.createElement(_Tabs.Tab, {
     label: "Edit",
     "data-testid": "cms.editor.tab.edit"
-  }, /*#__PURE__*/React.createElement(EditContainer, null, /*#__PURE__*/React.createElement(FieldEditor, {
+  }, /*#__PURE__*/_react.default.createElement(EditContainer, null, /*#__PURE__*/_react.default.createElement(_FieldEditor.FieldEditor, {
     fields: data.fields,
     layout: data.layout || [],
     onChange: onChange
-  }))), /*#__PURE__*/React.createElement(Tab, {
+  }))), /*#__PURE__*/_react.default.createElement(_Tabs.Tab, {
     label: "Preview",
     "data-testid": "cms.editor.tab.preview"
-  }, /*#__PURE__*/React.createElement(PreviewTab, {
+  }, /*#__PURE__*/_react.default.createElement(_PreviewTab.PreviewTab, {
     activeTab: activeTabIndex === 1
-  })))))), /*#__PURE__*/React.createElement(DragPreview, null));
-};
+  })))))), /*#__PURE__*/_react.default.createElement(_DragPreview.default, null));
+};
+
+exports.Editor = Editor;

package/admin/components/ContentModelEditor/Editor.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Editor.tsx"],"names":["React","useRef","useState","Prompt","styled","css","i18n","CircularProgress","LeftPanel","RightPanel","SplitView","Icon","Typography","Tab","Tabs","ReactComponent","FormIcon","FieldsSidebar","FieldEditor","PreviewTab","Header","DragPreview","useContentModelEditor","t","ns","prompt","ContentContainer","paddingTop","EditContainer","padding","position","LeftBarTitle","borderBottom","display","alignItems","color","titleIcon","height","marginRight","LeftBarFieldList","overflow","formTabs","backgroundColor","Editor","data","setData","isPristine","tabsRef","activeTabIndex","setActiveTabIndex","onChange","fields","layout","current","switchTab","e"],"mappings":";;;;;;AAAA,OAAOA,KAAP,IAAgBC,MAAhB,EAAwBC,QAAxB,QAAwC,OAAxC;AACA,SAASC,MAAT,QAAuB,sBAAvB;AACA,OAAOC,MAAP,MAAmB,iBAAnB;AACA,SAASC,GAAT,QAAoB,SAApB;AACA,SAASC,IAAT,QAAqB,kBAArB;AACA,SAASC,gBAAT,QAAiC,qBAAjC;AACA,SAASC,SAAT,EAAoBC,UAApB,EAAgCC,SAAhC,QAAiD,wCAAjD;AACA,SAASC,IAAT,QAAqB,iBAArB;AACA,SAASC,UAAT,QAA2B,uBAA3B;AACA,SAASC,GAAT,EAAcC,IAAd,QAA0B,iBAA1B;AACA,SAASC,cAAc,IAAIC,QAA3B;AACA,SAASC,aAAT;AACA,SAASC,WAAT;AACA,SAASC,UAAT;AACA,OAAOC,MAAP;AACA,OAAOC,WAAP;AACA,SAASC,qBAAT;AAGA,IAAMC,CAAC,GAAGjB,IAAI,CAACkB,EAAL,CAAQ,+BAAR,CAAV;AAEA,IAAMC,MAAM,GAAGF,CAAH,oKAAZ;AAEA,IAAMG,gBAAgB,gBAAGtB,MAAH,CAAU,KAAV;AAAA;AAAA;AAAA,GAAiB;AACnCuB,EAAAA,UAAU,EAAE;AADuB,CAAjB,CAAtB;AAIA,OAAO,IAAMC,aAAa,gBAAGxB,MAAH,CAAU,KAAV;AAAA;AAAA;AAAA,GAAiB;AACvCyB,EAAAA,OAAO,EAAE,EAD8B;AAEvCC,EAAAA,QAAQ,EAAE;AAF6B,CAAjB,CAAnB;AAKP,IAAMC,YAAY,gBAAG3B,MAAH,CAAU,KAAV;AAAA;AAAA;AAAA,GAAiB;AAC/B4B,EAAAA,YAAY,EAAE,0CADiB;AAE/BC,EAAAA,OAAO,EAAE,MAFsB;AAG/BC,EAAAA,UAAU,EAAE,QAHmB;AAI/BL,EAAAA,OAAO,EAAE,EAJsB;AAK/BM,EAAAA,KAAK,EAAE;AALwB,CAAjB,CAAlB;AAQA,IAAMC,SAAS,gBAAG/B,GAAG,CAAC;AAClBgC,EAAAA,MAAM,EAAE,EADU;AAElBC,EAAAA,WAAW,EAAE,EAFK;AAGlBH,EAAAA,KAAK,EAAE;AAHW,CAAD,qBAArB;AAMA,IAAMI,gBAAgB,gBAAGnC,MAAH,CAAU,KAAV;AAAA;AAAA;AAAA,GAAiB;AACnCyB,EAAAA,OAAO,EAAE,EAD0B;AAEnCW,EAAAA,QAAQ,EAAE,MAFyB;AAGnCH,EAAAA,MAAM,EAAE;AAH2B,CAAjB,CAAtB;AAMA,IAAMI,QAAQ,gBAAGpC,GAAG,CAAC;AACjB,sBAAoB;AAChB,gCAA4B;AACxBqC,MAAAA,eAAe,EAAE;AADO;AADZ;AADH,CAAD,oBAApB;AAaA,OAAO,IAAMC,MAAgB,GAAG,SAAnBA,MAAmB,GAAM;AAClC,8BAAsCrB,qBAAqB,EAA3D;AAAA,MAAQsB,IAAR,yBAAQA,IAAR;AAAA,MAAcC,OAAd,yBAAcA,OAAd;AAAA,MAAuBC,UAAvB,yBAAuBA,UAAvB;;AAEA,MAAMC,OAAO,GAAG9C,MAAM,CAAc,IAAd,CAAtB;;AACA,kBAA4CC,QAAQ,CAAS,CAAT,CAApD;AAAA;AAAA,MAAO8C,cAAP;AAAA,MAAuBC,iBAAvB;;AAEA,MAAMC,QAAQ,GAAG,SAAXA,QAAW,OAAwC;AAAA,QAArCC,MAAqC,QAArCA,MAAqC;AAAA,QAA7BC,MAA6B,QAA7BA,MAA6B;AACrDP,IAAAA,OAAO,CAAC,UAAAD,IAAI;AAAA,6CAAUA,IAAV;AAAgBO,QAAAA,MAAM,EAANA,MAAhB;AAAwBC,QAAAA,MAAM,EAANA;AAAxB;AAAA,KAAL,CAAP;AACH,GAFD;;AAIA,MAAI,CAACR,IAAL,EAAW;AACP,wBAAO,oBAAC,gBAAD;AAAkB,MAAA,KAAK,EAAE;AAAzB,MAAP;AACH;;AAED,sBACI;AAAK,IAAA,SAAS,EAAE;AAAhB,kBACI,oBAAC,MAAD;AAAQ,IAAA,IAAI,EAAE,CAACE,UAAf;AAA2B,IAAA,OAAO,EAAErB;AAApC,IADJ,eAEI,oBAAC,MAAD,OAFJ,eAGI,oBAAC,gBAAD,qBACI,oBAAC,SAAD,qBACI,oBAAC,SAAD;AAAW,IAAA,IAAI,EAAE;AAAjB,kBACI,oBAAC,YAAD,qBACI,oBAAC,IAAD;AAAM,IAAA,SAAS,EAAEW,SAAjB;AAA4B,IAAA,IAAI,eAAE,oBAAC,QAAD;AAAlC,IADJ,eAEI,oBAAC,UAAD;AAAY,IAAA,GAAG,EAAE;AAAjB,cAFJ,CADJ,eAKI,oBAAC,gBAAD,qBACI,oBAAC,aAAD;AACI,IAAA,gBAAgB,EAAE,4BAAM;AACpB,UAAI,CAACW,OAAO,CAACM,OAAb,EAAsB;AAClB;AACH;;AACDN,MAAAA,OAAO,CAACM,OAAR,CAAgBC,SAAhB,CAA0B,CAA1B;AACH;AANL,IADJ,CALJ,CADJ,eAiBI,oBAAC,UAAD;AAAY,IAAA,IAAI,EAAE;AAAlB,kBACI,oBAAC,IAAD;AACI,IAAA,SAAS,EAAEb,QADf;AAEI,IAAA,GAAG,EAAEM,OAFT;AAGI,IAAA,UAAU,EAAE,oBAAAQ,CAAC;AAAA,aAAIN,iBAAiB,CAACM,CAAD,CAArB;AAAA;AAHjB,kBAKI,oBAAC,GAAD;AAAK,IAAA,KAAK,EAAE,MAAZ;AAAoB,mBAAa;AAAjC,kBACI,oBAAC,aAAD,qBACI,oBAAC,WAAD;AACI,IAAA,MAAM,EAAEX,IAAI,CAACO,MADjB;AAEI,IAAA,MAAM,EAAEP,IAAI,CAACQ,MAAL,IAAe,EAF3B;AAGI,IAAA,QAAQ,EAAEF;AAHd,IADJ,CADJ,CALJ,eAcI,oBAAC,GAAD;AAAK,IAAA,KAAK,EAAE,SAAZ;AAAuB,mBAAa;AAApC,kBACI,oBAAC,UAAD;AAAY,IAAA,SAAS,EAAEF,cAAc,KAAK;AAA1C,IADJ,CAdJ,CADJ,CAjBJ,CADJ,CAHJ,eA2CI,oBAAC,WAAD,OA3CJ,CADJ;AA+CH,CA7DM","sourcesContent":["import React, { useRef, useState } from \"react\";\nimport { Prompt } from \"@webiny/react-router\";\nimport styled from \"@emotion/styled\";\nimport { css } from \"emotion\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { CircularProgress } from \"@webiny/ui/Progress\";\nimport { LeftPanel, RightPanel, SplitView } from \"@webiny/app-admin/components/SplitView\";\nimport { Icon } from \"@webiny/ui/Icon\";\nimport { Typography } from \"@webiny/ui/Typography\";\nimport { Tab, Tabs } from \"@webiny/ui/Tabs\";\nimport { ReactComponent as FormIcon } from \"./icons/round-assignment-24px.svg\";\nimport { FieldsSidebar } from \"./FieldsSidebar\";\nimport { FieldEditor } from \"../FieldEditor\";\nimport { PreviewTab } from \"./PreviewTab\";\nimport Header from \"./Header\";\nimport DragPreview from \"../DragPreview\";\nimport { useContentModelEditor } from \"./useContentModelEditor\";\nimport { CmsEditorField, CmsEditorFieldsLayout } from \"~/types\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/editor\");\n\nconst prompt = t`There are some unsaved changes! Are you sure you want to navigate away and discard all changes?`;\n\nconst ContentContainer = styled(\"div\")({\n    paddingTop: 65\n});\n\nexport const EditContainer = styled(\"div\")({\n    padding: 40,\n    position: \"relative\"\n});\n\nconst LeftBarTitle = styled(\"div\")({\n    borderBottom: \"1px solid var(--mdc-theme-on-background)\",\n    display: \"flex\",\n    alignItems: \"center\",\n    padding: 25,\n    color: \"var(--mdc-theme-on-surface)\"\n});\n\nconst titleIcon = css({\n    height: 24,\n    marginRight: 15,\n    color: \"var(--mdc-theme-primary)\"\n});\n\nconst LeftBarFieldList = styled(\"div\")({\n    padding: 40,\n    overflow: \"auto\",\n    height: \"calc(100vh - 250px)\"\n});\n\nconst formTabs = css({\n    \"&.webiny-ui-tabs\": {\n        \".webiny-ui-tabs__tab-bar\": {\n            backgroundColor: \"var(--mdc-theme-surface)\"\n        }\n    }\n});\n\ninterface OnChangeParams {\n    fields: CmsEditorField[];\n    layout: CmsEditorFieldsLayout;\n}\n\nexport const Editor: React.FC = () => {\n    const { data, setData, isPristine } = useContentModelEditor();\n\n    const tabsRef = useRef<Tabs | null>(null);\n    const [activeTabIndex, setActiveTabIndex] = useState<number>(0);\n\n    const onChange = ({ fields, layout }: OnChangeParams) => {\n        setData(data => ({ ...data, fields, layout }));\n    };\n\n    if (!data) {\n        return <CircularProgress label={\"Loading content model...\"} />;\n    }\n\n    return (\n        <div className={\"content-model-editor\"}>\n            <Prompt when={!isPristine} message={prompt} />\n            <Header />\n            <ContentContainer>\n                <SplitView>\n                    <LeftPanel span={4}>\n                        <LeftBarTitle>\n                            <Icon className={titleIcon} icon={<FormIcon />} />\n                            <Typography use={\"headline6\"}>Fields</Typography>\n                        </LeftBarTitle>\n                        <LeftBarFieldList>\n                            <FieldsSidebar\n                                onFieldDragStart={() => {\n                                    if (!tabsRef.current) {\n                                        return;\n                                    }\n                                    tabsRef.current.switchTab(0);\n                                }}\n                            />\n                        </LeftBarFieldList>\n                    </LeftPanel>\n                    <RightPanel span={8}>\n                        <Tabs\n                            className={formTabs}\n                            ref={tabsRef}\n                            onActivate={e => setActiveTabIndex(e)}\n                        >\n                            <Tab label={\"Edit\"} data-testid={\"cms.editor.tab.edit\"}>\n                                <EditContainer>\n                                    <FieldEditor\n                                        fields={data.fields}\n                                        layout={data.layout || []}\n                                        onChange={onChange}\n                                    />\n                                </EditContainer>\n                            </Tab>\n                            <Tab label={\"Preview\"} data-testid={\"cms.editor.tab.preview\"}>\n                                <PreviewTab activeTab={activeTabIndex === 1} />\n                            </Tab>\n                        </Tabs>\n                    </RightPanel>\n                </SplitView>\n            </ContentContainer>\n            <DragPreview />\n        </div>\n    );\n};\n"]}
+{"version":3,"names":["t","i18n","ns","prompt","ContentContainer","styled","paddingTop","EditContainer","padding","position","LeftBarTitle","borderBottom","display","alignItems","color","titleIcon","css","height","marginRight","LeftBarFieldList","overflow","formTabs","backgroundColor","Editor","useContentModelEditor","data","setData","isPristine","tabsRef","useRef","useState","activeTabIndex","setActiveTabIndex","onChange","fields","layout","current","switchTab","e"],"sources":["Editor.tsx"],"sourcesContent":["import React, { useRef, useState } from \"react\";\nimport { Prompt } from \"@webiny/react-router\";\nimport styled from \"@emotion/styled\";\nimport { css } from \"emotion\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { CircularProgress } from \"@webiny/ui/Progress\";\nimport { LeftPanel, RightPanel, SplitView } from \"@webiny/app-admin/components/SplitView\";\nimport { Icon } from \"@webiny/ui/Icon\";\nimport { Typography } from \"@webiny/ui/Typography\";\nimport { Tab, Tabs } from \"@webiny/ui/Tabs\";\nimport { ReactComponent as FormIcon } from \"./icons/round-assignment-24px.svg\";\nimport { FieldsSidebar } from \"./FieldsSidebar\";\nimport { FieldEditor } from \"../FieldEditor\";\nimport { PreviewTab } from \"./PreviewTab\";\nimport Header from \"./Header\";\nimport DragPreview from \"../DragPreview\";\nimport { useContentModelEditor } from \"./useContentModelEditor\";\nimport { CmsEditorField, CmsEditorFieldsLayout } from \"~/types\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/editor\");\n\nconst prompt = t`There are some unsaved changes! Are you sure you want to navigate away and discard all changes?`;\n\nconst ContentContainer = styled(\"div\")({\n    paddingTop: 65\n});\n\nexport const EditContainer = styled(\"div\")({\n    padding: 40,\n    position: \"relative\"\n});\n\nconst LeftBarTitle = styled(\"div\")({\n    borderBottom: \"1px solid var(--mdc-theme-on-background)\",\n    display: \"flex\",\n    alignItems: \"center\",\n    padding: 25,\n    color: \"var(--mdc-theme-on-surface)\"\n});\n\nconst titleIcon = css({\n    height: 24,\n    marginRight: 15,\n    color: \"var(--mdc-theme-primary)\"\n});\n\nconst LeftBarFieldList = styled(\"div\")({\n    padding: 40,\n    overflow: \"auto\",\n    height: \"calc(100vh - 250px)\"\n});\n\nconst formTabs = css({\n    \"&.webiny-ui-tabs\": {\n        \".webiny-ui-tabs__tab-bar\": {\n            backgroundColor: \"var(--mdc-theme-surface)\"\n        }\n    }\n});\n\ninterface OnChangeParams {\n    fields: CmsEditorField[];\n    layout: CmsEditorFieldsLayout;\n}\n\nexport const Editor: React.FC = () => {\n    const { data, setData, isPristine } = useContentModelEditor();\n\n    const tabsRef = useRef<Tabs | null>(null);\n    const [activeTabIndex, setActiveTabIndex] = useState<number>(0);\n\n    const onChange = ({ fields, layout }: OnChangeParams) => {\n        setData(data => ({ ...data, fields, layout }));\n    };\n\n    if (!data) {\n        return <CircularProgress label={\"Loading content model...\"} />;\n    }\n\n    return (\n        <div className={\"content-model-editor\"}>\n            <Prompt when={!isPristine} message={prompt} />\n            <Header />\n            <ContentContainer>\n                <SplitView>\n                    <LeftPanel span={4}>\n                        <LeftBarTitle>\n                            <Icon className={titleIcon} icon={<FormIcon />} />\n                            <Typography use={\"headline6\"}>Fields</Typography>\n                        </LeftBarTitle>\n                        <LeftBarFieldList>\n                            <FieldsSidebar\n                                onFieldDragStart={() => {\n                                    if (!tabsRef.current) {\n                                        return;\n                                    }\n                                    tabsRef.current.switchTab(0);\n                                }}\n                            />\n                        </LeftBarFieldList>\n                    </LeftPanel>\n                    <RightPanel span={8}>\n                        <Tabs\n                            className={formTabs}\n                            ref={tabsRef}\n                            onActivate={e => setActiveTabIndex(e)}\n                        >\n                            <Tab label={\"Edit\"} data-testid={\"cms.editor.tab.edit\"}>\n                                <EditContainer>\n                                    <FieldEditor\n                                        fields={data.fields}\n                                        layout={data.layout || []}\n                                        onChange={onChange}\n                                    />\n                                </EditContainer>\n                            </Tab>\n                            <Tab label={\"Preview\"} data-testid={\"cms.editor.tab.preview\"}>\n                                <PreviewTab activeTab={activeTabIndex === 1} />\n                            </Tab>\n                        </Tabs>\n                    </RightPanel>\n                </SplitView>\n            </ContentContainer>\n            <DragPreview />\n        </div>\n    );\n};\n"],"mappings":"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"}

package/admin/components/ContentModelEditor/FieldsSidebar.js

@@ -1,9 +1,23 @@
-import React from "react";
-import { plugins } from "@webiny/plugins";
-import styled from "@emotion/styled";
-import { Icon } from "@webiny/ui/Icon";
-import Draggable from "../Draggable";
-var FieldContainer = /*#__PURE__*/styled("div", {
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FieldsSidebar = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _plugins = require("@webiny/plugins");
+
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+
+var _Icon = require("@webiny/ui/Icon");
+
+var _Draggable = _interopRequireDefault(require("../Draggable"));
+
+var FieldContainer = /*#__PURE__*/(0, _styled.default)("div", {
   target: "e1s2p6i00",
   label: "FieldContainer"
 })({
@@ -24,11 +38,11 @@ var FieldContainer = /*#__PURE__*/styled("div", {
     marginBottom: 0
   }
 });
-var FileInfo = /*#__PURE__*/styled("div", {
+var FileInfo = /*#__PURE__*/(0, _styled.default)("div", {
   target: "e1s2p6i01",
   label: "FileInfo"
 })({});
-var FieldLabel = /*#__PURE__*/styled("div", {
+var FieldLabel = /*#__PURE__*/(0, _styled.default)("div", {
   target: "e1s2p6i02",
   label: "FieldLabel"
 })({
@@ -36,14 +50,14 @@ var FieldLabel = /*#__PURE__*/styled("div", {
   lineHeight: "145%",
   color: "var(--mdc-theme-on-surface)"
 });
-var FieldDescription = /*#__PURE__*/styled("div", {
+var FieldDescription = /*#__PURE__*/(0, _styled.default)("div", {
   target: "e1s2p6i03",
   label: "FieldDescription"
 })({
   fontSize: 14,
   color: "var(--mdc-theme-text-secondary-on-background)"
 });
-var FieldHandle = /*#__PURE__*/styled("div", {
+var FieldHandle = /*#__PURE__*/(0, _styled.default)("div", {
   target: "e1s2p6i04",
   label: "FieldHandle"
 })({
@@ -58,34 +72,38 @@ var Field = function Field(props) {
       label = _props$fieldType.label,
       icon = _props$fieldType.icon,
       description = _props$fieldType.description;
-  return /*#__PURE__*/React.createElement(Draggable, {
+  return /*#__PURE__*/_react.default.createElement(_Draggable.default, {
     beginDrag: {
       type: "newField",
       fieldType: type
     }
   }, function (_ref) {
     var drag = _ref.drag;
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/_react.default.createElement("div", {
       ref: drag,
       style: {
         marginBottom: 10
       },
       "data-testid": "cms-editor-fields-field-".concat(type),
       onDragStart: onFieldDragStart
-    }, /*#__PURE__*/React.createElement(FieldContainer, null, /*#__PURE__*/React.createElement(FieldHandle, null, /*#__PURE__*/React.createElement(Icon, {
+    }, /*#__PURE__*/_react.default.createElement(FieldContainer, null, /*#__PURE__*/_react.default.createElement(FieldHandle, null, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
       icon: icon
-    })), /*#__PURE__*/React.createElement(FileInfo, null, /*#__PURE__*/React.createElement(FieldLabel, null, label), /*#__PURE__*/React.createElement(FieldDescription, null, description))));
+    })), /*#__PURE__*/_react.default.createElement(FileInfo, null, /*#__PURE__*/_react.default.createElement(FieldLabel, null, label), /*#__PURE__*/_react.default.createElement(FieldDescription, null, description))));
   });
 };
 
-export var FieldsSidebar = function FieldsSidebar(_ref2) {
+var FieldsSidebar = function FieldsSidebar(_ref2) {
   var onFieldDragStart = _ref2.onFieldDragStart;
-  var fieldTypePlugin = plugins.byType("cms-editor-field-type");
-  return /*#__PURE__*/React.createElement(React.Fragment, null, fieldTypePlugin.map(function (fieldPlugin) {
-    return /*#__PURE__*/React.createElement(Field, {
+
+  var fieldTypePlugin = _plugins.plugins.byType("cms-editor-field-type");
+
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, fieldTypePlugin.map(function (fieldPlugin) {
+    return /*#__PURE__*/_react.default.createElement(Field, {
       key: fieldPlugin.field.type,
       fieldType: fieldPlugin.field,
       onFieldDragStart: onFieldDragStart
     });
   }));
-};
+};
+
+exports.FieldsSidebar = FieldsSidebar;

package/admin/components/ContentModelEditor/FieldsSidebar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["FieldsSidebar.tsx"],"names":["React","plugins","styled","Icon","Draggable","FieldContainer","padding","marginBottom","display","width","backgroundColor","borderRadius","boxSizing","cursor","opacity","transition","FileInfo","FieldLabel","textTransform","lineHeight","color","FieldDescription","fontSize","FieldHandle","marginRight","Field","props","onFieldDragStart","fieldType","type","label","icon","description","drag","FieldsSidebar","fieldTypePlugin","byType","map","fieldPlugin","field"],"mappings":"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","sourcesContent":["import React, { DragEventHandler } from \"react\";\nimport { plugins } from \"@webiny/plugins\";\nimport styled from \"@emotion/styled\";\nimport { Icon } from \"@webiny/ui/Icon\";\nimport Draggable from \"../Draggable\";\nimport { CmsEditorFieldTypePlugin } from \"~/types\";\n\nconst FieldContainer = styled(\"div\")({\n    padding: \"10px 15px\",\n    marginBottom: 20,\n    display: \"flex\",\n    width: \"100%\",\n    backgroundColor: \"var(--mdc-theme-on-background)\",\n    borderRadius: 15,\n    boxSizing: \"border-box\",\n    cursor: \"grab\",\n    opacity: 1,\n    transition: \"opacity 225ms\",\n    \"&:hover\": {\n        opacity: 0.8\n    },\n    \"&:last-child\": {\n        marginBottom: 0\n    }\n});\n\nconst FileInfo = styled(\"div\")({});\n\nconst FieldLabel = styled(\"div\")({\n    textTransform: \"uppercase\",\n    lineHeight: \"145%\",\n    color: \"var(--mdc-theme-on-surface)\"\n});\n\nconst FieldDescription = styled(\"div\")({\n    fontSize: 14,\n    color: \"var(--mdc-theme-text-secondary-on-background)\"\n});\n\nconst FieldHandle = styled(\"div\")({\n    marginRight: 15,\n    color: \"var(--mdc-theme-on-surface)\"\n});\n\ninterface FieldProps {\n    onFieldDragStart: DragEventHandler;\n    fieldType: CmsEditorFieldTypePlugin[\"field\"];\n}\nconst Field: React.FC<FieldProps> = props => {\n    const {\n        onFieldDragStart,\n        fieldType: { type, label, icon, description }\n    } = props;\n    return (\n        <Draggable beginDrag={{ type: \"newField\", fieldType: type }}>\n            {({ drag }) => (\n                <div\n                    ref={drag}\n                    style={{ marginBottom: 10 }}\n                    data-testid={`cms-editor-fields-field-${type}`}\n                    onDragStart={onFieldDragStart}\n                >\n                    <FieldContainer>\n                        <FieldHandle>\n                            <Icon icon={icon as React.ReactElement} />\n                        </FieldHandle>\n                        <FileInfo>\n                            <FieldLabel>{label}</FieldLabel>\n                            <FieldDescription>{description}</FieldDescription>\n                        </FileInfo>\n                    </FieldContainer>\n                </div>\n            )}\n        </Draggable>\n    );\n};\n\ninterface FieldsSidebarProps {\n    onFieldDragStart: DragEventHandler;\n}\nexport const FieldsSidebar: React.FC<FieldsSidebarProps> = ({ onFieldDragStart }) => {\n    const fieldTypePlugin = plugins.byType<CmsEditorFieldTypePlugin>(\"cms-editor-field-type\");\n\n    return (\n        <React.Fragment>\n            {fieldTypePlugin.map(fieldPlugin => (\n                <Field\n                    key={fieldPlugin.field.type}\n                    fieldType={fieldPlugin.field}\n                    onFieldDragStart={onFieldDragStart}\n                />\n            ))}\n        </React.Fragment>\n    );\n};\n"]}
+{"version":3,"names":["FieldContainer","styled","padding","marginBottom","display","width","backgroundColor","borderRadius","boxSizing","cursor","opacity","transition","FileInfo","FieldLabel","textTransform","lineHeight","color","FieldDescription","fontSize","FieldHandle","marginRight","Field","props","onFieldDragStart","fieldType","type","label","icon","description","drag","FieldsSidebar","fieldTypePlugin","plugins","byType","map","fieldPlugin","field"],"sources":["FieldsSidebar.tsx"],"sourcesContent":["import React, { DragEventHandler } from \"react\";\nimport { plugins } from \"@webiny/plugins\";\nimport styled from \"@emotion/styled\";\nimport { Icon } from \"@webiny/ui/Icon\";\nimport Draggable from \"../Draggable\";\nimport { CmsEditorFieldTypePlugin } from \"~/types\";\n\nconst FieldContainer = styled(\"div\")({\n    padding: \"10px 15px\",\n    marginBottom: 20,\n    display: \"flex\",\n    width: \"100%\",\n    backgroundColor: \"var(--mdc-theme-on-background)\",\n    borderRadius: 15,\n    boxSizing: \"border-box\",\n    cursor: \"grab\",\n    opacity: 1,\n    transition: \"opacity 225ms\",\n    \"&:hover\": {\n        opacity: 0.8\n    },\n    \"&:last-child\": {\n        marginBottom: 0\n    }\n});\n\nconst FileInfo = styled(\"div\")({});\n\nconst FieldLabel = styled(\"div\")({\n    textTransform: \"uppercase\",\n    lineHeight: \"145%\",\n    color: \"var(--mdc-theme-on-surface)\"\n});\n\nconst FieldDescription = styled(\"div\")({\n    fontSize: 14,\n    color: \"var(--mdc-theme-text-secondary-on-background)\"\n});\n\nconst FieldHandle = styled(\"div\")({\n    marginRight: 15,\n    color: \"var(--mdc-theme-on-surface)\"\n});\n\ninterface FieldProps {\n    onFieldDragStart: DragEventHandler;\n    fieldType: CmsEditorFieldTypePlugin[\"field\"];\n}\nconst Field: React.FC<FieldProps> = props => {\n    const {\n        onFieldDragStart,\n        fieldType: { type, label, icon, description }\n    } = props;\n    return (\n        <Draggable beginDrag={{ type: \"newField\", fieldType: type }}>\n            {({ drag }) => (\n                <div\n                    ref={drag}\n                    style={{ marginBottom: 10 }}\n                    data-testid={`cms-editor-fields-field-${type}`}\n                    onDragStart={onFieldDragStart}\n                >\n                    <FieldContainer>\n                        <FieldHandle>\n                            <Icon icon={icon as React.ReactElement} />\n                        </FieldHandle>\n                        <FileInfo>\n                            <FieldLabel>{label}</FieldLabel>\n                            <FieldDescription>{description}</FieldDescription>\n                        </FileInfo>\n                    </FieldContainer>\n                </div>\n            )}\n        </Draggable>\n    );\n};\n\ninterface FieldsSidebarProps {\n    onFieldDragStart: DragEventHandler;\n}\nexport const FieldsSidebar: React.FC<FieldsSidebarProps> = ({ onFieldDragStart }) => {\n    const fieldTypePlugin = plugins.byType<CmsEditorFieldTypePlugin>(\"cms-editor-field-type\");\n\n    return (\n        <React.Fragment>\n            {fieldTypePlugin.map(fieldPlugin => (\n                <Field\n                    key={fieldPlugin.field.type}\n                    fieldType={fieldPlugin.field}\n                    onFieldDragStart={onFieldDragStart}\n                />\n            ))}\n        </React.Fragment>\n    );\n};\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AAGA,IAAMA,cAAc,oBAAGC,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EACjCC,OAAO,EAAE,WADwB;EAEjCC,YAAY,EAAE,EAFmB;EAGjCC,OAAO,EAAE,MAHwB;EAIjCC,KAAK,EAAE,MAJ0B;EAKjCC,eAAe,EAAE,gCALgB;EAMjCC,YAAY,EAAE,EANmB;EAOjCC,SAAS,EAAE,YAPsB;EAQjCC,MAAM,EAAE,MARyB;EASjCC,OAAO,EAAE,CATwB;EAUjCC,UAAU,EAAE,eAVqB;EAWjC,WAAW;IACPD,OAAO,EAAE;EADF,CAXsB;EAcjC,gBAAgB;IACZP,YAAY,EAAE;EADF;AAdiB,CAAjB,CAApB;AAmBA,IAAMS,QAAQ,oBAAGX,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB,EAAjB,CAAd;AAEA,IAAMY,UAAU,oBAAGZ,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EAC7Ba,aAAa,EAAE,WADc;EAE7BC,UAAU,EAAE,MAFiB;EAG7BC,KAAK,EAAE;AAHsB,CAAjB,CAAhB;AAMA,IAAMC,gBAAgB,oBAAGhB,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EACnCiB,QAAQ,EAAE,EADyB;EAEnCF,KAAK,EAAE;AAF4B,CAAjB,CAAtB;AAKA,IAAMG,WAAW,oBAAGlB,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EAC9BmB,WAAW,EAAE,EADiB;EAE9BJ,KAAK,EAAE;AAFuB,CAAjB,CAAjB;;AASA,IAAMK,KAA2B,GAAG,SAA9BA,KAA8B,CAAAC,KAAK,EAAI;EACzC,IACIC,gBADJ,GAGID,KAHJ,CACIC,gBADJ;EAAA,uBAGID,KAHJ,CAEIE,SAFJ;EAAA,IAEiBC,IAFjB,oBAEiBA,IAFjB;EAAA,IAEuBC,KAFvB,oBAEuBA,KAFvB;EAAA,IAE8BC,IAF9B,oBAE8BA,IAF9B;EAAA,IAEoCC,WAFpC,oBAEoCA,WAFpC;EAIA,oBACI,6BAAC,kBAAD;IAAW,SAAS,EAAE;MAAEH,IAAI,EAAE,UAAR;MAAoBD,SAAS,EAAEC;IAA/B;EAAtB,GACK;IAAA,IAAGI,IAAH,QAAGA,IAAH;IAAA,oBACG;MACI,GAAG,EAAEA,IADT;MAEI,KAAK,EAAE;QAAE1B,YAAY,EAAE;MAAhB,CAFX;MAGI,iDAAwCsB,IAAxC,CAHJ;MAII,WAAW,EAAEF;IAJjB,gBAMI,6BAAC,cAAD,qBACI,6BAAC,WAAD,qBACI,6BAAC,UAAD;MAAM,IAAI,EAAEI;IAAZ,EADJ,CADJ,eAII,6BAAC,QAAD,qBACI,6BAAC,UAAD,QAAaD,KAAb,CADJ,eAEI,6BAAC,gBAAD,QAAmBE,WAAnB,CAFJ,CAJJ,CANJ,CADH;EAAA,CADL,CADJ;AAsBH,CA3BD;;AAgCO,IAAME,aAA2C,GAAG,SAA9CA,aAA8C,QAA0B;EAAA,IAAvBP,gBAAuB,SAAvBA,gBAAuB;;EACjF,IAAMQ,eAAe,GAAGC,gBAAA,CAAQC,MAAR,CAAyC,uBAAzC,CAAxB;;EAEA,oBACI,6BAAC,cAAD,CAAO,QAAP,QACKF,eAAe,CAACG,GAAhB,CAAoB,UAAAC,WAAW;IAAA,oBAC5B,6BAAC,KAAD;MACI,GAAG,EAAEA,WAAW,CAACC,KAAZ,CAAkBX,IAD3B;MAEI,SAAS,EAAEU,WAAW,CAACC,KAF3B;MAGI,gBAAgB,EAAEb;IAHtB,EAD4B;EAAA,CAA/B,CADL,CADJ;AAWH,CAdM"}

package/admin/components/ContentModelEditor/Header.js

@@ -1,27 +1,41 @@
-import React from "react";
-import { TopAppBar, TopAppBarSection } from "@webiny/ui/TopAppBar";
-import { renderPlugins } from "@webiny/app/plugins";
-import { css } from "emotion";
-var topBar = /*#__PURE__*/css({
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _TopAppBar = require("@webiny/ui/TopAppBar");
+
+var _plugins = require("@webiny/app/plugins");
+
+var _emotion = require("emotion");
+
+var topBar = /*#__PURE__*/(0, _emotion.css)({
   boxShadow: "1px 0px 5px 0px rgba(128,128,128,1)"
 }, "label:topBar;");
 
 var EditorBar = function EditorBar() {
-  return /*#__PURE__*/React.createElement(TopAppBar, {
+  return /*#__PURE__*/_react.default.createElement(_TopAppBar.TopAppBar, {
     className: topBar,
     fixed: true,
     "data-testid": "cms-editor-top-bar"
-  }, /*#__PURE__*/React.createElement(TopAppBarSection, {
+  }, /*#__PURE__*/_react.default.createElement(_TopAppBar.TopAppBarSection, {
     style: {
       width: "50%"
     },
     alignEnd: true
-  }, renderPlugins("content-model-editor-default-bar-left")), /*#__PURE__*/React.createElement(TopAppBarSection, {
+  }, (0, _plugins.renderPlugins)("content-model-editor-default-bar-left")), /*#__PURE__*/_react.default.createElement(_TopAppBar.TopAppBarSection, {
     style: {
       width: "50%"
     },
     alignEnd: true
-  }, renderPlugins("content-model-editor-default-bar-right")));
+  }, (0, _plugins.renderPlugins)("content-model-editor-default-bar-right")));
 };
 
-export default EditorBar;
+var _default = EditorBar;
+exports.default = _default;

package/admin/components/ContentModelEditor/Header.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Header.tsx"],"names":["React","TopAppBar","TopAppBarSection","renderPlugins","css","topBar","boxShadow","EditorBar","width"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,EAAoBC,gBAApB,QAA4C,sBAA5C;AACA,SAASC,aAAT,QAA8B,qBAA9B;AAEA,SAASC,GAAT,QAAoB,SAApB;AAEA,IAAMC,MAAM,gBAAGD,GAAG,CAAC;AACfE,EAAAA,SAAS,EAAE;AADI,CAAD,kBAAlB;;AAIA,IAAMC,SAAmB,GAAG,SAAtBA,SAAsB,GAAM;AAC9B,sBACI,oBAAC,SAAD;AAAW,IAAA,SAAS,EAAEF,MAAtB;AAA8B,IAAA,KAAK,MAAnC;AAAoC,mBAAa;AAAjD,kBACI,oBAAC,gBAAD;AAAkB,IAAA,KAAK,EAAE;AAAEG,MAAAA,KAAK,EAAE;AAAT,KAAzB;AAA2C,IAAA,QAAQ;AAAnD,KACKL,aAAa,CAAC,uCAAD,CADlB,CADJ,eAKI,oBAAC,gBAAD;AAAkB,IAAA,KAAK,EAAE;AAAEK,MAAAA,KAAK,EAAE;AAAT,KAAzB;AAA2C,IAAA,QAAQ;AAAnD,KACKL,aAAa,CAAC,wCAAD,CADlB,CALJ,CADJ;AAWH,CAZD;;AAcA,eAAeI,SAAf","sourcesContent":["import React from \"react\";\nimport { TopAppBar, TopAppBarSection } from \"@webiny/ui/TopAppBar\";\nimport { renderPlugins } from \"@webiny/app/plugins\";\n\nimport { css } from \"emotion\";\n\nconst topBar = css({\n    boxShadow: \"1px 0px 5px 0px rgba(128,128,128,1)\"\n});\n\nconst EditorBar: React.FC = () => {\n    return (\n        <TopAppBar className={topBar} fixed data-testid={\"cms-editor-top-bar\"}>\n            <TopAppBarSection style={{ width: \"50%\" }} alignEnd>\n                {renderPlugins(\"content-model-editor-default-bar-left\")}\n            </TopAppBarSection>\n\n            <TopAppBarSection style={{ width: \"50%\" }} alignEnd>\n                {renderPlugins(\"content-model-editor-default-bar-right\")}\n            </TopAppBarSection>\n        </TopAppBar>\n    );\n};\n\nexport default EditorBar;\n"]}
+{"version":3,"names":["topBar","css","boxShadow","EditorBar","width","renderPlugins"],"sources":["Header.tsx"],"sourcesContent":["import React from \"react\";\nimport { TopAppBar, TopAppBarSection } from \"@webiny/ui/TopAppBar\";\nimport { renderPlugins } from \"@webiny/app/plugins\";\n\nimport { css } from \"emotion\";\n\nconst topBar = css({\n    boxShadow: \"1px 0px 5px 0px rgba(128,128,128,1)\"\n});\n\nconst EditorBar: React.FC = () => {\n    return (\n        <TopAppBar className={topBar} fixed data-testid={\"cms-editor-top-bar\"}>\n            <TopAppBarSection style={{ width: \"50%\" }} alignEnd>\n                {renderPlugins(\"content-model-editor-default-bar-left\")}\n            </TopAppBarSection>\n\n            <TopAppBarSection style={{ width: \"50%\" }} alignEnd>\n                {renderPlugins(\"content-model-editor-default-bar-right\")}\n            </TopAppBarSection>\n        </TopAppBar>\n    );\n};\n\nexport default EditorBar;\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AAEA;;AAEA,IAAMA,MAAM,gBAAG,IAAAC,YAAA,EAAI;EACfC,SAAS,EAAE;AADI,CAAJ,kBAAf;;AAIA,IAAMC,SAAmB,GAAG,SAAtBA,SAAsB,GAAM;EAC9B,oBACI,6BAAC,oBAAD;IAAW,SAAS,EAAEH,MAAtB;IAA8B,KAAK,MAAnC;IAAoC,eAAa;EAAjD,gBACI,6BAAC,2BAAD;IAAkB,KAAK,EAAE;MAAEI,KAAK,EAAE;IAAT,CAAzB;IAA2C,QAAQ;EAAnD,GACK,IAAAC,sBAAA,EAAc,uCAAd,CADL,CADJ,eAKI,6BAAC,2BAAD;IAAkB,KAAK,EAAE;MAAED,KAAK,EAAE;IAAT,CAAzB;IAA2C,QAAQ;EAAnD,GACK,IAAAC,sBAAA,EAAc,wCAAd,CADL,CALJ,CADJ;AAWH,CAZD;;eAceF,S"}

package/admin/components/ContentModelEditor/PreviewTab.js

@@ -1,36 +1,55 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PreviewTab = void 0;
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _emotion = require("emotion");
+
+var _Elevation = require("@webiny/ui/Elevation");
+
+var _i18n = require("@webiny/app/i18n");
+
+var _useContentModelEditor = require("./useContentModelEditor");
+
+var _ContentEntryFormPreview = require("../ContentEntryForm/ContentEntryFormPreview");
 
 var _templateObject;
 
-import React from "react";
-import { css } from "emotion";
-import { Elevation } from "@webiny/ui/Elevation";
-import { i18n } from "@webiny/app/i18n";
-import { useContentModelEditor } from "./useContentModelEditor";
-import { ContentEntryFormPreview } from "../ContentEntryForm/ContentEntryFormPreview";
-var t = i18n.ns("app-headless-cms/admin/components/editor/tabs/preview");
-var formPreviewWrapper = /*#__PURE__*/css({
+var t = _i18n.i18n.ns("app-headless-cms/admin/components/editor/tabs/preview");
+
+var formPreviewWrapper = /*#__PURE__*/(0, _emotion.css)({
   padding: 40,
   margin: 40,
   boxSizing: "border-box"
 }, "label:formPreviewWrapper;");
 var style = {
-  noFieldsMessage: /*#__PURE__*/css({
+  noFieldsMessage: /*#__PURE__*/(0, _emotion.css)({
     textAlign: "center"
   }, "label:noFieldsMessage;")
 };
-export var PreviewTab = function PreviewTab(_ref) {
+
+var PreviewTab = function PreviewTab(_ref) {
   var activeTab = _ref.activeTab;
 
-  var _useContentModelEdito = useContentModelEditor(),
+  var _useContentModelEdito = (0, _useContentModelEditor.useContentModelEditor)(),
       data = _useContentModelEdito.data;
 
-  return /*#__PURE__*/React.createElement(Elevation, {
+  return /*#__PURE__*/_react.default.createElement(_Elevation.Elevation, {
     z: 1,
     className: formPreviewWrapper
-  }, data.fields && data.fields.length && activeTab ? /*#__PURE__*/React.createElement(ContentEntryFormPreview, {
+  }, data.fields && data.fields.length && activeTab ? /*#__PURE__*/_react.default.createElement(_ContentEntryFormPreview.ContentEntryFormPreview, {
     contentModel: data
-  }) : /*#__PURE__*/React.createElement("div", {
+  }) : /*#__PURE__*/_react.default.createElement("div", {
     className: style.noFieldsMessage
-  }, t(_templateObject || (_templateObject = _taggedTemplateLiteral(["Before previewing the form, please add at least one field to the content model."])))));
-};
+  }, t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Before previewing the form, please add at least one field to the content model."])))));
+};
+
+exports.PreviewTab = PreviewTab;

package/admin/components/ContentModelEditor/PreviewTab.js.map

@@ -1 +1 @@
-{"version":3,"sources":["PreviewTab.tsx"],"names":["React","css","Elevation","i18n","useContentModelEditor","ContentEntryFormPreview","t","ns","formPreviewWrapper","padding","margin","boxSizing","style","noFieldsMessage","textAlign","PreviewTab","activeTab","data","fields","length"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,GAAT,QAAoB,SAApB;AACA,SAASC,SAAT,QAA0B,sBAA1B;AACA,SAASC,IAAT,QAAqB,kBAArB;AAEA,SAASC,qBAAT;AACA,SAASC,uBAAT;AAEA,IAAMC,CAAC,GAAGH,IAAI,CAACI,EAAL,CAAQ,uDAAR,CAAV;AAEA,IAAMC,kBAAkB,gBAAGP,GAAG,CAAC;AAC3BQ,EAAAA,OAAO,EAAE,EADkB;AAE3BC,EAAAA,MAAM,EAAE,EAFmB;AAG3BC,EAAAA,SAAS,EAAE;AAHgB,CAAD,8BAA9B;AAMA,IAAMC,KAAK,GAAG;AACVC,EAAAA,eAAe,eAAEZ,GAAG,CAAC;AACjBa,IAAAA,SAAS,EAAE;AADM,GAAD;AADV,CAAd;AAMA,OAAO,IAAMC,UAA+B,GAAG,SAAlCA,UAAkC,OAAmB;AAAA,MAAhBC,SAAgB,QAAhBA,SAAgB;;AAC9D,8BAAiBZ,qBAAqB,EAAtC;AAAA,MAAQa,IAAR,yBAAQA,IAAR;;AAEA,sBACI,oBAAC,SAAD;AAAW,IAAA,CAAC,EAAE,CAAd;AAAiB,IAAA,SAAS,EAAET;AAA5B,KACKS,IAAI,CAACC,MAAL,IAAeD,IAAI,CAACC,MAAL,CAAYC,MAA3B,IAAqCH,SAArC,gBACG,oBAAC,uBAAD;AAAyB,IAAA,YAAY,EAAEC;AAAvC,IADH,gBAGG;AAAK,IAAA,SAAS,EAAEL,KAAK,CAACC;AAAtB,KACKP,CADL,qJAJR,CADJ;AAWH,CAdM","sourcesContent":["import React from \"react\";\nimport { css } from \"emotion\";\nimport { Elevation } from \"@webiny/ui/Elevation\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { CmsEditorContentTab } from \"~/types\";\nimport { useContentModelEditor } from \"~/admin/components/ContentModelEditor/useContentModelEditor\";\nimport { ContentEntryFormPreview } from \"../ContentEntryForm/ContentEntryFormPreview\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/components/editor/tabs/preview\");\n\nconst formPreviewWrapper = css({\n    padding: 40,\n    margin: 40,\n    boxSizing: \"border-box\"\n});\n\nconst style = {\n    noFieldsMessage: css({\n        textAlign: \"center\"\n    })\n};\n\nexport const PreviewTab: CmsEditorContentTab = ({ activeTab }) => {\n    const { data } = useContentModelEditor();\n\n    return (\n        <Elevation z={1} className={formPreviewWrapper}>\n            {data.fields && data.fields.length && activeTab ? (\n                <ContentEntryFormPreview contentModel={data} />\n            ) : (\n                <div className={style.noFieldsMessage}>\n                    {t`Before previewing the form, please add at least one field to the content model.`}\n                </div>\n            )}\n        </Elevation>\n    );\n};\n"]}
+{"version":3,"names":["t","i18n","ns","formPreviewWrapper","css","padding","margin","boxSizing","style","noFieldsMessage","textAlign","PreviewTab","activeTab","useContentModelEditor","data","fields","length"],"sources":["PreviewTab.tsx"],"sourcesContent":["import React from \"react\";\nimport { css } from \"emotion\";\nimport { Elevation } from \"@webiny/ui/Elevation\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { CmsEditorContentTab } from \"~/types\";\nimport { useContentModelEditor } from \"~/admin/components/ContentModelEditor/useContentModelEditor\";\nimport { ContentEntryFormPreview } from \"../ContentEntryForm/ContentEntryFormPreview\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/components/editor/tabs/preview\");\n\nconst formPreviewWrapper = css({\n    padding: 40,\n    margin: 40,\n    boxSizing: \"border-box\"\n});\n\nconst style = {\n    noFieldsMessage: css({\n        textAlign: \"center\"\n    })\n};\n\nexport const PreviewTab: CmsEditorContentTab = ({ activeTab }) => {\n    const { data } = useContentModelEditor();\n\n    return (\n        <Elevation z={1} className={formPreviewWrapper}>\n            {data.fields && data.fields.length && activeTab ? (\n                <ContentEntryFormPreview contentModel={data} />\n            ) : (\n                <div className={style.noFieldsMessage}>\n                    {t`Before previewing the form, please add at least one field to the content model.`}\n                </div>\n            )}\n        </Elevation>\n    );\n};\n"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;AACA;;;;AAEA,IAAMA,CAAC,GAAGC,UAAA,CAAKC,EAAL,CAAQ,uDAAR,CAAV;;AAEA,IAAMC,kBAAkB,gBAAG,IAAAC,YAAA,EAAI;EAC3BC,OAAO,EAAE,EADkB;EAE3BC,MAAM,EAAE,EAFmB;EAG3BC,SAAS,EAAE;AAHgB,CAAJ,8BAA3B;AAMA,IAAMC,KAAK,GAAG;EACVC,eAAe,eAAE,IAAAL,YAAA,EAAI;IACjBM,SAAS,EAAE;EADM,CAAJ;AADP,CAAd;;AAMO,IAAMC,UAA+B,GAAG,SAAlCA,UAAkC,OAAmB;EAAA,IAAhBC,SAAgB,QAAhBA,SAAgB;;EAC9D,4BAAiB,IAAAC,4CAAA,GAAjB;EAAA,IAAQC,IAAR,yBAAQA,IAAR;;EAEA,oBACI,6BAAC,oBAAD;IAAW,CAAC,EAAE,CAAd;IAAiB,SAAS,EAAEX;EAA5B,GACKW,IAAI,CAACC,MAAL,IAAeD,IAAI,CAACC,MAAL,CAAYC,MAA3B,IAAqCJ,SAArC,gBACG,6BAAC,gDAAD;IAAyB,YAAY,EAAEE;EAAvC,EADH,gBAGG;IAAK,SAAS,EAAEN,KAAK,CAACC;EAAtB,GACKT,CADL,mKAJR,CADJ;AAWH,CAdM"}

package/admin/components/ContentModelEditor/useContentModelEditor.js

@@ -1,7 +1,18 @@
-import React from "react";
-import { contentModelEditorContext } from "./Context";
-export function useContentModelEditor() {
-  var context = React.useContext(contentModelEditorContext);
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useContentModelEditor = useContentModelEditor;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Context = require("./Context");
+
+function useContentModelEditor() {
+  var context = _react.default.useContext(_Context.contentModelEditorContext);
 
   if (!context) {
     throw new Error("useContentModelEditor must be used within a ContentModelEditorProvider");

package/admin/components/ContentModelEditor/useContentModelEditor.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useContentModelEditor.ts"],"names":["React","contentModelEditorContext","useContentModelEditor","context","useContext","Error"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,yBAAT;AAEA,OAAO,SAASC,qBAAT,GAAiC;AACpC,MAAMC,OAAO,GAAGH,KAAK,CAACI,UAAN,CAAiBH,yBAAjB,CAAhB;;AACA,MAAI,CAACE,OAAL,EAAc;AACV,UAAM,IAAIE,KAAJ,CAAU,wEAAV,CAAN;AACH;;AAED,SAAOF,OAAP;AACH","sourcesContent":["import React from \"react\";\nimport { contentModelEditorContext } from \"./Context\";\n\nexport function useContentModelEditor() {\n    const context = React.useContext(contentModelEditorContext);\n    if (!context) {\n        throw new Error(\"useContentModelEditor must be used within a ContentModelEditorProvider\");\n    }\n\n    return context;\n}\n"]}
+{"version":3,"names":["useContentModelEditor","context","React","useContext","contentModelEditorContext","Error"],"sources":["useContentModelEditor.ts"],"sourcesContent":["import React from \"react\";\nimport { contentModelEditorContext } from \"./Context\";\n\nexport function useContentModelEditor() {\n    const context = React.useContext(contentModelEditorContext);\n    if (!context) {\n        throw new Error(\"useContentModelEditor must be used within a ContentModelEditorProvider\");\n    }\n\n    return context;\n}\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AAEO,SAASA,qBAAT,GAAiC;EACpC,IAAMC,OAAO,GAAGC,cAAA,CAAMC,UAAN,CAAiBC,kCAAjB,CAAhB;;EACA,IAAI,CAACH,OAAL,EAAc;IACV,MAAM,IAAII,KAAJ,CAAU,wEAAV,CAAN;EACH;;EAED,OAAOJ,OAAP;AACH"}