@webiny/app-headless-cms 5.40.0-beta.2 → 5.40.0-beta.3

package/admin/plugins/fieldRenderers/dateTime/utils.js

@@ -10,17 +10,15 @@ var _react = _interopRequireDefault(require("react"));
 var _emotion = require("emotion");
 var _Grid = require("@webiny/ui/Grid");
 var _Button = require("@webiny/ui/Button");
-var DEFAULT_TIMEZONE = "+01:00";
-exports.DEFAULT_TIMEZONE = DEFAULT_TIMEZONE;
-var getDefaultFieldValue = function getDefaultFieldValue(field, bind, getCurrent) {
+var DEFAULT_TIMEZONE = exports.DEFAULT_TIMEZONE = "+01:00";
+var getDefaultFieldValue = exports.getDefaultFieldValue = function getDefaultFieldValue(field, bind, getCurrent) {
   var def = field.settings ? field.settings.defaultSetValue || "null" : "null";
   if (bind.value || def !== "current") {
     return bind.value || "";
   }
   return getCurrent();
 };
-exports.getDefaultFieldValue = getDefaultFieldValue;
-var getCurrentTimeZone = function getCurrentTimeZone(date) {
+var getCurrentTimeZone = exports.getCurrentTimeZone = function getCurrentTimeZone(date) {
   if (!date) {
     date = new Date();
   }
@@ -32,8 +30,7 @@ var getCurrentTimeZone = function getCurrentTimeZone(date) {
   var timezone = matches[1];
   return "".concat(timezone.slice(0, 3), ":").concat(timezone.slice(3));
 };
-exports.getCurrentTimeZone = getCurrentTimeZone;
-var getCurrentLocalTime = function getCurrentLocalTime(date) {
+var getCurrentLocalTime = exports.getCurrentLocalTime = function getCurrentLocalTime(date) {
   if (!date) {
     date = new Date();
   }
@@ -46,8 +43,7 @@ var getCurrentLocalTime = function getCurrentLocalTime(date) {
   }
   return time;
 };
-exports.getCurrentLocalTime = getCurrentLocalTime;
-var getCurrentDate = function getCurrentDate(date) {
+var getCurrentDate = exports.getCurrentDate = function getCurrentDate(date) {
   if (!date) {
     date = new Date();
   }
@@ -56,13 +52,12 @@ var getCurrentDate = function getCurrentDate(date) {
   var day = String(date.getDate()).padStart(2, "0");
   return "".concat(year, "-").concat(month, "-").concat(day);
 };
-exports.getCurrentDate = getCurrentDate;
-var deleteIconStyles = /*#__PURE__*/(0, _emotion.css)({
+var deleteIconStyles = (0, _emotion.css)({
   width: "100% !important",
   height: "100% !important",
   color: "var(--mdc-theme-text-secondary-on-background) !important"
-}, "label:deleteIconStyles;");
-var RemoveFieldButton = function RemoveFieldButton(_ref) {
+});
+var RemoveFieldButton = exports.RemoveFieldButton = function RemoveFieldButton(_ref) {
   var trailingIcon = _ref.trailingIcon;
   if (!trailingIcon) {
     return null;
@@ -75,6 +70,5 @@ var RemoveFieldButton = function RemoveFieldButton(_ref) {
     icon: trailingIcon.icon
   }));
 };
-exports.RemoveFieldButton = RemoveFieldButton;
 
 //# sourceMappingURL=utils.js.map

package/admin/plugins/fieldRenderers/dateTime/utils.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_emotion","_Grid","_Button","DEFAULT_TIMEZONE","exports","getDefaultFieldValue","field","bind","getCurrent","def","settings","defaultSetValue","value","getCurrentTimeZone","date","Date","toTimeString","matches","match","timezone","concat","slice","getCurrentLocalTime","_value$split","split","_value$split2","_slicedToArray2","default","time","getCurrentDate","year","String","getFullYear","padStart","month","getMonth","day","getDate","deleteIconStyles","css","width","height","color","RemoveFieldButton","_ref","trailingIcon","createElement","Cell","span","IconButton","className","onClick","icon"],"sources":["utils.tsx"],"sourcesContent":["import React from \"react\";\nimport { css } from \"emotion\";\nimport { Cell } from \"@webiny/ui/Grid\";\nimport { IconButton } from \"@webiny/ui/Button\";\nimport { CmsModelField } from \"~/types\";\n\nexport const DEFAULT_TIMEZONE = \"+01:00\";\n\nexport const getDefaultFieldValue = (\n    field: CmsModelField,\n    bind: {\n        value: string | null | undefined;\n    },\n    getCurrent: () => string\n): string => {\n    const def = field.settings ? field.settings.defaultSetValue || \"null\" : \"null\";\n    if (bind.value || def !== \"current\") {\n        return bind.value || \"\";\n    }\n    return getCurrent();\n};\n\nexport const getCurrentTimeZone = (date?: Date): string | null => {\n    if (!date) {\n        date = new Date();\n    }\n    const value = date.toTimeString();\n\n    const matches = value.match(/GMT([+-][0-9]{4})/);\n    if (!matches) {\n        return null;\n    }\n    const timezone = matches[1];\n    return `${timezone.slice(0, 3)}:${timezone.slice(3)}`;\n};\n\nexport const getCurrentLocalTime = (date?: Date): string => {\n    if (!date) {\n        date = new Date();\n    }\n    const value = date.toTimeString();\n\n    const [time] = value.split(\" \");\n    if (!time || time.match(/^([0-9]{2}):([0-9]{2}):([0-9]{2})$/) === null) {\n        return \"00:00:00\";\n    }\n    return time;\n};\n\nexport const getCurrentDate = (date?: Date): string => {\n    if (!date) {\n        date = new Date();\n    }\n    const year = String(date.getFullYear()).padStart(4, \"0\");\n    const month = String(date.getMonth() + 1).padStart(2, \"0\");\n    const day = String(date.getDate()).padStart(2, \"0\");\n\n    return `${year}-${month}-${day}`;\n};\n\nconst deleteIconStyles = css({\n    width: \"100% !important\",\n    height: \"100% !important\",\n    color: \"var(--mdc-theme-text-secondary-on-background) !important\"\n});\n\ninterface RemoveFieldButtonProps {\n    trailingIcon: any;\n}\nexport const RemoveFieldButton = ({ trailingIcon }: RemoveFieldButtonProps) => {\n    if (!trailingIcon) {\n        return null;\n    }\n    return (\n        <Cell span={1}>\n            <IconButton\n                className={deleteIconStyles}\n                onClick={trailingIcon.onClick}\n                icon={trailingIcon.icon}\n            />\n        </Cell>\n    );\n};\n"],"mappings":"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"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_emotion","_Grid","_Button","DEFAULT_TIMEZONE","exports","getDefaultFieldValue","field","bind","getCurrent","def","settings","defaultSetValue","value","getCurrentTimeZone","date","Date","toTimeString","matches","match","timezone","concat","slice","getCurrentLocalTime","_value$split","split","_value$split2","_slicedToArray2","default","time","getCurrentDate","year","String","getFullYear","padStart","month","getMonth","day","getDate","deleteIconStyles","css","width","height","color","RemoveFieldButton","_ref","trailingIcon","createElement","Cell","span","IconButton","className","onClick","icon"],"sources":["utils.tsx"],"sourcesContent":["import React from \"react\";\nimport { css } from \"emotion\";\nimport { Cell } from \"@webiny/ui/Grid\";\nimport { IconButton } from \"@webiny/ui/Button\";\nimport { CmsModelField } from \"~/types\";\n\nexport const DEFAULT_TIMEZONE = \"+01:00\";\n\nexport const getDefaultFieldValue = (\n    field: CmsModelField,\n    bind: {\n        value: string | null | undefined;\n    },\n    getCurrent: () => string\n): string => {\n    const def = field.settings ? field.settings.defaultSetValue || \"null\" : \"null\";\n    if (bind.value || def !== \"current\") {\n        return bind.value || \"\";\n    }\n    return getCurrent();\n};\n\nexport const getCurrentTimeZone = (date?: Date): string | null => {\n    if (!date) {\n        date = new Date();\n    }\n    const value = date.toTimeString();\n\n    const matches = value.match(/GMT([+-][0-9]{4})/);\n    if (!matches) {\n        return null;\n    }\n    const timezone = matches[1];\n    return `${timezone.slice(0, 3)}:${timezone.slice(3)}`;\n};\n\nexport const getCurrentLocalTime = (date?: Date): string => {\n    if (!date) {\n        date = new Date();\n    }\n    const value = date.toTimeString();\n\n    const [time] = value.split(\" \");\n    if (!time || time.match(/^([0-9]{2}):([0-9]{2}):([0-9]{2})$/) === null) {\n        return \"00:00:00\";\n    }\n    return time;\n};\n\nexport const getCurrentDate = (date?: Date): string => {\n    if (!date) {\n        date = new Date();\n    }\n    const year = String(date.getFullYear()).padStart(4, \"0\");\n    const month = String(date.getMonth() + 1).padStart(2, \"0\");\n    const day = String(date.getDate()).padStart(2, \"0\");\n\n    return `${year}-${month}-${day}`;\n};\n\nconst deleteIconStyles = css({\n    width: \"100% !important\",\n    height: \"100% !important\",\n    color: \"var(--mdc-theme-text-secondary-on-background) !important\"\n});\n\ninterface RemoveFieldButtonProps {\n    trailingIcon: any;\n}\nexport const RemoveFieldButton = ({ trailingIcon }: RemoveFieldButtonProps) => {\n    if (!trailingIcon) {\n        return null;\n    }\n    return (\n        <Cell span={1}>\n            <IconButton\n                className={deleteIconStyles}\n                onClick={trailingIcon.onClick}\n                icon={trailingIcon.icon}\n            />\n        </Cell>\n    );\n};\n"],"mappings":"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","ignoreList":[]}

package/admin/plugins/fieldRenderers/dynamicZone/AddTemplate.d.ts

@@ -1,12 +1,12 @@
-/// <reference types="react" />
-import { CmsDynamicZoneTemplate } from "../../../../types";
+import React from "react";
+import { CmsDynamicZoneTemplateWithTypename } from "../../../../types";
 interface UseAddTemplateParams {
-    onTemplate: (template: CmsDynamicZoneTemplate) => void;
+    onTemplate: (template: CmsDynamicZoneTemplateWithTypename) => void;
 }
 interface AddTemplateProps {
     label?: string;
     onTemplate: UseAddTemplateParams["onTemplate"];
 }
-export declare const AddTemplateButton: (props: AddTemplateProps) => JSX.Element;
-export declare const AddTemplateIcon: (props: AddTemplateProps) => JSX.Element;
+export declare const AddTemplateButton: (props: AddTemplateProps) => React.JSX.Element;
+export declare const AddTemplateIcon: (props: AddTemplateProps) => React.JSX.Element;
 export {};

package/admin/plugins/fieldRenderers/dynamicZone/AddTemplate.js

@@ -6,36 +6,73 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.AddTemplateIcon = exports.AddTemplateButton = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _base = _interopRequireDefault(require("@emotion/styled/base"));
 var _react = _interopRequireWildcard(require("react"));
-var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _info = require("@material-design-icons/svg/outlined/info.svg");
 var _add_circle_outline = require("@material-design-icons/svg/round/add_circle_outline.svg");
 var _Typography = require("@webiny/ui/Typography");
 var _TemplateGallery = require("./TemplateGallery");
 var _Button = require("@webiny/ui/Button");
-var AddIconContainer = /*#__PURE__*/(0, _styled.default)("div", {
-  label: "AddIconContainer",
-  target: "e4w4vi60"
-})("text-align:center;padding-top:3px;");
-var AddButtonContainer = /*#__PURE__*/(0, _styled.default)("div", {
-  label: "AddButtonContainer",
-  target: "e4w4vi61"
-})("text-align:center;margin-top:20px;:first-of-type{margin-top:0;}");
-var Info = /*#__PURE__*/(0, _styled.default)("div", {
-  label: "Info",
+var _useTemplateTypename2 = require("./useTemplateTypename");
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+var AddIconContainer = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
   target: "e4w4vi62"
-})("display:flex;justify-content:center;align-items:center;margin-top:5px;> svg{width:20px;margin-right:5px;}");
+} : {
+  target: "e4w4vi62",
+  label: "AddIconContainer"
+})(process.env.NODE_ENV === "production" ? {
+  name: "okrxka",
+  styles: "text-align:center;padding-top:3px"
+} : {
+  name: "okrxka",
+  styles: "text-align:center;padding-top:3px",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkFkZFRlbXBsYXRlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFVbUMiLCJmaWxlIjoiQWRkVGVtcGxhdGUudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IFJlYWN0Q29tcG9uZW50IGFzIEluZm9JY29uIH0gZnJvbSBcIkBtYXRlcmlhbC1kZXNpZ24taWNvbnMvc3ZnL291dGxpbmVkL2luZm8uc3ZnXCI7XG5pbXBvcnQgeyBSZWFjdENvbXBvbmVudCBhcyBBZGRJY29uIH0gZnJvbSBcIkBtYXRlcmlhbC1kZXNpZ24taWNvbnMvc3ZnL3JvdW5kL2FkZF9jaXJjbGVfb3V0bGluZS5zdmdcIjtcbmltcG9ydCB7IFR5cG9ncmFwaHkgfSBmcm9tIFwiQHdlYmlueS91aS9UeXBvZ3JhcGh5XCI7XG5pbXBvcnQgeyBDbXNEeW5hbWljWm9uZVRlbXBsYXRlLCBDbXNEeW5hbWljWm9uZVRlbXBsYXRlV2l0aFR5cGVuYW1lIH0gZnJvbSBcIn4vdHlwZXNcIjtcbmltcG9ydCB7IFRlbXBsYXRlR2FsbGVyeSB9IGZyb20gXCIuL1RlbXBsYXRlR2FsbGVyeVwiO1xuaW1wb3J0IHsgSWNvbkJ1dHRvbiwgQnV0dG9uU2Vjb25kYXJ5IH0gZnJvbSBcIkB3ZWJpbnkvdWkvQnV0dG9uXCI7XG5pbXBvcnQgeyB1c2VUZW1wbGF0ZVR5cGVuYW1lIH0gZnJvbSBcIn4vYWRtaW4vcGx1Z2lucy9maWVsZFJlbmRlcmVycy9keW5hbWljWm9uZS91c2VUZW1wbGF0ZVR5cGVuYW1lXCI7XG5cbmNvbnN0IEFkZEljb25Db250YWluZXIgPSBzdHlsZWQuZGl2YFxuICAgIHRleHQtYWxpZ246IGNlbnRlcjtcbiAgICBwYWRkaW5nLXRvcDogM3B4O1xuYDtcblxuY29uc3QgQWRkQnV0dG9uQ29udGFpbmVyID0gc3R5bGVkLmRpdmBcbiAgICB0ZXh0LWFsaWduOiBjZW50ZXI7XG4gICAgbWFyZ2luLXRvcDogMjBweDtcblxuICAgIDpmaXJzdC1vZi10eXBlIHtcbiAgICAgICAgbWFyZ2luLXRvcDogMDtcbiAgICB9XG5gO1xuXG5jb25zdCBJbmZvID0gc3R5bGVkLmRpdmBcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgbWFyZ2luLXRvcDogNXB4O1xuXG4gICAgPiBzdmcge1xuICAgICAgICB3aWR0aDogMjBweDtcbiAgICAgICAgbWFyZ2luLXJpZ2h0OiA1cHg7XG4gICAgfVxuYDtcblxuaW50ZXJmYWNlIFVzZUFkZFRlbXBsYXRlUGFyYW1zIHtcbiAgICBvblRlbXBsYXRlOiAodGVtcGxhdGU6IENtc0R5bmFtaWNab25lVGVtcGxhdGVXaXRoVHlwZW5hbWUpID0+IHZvaWQ7XG59XG5cbmZ1bmN0aW9uIHVzZUFkZFRlbXBsYXRlKHBhcmFtczogVXNlQWRkVGVtcGxhdGVQYXJhbXMpIHtcbiAgICBjb25zdCBbc2hvd0dhbGxlcnksIHNldFNob3dHYWxsZXJ5XSA9IHVzZVN0YXRlKGZhbHNlKTtcbiAgICBjb25zdCB7IGdldEZ1bGxUeXBlbmFtZSB9ID0gdXNlVGVtcGxhdGVUeXBlbmFtZSgpO1xuXG4gICAgY29uc3QgYnJvd3NlVGVtcGxhdGVzID0gKCkgPT4ge1xuICAgICAgICBzZXRTaG93R2FsbGVyeSh0cnVlKTtcbiAgICB9O1xuXG4gICAgY29uc3Qgb25UZW1wbGF0ZSA9ICh0ZW1wbGF0ZTogQ21zRHluYW1pY1pvbmVUZW1wbGF0ZSkgPT4ge1xuICAgICAgICBwYXJhbXMub25UZW1wbGF0ZSh7IC4uLnRlbXBsYXRlLCBfX3R5cGVuYW1lOiBnZXRGdWxsVHlwZW5hbWUodGVtcGxhdGUpIH0pO1xuICAgICAgICBvbkdhbGxlcnlDbG9zZSgpO1xuICAgIH07XG5cbiAgICBjb25zdCBvbkdhbGxlcnlDbG9zZSA9ICgpID0+IHtcbiAgICAgICAgc2V0U2hvd0dhbGxlcnkoZmFsc2UpO1xuICAgIH07XG5cbiAgICByZXR1cm4ge1xuICAgICAgICBzaG93R2FsbGVyeSxcbiAgICAgICAgYnJvd3NlVGVtcGxhdGVzLFxuICAgICAgICBvblRlbXBsYXRlLFxuICAgICAgICBvbkdhbGxlcnlDbG9zZVxuICAgIH07XG59XG5cbmludGVyZmFjZSBBZGRUZW1wbGF0ZVByb3BzIHtcbiAgICBsYWJlbD86IHN0cmluZztcbiAgICBvblRlbXBsYXRlOiBVc2VBZGRUZW1wbGF0ZVBhcmFtc1tcIm9uVGVtcGxhdGVcIl07XG59XG5cbmV4cG9ydCBjb25zdCBBZGRUZW1wbGF0ZUJ1dHRvbiA9IChwcm9wczogQWRkVGVtcGxhdGVQcm9wcykgPT4ge1xuICAgIGNvbnN0IHsgc2hvd0dhbGxlcnksIG9uVGVtcGxhdGUsIGJyb3dzZVRlbXBsYXRlcywgb25HYWxsZXJ5Q2xvc2UgfSA9IHVzZUFkZFRlbXBsYXRlKHtcbiAgICAgICAgb25UZW1wbGF0ZTogcHJvcHMub25UZW1wbGF0ZVxuICAgIH0pO1xuXG4gICAgcmV0dXJuIChcbiAgICAgICAgPEFkZEJ1dHRvbkNvbnRhaW5lcj5cbiAgICAgICAgICAgIHtzaG93R2FsbGVyeSA/IChcbiAgICAgICAgICAgICAgICA8VGVtcGxhdGVHYWxsZXJ5IG9uVGVtcGxhdGU9e29uVGVtcGxhdGV9IG9uQ2xvc2U9e29uR2FsbGVyeUNsb3NlfSAvPlxuICAgICAgICAgICAgKSA6IChcbiAgICAgICAgICAgICAgICA8PlxuICAgICAgICAgICAgICAgICAgICA8QnV0dG9uU2Vjb25kYXJ5IG9uQ2xpY2s9e2Jyb3dzZVRlbXBsYXRlc30+KyBBZGQgYSB0ZW1wbGF0ZTwvQnV0dG9uU2Vjb25kYXJ5PlxuICAgICAgICAgICAgICAgICAgICA8SW5mbz5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxJbmZvSWNvbiAvPlxuICAgICAgICAgICAgICAgICAgICAgICAgPFR5cG9ncmFwaHkgdXNlPXtcImNhcHRpb25cIn0+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgQ2xpY2sgaGVyZSB0byBsZWFybiBob3cgdGVtcGxhdGVzIGFuZCBkeW5hbWljIHpvbmVzIHdvcmsuXG4gICAgICAgICAgICAgICAgICAgICAgICA8L1R5cG9ncmFwaHk+XG4gICAgICAgICAgICAgICAgICAgIDwvSW5mbz5cbiAgICAgICAgICAgICAgICA8Lz5cbiAgICAgICAgICAgICl9XG4gICAgICAgIDwvQWRkQnV0dG9uQ29udGFpbmVyPlxuICAgICk7XG59O1xuXG5leHBvcnQgY29uc3QgQWRkVGVtcGxhdGVJY29uID0gKHByb3BzOiBBZGRUZW1wbGF0ZVByb3BzKSA9PiB7XG4gICAgY29uc3QgeyBzaG93R2FsbGVyeSwgb25UZW1wbGF0ZSwgYnJvd3NlVGVtcGxhdGVzLCBvbkdhbGxlcnlDbG9zZSB9ID0gdXNlQWRkVGVtcGxhdGUoe1xuICAgICAgICBvblRlbXBsYXRlOiBwcm9wcy5vblRlbXBsYXRlXG4gICAgfSk7XG5cbiAgICByZXR1cm4gKFxuICAgICAgICA8QWRkSWNvbkNvbnRhaW5lcj5cbiAgICAgICAgICAgIHtzaG93R2FsbGVyeSA/IChcbiAgICAgICAgICAgICAgICA8VGVtcGxhdGVHYWxsZXJ5IG9uVGVtcGxhdGU9e29uVGVtcGxhdGV9IG9uQ2xvc2U9e29uR2FsbGVyeUNsb3NlfSAvPlxuICAgICAgICAgICAgKSA6IChcbiAgICAgICAgICAgICAgICA8SWNvbkJ1dHRvbiBvbkNsaWNrPXticm93c2VUZW1wbGF0ZXN9IGljb249ezxBZGRJY29uIC8+fSAvPlxuICAgICAgICAgICAgKX1cbiAgICAgICAgPC9BZGRJY29uQ29udGFpbmVyPlxuICAgICk7XG59O1xuIl19 */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+var AddButtonContainer = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
+  target: "e4w4vi61"
+} : {
+  target: "e4w4vi61",
+  label: "AddButtonContainer"
+})(process.env.NODE_ENV === "production" ? {
+  name: "xnx79a",
+  styles: "text-align:center;margin-top:20px;:first-of-type{margin-top:0;}"
+} : {
+  name: "xnx79a",
+  styles: "text-align:center;margin-top:20px;:first-of-type{margin-top:0;}",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkFkZFRlbXBsYXRlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFlcUMiLCJmaWxlIjoiQWRkVGVtcGxhdGUudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IFJlYWN0Q29tcG9uZW50IGFzIEluZm9JY29uIH0gZnJvbSBcIkBtYXRlcmlhbC1kZXNpZ24taWNvbnMvc3ZnL291dGxpbmVkL2luZm8uc3ZnXCI7XG5pbXBvcnQgeyBSZWFjdENvbXBvbmVudCBhcyBBZGRJY29uIH0gZnJvbSBcIkBtYXRlcmlhbC1kZXNpZ24taWNvbnMvc3ZnL3JvdW5kL2FkZF9jaXJjbGVfb3V0bGluZS5zdmdcIjtcbmltcG9ydCB7IFR5cG9ncmFwaHkgfSBmcm9tIFwiQHdlYmlueS91aS9UeXBvZ3JhcGh5XCI7XG5pbXBvcnQgeyBDbXNEeW5hbWljWm9uZVRlbXBsYXRlLCBDbXNEeW5hbWljWm9uZVRlbXBsYXRlV2l0aFR5cGVuYW1lIH0gZnJvbSBcIn4vdHlwZXNcIjtcbmltcG9ydCB7IFRlbXBsYXRlR2FsbGVyeSB9IGZyb20gXCIuL1RlbXBsYXRlR2FsbGVyeVwiO1xuaW1wb3J0IHsgSWNvbkJ1dHRvbiwgQnV0dG9uU2Vjb25kYXJ5IH0gZnJvbSBcIkB3ZWJpbnkvdWkvQnV0dG9uXCI7XG5pbXBvcnQgeyB1c2VUZW1wbGF0ZVR5cGVuYW1lIH0gZnJvbSBcIn4vYWRtaW4vcGx1Z2lucy9maWVsZFJlbmRlcmVycy9keW5hbWljWm9uZS91c2VUZW1wbGF0ZVR5cGVuYW1lXCI7XG5cbmNvbnN0IEFkZEljb25Db250YWluZXIgPSBzdHlsZWQuZGl2YFxuICAgIHRleHQtYWxpZ246IGNlbnRlcjtcbiAgICBwYWRkaW5nLXRvcDogM3B4O1xuYDtcblxuY29uc3QgQWRkQnV0dG9uQ29udGFpbmVyID0gc3R5bGVkLmRpdmBcbiAgICB0ZXh0LWFsaWduOiBjZW50ZXI7XG4gICAgbWFyZ2luLXRvcDogMjBweDtcblxuICAgIDpmaXJzdC1vZi10eXBlIHtcbiAgICAgICAgbWFyZ2luLXRvcDogMDtcbiAgICB9XG5gO1xuXG5jb25zdCBJbmZvID0gc3R5bGVkLmRpdmBcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgbWFyZ2luLXRvcDogNXB4O1xuXG4gICAgPiBzdmcge1xuICAgICAgICB3aWR0aDogMjBweDtcbiAgICAgICAgbWFyZ2luLXJpZ2h0OiA1cHg7XG4gICAgfVxuYDtcblxuaW50ZXJmYWNlIFVzZUFkZFRlbXBsYXRlUGFyYW1zIHtcbiAgICBvblRlbXBsYXRlOiAodGVtcGxhdGU6IENtc0R5bmFtaWNab25lVGVtcGxhdGVXaXRoVHlwZW5hbWUpID0+IHZvaWQ7XG59XG5cbmZ1bmN0aW9uIHVzZUFkZFRlbXBsYXRlKHBhcmFtczogVXNlQWRkVGVtcGxhdGVQYXJhbXMpIHtcbiAgICBjb25zdCBbc2hvd0dhbGxlcnksIHNldFNob3dHYWxsZXJ5XSA9IHVzZVN0YXRlKGZhbHNlKTtcbiAgICBjb25zdCB7IGdldEZ1bGxUeXBlbmFtZSB9ID0gdXNlVGVtcGxhdGVUeXBlbmFtZSgpO1xuXG4gICAgY29uc3QgYnJvd3NlVGVtcGxhdGVzID0gKCkgPT4ge1xuICAgICAgICBzZXRTaG93R2FsbGVyeSh0cnVlKTtcbiAgICB9O1xuXG4gICAgY29uc3Qgb25UZW1wbGF0ZSA9ICh0ZW1wbGF0ZTogQ21zRHluYW1pY1pvbmVUZW1wbGF0ZSkgPT4ge1xuICAgICAgICBwYXJhbXMub25UZW1wbGF0ZSh7IC4uLnRlbXBsYXRlLCBfX3R5cGVuYW1lOiBnZXRGdWxsVHlwZW5hbWUodGVtcGxhdGUpIH0pO1xuICAgICAgICBvbkdhbGxlcnlDbG9zZSgpO1xuICAgIH07XG5cbiAgICBjb25zdCBvbkdhbGxlcnlDbG9zZSA9ICgpID0+IHtcbiAgICAgICAgc2V0U2hvd0dhbGxlcnkoZmFsc2UpO1xuICAgIH07XG5cbiAgICByZXR1cm4ge1xuICAgICAgICBzaG93R2FsbGVyeSxcbiAgICAgICAgYnJvd3NlVGVtcGxhdGVzLFxuICAgICAgICBvblRlbXBsYXRlLFxuICAgICAgICBvbkdhbGxlcnlDbG9zZVxuICAgIH07XG59XG5cbmludGVyZmFjZSBBZGRUZW1wbGF0ZVByb3BzIHtcbiAgICBsYWJlbD86IHN0cmluZztcbiAgICBvblRlbXBsYXRlOiBVc2VBZGRUZW1wbGF0ZVBhcmFtc1tcIm9uVGVtcGxhdGVcIl07XG59XG5cbmV4cG9ydCBjb25zdCBBZGRUZW1wbGF0ZUJ1dHRvbiA9IChwcm9wczogQWRkVGVtcGxhdGVQcm9wcykgPT4ge1xuICAgIGNvbnN0IHsgc2hvd0dhbGxlcnksIG9uVGVtcGxhdGUsIGJyb3dzZVRlbXBsYXRlcywgb25HYWxsZXJ5Q2xvc2UgfSA9IHVzZUFkZFRlbXBsYXRlKHtcbiAgICAgICAgb25UZW1wbGF0ZTogcHJvcHMub25UZW1wbGF0ZVxuICAgIH0pO1xuXG4gICAgcmV0dXJuIChcbiAgICAgICAgPEFkZEJ1dHRvbkNvbnRhaW5lcj5cbiAgICAgICAgICAgIHtzaG93R2FsbGVyeSA/IChcbiAgICAgICAgICAgICAgICA8VGVtcGxhdGVHYWxsZXJ5IG9uVGVtcGxhdGU9e29uVGVtcGxhdGV9IG9uQ2xvc2U9e29uR2FsbGVyeUNsb3NlfSAvPlxuICAgICAgICAgICAgKSA6IChcbiAgICAgICAgICAgICAgICA8PlxuICAgICAgICAgICAgICAgICAgICA8QnV0dG9uU2Vjb25kYXJ5IG9uQ2xpY2s9e2Jyb3dzZVRlbXBsYXRlc30+KyBBZGQgYSB0ZW1wbGF0ZTwvQnV0dG9uU2Vjb25kYXJ5PlxuICAgICAgICAgICAgICAgICAgICA8SW5mbz5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxJbmZvSWNvbiAvPlxuICAgICAgICAgICAgICAgICAgICAgICAgPFR5cG9ncmFwaHkgdXNlPXtcImNhcHRpb25cIn0+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgQ2xpY2sgaGVyZSB0byBsZWFybiBob3cgdGVtcGxhdGVzIGFuZCBkeW5hbWljIHpvbmVzIHdvcmsuXG4gICAgICAgICAgICAgICAgICAgICAgICA8L1R5cG9ncmFwaHk+XG4gICAgICAgICAgICAgICAgICAgIDwvSW5mbz5cbiAgICAgICAgICAgICAgICA8Lz5cbiAgICAgICAgICAgICl9XG4gICAgICAgIDwvQWRkQnV0dG9uQ29udGFpbmVyPlxuICAgICk7XG59O1xuXG5leHBvcnQgY29uc3QgQWRkVGVtcGxhdGVJY29uID0gKHByb3BzOiBBZGRUZW1wbGF0ZVByb3BzKSA9PiB7XG4gICAgY29uc3QgeyBzaG93R2FsbGVyeSwgb25UZW1wbGF0ZSwgYnJvd3NlVGVtcGxhdGVzLCBvbkdhbGxlcnlDbG9zZSB9ID0gdXNlQWRkVGVtcGxhdGUoe1xuICAgICAgICBvblRlbXBsYXRlOiBwcm9wcy5vblRlbXBsYXRlXG4gICAgfSk7XG5cbiAgICByZXR1cm4gKFxuICAgICAgICA8QWRkSWNvbkNvbnRhaW5lcj5cbiAgICAgICAgICAgIHtzaG93R2FsbGVyeSA/IChcbiAgICAgICAgICAgICAgICA8VGVtcGxhdGVHYWxsZXJ5IG9uVGVtcGxhdGU9e29uVGVtcGxhdGV9IG9uQ2xvc2U9e29uR2FsbGVyeUNsb3NlfSAvPlxuICAgICAgICAgICAgKSA6IChcbiAgICAgICAgICAgICAgICA8SWNvbkJ1dHRvbiBvbkNsaWNrPXticm93c2VUZW1wbGF0ZXN9IGljb249ezxBZGRJY29uIC8+fSAvPlxuICAgICAgICAgICAgKX1cbiAgICAgICAgPC9BZGRJY29uQ29udGFpbmVyPlxuICAgICk7XG59O1xuIl19 */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+var Info = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
+  target: "e4w4vi60"
+} : {
+  target: "e4w4vi60",
+  label: "Info"
+})(process.env.NODE_ENV === "production" ? {
+  name: "s2m15f",
+  styles: "display:flex;justify-content:center;align-items:center;margin-top:5px;>svg{width:20px;margin-right:5px;}"
+} : {
+  name: "s2m15f",
+  styles: "display:flex;justify-content:center;align-items:center;margin-top:5px;>svg{width:20px;margin-right:5px;}",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkFkZFRlbXBsYXRlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF3QnVCIiwiZmlsZSI6IkFkZFRlbXBsYXRlLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwgeyB1c2VTdGF0ZSB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBSZWFjdENvbXBvbmVudCBhcyBJbmZvSWNvbiB9IGZyb20gXCJAbWF0ZXJpYWwtZGVzaWduLWljb25zL3N2Zy9vdXRsaW5lZC9pbmZvLnN2Z1wiO1xuaW1wb3J0IHsgUmVhY3RDb21wb25lbnQgYXMgQWRkSWNvbiB9IGZyb20gXCJAbWF0ZXJpYWwtZGVzaWduLWljb25zL3N2Zy9yb3VuZC9hZGRfY2lyY2xlX291dGxpbmUuc3ZnXCI7XG5pbXBvcnQgeyBUeXBvZ3JhcGh5IH0gZnJvbSBcIkB3ZWJpbnkvdWkvVHlwb2dyYXBoeVwiO1xuaW1wb3J0IHsgQ21zRHluYW1pY1pvbmVUZW1wbGF0ZSwgQ21zRHluYW1pY1pvbmVUZW1wbGF0ZVdpdGhUeXBlbmFtZSB9IGZyb20gXCJ+L3R5cGVzXCI7XG5pbXBvcnQgeyBUZW1wbGF0ZUdhbGxlcnkgfSBmcm9tIFwiLi9UZW1wbGF0ZUdhbGxlcnlcIjtcbmltcG9ydCB7IEljb25CdXR0b24sIEJ1dHRvblNlY29uZGFyeSB9IGZyb20gXCJAd2ViaW55L3VpL0J1dHRvblwiO1xuaW1wb3J0IHsgdXNlVGVtcGxhdGVUeXBlbmFtZSB9IGZyb20gXCJ+L2FkbWluL3BsdWdpbnMvZmllbGRSZW5kZXJlcnMvZHluYW1pY1pvbmUvdXNlVGVtcGxhdGVUeXBlbmFtZVwiO1xuXG5jb25zdCBBZGRJY29uQ29udGFpbmVyID0gc3R5bGVkLmRpdmBcbiAgICB0ZXh0LWFsaWduOiBjZW50ZXI7XG4gICAgcGFkZGluZy10b3A6IDNweDtcbmA7XG5cbmNvbnN0IEFkZEJ1dHRvbkNvbnRhaW5lciA9IHN0eWxlZC5kaXZgXG4gICAgdGV4dC1hbGlnbjogY2VudGVyO1xuICAgIG1hcmdpbi10b3A6IDIwcHg7XG5cbiAgICA6Zmlyc3Qtb2YtdHlwZSB7XG4gICAgICAgIG1hcmdpbi10b3A6IDA7XG4gICAgfVxuYDtcblxuY29uc3QgSW5mbyA9IHN0eWxlZC5kaXZgXG4gICAgZGlzcGxheTogZmxleDtcbiAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIG1hcmdpbi10b3A6IDVweDtcblxuICAgID4gc3ZnIHtcbiAgICAgICAgd2lkdGg6IDIwcHg7XG4gICAgICAgIG1hcmdpbi1yaWdodDogNXB4O1xuICAgIH1cbmA7XG5cbmludGVyZmFjZSBVc2VBZGRUZW1wbGF0ZVBhcmFtcyB7XG4gICAgb25UZW1wbGF0ZTogKHRlbXBsYXRlOiBDbXNEeW5hbWljWm9uZVRlbXBsYXRlV2l0aFR5cGVuYW1lKSA9PiB2b2lkO1xufVxuXG5mdW5jdGlvbiB1c2VBZGRUZW1wbGF0ZShwYXJhbXM6IFVzZUFkZFRlbXBsYXRlUGFyYW1zKSB7XG4gICAgY29uc3QgW3Nob3dHYWxsZXJ5LCBzZXRTaG93R2FsbGVyeV0gPSB1c2VTdGF0ZShmYWxzZSk7XG4gICAgY29uc3QgeyBnZXRGdWxsVHlwZW5hbWUgfSA9IHVzZVRlbXBsYXRlVHlwZW5hbWUoKTtcblxuICAgIGNvbnN0IGJyb3dzZVRlbXBsYXRlcyA9ICgpID0+IHtcbiAgICAgICAgc2V0U2hvd0dhbGxlcnkodHJ1ZSk7XG4gICAgfTtcblxuICAgIGNvbnN0IG9uVGVtcGxhdGUgPSAodGVtcGxhdGU6IENtc0R5bmFtaWNab25lVGVtcGxhdGUpID0+IHtcbiAgICAgICAgcGFyYW1zLm9uVGVtcGxhdGUoeyAuLi50ZW1wbGF0ZSwgX190eXBlbmFtZTogZ2V0RnVsbFR5cGVuYW1lKHRlbXBsYXRlKSB9KTtcbiAgICAgICAgb25HYWxsZXJ5Q2xvc2UoKTtcbiAgICB9O1xuXG4gICAgY29uc3Qgb25HYWxsZXJ5Q2xvc2UgPSAoKSA9PiB7XG4gICAgICAgIHNldFNob3dHYWxsZXJ5KGZhbHNlKTtcbiAgICB9O1xuXG4gICAgcmV0dXJuIHtcbiAgICAgICAgc2hvd0dhbGxlcnksXG4gICAgICAgIGJyb3dzZVRlbXBsYXRlcyxcbiAgICAgICAgb25UZW1wbGF0ZSxcbiAgICAgICAgb25HYWxsZXJ5Q2xvc2VcbiAgICB9O1xufVxuXG5pbnRlcmZhY2UgQWRkVGVtcGxhdGVQcm9wcyB7XG4gICAgbGFiZWw/OiBzdHJpbmc7XG4gICAgb25UZW1wbGF0ZTogVXNlQWRkVGVtcGxhdGVQYXJhbXNbXCJvblRlbXBsYXRlXCJdO1xufVxuXG5leHBvcnQgY29uc3QgQWRkVGVtcGxhdGVCdXR0b24gPSAocHJvcHM6IEFkZFRlbXBsYXRlUHJvcHMpID0+IHtcbiAgICBjb25zdCB7IHNob3dHYWxsZXJ5LCBvblRlbXBsYXRlLCBicm93c2VUZW1wbGF0ZXMsIG9uR2FsbGVyeUNsb3NlIH0gPSB1c2VBZGRUZW1wbGF0ZSh7XG4gICAgICAgIG9uVGVtcGxhdGU6IHByb3BzLm9uVGVtcGxhdGVcbiAgICB9KTtcblxuICAgIHJldHVybiAoXG4gICAgICAgIDxBZGRCdXR0b25Db250YWluZXI+XG4gICAgICAgICAgICB7c2hvd0dhbGxlcnkgPyAoXG4gICAgICAgICAgICAgICAgPFRlbXBsYXRlR2FsbGVyeSBvblRlbXBsYXRlPXtvblRlbXBsYXRlfSBvbkNsb3NlPXtvbkdhbGxlcnlDbG9zZX0gLz5cbiAgICAgICAgICAgICkgOiAoXG4gICAgICAgICAgICAgICAgPD5cbiAgICAgICAgICAgICAgICAgICAgPEJ1dHRvblNlY29uZGFyeSBvbkNsaWNrPXticm93c2VUZW1wbGF0ZXN9PisgQWRkIGEgdGVtcGxhdGU8L0J1dHRvblNlY29uZGFyeT5cbiAgICAgICAgICAgICAgICAgICAgPEluZm8+XG4gICAgICAgICAgICAgICAgICAgICAgICA8SW5mb0ljb24gLz5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxUeXBvZ3JhcGh5IHVzZT17XCJjYXB0aW9uXCJ9PlxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIENsaWNrIGhlcmUgdG8gbGVhcm4gaG93IHRlbXBsYXRlcyBhbmQgZHluYW1pYyB6b25lcyB3b3JrLlxuICAgICAgICAgICAgICAgICAgICAgICAgPC9UeXBvZ3JhcGh5PlxuICAgICAgICAgICAgICAgICAgICA8L0luZm8+XG4gICAgICAgICAgICAgICAgPC8+XG4gICAgICAgICAgICApfVxuICAgICAgICA8L0FkZEJ1dHRvbkNvbnRhaW5lcj5cbiAgICApO1xufTtcblxuZXhwb3J0IGNvbnN0IEFkZFRlbXBsYXRlSWNvbiA9IChwcm9wczogQWRkVGVtcGxhdGVQcm9wcykgPT4ge1xuICAgIGNvbnN0IHsgc2hvd0dhbGxlcnksIG9uVGVtcGxhdGUsIGJyb3dzZVRlbXBsYXRlcywgb25HYWxsZXJ5Q2xvc2UgfSA9IHVzZUFkZFRlbXBsYXRlKHtcbiAgICAgICAgb25UZW1wbGF0ZTogcHJvcHMub25UZW1wbGF0ZVxuICAgIH0pO1xuXG4gICAgcmV0dXJuIChcbiAgICAgICAgPEFkZEljb25Db250YWluZXI+XG4gICAgICAgICAgICB7c2hvd0dhbGxlcnkgPyAoXG4gICAgICAgICAgICAgICAgPFRlbXBsYXRlR2FsbGVyeSBvblRlbXBsYXRlPXtvblRlbXBsYXRlfSBvbkNsb3NlPXtvbkdhbGxlcnlDbG9zZX0gLz5cbiAgICAgICAgICAgICkgOiAoXG4gICAgICAgICAgICAgICAgPEljb25CdXR0b24gb25DbGljaz17YnJvd3NlVGVtcGxhdGVzfSBpY29uPXs8QWRkSWNvbiAvPn0gLz5cbiAgICAgICAgICAgICl9XG4gICAgICAgIDwvQWRkSWNvbkNvbnRhaW5lcj5cbiAgICApO1xufTtcbiJdfQ== */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
 function useAddTemplate(params) {
   var _useState = (0, _react.useState)(false),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     showGallery = _useState2[0],
     setShowGallery = _useState2[1];
+  var _useTemplateTypename = (0, _useTemplateTypename2.useTemplateTypename)(),
+    getFullTypename = _useTemplateTypename.getFullTypename;
   var browseTemplates = function browseTemplates() {
     setShowGallery(true);
   };
   var onTemplate = function onTemplate(template) {
-    params.onTemplate(template);
+    params.onTemplate((0, _objectSpread2.default)((0, _objectSpread2.default)({}, template), {}, {
+      __typename: getFullTypename(template)
+    }));
     onGalleryClose();
   };
   var onGalleryClose = function onGalleryClose() {
@@ -48,7 +85,7 @@ function useAddTemplate(params) {
     onGalleryClose: onGalleryClose
   };
 }
-var AddTemplateButton = function AddTemplateButton(props) {
+var AddTemplateButton = exports.AddTemplateButton = function AddTemplateButton(props) {
   var _useAddTemplate = useAddTemplate({
       onTemplate: props.onTemplate
     }),
@@ -65,8 +102,7 @@ var AddTemplateButton = function AddTemplateButton(props) {
     use: "caption"
   }, "Click here to learn how templates and dynamic zones work."))));
 };
-exports.AddTemplateButton = AddTemplateButton;
-var AddTemplateIcon = function AddTemplateIcon(props) {
+var AddTemplateIcon = exports.AddTemplateIcon = function AddTemplateIcon(props) {
   var _useAddTemplate2 = useAddTemplate({
       onTemplate: props.onTemplate
     }),
@@ -82,6 +118,5 @@ var AddTemplateIcon = function AddTemplateIcon(props) {
     icon: /*#__PURE__*/_react.default.createElement(_add_circle_outline.ReactComponent, null)
   }));
 };
