@webiny/app-headless-cms 5.34.8 → 5.35.0-beta.0

package/admin/plugins/fieldRenderers/ref/advanced/components/Entry.js

@@ -0,0 +1,153 @@
+"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.Entry = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+var _Image = require("./entry/Image");
+var _ModelName = require("./entry/ModelName");
+var _Title = require("./entry/Title");
+var _Description = require("./entry/Description");
+var _Status = require("./entry/Status");
+var _CreatedBy = require("./entry/CreatedBy");
+var _ModifiedBy = require("./entry/ModifiedBy");
+var _View = require("./entry/View");
+var _Select = require("./entry/Select");
+var _Remove = require("./entry/Remove");
+var _MoveUp = require("./entry/MoveUp");
+var _MoveDown = require("./entry/MoveDown");
+var Container = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "e11v6udd0",
+  label: "Container"
+})({
+  width: "100%",
+  display: "flex",
+  backgroundColor: "#FFF",
+  flexDirection: "column",
+  boxShadow: "0px 1px 2px rgba(0, 0, 0, 0.3), 0px 1px 3px 1px rgba(0, 0, 0, 0.15)",
+  marginBottom: "10px",
+  boxSizing: "border-box"
+});
+var ContentContainer = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "e11v6udd1",
+  label: "ContentContainer"
+})({
+  width: "100%",
+  display: "grid",
+  gridTemplateColumns: "166px auto",
+  borderBottom: "1px solid var(--mdc-theme-background)"
+});
+var Content = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "e11v6udd2",
+  label: "Content"
+})({
+  paddingLeft: "16px",
+  paddingTop: "18px",
+  paddingBottom: "10px"
+});
+var FooterContainer = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "e11v6udd3",
+  label: "FooterContainer"
+})({
+  display: "flex",
+  flexDirection: "row",
+  padding: "10px",
+  flexWrap: "wrap-reverse",
+  justifyContent: "center",
+  marginBottom: "-10px"
+});
+var LeftContainer = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "e11v6udd4",
+  label: "LeftContainer"
+})({
+  display: "flex",
+  flexWrap: "nowrap",
+  flexBasis: "50%",
+  alignItems: "center",
+  flexShrink: 1,
+  flexGrow: 1,
+  justifyContent: "space-around",
+  borderBottom: "1px solid var(--mdc-theme-on-background)",
+  paddingBottom: 10,
+  marginTop: -10,
+  paddingTop: 15
+});
+var RightContainer = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "e11v6udd5",
+  label: "RightContainer"
+})({
+  display: "flex",
+  flexWrap: "nowrap",
+  flexBasis: "50%",
+  flexShrink: 1,
+  flexGrow: 1,
+  justifyContent: "space-around",
+  borderBottom: "1px solid var(--mdc-theme-on-background)",
+  paddingBottom: 10,
+  ">div": {
+    minWidth: "100px"
+  }
+});
+var Entry = function Entry(_ref) {
+  var model = _ref.model,
+    entry = _ref.entry,
+    onChange = _ref.onChange,
+    onRemove = _ref.onRemove,
+    selected = _ref.selected,
+    index = _ref.index,
+    onMoveUpClick = _ref.onMoveUp,
+    onMoveDownClick = _ref.onMoveDown,
+    placement = _ref.placement;
+  var onMoveUp = (0, _react.useCallback)(function (ev) {
+    if (!onMoveUpClick) {
+      return;
+    }
+    onMoveUpClick(index, ev.shiftKey);
+  }, [onMoveUpClick, index]);
+  var onMoveDown = (0, _react.useCallback)(function (ev) {
+    if (!onMoveDownClick) {
+      return;
+    }
+    onMoveDownClick(index, ev.shiftKey);
+  }, [onMoveDownClick, index]);
+  var icon = model.icon;
+  return /*#__PURE__*/_react.default.createElement(Container, null, /*#__PURE__*/_react.default.createElement(ContentContainer, null, /*#__PURE__*/_react.default.createElement(_Image.Image, {
+    title: entry.title,
+    src: entry.image,
+    icon: icon
+  }), /*#__PURE__*/_react.default.createElement(Content, null, /*#__PURE__*/_react.default.createElement(_ModelName.ModelName, {
+    name: entry.model.name
+  }), /*#__PURE__*/_react.default.createElement(_Title.Title, {
+    title: entry.title
+  }), /*#__PURE__*/_react.default.createElement(_Description.Description, {
+    description: entry.description
+  }))), /*#__PURE__*/_react.default.createElement(FooterContainer, null, /*#__PURE__*/_react.default.createElement(LeftContainer, null, /*#__PURE__*/_react.default.createElement(_Status.Status, {
+    status: entry.status
+  }), /*#__PURE__*/_react.default.createElement(_CreatedBy.CreatedBy, {
+    createdBy: entry.createdBy,
+    createdOn: entry.createdOn
+  }), /*#__PURE__*/_react.default.createElement(_ModifiedBy.ModifiedBy, {
+    modifiedBy: entry.modifiedBy,
+    savedOn: entry.savedOn
+  })), /*#__PURE__*/_react.default.createElement(RightContainer, null, placement == "multiRef" && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_MoveUp.MoveUp, {
+    className: onMoveUpClick ? "active" : "disabled",
+    onClick: onMoveUp
+  }), /*#__PURE__*/_react.default.createElement(_MoveDown.MoveDown, {
+    className: onMoveDownClick ? "active" : "disabled",
+    onClick: onMoveDown
+  })), /*#__PURE__*/_react.default.createElement(_View.View, {
+    entry: entry
+  }), onChange && /*#__PURE__*/_react.default.createElement(_Select.Select, {
+    entry: entry,
+    onChange: onChange,
+    selected: selected
+  }), onRemove && /*#__PURE__*/_react.default.createElement(_Remove.Remove, {
+    entry: entry,
+    onRemove: onRemove
+  }))));
+};
+exports.Entry = Entry;

