@webiny/app-headless-cms 5.43.2 → 6.0.0-alpha.0

package/admin/plugins/fields/boolean.js

@@ -1,53 +1,41 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _react = _interopRequireDefault(require("react"));
-var _toggle_on = require("@material-design-icons/svg/outlined/toggle_on.svg");
-var _i18n = require("@webiny/app/i18n");
-var _Grid = require("@webiny/ui/Grid");
-var _form = require("@webiny/form");
-var _Radio = require("@webiny/ui/Radio");
-var _templateObject, _templateObject2, _templateObject3;
-var t = _i18n.i18n.ns("app-headless-cms/admin/fields");
-var Options = function Options(_ref) {
-  var _onChange = _ref.onChange,
-    initialValue = _ref.value;
-  var value = initialValue === true || initialValue === "true";
-  return /*#__PURE__*/_react.default.createElement(_Radio.RadioGroup, {
-    label: "Default value"
-  }, function () {
-    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Radio.Radio, {
-      label: "True",
-      value: value,
-      onChange: function onChange() {
-        _onChange(true);
-      }
-    })), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Radio.Radio, {
-      label: "False",
-      value: !value,
-      onChange: function onChange() {
-        _onChange(false);
-      }
-    })));
+import React from "react";
+import { ReactComponent as BooleanIcon } from "@webiny/icons/toggle_on.svg";
+import { i18n } from "@webiny/app/i18n";
+import { Bind } from "@webiny/form";
+import { Grid, RadioGroup } from "@webiny/admin-ui";
+const t = i18n.ns("app-headless-cms/admin/fields");
+const Options = ({
+  onChange,
+  value: initialValue
+}) => {
+  const value = initialValue === true || initialValue === "true";
+  return /*#__PURE__*/React.createElement(RadioGroup, {
+    label: "Default value",
+    value: String(value),
+    onChange: value => {
+      onChange(value === "true");
+    },
+    items: [{
+      value: "true",
+      label: "True"
+    }, {
+      value: "false",
+      label: "False"
+    }]
   });
 };
-var plugin = {
+const plugin = {
   type: "cms-editor-field-type",
   name: "cms-editor-field-type-boolean",
   field: {
     type: "boolean",
-    label: t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Boolean"]))),
-    description: t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["Store boolean (\"yes\" or \"no\" ) values."]))),
-    icon: /*#__PURE__*/_react.default.createElement(_toggle_on.ReactComponent, null),
+    label: t`Boolean`,
+    description: t`Store boolean ("yes" or "no" ) values.`,
+    icon: /*#__PURE__*/React.createElement(BooleanIcon, null),
     allowMultipleValues: false,
     allowPredefinedValues: false,