-exports.AddTemplateIcon = AddTemplateIcon;
 
 //# sourceMappingURL=AddTemplate.js.map

package/admin/plugins/fieldRenderers/dynamicZone/AddTemplate.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_styled","_interopRequireDefault","_info","_add_circle_outline","_Typography","_TemplateGallery","_Button","AddIconContainer","styled","label","target","AddButtonContainer","Info","useAddTemplate","params","_useState","useState","_useState2","_slicedToArray2","default","showGallery","setShowGallery","browseTemplates","onTemplate","template","onGalleryClose","AddTemplateButton","props","_useAddTemplate","createElement","TemplateGallery","onClose","Fragment","ButtonSecondary","onClick","ReactComponent","Typography","use","exports","AddTemplateIcon","_useAddTemplate2","IconButton","icon"],"sources":["AddTemplate.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport styled from \"@emotion/styled\";\nimport { ReactComponent as InfoIcon } from \"@material-design-icons/svg/outlined/info.svg\";\nimport { ReactComponent as AddIcon } from \"@material-design-icons/svg/round/add_circle_outline.svg\";\nimport { Typography } from \"@webiny/ui/Typography\";\nimport { CmsDynamicZoneTemplate } from \"~/types\";\nimport { TemplateGallery } from \"./TemplateGallery\";\nimport { IconButton, ButtonSecondary } from \"@webiny/ui/Button\";\n\nconst AddIconContainer = styled.div`\n    text-align: center;\n    padding-top: 3px;\n`;\n\nconst AddButtonContainer = styled.div`\n    text-align: center;\n    margin-top: 20px;\n\n    :first-of-type {\n        margin-top: 0;\n    }\n`;\n\nconst Info = styled.div`\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    margin-top: 5px;\n\n    > svg {\n        width: 20px;\n        margin-right: 5px;\n    }\n`;\n\ninterface UseAddTemplateParams {\n    onTemplate: (template: CmsDynamicZoneTemplate) => void;\n}\n\nfunction useAddTemplate(params: UseAddTemplateParams) {\n    const [showGallery, setShowGallery] = useState(false);\n\n    const browseTemplates = () => {\n        setShowGallery(true);\n    };\n\n    const onTemplate = (template: CmsDynamicZoneTemplate) => {\n        params.onTemplate(template);\n        onGalleryClose();\n    };\n\n    const onGalleryClose = () => {\n        setShowGallery(false);\n    };\n\n    return {\n        showGallery,\n        browseTemplates,\n        onTemplate,\n        onGalleryClose\n    };\n}\n\ninterface AddTemplateProps {\n    label?: string;\n    onTemplate: UseAddTemplateParams[\"onTemplate\"];\n}\n\nexport const AddTemplateButton = (props: AddTemplateProps) => {\n    const { showGallery, onTemplate, browseTemplates, onGalleryClose } = useAddTemplate({\n        onTemplate: props.onTemplate\n    });\n\n    return (\n        <AddButtonContainer>\n            {showGallery ? (\n                <TemplateGallery onTemplate={onTemplate} onClose={onGalleryClose} />\n            ) : (\n                <>\n                    <ButtonSecondary onClick={browseTemplates}>+ Add a template</ButtonSecondary>\n                    <Info>\n                        <InfoIcon />\n                        <Typography use={\"caption\"}>\n                            Click here to learn how templates and dynamic zones work.\n                        </Typography>\n                    </Info>\n                </>\n            )}\n        </AddButtonContainer>\n    );\n};\n\nexport const AddTemplateIcon = (props: AddTemplateProps) => {\n    const { showGallery, onTemplate, browseTemplates, onGalleryClose } = useAddTemplate({\n        onTemplate: props.onTemplate\n    });\n\n    return (\n        <AddIconContainer>\n            {showGallery ? (\n                <TemplateGallery onTemplate={onTemplate} onClose={onGalleryClose} />\n            ) : (\n                <IconButton onClick={browseTemplates} icon={<AddIcon />} />\n            )}\n        </AddIconContainer>\n    );\n};\n"],"mappings":"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"}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_info","_add_circle_outline","_Typography","_TemplateGallery","_Button","_useTemplateTypename2","_EMOTION_STRINGIFIED_CSS_ERROR__","AddIconContainer","_base","default","process","env","NODE_ENV","target","label","name","styles","map","toString","AddButtonContainer","Info","useAddTemplate","params","_useState","useState","_useState2","_slicedToArray2","showGallery","setShowGallery","_useTemplateTypename","useTemplateTypename","getFullTypename","browseTemplates","onTemplate","template","_objectSpread2","__typename","onGalleryClose","AddTemplateButton","exports","props","_useAddTemplate","createElement","TemplateGallery","onClose","Fragment","ButtonSecondary","onClick","ReactComponent","Typography","use","AddTemplateIcon","_useAddTemplate2","IconButton","icon"],"sources":["AddTemplate.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport styled from \"@emotion/styled\";\nimport { ReactComponent as InfoIcon } from \"@material-design-icons/svg/outlined/info.svg\";\nimport { ReactComponent as AddIcon } from \"@material-design-icons/svg/round/add_circle_outline.svg\";\nimport { Typography } from \"@webiny/ui/Typography\";\nimport { CmsDynamicZoneTemplate, CmsDynamicZoneTemplateWithTypename } from \"~/types\";\nimport { TemplateGallery } from \"./TemplateGallery\";\nimport { IconButton, ButtonSecondary } from \"@webiny/ui/Button\";\nimport { useTemplateTypename } from \"~/admin/plugins/fieldRenderers/dynamicZone/useTemplateTypename\";\n\nconst AddIconContainer = styled.div`\n    text-align: center;\n    padding-top: 3px;\n`;\n\nconst AddButtonContainer = styled.div`\n    text-align: center;\n    margin-top: 20px;\n\n    :first-of-type {\n        margin-top: 0;\n    }\n`;\n\nconst Info = styled.div`\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    margin-top: 5px;\n\n    > svg {\n        width: 20px;\n        margin-right: 5px;\n    }\n`;\n\ninterface UseAddTemplateParams {\n    onTemplate: (template: CmsDynamicZoneTemplateWithTypename) => void;\n}\n\nfunction useAddTemplate(params: UseAddTemplateParams) {\n    const [showGallery, setShowGallery] = useState(false);\n    const { getFullTypename } = useTemplateTypename();\n\n    const browseTemplates = () => {\n        setShowGallery(true);\n    };\n\n    const onTemplate = (template: CmsDynamicZoneTemplate) => {\n        params.onTemplate({ ...template, __typename: getFullTypename(template) });\n        onGalleryClose();\n    };\n\n    const onGalleryClose = () => {\n        setShowGallery(false);\n    };\n\n    return {\n        showGallery,\n        browseTemplates,\n        onTemplate,\n        onGalleryClose\n    };\n}\n\ninterface AddTemplateProps {\n    label?: string;\n    onTemplate: UseAddTemplateParams[\"onTemplate\"];\n}\n\nexport const AddTemplateButton = (props: AddTemplateProps) => {\n    const { showGallery, onTemplate, browseTemplates, onGalleryClose } = useAddTemplate({\n        onTemplate: props.onTemplate\n    });\n\n    return (\n        <AddButtonContainer>\n            {showGallery ? (\n                <TemplateGallery onTemplate={onTemplate} onClose={onGalleryClose} />\n            ) : (\n                <>\n                    <ButtonSecondary onClick={browseTemplates}>+ Add a template</ButtonSecondary>\n                    <Info>\n                        <InfoIcon />\n                        <Typography use={\"caption\"}>\n                            Click here to learn how templates and dynamic zones work.\n                        </Typography>\n                    </Info>\n                </>\n            )}\n        </AddButtonContainer>\n    );\n};\n\nexport const AddTemplateIcon = (props: AddTemplateProps) => {\n    const { showGallery, onTemplate, browseTemplates, onGalleryClose } = useAddTemplate({\n        onTemplate: props.onTemplate\n    });\n\n    return (\n        <AddIconContainer>\n            {showGallery ? (\n                <TemplateGallery onTemplate={onTemplate} onClose={onGalleryClose} />\n            ) : (\n                <IconButton onClick={browseTemplates} icon={<AddIcon />} />\n            )}\n        </AddIconContainer>\n    );\n};\n"],"mappings":"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","ignoreList":[]}