package/admin/plugins/fieldRenderers/ref/advanced/components/Entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Container","styled","width","display","backgroundColor","flexDirection","boxShadow","marginBottom","boxSizing","ContentContainer","gridTemplateColumns","borderBottom","Content","paddingLeft","paddingTop","paddingBottom","FooterContainer","padding","flexWrap","justifyContent","LeftContainer","flexBasis","alignItems","flexShrink","flexGrow","marginTop","RightContainer","minWidth","Entry","model","entry","onChange","onRemove","selected","index","onMoveUpClick","onMoveUp","onMoveDownClick","onMoveDown","placement","useCallback","ev","shiftKey","icon","title","image","name","description","status","createdBy","createdOn","modifiedBy","savedOn"],"sources":["Entry.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport styled from \"@emotion/styled\";\nimport {\n    CmsReferenceContentEntry,\n    CmsReferenceValue\n} from \"~/admin/plugins/fieldRenderers/ref/components/types\";\nimport { Image } from \"./entry/Image\";\nimport { ModelName } from \"./entry/ModelName\";\nimport { Title } from \"./entry/Title\";\nimport { Description } from \"./entry/Description\";\nimport { Status } from \"./entry/Status\";\nimport { CreatedBy } from \"./entry/CreatedBy\";\nimport { ModifiedBy } from \"./entry/ModifiedBy\";\nimport { View } from \"./entry/View\";\nimport { Select } from \"./entry/Select\";\nimport { Remove } from \"./entry/Remove\";\nimport { MoveUp } from \"./entry/MoveUp\";\nimport { MoveDown } from \"./entry/MoveDown\";\nimport { CmsModel } from \"~/types\";\n\nconst Container = styled(\"div\")({\n    width: \"100%\",\n    display: \"flex\",\n    backgroundColor: \"#FFF\",\n    flexDirection: \"column\",\n    boxShadow: \"0px 1px 2px rgba(0, 0, 0, 0.3), 0px 1px 3px 1px rgba(0, 0, 0, 0.15)\",\n    marginBottom: \"10px\",\n    boxSizing: \"border-box\"\n});\n\nconst ContentContainer = styled(\"div\")({\n    width: \"100%\",\n    display: \"grid\",\n    gridTemplateColumns: \"166px auto\",\n    borderBottom: \"1px solid var(--mdc-theme-background)\"\n});\n\nconst Content = styled(\"div\")({\n    paddingLeft: \"16px\",\n    paddingTop: \"18px\",\n    paddingBottom: \"10px\"\n});\n\nconst FooterContainer = styled(\"div\")({\n    display: \"flex\",\n    flexDirection: \"row\",\n    padding: \"10px\",\n    flexWrap: \"wrap-reverse\",\n    justifyContent: \"center\",\n    marginBottom: \"-10px\"\n});\n\nconst LeftContainer = styled(\"div\")({\n    display: \"flex\",\n    flexWrap: \"nowrap\",\n    flexBasis: \"50%\",\n    alignItems: \"center\",\n    flexShrink: 1,\n    flexGrow: 1,\n    justifyContent: \"space-around\",\n    borderBottom: \"1px solid var(--mdc-theme-on-background)\",\n    paddingBottom: 10,\n    marginTop: -10,\n    paddingTop: 15\n});\n\nconst RightContainer = styled(\"div\")({\n    display: \"flex\",\n    flexWrap: \"nowrap\",\n    flexBasis: \"50%\",\n    flexShrink: 1,\n    flexGrow: 1,\n    justifyContent: \"space-around\",\n    borderBottom: \"1px solid var(--mdc-theme-on-background)\",\n    paddingBottom: 10,\n    \">div\": {\n        minWidth: \"100px\"\n    }\n});\n\ninterface Props {\n    model: CmsModel;\n    entry: CmsReferenceContentEntry;\n    onChange: (value: CmsReferenceValue) => void;\n    index?: never;\n    selected: boolean;\n    onMoveUp?: never;\n    onMoveDown?: never;\n    onRemove?: never;\n    placement?: string;\n}\n\ninterface PropsWithRemove {\n    onRemove: (entryId: string) => void;\n    model: CmsModel;\n    entry: CmsReferenceContentEntry;\n    index: number;\n    onMoveUp?: (index: number, toTop: boolean) => void;\n    onMoveDown?: (index: number, toBottom: boolean) => void;\n    onChange?: never;\n    selected?: never;\n    placement?: string;\n}\n\nexport const Entry: React.VFC<PropsWithRemove | Props> = ({\n    model,\n    entry,\n    onChange,\n    onRemove,\n    selected,\n    index,\n    onMoveUp: onMoveUpClick,\n    onMoveDown: onMoveDownClick,\n    placement\n}) => {\n    const onMoveUp = useCallback(\n        (ev: React.MouseEvent) => {\n            if (!onMoveUpClick) {\n                return;\n            }\n            onMoveUpClick(index, ev.shiftKey);\n        },\n        [onMoveUpClick, index]\n    );\n    const onMoveDown = useCallback(\n        (ev: React.MouseEvent) => {\n            if (!onMoveDownClick) {\n                return;\n            }\n            onMoveDownClick(index, ev.shiftKey);\n        },\n        [onMoveDownClick, index]\n    );\n\n    const icon = model.icon;\n\n    return (\n        <Container>\n            <ContentContainer>\n                <Image title={entry.title} src={entry.image} icon={icon} />\n                <Content>\n                    <ModelName name={entry.model.name} />\n                    <Title title={entry.title} />\n                    <Description description={entry.description} />\n                </Content>\n            </ContentContainer>\n            <FooterContainer>\n                <LeftContainer>\n                    <Status status={entry.status} />\n                    <CreatedBy createdBy={entry.createdBy} createdOn={entry.createdOn} />\n                    <ModifiedBy modifiedBy={entry.modifiedBy} savedOn={entry.savedOn} />\n                </LeftContainer>\n                <RightContainer>\n                    {placement == \"multiRef\" && (\n                        <>\n                            <MoveUp\n                                className={onMoveUpClick ? \"active\" : \"disabled\"}\n                                onClick={onMoveUp}\n                            />\n                            <MoveDown\n                                className={onMoveDownClick ? \"active\" : \"disabled\"}\n                                onClick={onMoveDown}\n                            />\n                        </>\n                    )}\n                    <View entry={entry} />\n                    {onChange && <Select entry={entry} onChange={onChange} selected={selected} />}\n                    {onRemove && <Remove entry={entry} onRemove={onRemove} />}\n                </RightContainer>\n            </FooterContainer>\n        </Container>\n    );\n};\n"],"mappings":"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"}

