@webiny/app-headless-cms-common 5.43.3 → 6.0.0-alpha.1

package/Fields/ErrorBoundary.d.ts

@@ -1,4 +1,5 @@
-import React, { ErrorInfo } from "react";
+import type { ErrorInfo } from "react";
+import React from "react";
 import type { CmsModelField } from "../types";
 type State = {
     hasError: true;

package/Fields/ErrorBoundary.js

@@ -1,60 +1,40 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ErrorBoundary = void 0;
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _callSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/callSuper"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _react = _interopRequireDefault(require("react"));
-var _FieldElementError = require("./FieldElementError");
-var ErrorBoundary = exports.ErrorBoundary = /*#__PURE__*/function (_React$Component) {
-  function ErrorBoundary(props) {
-    var _this;
-    (0, _classCallCheck2.default)(this, ErrorBoundary);
-    _this = (0, _callSuper2.default)(this, ErrorBoundary, [props]);
-    _this.state = {
+import React from "react";
+import { FieldElementError } from "./FieldElementError";
+export class ErrorBoundary extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
       hasError: false,
       error: undefined
     };
-    return _this;
   }
-  (0, _inherits2.default)(ErrorBoundary, _React$Component);
-  return (0, _createClass2.default)(ErrorBoundary, [{
-    key: "componentDidCatch",
-    value: function componentDidCatch(error, errorInfo) {
-      var field = this.props.field;
-      if (!field) {
-        return;
-      }
-      console.groupCollapsed("%cFIELD ERROR%c: An error occurred while rendering model field \"".concat(field.fieldId, "\" (").concat(field.id, ") of type \"").concat(field.type, "\"."), "color:red", "color:default");
-      console.log("Field definition", field);
-      console.error(error, errorInfo);
-      console.groupEnd();
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      if (this.state.hasError) {
-        return /*#__PURE__*/_react.default.createElement(_FieldElementError.FieldElementError, {
-          title: "Error: ".concat(this.state.error.message),
-          description: "See developer console for more details."
-        });
-      }
-      return this.props.children;
+  static getDerivedStateFromError(error) {
+    return {
+      hasError: true,
+      error
+    };
+  }
+  componentDidCatch(error, errorInfo) {
+    const {
+      field
+    } = this.props;
+    if (!field) {
+      return;
     }
-  }], [{
-    key: "getDerivedStateFromError",
-    value: function getDerivedStateFromError(error) {
-      return {
-        hasError: true,
-        error: error
-      };
+    console.groupCollapsed(`%cFIELD ERROR%c: An error occurred while rendering model field "${field.fieldId}" (${field.id}) of type "${field.type}".`, "color:red", "color:default");
+    console.log("Field definition", field);
+    console.error(error, errorInfo);
+    console.groupEnd();
+  }
+  render() {
+    if (this.state.hasError) {
+      return /*#__PURE__*/React.createElement(FieldElementError, {
+        title: `Error: ${this.state.error.message}`,
+        description: "See developer console for more details."
+      });
     }
-  }]);
-}(_react.default.Component);
+    return this.props.children;
+  }
+}
 
 //# sourceMappingURL=ErrorBoundary.js.map

package/Fields/ErrorBoundary.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_FieldElementError","ErrorBoundary","exports","_React$Component","props","_this","_classCallCheck2","default","_callSuper2","state","hasError","error","undefined","_inherits2","_createClass2","key","value","componentDidCatch","errorInfo","field","console","groupCollapsed","concat","fieldId","id","type","log","groupEnd","render","createElement","FieldElementError","title","message","description","children","getDerivedStateFromError","React","Component"],"sources":["ErrorBoundary.tsx"],"sourcesContent":["import React, { ErrorInfo } from \"react\";\nimport type { CmsModelField } from \"~/types\";\nimport { FieldElementError } from \"./FieldElementError\";\n\ntype State =\n    | {\n          hasError: true;\n          error: Error;\n      }\n    | { hasError: false; error: undefined };\n\ninterface Props {\n    field: CmsModelField;\n    [key: string]: any;\n}\n\nexport class ErrorBoundary extends React.Component<Props, State> {\n    constructor(props: Props) {\n        super(props);\n        this.state = {\n            hasError: false,\n            error: undefined\n        };\n    }\n\n    static getDerivedStateFromError(error: Error) {\n        return {\n            hasError: true,\n            error\n        };\n    }\n\n    public override componentDidCatch(error: Error, errorInfo: ErrorInfo) {\n        const { field } = this.props;\n        if (!field) {\n            return;\n        }\n        console.groupCollapsed(\n            `%cFIELD ERROR%c: An error occurred while rendering model field \"${field.fieldId}\" (${field.id}) of type \"${field.type}\".`,\n            \"color:red\",\n            \"color:default\"\n        );\n        console.log(\"Field definition\", field);\n        console.error(error, errorInfo);\n        console.groupEnd();\n    }\n\n    public override render() {\n        if (this.state.hasError) {\n            return (\n                <FieldElementError\n                    title={`Error: ${this.state.error.message}`}\n                    description={\"See developer console for more details.\"}\n                />\n            );\n        }\n\n        return this.props.children;\n    }\n}\n"],"mappings":";;;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,kBAAA,GAAAD,OAAA;AAAwD,IAc3CE,aAAa,GAAAC,OAAA,CAAAD,aAAA,0BAAAE,gBAAA;EACtB,SAAAF,cAAYG,KAAY,EAAE;IAAA,IAAAC,KAAA;IAAA,IAAAC,gBAAA,CAAAC,OAAA,QAAAN,aAAA;IACtBI,KAAA,OAAAG,WAAA,CAAAD,OAAA,QAAAN,aAAA,GAAMG,KAAK;IACXC,KAAA,CAAKI,KAAK,GAAG;MACTC,QAAQ,EAAE,KAAK;MACfC,KAAK,EAAEC;IACX,CAAC;IAAC,OAAAP,KAAA;EACN;EAAC,IAAAQ,UAAA,CAAAN,OAAA,EAAAN,aAAA,EAAAE,gBAAA;EAAA,WAAAW,aAAA,CAAAP,OAAA,EAAAN,aAAA;IAAAc,GAAA;IAAAC,KAAA,EASD,SAAgBC,iBAAiBA,CAACN,KAAY,EAAEO,SAAoB,EAAE;MAClE,IAAQC,KAAK,GAAK,IAAI,CAACf,KAAK,CAApBe,KAAK;MACb,IAAI,CAACA,KAAK,EAAE;QACR;MACJ;MACAC,OAAO,CAACC,cAAc,qEAAAC,MAAA,CACiDH,KAAK,CAACI,OAAO,UAAAD,MAAA,CAAMH,KAAK,CAACK,EAAE,kBAAAF,MAAA,CAAcH,KAAK,CAACM,IAAI,UACtH,WAAW,EACX,eACJ,CAAC;MACDL,OAAO,CAACM,GAAG,CAAC,kBAAkB,EAAEP,KAAK,CAAC;MACtCC,OAAO,CAACT,KAAK,CAACA,KAAK,EAAEO,SAAS,CAAC;MAC/BE,OAAO,CAACO,QAAQ,CAAC,CAAC;IACtB;EAAC;IAAAZ,GAAA;IAAAC,KAAA,EAED,SAAgBY,MAAMA,CAAA,EAAG;MACrB,IAAI,IAAI,CAACnB,KAAK,CAACC,QAAQ,EAAE;QACrB,oBACIb,MAAA,CAAAU,OAAA,CAAAsB,aAAA,CAAC7B,kBAAA,CAAA8B,iBAAiB;UACdC,KAAK,YAAAT,MAAA,CAAY,IAAI,CAACb,KAAK,CAACE,KAAK,CAACqB,OAAO,CAAG;UAC5CC,WAAW,EAAE;QAA0C,CAC1D,CAAC;MAEV;MAEA,OAAO,IAAI,CAAC7B,KAAK,CAAC8B,QAAQ;IAC9B;EAAC;IAAAnB,GAAA;IAAAC,KAAA,EAjCD,SAAOmB,wBAAwBA,CAACxB,KAAY,EAAE;MAC1C,OAAO;QACHD,QAAQ,EAAE,IAAI;QACdC,KAAK,EAALA;MACJ,CAAC;IACL;EAAC;AAAA,EAd8ByB,cAAK,CAACC,SAAS","ignoreList":[]}
+{"version":3,"names":["React","FieldElementError","ErrorBoundary","Component","constructor","props","state","hasError","error","undefined","getDerivedStateFromError","componentDidCatch","errorInfo","field","console","groupCollapsed","fieldId","id","type","log","groupEnd","render","createElement","title","message","description","children"],"sources":["ErrorBoundary.tsx"],"sourcesContent":["import type { ErrorInfo } from \"react\";\nimport React from \"react\";\nimport type { CmsModelField } from \"~/types\";\nimport { FieldElementError } from \"./FieldElementError\";\n\ntype State =\n    | {\n          hasError: true;\n          error: Error;\n      }\n    | { hasError: false; error: undefined };\n\ninterface Props {\n    field: CmsModelField;\n    [key: string]: any;\n}\n\nexport class ErrorBoundary extends React.Component<Props, State> {\n    constructor(props: Props) {\n        super(props);\n        this.state = {\n            hasError: false,\n            error: undefined\n        };\n    }\n\n    static getDerivedStateFromError(error: Error) {\n        return {\n            hasError: true,\n            error\n        };\n    }\n\n    public override componentDidCatch(error: Error, errorInfo: ErrorInfo) {\n        const { field } = this.props;\n        if (!field) {\n            return;\n        }\n        console.groupCollapsed(\n            `%cFIELD ERROR%c: An error occurred while rendering model field \"${field.fieldId}\" (${field.id}) of type \"${field.type}\".`,\n            \"color:red\",\n            \"color:default\"\n        );\n        console.log(\"Field definition\", field);\n        console.error(error, errorInfo);\n        console.groupEnd();\n    }\n\n    public override render() {\n        if (this.state.hasError) {\n            return (\n                <FieldElementError\n                    title={`Error: ${this.state.error.message}`}\n                    description={\"See developer console for more details.\"}\n                />\n            );\n        }\n\n        return this.props.children;\n    }\n}\n"],"mappings":"AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,iBAAiB;AAc1B,OAAO,MAAMC,aAAa,SAASF,KAAK,CAACG,SAAS,CAAe;EAC7DC,WAAWA,CAACC,KAAY,EAAE;IACtB,KAAK,CAACA,KAAK,CAAC;IACZ,IAAI,CAACC,KAAK,GAAG;MACTC,QAAQ,EAAE,KAAK;MACfC,KAAK,EAAEC;IACX,CAAC;EACL;EAEA,OAAOC,wBAAwBA,CAACF,KAAY,EAAE;IAC1C,OAAO;MACHD,QAAQ,EAAE,IAAI;MACdC;IACJ,CAAC;EACL;EAEgBG,iBAAiBA,CAACH,KAAY,EAAEI,SAAoB,EAAE;IAClE,MAAM;MAAEC;IAAM,CAAC,GAAG,IAAI,CAACR,KAAK;IAC5B,IAAI,CAACQ,KAAK,EAAE;MACR;IACJ;IACAC,OAAO,CAACC,cAAc,CAClB,mEAAmEF,KAAK,CAACG,OAAO,MAAMH,KAAK,CAACI,EAAE,cAAcJ,KAAK,CAACK,IAAI,IAAI,EAC1H,WAAW,EACX,eACJ,CAAC;IACDJ,OAAO,CAACK,GAAG,CAAC,kBAAkB,EAAEN,KAAK,CAAC;IACtCC,OAAO,CAACN,KAAK,CAACA,KAAK,EAAEI,SAAS,CAAC;IAC/BE,OAAO,CAACM,QAAQ,CAAC,CAAC;EACtB;EAEgBC,MAAMA,CAAA,EAAG;IACrB,IAAI,IAAI,CAACf,KAAK,CAACC,QAAQ,EAAE;MACrB,oBACIP,KAAA,CAAAsB,aAAA,CAACrB,iBAAiB;QACdsB,KAAK,EAAE,UAAU,IAAI,CAACjB,KAAK,CAACE,KAAK,CAACgB,OAAO,EAAG;QAC5CC,WAAW,EAAE;MAA0C,CAC1D,CAAC;IAEV;IAEA,OAAO,IAAI,CAACpB,KAAK,CAACqB,QAAQ;EAC9B;AACJ","ignoreList":[]}

