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

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

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

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_delete_outline","_Accordion","_AddTemplate","_TemplateIcon","_TemplateProvider","_Fields","_ParentValue","SingleValueDynamicZone","_ref","field","bind","contentModel","getBind","onTemplate","template","onChange","_templateId","id","templates","settings","value","find","tpl","undefined","Bind","unsetValue","default","createElement","Fragment","ParentFieldProvider","path","parentName","Accordion","AccordionItem","title","name","description","icon","TemplateIcon","open","interactive","actions","Actions","Action","ReactComponent","onClick","TemplateProvider","Fields","fields","layout","AddTemplateButton","exports"],"sources":["SingleValueDynamicZone.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as DeleteIcon } from \"@material-design-icons/svg/outlined/delete_outline.svg\";\nimport { Accordion, AccordionItem } from \"@webiny/ui/Accordion\";\nimport { AddTemplateButton } from \"./AddTemplate\";\nimport { TemplateIcon } from \"./TemplateIcon\";\nimport { TemplateProvider } from \"./TemplateProvider\";\nimport {\n    BindComponentRenderProp,\n    CmsDynamicZoneTemplate,\n    CmsModelFieldRendererProps,\n    CmsModel,\n    CmsModelField\n} from \"~/types\";\nimport { Fields } from \"~/admin/components/ContentEntryForm/Fields\";\nimport { ParentFieldProvider } from \"~/admin/components/ContentEntryForm/ParentValue\";\n\ntype GetBind = CmsModelFieldRendererProps[\"getBind\"];\n\ninterface SingleValueDynamicZoneProps {\n    field: CmsModelField;\n    bind: BindComponentRenderProp;\n    contentModel: CmsModel;\n    getBind: GetBind;\n}\n\nexport const SingleValueDynamicZone = ({\n    field,\n    bind,\n    contentModel,\n    getBind\n}: SingleValueDynamicZoneProps) => {\n    const onTemplate = (template: CmsDynamicZoneTemplate) => {\n        bind.onChange({ _templateId: template.id });\n    };\n\n    const templates = field.settings?.templates || [];\n\n    const template: CmsDynamicZoneTemplate | undefined = bind.value\n        ? templates.find(tpl => tpl.id === bind.value._templateId)\n        : undefined;\n\n    const Bind = getBind();\n\n    const unsetValue = () => {\n        bind.onChange(null);\n    };\n\n    return (\n        <>\n            {template ? (\n                <ParentFieldProvider value={bind.value} path={Bind.parentName}>\n                    <Accordion>\n                        <AccordionItem\n                            title={template.name}\n                            description={template.description}\n                            icon={<TemplateIcon icon={template.icon} />}\n                            open={true}\n                            interactive={false}\n                            actions={\n                                <AccordionItem.Actions>\n                                    <AccordionItem.Action\n                                        icon={<DeleteIcon />}\n                                        onClick={unsetValue}\n                                    />\n                                </AccordionItem.Actions>\n                            }\n                        >\n                            <TemplateProvider template={template}>\n                                <Fields\n                                    fields={template.fields}\n                                    layout={template.layout || []}\n                                    contentModel={contentModel}\n                                    Bind={Bind}\n                                />\n                            </TemplateProvider>\n                        </AccordionItem>\n                    </Accordion>\n                </ParentFieldProvider>\n            ) : null}\n            {bind.value ? null : <AddTemplateButton onTemplate={onTemplate} />}\n        </>\n    );\n};\n"],"mappings":"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"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_delete_outline","_Accordion","_AddTemplate","_TemplateIcon","_TemplateProvider","_Fields","_ParentValue","_ModelFieldProvider","SingleValueDynamicZone","exports","_ref","field","bind","contentModel","getBind","onTemplate","template","onChange","_templateId","id","__typename","templates","settings","value","find","tpl","undefined","Bind","unsetValue","default","createElement","Fragment","ParentFieldProvider","path","parentName","ParentValueIndexProvider","index","ModelFieldProvider","Accordion","AccordionItem","title","name","description","icon","TemplateIcon","open","interactive","actions","Actions","Action","ReactComponent","onClick","TemplateProvider","Fields","fields","layout","AddTemplateButton"],"sources":["SingleValueDynamicZone.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as DeleteIcon } from \"@material-design-icons/svg/outlined/delete_outline.svg\";\nimport { Accordion, AccordionItem } from \"@webiny/ui/Accordion\";\nimport { AddTemplateButton } from \"./AddTemplate\";\nimport { TemplateIcon } from \"./TemplateIcon\";\nimport { TemplateProvider } from \"./TemplateProvider\";\nimport {\n    BindComponentRenderProp,\n    CmsDynamicZoneTemplate,\n    CmsModelFieldRendererProps,\n    CmsModel,\n    CmsModelField,\n    CmsDynamicZoneTemplateWithTypename\n} from \"~/types\";\nimport { Fields } from \"~/admin/components/ContentEntryForm/Fields\";\nimport { ParentFieldProvider } from \"~/admin/components/ContentEntryForm/ParentValue\";\nimport {\n    ParentValueIndexProvider,\n    ModelFieldProvider\n} from \"~/admin/components/ModelFieldProvider\";\n\ntype GetBind = CmsModelFieldRendererProps[\"getBind\"];\n\ninterface SingleValueDynamicZoneProps {\n    field: CmsModelField;\n    bind: BindComponentRenderProp;\n    contentModel: CmsModel;\n    getBind: GetBind;\n}\n\nexport const SingleValueDynamicZone = ({\n    field,\n    bind,\n    contentModel,\n    getBind\n}: SingleValueDynamicZoneProps) => {\n    const onTemplate = (template: CmsDynamicZoneTemplateWithTypename) => {\n        bind.onChange({ _templateId: template.id, __typename: template.__typename });\n    };\n\n    const templates = field.settings?.templates || [];\n\n    const template: CmsDynamicZoneTemplate | undefined = bind.value\n        ? templates.find(tpl => tpl.id === bind.value._templateId)\n        : undefined;\n\n    const Bind = getBind();\n\n    const unsetValue = () => {\n        bind.onChange(null);\n    };\n\n    return (\n        <>\n            {template ? (\n                <ParentFieldProvider value={bind.value} path={Bind.parentName}>\n                    <ParentValueIndexProvider index={-1}>\n                        <ModelFieldProvider field={field}>\n                            <Accordion>\n                                <AccordionItem\n                                    title={template.name}\n                                    description={template.description}\n                                    icon={<TemplateIcon icon={template.icon} />}\n                                    open={true}\n                                    interactive={false}\n                                    actions={\n                                        <AccordionItem.Actions>\n                                            <AccordionItem.Action\n                                                icon={<DeleteIcon />}\n                                                onClick={unsetValue}\n                                            />\n                                        </AccordionItem.Actions>\n                                    }\n                                >\n                                    <TemplateProvider template={template}>\n                                        <Fields\n                                            fields={template.fields}\n                                            layout={template.layout || []}\n                                            contentModel={contentModel}\n                                            Bind={Bind}\n                                        />\n                                    </TemplateProvider>\n                                </AccordionItem>\n                            </Accordion>\n                        </ModelFieldProvider>\n                    </ParentValueIndexProvider>\n                </ParentFieldProvider>\n            ) : null}\n            {bind.value ? null : <AddTemplateButton onTemplate={onTemplate} />}\n        </>\n    );\n};\n"],"mappings":"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","ignoreList":[]}

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