package/admin/plugins/fieldRenderers/ref/advanced/components/Loader.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+export declare const Loader: React.VFC;
+export declare const AbsoluteLoader: React.VFC;

package/admin/plugins/fieldRenderers/ref/advanced/components/Loader.js

@@ -0,0 +1,37 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Loader = exports.AbsoluteLoader = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+var _Progress = require("@webiny/ui/Progress");
+var LoaderContainer = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "e1wb4am30",
+  label: "LoaderContainer"
+})({
+  display: "flex",
+  position: "relative",
+  minHeight: "50px"
+});
+var AbsoluteLoaderContainer = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "e1wb4am31",
+  label: "AbsoluteLoaderContainer"
+})({
+  display: "flex",
+  minHeight: "100%",
+  position: "absolute",
+  width: "100%",
+  top: 0,
+  left: 0
+});
+var Loader = function Loader() {
+  return /*#__PURE__*/_react.default.createElement(LoaderContainer, null, /*#__PURE__*/_react.default.createElement(_Progress.CircularProgress, null));
+};
+exports.Loader = Loader;
+var AbsoluteLoader = function AbsoluteLoader() {
+  return /*#__PURE__*/_react.default.createElement(AbsoluteLoaderContainer, null, /*#__PURE__*/_react.default.createElement(_Progress.CircularProgress, null));
+};
+exports.AbsoluteLoader = AbsoluteLoader;