package/admin/plugins/fieldRenderers/dynamicZone/MultiValueDynamicZone.d.ts

@@ -20,8 +20,9 @@ export interface MultiValueItemContainerProps {
 export declare const MultiValueItemContainer: import("@webiny/react-composition").GenericComponent<MultiValueItemContainerProps> & {
     original: import("@webiny/react-composition").GenericComponent<MultiValueItemContainerProps>;
     originalName: string;
+    displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition").Decorator<(props: MultiValueItemContainerProps) => JSX.Element | null>) => (props: unknown) => JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition").Decorator<(props: MultiValueItemContainerProps) => JSX.Element | null>) => (props: unknown) => React.JSX.Element;
 };
 export interface MultiValueItemItemProps {
     template: CmsDynamicZoneTemplate;
@@ -31,8 +32,9 @@ export interface MultiValueItemItemProps {
 export declare const MultiValueItem: import("@webiny/react-composition").GenericComponent<MultiValueItemItemProps> & {
     original: import("@webiny/react-composition").GenericComponent<MultiValueItemItemProps>;
     originalName: string;
+    displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition").Decorator<(props: MultiValueItemItemProps) => JSX.Element | null>) => (props: unknown) => JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition").Decorator<(props: MultiValueItemItemProps) => JSX.Element | null>) => (props: unknown) => React.JSX.Element;
 };
 interface TemplateValue {
     _templateId: string;
@@ -44,8 +46,9 @@ export interface MultiValueContainerProps extends MultiValueDynamicZoneProps {
 export declare const MultiValueContainer: import("@webiny/react-composition").GenericComponent<MultiValueContainerProps> & {
     original: import("@webiny/react-composition").GenericComponent<MultiValueContainerProps>;
     originalName: string;
+    displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition").Decorator<(props: MultiValueContainerProps) => JSX.Element | null>) => (props: unknown) => JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition").Decorator<(props: MultiValueContainerProps) => JSX.Element | null>) => (props: unknown) => React.JSX.Element;
 };
 interface MultiValueDynamicZoneProps {
     field: CmsModelField;
@@ -53,5 +56,5 @@ interface MultiValueDynamicZoneProps {
     contentModel: CmsModel;
     getBind: GetBind;
 }
-export declare const MultiValueDynamicZone: (props: MultiValueDynamicZoneProps) => JSX.Element;
+export declare const MultiValueDynamicZone: (props: MultiValueDynamicZoneProps) => React.JSX.Element;
 export {};

package/admin/plugins/fieldRenderers/dynamicZone/MultiValueDynamicZone.js

@@ -5,8 +5,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.MultiValueItemContainer = exports.MultiValueItem = exports.MultiValueDynamicZone = exports.MultiValueContainer = void 0;
+var _base = _interopRequireDefault(require("@emotion/styled/base"));
 var _react = _interopRequireDefault(require("react"));
-var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _cloneDeep = _interopRequireDefault(require("lodash/cloneDeep"));
 var _Accordion = require("@webiny/ui/Accordion");
 var _delete_outline = require("@material-design-icons/svg/outlined/delete_outline.svg");
@@ -19,11 +19,23 @@ var _hooks = require("../../../hooks");
 var _Fields = require("../../../components/ContentEntryForm/Fields");
 var _reactComposition = require("@webiny/react-composition");
 var _TemplateProvider = require("./TemplateProvider");
-var BottomMargin = /*#__PURE__*/(0, _styled.default)("div", {
-  label: "BottomMargin",
+var _ModelFieldProvider = require("../../../components/ModelFieldProvider");
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+var BottomMargin = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
   target: "e1mhu37c0"
-})("margin-bottom:20px;");
-var MultiValueItemContainer = (0, _reactComposition.makeDecoratable)("MultiValueItemContainer", function (_ref) {
+} : {
+  target: "e1mhu37c0",
+  label: "BottomMargin"
+})(process.env.NODE_ENV === "production" ? {
+  name: "1azpx8r",
+  styles: "margin-bottom:20px"
+} : {
+  name: "1azpx8r",
+  styles: "margin-bottom:20px",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk11bHRpVmFsdWVEeW5hbWljWm9uZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBeUIrQiIsImZpbGUiOiJNdWx0aVZhbHVlRHluYW1pY1pvbmUudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgY2xvbmVEZWVwIGZyb20gXCJsb2Rhc2gvY2xvbmVEZWVwXCI7XG5pbXBvcnQgeyBBY2NvcmRpb24sIEFjY29yZGlvbkl0ZW0gfSBmcm9tIFwiQHdlYmlueS91aS9BY2NvcmRpb25cIjtcbmltcG9ydCB7IFJlYWN0Q29tcG9uZW50IGFzIERlbGV0ZUljb24gfSBmcm9tIFwiQG1hdGVyaWFsLWRlc2lnbi1pY29ucy9zdmcvb3V0bGluZWQvZGVsZXRlX291dGxpbmUuc3ZnXCI7XG5pbXBvcnQgeyBSZWFjdENvbXBvbmVudCBhcyBDbG9uZUljb24gfSBmcm9tIFwiQG1hdGVyaWFsLWRlc2lnbi1pY29ucy9zdmcvb3V0bGluZWQvbGlicmFyeV9hZGQuc3ZnXCI7XG5pbXBvcnQgeyBSZWFjdENvbXBvbmVudCBhcyBBcnJvd1VwSWNvbiB9IGZyb20gXCJAbWF0ZXJpYWwtZGVzaWduLWljb25zL3N2Zy9yb3VuZC9leHBhbmRfbGVzcy5zdmdcIjtcbmltcG9ydCB7IFJlYWN0Q29tcG9uZW50IGFzIEFycm93RG93bkljb24gfSBmcm9tIFwiQG1hdGVyaWFsLWRlc2lnbi1pY29ucy9zdmcvcm91bmQvZXhwYW5kX21vcmUuc3ZnXCI7XG5pbXBvcnQgeyBBZGRUZW1wbGF0ZUJ1dHRvbiwgQWRkVGVtcGxhdGVJY29uIH0gZnJvbSBcIi4vQWRkVGVtcGxhdGVcIjtcbmltcG9ydCB7IFRlbXBsYXRlSWNvbiB9IGZyb20gXCIuL1RlbXBsYXRlSWNvblwiO1xuaW1wb3J0IHsgUGFyZW50RmllbGRQcm92aWRlciwgdXNlTW9kZWxGaWVsZCB9IGZyb20gXCJ+L2FkbWluL2hvb2tzXCI7XG5pbXBvcnQgeyBGaWVsZHMgfSBmcm9tIFwifi9hZG1pbi9jb21wb25lbnRzL0NvbnRlbnRFbnRyeUZvcm0vRmllbGRzXCI7XG5pbXBvcnQge1xuICAgIEJpbmRDb21wb25lbnQsXG4gICAgQmluZENvbXBvbmVudFJlbmRlclByb3AsXG4gICAgQ21zRHluYW1pY1pvbmVUZW1wbGF0ZSxcbiAgICBDbXNNb2RlbEZpZWxkUmVuZGVyZXJQcm9wcyxcbiAgICBDbXNNb2RlbCxcbiAgICBDbXNNb2RlbEZpZWxkLFxuICAgIENtc0R5bmFtaWNab25lVGVtcGxhdGVXaXRoVHlwZW5hbWVcbn0gZnJvbSBcIn4vdHlwZXNcIjtcbmltcG9ydCB7IG1ha2VEZWNvcmF0YWJsZSB9IGZyb20gXCJAd2ViaW55L3JlYWN0LWNvbXBvc2l0aW9uXCI7XG5pbXBvcnQgeyBUZW1wbGF0ZVByb3ZpZGVyIH0gZnJvbSBcIn4vYWRtaW4vcGx1Z2lucy9maWVsZFJlbmRlcmVycy9keW5hbWljWm9uZS9UZW1wbGF0ZVByb3ZpZGVyXCI7XG5pbXBvcnQgeyBQYXJlbnRWYWx1ZUluZGV4UHJvdmlkZXIgfSBmcm9tIFwifi9hZG1pbi9jb21wb25lbnRzL01vZGVsRmllbGRQcm92aWRlclwiO1xuXG5jb25zdCBCb3R0b21NYXJnaW4gPSBzdHlsZWQuZGl2YFxuICAgIG1hcmdpbi1ib3R0b206IDIwcHg7XG5gO1xuXG50eXBlIEdldEJpbmQgPSBDbXNNb2RlbEZpZWxkUmVuZGVyZXJQcm9wc1tcImdldEJpbmRcIl07XG5cbmV4cG9ydCBpbnRlcmZhY2UgTXVsdGlWYWx1ZUl0ZW1Db250YWluZXJQcm9wcyB7XG4gICAgdmFsdWU6IFRlbXBsYXRlVmFsdWU7XG4gICAgY29udGVudE1vZGVsOiBDbXNNb2RlbDtcbiAgICBpc0ZpcnN0OiBib29sZWFuO1xuICAgIGlzTGFzdDogYm9vbGVhbjtcbiAgICBvbk1vdmVVcDogKCkgPT4gdm9pZDtcbiAgICBvbk1vdmVEb3duOiAoKSA9PiB2b2lkO1xuICAgIG9uRGVsZXRlOiAoKSA9PiB2b2lkO1xuICAgIG9uQ2xvbmU6ICgpID0+IHZvaWQ7XG4gICAgdGl0bGU6IFJlYWN0LlJlYWN0Tm9kZTtcbiAgICBkZXNjcmlwdGlvbjogc3RyaW5nO1xuICAgIGljb246IEpTWC5FbGVtZW50O1xuICAgIGFjdGlvbnM6IEpTWC5FbGVtZW50O1xuICAgIHRlbXBsYXRlOiBDbXNEeW5hbWljWm9uZVRlbXBsYXRlO1xuICAgIGNoaWxkcmVuOiBSZWFjdC5SZWFjdE5vZGU7XG59XG5cbmV4cG9ydCBjb25zdCBNdWx0aVZhbHVlSXRlbUNvbnRhaW5lciA9IG1ha2VEZWNvcmF0YWJsZShcbiAgICBcIk11bHRpVmFsdWVJdGVtQ29udGFpbmVyXCIsXG4gICAgKHsgdGl0bGUsIGRlc2NyaXB0aW9uLCBpY29uLCBhY3Rpb25zLCBjaGlsZHJlbiB9OiBNdWx0aVZhbHVlSXRlbUNvbnRhaW5lclByb3BzKSA9PiB7XG4gICAgICAgIHJldHVybiAoXG4gICAgICAgICAgICA8QWNjb3JkaW9uSXRlbSB0aXRsZT17dGl0bGV9IGRlc2NyaXB0aW9uPXtkZXNjcmlwdGlvbn0gaWNvbj17aWNvbn0gYWN0aW9ucz17YWN0aW9uc30+XG4gICAgICAgICAgICAgICAge2NoaWxkcmVufVxuICAgICAgICAgICAgPC9BY2NvcmRpb25JdGVtPlxuICAgICAgICApO1xuICAgIH1cbik7XG5cbmV4cG9ydCBpbnRlcmZhY2UgTXVsdGlWYWx1ZUl0ZW1JdGVtUHJvcHMge1xuICAgIHRlbXBsYXRlOiBDbXNEeW5hbWljWm9uZVRlbXBsYXRlO1xuICAgIGNvbnRlbnRNb2RlbDogQ21zTW9kZWw7XG4gICAgQmluZDogQmluZENvbXBvbmVudDtcbn1cblxuZXhwb3J0IGNvbnN0IE11bHRpVmFsdWVJdGVtID0gbWFrZURlY29yYXRhYmxlKFxuICAgIFwiTXVsdGlWYWx1ZUl0ZW1cIixcbiAgICAocHJvcHM6IE11bHRpVmFsdWVJdGVtSXRlbVByb3BzKSA9PiB7XG4gICAgICAgIGNvbnN0IHsgdGVtcGxhdGUsIEJpbmQsIGNvbnRlbnRNb2RlbCB9ID0gcHJvcHM7XG5cbiAgICAgICAgcmV0dXJuIChcbiAgICAgICAgICAgIDxUZW1wbGF0ZVByb3ZpZGVyIHRlbXBsYXRlPXt0ZW1wbGF0ZX0+XG4gICAgICAgICAgICAgICAgPEZpZWxkc1xuICAgICAgICAgICAgICAgICAgICBmaWVsZHM9e3RlbXBsYXRlLmZpZWxkc31cbiAgICAgICAgICAgICAgICAgICAgbGF5b3V0PXt0ZW1wbGF0ZS5sYXlvdXQgfHwgW119XG4gICAgICAgICAgICAgICAgICAgIGNvbnRlbnRNb2RlbD17Y29udGVudE1vZGVsfVxuICAgICAgICAgICAgICAgICAgICBCaW5kPXtCaW5kfVxuICAgICAgICAgICAgICAgIC8+XG4gICAgICAgICAgICA8L1RlbXBsYXRlUHJvdmlkZXI+XG4gICAgICAgICk7XG4gICAgfVxuKTtcblxuaW50ZXJmYWNlIFRlbXBsYXRlVmFsdWUge1xuICAgIF90ZW1wbGF0ZUlkOiBzdHJpbmc7XG4gICAgW2tleTogc3RyaW5nXTogYW55O1xufVxuXG5pbnRlcmZhY2UgVGVtcGxhdGVWYWx1ZUZvcm1Qcm9wcyB7XG4gICAgdmFsdWU6IFRlbXBsYXRlVmFsdWU7XG4gICAgY29udGVudE1vZGVsOiBDbXNNb2RlbDtcbiAgICBCaW5kOiBCaW5kQ29tcG9uZW50O1xuICAgIGlzRmlyc3Q6IGJvb2xlYW47XG4gICAgaXNMYXN0OiBib29sZWFuO1xuICAgIG9uTW92ZVVwOiAoKSA9PiB2b2lkO1xuICAgIG9uTW92ZURvd246ICgpID0+IHZvaWQ7XG4gICAgb25EZWxldGU6ICgpID0+IHZvaWQ7XG4gICAgb25DbG9uZTogKCkgPT4gdm9pZDtcbn1cblxuY29uc3QgVGVtcGxhdGVWYWx1ZUZvcm0gPSAoe1xuICAgIHZhbHVlLFxuICAgIGNvbnRlbnRNb2RlbCxcbiAgICBCaW5kLFxuICAgIGlzTGFzdCxcbiAgICBpc0ZpcnN0LFxuICAgIG9uTW92ZVVwLFxuICAgIG9uTW92ZURvd24sXG4gICAgb25EZWxldGUsXG4gICAgb25DbG9uZVxufTogVGVtcGxhdGVWYWx1ZUZvcm1Qcm9wcykgPT4ge1xuICAgIGNvbnN0IHsgZmllbGQgfSA9IHVzZU1vZGVsRmllbGQoKTtcbiAgICBjb25zdCB0ZW1wbGF0ZXMgPSBmaWVsZC5zZXR0aW5ncz8udGVtcGxhdGVzIHx8IFtdO1xuXG4gICAgY29uc3QgdGVtcGxhdGU6IENtc0R5bmFtaWNab25lVGVtcGxhdGUgfCB1bmRlZmluZWQgPSB0ZW1wbGF0ZXMuZmluZChcbiAgICAgICAgdHBsID0+IHRwbC5pZCA9PT0gdmFsdWUuX3RlbXBsYXRlSWRcbiAgICApO1xuXG4gICAgaWYgKCF0ZW1wbGF0ZSkge1xuICAgICAgICByZXR1cm4gbnVsbDtcbiAgICB9XG5cbiAgICByZXR1cm4gKFxuICAgICAgICA8TXVsdGlWYWx1ZUl0ZW1Db250YWluZXJcbiAgICAgICAgICAgIHZhbHVlPXt2YWx1ZX1cbiAgICAgICAgICAgIGNvbnRlbnRNb2RlbD17Y29udGVudE1vZGVsfVxuICAgICAgICAgICAgb25DbG9uZT17b25DbG9uZX1cbiAgICAgICAgICAgIGlzRmlyc3Q9e2lzRmlyc3R9XG4gICAgICAgICAgICBpc0xhc3Q9e2lzTGFzdH1cbiAgICAgICAgICAgIG9uRGVsZXRlPXtvbkRlbGV0ZX1cbiAgICAgICAgICAgIG9uTW92ZVVwPXtvbk1vdmVVcH1cbiAgICAgICAgICAgIG9uTW92ZURvd249e29uTW92ZURvd259XG4gICAgICAgICAgICB0aXRsZT17dGVtcGxhdGUubmFtZX1cbiAgICAgICAgICAgIGRlc2NyaXB0aW9uPXt0ZW1wbGF0ZS5kZXNjcmlwdGlvbn1cbiAgICAgICAgICAgIGljb249ezxUZW1wbGF0ZUljb24gaWNvbj17dGVtcGxhdGUuaWNvbn0gLz59XG4gICAgICAgICAgICB0ZW1wbGF0ZT17dGVtcGxhdGV9XG4gICAgICAgICAgICBhY3Rpb25zPXtcbiAgICAgICAgICAgICAgICA8QWNjb3JkaW9uSXRlbS5BY3Rpb25zPlxuICAgICAgICAgICAgICAgICAgICA8QWNjb3JkaW9uSXRlbS5BY3Rpb25cbiAgICAgICAgICAgICAgICAgICAgICAgIGljb249ezxBcnJvd1VwSWNvbiAvPn1cbiAgICAgICAgICAgICAgICAgICAgICAgIG9uQ2xpY2s9e29uTW92ZVVwfVxuICAgICAgICAgICAgICAgICAgICAgICAgZGlzYWJsZWQ9e2lzRmlyc3R9XG4gICAgICAgICAgICAgICAgICAgIC8+XG4gICAgICAgICAgICAgICAgICAgIDxBY2NvcmRpb25JdGVtLkFjdGlvblxuICAgICAgICAgICAgICAgICAgICAgICAgaWNvbj17PEFycm93RG93bkljb24gLz59XG4gICAgICAgICAgICAgICAgICAgICAgICBvbkNsaWNrPXtvbk1vdmVEb3dufVxuICAgICAgICAgICAgICAgICAgICAgICAgZGlzYWJsZWQ9e2lzTGFzdH1cbiAgICAgICAgICAgICAgICAgICAgLz5cbiAgICAgICAgICAgICAgICAgICAgPEFjY29yZGlvbkl0ZW0uRGl2aWRlciAvPlxuICAgICAgICAgICAgICAgICAgICA8QWNjb3JkaW9uSXRlbS5BY3Rpb24gaWNvbj17PENsb25lSWNvbiAvPn0gb25DbGljaz17b25DbG9uZX0gLz5cbiAgICAgICAgICAgICAgICAgICAgPEFjY29yZGlvbkl0ZW0uQWN0aW9uIGljb249ezxEZWxldGVJY29uIC8+fSBvbkNsaWNrPXtvbkRlbGV0ZX0gLz5cbiAgICAgICAgICAgICAgICA8L0FjY29yZGlvbkl0ZW0uQWN0aW9ucz5cbiAgICAgICAgICAgIH1cbiAgICAgICAgPlxuICAgICAgICAgICAgPE11bHRpVmFsdWVJdGVtIHRlbXBsYXRlPXt0ZW1wbGF0ZX0gY29udGVudE1vZGVsPXtjb250ZW50TW9kZWx9IEJpbmQ9e0JpbmR9IC8+XG4gICAgICAgIDwvTXVsdGlWYWx1ZUl0ZW1Db250YWluZXI+XG4gICAgKTtcbn07XG5cbmV4cG9ydCBpbnRlcmZhY2UgTXVsdGlWYWx1ZUNvbnRhaW5lclByb3BzIGV4dGVuZHMgTXVsdGlWYWx1ZUR5bmFtaWNab25lUHJvcHMge1xuICAgIGNoaWxkcmVuOiBSZWFjdC5SZWFjdE5vZGU7XG59XG5cbmV4cG9ydCBjb25zdCBNdWx0aVZhbHVlQ29udGFpbmVyID0gbWFrZURlY29yYXRhYmxlKFxuICAgIFwiTXVsdGlWYWx1ZUNvbnRhaW5lclwiLFxuICAgICh7IGNoaWxkcmVuIH06IE11bHRpVmFsdWVDb250YWluZXJQcm9wcykgPT4ge1xuICAgICAgICByZXR1cm4gKFxuICAgICAgICAgICAgPEFjY29yZGlvbj5cbiAgICAgICAgICAgICAgICA8PntjaGlsZHJlbn08Lz5cbiAgICAgICAgICAgIDwvQWNjb3JkaW9uPlxuICAgICAgICApO1xuICAgIH1cbik7XG5cbmludGVyZmFjZSBNdWx0aVZhbHVlRHluYW1pY1pvbmVQcm9wcyB7XG4gICAgLy8gVE9ETzogdGhpcyBwcm9wIG1pZ2h0IGJlIHVzZWxlc3MsIGJlY2F1c2Ugd2Ugbm93IGhhdmUgYSBgdXNlTW9kZWxGaWVsZGAgaG9vay5cbiAgICBmaWVsZDogQ21zTW9kZWxGaWVsZDtcbiAgICBiaW5kOiBCaW5kQ29tcG9uZW50UmVuZGVyUHJvcDtcbiAgICBjb250ZW50TW9kZWw6IENtc01vZGVsO1xuICAgIGdldEJpbmQ6IEdldEJpbmQ7XG59XG5cbmV4cG9ydCBjb25zdCBNdWx0aVZhbHVlRHluYW1pY1pvbmUgPSAocHJvcHM6IE11bHRpVmFsdWVEeW5hbWljWm9uZVByb3BzKSA9PiB7XG4gICAgY29uc3QgeyBiaW5kLCBnZXRCaW5kLCBjb250ZW50TW9kZWwgfSA9IHByb3BzO1xuICAgIGNvbnN0IG9uVGVtcGxhdGUgPSAodGVtcGxhdGU6IENtc0R5bmFtaWNab25lVGVtcGxhdGVXaXRoVHlwZW5hbWUpID0+IHtcbiAgICAgICAgYmluZC5hcHBlbmRWYWx1ZSh7IF90ZW1wbGF0ZUlkOiB0ZW1wbGF0ZS5pZCwgX190eXBlbmFtZTogdGVtcGxhdGUuX190eXBlbmFtZSB9KTtcbiAgICB9O1xuXG4gICAgY29uc3QgY2xvbmVWYWx1ZSA9IChpbmRleDogbnVtYmVyKSA9PiB7XG4gICAgICAgIGNvbnN0IG5ld1ZhbHVlID0gY2xvbmVEZWVwKGJpbmQudmFsdWVbaW5kZXhdKTtcbiAgICAgICAgYmluZC5hcHBlbmRWYWx1ZShuZXdWYWx1ZSwgaW5kZXggKyAxKTtcbiAgICB9O1xuXG4gICAgY29uc3QgdmFsdWVzOiBUZW1wbGF0ZVZhbHVlW10gPSBiaW5kLnZhbHVlIHx8IFtdO1xuICAgIGNvbnN0IGhhc1ZhbHVlcyA9IHZhbHVlcy5sZW5ndGggPiAwO1xuXG4gICAgY29uc3QgQmluZCA9IGdldEJpbmQoKTtcblxuICAgIHJldHVybiAoXG4gICAgICAgIDw+XG4gICAgICAgICAgICB7aGFzVmFsdWVzID8gKFxuICAgICAgICAgICAgICAgIDxQYXJlbnRGaWVsZFByb3ZpZGVyIHZhbHVlPXtiaW5kLnZhbHVlfSBwYXRoPXtCaW5kLnBhcmVudE5hbWV9PlxuICAgICAgICAgICAgICAgICAgICA8TXVsdGlWYWx1ZUNvbnRhaW5lciB7Li4ucHJvcHN9PlxuICAgICAgICAgICAgICAgICAgICAgICAge3ZhbHVlcy5tYXAoKHZhbHVlLCBpbmRleCkgPT4ge1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgIGNvbnN0IEJpbmQgPSBnZXRCaW5kKGluZGV4KTtcblxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIHJldHVybiAoXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxQYXJlbnRWYWx1ZUluZGV4UHJvdmlkZXIga2V5PXtpbmRleH0gaW5kZXg9e2luZGV4fT5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxUZW1wbGF0ZVZhbHVlRm9ybVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIHZhbHVlPXt2YWx1ZX1cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBjb250ZW50TW9kZWw9e2NvbnRlbnRNb2RlbH1cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBCaW5kPXtCaW5kfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGlzRmlyc3Q9e2luZGV4ID09PSAwfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGlzTGFzdD17aW5kZXggPT09IHZhbHVlcy5sZW5ndGggLSAxfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIG9uTW92ZVVwPXsoKSA9PiBiaW5kLm1vdmVWYWx1ZVVwKGluZGV4KX1cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBvbk1vdmVEb3duPXsoKSA9PiBiaW5kLm1vdmVWYWx1ZURvd24oaW5kZXgpfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIG9uRGVsZXRlPXsoKSA9PiBiaW5kLnJlbW92ZVZhbHVlKGluZGV4KX1cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBvbkNsb25lPXsoKSA9PiBjbG9uZVZhbHVlKGluZGV4KX1cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIC8+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIDwvUGFyZW50VmFsdWVJbmRleFByb3ZpZGVyPlxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICk7XG4gICAgICAgICAgICAgICAgICAgICAgICB9KX1cbiAgICAgICAgICAgICAgICAgICAgPC9NdWx0aVZhbHVlQ29udGFpbmVyPlxuICAgICAgICAgICAgICAgIDwvUGFyZW50RmllbGRQcm92aWRlcj5cbiAgICAgICAgICAgICkgOiBudWxsfVxuICAgICAgICAgICAge2hhc1ZhbHVlcyA/IChcbiAgICAgICAgICAgICAgICA8QWRkVGVtcGxhdGVJY29uIG9uVGVtcGxhdGU9e29uVGVtcGxhdGV9IC8+XG4gICAgICAgICAgICApIDogKFxuICAgICAgICAgICAgICAgIDxCb3R0b21NYXJnaW4+XG4gICAgICAgICAgICAgICAgICAgIDxBZGRUZW1wbGF0ZUJ1dHRvbiBvblRlbXBsYXRlPXtvblRlbXBsYXRlfSAvPlxuICAgICAgICAgICAgICAgIDwvQm90dG9tTWFyZ2luPlxuICAgICAgICAgICAgKX1cbiAgICAgICAgPC8+XG4gICAgKTtcbn07XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+var MultiValueItemContainer = exports.MultiValueItemContainer = (0, _reactComposition.makeDecoratable)("MultiValueItemContainer", function (_ref) {
   var title = _ref.title,
     description = _ref.description,
     icon = _ref.icon,
@@ -36,8 +48,7 @@ var MultiValueItemContainer = (0, _reactComposition.makeDecoratable)("MultiValue
     actions: actions
   }, children);
 });
-exports.MultiValueItemContainer = MultiValueItemContainer;
-var MultiValueItem = (0, _reactComposition.makeDecoratable)("MultiValueItem", function (props) {
+var MultiValueItem = exports.MultiValueItem = (0, _reactComposition.makeDecoratable)("MultiValueItem", function (props) {
   var template = props.template,
     Bind = props.Bind,
     contentModel = props.contentModel;
@@ -50,7 +61,6 @@ var MultiValueItem = (0, _reactComposition.makeDecoratable)("MultiValueItem", fu
     Bind: Bind
   }));
 });
-exports.MultiValueItem = MultiValueItem;
 var TemplateValueForm = function TemplateValueForm(_ref2) {
   var value = _ref2.value,
     contentModel = _ref2.contentModel,
@@ -106,18 +116,18 @@ var TemplateValueForm = function TemplateValueForm(_ref2) {
     Bind: Bind
   }));
 };