@@ -21,54 +21,39 @@ export declare type ShouldRender = {
  * We're wrapping each component with `withShouldRender`, because they're all decoratable, and `withShouldRender` attaches a
  * conditional decorator, which optionally takes a `modelIds` prop, so you can control on which models that component will be decorated.
  */
-export declare const TemplateGallery: import("@webiny/app-admin").GenericComponent<TemplateGalleryProps & {
-    children?: React.ReactNode;
-}> & {
-    original: import("@webiny/app-admin").GenericComponent<TemplateGalleryProps & {
-        children?: React.ReactNode;
-    }>;
+export declare const TemplateGallery: import("@webiny/app-admin").GenericComponent<TemplateGalleryProps> & {
+    original: import("@webiny/app-admin").GenericComponent<TemplateGalleryProps>;
     originalName: string;
+    displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/app-admin").Decorator<(props: React.PropsWithChildren<TemplateGalleryProps>, context?: any) => React.ReactElement<any, any> | null>) => (props: ShouldRender) => JSX.Element;
+    createDecorator: (decorator: import("@webiny/app-admin").Decorator<(props: TemplateGalleryProps, context?: any) => React.ReactElement<any, any> | null>) => (props: ShouldRender) => React.JSX.Element;
 } & {
-    Container: import("@webiny/app-admin").GenericComponent<TemplateGalleryContainerProps & {
-        children?: React.ReactNode;
-    }> & {
-        original: import("@webiny/app-admin").GenericComponent<TemplateGalleryContainerProps & {
-            children?: React.ReactNode;
-        }>;
+    Container: import("@webiny/app-admin").GenericComponent<TemplateGalleryContainerProps> & {
+        original: import("@webiny/app-admin").GenericComponent<TemplateGalleryContainerProps>;
         originalName: string;
+        displayName: string;
     } & {
-        createDecorator: (decorator: import("@webiny/app-admin").Decorator<(props: React.PropsWithChildren<TemplateGalleryContainerProps>, context?: any) => React.ReactElement<any, any> | null>) => (props: ShouldRender) => JSX.Element;
+        createDecorator: (decorator: import("@webiny/app-admin").Decorator<(props: TemplateGalleryContainerProps, context?: any) => React.ReactElement<any, any> | null>) => (props: ShouldRender) => React.JSX.Element;
     };
-    List: import("@webiny/app-admin").GenericComponent<TemplateGalleryListProps & {
-        children?: React.ReactNode;
-    }> & {
-        original: import("@webiny/app-admin").GenericComponent<TemplateGalleryListProps & {
-            children?: React.ReactNode;
-        }>;
+    List: import("@webiny/app-admin").GenericComponent<TemplateGalleryListProps> & {
+        original: import("@webiny/app-admin").GenericComponent<TemplateGalleryListProps>;
         originalName: string;
+        displayName: string;
     } & {
-        createDecorator: (decorator: import("@webiny/app-admin").Decorator<(props: React.PropsWithChildren<TemplateGalleryListProps>, context?: any) => React.ReactElement<any, any> | null>) => (props: ShouldRender) => JSX.Element;
+        createDecorator: (decorator: import("@webiny/app-admin").Decorator<(props: TemplateGalleryListProps, context?: any) => React.ReactElement<any, any> | null>) => (props: ShouldRender) => React.JSX.Element;
     };
-    Item: import("@webiny/app-admin").GenericComponent<import("./TemplateItem").TemplateCardProps & {
-        children?: React.ReactNode;
-    }> & {
-        original: import("@webiny/app-admin").GenericComponent<import("./TemplateItem").TemplateCardProps & {
-            children?: React.ReactNode;
-        }>;
+    Item: import("@webiny/app-admin").GenericComponent<import("./TemplateItem").TemplateCardProps> & {
+        original: import("@webiny/app-admin").GenericComponent<import("./TemplateItem").TemplateCardProps>;
         originalName: string;
+        displayName: string;
     } & {
-        createDecorator: (decorator: import("@webiny/app-admin").Decorator<(props: React.PropsWithChildren<import("./TemplateItem").TemplateCardProps>, context?: any) => React.ReactElement<any, any> | null>) => (props: ShouldRender) => JSX.Element;
+        createDecorator: (decorator: import("@webiny/app-admin").Decorator<(props: import("./TemplateItem").TemplateCardProps, context?: any) => React.ReactElement<any, any> | null>) => (props: ShouldRender) => React.JSX.Element;
     };
-    Close: import("@webiny/app-admin").GenericComponent<CloseGalleryProps & {
-        children?: React.ReactNode;
-    }> & {
-        original: import("@webiny/app-admin").GenericComponent<CloseGalleryProps & {
-            children?: React.ReactNode;
-        }>;
+    Close: import("@webiny/app-admin").GenericComponent<CloseGalleryProps> & {
+        original: import("@webiny/app-admin").GenericComponent<CloseGalleryProps>;
         originalName: string;
+        displayName: string;
     } & {
-        createDecorator: (decorator: import("@webiny/app-admin").Decorator<(props: React.PropsWithChildren<CloseGalleryProps>, context?: any) => React.ReactElement<any, any> | null>) => (props: ShouldRender) => JSX.Element;
+        createDecorator: (decorator: import("@webiny/app-admin").Decorator<(props: CloseGalleryProps, context?: any) => React.ReactElement<any, any> | null>) => (props: ShouldRender) => React.JSX.Element;
     };
 };

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

@@ -5,20 +5,31 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.TemplateGallery = void 0;
+var _base = _interopRequireDefault(require("@emotion/styled/base"));
 var _react = _interopRequireDefault(require("react"));
-var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _highlight_off = require("@material-design-icons/svg/outlined/highlight_off.svg");
 var _appAdmin = require("@webiny/app-admin");
 var _Button = require("@webiny/ui/Button");
 var _hooks = require("../../../hooks");
 var _TemplateItem = require("./TemplateItem");
+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 GalleryContainer = (0, _appAdmin.makeDecoratable)("TemplateGalleryContainer", function (props) {
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, props.children);
 });
-var DefaultGalleryList = /*#__PURE__*/(0, _styled.default)("div", {
-  label: "DefaultGalleryList",
+var DefaultGalleryList = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
   target: "e1pydjsn0"
-})("display:flex;flex-wrap:wrap;justify-content:center;padding:10px;");
+} : {
+  target: "e1pydjsn0",
+  label: "DefaultGalleryList"
+})(process.env.NODE_ENV === "production" ? {
+  name: "1klvoba",
+  styles: "display:flex;flex-wrap:wrap;justify-content:center;padding:10px"
+} : {
+  name: "1klvoba",
+  styles: "display:flex;flex-wrap:wrap;justify-content:center;padding:10px",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRlbXBsYXRlR2FsbGVyeS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBb0JxQyIsImZpbGUiOiJUZW1wbGF0ZUdhbGxlcnkudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBSZWFjdENvbXBvbmVudCBhcyBDbG9zZUljb24gfSBmcm9tIFwiQG1hdGVyaWFsLWRlc2lnbi1pY29ucy9zdmcvb3V0bGluZWQvaGlnaGxpZ2h0X29mZi5zdmdcIjtcbmltcG9ydCB7IERlY29yYXRhYmxlQ29tcG9uZW50LCBtYWtlRGVjb3JhdGFibGUsIHdpdGhEZWNvcmF0b3JGYWN0b3J5IH0gZnJvbSBcIkB3ZWJpbnkvYXBwLWFkbWluXCI7XG5pbXBvcnQgeyBJY29uQnV0dG9uIH0gZnJvbSBcIkB3ZWJpbnkvdWkvQnV0dG9uXCI7XG5pbXBvcnQgeyBDbXNEeW5hbWljWm9uZVRlbXBsYXRlIH0gZnJvbSBcIn4vdHlwZXNcIjtcbmltcG9ydCB7IHVzZU1vZGVsLCB1c2VNb2RlbEZpZWxkIH0gZnJvbSBcIn4vYWRtaW4vaG9va3NcIjtcbmltcG9ydCB7IFRlbXBsYXRlSXRlbSB9IGZyb20gXCIuL1RlbXBsYXRlSXRlbVwiO1xuXG5leHBvcnQgaW50ZXJmYWNlIFRlbXBsYXRlR2FsbGVyeUNvbnRhaW5lclByb3BzIHtcbiAgICBjaGlsZHJlbjogUmVhY3QuUmVhY3ROb2RlO1xufVxuXG5jb25zdCBHYWxsZXJ5Q29udGFpbmVyID0gbWFrZURlY29yYXRhYmxlKFxuICAgIFwiVGVtcGxhdGVHYWxsZXJ5Q29udGFpbmVyXCIsXG4gICAgKHByb3BzOiBUZW1wbGF0ZUdhbGxlcnlDb250YWluZXJQcm9wcykgPT4ge1xuICAgICAgICByZXR1cm4gPD57cHJvcHMuY2hpbGRyZW59PC8+O1xuICAgIH1cbik7XG5cbmNvbnN0IERlZmF1bHRHYWxsZXJ5TGlzdCA9IHN0eWxlZC5kaXZgXG4gICAgZGlzcGxheTogZmxleDtcbiAgICBmbGV4LXdyYXA6IHdyYXA7XG4gICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgcGFkZGluZzogMTBweDtcbmA7XG5cbmV4cG9ydCBpbnRlcmZhY2UgVGVtcGxhdGVHYWxsZXJ5TGlzdFByb3BzIHtcbiAgICBjaGlsZHJlbjogUmVhY3QuUmVhY3ROb2RlO1xufVxuXG5jb25zdCBHYWxsZXJ5TGlzdCA9IG1ha2VEZWNvcmF0YWJsZShcIlRlbXBsYXRlR2FsbGVyeUxpc3RcIiwgKHByb3BzOiBUZW1wbGF0ZUdhbGxlcnlMaXN0UHJvcHMpID0+IHtcbiAgICByZXR1cm4gPERlZmF1bHRHYWxsZXJ5TGlzdD57cHJvcHMuY2hpbGRyZW59PC9EZWZhdWx0R2FsbGVyeUxpc3Q+O1xufSk7XG5cbmV4cG9ydCBpbnRlcmZhY2UgQ2xvc2VHYWxsZXJ5UHJvcHMge1xuICAgIG9uQ2xvc2U6ICgpID0+IHZvaWQ7XG59XG5cbmNvbnN0IENsb3NlR2FsbGVyeSA9IG1ha2VEZWNvcmF0YWJsZShcIlRlbXBsYXRlR2FsbGVyeUNsb3NlXCIsIChwcm9wczogQ2xvc2VHYWxsZXJ5UHJvcHMpID0+IHtcbiAgICByZXR1cm4gPEljb25CdXR0b24gb25DbGljaz17cHJvcHMub25DbG9zZX0gaWNvbj17PENsb3NlSWNvbiAvPn0gLz47XG59KTtcblxuZXhwb3J0IGludGVyZmFjZSBUZW1wbGF0ZUdhbGxlcnlQcm9wcyB7XG4gICAgb25UZW1wbGF0ZTogKHRlbXBsYXRlOiBDbXNEeW5hbWljWm9uZVRlbXBsYXRlKSA9PiB2b2lkO1xuICAgIG9uQ2xvc2U6ICgpID0+IHZvaWQ7XG4gICAgdGVtcGxhdGVzPzogQ21zRHluYW1pY1pvbmVUZW1wbGF0ZVtdO1xufVxuXG5jb25zdCBHYWxsZXJ5ID0gbWFrZURlY29yYXRhYmxlKFwiVGVtcGxhdGVHYWxsZXJ5XCIsIChwcm9wczogVGVtcGxhdGVHYWxsZXJ5UHJvcHMpID0+IHtcbiAgICBjb25zdCB7IGZpZWxkIH0gPSB1c2VNb2RlbEZpZWxkKCk7XG4gICAgY29uc3QgdGVtcGxhdGVzID0gcHJvcHMudGVtcGxhdGVzIHx8IGZpZWxkLnNldHRpbmdzPy50ZW1wbGF0ZXMgfHwgW107XG5cbiAgICByZXR1cm4gKFxuICAgICAgICA8R2FsbGVyeUNvbnRhaW5lcj5cbiAgICAgICAgICAgIDxHYWxsZXJ5TGlzdD5cbiAgICAgICAgICAgICAgICB7dGVtcGxhdGVzLm1hcCh0ZW1wbGF0ZSA9PiAoXG4gICAgICAgICAgICAgICAgICAgIDxUZW1wbGF0ZUl0ZW1cbiAgICAgICAgICAgICAgICAgICAgICAgIGtleT17dGVtcGxhdGUuaWR9XG4gICAgICAgICAgICAgICAgICAgICAgICB0ZW1wbGF0ZT17dGVtcGxhdGV9XG4gICAgICAgICAgICAgICAgICAgICAgICBvblRlbXBsYXRlPXtwcm9wcy5vblRlbXBsYXRlfVxuICAgICAgICAgICAgICAgICAgICAvPlxuICAgICAgICAgICAgICAgICkpfVxuICAgICAgICAgICAgPC9HYWxsZXJ5TGlzdD5cbiAgICAgICAgICAgIDxDbG9zZUdhbGxlcnkgb25DbG9zZT17cHJvcHMub25DbG9zZX0gLz5cbiAgICAgICAgPC9HYWxsZXJ5Q29udGFpbmVyPlxuICAgICk7XG59KTtcblxuZXhwb3J0IHR5cGUgU2hvdWxkUmVuZGVyID0geyBtb2RlbElkcz86IHN0cmluZ1tdIH07XG5cbmZ1bmN0aW9uIHdpdGhTaG91bGRSZW5kZXI8VCBleHRlbmRzIERlY29yYXRhYmxlQ29tcG9uZW50PihDb21wb25lbnQ6IFQpIHtcbiAgICByZXR1cm4gd2l0aERlY29yYXRvckZhY3Rvcnk8U2hvdWxkUmVuZGVyPigpKENvbXBvbmVudCwgZGVjb3JhdG9yUHJvcHMgPT4ge1xuICAgICAgICBjb25zdCB7IG1vZGVsIH0gPSB1c2VNb2RlbCgpO1xuXG4gICAgICAgIGlmIChkZWNvcmF0b3JQcm9wcz8ubW9kZWxJZHM/Lmxlbmd0aCAmJiAhZGVjb3JhdG9yUHJvcHMubW9kZWxJZHMuaW5jbHVkZXMobW9kZWwubW9kZWxJZCkpIHtcbiAgICAgICAgICAgIHJldHVybiBmYWxzZTtcbiAgICAgICAgfVxuXG4gICAgICAgIHJldHVybiB0cnVlO1xuICAgIH0pO1xufVxuXG4vKipcbiAqIFdlJ3JlIHdyYXBwaW5nIGVhY2ggY29tcG9uZW50IHdpdGggYHdpdGhTaG91bGRSZW5kZXJgLCBiZWNhdXNlIHRoZXkncmUgYWxsIGRlY29yYXRhYmxlLCBhbmQgYHdpdGhTaG91bGRSZW5kZXJgIGF0dGFjaGVzIGFcbiAqIGNvbmRpdGlvbmFsIGRlY29yYXRvciwgd2hpY2ggb3B0aW9uYWxseSB0YWtlcyBhIGBtb2RlbElkc2AgcHJvcCwgc28geW91IGNhbiBjb250cm9sIG9uIHdoaWNoIG1vZGVscyB0aGF0IGNvbXBvbmVudCB3aWxsIGJlIGRlY29yYXRlZC5cbiAqL1xuZXhwb3J0IGNvbnN0IFRlbXBsYXRlR2FsbGVyeSA9IE9iamVjdC5hc3NpZ24od2l0aFNob3VsZFJlbmRlcihHYWxsZXJ5KSwge1xuICAgIENvbnRhaW5lcjogd2l0aFNob3VsZFJlbmRlcihHYWxsZXJ5Q29udGFpbmVyKSxcbiAgICBMaXN0OiB3aXRoU2hvdWxkUmVuZGVyKEdhbGxlcnlMaXN0KSxcbiAgICBJdGVtOiB3aXRoU2hvdWxkUmVuZGVyKFRlbXBsYXRlSXRlbSksXG4gICAgQ2xvc2U6IHdpdGhTaG91bGRSZW5kZXIoQ2xvc2VHYWxsZXJ5KVxufSk7XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
 var GalleryList = (0, _appAdmin.makeDecoratable)("TemplateGalleryList", function (props) {
   return /*#__PURE__*/_react.default.createElement(DefaultGalleryList, null, props.children);
 });
@@ -57,12 +68,11 @@ function withShouldRender(Component) {
  * We're wrapping each component with `withShouldRender`, because they're all decoratable, and `withShouldRender` attaches a
  * conditional decorator, which optionally takes a `modelIds` prop, so you can control on which models that component will be decorated.
  */
-var TemplateGallery = Object.assign(withShouldRender(Gallery), {
+var TemplateGallery = exports.TemplateGallery = Object.assign(withShouldRender(Gallery), {
   Container: withShouldRender(GalleryContainer),
   List: withShouldRender(GalleryList),
   Item: withShouldRender(_TemplateItem.TemplateItem),
   Close: withShouldRender(CloseGallery)
 });
-exports.TemplateGallery = TemplateGallery;
 
 //# sourceMappingURL=TemplateGallery.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_styled","_highlight_off","_appAdmin","_Button","_hooks","_TemplateItem","GalleryContainer","makeDecoratable","props","default","createElement","Fragment","children","DefaultGalleryList","styled","label","target","GalleryList","CloseGallery","IconButton","onClick","onClose","icon","ReactComponent","Gallery","_useModelField","useModelField","field","templates","settings","map","template","TemplateItem","key","id","onTemplate","withShouldRender","Component","withDecoratorFactory","decoratorProps","_useModel","useModel","model","modelIds","length","includes","modelId","TemplateGallery","Object","assign","Container","List","Item","Close","exports"],"sources":["TemplateGallery.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { ReactComponent as CloseIcon } from \"@material-design-icons/svg/outlined/highlight_off.svg\";\nimport { DecoratableComponent, makeDecoratable, withDecoratorFactory } from \"@webiny/app-admin\";\nimport { IconButton } from \"@webiny/ui/Button\";\nimport { CmsDynamicZoneTemplate } from \"~/types\";\nimport { useModel, useModelField } from \"~/admin/hooks\";\nimport { TemplateItem } from \"./TemplateItem\";\n\nexport interface TemplateGalleryContainerProps {\n    children: React.ReactNode;\n}\n\nconst GalleryContainer = makeDecoratable(\n    \"TemplateGalleryContainer\",\n    (props: TemplateGalleryContainerProps) => {\n        return <>{props.children}</>;\n    }\n);\n\nconst DefaultGalleryList = styled.div`\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: center;\n    padding: 10px;\n`;\n\nexport interface TemplateGalleryListProps {\n    children: React.ReactNode;\n}\n\nconst GalleryList = makeDecoratable(\"TemplateGalleryList\", (props: TemplateGalleryListProps) => {\n    return <DefaultGalleryList>{props.children}</DefaultGalleryList>;\n});\n\nexport interface CloseGalleryProps {\n    onClose: () => void;\n}\n\nconst CloseGallery = makeDecoratable(\"TemplateGalleryClose\", (props: CloseGalleryProps) => {\n    return <IconButton onClick={props.onClose} icon={<CloseIcon />} />;\n});\n\nexport interface TemplateGalleryProps {\n    onTemplate: (template: CmsDynamicZoneTemplate) => void;\n    onClose: () => void;\n    templates?: CmsDynamicZoneTemplate[];\n}\n\nconst Gallery = makeDecoratable(\"TemplateGallery\", (props: TemplateGalleryProps) => {\n    const { field } = useModelField();\n    const templates = props.templates || field.settings?.templates || [];\n\n    return (\n        <GalleryContainer>\n            <GalleryList>\n                {templates.map(template => (\n                    <TemplateItem\n                        key={template.id}\n                        template={template}\n                        onTemplate={props.onTemplate}\n                    />\n                ))}\n            </GalleryList>\n            <CloseGallery onClose={props.onClose} />\n        </GalleryContainer>\n    );\n});\n\nexport type ShouldRender = { modelIds?: string[] };\n\nfunction withShouldRender<T extends DecoratableComponent>(Component: T) {\n    return withDecoratorFactory<ShouldRender>()(Component, decoratorProps => {\n        const { model } = useModel();\n\n        if (decoratorProps?.modelIds?.length && !decoratorProps.modelIds.includes(model.modelId)) {\n            return false;\n        }\n\n        return true;\n    });\n}\n\n/**\n * We're wrapping each component with `withShouldRender`, because they're all decoratable, and `withShouldRender` attaches a\n * conditional decorator, which optionally takes a `modelIds` prop, so you can control on which models that component will be decorated.\n */\nexport const TemplateGallery = Object.assign(withShouldRender(Gallery), {\n    Container: withShouldRender(GalleryContainer),\n    List: withShouldRender(GalleryList),\n    Item: withShouldRender(TemplateItem),\n    Close: withShouldRender(CloseGallery)\n});\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,cAAA,GAAAF,OAAA;AACA,IAAAG,SAAA,GAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AAEA,IAAAK,MAAA,GAAAL,OAAA;AACA,IAAAM,aAAA,GAAAN,OAAA;AAMA,IAAMO,gBAAgB,GAAG,IAAAC,yBAAe,EACpC,0BAA0B,EAC1B,UAACC,KAAoC,EAAK;EACtC,oBAAOX,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAAAb,MAAA,CAAAY,OAAA,CAAAE,QAAA,QAAGH,KAAK,CAACI,QAAW,CAAC;AAChC,CACJ,CAAC;AAED,IAAMC,kBAAkB,oBAAGC,eAAM;EAAAC,KAAA;EAAAC,MAAA;AAAA,sEAKhC;AAMD,IAAMC,WAAW,GAAG,IAAAV,yBAAe,EAAC,qBAAqB,EAAE,UAACC,KAA+B,EAAK;EAC5F,oBAAOX,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACG,kBAAkB,QAAEL,KAAK,CAACI,QAA6B,CAAC;AACpE,CAAC,CAAC;AAMF,IAAMM,YAAY,GAAG,IAAAX,yBAAe,EAAC,sBAAsB,EAAE,UAACC,KAAwB,EAAK;EACvF,oBAAOX,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACP,OAAA,CAAAgB,UAAU;IAACC,OAAO,EAAEZ,KAAK,CAACa,OAAQ;IAACC,IAAI,eAAEzB,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACT,cAAA,CAAAsB,cAAS,MAAE;EAAE,CAAE,CAAC;AACtE,CAAC,CAAC;AAQF,IAAMC,OAAO,GAAG,IAAAjB,yBAAe,EAAC,iBAAiB,EAAE,UAACC,KAA2B,EAAK;EAChF,IAAAiB,cAAA,GAAkB,IAAAC,oBAAa,EAAC,CAAC;IAAzBC,KAAK,GAAAF,cAAA,CAALE,KAAK;EACb,IAAMC,SAAS,GAAGpB,KAAK,CAACoB,SAAS,IAAID,KAAK,CAACE,QAAQ,EAAED,SAAS,IAAI,EAAE;EAEpE,oBACI/B,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACJ,gBAAgB,qBACbT,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACO,WAAW,QACPW,SAAS,CAACE,GAAG,CAAC,UAAAC,QAAQ;IAAA,oBACnBlC,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACL,aAAA,CAAA2B,YAAY;MACTC,GAAG,EAAEF,QAAQ,CAACG,EAAG;MACjBH,QAAQ,EAAEA,QAAS;MACnBI,UAAU,EAAE3B,KAAK,CAAC2B;IAAW,CAChC,CAAC;EAAA,CACL,CACQ,CAAC,eACdtC,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACQ,YAAY;IAACG,OAAO,EAAEb,KAAK,CAACa;EAAQ,CAAE,CACzB,CAAC;AAE3B,CAAC,CAAC;AAIF,SAASe,gBAAgBA,CAAiCC,SAAY,EAAE;EACpE,OAAO,IAAAC,8BAAoB,EAAe,CAAC,CAACD,SAAS,EAAE,UAAAE,cAAc,EAAI;IACrE,IAAAC,SAAA,GAAkB,IAAAC,eAAQ,EAAC,CAAC;MAApBC,KAAK,GAAAF,SAAA,CAALE,KAAK;IAEb,IAAIH,cAAc,EAAEI,QAAQ,EAAEC,MAAM,IAAI,CAACL,cAAc,CAACI,QAAQ,CAACE,QAAQ,CAACH,KAAK,CAACI,OAAO,CAAC,EAAE;MACtF,OAAO,KAAK;IAChB;IAEA,OAAO,IAAI;EACf,CAAC,CAAC;AACN;;AAEA;AACA;AACA;AACA;AACO,IAAMC,eAAe,GAAGC,MAAM,CAACC,MAAM,CAACb,gBAAgB,CAACZ,OAAO,CAAC,EAAE;EACpE0B,SAAS,EAAEd,gBAAgB,CAAC9B,gBAAgB,CAAC;EAC7C6C,IAAI,EAAEf,gBAAgB,CAACnB,WAAW,CAAC;EACnCmC,IAAI,EAAEhB,gBAAgB,CAACJ,0BAAY,CAAC;EACpCqB,KAAK,EAAEjB,gBAAgB,CAAClB,YAAY;AACxC,CAAC,CAAC;AAACoC,OAAA,CAAAP,eAAA,GAAAA,eAAA"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_highlight_off","_appAdmin","_Button","_hooks","_TemplateItem","_EMOTION_STRINGIFIED_CSS_ERROR__","GalleryContainer","makeDecoratable","props","default","createElement","Fragment","children","DefaultGalleryList","_base","process","env","NODE_ENV","target","label","name","styles","map","toString","GalleryList","CloseGallery","IconButton","onClick","onClose","icon","ReactComponent","Gallery","_useModelField","useModelField","field","templates","settings","template","TemplateItem","key","id","onTemplate","withShouldRender","Component","withDecoratorFactory","decoratorProps","_useModel","useModel","model","modelIds","length","includes","modelId","TemplateGallery","exports","Object","assign","Container","List","Item","Close"],"sources":["TemplateGallery.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { ReactComponent as CloseIcon } from \"@material-design-icons/svg/outlined/highlight_off.svg\";\nimport { DecoratableComponent, makeDecoratable, withDecoratorFactory } from \"@webiny/app-admin\";\nimport { IconButton } from \"@webiny/ui/Button\";\nimport { CmsDynamicZoneTemplate } from \"~/types\";\nimport { useModel, useModelField } from \"~/admin/hooks\";\nimport { TemplateItem } from \"./TemplateItem\";\n\nexport interface TemplateGalleryContainerProps {\n    children: React.ReactNode;\n}\n\nconst GalleryContainer = makeDecoratable(\n    \"TemplateGalleryContainer\",\n    (props: TemplateGalleryContainerProps) => {\n        return <>{props.children}</>;\n    }\n);\n\nconst DefaultGalleryList = styled.div`\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: center;\n    padding: 10px;\n`;\n\nexport interface TemplateGalleryListProps {\n    children: React.ReactNode;\n}\n\nconst GalleryList = makeDecoratable(\"TemplateGalleryList\", (props: TemplateGalleryListProps) => {\n    return <DefaultGalleryList>{props.children}</DefaultGalleryList>;\n});\n\nexport interface CloseGalleryProps {\n    onClose: () => void;\n}\n\nconst CloseGallery = makeDecoratable(\"TemplateGalleryClose\", (props: CloseGalleryProps) => {\n    return <IconButton onClick={props.onClose} icon={<CloseIcon />} />;\n});\n\nexport interface TemplateGalleryProps {\n    onTemplate: (template: CmsDynamicZoneTemplate) => void;\n    onClose: () => void;\n    templates?: CmsDynamicZoneTemplate[];\n}\n\nconst Gallery = makeDecoratable(\"TemplateGallery\", (props: TemplateGalleryProps) => {\n    const { field } = useModelField();\n    const templates = props.templates || field.settings?.templates || [];\n\n    return (\n        <GalleryContainer>\n            <GalleryList>\n                {templates.map(template => (\n                    <TemplateItem\n                        key={template.id}\n                        template={template}\n                        onTemplate={props.onTemplate}\n                    />\n                ))}\n            </GalleryList>\n            <CloseGallery onClose={props.onClose} />\n        </GalleryContainer>\n    );\n});\n\nexport type ShouldRender = { modelIds?: string[] };\n\nfunction withShouldRender<T extends DecoratableComponent>(Component: T) {\n    return withDecoratorFactory<ShouldRender>()(Component, decoratorProps => {\n        const { model } = useModel();\n\n        if (decoratorProps?.modelIds?.length && !decoratorProps.modelIds.includes(model.modelId)) {\n            return false;\n        }\n\n        return true;\n    });\n}\n\n/**\n * We're wrapping each component with `withShouldRender`, because they're all decoratable, and `withShouldRender` attaches a\n * conditional decorator, which optionally takes a `modelIds` prop, so you can control on which models that component will be decorated.\n */\nexport const TemplateGallery = Object.assign(withShouldRender(Gallery), {\n    Container: withShouldRender(GalleryContainer),\n    List: withShouldRender(GalleryList),\n    Item: withShouldRender(TemplateItem),\n    Close: withShouldRender(CloseGallery)\n});\n"],"mappings":"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","ignoreList":[]}

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

@@ -1,6 +1,6 @@
-/// <reference types="react" />
+import React from "react";
 interface TemplateIconProps {
     icon: string;
 }
-export declare const TemplateIcon: ({ icon }: TemplateIconProps) => JSX.Element | null;
+export declare const TemplateIcon: ({ icon }: TemplateIconProps) => React.JSX.Element | null;
 export {};

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

@@ -7,13 +7,12 @@ Object.defineProperty(exports, "__esModule", {
 exports.TemplateIcon = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _reactFontawesome = require("@fortawesome/react-fontawesome");
-var TemplateIcon = function TemplateIcon(_ref) {
+var TemplateIcon = exports.TemplateIcon = function TemplateIcon(_ref) {
   var icon = _ref.icon;
   var faIcon = icon ? icon.split("/") : undefined;
   return faIcon ? /*#__PURE__*/_react.default.createElement(_reactFontawesome.FontAwesomeIcon, {
     icon: faIcon
   }) : null;
 };
-exports.TemplateIcon = TemplateIcon;
 
 //# sourceMappingURL=TemplateIcon.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_reactFontawesome","TemplateIcon","_ref","icon","faIcon","split","undefined","default","createElement","FontAwesomeIcon","exports"],"sources":["TemplateIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { FontAwesomeIcon, FontAwesomeIconProps } from \"@fortawesome/react-fontawesome\";\n\ninterface TemplateIconProps {\n    icon: string;\n}\n\nexport const TemplateIcon = ({ icon }: TemplateIconProps) => {\n    const faIcon = icon ? (icon.split(\"/\") as FontAwesomeIconProps[\"icon\"]) : undefined;\n\n    return faIcon ? <FontAwesomeIcon icon={faIcon} /> : null;\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAD,OAAA;AAMO,IAAME,YAAY,GAAG,SAAfA,YAAYA,CAAAC,IAAA,EAAoC;EAAA,IAA9BC,IAAI,GAAAD,IAAA,CAAJC,IAAI;EAC/B,IAAMC,MAAM,GAAGD,IAAI,GAAIA,IAAI,CAACE,KAAK,CAAC,GAAG,CAAC,GAAoCC,SAAS;EAEnF,OAAOF,MAAM,gBAAGP,MAAA,CAAAU,OAAA,CAAAC,aAAA,CAACR,iBAAA,CAAAS,eAAe;IAACN,IAAI,EAAEC;EAAO,CAAE,CAAC,GAAG,IAAI;AAC5D,CAAC;AAACM,OAAA,CAAAT,YAAA,GAAAA,YAAA"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_reactFontawesome","TemplateIcon","exports","_ref","icon","faIcon","split","undefined","default","createElement","FontAwesomeIcon"],"sources":["TemplateIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { FontAwesomeIcon, FontAwesomeIconProps } from \"@fortawesome/react-fontawesome\";\n\ninterface TemplateIconProps {\n    icon: string;\n}\n\nexport const TemplateIcon = ({ icon }: TemplateIconProps) => {\n    const faIcon = icon ? (icon.split(\"/\") as FontAwesomeIconProps[\"icon\"]) : undefined;\n\n    return faIcon ? <FontAwesomeIcon icon={faIcon} /> : null;\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAD,OAAA;AAMO,IAAME,YAAY,GAAAC,OAAA,CAAAD,YAAA,GAAG,SAAfA,YAAYA,CAAAE,IAAA,EAAoC;EAAA,IAA9BC,IAAI,GAAAD,IAAA,CAAJC,IAAI;EAC/B,IAAMC,MAAM,GAAGD,IAAI,GAAIA,IAAI,CAACE,KAAK,CAAC,GAAG,CAAC,GAAoCC,SAAS;EAEnF,OAAOF,MAAM,gBAAGR,MAAA,CAAAW,OAAA,CAAAC,aAAA,CAACT,iBAAA,CAAAU,eAAe;IAACN,IAAI,EAAEC;EAAO,CAAE,CAAC,GAAG,IAAI;AAC5D,CAAC","ignoreList":[]}

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

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import { CmsDynamicZoneTemplate } from "../../../../types";
 export interface TemplateCardProps {
     template: CmsDynamicZoneTemplate;
@@ -7,6 +7,7 @@ export interface TemplateCardProps {
 export declare const TemplateItem: import("@webiny/app-admin").GenericComponent<TemplateCardProps> & {
     original: import("@webiny/app-admin").GenericComponent<TemplateCardProps>;
     originalName: string;
+    displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/app-admin").Decorator<(props: TemplateCardProps) => JSX.Element | null>) => (props: unknown) => JSX.Element;
+    createDecorator: (decorator: import("@webiny/app-admin").Decorator<(props: TemplateCardProps) => JSX.Element | null>) => (props: unknown) => React.JSX.Element;
 };