package/admin/plugins/fieldRenderers/ref/advanced/components/Loader.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["LoaderContainer","styled","display","position","minHeight","AbsoluteLoaderContainer","width","top","left","Loader","AbsoluteLoader"],"sources":["Loader.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { CircularProgress } from \"@webiny/ui/Progress\";\n\nconst LoaderContainer = styled(\"div\")({\n    display: \"flex\",\n    position: \"relative\",\n    minHeight: \"50px\"\n});\nconst AbsoluteLoaderContainer = styled(\"div\")({\n    display: \"flex\",\n    minHeight: \"100%\",\n    position: \"absolute\",\n    width: \"100%\",\n    top: 0,\n    left: 0\n});\nexport const Loader: React.VFC = () => {\n    return (\n        <LoaderContainer>\n            <CircularProgress />\n        </LoaderContainer>\n    );\n};\nexport const AbsoluteLoader: React.VFC = () => {\n    return (\n        <AbsoluteLoaderContainer>\n            <CircularProgress />\n        </AbsoluteLoaderContainer>\n    );\n};\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AAEA,IAAMA,eAAe,oBAAGC,eAAM,EAAC,KAAK;EAAA;EAAA;AAAA,GAAE;EAClCC,OAAO,EAAE,MAAM;EACfC,QAAQ,EAAE,UAAU;EACpBC,SAAS,EAAE;AACf,CAAC,CAAC;AACF,IAAMC,uBAAuB,oBAAGJ,eAAM,EAAC,KAAK;EAAA;EAAA;AAAA,GAAE;EAC1CC,OAAO,EAAE,MAAM;EACfE,SAAS,EAAE,MAAM;EACjBD,QAAQ,EAAE,UAAU;EACpBG,KAAK,EAAE,MAAM;EACbC,GAAG,EAAE,CAAC;EACNC,IAAI,EAAE;AACV,CAAC,CAAC;AACK,IAAMC,MAAiB,GAAG,SAApBA,MAAiB,GAAS;EACnC,oBACI,6BAAC,eAAe,qBACZ,6BAAC,0BAAgB,OAAG,CACN;AAE1B,CAAC;AAAC;AACK,IAAMC,cAAyB,GAAG,SAA5BA,cAAyB,GAAS;EAC3C,oBACI,6BAAC,uBAAuB,qBACpB,6BAAC,0BAAgB,OAAG,CACE;AAElC,CAAC;AAAC"}

package/admin/plugins/fieldRenderers/ref/advanced/components/NewReferencedEntryDialog.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { CmsModel } from "../../../../../../types";
+interface Props {
+    model: Pick<CmsModel, "modelId">;
+    onClose: () => void;
+    onChange: (entry: any) => void;
+}
+export declare const NewReferencedEntryDialog: React.VFC<Props>;
+export {};

package/admin/plugins/fieldRenderers/ref/advanced/components/NewReferencedEntryDialog.js