-var MultiValueContainer = (0, _reactComposition.makeDecoratable)("MultiValueContainer", function (_ref3) {
+var MultiValueContainer = exports.MultiValueContainer = (0, _reactComposition.makeDecoratable)("MultiValueContainer", function (_ref3) {
   var children = _ref3.children;
   return /*#__PURE__*/_react.default.createElement(_Accordion.Accordion, null, /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, children));
 });
-exports.MultiValueContainer = MultiValueContainer;
-var MultiValueDynamicZone = function MultiValueDynamicZone(props) {
+var MultiValueDynamicZone = exports.MultiValueDynamicZone = function MultiValueDynamicZone(props) {
   var bind = props.bind,
     getBind = props.getBind,
     contentModel = props.contentModel;
   var onTemplate = function onTemplate(template) {
     bind.appendValue({
-      _templateId: template.id
+      _templateId: template.id,
+      __typename: template.__typename
     });
   };
   var cloneValue = function cloneValue(index) {
@@ -132,10 +142,9 @@ var MultiValueDynamicZone = function MultiValueDynamicZone(props) {
     path: Bind.parentName
   }, /*#__PURE__*/_react.default.createElement(MultiValueContainer, props, values.map(function (value, index) {
     var Bind = getBind(index);
-    return /*#__PURE__*/_react.default.createElement(_hooks.ParentFieldProvider, {
-      value: value,
+    return /*#__PURE__*/_react.default.createElement(_ModelFieldProvider.ParentValueIndexProvider, {
       key: index,
-      path: Bind.parentName
+      index: index
     }, /*#__PURE__*/_react.default.createElement(TemplateValueForm, {
       value: value,
       contentModel: contentModel,
@@ -161,6 +170,5 @@ var MultiValueDynamicZone = function MultiValueDynamicZone(props) {
     onTemplate: onTemplate
   })));
 };
-exports.MultiValueDynamicZone = MultiValueDynamicZone;
 
 //# sourceMappingURL=MultiValueDynamicZone.js.map

package/admin/plugins/fieldRenderers/dynamicZone/MultiValueDynamicZone.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_styled","_cloneDeep","_Accordion","_delete_outline","_library_add","_expand_less","_expand_more","_AddTemplate","_TemplateIcon","_hooks","_Fields","_reactComposition","_TemplateProvider","BottomMargin","styled","label","target","MultiValueItemContainer","makeDecoratable","_ref","title","description","icon","actions","children","default","createElement","AccordionItem","exports","MultiValueItem","props","template","Bind","contentModel","TemplateProvider","Fields","fields","layout","TemplateValueForm","_ref2","value","isLast","isFirst","onMoveUp","onMoveDown","onDelete","onClone","_useModelField","useModelField","field","templates","settings","find","tpl","id","_templateId","name","TemplateIcon","Actions","Action","ReactComponent","onClick","disabled","Divider","MultiValueContainer","_ref3","Accordion","Fragment","MultiValueDynamicZone","bind","getBind","onTemplate","appendValue","cloneValue","index","newValue","cloneDeep","values","hasValues","length","ParentFieldProvider","path","parentName","map","key","moveValueUp","moveValueDown","removeValue","AddTemplateIcon","AddTemplateButton"],"sources":["MultiValueDynamicZone.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport cloneDeep from \"lodash/cloneDeep\";\nimport { Accordion, AccordionItem } from \"@webiny/ui/Accordion\";\nimport { ReactComponent as DeleteIcon } from \"@material-design-icons/svg/outlined/delete_outline.svg\";\nimport { ReactComponent as CloneIcon } from \"@material-design-icons/svg/outlined/library_add.svg\";\nimport { ReactComponent as ArrowUpIcon } from \"@material-design-icons/svg/round/expand_less.svg\";\nimport { ReactComponent as ArrowDownIcon } from \"@material-design-icons/svg/round/expand_more.svg\";\nimport { AddTemplateButton, AddTemplateIcon } from \"./AddTemplate\";\nimport { TemplateIcon } from \"./TemplateIcon\";\nimport { ParentFieldProvider, useModelField } from \"~/admin/hooks\";\nimport { Fields } from \"~/admin/components/ContentEntryForm/Fields\";\nimport {\n    BindComponent,\n    BindComponentRenderProp,\n    CmsDynamicZoneTemplate,\n    CmsModelFieldRendererProps,\n    CmsModel,\n    CmsModelField\n} from \"~/types\";\nimport { makeDecoratable } from \"@webiny/react-composition\";\nimport { TemplateProvider } from \"~/admin/plugins/fieldRenderers/dynamicZone/TemplateProvider\";\n\nconst BottomMargin = styled.div`\n    margin-bottom: 20px;\n`;\n\ntype GetBind = CmsModelFieldRendererProps[\"getBind\"];\n\nexport interface MultiValueItemContainerProps {\n    value: TemplateValue;\n    contentModel: CmsModel;\n    isFirst: boolean;\n    isLast: boolean;\n    onMoveUp: () => void;\n    onMoveDown: () => void;\n    onDelete: () => void;\n    onClone: () => void;\n    title: React.ReactNode;\n    description: string;\n    icon: JSX.Element;\n    actions: JSX.Element;\n    template: CmsDynamicZoneTemplate;\n    children: React.ReactNode;\n}\n\nexport const MultiValueItemContainer = makeDecoratable(\n    \"MultiValueItemContainer\",\n    ({ title, description, icon, actions, children }: MultiValueItemContainerProps) => {\n        return (\n            <AccordionItem title={title} description={description} icon={icon} actions={actions}>\n                {children}\n            </AccordionItem>\n        );\n    }\n);\n\nexport interface MultiValueItemItemProps {\n    template: CmsDynamicZoneTemplate;\n    contentModel: CmsModel;\n    Bind: BindComponent;\n}\n\nexport const MultiValueItem = makeDecoratable(\n    \"MultiValueItem\",\n    (props: MultiValueItemItemProps) => {\n        const { template, Bind, contentModel } = props;\n\n        return (\n            <TemplateProvider template={template}>\n                <Fields\n                    fields={template.fields}\n                    layout={template.layout || []}\n                    contentModel={contentModel}\n                    Bind={Bind}\n                />\n            </TemplateProvider>\n        );\n    }\n);\n\ninterface TemplateValue {\n    _templateId: string;\n    [key: string]: any;\n}\n\ninterface TemplateValueFormProps {\n    value: TemplateValue;\n    contentModel: CmsModel;\n    Bind: BindComponent;\n    isFirst: boolean;\n    isLast: boolean;\n    onMoveUp: () => void;\n    onMoveDown: () => void;\n    onDelete: () => void;\n    onClone: () => void;\n}\n\nconst TemplateValueForm = ({\n    value,\n    contentModel,\n    Bind,\n    isLast,\n    isFirst,\n    onMoveUp,\n    onMoveDown,\n    onDelete,\n    onClone\n}: TemplateValueFormProps) => {\n    const { field } = useModelField();\n    const templates = field.settings?.templates || [];\n\n    const template: CmsDynamicZoneTemplate | undefined = templates.find(\n        tpl => tpl.id === value._templateId\n    );\n\n    if (!template) {\n        return null;\n    }\n\n    return (\n        <MultiValueItemContainer\n            value={value}\n            contentModel={contentModel}\n            onClone={onClone}\n            isFirst={isFirst}\n            isLast={isLast}\n            onDelete={onDelete}\n            onMoveUp={onMoveUp}\n            onMoveDown={onMoveDown}\n            title={template.name}\n            description={template.description}\n            icon={<TemplateIcon icon={template.icon} />}\n            template={template}\n            actions={\n                <AccordionItem.Actions>\n                    <AccordionItem.Action\n                        icon={<ArrowUpIcon />}\n                        onClick={onMoveUp}\n                        disabled={isFirst}\n                    />\n                    <AccordionItem.Action\n                        icon={<ArrowDownIcon />}\n                        onClick={onMoveDown}\n                        disabled={isLast}\n                    />\n                    <AccordionItem.Divider />\n                    <AccordionItem.Action icon={<CloneIcon />} onClick={onClone} />\n                    <AccordionItem.Action icon={<DeleteIcon />} onClick={onDelete} />\n                </AccordionItem.Actions>\n            }\n        >\n            <MultiValueItem template={template} contentModel={contentModel} Bind={Bind} />\n        </MultiValueItemContainer>\n    );\n};\n\nexport interface MultiValueContainerProps extends MultiValueDynamicZoneProps {\n    children: React.ReactNode;\n}\n\nexport const MultiValueContainer = makeDecoratable(\n    \"MultiValueContainer\",\n    ({ children }: MultiValueContainerProps) => {\n        return (\n            <Accordion>\n                <>{children}</>\n            </Accordion>\n        );\n    }\n);\n\ninterface MultiValueDynamicZoneProps {\n    // TODO: this prop might be useless, because we now have a `useModelField` hook.\n    field: CmsModelField;\n    bind: BindComponentRenderProp;\n    contentModel: CmsModel;\n    getBind: GetBind;\n}\n\nexport const MultiValueDynamicZone = (props: MultiValueDynamicZoneProps) => {\n    const { bind, getBind, contentModel } = props;\n    const onTemplate = (template: CmsDynamicZoneTemplate) => {\n        bind.appendValue({ _templateId: template.id });\n    };\n\n    const cloneValue = (index: number) => {\n        const newValue = cloneDeep(bind.value[index]);\n        bind.appendValue(newValue, index + 1);\n    };\n\n    const values: TemplateValue[] = bind.value || [];\n    const hasValues = values.length > 0;\n\n    const Bind = getBind();\n\n    return (\n        <>\n            {hasValues ? (\n                <ParentFieldProvider value={bind.value} path={Bind.parentName}>\n                    <MultiValueContainer {...props}>\n                        {values.map((value, index) => {\n                            const Bind = getBind(index);\n\n                            return (\n                                <ParentFieldProvider\n                                    value={value}\n                                    key={index}\n                                    path={Bind.parentName}\n                                >\n                                    <TemplateValueForm\n                                        value={value}\n                                        contentModel={contentModel}\n                                        Bind={Bind}\n                                        isFirst={index === 0}\n                                        isLast={index === values.length - 1}\n                                        onMoveUp={() => bind.moveValueUp(index)}\n                                        onMoveDown={() => bind.moveValueDown(index)}\n                                        onDelete={() => bind.removeValue(index)}\n                                        onClone={() => cloneValue(index)}\n                                    />\n                                </ParentFieldProvider>\n                            );\n                        })}\n                    </MultiValueContainer>\n                </ParentFieldProvider>\n            ) : null}\n            {hasValues ? (\n                <AddTemplateIcon onTemplate={onTemplate} />\n            ) : (\n                <BottomMargin>\n                    <AddTemplateButton onTemplate={onTemplate} />\n                </BottomMargin>\n            )}\n        </>\n    );\n};\n"],"mappings":"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"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_cloneDeep","_Accordion","_delete_outline","_library_add","_expand_less","_expand_more","_AddTemplate","_TemplateIcon","_hooks","_Fields","_reactComposition","_TemplateProvider","_ModelFieldProvider","_EMOTION_STRINGIFIED_CSS_ERROR__","BottomMargin","_base","default","process","env","NODE_ENV","target","label","name","styles","map","toString","MultiValueItemContainer","exports","makeDecoratable","_ref","title","description","icon","actions","children","createElement","AccordionItem","MultiValueItem","props","template","Bind","contentModel","TemplateProvider","Fields","fields","layout","TemplateValueForm","_ref2","value","isLast","isFirst","onMoveUp","onMoveDown","onDelete","onClone","_useModelField","useModelField","field","templates","settings","find","tpl","id","_templateId","TemplateIcon","Actions","Action","ReactComponent","onClick","disabled","Divider","MultiValueContainer","_ref3","Accordion","Fragment","MultiValueDynamicZone","bind","getBind","onTemplate","appendValue","__typename","cloneValue","index","newValue","cloneDeep","values","hasValues","length","ParentFieldProvider","path","parentName","ParentValueIndexProvider","key","moveValueUp","moveValueDown","removeValue","AddTemplateIcon","AddTemplateButton"],"sources":["MultiValueDynamicZone.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport cloneDeep from \"lodash/cloneDeep\";\nimport { Accordion, AccordionItem } from \"@webiny/ui/Accordion\";\nimport { ReactComponent as DeleteIcon } from \"@material-design-icons/svg/outlined/delete_outline.svg\";\nimport { ReactComponent as CloneIcon } from \"@material-design-icons/svg/outlined/library_add.svg\";\nimport { ReactComponent as ArrowUpIcon } from \"@material-design-icons/svg/round/expand_less.svg\";\nimport { ReactComponent as ArrowDownIcon } from \"@material-design-icons/svg/round/expand_more.svg\";\nimport { AddTemplateButton, AddTemplateIcon } from \"./AddTemplate\";\nimport { TemplateIcon } from \"./TemplateIcon\";\nimport { ParentFieldProvider, useModelField } from \"~/admin/hooks\";\nimport { Fields } from \"~/admin/components/ContentEntryForm/Fields\";\nimport {\n    BindComponent,\n    BindComponentRenderProp,\n    CmsDynamicZoneTemplate,\n    CmsModelFieldRendererProps,\n    CmsModel,\n    CmsModelField,\n    CmsDynamicZoneTemplateWithTypename\n} from \"~/types\";\nimport { makeDecoratable } from \"@webiny/react-composition\";\nimport { TemplateProvider } from \"~/admin/plugins/fieldRenderers/dynamicZone/TemplateProvider\";\nimport { ParentValueIndexProvider } from \"~/admin/components/ModelFieldProvider\";\n\nconst BottomMargin = styled.div`\n    margin-bottom: 20px;\n`;\n\ntype GetBind = CmsModelFieldRendererProps[\"getBind\"];\n\nexport interface MultiValueItemContainerProps {\n    value: TemplateValue;\n    contentModel: CmsModel;\n    isFirst: boolean;\n    isLast: boolean;\n    onMoveUp: () => void;\n    onMoveDown: () => void;\n    onDelete: () => void;\n    onClone: () => void;\n    title: React.ReactNode;\n    description: string;\n    icon: JSX.Element;\n    actions: JSX.Element;\n    template: CmsDynamicZoneTemplate;\n    children: React.ReactNode;\n}\n\nexport const MultiValueItemContainer = makeDecoratable(\n    \"MultiValueItemContainer\",\n    ({ title, description, icon, actions, children }: MultiValueItemContainerProps) => {\n        return (\n            <AccordionItem title={title} description={description} icon={icon} actions={actions}>\n                {children}\n            </AccordionItem>\n        );\n    }\n);\n\nexport interface MultiValueItemItemProps {\n    template: CmsDynamicZoneTemplate;\n    contentModel: CmsModel;\n    Bind: BindComponent;\n}\n\nexport const MultiValueItem = makeDecoratable(\n    \"MultiValueItem\",\n    (props: MultiValueItemItemProps) => {\n        const { template, Bind, contentModel } = props;\n\n        return (\n            <TemplateProvider template={template}>\n                <Fields\n                    fields={template.fields}\n                    layout={template.layout || []}\n                    contentModel={contentModel}\n                    Bind={Bind}\n                />\n            </TemplateProvider>\n        );\n    }\n);\n\ninterface TemplateValue {\n    _templateId: string;\n    [key: string]: any;\n}\n\ninterface TemplateValueFormProps {\n    value: TemplateValue;\n    contentModel: CmsModel;\n    Bind: BindComponent;\n    isFirst: boolean;\n    isLast: boolean;\n    onMoveUp: () => void;\n    onMoveDown: () => void;\n    onDelete: () => void;\n    onClone: () => void;\n}\n\nconst TemplateValueForm = ({\n    value,\n    contentModel,\n    Bind,\n    isLast,\n    isFirst,\n    onMoveUp,\n    onMoveDown,\n    onDelete,\n    onClone\n}: TemplateValueFormProps) => {\n    const { field } = useModelField();\n    const templates = field.settings?.templates || [];\n\n    const template: CmsDynamicZoneTemplate | undefined = templates.find(\n        tpl => tpl.id === value._templateId\n    );\n\n    if (!template) {\n        return null;\n    }\n\n    return (\n        <MultiValueItemContainer\n            value={value}\n            contentModel={contentModel}\n            onClone={onClone}\n            isFirst={isFirst}\n            isLast={isLast}\n            onDelete={onDelete}\n            onMoveUp={onMoveUp}\n            onMoveDown={onMoveDown}\n            title={template.name}\n            description={template.description}\n            icon={<TemplateIcon icon={template.icon} />}\n            template={template}\n            actions={\n                <AccordionItem.Actions>\n                    <AccordionItem.Action\n                        icon={<ArrowUpIcon />}\n                        onClick={onMoveUp}\n                        disabled={isFirst}\n                    />\n                    <AccordionItem.Action\n                        icon={<ArrowDownIcon />}\n                        onClick={onMoveDown}\n                        disabled={isLast}\n                    />\n                    <AccordionItem.Divider />\n                    <AccordionItem.Action icon={<CloneIcon />} onClick={onClone} />\n                    <AccordionItem.Action icon={<DeleteIcon />} onClick={onDelete} />\n                </AccordionItem.Actions>\n            }\n        >\n            <MultiValueItem template={template} contentModel={contentModel} Bind={Bind} />\n        </MultiValueItemContainer>\n    );\n};\n\nexport interface MultiValueContainerProps extends MultiValueDynamicZoneProps {\n    children: React.ReactNode;\n}\n\nexport const MultiValueContainer = makeDecoratable(\n    \"MultiValueContainer\",\n    ({ children }: MultiValueContainerProps) => {\n        return (\n            <Accordion>\n                <>{children}</>\n            </Accordion>\n        );\n    }\n);\n\ninterface MultiValueDynamicZoneProps {\n    // TODO: this prop might be useless, because we now have a `useModelField` hook.\n    field: CmsModelField;\n    bind: BindComponentRenderProp;\n    contentModel: CmsModel;\n    getBind: GetBind;\n}\n\nexport const MultiValueDynamicZone = (props: MultiValueDynamicZoneProps) => {\n    const { bind, getBind, contentModel } = props;\n    const onTemplate = (template: CmsDynamicZoneTemplateWithTypename) => {\n        bind.appendValue({ _templateId: template.id, __typename: template.__typename });\n    };\n\n    const cloneValue = (index: number) => {\n        const newValue = cloneDeep(bind.value[index]);\n        bind.appendValue(newValue, index + 1);\n    };\n\n    const values: TemplateValue[] = bind.value || [];\n    const hasValues = values.length > 0;\n\n    const Bind = getBind();\n\n    return (\n        <>\n            {hasValues ? (\n                <ParentFieldProvider value={bind.value} path={Bind.parentName}>\n                    <MultiValueContainer {...props}>\n                        {values.map((value, index) => {\n                            const Bind = getBind(index);\n\n                            return (\n                                <ParentValueIndexProvider key={index} index={index}>\n                                    <TemplateValueForm\n                                        value={value}\n                                        contentModel={contentModel}\n                                        Bind={Bind}\n                                        isFirst={index === 0}\n                                        isLast={index === values.length - 1}\n                                        onMoveUp={() => bind.moveValueUp(index)}\n                                        onMoveDown={() => bind.moveValueDown(index)}\n                                        onDelete={() => bind.removeValue(index)}\n                                        onClone={() => cloneValue(index)}\n                                    />\n                                </ParentValueIndexProvider>\n                            );\n                        })}\n                    </MultiValueContainer>\n                </ParentFieldProvider>\n            ) : null}\n            {hasValues ? (\n                <AddTemplateIcon onTemplate={onTemplate} />\n            ) : (\n                <BottomMargin>\n                    <AddTemplateButton onTemplate={onTemplate} />\n                </BottomMargin>\n            )}\n        </>\n    );\n};\n"],"mappings":"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","ignoreList":[]}

package/admin/plugins/fieldRenderers/dynamicZone/SingleValueDynamicZone.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import { BindComponentRenderProp, CmsModelFieldRendererProps, CmsModel, CmsModelField } from "../../../../types";
 declare type GetBind = CmsModelFieldRendererProps["getBind"];
 interface SingleValueDynamicZoneProps {
@@ -7,5 +7,5 @@ interface SingleValueDynamicZoneProps {
     contentModel: CmsModel;
     getBind: GetBind;
 }
-export declare const SingleValueDynamicZone: ({ field, bind, contentModel, getBind }: SingleValueDynamicZoneProps) => JSX.Element;
+export declare const SingleValueDynamicZone: ({ field, bind, contentModel, getBind }: SingleValueDynamicZoneProps) => React.JSX.Element;
 export {};

package/admin/plugins/fieldRenderers/dynamicZone/SingleValueDynamicZone.js

@@ -13,14 +13,16 @@ var _TemplateIcon = require("./TemplateIcon");
 var _TemplateProvider = require("./TemplateProvider");
 var _Fields = require("../../../components/ContentEntryForm/Fields");
 var _ParentValue = require("../../../components/ContentEntryForm/ParentValue");
-var SingleValueDynamicZone = function SingleValueDynamicZone(_ref) {
+var _ModelFieldProvider = require("../../../components/ModelFieldProvider");
+var SingleValueDynamicZone = exports.SingleValueDynamicZone = function SingleValueDynamicZone(_ref) {
   var field = _ref.field,
     bind = _ref.bind,
     contentModel = _ref.contentModel,
     getBind = _ref.getBind;
   var onTemplate = function onTemplate(template) {
     bind.onChange({
-      _templateId: template.id
+      _templateId: template.id,
+      __typename: template.__typename
     });
   };
   var templates = field.settings?.templates || [];
@@ -34,6 +36,10 @@ var SingleValueDynamicZone = function SingleValueDynamicZone(_ref) {
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, template ? /*#__PURE__*/_react.default.createElement(_ParentValue.ParentFieldProvider, {
     value: bind.value,
     path: Bind.parentName
+  }, /*#__PURE__*/_react.default.createElement(_ModelFieldProvider.ParentValueIndexProvider, {
+    index: -1
+  }, /*#__PURE__*/_react.default.createElement(_ModelFieldProvider.ModelFieldProvider, {
+    field: field
   }, /*#__PURE__*/_react.default.createElement(_Accordion.Accordion, null, /*#__PURE__*/_react.default.createElement(_Accordion.AccordionItem, {
     title: template.name,
     description: template.description,
@@ -53,10 +59,9 @@ var SingleValueDynamicZone = function SingleValueDynamicZone(_ref) {
     layout: template.layout || [],
     contentModel: contentModel,
     Bind: Bind
-  }))))) : null, bind.value ? null : /*#__PURE__*/_react.default.createElement(_AddTemplate.AddTemplateButton, {
+  }))))))) : null, bind.value ? null : /*#__PURE__*/_react.default.createElement(_AddTemplate.AddTemplateButton, {
     onTemplate: onTemplate
   }));
 };
-exports.SingleValueDynamicZone = SingleValueDynamicZone;
 
 //# sourceMappingURL=SingleValueDynamicZone.js.map