-    multipleValuesLabel: t(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["Use as a list of booleans"]))),
-    createField: function createField() {
+    multipleValuesLabel: t`Use as a list of booleans`,
+    createField() {
       return {
         type: this.type,
         validation: [],
@@ -59,13 +47,13 @@ var plugin = {
         }
       };
     },
-    renderSettings: function renderSettings() {
-      return /*#__PURE__*/_react.default.createElement(_Grid.Grid, null, /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
+    renderSettings() {
+      return /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Grid.Column, {
         span: 12
-      }, /*#__PURE__*/_react.default.createElement(_form.Bind, {
+      }, /*#__PURE__*/React.createElement(Bind, {
         name: "settings.defaultValue"
-      }, function (bind) {
-        return /*#__PURE__*/_react.default.createElement(Options, {
+      }, bind => {
+        return /*#__PURE__*/React.createElement(Options, {
           onChange: bind.onChange,
           value: bind.value
         });
@@ -73,6 +61,6 @@ var plugin = {
     }
   }
 };
-var _default = exports.default = plugin;
+export default plugin;
 
 //# sourceMappingURL=boolean.js.map

package/admin/plugins/fields/boolean.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_toggle_on","_i18n","_Grid","_form","_Radio","_templateObject","_templateObject2","_templateObject3","t","i18n","ns","Options","_ref","onChange","initialValue","value","default","createElement","RadioGroup","label","Fragment","Radio","plugin","type","name","field","_taggedTemplateLiteral2","description","icon","ReactComponent","allowMultipleValues","allowPredefinedValues","multipleValuesLabel","createField","validation","renderer","settings","defaultValue","renderSettings","Grid","Cell","span","Bind","bind","_default","exports"],"sources":["boolean.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as BooleanIcon } from \"@material-design-icons/svg/outlined/toggle_on.svg\";\nimport { CmsModelFieldTypePlugin } from \"~/types\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { Cell, Grid } from \"@webiny/ui/Grid\";\nimport { Bind } from \"@webiny/form\";\nimport { Radio, RadioGroup } from \"@webiny/ui/Radio\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields\");\n\ninterface OptionsProps {\n    onChange: (value: boolean) => void;\n    value?: boolean | \"true\" | \"false\";\n}\n\nconst Options = ({ onChange, value: initialValue }: OptionsProps) => {\n    const value = initialValue === true || initialValue === \"true\";\n\n    return (\n        <RadioGroup label={\"Default value\"}>\n            {() => {\n                return (\n                    <>\n                        <div>\n                            <Radio\n                                label=\"True\"\n                                value={value}\n                                onChange={() => {\n                                    onChange(true);\n                                }}\n                            />\n                        </div>\n                        <div>\n                            <Radio\n                                label=\"False\"\n                                value={!value}\n                                onChange={() => {\n                                    onChange(false);\n                                }}\n                            />\n                        </div>\n                    </>\n                );\n            }}\n        </RadioGroup>\n    );\n};\n\nconst plugin: CmsModelFieldTypePlugin = {\n    type: \"cms-editor-field-type\",\n    name: \"cms-editor-field-type-boolean\",\n    field: {\n        type: \"boolean\",\n        label: t`Boolean`,\n        description: t`Store boolean (\"yes\" or \"no\" ) values.`,\n        icon: <BooleanIcon />,\n        allowMultipleValues: false,\n        allowPredefinedValues: false,\n        multipleValuesLabel: t`Use as a list of booleans`,\n        createField() {\n            return {\n                type: this.type,\n                validation: [],\n                renderer: {\n                    name: \"\"\n                },\n                settings: {\n                    defaultValue: false\n                }\n            };\n        },\n        renderSettings() {\n            return (\n                <Grid>\n                    <Cell span={12}>\n                        <Bind name={\"settings.defaultValue\"}>\n                            {bind => {\n                                return <Options onChange={bind.onChange} value={bind.value} />;\n                            }}\n                        </Bind>\n                    </Cell>\n                </Grid>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,UAAA,GAAAD,OAAA;AAEA,IAAAE,KAAA,GAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AACA,IAAAI,KAAA,GAAAJ,OAAA;AACA,IAAAK,MAAA,GAAAL,OAAA;AAAqD,IAAAM,eAAA,EAAAC,gBAAA,EAAAC,gBAAA;AAErD,IAAMC,CAAC,GAAGC,UAAI,CAACC,EAAE,CAAC,+BAA+B,CAAC;AAOlD,IAAMC,OAAO,GAAG,SAAVA,OAAOA,CAAAC,IAAA,EAAwD;EAAA,IAAlDC,SAAQ,GAAAD,IAAA,CAARC,QAAQ;IAASC,YAAY,GAAAF,IAAA,CAAnBG,KAAK;EAC9B,IAAMA,KAAK,GAAGD,YAAY,KAAK,IAAI,IAAIA,YAAY,KAAK,MAAM;EAE9D,oBACIjB,MAAA,CAAAmB,OAAA,CAAAC,aAAA,CAACb,MAAA,CAAAc,UAAU;IAACC,KAAK,EAAE;EAAgB,GAC9B,YAAM;IACH,oBACItB,MAAA,CAAAmB,OAAA,CAAAC,aAAA,CAAApB,MAAA,CAAAmB,OAAA,CAAAI,QAAA,qBACIvB,MAAA,CAAAmB,OAAA,CAAAC,aAAA,2BACIpB,MAAA,CAAAmB,OAAA,CAAAC,aAAA,CAACb,MAAA,CAAAiB,KAAK;MACFF,KAAK,EAAC,MAAM;MACZJ,KAAK,EAAEA,KAAM;MACbF,QAAQ,EAAE,SAAVA,QAAQA,CAAA,EAAQ;QACZA,SAAQ,CAAC,IAAI,CAAC;MAClB;IAAE,CACL,CACA,CAAC,eACNhB,MAAA,CAAAmB,OAAA,CAAAC,aAAA,2BACIpB,MAAA,CAAAmB,OAAA,CAAAC,aAAA,CAACb,MAAA,CAAAiB,KAAK;MACFF,KAAK,EAAC,OAAO;MACbJ,KAAK,EAAE,CAACA,KAAM;MACdF,QAAQ,EAAE,SAAVA,QAAQA,CAAA,EAAQ;QACZA,SAAQ,CAAC,KAAK,CAAC;MACnB;IAAE,CACL,CACA,CACP,CAAC;EAEX,CACQ,CAAC;AAErB,CAAC;AAED,IAAMS,MAA+B,GAAG;EACpCC,IAAI,EAAE,uBAAuB;EAC7BC,IAAI,EAAE,+BAA+B;EACrCC,KAAK,EAAE;IACHF,IAAI,EAAE,SAAS;IACfJ,KAAK,EAAEX,CAAC,CAAAH,eAAA,KAAAA,eAAA,OAAAqB,uBAAA,CAAAV,OAAA,gBAAS;IACjBW,WAAW,EAAEnB,CAAC,CAAAF,gBAAA,KAAAA,gBAAA,OAAAoB,uBAAA,CAAAV,OAAA,mDAAwC;IACtDY,IAAI,eAAE/B,MAAA,CAAAmB,OAAA,CAAAC,aAAA,CAACjB,UAAA,CAAA6B,cAAW,MAAE,CAAC;IACrBC,mBAAmB,EAAE,KAAK;IAC1BC,qBAAqB,EAAE,KAAK;IAC5BC,mBAAmB,EAAExB,CAAC,CAAAD,gBAAA,KAAAA,gBAAA,OAAAmB,uBAAA,CAAAV,OAAA,kCAA2B;IACjDiB,WAAW,WAAXA,WAAWA,CAAA,EAAG;MACV,OAAO;QACHV,IAAI,EAAE,IAAI,CAACA,IAAI;QACfW,UAAU,EAAE,EAAE;QACdC,QAAQ,EAAE;UACNX,IAAI,EAAE;QACV,CAAC;QACDY,QAAQ,EAAE;UACNC,YAAY,EAAE;QAClB;MACJ,CAAC;IACL,CAAC;IACDC,cAAc,WAAdA,cAAcA,CAAA,EAAG;MACb,oBACIzC,MAAA,CAAAmB,OAAA,CAAAC,aAAA,CAACf,KAAA,CAAAqC,IAAI,qBACD1C,MAAA,CAAAmB,OAAA,CAAAC,aAAA,CAACf,KAAA,CAAAsC,IAAI;QAACC,IAAI,EAAE;MAAG,gBACX5C,MAAA,CAAAmB,OAAA,CAAAC,aAAA,CAACd,KAAA,CAAAuC,IAAI;QAAClB,IAAI,EAAE;MAAwB,GAC/B,UAAAmB,IAAI,EAAI;QACL,oBAAO9C,MAAA,CAAAmB,OAAA,CAAAC,aAAA,CAACN,OAAO;UAACE,QAAQ,EAAE8B,IAAI,CAAC9B,QAAS;UAACE,KAAK,EAAE4B,IAAI,CAAC5B;QAAM,CAAE,CAAC;MAClE,CACE,CACJ,CACJ,CAAC;IAEf;EACJ;AACJ,CAAC;AAAC,IAAA6B,QAAA,GAAAC,OAAA,CAAA7B,OAAA,GAEaM,MAAM","ignoreList":[]}
+{"version":3,"names":["React","ReactComponent","BooleanIcon","i18n","Bind","Grid","RadioGroup","t","ns","Options","onChange","value","initialValue","createElement","label","String","items","plugin","type","name","field","description","icon","allowMultipleValues","allowPredefinedValues","multipleValuesLabel","createField","validation","renderer","settings","defaultValue","renderSettings","Column","span","bind"],"sources":["boolean.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as BooleanIcon } from \"@webiny/icons/toggle_on.svg\";\nimport { CmsModelFieldTypePlugin } from \"~/types\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { Bind } from \"@webiny/form\";\nimport { Grid, RadioGroup } from \"@webiny/admin-ui\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields\");\n\ninterface OptionsProps {\n    onChange: (value: boolean) => void;\n    value?: boolean | \"true\" | \"false\";\n}\n\nconst Options = ({ onChange, value: initialValue }: OptionsProps) => {\n    const value = initialValue === true || initialValue === \"true\";\n\n    return (\n        <RadioGroup\n            label={\"Default value\"}\n            value={String(value)}\n            onChange={value => {\n                onChange(value === \"true\");\n            }}\n            items={[\n                { value: \"true\", label: \"True\" },\n                { value: \"false\", label: \"False\" }\n            ]}\n        />\n    );\n};\n\nconst plugin: CmsModelFieldTypePlugin = {\n    type: \"cms-editor-field-type\",\n    name: \"cms-editor-field-type-boolean\",\n    field: {\n        type: \"boolean\",\n        label: t`Boolean`,\n        description: t`Store boolean (\"yes\" or \"no\" ) values.`,\n        icon: <BooleanIcon />,\n        allowMultipleValues: false,\n        allowPredefinedValues: false,\n        multipleValuesLabel: t`Use as a list of booleans`,\n        createField() {\n            return {\n                type: this.type,\n                validation: [],\n                renderer: {\n                    name: \"\"\n                },\n                settings: {\n                    defaultValue: false\n                }\n            };\n        },\n        renderSettings() {\n            return (\n                <Grid>\n                    <Grid.Column span={12}>\n                        <Bind name={\"settings.defaultValue\"}>\n                            {bind => {\n                                return <Options onChange={bind.onChange} value={bind.value} />;\n                            }}\n                        </Bind>\n                    </Grid.Column>\n                </Grid>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,cAAc,IAAIC,WAAW,QAAQ,6BAA6B;AAE3E,SAASC,IAAI,QAAQ,kBAAkB;AACvC,SAASC,IAAI,QAAQ,cAAc;AACnC,SAASC,IAAI,EAAEC,UAAU,QAAQ,kBAAkB;AAEnD,MAAMC,CAAC,GAAGJ,IAAI,CAACK,EAAE,CAAC,+BAA+B,CAAC;AAOlD,MAAMC,OAAO,GAAGA,CAAC;EAAEC,QAAQ;EAAEC,KAAK,EAAEC;AAA2B,CAAC,KAAK;EACjE,MAAMD,KAAK,GAAGC,YAAY,KAAK,IAAI,IAAIA,YAAY,KAAK,MAAM;EAE9D,oBACIZ,KAAA,CAAAa,aAAA,CAACP,UAAU;IACPQ,KAAK,EAAE,eAAgB;IACvBH,KAAK,EAAEI,MAAM,CAACJ,KAAK,CAAE;IACrBD,QAAQ,EAAEC,KAAK,IAAI;MACfD,QAAQ,CAACC,KAAK,KAAK,MAAM,CAAC;IAC9B,CAAE;IACFK,KAAK,EAAE,CACH;MAAEL,KAAK,EAAE,MAAM;MAAEG,KAAK,EAAE;IAAO,CAAC,EAChC;MAAEH,KAAK,EAAE,OAAO;MAAEG,KAAK,EAAE;IAAQ,CAAC;EACpC,CACL,CAAC;AAEV,CAAC;AAED,MAAMG,MAA+B,GAAG;EACpCC,IAAI,EAAE,uBAAuB;EAC7BC,IAAI,EAAE,+BAA+B;EACrCC,KAAK,EAAE;IACHF,IAAI,EAAE,SAAS;IACfJ,KAAK,EAAEP,CAAC,SAAS;IACjBc,WAAW,EAAEd,CAAC,wCAAwC;IACtDe,IAAI,eAAEtB,KAAA,CAAAa,aAAA,CAACX,WAAW,MAAE,CAAC;IACrBqB,mBAAmB,EAAE,KAAK;IAC1BC,qBAAqB,EAAE,KAAK;IAC5BC,mBAAmB,EAAElB,CAAC,2BAA2B;IACjDmB,WAAWA,CAAA,EAAG;MACV,OAAO;QACHR,IAAI,EAAE,IAAI,CAACA,IAAI;QACfS,UAAU,EAAE,EAAE;QACdC,QAAQ,EAAE;UACNT,IAAI,EAAE;QACV,CAAC;QACDU,QAAQ,EAAE;UACNC,YAAY,EAAE;QAClB;MACJ,CAAC;IACL,CAAC;IACDC,cAAcA,CAAA,EAAG;MACb,oBACI/B,KAAA,CAAAa,aAAA,CAACR,IAAI,qBACDL,KAAA,CAAAa,aAAA,CAACR,IAAI,CAAC2B,MAAM;QAACC,IAAI,EAAE;MAAG,gBAClBjC,KAAA,CAAAa,aAAA,CAACT,IAAI;QAACe,IAAI,EAAE;MAAwB,GAC/Be,IAAI,IAAI;QACL,oBAAOlC,KAAA,CAAAa,aAAA,CAACJ,OAAO;UAACC,QAAQ,EAAEwB,IAAI,CAACxB,QAAS;UAACC,KAAK,EAAEuB,IAAI,CAACvB;QAAM,CAAE,CAAC;MAClE,CACE,CACG,CACX,CAAC;IAEf;EACJ;AACJ,CAAC;AAED,eAAeM,MAAM","ignoreList":[]}

package/admin/plugins/fields/dateTime.js

@@ -1,74 +1,78 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _react = _interopRequireDefault(require("react"));
-var _get = _interopRequireDefault(require("lodash/get"));
-var _Grid = require("@webiny/ui/Grid");
-var _Select = require("@webiny/ui/Select");
-var _i18n = require("@webiny/app/i18n");
-var _scheduleBlack24px = require("./icons/schedule-black-24px.svg");
-var _hooks = require("../../hooks");
-var _form = require("@webiny/form");
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18;
-var t = _i18n.i18n.ns("app-headless-cms/admin/fields");
-var DateTimeSettings = function DateTimeSettings() {
-  var _useModel = (0, _hooks.useModel)(),
-    model = _useModel.model;
-  var _useModelField = (0, _hooks.useModelField)(),
-    field = _useModelField.field;
-  var lockedFields = model.lockedFields || [];
-  var fieldId = (0, _get.default)(field, "fieldId", null);
-  var lockedField = lockedFields.find(function (lockedField) {
-    return lockedField.fieldId === fieldId;
-  });
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Grid.Grid, null, /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
+import React from "react";
+import get from "lodash/get";
+import { i18n } from "@webiny/app/i18n";
+import { ReactComponent as DateTimeIcon } from "./icons/schedule-black-24px.svg";
+import { useModel, useModelField } from "../../hooks";
+import { Bind } from "@webiny/form";
+import { Grid, Label, Select } from "@webiny/admin-ui";
+const t = i18n.ns("app-headless-cms/admin/fields");
+const DateTimeSettings = () => {
+  const {
+    model
+  } = useModel();
+  const {
+    field
+  } = useModelField();
+  const lockedFields = model.lockedFields || [];
+  const fieldId = get(field, "fieldId", null);
+  const lockedField = lockedFields.find(lockedField => lockedField.fieldId === fieldId);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Grid.Column, {
     span: 6
-  }, /*#__PURE__*/_react.default.createElement(_form.Bind, {
+  }, /*#__PURE__*/React.createElement(Bind, {
     name: "settings.type"
-  }, /*#__PURE__*/_react.default.createElement(_Select.Select, {
-    label: t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Format"]))),
-    description: t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["Cannot be changed later"]))),
-    disabled: lockedField && Boolean(lockedField.formatType)
-  }, /*#__PURE__*/_react.default.createElement("option", {
-    value: t(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["date"])))
-  }, t(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["Date only"])))), /*#__PURE__*/_react.default.createElement("option", {
-    value: t(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["time"])))
-  }, t(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["Time only"])))), /*#__PURE__*/_react.default.createElement("option", {
-    value: t(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["dateTimeWithTimezone"])))
-  }, t(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["Date and time with timezone"])))), /*#__PURE__*/_react.default.createElement("option", {
-    value: t(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["dateTimeWithoutTimezone"])))
-  }, t(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["Date and time without timezone"]))))))), /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
+  }, /*#__PURE__*/React.createElement(Select, {
+    label: /*#__PURE__*/React.createElement(Label, {
+      text: t`Format`,
+      description: t`(cannot be changed later)`
+    }),
+    disabled: lockedField && Boolean(lockedField.formatType),
+    options: [{
+      value: "date",
+      label: t`Date only`
+    }, {
+      value: "time",
+      label: t`Time only`
+    }, {
+      value: "dateTimeWithTimezone",
+      label: t`Date and time with timezone`
+    }, {
+      value: "dateTimeWithoutTimezone",
+      label: t`Date and time without timezone`
+    }],
+    size: "lg"
+  }))), /*#__PURE__*/React.createElement(Grid.Column, {
     span: 6
-  }, /*#__PURE__*/_react.default.createElement(_form.Bind, {
+  }, /*#__PURE__*/React.createElement(Bind, {
     name: "settings.defaultSetValue"
-  }, /*#__PURE__*/_react.default.createElement(_Select.Select, {
-    label: t(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["Default Admin UI value"]))),
-    description: "Affects the Admin UI only"
-  }, /*#__PURE__*/_react.default.createElement("option", {
-    value: t(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["null"])))
-  }, t(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["Leave empty (null value)"])))), /*#__PURE__*/_react.default.createElement("option", {
-    value: t(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["current"])))
-  }, t(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2.default)(["Current date/time"])))))))));
+  }, /*#__PURE__*/React.createElement(Select, {
+    label: /*#__PURE__*/React.createElement(Label, {
+      text: t`Default Admin UI value`,
+      hint: t`Affects the Admin UI only`
+    }),
+    options: [{
+      value: t`null`,
+      label: t`Leave empty (null value)`
+    }, {
+      value: t`current`,
+      label: t`Current date/time`
+    }],
+    size: "lg"
+  })))));
 };