@@ -0,0 +1,142 @@
+"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.NewReferencedEntryDialog = 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 _regeneratorRuntime2 = _interopRequireDefault(require("@babel/runtime/helpers/regeneratorRuntime"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _react = _interopRequireWildcard(require("react"));
+var _ContentEntryContext = require("../../../../../views/contentEntries/ContentEntry/ContentEntryContext");
+var _Dialog = require("@webiny/ui/Dialog");
+var _ContentEntriesContext = require("../../../../../views/contentEntries/ContentEntriesContext");
+var _i18n = require("@webiny/app/i18n");
+var _useContentEntry3 = require("../../../../../views/contentEntries/hooks/useContentEntry");
+var _ModelProvider = require("../../../../../components/ModelProvider");
+var _ContentEntryForm = require("../../../../../components/ContentEntryForm/ContentEntryForm");
+var _Button = require("@webiny/ui/Button");
+var _contentModels = require("../../../../../graphql/contentModels");
+var _hooks = require("../../../../../hooks");
+var _Dialog2 = require("./dialog/Dialog");
+var _templateObject, _templateObject2, _templateObject3;
+var t = _i18n.i18n.ns("app-headless-cms/admin/fields/ref");
+var EntryForm = function EntryForm(_ref) {
+  var onCreate = _ref.onCreate;
+  var _useContentEntry = (0, _useContentEntry3.useContentEntry)(),
+    setFormRef = _useContentEntry.setFormRef,
+    contentModel = _useContentEntry.contentModel;
+  return /*#__PURE__*/_react.default.createElement(_ModelProvider.ModelProvider, {
+    model: contentModel
+  }, /*#__PURE__*/_react.default.createElement(_ContentEntryForm.ContentEntryForm, {
+    onSubmit: function onSubmit(data) {
+      /**
+       * We know that data is CmsContentEntry.
+       */
+      return onCreate(data);
+    },
+    onForm: function onForm(form) {
+      return setFormRef(form);
+    },
+    entry: {},
+    addEntryToListCache: false
+  }));
+};
+var DialogSaveButton = function DialogSaveButton() {
+  var _useContentEntry2 = (0, _useContentEntry3.useContentEntry)(),
+    form = _useContentEntry2.form;
+  var onClick = (0, _react.useCallback)(function (ev) {
+    (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee() {
+      return (0, _regeneratorRuntime2.default)().wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            _context.next = 2;
+            return form.current.submit(ev);
+          case 2:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }))();
+  }, [form.current]);
+  return /*#__PURE__*/_react.default.createElement(_Button.ButtonPrimary, {
+    onClick: onClick
+  }, t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Create Entry"]))));
+};
+var NewReferencedEntryDialog = function NewReferencedEntryDialog(_ref3) {
+  var baseModel = _ref3.model,
+    onClose = _ref3.onClose,
+    onChange = _ref3.onChange;
+  var _useCms = (0, _hooks.useCms)(),
+    apolloClient = _useCms.apolloClient;
+  var _useState = (0, _react.useState)(undefined),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    model = _useState2[0],
+    setModel = _useState2[1];
+  (0, _react.useEffect)(function () {
+    (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee2() {
+      var response;
+      return (0, _regeneratorRuntime2.default)().wrap(function _callee2$(_context2) {
+        while (1) switch (_context2.prev = _context2.next) {
+          case 0:
+            _context2.next = 2;
+            return apolloClient.query({
+              query: _contentModels.GET_CONTENT_MODEL,
+              variables: {
+                modelId: baseModel.modelId
+              }
+            });
+          case 2:
+            response = _context2.sent;
+            setModel(response.data.getContentModel.data);
+          case 4:
+          case "end":
+            return _context2.stop();
+        }
+      }, _callee2);
+    }))();
+  }, [baseModel.modelId]);
+  var onCreate = (0, _react.useCallback)(function (entry) {
+    var _entry$meta;
+    if (!model) {
+      onClose();
+      return;
+    }
+    onChange((0, _objectSpread2.default)((0, _objectSpread2.default)({}, entry), {}, {
+      /*
+       * Format data for AutoComplete.
+       */
+      published: ((_entry$meta = entry.meta) === null || _entry$meta === void 0 ? void 0 : _entry$meta.status) === "published",
+      modelId: model.modelId,
+      modelName: model.name
+    }));
+    onClose();
+  }, [onChange, model]);
+  if (!model) {
+    return null;
+  }
+  return /*#__PURE__*/_react.default.createElement(_ContentEntriesContext.ContentEntriesProvider, {
+    contentModel: model,
+    key: model.modelId,
+    insideDialog: true
+  }, /*#__PURE__*/_react.default.createElement(_ContentEntryContext.ContentEntryProvider, {
+    isNewEntry: function isNewEntry() {
+      return true;
+    },
+    getContentId: function getContentId() {
+      return null;
+    }
+  }, /*#__PURE__*/_react.default.createElement(_Dialog2.FullWidthDialog, {
+    open: true,
+    onClose: onClose
+  }, /*#__PURE__*/_react.default.createElement(_Dialog.DialogTitle, null, t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["New {modelName} Entry"])))({
+    modelName: model.name
+  })), /*#__PURE__*/_react.default.createElement(_Dialog.DialogContent, null, /*#__PURE__*/_react.default.createElement(EntryForm, {
+    onCreate: onCreate
+  })), /*#__PURE__*/_react.default.createElement(_Dialog.DialogActions, null, /*#__PURE__*/_react.default.createElement(_Dialog.DialogCancel, null, t(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["Cancel"])))), /*#__PURE__*/_react.default.createElement(DialogSaveButton, null)))));
+};
+exports.NewReferencedEntryDialog = NewReferencedEntryDialog;