package/Fields/FieldElement.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { CmsModelField, CmsEditorContentModel, BindComponent } from "../types";
+import type { CmsModelField, CmsEditorContentModel, BindComponent } from "../types";
 declare global {
     namespace JSX {
         interface IntrinsicElements {

package/Fields/FieldElement.js

@@ -1,77 +1,68 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.RenderFieldElement = exports.FieldElement = void 0;
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _react = _interopRequireDefault(require("react"));
-var _get = _interopRequireDefault(require("lodash/get"));
-var _appAdmin = require("@webiny/app-admin");
-var _i18n = require("@webiny/app/i18n");
-var _Label = _interopRequireDefault(require("./Label"));
-var _useBind = require("./useBind");
-var _useRenderPlugins = require("./useRenderPlugins");
-var _ModelFieldProvider = require("../ModelFieldProvider");
-var _ErrorBoundary = require("./ErrorBoundary");
-var _excluded = ["field"];
-var _templateObject;
-var t = _i18n.i18n.ns("app-headless-cms/admin/components/content-form");
-var RenderField = function RenderField(props) {
-  var renderPlugins = (0, _useRenderPlugins.useRenderPlugins)();
-  var Bind = props.Bind,
-    contentModel = props.contentModel;
-  var _useModelField = (0, _ModelFieldProvider.useModelField)(),
-    field = _useModelField.field;
-  var getBind = (0, _useBind.useBind)({
-    Bind: Bind
+import React from "react";
+import get from "lodash/get";
+import { makeDecoratable } from "@webiny/app-admin";
+import { i18n } from "@webiny/app/i18n";
+import Label from "./Label";
+import { useBind } from "./useBind";
+import { useRenderPlugins } from "./useRenderPlugins";
+import { ModelFieldProvider, useModelField } from "../ModelFieldProvider";
+import { ErrorBoundary } from "./ErrorBoundary";
+const t = i18n.ns("app-headless-cms/admin/components/content-form");
+const RenderField = props => {
+  const renderPlugins = useRenderPlugins();
+  const {
+    Bind,
+    contentModel
+  } = props;
+  const {
+    field
+  } = useModelField();
+  const getBind = useBind({
+    Bind
   });
   if (typeof field.renderer === "function") {
-    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, field.renderer({
-      field: field,
-      getBind: getBind,
-      Label: _Label.default,
-      contentModel: contentModel
+    return /*#__PURE__*/React.createElement(React.Fragment, null, field.renderer({
+      field,
+      getBind,
+      Label,
+      contentModel
     }));
   }
-  var renderPlugin = renderPlugins.find(function (plugin) {
-    return plugin.renderer.rendererName === (0, _get.default)(field, "renderer.name");
-  });
+  const renderPlugin = renderPlugins.find(plugin => plugin.renderer.rendererName === get(field, "renderer.name"));
   if (!renderPlugin) {
-    return t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Cannot render \"{fieldName}\" field - field renderer missing."])))({
-      fieldName: /*#__PURE__*/_react.default.createElement("strong", null, field.fieldId)
+    return t`Cannot render "{fieldName}" field - field renderer missing.`({
+      fieldName: /*#__PURE__*/React.createElement("strong", null, field.fieldId)
     });
   }
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, renderPlugin.renderer.render({
-    field: field,
-    getBind: getBind,
-    Label: _Label.default,
-    contentModel: contentModel
+  return /*#__PURE__*/React.createElement(React.Fragment, null, renderPlugin.renderer.render({
+    field,
+    getBind,
+    Label,
+    contentModel
   }));
 };
-var FieldElement = exports.FieldElement = (0, _appAdmin.makeDecoratable)("FieldElement", function (_ref) {
-  var field = _ref.field,
-    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+export const FieldElement = makeDecoratable("FieldElement", ({
+  field,
+  ...props
+}) => {
   if (!field) {
     return null;
   }
-  return /*#__PURE__*/_react.default.createElement("hcms-model-field", {
+  return /*#__PURE__*/React.createElement("hcms-model-field", {
     "data-id": field.id,
     "data-field-id": field.fieldId,
     "data-type": field.type
-  }, /*#__PURE__*/_react.default.createElement(_ErrorBoundary.ErrorBoundary, {
+  }, /*#__PURE__*/React.createElement(ErrorBoundary, {
     field: field
-  }, /*#__PURE__*/_react.default.createElement(_ModelFieldProvider.ModelFieldProvider, {
+  }, /*#__PURE__*/React.createElement(ModelFieldProvider, {
     field: field
-  }, /*#__PURE__*/_react.default.createElement(RenderField, props))));
+  }, /*#__PURE__*/React.createElement(RenderField, props))));
 });
 
 /**
  * @deprecated Use `FieldElement` instead.
  */
-var RenderFieldElement = exports.RenderFieldElement = FieldElement;
+export const RenderFieldElement = FieldElement;
 
 /**
  * @deprecated Use `FieldElementProps` instead.

package/Fields/FieldElement.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_get","_appAdmin","_i18n","_Label","_useBind","_useRenderPlugins","_ModelFieldProvider","_ErrorBoundary","_excluded","_templateObject","t","i18n","ns","RenderField","props","renderPlugins","useRenderPlugins","Bind","contentModel","_useModelField","useModelField","field","getBind","useBind","renderer","default","createElement","Fragment","Label","renderPlugin","find","plugin","rendererName","get","_taggedTemplateLiteral2","fieldName","fieldId","render","FieldElement","exports","makeDecoratable","_ref","_objectWithoutProperties2","id","type","ErrorBoundary","ModelFieldProvider","RenderFieldElement"],"sources":["FieldElement.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get\";\nimport { makeDecoratable } from \"@webiny/app-admin\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport Label from \"./Label\";\nimport { useBind } from \"./useBind\";\nimport { useRenderPlugins } from \"./useRenderPlugins\";\nimport { ModelFieldProvider, useModelField } from \"../ModelFieldProvider\";\nimport { CmsModelField, CmsEditorContentModel, BindComponent } from \"~/types\";\nimport { ErrorBoundary } from \"./ErrorBoundary\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/components/content-form\");\n\ndeclare global {\n    // eslint-disable-next-line\n    namespace JSX {\n        interface IntrinsicElements {\n            \"hcms-model-field\": {\n                \"data-id\": string;\n                \"data-type\": string;\n                \"data-field-id\": string;\n                children: React.ReactNode;\n            };\n        }\n    }\n}\n\ntype RenderFieldProps = Omit<FieldElementProps, \"field\">;\n\nconst RenderField = (props: RenderFieldProps) => {\n    const renderPlugins = useRenderPlugins();\n    const { Bind, contentModel } = props;\n    const { field } = useModelField();\n    const getBind = useBind({ Bind });\n\n    if (typeof field.renderer === \"function\") {\n        return <>{field.renderer({ field, getBind, Label, contentModel })}</>;\n    }\n\n    const renderPlugin = renderPlugins.find(\n        plugin => plugin.renderer.rendererName === get(field, \"renderer.name\")\n    );\n\n    if (!renderPlugin) {\n        return t`Cannot render \"{fieldName}\" field - field renderer missing.`({\n            fieldName: <strong>{field.fieldId}</strong>\n        });\n    }\n\n    return <>{renderPlugin.renderer.render({ field, getBind, Label, contentModel })}</>;\n};\n\nexport interface FieldElementProps {\n    field: CmsModelField;\n    Bind: BindComponent;\n    contentModel: CmsEditorContentModel;\n}\n\nexport const FieldElement = makeDecoratable(\n    \"FieldElement\",\n    ({ field, ...props }: FieldElementProps) => {\n        if (!field) {\n            return null;\n        }\n\n        return (\n            <hcms-model-field\n                data-id={field.id}\n                data-field-id={field.fieldId}\n                data-type={field.type}\n            >\n                <ErrorBoundary field={field}>\n                    <ModelFieldProvider field={field}>\n                        <RenderField {...props} />\n                    </ModelFieldProvider>\n                </ErrorBoundary>\n            </hcms-model-field>\n        );\n    }\n);\n\n/**\n * @deprecated Use `FieldElement` instead.\n */\nexport const RenderFieldElement = FieldElement;\n\n/**\n * @deprecated Use `FieldElementProps` instead.\n */\nexport type RenderFieldElementProps = FieldElementProps;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","get","makeDecoratable","i18n","Label","useBind","useRenderPlugins","ModelFieldProvider","useModelField","ErrorBoundary","t","ns","RenderField","props","renderPlugins","Bind","contentModel","field","getBind","renderer","createElement","Fragment","renderPlugin","find","plugin","rendererName","fieldName","fieldId","render","FieldElement","id","type","RenderFieldElement"],"sources":["FieldElement.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get\";\nimport { makeDecoratable } from \"@webiny/app-admin\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport Label from \"./Label\";\nimport { useBind } from \"./useBind\";\nimport { useRenderPlugins } from \"./useRenderPlugins\";\nimport { ModelFieldProvider, useModelField } from \"../ModelFieldProvider\";\nimport type { CmsModelField, CmsEditorContentModel, BindComponent } from \"~/types\";\nimport { ErrorBoundary } from \"./ErrorBoundary\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/components/content-form\");\n\ndeclare global {\n    // eslint-disable-next-line\n    namespace JSX {\n        interface IntrinsicElements {\n            \"hcms-model-field\": {\n                \"data-id\": string;\n                \"data-type\": string;\n                \"data-field-id\": string;\n                children: React.ReactNode;\n            };\n        }\n    }\n}\n\ntype RenderFieldProps = Omit<FieldElementProps, \"field\">;\n\nconst RenderField = (props: RenderFieldProps) => {\n    const renderPlugins = useRenderPlugins();\n    const { Bind, contentModel } = props;\n    const { field } = useModelField();\n    const getBind = useBind({ Bind });\n\n    if (typeof field.renderer === \"function\") {\n        return <>{field.renderer({ field, getBind, Label, contentModel })}</>;\n    }\n\n    const renderPlugin = renderPlugins.find(\n        plugin => plugin.renderer.rendererName === get(field, \"renderer.name\")\n    );\n\n    if (!renderPlugin) {\n        return t`Cannot render \"{fieldName}\" field - field renderer missing.`({\n            fieldName: <strong>{field.fieldId}</strong>\n        });\n    }\n\n    return <>{renderPlugin.renderer.render({ field, getBind, Label, contentModel })}</>;\n};\n\nexport interface FieldElementProps {\n    field: CmsModelField;\n    Bind: BindComponent;\n    contentModel: CmsEditorContentModel;\n}\n\nexport const FieldElement = makeDecoratable(\n    \"FieldElement\",\n    ({ field, ...props }: FieldElementProps) => {\n        if (!field) {\n            return null;\n        }\n\n        return (\n            <hcms-model-field\n                data-id={field.id}\n                data-field-id={field.fieldId}\n                data-type={field.type}\n            >\n                <ErrorBoundary field={field}>\n                    <ModelFieldProvider field={field}>\n                        <RenderField {...props} />\n                    </ModelFieldProvider>\n                </ErrorBoundary>\n            </hcms-model-field>\n        );\n    }\n);\n\n/**\n * @deprecated Use `FieldElement` instead.\n */\nexport const RenderFieldElement = FieldElement;\n\n/**\n * @deprecated Use `FieldElementProps` instead.\n */\nexport type RenderFieldElementProps = FieldElementProps;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,GAAG,MAAM,YAAY;AAC5B,SAASC,eAAe,QAAQ,mBAAmB;AACnD,SAASC,IAAI,QAAQ,kBAAkB;AACvC,OAAOC,KAAK;AACZ,SAASC,OAAO;AAChB,SAASC,gBAAgB;AACzB,SAASC,kBAAkB,EAAEC,aAAa;AAE1C,SAASC,aAAa;AAEtB,MAAMC,CAAC,GAAGP,IAAI,CAACQ,EAAE,CAAC,gDAAgD,CAAC;AAkBnE,MAAMC,WAAW,GAAIC,KAAuB,IAAK;EAC7C,MAAMC,aAAa,GAAGR,gBAAgB,CAAC,CAAC;EACxC,MAAM;IAAES,IAAI;IAAEC;EAAa,CAAC,GAAGH,KAAK;EACpC,MAAM;IAAEI;EAAM,CAAC,GAAGT,aAAa,CAAC,CAAC;EACjC,MAAMU,OAAO,GAAGb,OAAO,CAAC;IAAEU;EAAK,CAAC,CAAC;EAEjC,IAAI,OAAOE,KAAK,CAACE,QAAQ,KAAK,UAAU,EAAE;IACtC,oBAAOnB,KAAA,CAAAoB,aAAA,CAAApB,KAAA,CAAAqB,QAAA,QAAGJ,KAAK,CAACE,QAAQ,CAAC;MAAEF,KAAK;MAAEC,OAAO;MAAEd,KAAK;MAAEY;IAAa,CAAC,CAAI,CAAC;EACzE;EAEA,MAAMM,YAAY,GAAGR,aAAa,CAACS,IAAI,CACnCC,MAAM,IAAIA,MAAM,CAACL,QAAQ,CAACM,YAAY,KAAKxB,GAAG,CAACgB,KAAK,EAAE,eAAe,CACzE,CAAC;EAED,IAAI,CAACK,YAAY,EAAE;IACf,OAAOZ,CAAC,6DAA6D,CAAC;MAClEgB,SAAS,eAAE1B,KAAA,CAAAoB,aAAA,iBAASH,KAAK,CAACU,OAAgB;IAC9C,CAAC,CAAC;EACN;EAEA,oBAAO3B,KAAA,CAAAoB,aAAA,CAAApB,KAAA,CAAAqB,QAAA,QAAGC,YAAY,CAACH,QAAQ,CAACS,MAAM,CAAC;IAAEX,KAAK;IAAEC,OAAO;IAAEd,KAAK;IAAEY;EAAa,CAAC,CAAI,CAAC;AACvF,CAAC;AAQD,OAAO,MAAMa,YAAY,GAAG3B,eAAe,CACvC,cAAc,EACd,CAAC;EAAEe,KAAK;EAAE,GAAGJ;AAAyB,CAAC,KAAK;EACxC,IAAI,CAACI,KAAK,EAAE;IACR,OAAO,IAAI;EACf;EAEA,oBACIjB,KAAA,CAAAoB,aAAA;IACI,WAASH,KAAK,CAACa,EAAG;IAClB,iBAAeb,KAAK,CAACU,OAAQ;IAC7B,aAAWV,KAAK,CAACc;EAAK,gBAEtB/B,KAAA,CAAAoB,aAAA,CAACX,aAAa;IAACQ,KAAK,EAAEA;EAAM,gBACxBjB,KAAA,CAAAoB,aAAA,CAACb,kBAAkB;IAACU,KAAK,EAAEA;EAAM,gBAC7BjB,KAAA,CAAAoB,aAAA,CAACR,WAAW,EAAKC,KAAQ,CACT,CACT,CACD,CAAC;AAE3B,CACJ,CAAC;;AAED;AACA;AACA;AACA,OAAO,MAAMmB,kBAAkB,GAAGH,YAAY;;AAE9C;AACA;AACA","ignoreList":[]}

package/Fields/FieldElementError.js

@@ -1,14 +1,7 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.FieldElementError = void 0;
-var _base = _interopRequireDefault(require("@emotion/styled/base"));
-var _react = _interopRequireDefault(require("react"));
+import _styled from "@emotion/styled/base";
 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 StyledError = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
+import React from "react";
+const StyledError = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
   target: "e11oiyxk0"
 } : {
   target: "e11oiyxk0",
@@ -22,12 +15,12 @@ var StyledError = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV ==
   map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZpZWxkRWxlbWVudEVycm9yLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFHOEIiLCJmaWxlIjoiRmllbGRFbGVtZW50RXJyb3IudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5cbmNvbnN0IFN0eWxlZEVycm9yID0gc3R5bGVkLmRpdmBcbiAgICBib3JkZXI6IDJweCBzb2xpZCByZWQ7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogI2Y4N2U3ZTtcbiAgICBib3JkZXItcmFkaXVzOiA1cHg7XG4gICAgcGFkZGluZzogNXB4IDEwcHg7XG5gO1xuXG5pbnRlcmZhY2UgRmllbGRFbGVtZW50RXJyb3JQcm9wcyB7XG4gICAgdGl0bGU6IHN0cmluZztcbiAgICBkZXNjcmlwdGlvbjogc3RyaW5nO1xufVxuXG5jb25zdCBzaG93RXJyb3IgPSBwcm9jZXNzLmVudi5OT0RFX0VOViA9PT0gXCJkZXZlbG9wbWVudFwiO1xuXG5leHBvcnQgY29uc3QgRmllbGRFbGVtZW50RXJyb3IgPSAocHJvcHM6IEZpZWxkRWxlbWVudEVycm9yUHJvcHMpID0+IHtcbiAgICBpZiAoIXNob3dFcnJvcikge1xuICAgICAgICByZXR1cm4gbnVsbDtcbiAgICB9XG5cbiAgICByZXR1cm4gKFxuICAgICAgICA8U3R5bGVkRXJyb3I+XG4gICAgICAgICAgICA8aDU+e3Byb3BzLnRpdGxlfTwvaDU+XG4gICAgICAgICAgICA8cD57cHJvcHMuZGVzY3JpcHRpb259PC9wPlxuICAgICAgICA8L1N0eWxlZEVycm9yPlxuICAgICk7XG59O1xuIl19 */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
-var showError = process.env.NODE_ENV === "development";
-var FieldElementError = exports.FieldElementError = function FieldElementError(props) {
+const showError = process.env.NODE_ENV === "development";
+export const FieldElementError = props => {
   if (!showError) {
     return null;
   }
-  return /*#__PURE__*/_react.default.createElement(StyledError, null, /*#__PURE__*/_react.default.createElement("h5", null, props.title), /*#__PURE__*/_react.default.createElement("p", null, props.description));
+  return /*#__PURE__*/React.createElement(StyledError, null, /*#__PURE__*/React.createElement("h5", null, props.title), /*#__PURE__*/React.createElement("p", null, props.description));
 };
 
 //# sourceMappingURL=FieldElementError.js.map

package/Fields/FieldElementError.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_EMOTION_STRINGIFIED_CSS_ERROR__","StyledError","_base","default","process","env","NODE_ENV","target","label","name","styles","map","toString","showError","FieldElementError","exports","props","createElement","title","description"],"sources":["FieldElementError.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\n\nconst StyledError = styled.div`\n    border: 2px solid red;\n    background-color: #f87e7e;\n    border-radius: 5px;\n    padding: 5px 10px;\n`;\n\ninterface FieldElementErrorProps {\n    title: string;\n    description: string;\n}\n\nconst showError = process.env.NODE_ENV === \"development\";\n\nexport const FieldElementError = (props: FieldElementErrorProps) => {\n    if (!showError) {\n        return null;\n    }\n\n    return (\n        <StyledError>\n            <h5>{props.title}</h5>\n            <p>{props.description}</p>\n        </StyledError>\n    );\n};\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAC,iCAAA;AAG1B,IAAMC,WAAW,oBAAAC,KAAA,CAAAC,OAAA,SAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,GAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAZ;AAAA,EAKhB;AAOD,IAAMa,SAAS,GAAGT,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,aAAa;AAEjD,IAAMQ,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAG,SAApBA,iBAAiBA,CAAIE,KAA6B,EAAK;EAChE,IAAI,CAACH,SAAS,EAAE;IACZ,OAAO,IAAI;EACf;EAEA,oBACIhB,MAAA,CAAAM,OAAA,CAAAc,aAAA,CAAChB,WAAW,qBACRJ,MAAA,CAAAM,OAAA,CAAAc,aAAA,aAAKD,KAAK,CAACE,KAAU,CAAC,eACtBrB,MAAA,CAAAM,OAAA,CAAAc,aAAA,YAAID,KAAK,CAACG,WAAe,CAChB,CAAC;AAEtB,CAAC","ignoreList":[]}
+{"version":3,"names":["React","StyledError","_styled","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","showError","FieldElementError","props","createElement","title","description"],"sources":["FieldElementError.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\n\nconst StyledError = styled.div`\n    border: 2px solid red;\n    background-color: #f87e7e;\n    border-radius: 5px;\n    padding: 5px 10px;\n`;\n\ninterface FieldElementErrorProps {\n    title: string;\n    description: string;\n}\n\nconst showError = process.env.NODE_ENV === \"development\";\n\nexport const FieldElementError = (props: FieldElementErrorProps) => {\n    if (!showError) {\n        return null;\n    }\n\n    return (\n        <StyledError>\n            <h5>{props.title}</h5>\n            <p>{props.description}</p>\n        </StyledError>\n    );\n};\n"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AAGzB,MAAMC,WAAW,gBAAAC,OAAA,QAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,GAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAC;AAAA,EAKhB;AAOD,MAAMC,SAAS,GAAGV,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,aAAa;AAExD,OAAO,MAAMS,iBAAiB,GAAIC,KAA6B,IAAK;EAChE,IAAI,CAACF,SAAS,EAAE;IACZ,OAAO,IAAI;EACf;EAEA,oBACIb,KAAA,CAAAgB,aAAA,CAACf,WAAW,qBACRD,KAAA,CAAAgB,aAAA,aAAKD,KAAK,CAACE,KAAU,CAAC,eACtBjB,KAAA,CAAAgB,aAAA,YAAID,KAAK,CAACG,WAAe,CAChB,CAAC;AAEtB,CAAC","ignoreList":[]}

package/Fields/Fields.js

@@ -1,45 +1,35 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Fields = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _Grid = require("@webiny/ui/Grid");
-var _FieldElement = require("./FieldElement");
-var _FieldElementError = require("./FieldElementError");
-var getFieldById = function getFieldById(fields, id) {
-  return fields.find(function (field) {
-    return field.id === id;
-  }) || null;
+import React from "react";
+import { Grid } from "@webiny/admin-ui";
+import { FieldElement } from "./FieldElement";
+import { FieldElementError } from "./FieldElementError";
+const getFieldById = (fields, id) => {
+  return fields.find(field => field.id === id) || null;
 };
-var Fields = exports.Fields = function Fields(_ref) {
-  var Bind = _ref.Bind,
-    fields = _ref.fields,
-    layout = _ref.layout,
-    contentModel = _ref.contentModel,
-    gridClassName = _ref.gridClassName;
-  return /*#__PURE__*/_react.default.createElement(_Grid.Grid, {
+export const Fields = ({
+  Bind,
+  fields,
+  layout,
+  contentModel,
+  gridClassName
+}) => {
+  return /*#__PURE__*/React.createElement(Grid, {
     className: gridClassName
-  }, layout.map(function (row, rowIndex) {
-    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, {
-      key: rowIndex
-    }, row.map(function (id) {
-      var field = getFieldById(fields, id);
-      return /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
-        span: Math.floor(12 / row.length),
-        key: id
-      }, field ? /*#__PURE__*/_react.default.createElement(_FieldElement.FieldElement, {
-        field: field,
-        Bind: Bind,
-        contentModel: contentModel
-      }) : /*#__PURE__*/_react.default.createElement(_FieldElementError.FieldElementError, {
-        title: "Missing field with id \"".concat(id, "\"!"),
-        description: "Make sure field layout contains the correct field ids (hint: check for typos)."
-      }));
+  }, layout.map((row, rowIndex) => /*#__PURE__*/React.createElement(React.Fragment, {
+    key: rowIndex
+  }, row.map(id => {
+    const field = getFieldById(fields, id);
+    return /*#__PURE__*/React.createElement(Grid.Column, {
+      span: Math.floor(12 / row.length),
+      key: id
+    }, field ? /*#__PURE__*/React.createElement(FieldElement, {
+      field: field,
+      Bind: Bind,
+      contentModel: contentModel
+    }) : /*#__PURE__*/React.createElement(FieldElementError, {
+      title: `Missing field with id "${id}"!`,
+      description: "Make sure field layout contains the correct field ids (hint: check for typos)."
     }));
-  }));
+  }))));
 };
 
 //# sourceMappingURL=Fields.js.map

package/Fields/Fields.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_Grid","_FieldElement","_FieldElementError","getFieldById","fields","id","find","field","Fields","exports","_ref","Bind","layout","contentModel","gridClassName","default","createElement","Grid","className","map","row","rowIndex","Fragment","key","Cell","span","Math","floor","length","FieldElement","FieldElementError","title","concat","description"],"sources":["Fields.tsx"],"sourcesContent":["import React from \"react\";\nimport { Cell, Grid } from \"@webiny/ui/Grid\";\nimport { FieldElement } from \"./FieldElement\";\nimport { FieldElementError } from \"./FieldElementError\";\nimport type {\n    CmsEditorContentModel,\n    CmsModelField,\n    CmsEditorFieldsLayout,\n    BindComponent\n} from \"~/types\";\n\ninterface FieldsProps {\n    Bind: BindComponent;\n    contentModel: CmsEditorContentModel;\n    fields: CmsModelField[];\n    layout: CmsEditorFieldsLayout;\n    gridClassName?: string;\n}\n\nconst getFieldById = (fields: CmsModelField[], id: string): CmsModelField | null => {\n    return fields.find(field => field.id === id) || null;\n};\n\nexport const Fields = ({ Bind, fields, layout, contentModel, gridClassName }: FieldsProps) => {\n    return (\n        <Grid className={gridClassName}>\n            {layout.map((row, rowIndex) => (\n                <React.Fragment key={rowIndex}>\n                    {row.map(id => {\n                        const field = getFieldById(fields, id) as CmsModelField;\n\n                        return (\n                            <Cell span={Math.floor(12 / row.length)} key={id}>\n                                {field ? (\n                                    <FieldElement\n                                        field={field}\n                                        Bind={Bind}\n                                        contentModel={contentModel}\n                                    />\n                                ) : (\n                                    <FieldElementError\n                                        title={`Missing field with id \"${id}\"!`}\n                                        description={\n                                            \"Make sure field layout contains the correct field ids (hint: check for typos).\"\n                                        }\n                                    />\n                                )}\n                            </Cell>\n                        );\n                    })}\n                </React.Fragment>\n            ))}\n        </Grid>\n    );\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,aAAA,GAAAF,OAAA;AACA,IAAAG,kBAAA,GAAAH,OAAA;AAgBA,IAAMI,YAAY,GAAG,SAAfA,YAAYA,CAAIC,MAAuB,EAAEC,EAAU,EAA2B;EAChF,OAAOD,MAAM,CAACE,IAAI,CAAC,UAAAC,KAAK;IAAA,OAAIA,KAAK,CAACF,EAAE,KAAKA,EAAE;EAAA,EAAC,IAAI,IAAI;AACxD,CAAC;AAEM,IAAMG,MAAM,GAAAC,OAAA,CAAAD,MAAA,GAAG,SAATA,MAAMA,CAAAE,IAAA,EAA2E;EAAA,IAArEC,IAAI,GAAAD,IAAA,CAAJC,IAAI;IAAEP,MAAM,GAAAM,IAAA,CAANN,MAAM;IAAEQ,MAAM,GAAAF,IAAA,CAANE,MAAM;IAAEC,YAAY,GAAAH,IAAA,CAAZG,YAAY;IAAEC,aAAa,GAAAJ,IAAA,CAAbI,aAAa;EACtE,oBACIjB,MAAA,CAAAkB,OAAA,CAAAC,aAAA,CAAChB,KAAA,CAAAiB,IAAI;IAACC,SAAS,EAAEJ;EAAc,GAC1BF,MAAM,CAACO,GAAG,CAAC,UAACC,GAAG,EAAEC,QAAQ;IAAA,oBACtBxB,MAAA,CAAAkB,OAAA,CAAAC,aAAA,CAACnB,MAAA,CAAAkB,OAAK,CAACO,QAAQ;MAACC,GAAG,EAAEF;IAAS,GACzBD,GAAG,CAACD,GAAG,CAAC,UAAAd,EAAE,EAAI;MACX,IAAME,KAAK,GAAGJ,YAAY,CAACC,MAAM,EAAEC,EAAE,CAAkB;MAEvD,oBACIR,MAAA,CAAAkB,OAAA,CAAAC,aAAA,CAAChB,KAAA,CAAAwB,IAAI;QAACC,IAAI,EAAEC,IAAI,CAACC,KAAK,CAAC,EAAE,GAAGP,GAAG,CAACQ,MAAM,CAAE;QAACL,GAAG,EAAElB;MAAG,GAC5CE,KAAK,gBACFV,MAAA,CAAAkB,OAAA,CAAAC,aAAA,CAACf,aAAA,CAAA4B,YAAY;QACTtB,KAAK,EAAEA,KAAM;QACbI,IAAI,EAAEA,IAAK;QACXE,YAAY,EAAEA;MAAa,CAC9B,CAAC,gBAEFhB,MAAA,CAAAkB,OAAA,CAAAC,aAAA,CAACd,kBAAA,CAAA4B,iBAAiB;QACdC,KAAK,6BAAAC,MAAA,CAA4B3B,EAAE,QAAK;QACxC4B,WAAW,EACP;MACH,CACJ,CAEH,CAAC;IAEf,CAAC,CACW,CAAC;EAAA,CACpB,CACC,CAAC;AAEf,CAAC","ignoreList":[]}
+{"version":3,"names":["React","Grid","FieldElement","FieldElementError","getFieldById","fields","id","find","field","Fields","Bind","layout","contentModel","gridClassName","createElement","className","map","row","rowIndex","Fragment","key","Column","span","Math","floor","length","title","description"],"sources":["Fields.tsx"],"sourcesContent":["import React from \"react\";\nimport { Grid, type ColumnProps } from \"@webiny/admin-ui\";\nimport { FieldElement } from \"./FieldElement\";\nimport { FieldElementError } from \"./FieldElementError\";\nimport type {\n    CmsEditorContentModel,\n    CmsModelField,\n    CmsEditorFieldsLayout,\n    BindComponent\n} from \"~/types\";\n\ninterface FieldsProps {\n    Bind: BindComponent;\n    contentModel: CmsEditorContentModel;\n    fields: CmsModelField[];\n    layout: CmsEditorFieldsLayout;\n    gridClassName?: string;\n}\n\nconst getFieldById = (fields: CmsModelField[], id: string): CmsModelField | null => {\n    return fields.find(field => field.id === id) || null;\n};\n\nexport const Fields = ({ Bind, fields, layout, contentModel, gridClassName }: FieldsProps) => {\n    return (\n        <Grid className={gridClassName}>\n            {layout.map((row, rowIndex) => (\n                <React.Fragment key={rowIndex}>\n                    {row.map(id => {\n                        const field = getFieldById(fields, id) as CmsModelField;\n\n                        return (\n                            <Grid.Column\n                                span={Math.floor(12 / row.length) as ColumnProps[\"span\"]}\n                                key={id}\n                            >\n                                {field ? (\n                                    <FieldElement\n                                        field={field}\n                                        Bind={Bind}\n                                        contentModel={contentModel}\n                                    />\n                                ) : (\n                                    <FieldElementError\n                                        title={`Missing field with id \"${id}\"!`}\n                                        description={\n                                            \"Make sure field layout contains the correct field ids (hint: check for typos).\"\n                                        }\n                                    />\n                                )}\n                            </Grid.Column>\n                        );\n                    })}\n                </React.Fragment>\n            ))}\n        </Grid>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAA0B,kBAAkB;AACzD,SAASC,YAAY;AACrB,SAASC,iBAAiB;AAgB1B,MAAMC,YAAY,GAAGA,CAACC,MAAuB,EAAEC,EAAU,KAA2B;EAChF,OAAOD,MAAM,CAACE,IAAI,CAACC,KAAK,IAAIA,KAAK,CAACF,EAAE,KAAKA,EAAE,CAAC,IAAI,IAAI;AACxD,CAAC;AAED,OAAO,MAAMG,MAAM,GAAGA,CAAC;EAAEC,IAAI;EAAEL,MAAM;EAAEM,MAAM;EAAEC,YAAY;EAAEC;AAA2B,CAAC,KAAK;EAC1F,oBACIb,KAAA,CAAAc,aAAA,CAACb,IAAI;IAACc,SAAS,EAAEF;EAAc,GAC1BF,MAAM,CAACK,GAAG,CAAC,CAACC,GAAG,EAAEC,QAAQ,kBACtBlB,KAAA,CAAAc,aAAA,CAACd,KAAK,CAACmB,QAAQ;IAACC,GAAG,EAAEF;EAAS,GACzBD,GAAG,CAACD,GAAG,CAACV,EAAE,IAAI;IACX,MAAME,KAAK,GAAGJ,YAAY,CAACC,MAAM,EAAEC,EAAE,CAAkB;IAEvD,oBACIN,KAAA,CAAAc,aAAA,CAACb,IAAI,CAACoB,MAAM;MACRC,IAAI,EAAEC,IAAI,CAACC,KAAK,CAAC,EAAE,GAAGP,GAAG,CAACQ,MAAM,CAAyB;MACzDL,GAAG,EAAEd;IAAG,GAEPE,KAAK,gBACFR,KAAA,CAAAc,aAAA,CAACZ,YAAY;MACTM,KAAK,EAAEA,KAAM;MACbE,IAAI,EAAEA,IAAK;MACXE,YAAY,EAAEA;IAAa,CAC9B,CAAC,gBAEFZ,KAAA,CAAAc,aAAA,CAACX,iBAAiB;MACduB,KAAK,EAAE,0BAA0BpB,EAAE,IAAK;MACxCqB,WAAW,EACP;IACH,CACJ,CAEI,CAAC;EAEtB,CAAC,CACW,CACnB,CACC,CAAC;AAEf,CAAC","ignoreList":[]}

package/Fields/Label.js

@@ -1,34 +1,10 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
+import React from "react";
+import { FormComponentLabel } from "@webiny/admin-ui";
+export const Label = ({
+  children
+}) => /*#__PURE__*/React.createElement(FormComponentLabel, {
+  text: children
 });
-exports.default = exports.Label = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _react2 = require("@emotion/react");
-var _classnames = _interopRequireDefault(require("classnames"));
-var _Typography = require("@webiny/ui/Typography");
-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 style = {
-  label: process.env.NODE_ENV === "production" ? {
-    name: "1ngxi7",
-    styles: "margin-bottom:5px !important"
-  } : {
-    name: "1a8b4f-label",
-    styles: "margin-bottom:5px !important;label:label;",
-    map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkxhYmVsLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFNVyIsImZpbGUiOiJMYWJlbC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QgZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCBjbGFzc05hbWVzIGZyb20gXCJjbGFzc25hbWVzXCI7XG5pbXBvcnQgeyBUeXBvZ3JhcGh5IH0gZnJvbSBcIkB3ZWJpbnkvdWkvVHlwb2dyYXBoeVwiO1xuXG5jb25zdCBzdHlsZSA9IHtcbiAgICBsYWJlbDogY3NzKHtcbiAgICAgICAgbWFyZ2luQm90dG9tOiBcIjVweCAhaW1wb3J0YW50XCJcbiAgICB9KVxufTtcblxuaW50ZXJmYWNlIExhYmVsUHJvcHMge1xuICAgIGNoaWxkcmVuPzogUmVhY3QuUmVhY3ROb2RlO1xufVxuXG5leHBvcnQgY29uc3QgTGFiZWwgPSAoeyBjaGlsZHJlbiB9OiBMYWJlbFByb3BzKSA9PiAoXG4gICAgPGRpdlxuICAgICAgICBjbGFzc05hbWU9e2NsYXNzTmFtZXMoXG4gICAgICAgICAgICBcIm1kYy10ZXh0LWZpZWxkLWhlbHBlci10ZXh0IG1kYy10ZXh0LWZpZWxkLWhlbHBlci10ZXh0LS1wZXJzaXN0ZW50XCIsXG4gICAgICAgICAgICBzdHlsZS5sYWJlbFxuICAgICAgICApfVxuICAgID5cbiAgICAgICAgPFR5cG9ncmFwaHkgdXNlPXtcImJvZHkyXCJ9PntjaGlsZHJlbn08L1R5cG9ncmFwaHk+XG4gICAgPC9kaXY+XG4pO1xuXG5leHBvcnQgZGVmYXVsdCBMYWJlbDtcbiJdfQ== */",
-    toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-  }
-};
-var Label = exports.Label = function Label(_ref) {
-  var children = _ref.children;
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)("mdc-text-field-helper-text mdc-text-field-helper-text--persistent", style.label)
-  }, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
-    use: "body2"
-  }, children));
-};
-var _default = exports.default = Label;
+export default Label;
 
 //# sourceMappingURL=Label.js.map

package/Fields/Label.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_react2","_classnames","_Typography","_EMOTION_STRINGIFIED_CSS_ERROR__","style","label","process","env","NODE_ENV","name","styles","map","toString","Label","exports","_ref","children","default","createElement","className","classNames","Typography","use","_default"],"sources":["Label.tsx"],"sourcesContent":["import React from \"react\";\nimport { css } from \"@emotion/react\";\nimport classNames from \"classnames\";\nimport { Typography } from \"@webiny/ui/Typography\";\n\nconst style = {\n    label: css({\n        marginBottom: \"5px !important\"\n    })\n};\n\ninterface LabelProps {\n    children?: React.ReactNode;\n}\n\nexport const Label = ({ children }: LabelProps) => (\n    <div\n        className={classNames(\n            \"mdc-text-field-helper-text mdc-text-field-helper-text--persistent\",\n            style.label\n        )}\n    >\n        <Typography use={\"body2\"}>{children}</Typography>\n    </div>\n);\n\nexport default Label;\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AACA,IAAAE,WAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,WAAA,GAAAH,OAAA;AAAmD,SAAAI,iCAAA;AAEnD,IAAMC,KAAK,GAAG;EACVC,KAAK,EAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;IAAAC,IAAA;IAAAC,MAAA;EAAA;IAAAD,IAAA;IAAAC,MAAA;IAAAC,GAAA;IAAAC,QAAA,EAAAT;EAAA;AAGT,CAAC;AAMM,IAAMU,KAAK,GAAAC,OAAA,CAAAD,KAAA,GAAG,SAARA,KAAKA,CAAAE,IAAA;EAAA,IAAMC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;EAAA,oBAC5BnB,MAAA,CAAAoB,OAAA,CAAAC,aAAA;IACIC,SAAS,EAAE,IAAAC,mBAAU,EACjB,mEAAmE,EACnEhB,KAAK,CAACC,KACV;EAAE,gBAEFR,MAAA,CAAAoB,OAAA,CAAAC,aAAA,CAAChB,WAAA,CAAAmB,UAAU;IAACC,GAAG,EAAE;EAAQ,GAAEN,QAAqB,CAC/C,CAAC;AAAA,CACT;AAAC,IAAAO,QAAA,GAAAT,OAAA,CAAAG,OAAA,GAEaJ,KAAK","ignoreList":[]}
+{"version":3,"names":["React","FormComponentLabel","Label","children","createElement","text"],"sources":["Label.tsx"],"sourcesContent":["import React from \"react\";\nimport { FormComponentLabel } from \"@webiny/admin-ui\";\n\ninterface LabelProps {\n    children?: React.ReactNode;\n}\n\nexport const Label = ({ children }: LabelProps) => <FormComponentLabel text={children} />;\n\nexport default Label;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,kBAAkB,QAAQ,kBAAkB;AAMrD,OAAO,MAAMC,KAAK,GAAGA,CAAC;EAAEC;AAAqB,CAAC,kBAAKH,KAAA,CAAAI,aAAA,CAACH,kBAAkB;EAACI,IAAI,EAAEF;AAAS,CAAE,CAAC;AAEzF,eAAeD,KAAK","ignoreList":[]}

package/Fields/index.js

@@ -1,40 +1,5 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _FieldElement = require("./FieldElement");
-Object.keys(_FieldElement).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _FieldElement[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _FieldElement[key];
-    }
-  });
-});
-var _Fields = require("./Fields");
-Object.keys(_Fields).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _Fields[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _Fields[key];
-    }
-  });
-});
-var _useBind = require("./useBind");
-Object.keys(_useBind).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _useBind[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _useBind[key];
-    }
-  });
-});
+export * from "./FieldElement";
+export * from "./Fields";
+export * from "./useBind";
 
 //# sourceMappingURL=index.js.map

package/Fields/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_FieldElement","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get","_Fields","_useBind"],"sources":["index.ts"],"sourcesContent":["export * from \"./FieldElement\";\nexport * from \"./Fields\";\nexport * from \"./useBind\";\n"],"mappings":";;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,aAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,aAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,aAAA,CAAAK,GAAA;IAAA;EAAA;AAAA;AACA,IAAAK,OAAA,GAAAT,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAO,OAAA,EAAAN,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAK,OAAA,CAAAL,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAC,OAAA,CAAAL,GAAA;IAAA;EAAA;AAAA;AACA,IAAAM,QAAA,GAAAV,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAQ,QAAA,EAAAP,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAM,QAAA,CAAAN,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAE,QAAA,CAAAN,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./FieldElement\";\nexport * from \"./Fields\";\nexport * from \"./useBind\";\n"],"mappings":"AAAA;AACA;AACA","ignoreList":[]}

package/Fields/useBind.d.ts

@@ -1,4 +1,4 @@
-import { BindComponent } from "../types";
+import type { BindComponent } from "../types";
 interface UseBindProps {
     Bind: BindComponent;
 }