-var plugin = {
+const plugin = {
   type: "cms-editor-field-type",
   name: "cms-editor-field-type-dateTime",
   field: {
     type: "datetime",
-    label: t(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2.default)(["Date/Time"]))),
-    description: t(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2.default)(["Store date and time."]))),
-    icon: /*#__PURE__*/_react.default.createElement(_scheduleBlack24px.ReactComponent, null),
+    label: t`Date/Time`,
+    description: t`Store date and time.`,
+    icon: /*#__PURE__*/React.createElement(DateTimeIcon, null),
     validators: ["required", "dateGte", "dateLte"],
     allowMultipleValues: true,
     allowPredefinedValues: false,
     // TODO: implement "renderPredefinedValues" and set to true.
-    multipleValuesLabel: t(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2.default)(["Use as a list of dates and times"]))),
-    createField: function createField() {
+    multipleValuesLabel: t`Use as a list of dates and times`,
+    createField() {
       return {
         type: this.type,
         settings: {
@@ -80,11 +84,11 @@ var plugin = {
         }
       };
     },
-    renderSettings: function renderSettings() {
-      return /*#__PURE__*/_react.default.createElement(DateTimeSettings, null);
+    renderSettings() {
+      return /*#__PURE__*/React.createElement(DateTimeSettings, null);
     }
   }
 };
-var _default = exports.default = plugin;
+export default plugin;
 
 //# sourceMappingURL=dateTime.js.map

package/admin/plugins/fields/dateTime.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_get","_Grid","_Select","_i18n","_scheduleBlack24px","_hooks","_form","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","_templateObject9","_templateObject10","_templateObject11","_templateObject12","_templateObject13","_templateObject14","_templateObject15","_templateObject16","_templateObject17","_templateObject18","t","i18n","ns","DateTimeSettings","_useModel","useModel","model","_useModelField","useModelField","field","lockedFields","fieldId","get","lockedField","find","default","createElement","Fragment","Grid","Cell","span","Bind","name","Select","label","_taggedTemplateLiteral2","description","disabled","Boolean","formatType","value","plugin","type","icon","ReactComponent","validators","allowMultipleValues","allowPredefinedValues","multipleValuesLabel","createField","settings","validation","renderer","renderSettings","_default","exports"],"sources":["dateTime.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get\";\nimport { Grid, Cell } from \"@webiny/ui/Grid\";\nimport { Select } from \"@webiny/ui/Select\";\nimport { CmsModelField, CmsModelFieldTypePlugin } from \"~/types\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { ReactComponent as DateTimeIcon } from \"./icons/schedule-black-24px.svg\";\nimport { useModel, useModelField } from \"~/admin/hooks\";\nimport { Bind } from \"@webiny/form\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields\");\n\nconst DateTimeSettings = () => {\n    const { model } = useModel();\n    const { field } = useModelField();\n    const lockedFields = model.lockedFields || [];\n    const fieldId = get(field, \"fieldId\", null);\n    const lockedField = lockedFields.find(\n        lockedField => lockedField.fieldId === fieldId\n    ) as CmsModelField<{\n        formatType: string;\n    }>;\n\n    return (\n        <>\n            <Grid>\n                <Cell span={6}>\n                    <Bind name={\"settings.type\"}>\n                        <Select\n                            label={t`Format`}\n                            description={t`Cannot be changed later`}\n                            disabled={lockedField && Boolean(lockedField.formatType)}\n                        >\n                            <option value={t`date`}>{t`Date only`}</option>\n                            <option value={t`time`}>{t`Time only`}</option>\n                            <option\n                                value={t`dateTimeWithTimezone`}\n                            >{t`Date and time with timezone`}</option>\n                            <option\n                                value={t`dateTimeWithoutTimezone`}\n                            >{t`Date and time without timezone`}</option>\n                        </Select>\n                    </Bind>\n                </Cell>\n                <Cell span={6}>\n                    <Bind name={\"settings.defaultSetValue\"}>\n                        <Select\n                            label={t`Default Admin UI value`}\n                            description={\"Affects the Admin UI only\"}\n                        >\n                            <option value={t`null`}>{t`Leave empty (null value)`}</option>\n                            <option value={t`current`}>{t`Current date/time`}</option>\n                        </Select>\n                    </Bind>\n                </Cell>\n            </Grid>\n        </>\n    );\n};\n\nconst plugin: CmsModelFieldTypePlugin = {\n    type: \"cms-editor-field-type\",\n    name: \"cms-editor-field-type-dateTime\",\n    field: {\n        type: \"datetime\",\n        label: t`Date/Time`,\n        description: t`Store date and time.`,\n        icon: <DateTimeIcon />,\n        validators: [\"required\", \"dateGte\", \"dateLte\"],\n        allowMultipleValues: true,\n        allowPredefinedValues: false, // TODO: implement \"renderPredefinedValues\" and set to true.\n        multipleValuesLabel: t`Use as a list of dates and times`,\n        createField() {\n            return {\n                type: this.type,\n                settings: {\n                    type: \"date\"\n                },\n                validation: [],\n                renderer: {\n                    name: \"\"\n                }\n            };\n        },\n        renderSettings() {\n            return <DateTimeSettings />;\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","get","i18n","ReactComponent","DateTimeIcon","useModel","useModelField","Bind","Grid","Label","Select","t","ns","DateTimeSettings","model","field","lockedFields","fieldId","lockedField","find","createElement","Fragment","Column","span","name","label","text","description","disabled","Boolean","formatType","options","value","size","hint","plugin","type","icon","validators","allowMultipleValues","allowPredefinedValues","multipleValuesLabel","createField","settings","validation","renderer","renderSettings"],"sources":["dateTime.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get\";\n\nimport { CmsModelField, CmsModelFieldTypePlugin } from \"~/types\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { ReactComponent as DateTimeIcon } from \"./icons/schedule-black-24px.svg\";\nimport { useModel, useModelField } from \"~/admin/hooks\";\nimport { Bind } from \"@webiny/form\";\nimport { Grid, Label, Select } from \"@webiny/admin-ui\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields\");\n\nconst DateTimeSettings = () => {\n    const { model } = useModel();\n    const { field } = useModelField();\n    const lockedFields = model.lockedFields || [];\n    const fieldId = get(field, \"fieldId\", null);\n    const lockedField = lockedFields.find(\n        lockedField => lockedField.fieldId === fieldId\n    ) as CmsModelField<{\n        formatType: string;\n    }>;\n\n    return (\n        <>\n            <Grid>\n                <Grid.Column span={6}>\n                    <Bind name={\"settings.type\"}>\n                        <Select\n                            label={\n                                <Label\n                                    text={t`Format`}\n                                    description={t`(cannot be changed later)`}\n                                />\n                            }\n                            disabled={lockedField && Boolean(lockedField.formatType)}\n                            options={[\n                                { value: \"date\", label: t`Date only` },\n                                { value: \"time\", label: t`Time only` },\n                                {\n                                    value: \"dateTimeWithTimezone\",\n                                    label: t`Date and time with timezone`\n                                },\n                                {\n                                    value: \"dateTimeWithoutTimezone\",\n                                    label: t`Date and time without timezone`\n                                }\n                            ]}\n                            size={\"lg\"}\n                        />\n                    </Bind>\n                </Grid.Column>\n                <Grid.Column span={6}>\n                    <Bind name={\"settings.defaultSetValue\"}>\n                        <Select\n                            label={\n                                <Label\n                                    text={t`Default Admin UI value`}\n                                    hint={t`Affects the Admin UI only`}\n                                />\n                            }\n                            options={[\n                                { value: t`null`, label: t`Leave empty (null value)` },\n                                { value: t`current`, label: t`Current date/time` }\n                            ]}\n                            size={\"lg\"}\n                        />\n                    </Bind>\n                </Grid.Column>\n            </Grid>\n        </>\n    );\n};\n\nconst plugin: CmsModelFieldTypePlugin = {\n    type: \"cms-editor-field-type\",\n    name: \"cms-editor-field-type-dateTime\",\n    field: {\n        type: \"datetime\",\n        label: t`Date/Time`,\n        description: t`Store date and time.`,\n        icon: <DateTimeIcon />,\n        validators: [\"required\", \"dateGte\", \"dateLte\"],\n        allowMultipleValues: true,\n        allowPredefinedValues: false, // TODO: implement \"renderPredefinedValues\" and set to true.\n        multipleValuesLabel: t`Use as a list of dates and times`,\n        createField() {\n            return {\n                type: this.type,\n                settings: {\n                    type: \"date\"\n                },\n                validation: [],\n                renderer: {\n                    name: \"\"\n                }\n            };\n        },\n        renderSettings() {\n            return <DateTimeSettings />;\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":"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","ignoreList":[]}

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