package/admin/plugins/fieldRenderers/ref/advanced/components/NewReferencedEntryDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["t","i18n","ns","EntryForm","onCreate","useContentEntry","setFormRef","contentModel","data","form","DialogSaveButton","onClick","useCallback","ev","current","submit","NewReferencedEntryDialog","baseModel","model","onClose","onChange","useCms","apolloClient","useState","undefined","setModel","useEffect","query","GET_CONTENT_MODEL","variables","modelId","response","getContentModel","entry","published","meta","status","modelName","name"],"sources":["NewReferencedEntryDialog.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from \"react\";\nimport { ContentEntryProvider } from \"~/admin/views/contentEntries/ContentEntry/ContentEntryContext\";\nimport { DialogActions, DialogCancel, DialogContent, DialogTitle } from \"@webiny/ui/Dialog\";\nimport { ContentEntriesProvider } from \"~/admin/views/contentEntries/ContentEntriesContext\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { CmsContentEntry, CmsModel } from \"~/types\";\nimport { useContentEntry } from \"~/admin/views/contentEntries/hooks/useContentEntry\";\nimport { ModelProvider } from \"~/admin/components/ModelProvider\";\nimport { ContentEntryForm } from \"~/admin/components/ContentEntryForm/ContentEntryForm\";\nimport { ButtonPrimary } from \"@webiny/ui/Button\";\nimport {\n    GET_CONTENT_MODEL,\n    GetCmsModelQueryResponse,\n    GetCmsModelQueryVariables\n} from \"~/admin/graphql/contentModels\";\nimport { useCms } from \"~/admin/hooks\";\nimport { FullWidthDialog } from \"./dialog/Dialog\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/ref\");\n\ninterface EntryFormProps {\n    onCreate: (entry: CmsContentEntry) => void;\n}\n\nconst EntryForm: React.VFC<EntryFormProps> = ({ onCreate }) => {\n    const { setFormRef, contentModel } = useContentEntry();\n\n    return (\n        <ModelProvider model={contentModel}>\n            <ContentEntryForm\n                onSubmit={data => {\n                    /**\n                     * We know that data is CmsContentEntry.\n                     */\n                    return onCreate(data as unknown as CmsContentEntry);\n                }}\n                onForm={form => setFormRef(form)}\n                entry={{}}\n                addEntryToListCache={false}\n            />\n        </ModelProvider>\n    );\n};\n\nconst DialogSaveButton: React.VFC = () => {\n    const { form } = useContentEntry();\n\n    const onClick = useCallback(\n        (ev: React.MouseEvent) => {\n            (async () => {\n                await form.current.submit(ev);\n            })();\n        },\n        [form.current]\n    );\n\n    return <ButtonPrimary onClick={onClick}>{t`Create Entry`}</ButtonPrimary>;\n};\n\ninterface Props {\n    model: Pick<CmsModel, \"modelId\">;\n    onClose: () => void;\n    onChange: (entry: any) => void;\n}\n\nexport const NewReferencedEntryDialog: React.VFC<Props> = ({\n    model: baseModel,\n    onClose,\n    onChange\n}) => {\n    const { apolloClient } = useCms();\n    const [model, setModel] = useState<CmsModel | undefined>(undefined);\n\n    useEffect(() => {\n        (async () => {\n            const response = await apolloClient.query<\n                GetCmsModelQueryResponse,\n                GetCmsModelQueryVariables\n            >({\n                query: GET_CONTENT_MODEL,\n                variables: {\n                    modelId: baseModel.modelId\n                }\n            });\n            setModel(response.data.getContentModel.data);\n        })();\n    }, [baseModel.modelId]);\n\n    const onCreate = useCallback(\n        (entry: CmsContentEntry) => {\n            if (!model) {\n                onClose();\n                return;\n            }\n            onChange({\n                ...entry,\n                /*\n                 * Format data for AutoComplete.\n                 */\n                published: entry.meta?.status === \"published\",\n                modelId: model.modelId,\n                modelName: model.name\n            });\n            onClose();\n        },\n        [onChange, model]\n    );\n    if (!model) {\n        return null;\n    }\n\n    return (\n        <ContentEntriesProvider contentModel={model} key={model.modelId} insideDialog={true}>\n            <ContentEntryProvider isNewEntry={() => true} getContentId={() => null}>\n                <FullWidthDialog open={true} onClose={onClose}>\n                    <DialogTitle>{t`New {modelName} Entry`({ modelName: model.name })}</DialogTitle>\n                    <DialogContent>\n                        <EntryForm onCreate={onCreate} />\n                    </DialogContent>\n                    <DialogActions>\n                        <DialogCancel>{t`Cancel`}</DialogCancel>\n                        <DialogSaveButton />\n                    </DialogActions>\n                </FullWidthDialog>\n            </ContentEntryProvider>\n        </ContentEntriesProvider>\n    );\n};\n"],"mappings":"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"}

package/admin/plugins/fieldRenderers/ref/advanced/components/Options.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { CmsModel } from "../../../../../../types";
+interface Props {
+    models: CmsModel[];
+    onNewRecord: (modelId: string) => void;
+    onLinkExistingRecord: (modelId: string) => void;
+}
+export declare const Options: React.VFC<Props>;
+export {};

package/admin/plugins/fieldRenderers/ref/advanced/components/Options.js

@@ -0,0 +1,118 @@
+"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.Options = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+var _OptionsModelList = require("./options/OptionsModelList");
+var _link = require("./assets/link.svg");
+var _addCircle = require("./assets/add-circle.svg");
+var Container = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "e1k00edo0",
+  label: "Container"
+})({
+  display: "flex",
+  flexDirection: "row",
+  width: "100%"
+});
+var NewRecord = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "e1k00edo1",
+  label: "NewRecord"
+})({
+  borderRight: "2px solid var(--mdc-theme-background)",
+  padding: "10px 15px",
+  display: "flex",
+  position: "relative",
+  alignItems: "center",
+  " > div ": {
+    display: "none"
+  },
+  ":hover > div": {
+    display: "block"
+  }
+});
+var NewRecordButton = /*#__PURE__*/(0, _styled.default)("button", {
+  target: "e1k00edo2",
+  label: "NewRecordButton"
+})({
+  background: "transparent",
+  border: "none",
+  color: "var(--mdc-theme-primary)",
+  padding: "2px 2px",
+  cursor: "pointer",
+  alignItems: "center",
+  display: "flex",
+  "> svg": {
+    color: "var(--mdc-theme-primary)",
+    width: "16px",
+    height: "16px",
+    marginRight: 10
+  }
+});
+var LinkExistingRecord = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "e1k00edo3",
+  label: "LinkExistingRecord"
+})({
+  padding: "10px 15px",
+  alignItems: "center",
+  display: "flex",
+  position: "relative",
+  " > div ": {
+    display: "none"
+  },
+  ":hover > div": {
+    display: "block"
+  }
+});
+var LinkExistingRecordButton = /*#__PURE__*/(0, _styled.default)("button", {
+  target: "e1k00edo4",
+  label: "LinkExistingRecordButton"
+})({
+  background: "transparent",
+  border: "none",
+  color: "var(--mdc-theme-primary)",
+  padding: "2px 5px",
+  cursor: "pointer",
+  alignItems: "center",
+  display: "flex",
+  "> svg": {
+    color: "var(--mdc-theme-primary)",
+    width: "16px",
+    height: "16px",
+    marginRight: 10
+  }
+});
+var Options = function Options(_ref) {
+  var models = _ref.models,
+    onNewRecord = _ref.onNewRecord,
+    onLinkExistingRecord = _ref.onLinkExistingRecord;
+  var hasMultipleModels = models.length > 1;
+  var onSingleNewRecord = (0, _react.useCallback)(function () {
+    if (models.length === 0 || hasMultipleModels) {
+      return;
+    }
+    onNewRecord(models[0].modelId);
+  }, [models]);
+  var onSingleExistingRecord = (0, _react.useCallback)(function () {
+    if (models.length === 0 || hasMultipleModels) {
+      return;
+    }
+    onLinkExistingRecord(models[0].modelId);
+  }, [models]);
+  return /*#__PURE__*/_react.default.createElement(Container, null, /*#__PURE__*/_react.default.createElement(NewRecord, null, /*#__PURE__*/_react.default.createElement(NewRecordButton, {
+    onClick: onSingleNewRecord
+  }, /*#__PURE__*/_react.default.createElement(_addCircle.ReactComponent, null), " create a new record"), /*#__PURE__*/_react.default.createElement(_OptionsModelList.OptionsModelList, {
+    onClick: onNewRecord,
+    models: models
+  })), /*#__PURE__*/_react.default.createElement(LinkExistingRecord, null, /*#__PURE__*/_react.default.createElement(LinkExistingRecordButton, {
+    onClick: onSingleExistingRecord
+  }, /*#__PURE__*/_react.default.createElement(_link.ReactComponent, null), " link an existing record"), /*#__PURE__*/_react.default.createElement(_OptionsModelList.OptionsModelList, {
+    onClick: onLinkExistingRecord,
+    models: models
+  })));
+};
+exports.Options = Options;