@@ -1,121 +1,80 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.AddTemplateIcon = exports.AddTemplateButton = void 0;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _base = _interopRequireDefault(require("@emotion/styled/base"));
-var _react = _interopRequireWildcard(require("react"));
-var _Button = require("@webiny/ui/Button");
-var _TemplateDialog = require("./TemplateDialog");
-var _Typography = require("@webiny/ui/Typography");
-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 _Elevation = require("@webiny/ui/Elevation");
-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 AddTemplateButtonContainer = /*#__PURE__*/(0, _base.default)(_Elevation.Elevation, process.env.NODE_ENV === "production" ? {
-  target: "e34m0te2"
-} : {
-  target: "e34m0te2",
-  label: "AddTemplateButtonContainer"
-})(process.env.NODE_ENV === "production" ? {
-  name: "1mw0icp",
-  styles: "padding:25px 0 20px;text-align:center"
-} : {
-  name: "1mw0icp",
-  styles: "padding:25px 0 20px;text-align:center",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkFkZFRlbXBsYXRlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFVb0QiLCJmaWxlIjoiQWRkVGVtcGxhdGUudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IENtc0R5bmFtaWNab25lVGVtcGxhdGUgfSBmcm9tIFwifi90eXBlc1wiO1xuaW1wb3J0IHsgQnV0dG9uU2Vjb25kYXJ5LCBJY29uQnV0dG9uIH0gZnJvbSBcIkB3ZWJpbnkvdWkvQnV0dG9uXCI7XG5pbXBvcnQgeyBUZW1wbGF0ZURpYWxvZyB9IGZyb20gXCIuL1RlbXBsYXRlRGlhbG9nXCI7XG5pbXBvcnQgeyBUeXBvZ3JhcGh5IH0gZnJvbSBcIkB3ZWJpbnkvdWkvVHlwb2dyYXBoeVwiO1xuaW1wb3J0IHsgUmVhY3RDb21wb25lbnQgYXMgSW5mb0ljb24gfSBmcm9tIFwiQG1hdGVyaWFsLWRlc2lnbi1pY29ucy9zdmcvb3V0bGluZWQvaW5mby5zdmdcIjtcbmltcG9ydCB7IFJlYWN0Q29tcG9uZW50IGFzIEFkZEljb24gfSBmcm9tIFwiQG1hdGVyaWFsLWRlc2lnbi1pY29ucy9zdmcvcm91bmQvYWRkX2NpcmNsZV9vdXRsaW5lLnN2Z1wiO1xuaW1wb3J0IHsgRWxldmF0aW9uIH0gZnJvbSBcIkB3ZWJpbnkvdWkvRWxldmF0aW9uXCI7XG5cbmNvbnN0IEFkZFRlbXBsYXRlQnV0dG9uQ29udGFpbmVyID0gc3R5bGVkKEVsZXZhdGlvbilgXG4gICAgcGFkZGluZzogMjVweCAwIDIwcHg7XG4gICAgdGV4dC1hbGlnbjogY2VudGVyO1xuYDtcblxuLyoqXG4gKiBUaGlzIGhhY2tpbmcgaXMgbmVlZGVkIHRvIHBvc2l0aW9uIHRoZSBidXR0b24gZXhhY3RseSBpbiB0aGUgbWlkZGxlIG9mIGF2YWlsYWJsZSBhcmVhIGFuZCBub3Qgc3RyZXRjaCB0aGUgcGFyZW50IGVsZW1lbnQuXG4gKi9cbmNvbnN0IEFkZFRlbXBsYXRlSWNvbkNvbnRhaW5lciA9IHN0eWxlZC5kaXZgXG4gICAgdGV4dC1hbGlnbjogY2VudGVyO1xuICAgIGhlaWdodDogMzZweDtcblxuICAgID4gYnV0dG9uIHtcbiAgICAgICAgbWFyZ2luLWxlZnQ6IC0yNHB4O1xuICAgICAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgfVxuYDtcblxuY29uc3QgSW5mbyA9IHN0eWxlZC5kaXZgXG4gICAgbWFyZ2luLXRvcDogOHB4O1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcblxuICAgID4gc3ZnIHtcbiAgICAgICAgd2lkdGg6IDIwcHg7XG4gICAgICAgIG1hcmdpbi1yaWdodDogNXB4O1xuICAgIH1cbmA7XG5cbmludGVyZmFjZSBBZGRUZW1wbGF0ZVByb3BzIHtcbiAgICBvblRlbXBsYXRlOiBVc2VBZGRUZW1wbGF0ZVBhcmFtc1tcIm9uVGVtcGxhdGVcIl07XG59XG5cbmludGVyZmFjZSBVc2VBZGRUZW1wbGF0ZVBhcmFtcyB7XG4gICAgb25UZW1wbGF0ZTogKHRlbXBsYXRlOiBDbXNEeW5hbWljWm9uZVRlbXBsYXRlKSA9PiB2b2lkO1xufVxuXG5mdW5jdGlvbiB1c2VBZGRUZW1wbGF0ZShwYXJhbXM6IFVzZUFkZFRlbXBsYXRlUGFyYW1zKSB7XG4gICAgY29uc3QgW3Nob3dUZW1wbGF0ZURpYWxvZywgc2V0U2hvd1RlbXBsYXRlRGlhbG9nXSA9IHVzZVN0YXRlKGZhbHNlKTtcblxuICAgIGNvbnN0IGFkZFRlbXBsYXRlID0gKCkgPT4ge1xuICAgICAgICBzZXRTaG93VGVtcGxhdGVEaWFsb2codHJ1ZSk7XG4gICAgfTtcblxuICAgIGNvbnN0IG9uVGVtcGxhdGUgPSAodGVtcGxhdGU6IENtc0R5bmFtaWNab25lVGVtcGxhdGUpID0+IHtcbiAgICAgICAgcGFyYW1zLm9uVGVtcGxhdGUodGVtcGxhdGUpO1xuICAgIH07XG5cbiAgICBjb25zdCBvbkRpYWxvZ0Nsb3NlID0gKCkgPT4ge1xuICAgICAgICBzZXRTaG93VGVtcGxhdGVEaWFsb2coZmFsc2UpO1xuICAgIH07XG5cbiAgICByZXR1cm4ge1xuICAgICAgICBhZGRUZW1wbGF0ZSxcbiAgICAgICAgb25UZW1wbGF0ZSxcbiAgICAgICAgb25EaWFsb2dDbG9zZSxcbiAgICAgICAgc2hvd1RlbXBsYXRlRGlhbG9nXG4gICAgfTtcbn1cblxuZXhwb3J0IGNvbnN0IEFkZFRlbXBsYXRlQnV0dG9uID0gKHByb3BzOiBBZGRUZW1wbGF0ZVByb3BzKSA9PiB7XG4gICAgY29uc3QgeyBhZGRUZW1wbGF0ZSwgb25UZW1wbGF0ZSwgc2hvd1RlbXBsYXRlRGlhbG9nLCBvbkRpYWxvZ0Nsb3NlIH0gPSB1c2VBZGRUZW1wbGF0ZSh7XG4gICAgICAgIG9uVGVtcGxhdGU6IHByb3BzLm9uVGVtcGxhdGVcbiAgICB9KTtcblxuICAgIHJldHVybiAoXG4gICAgICAgIDxBZGRUZW1wbGF0ZUJ1dHRvbkNvbnRhaW5lciB6PXsyfT5cbiAgICAgICAgICAgIHtzaG93VGVtcGxhdGVEaWFsb2cgPyAoXG4gICAgICAgICAgICAgICAgPFRlbXBsYXRlRGlhbG9nIG9uVGVtcGxhdGU9e29uVGVtcGxhdGV9IG9uQ2xvc2U9e29uRGlhbG9nQ2xvc2V9IC8+XG4gICAgICAgICAgICApIDogbnVsbH1cbiAgICAgICAgICAgIDxCdXR0b25TZWNvbmRhcnkgb25DbGljaz17YWRkVGVtcGxhdGV9PisgQWRkIGEgdGVtcGxhdGU8L0J1dHRvblNlY29uZGFyeT5cbiAgICAgICAgICAgIDxJbmZvPlxuICAgICAgICAgICAgICAgIDxJbmZvSWNvbiAvPlxuICAgICAgICAgICAgICAgIDxUeXBvZ3JhcGh5IHVzZT17XCJjYXB0aW9uXCJ9PlxuICAgICAgICAgICAgICAgICAgICBDbGljayBoZXJlIHRvIGxlYXJuIGhvdyB0ZW1wbGF0ZXMgYW5kIGR5bmFtaWMgem9uZXMgd29ya1xuICAgICAgICAgICAgICAgIDwvVHlwb2dyYXBoeT5cbiAgICAgICAgICAgIDwvSW5mbz5cbiAgICAgICAgPC9BZGRUZW1wbGF0ZUJ1dHRvbkNvbnRhaW5lcj5cbiAgICApO1xufTtcblxuZXhwb3J0IGNvbnN0IEFkZFRlbXBsYXRlSWNvbiA9IChwcm9wczogQWRkVGVtcGxhdGVQcm9wcykgPT4ge1xuICAgIGNvbnN0IHsgYWRkVGVtcGxhdGUsIG9uVGVtcGxhdGUsIHNob3dUZW1wbGF0ZURpYWxvZywgb25EaWFsb2dDbG9zZSB9ID0gdXNlQWRkVGVtcGxhdGUoe1xuICAgICAgICBvblRlbXBsYXRlOiBwcm9wcy5vblRlbXBsYXRlXG4gICAgfSk7XG5cbiAgICByZXR1cm4gKFxuICAgICAgICA8QWRkVGVtcGxhdGVJY29uQ29udGFpbmVyPlxuICAgICAgICAgICAge3Nob3dUZW1wbGF0ZURpYWxvZyA/IChcbiAgICAgICAgICAgICAgICA8VGVtcGxhdGVEaWFsb2cgb25UZW1wbGF0ZT17b25UZW1wbGF0ZX0gb25DbG9zZT17b25EaWFsb2dDbG9zZX0gLz5cbiAgICAgICAgICAgICkgOiBudWxsfVxuICAgICAgICAgICAgPEljb25CdXR0b24gb25DbGljaz17YWRkVGVtcGxhdGV9IGljb249ezxBZGRJY29uIC8+fSAvPlxuICAgICAgICA8L0FkZFRlbXBsYXRlSWNvbkNvbnRhaW5lcj5cbiAgICApO1xufTtcbiJdfQ== */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-
-/**
- * This hacking is needed to position the button exactly in the middle of available area and not stretch the parent element.
- */
-var AddTemplateIconContainer = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e34m0te1"
-} : {
-  target: "e34m0te1",
-  label: "AddTemplateIconContainer"
-})(process.env.NODE_ENV === "production" ? {
-  name: "btmgo5",
-  styles: "text-align:center;height:36px;>button{margin-left:-24px;position:absolute;}"
-} : {
-  name: "btmgo5",
-  styles: "text-align:center;height:36px;>button{margin-left:-24px;position:absolute;}",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkFkZFRlbXBsYXRlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFrQjJDIiwiZmlsZSI6IkFkZFRlbXBsYXRlLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwgeyB1c2VTdGF0ZSB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBDbXNEeW5hbWljWm9uZVRlbXBsYXRlIH0gZnJvbSBcIn4vdHlwZXNcIjtcbmltcG9ydCB7IEJ1dHRvblNlY29uZGFyeSwgSWNvbkJ1dHRvbiB9IGZyb20gXCJAd2ViaW55L3VpL0J1dHRvblwiO1xuaW1wb3J0IHsgVGVtcGxhdGVEaWFsb2cgfSBmcm9tIFwiLi9UZW1wbGF0ZURpYWxvZ1wiO1xuaW1wb3J0IHsgVHlwb2dyYXBoeSB9IGZyb20gXCJAd2ViaW55L3VpL1R5cG9ncmFwaHlcIjtcbmltcG9ydCB7IFJlYWN0Q29tcG9uZW50IGFzIEluZm9JY29uIH0gZnJvbSBcIkBtYXRlcmlhbC1kZXNpZ24taWNvbnMvc3ZnL291dGxpbmVkL2luZm8uc3ZnXCI7XG5pbXBvcnQgeyBSZWFjdENvbXBvbmVudCBhcyBBZGRJY29uIH0gZnJvbSBcIkBtYXRlcmlhbC1kZXNpZ24taWNvbnMvc3ZnL3JvdW5kL2FkZF9jaXJjbGVfb3V0bGluZS5zdmdcIjtcbmltcG9ydCB7IEVsZXZhdGlvbiB9IGZyb20gXCJAd2ViaW55L3VpL0VsZXZhdGlvblwiO1xuXG5jb25zdCBBZGRUZW1wbGF0ZUJ1dHRvbkNvbnRhaW5lciA9IHN0eWxlZChFbGV2YXRpb24pYFxuICAgIHBhZGRpbmc6IDI1cHggMCAyMHB4O1xuICAgIHRleHQtYWxpZ246IGNlbnRlcjtcbmA7XG5cbi8qKlxuICogVGhpcyBoYWNraW5nIGlzIG5lZWRlZCB0byBwb3NpdGlvbiB0aGUgYnV0dG9uIGV4YWN0bHkgaW4gdGhlIG1pZGRsZSBvZiBhdmFpbGFibGUgYXJlYSBhbmQgbm90IHN0cmV0Y2ggdGhlIHBhcmVudCBlbGVtZW50LlxuICovXG5jb25zdCBBZGRUZW1wbGF0ZUljb25Db250YWluZXIgPSBzdHlsZWQuZGl2YFxuICAgIHRleHQtYWxpZ246IGNlbnRlcjtcbiAgICBoZWlnaHQ6IDM2cHg7XG5cbiAgICA+IGJ1dHRvbiB7XG4gICAgICAgIG1hcmdpbi1sZWZ0OiAtMjRweDtcbiAgICAgICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgIH1cbmA7XG5cbmNvbnN0IEluZm8gPSBzdHlsZWQuZGl2YFxuICAgIG1hcmdpbi10b3A6IDhweDtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5cbiAgICA+IHN2ZyB7XG4gICAgICAgIHdpZHRoOiAyMHB4O1xuICAgICAgICBtYXJnaW4tcmlnaHQ6IDVweDtcbiAgICB9XG5gO1xuXG5pbnRlcmZhY2UgQWRkVGVtcGxhdGVQcm9wcyB7XG4gICAgb25UZW1wbGF0ZTogVXNlQWRkVGVtcGxhdGVQYXJhbXNbXCJvblRlbXBsYXRlXCJdO1xufVxuXG5pbnRlcmZhY2UgVXNlQWRkVGVtcGxhdGVQYXJhbXMge1xuICAgIG9uVGVtcGxhdGU6ICh0ZW1wbGF0ZTogQ21zRHluYW1pY1pvbmVUZW1wbGF0ZSkgPT4gdm9pZDtcbn1cblxuZnVuY3Rpb24gdXNlQWRkVGVtcGxhdGUocGFyYW1zOiBVc2VBZGRUZW1wbGF0ZVBhcmFtcykge1xuICAgIGNvbnN0IFtzaG93VGVtcGxhdGVEaWFsb2csIHNldFNob3dUZW1wbGF0ZURpYWxvZ10gPSB1c2VTdGF0ZShmYWxzZSk7XG5cbiAgICBjb25zdCBhZGRUZW1wbGF0ZSA9ICgpID0+IHtcbiAgICAgICAgc2V0U2hvd1RlbXBsYXRlRGlhbG9nKHRydWUpO1xuICAgIH07XG5cbiAgICBjb25zdCBvblRlbXBsYXRlID0gKHRlbXBsYXRlOiBDbXNEeW5hbWljWm9uZVRlbXBsYXRlKSA9PiB7XG4gICAgICAgIHBhcmFtcy5vblRlbXBsYXRlKHRlbXBsYXRlKTtcbiAgICB9O1xuXG4gICAgY29uc3Qgb25EaWFsb2dDbG9zZSA9ICgpID0+IHtcbiAgICAgICAgc2V0U2hvd1RlbXBsYXRlRGlhbG9nKGZhbHNlKTtcbiAgICB9O1xuXG4gICAgcmV0dXJuIHtcbiAgICAgICAgYWRkVGVtcGxhdGUsXG4gICAgICAgIG9uVGVtcGxhdGUsXG4gICAgICAgIG9uRGlhbG9nQ2xvc2UsXG4gICAgICAgIHNob3dUZW1wbGF0ZURpYWxvZ1xuICAgIH07XG59XG5cbmV4cG9ydCBjb25zdCBBZGRUZW1wbGF0ZUJ1dHRvbiA9IChwcm9wczogQWRkVGVtcGxhdGVQcm9wcykgPT4ge1xuICAgIGNvbnN0IHsgYWRkVGVtcGxhdGUsIG9uVGVtcGxhdGUsIHNob3dUZW1wbGF0ZURpYWxvZywgb25EaWFsb2dDbG9zZSB9ID0gdXNlQWRkVGVtcGxhdGUoe1xuICAgICAgICBvblRlbXBsYXRlOiBwcm9wcy5vblRlbXBsYXRlXG4gICAgfSk7XG5cbiAgICByZXR1cm4gKFxuICAgICAgICA8QWRkVGVtcGxhdGVCdXR0b25Db250YWluZXIgej17Mn0+XG4gICAgICAgICAgICB7c2hvd1RlbXBsYXRlRGlhbG9nID8gKFxuICAgICAgICAgICAgICAgIDxUZW1wbGF0ZURpYWxvZyBvblRlbXBsYXRlPXtvblRlbXBsYXRlfSBvbkNsb3NlPXtvbkRpYWxvZ0Nsb3NlfSAvPlxuICAgICAgICAgICAgKSA6IG51bGx9XG4gICAgICAgICAgICA8QnV0dG9uU2Vjb25kYXJ5IG9uQ2xpY2s9e2FkZFRlbXBsYXRlfT4rIEFkZCBhIHRlbXBsYXRlPC9CdXR0b25TZWNvbmRhcnk+XG4gICAgICAgICAgICA8SW5mbz5cbiAgICAgICAgICAgICAgICA8SW5mb0ljb24gLz5cbiAgICAgICAgICAgICAgICA8VHlwb2dyYXBoeSB1c2U9e1wiY2FwdGlvblwifT5cbiAgICAgICAgICAgICAgICAgICAgQ2xpY2sgaGVyZSB0byBsZWFybiBob3cgdGVtcGxhdGVzIGFuZCBkeW5hbWljIHpvbmVzIHdvcmtcbiAgICAgICAgICAgICAgICA8L1R5cG9ncmFwaHk+XG4gICAgICAgICAgICA8L0luZm8+XG4gICAgICAgIDwvQWRkVGVtcGxhdGVCdXR0b25Db250YWluZXI+XG4gICAgKTtcbn07XG5cbmV4cG9ydCBjb25zdCBBZGRUZW1wbGF0ZUljb24gPSAocHJvcHM6IEFkZFRlbXBsYXRlUHJvcHMpID0+IHtcbiAgICBjb25zdCB7IGFkZFRlbXBsYXRlLCBvblRlbXBsYXRlLCBzaG93VGVtcGxhdGVEaWFsb2csIG9uRGlhbG9nQ2xvc2UgfSA9IHVzZUFkZFRlbXBsYXRlKHtcbiAgICAgICAgb25UZW1wbGF0ZTogcHJvcHMub25UZW1wbGF0ZVxuICAgIH0pO1xuXG4gICAgcmV0dXJuIChcbiAgICAgICAgPEFkZFRlbXBsYXRlSWNvbkNvbnRhaW5lcj5cbiAgICAgICAgICAgIHtzaG93VGVtcGxhdGVEaWFsb2cgPyAoXG4gICAgICAgICAgICAgICAgPFRlbXBsYXRlRGlhbG9nIG9uVGVtcGxhdGU9e29uVGVtcGxhdGV9IG9uQ2xvc2U9e29uRGlhbG9nQ2xvc2V9IC8+XG4gICAgICAgICAgICApIDogbnVsbH1cbiAgICAgICAgICAgIDxJY29uQnV0dG9uIG9uQ2xpY2s9e2FkZFRlbXBsYXRlfSBpY29uPXs8QWRkSWNvbiAvPn0gLz5cbiAgICAgICAgPC9BZGRUZW1wbGF0ZUljb25Db250YWluZXI+XG4gICAgKTtcbn07XG4iXX0= */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-var Info = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e34m0te0"
-} : {
-  target: "e34m0te0",
-  label: "Info"
-})(process.env.NODE_ENV === "production" ? {
-  name: "u22e8l",
-  styles: "margin-top:8px;display:flex;justify-content:center;align-items:center;>svg{width:20px;margin-right:5px;}"
-} : {
-  name: "u22e8l",
-  styles: "margin-top:8px;display:flex;justify-content:center;align-items:center;>svg{width:20px;margin-right:5px;}",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkFkZFRlbXBsYXRlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE0QnVCIiwiZmlsZSI6IkFkZFRlbXBsYXRlLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwgeyB1c2VTdGF0ZSB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBDbXNEeW5hbWljWm9uZVRlbXBsYXRlIH0gZnJvbSBcIn4vdHlwZXNcIjtcbmltcG9ydCB7IEJ1dHRvblNlY29uZGFyeSwgSWNvbkJ1dHRvbiB9IGZyb20gXCJAd2ViaW55L3VpL0J1dHRvblwiO1xuaW1wb3J0IHsgVGVtcGxhdGVEaWFsb2cgfSBmcm9tIFwiLi9UZW1wbGF0ZURpYWxvZ1wiO1xuaW1wb3J0IHsgVHlwb2dyYXBoeSB9IGZyb20gXCJAd2ViaW55L3VpL1R5cG9ncmFwaHlcIjtcbmltcG9ydCB7IFJlYWN0Q29tcG9uZW50IGFzIEluZm9JY29uIH0gZnJvbSBcIkBtYXRlcmlhbC1kZXNpZ24taWNvbnMvc3ZnL291dGxpbmVkL2luZm8uc3ZnXCI7XG5pbXBvcnQgeyBSZWFjdENvbXBvbmVudCBhcyBBZGRJY29uIH0gZnJvbSBcIkBtYXRlcmlhbC1kZXNpZ24taWNvbnMvc3ZnL3JvdW5kL2FkZF9jaXJjbGVfb3V0bGluZS5zdmdcIjtcbmltcG9ydCB7IEVsZXZhdGlvbiB9IGZyb20gXCJAd2ViaW55L3VpL0VsZXZhdGlvblwiO1xuXG5jb25zdCBBZGRUZW1wbGF0ZUJ1dHRvbkNvbnRhaW5lciA9IHN0eWxlZChFbGV2YXRpb24pYFxuICAgIHBhZGRpbmc6IDI1cHggMCAyMHB4O1xuICAgIHRleHQtYWxpZ246IGNlbnRlcjtcbmA7XG5cbi8qKlxuICogVGhpcyBoYWNraW5nIGlzIG5lZWRlZCB0byBwb3NpdGlvbiB0aGUgYnV0dG9uIGV4YWN0bHkgaW4gdGhlIG1pZGRsZSBvZiBhdmFpbGFibGUgYXJlYSBhbmQgbm90IHN0cmV0Y2ggdGhlIHBhcmVudCBlbGVtZW50LlxuICovXG5jb25zdCBBZGRUZW1wbGF0ZUljb25Db250YWluZXIgPSBzdHlsZWQuZGl2YFxuICAgIHRleHQtYWxpZ246IGNlbnRlcjtcbiAgICBoZWlnaHQ6IDM2cHg7XG5cbiAgICA+IGJ1dHRvbiB7XG4gICAgICAgIG1hcmdpbi1sZWZ0OiAtMjRweDtcbiAgICAgICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgIH1cbmA7XG5cbmNvbnN0IEluZm8gPSBzdHlsZWQuZGl2YFxuICAgIG1hcmdpbi10b3A6IDhweDtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5cbiAgICA+IHN2ZyB7XG4gICAgICAgIHdpZHRoOiAyMHB4O1xuICAgICAgICBtYXJnaW4tcmlnaHQ6IDVweDtcbiAgICB9XG5gO1xuXG5pbnRlcmZhY2UgQWRkVGVtcGxhdGVQcm9wcyB7XG4gICAgb25UZW1wbGF0ZTogVXNlQWRkVGVtcGxhdGVQYXJhbXNbXCJvblRlbXBsYXRlXCJdO1xufVxuXG5pbnRlcmZhY2UgVXNlQWRkVGVtcGxhdGVQYXJhbXMge1xuICAgIG9uVGVtcGxhdGU6ICh0ZW1wbGF0ZTogQ21zRHluYW1pY1pvbmVUZW1wbGF0ZSkgPT4gdm9pZDtcbn1cblxuZnVuY3Rpb24gdXNlQWRkVGVtcGxhdGUocGFyYW1zOiBVc2VBZGRUZW1wbGF0ZVBhcmFtcykge1xuICAgIGNvbnN0IFtzaG93VGVtcGxhdGVEaWFsb2csIHNldFNob3dUZW1wbGF0ZURpYWxvZ10gPSB1c2VTdGF0ZShmYWxzZSk7XG5cbiAgICBjb25zdCBhZGRUZW1wbGF0ZSA9ICgpID0+IHtcbiAgICAgICAgc2V0U2hvd1RlbXBsYXRlRGlhbG9nKHRydWUpO1xuICAgIH07XG5cbiAgICBjb25zdCBvblRlbXBsYXRlID0gKHRlbXBsYXRlOiBDbXNEeW5hbWljWm9uZVRlbXBsYXRlKSA9PiB7XG4gICAgICAgIHBhcmFtcy5vblRlbXBsYXRlKHRlbXBsYXRlKTtcbiAgICB9O1xuXG4gICAgY29uc3Qgb25EaWFsb2dDbG9zZSA9ICgpID0+IHtcbiAgICAgICAgc2V0U2hvd1RlbXBsYXRlRGlhbG9nKGZhbHNlKTtcbiAgICB9O1xuXG4gICAgcmV0dXJuIHtcbiAgICAgICAgYWRkVGVtcGxhdGUsXG4gICAgICAgIG9uVGVtcGxhdGUsXG4gICAgICAgIG9uRGlhbG9nQ2xvc2UsXG4gICAgICAgIHNob3dUZW1wbGF0ZURpYWxvZ1xuICAgIH07XG59XG5cbmV4cG9ydCBjb25zdCBBZGRUZW1wbGF0ZUJ1dHRvbiA9IChwcm9wczogQWRkVGVtcGxhdGVQcm9wcykgPT4ge1xuICAgIGNvbnN0IHsgYWRkVGVtcGxhdGUsIG9uVGVtcGxhdGUsIHNob3dUZW1wbGF0ZURpYWxvZywgb25EaWFsb2dDbG9zZSB9ID0gdXNlQWRkVGVtcGxhdGUoe1xuICAgICAgICBvblRlbXBsYXRlOiBwcm9wcy5vblRlbXBsYXRlXG4gICAgfSk7XG5cbiAgICByZXR1cm4gKFxuICAgICAgICA8QWRkVGVtcGxhdGVCdXR0b25Db250YWluZXIgej17Mn0+XG4gICAgICAgICAgICB7c2hvd1RlbXBsYXRlRGlhbG9nID8gKFxuICAgICAgICAgICAgICAgIDxUZW1wbGF0ZURpYWxvZyBvblRlbXBsYXRlPXtvblRlbXBsYXRlfSBvbkNsb3NlPXtvbkRpYWxvZ0Nsb3NlfSAvPlxuICAgICAgICAgICAgKSA6IG51bGx9XG4gICAgICAgICAgICA8QnV0dG9uU2Vjb25kYXJ5IG9uQ2xpY2s9e2FkZFRlbXBsYXRlfT4rIEFkZCBhIHRlbXBsYXRlPC9CdXR0b25TZWNvbmRhcnk+XG4gICAgICAgICAgICA8SW5mbz5cbiAgICAgICAgICAgICAgICA8SW5mb0ljb24gLz5cbiAgICAgICAgICAgICAgICA8VHlwb2dyYXBoeSB1c2U9e1wiY2FwdGlvblwifT5cbiAgICAgICAgICAgICAgICAgICAgQ2xpY2sgaGVyZSB0byBsZWFybiBob3cgdGVtcGxhdGVzIGFuZCBkeW5hbWljIHpvbmVzIHdvcmtcbiAgICAgICAgICAgICAgICA8L1R5cG9ncmFwaHk+XG4gICAgICAgICAgICA8L0luZm8+XG4gICAgICAgIDwvQWRkVGVtcGxhdGVCdXR0b25Db250YWluZXI+XG4gICAgKTtcbn07XG5cbmV4cG9ydCBjb25zdCBBZGRUZW1wbGF0ZUljb24gPSAocHJvcHM6IEFkZFRlbXBsYXRlUHJvcHMpID0+IHtcbiAgICBjb25zdCB7IGFkZFRlbXBsYXRlLCBvblRlbXBsYXRlLCBzaG93VGVtcGxhdGVEaWFsb2csIG9uRGlhbG9nQ2xvc2UgfSA9IHVzZUFkZFRlbXBsYXRlKHtcbiAgICAgICAgb25UZW1wbGF0ZTogcHJvcHMub25UZW1wbGF0ZVxuICAgIH0pO1xuXG4gICAgcmV0dXJuIChcbiAgICAgICAgPEFkZFRlbXBsYXRlSWNvbkNvbnRhaW5lcj5cbiAgICAgICAgICAgIHtzaG93VGVtcGxhdGVEaWFsb2cgPyAoXG4gICAgICAgICAgICAgICAgPFRlbXBsYXRlRGlhbG9nIG9uVGVtcGxhdGU9e29uVGVtcGxhdGV9IG9uQ2xvc2U9e29uRGlhbG9nQ2xvc2V9IC8+XG4gICAgICAgICAgICApIDogbnVsbH1cbiAgICAgICAgICAgIDxJY29uQnV0dG9uIG9uQ2xpY2s9e2FkZFRlbXBsYXRlfSBpY29uPXs8QWRkSWNvbiAvPn0gLz5cbiAgICAgICAgPC9BZGRUZW1wbGF0ZUljb25Db250YWluZXI+XG4gICAgKTtcbn07XG4iXX0= */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
+import React, { useState } from "react";
+import { TemplateDialog } from "./TemplateDialog";
+import { ReactComponent as AddIcon } from "@webiny/icons/add.svg";
+import { ReactComponent as AddCircleIcon } from "@webiny/icons/add_circle_outline.svg";
+import { Button, Text, IconButton, Link, Tooltip } from "@webiny/admin-ui";
 function useAddTemplate(params) {
-  var _useState = (0, _react.useState)(false),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    showTemplateDialog = _useState2[0],
-    setShowTemplateDialog = _useState2[1];
-  var addTemplate = function addTemplate() {
+  const [showTemplateDialog, setShowTemplateDialog] = useState(false);
+  const addTemplate = () => {
     setShowTemplateDialog(true);
   };
-  var onTemplate = function onTemplate(template) {
+  const onTemplate = template => {
     params.onTemplate(template);
   };
-  var onDialogClose = function onDialogClose() {
+  const onDialogClose = () => {
     setShowTemplateDialog(false);
   };
   return {
-    addTemplate: addTemplate,
-    onTemplate: onTemplate,
-    onDialogClose: onDialogClose,
-    showTemplateDialog: showTemplateDialog
+    addTemplate,
+    onTemplate,
+    onDialogClose,
+    showTemplateDialog
   };
 }
-var AddTemplateButton = exports.AddTemplateButton = function AddTemplateButton(props) {
-  var _useAddTemplate = useAddTemplate({
-      onTemplate: props.onTemplate
-    }),
-    addTemplate = _useAddTemplate.addTemplate,
-    onTemplate = _useAddTemplate.onTemplate,
-    showTemplateDialog = _useAddTemplate.showTemplateDialog,
-    onDialogClose = _useAddTemplate.onDialogClose;
-  return /*#__PURE__*/_react.default.createElement(AddTemplateButtonContainer, {
-    z: 2
-  }, showTemplateDialog ? /*#__PURE__*/_react.default.createElement(_TemplateDialog.TemplateDialog, {
+export const AddTemplateButton = props => {
+  const {
+    addTemplate,
+    onTemplate,
+    showTemplateDialog,
+    onDialogClose
+  } = useAddTemplate({
+    onTemplate: props.onTemplate
+  });
+  return /*#__PURE__*/React.createElement("div", {
+    className: "wby-flex wby-flex-col wby-px-xl wby-pt-xl wby-pb-lg wby-gap-sm wby-border-sm wby-border-neutral-muted wby-rounded"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "wby-w-full wby-text-center"
+  }, showTemplateDialog ? /*#__PURE__*/React.createElement(TemplateDialog, {
     onTemplate: onTemplate,
     onClose: onDialogClose
-  }) : null, /*#__PURE__*/_react.default.createElement(_Button.ButtonSecondary, {
-    onClick: addTemplate
-  }, "+ Add a template"), /*#__PURE__*/_react.default.createElement(Info, null, /*#__PURE__*/_react.default.createElement(_info.ReactComponent, null), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
-    use: "caption"
-  }, "Click here to learn how templates and dynamic zones work")));
+  }) : null, /*#__PURE__*/React.createElement(Button, {
+    size: "sm",
+    variant: "secondary",
+    onClick: addTemplate,
+    text: "Add template",
+    icon: /*#__PURE__*/React.createElement(AddIcon, null)
+  })), /*#__PURE__*/React.createElement("div", {
+    className: "wby-flex wby-items-center wby-justify-center wby-gap-xs wby-w-full wby-mx-auto wby-text-center"
+  }, /*#__PURE__*/React.createElement(Text, {
+    size: "sm",
+    className: "wby-text-neutral-strong"
+  }, /*#__PURE__*/React.createElement(Link, {
+    to: "http://webiny.link/admin/how-to-use/dynamic-zones",
+    target: "_blank"
+  }, "Learn how"), " ", "templates and dynamic zones work.")));
 };
-var AddTemplateIcon = exports.AddTemplateIcon = function AddTemplateIcon(props) {
-  var _useAddTemplate2 = useAddTemplate({
-      onTemplate: props.onTemplate
-    }),
-    addTemplate = _useAddTemplate2.addTemplate,
-    onTemplate = _useAddTemplate2.onTemplate,
-    showTemplateDialog = _useAddTemplate2.showTemplateDialog,
-    onDialogClose = _useAddTemplate2.onDialogClose;
-  return /*#__PURE__*/_react.default.createElement(AddTemplateIconContainer, null, showTemplateDialog ? /*#__PURE__*/_react.default.createElement(_TemplateDialog.TemplateDialog, {
+export const AddTemplateIcon = props => {
+  const {
+    addTemplate,
+    onTemplate,
+    showTemplateDialog,
+    onDialogClose
+  } = useAddTemplate({
+    onTemplate: props.onTemplate
+  });
+  return /*#__PURE__*/React.createElement("div", {
+    className: "wby-w-full wby-text-center wby-mt-md"
+  }, showTemplateDialog ? /*#__PURE__*/React.createElement(TemplateDialog, {
     onTemplate: onTemplate,
     onClose: onDialogClose
-  }) : null, /*#__PURE__*/_react.default.createElement(_Button.IconButton, {
-    onClick: addTemplate,
-    icon: /*#__PURE__*/_react.default.createElement(_add_circle_outline.ReactComponent, null)
+  }) : null, /*#__PURE__*/React.createElement(Tooltip, {
+    content: "Add template",
+    trigger: /*#__PURE__*/React.createElement(IconButton, {
+      onClick: addTemplate,
+      icon: /*#__PURE__*/React.createElement(AddCircleIcon, null),
+      size: "lg",
+      variant: "ghost"
+    })
   }));
 };