package/admin/plugins/fieldRenderers/ref/advanced/components/Options.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Container","styled","display","flexDirection","width","NewRecord","borderRight","padding","position","alignItems","NewRecordButton","background","border","color","cursor","height","marginRight","LinkExistingRecord","LinkExistingRecordButton","Options","models","onNewRecord","onLinkExistingRecord","hasMultipleModels","length","onSingleNewRecord","useCallback","modelId","onSingleExistingRecord"],"sources":["Options.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport styled from \"@emotion/styled\";\nimport { CmsModel } from \"~/types\";\nimport { OptionsModelList } from \"~/admin/plugins/fieldRenderers/ref/advanced/components/options/OptionsModelList\";\nimport { ReactComponent as LinkIcon } from \"./assets/link.svg\";\nimport { ReactComponent as AddIcon } from \"./assets/add-circle.svg\";\n\nconst Container = styled(\"div\")({\n    display: \"flex\",\n    flexDirection: \"row\",\n    width: \"100%\"\n});\nconst NewRecord = styled(\"div\")({\n    borderRight: \"2px solid var(--mdc-theme-background)\",\n    padding: \"10px 15px\",\n    display: \"flex\",\n    position: \"relative\",\n    alignItems: \"center\",\n    \" > div \": {\n        display: \"none\"\n    },\n    \":hover > div\": {\n        display: \"block\"\n    }\n});\nconst NewRecordButton = styled(\"button\")({\n    background: \"transparent\",\n    border: \"none\",\n    color: \"var(--mdc-theme-primary)\",\n    padding: \"2px 2px\",\n    cursor: \"pointer\",\n    alignItems: \"center\",\n    display: \"flex\",\n    \"> svg\": {\n        color: \"var(--mdc-theme-primary)\",\n        width: \"16px\",\n        height: \"16px\",\n        marginRight: 10\n    }\n});\nconst LinkExistingRecord = styled(\"div\")({\n    padding: \"10px 15px\",\n    alignItems: \"center\",\n    display: \"flex\",\n    position: \"relative\",\n    \" > div \": {\n        display: \"none\"\n    },\n    \":hover > div\": {\n        display: \"block\"\n    }\n});\nconst LinkExistingRecordButton = styled(\"button\")({\n    background: \"transparent\",\n    border: \"none\",\n    color: \"var(--mdc-theme-primary)\",\n    padding: \"2px 5px\",\n    cursor: \"pointer\",\n    alignItems: \"center\",\n    display: \"flex\",\n    \"> svg\": {\n        color: \"var(--mdc-theme-primary)\",\n        width: \"16px\",\n        height: \"16px\",\n        marginRight: 10\n    }\n});\n\ninterface Props {\n    models: CmsModel[];\n    onNewRecord: (modelId: string) => void;\n    onLinkExistingRecord: (modelId: string) => void;\n}\nexport const Options: React.VFC<Props> = ({ models, onNewRecord, onLinkExistingRecord }) => {\n    const hasMultipleModels = models.length > 1;\n    const onSingleNewRecord = useCallback(() => {\n        if (models.length === 0 || hasMultipleModels) {\n            return;\n        }\n        onNewRecord(models[0].modelId);\n    }, [models]);\n\n    const onSingleExistingRecord = useCallback(() => {\n        if (models.length === 0 || hasMultipleModels) {\n            return;\n        }\n        onLinkExistingRecord(models[0].modelId);\n    }, [models]);\n    return (\n        <Container>\n            <NewRecord>\n                <NewRecordButton onClick={onSingleNewRecord}>\n                    <AddIcon /> create a new record\n                </NewRecordButton>\n                <OptionsModelList onClick={onNewRecord} models={models} />\n            </NewRecord>\n            <LinkExistingRecord>\n                <LinkExistingRecordButton onClick={onSingleExistingRecord}>\n                    <LinkIcon /> link an existing record\n                </LinkExistingRecordButton>\n                <OptionsModelList onClick={onLinkExistingRecord} models={models} />\n            </LinkExistingRecord>\n        </Container>\n    );\n};\n"],"mappings":"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"}

package/admin/plugins/fieldRenderers/ref/advanced/components/ReferencesDialog.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+import { CmsModelFieldRendererProps } from "../../../../../../types";
+import { CmsReferenceValue } from "../../components/types";
+interface Props extends CmsModelFieldRendererProps {
+    values?: CmsReferenceValue[] | null;
+    onDialogClose: () => void;
+    storeValues: (values: CmsReferenceValue[]) => void;
+    multiple: boolean;
+}
+export declare const ReferencesDialog: React.VFC<Props>;
+export {};