@webiny/app-headless-cms 0.0.0-unstable.6f45466a1d → 0.0.0-unstable.7be00a75a9

package/admin/plugins/fieldRenderers/longText/longText.js

@@ -1,40 +1,43 @@
-import React from "react";
+import react from "react";
 import get from "lodash/get.js";
 import { DelayedOnChange, Textarea } from "@webiny/admin-ui";
 import { i18n } from "@webiny/app/i18n/index.js";
+import { useFieldEffectiveRules, useModelField } from "@webiny/app-headless-cms-common";
 const t = i18n.ns("app-headless-cms/admin/fields/text");
-const plugin = {
-  type: "cms-editor-field-renderer",
-  name: "cms-editor-field-renderer-long-text-textarea",
-  renderer: {
-    rendererName: "long-text-text-area",
-    name: t`Text Area`,
-    description: t`Renders a simple text area, suitable for larger amounts of text.`,
-    canUse({
-      field
-    }) {
-      return field.type === "long-text" && !field.multipleValues && !get(field, "predefinedValues.enabled");
-    },
-    render({
-      field,
-      getBind
-    }) {
-      const Bind = getBind();
-      return /*#__PURE__*/React.createElement(Bind, null, bind => /*#__PURE__*/React.createElement(Bind.ValidationContainer, null, /*#__PURE__*/React.createElement(DelayedOnChange, {
-        value: bind.value,
-        onChange: bind.onChange,
-        onBlur: bind.validate
-      }, /*#__PURE__*/React.createElement(Textarea, {
-        rows: 5,
-        label: field.label,
-        placeholder: field.placeholderText,
-        description: field.helpText,
-        "data-testid": `fr.input.longtext.${field.label}`,
-        validation: bind.validation
-      }))));
+const longText_plugin = {
+    type: "cms-editor-field-renderer",
+    name: "cms-editor-field-renderer-long-text-textarea",
+    renderer: {
+        rendererName: "long-text-text-area",
+        name: t`Text Area`,
+        description: t`Renders a simple text area, suitable for larger amounts of text.`,
+        canUse ({ field }) {
+            return "long-text" === field.type && !field.list && !get(field, "predefinedValues.enabled");
+        },
+        render ({ getBind }) {
+            const { field } = useModelField();
+            const rules = useFieldEffectiveRules(field);
+            const Bind = getBind();
+            const disabled = !rules.canEdit || rules.disabled;
+            return /*#__PURE__*/ react.createElement(Bind, null, (bind)=>/*#__PURE__*/ react.createElement(Bind.ValidationContainer, null, /*#__PURE__*/ react.createElement(DelayedOnChange, {
+                    value: bind.value,
+                    onChange: bind.onChange,
+                    onBlur: bind.validate
+                }, /*#__PURE__*/ react.createElement(Textarea, {
+                    disabled: disabled,
+                    rows: 5,
+                    label: field.label,
+                    placeholder: field.placeholder,
+                    description: field.description,
+                    note: field.note,
+                    hint: field.help,
+                    "data-testid": `fr.input.longtext.${field.label}`,
+                    validation: bind.validation
+                }))));
+        }
     }
-  }
 };
-export default plugin;
+const longText = longText_plugin;
+export default longText;
 
 //# sourceMappingURL=longText.js.map

package/admin/plugins/fieldRenderers/longText/longText.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","get","DelayedOnChange","Textarea","i18n","t","ns","plugin","type","name","renderer","rendererName","description","canUse","field","multipleValues","render","getBind","Bind","createElement","bind","ValidationContainer","value","onChange","onBlur","validate","rows","label","placeholder","placeholderText","helpText","validation"],"sources":["longText.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get.js\";\nimport type { CmsModelFieldRendererPlugin } from \"~/types.js\";\nimport { DelayedOnChange, Textarea } from \"@webiny/admin-ui\";\nimport { i18n } from \"@webiny/app/i18n/index.js\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/text\");\n\nconst plugin: CmsModelFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-long-text-textarea\",\n    renderer: {\n        rendererName: \"long-text-text-area\",\n        name: t`Text Area`,\n        description: t`Renders a simple text area, suitable for larger amounts of text.`,\n        canUse({ field }) {\n            return (\n                field.type === \"long-text\" &&\n                !field.multipleValues &&\n                !get(field, \"predefinedValues.enabled\")\n            );\n        },\n        render({ field, getBind }) {\n            const Bind = getBind();\n\n            return (\n                <Bind>\n                    {bind => (\n                        <Bind.ValidationContainer>\n                            <DelayedOnChange\n                                value={bind.value}\n                                onChange={bind.onChange}\n                                onBlur={bind.validate}\n                            >\n                                <Textarea\n                                    rows={5}\n                                    label={field.label}\n                                    placeholder={field.placeholderText}\n                                    description={field.helpText}\n                                    data-testid={`fr.input.longtext.${field.label}`}\n                                    validation={bind.validation}\n                                />\n                            </DelayedOnChange>\n                        </Bind.ValidationContainer>\n                    )}\n                </Bind>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,GAAG,MAAM,eAAe;AAE/B,SAASC,eAAe,EAAEC,QAAQ,QAAQ,kBAAkB;AAC5D,SAASC,IAAI,QAAQ,2BAA2B;AAEhD,MAAMC,CAAC,GAAGD,IAAI,CAACE,EAAE,CAAC,oCAAoC,CAAC;AAEvD,MAAMC,MAAmC,GAAG;EACxCC,IAAI,EAAE,2BAA2B;EACjCC,IAAI,EAAE,8CAA8C;EACpDC,QAAQ,EAAE;IACNC,YAAY,EAAE,qBAAqB;IACnCF,IAAI,EAAEJ,CAAC,WAAW;IAClBO,WAAW,EAAEP,CAAC,kEAAkE;IAChFQ,MAAMA,CAAC;MAAEC;IAAM,CAAC,EAAE;MACd,OACIA,KAAK,CAACN,IAAI,KAAK,WAAW,IAC1B,CAACM,KAAK,CAACC,cAAc,IACrB,CAACd,GAAG,CAACa,KAAK,EAAE,0BAA0B,CAAC;IAE/C,CAAC;IACDE,MAAMA,CAAC;MAAEF,KAAK;MAAEG;IAAQ,CAAC,EAAE;MACvB,MAAMC,IAAI,GAAGD,OAAO,CAAC,CAAC;MAEtB,oBACIjB,KAAA,CAAAmB,aAAA,CAACD,IAAI,QACAE,IAAI,iBACDpB,KAAA,CAAAmB,aAAA,CAACD,IAAI,CAACG,mBAAmB,qBACrBrB,KAAA,CAAAmB,aAAA,CAACjB,eAAe;QACZoB,KAAK,EAAEF,IAAI,CAACE,KAAM;QAClBC,QAAQ,EAAEH,IAAI,CAACG,QAAS;QACxBC,MAAM,EAAEJ,IAAI,CAACK;MAAS,gBAEtBzB,KAAA,CAAAmB,aAAA,CAAChB,QAAQ;QACLuB,IAAI,EAAE,CAAE;QACRC,KAAK,EAAEb,KAAK,CAACa,KAAM;QACnBC,WAAW,EAAEd,KAAK,CAACe,eAAgB;QACnCjB,WAAW,EAAEE,KAAK,CAACgB,QAAS;QAC5B,eAAa,qBAAqBhB,KAAK,CAACa,KAAK,EAAG;QAChDI,UAAU,EAAEX,IAAI,CAACW;MAAW,CAC/B,CACY,CACK,CAE5B,CAAC;IAEf;EACJ;AACJ,CAAC;AAED,eAAexB,MAAM","ignoreList":[]}
+{"version":3,"file":"admin/plugins/fieldRenderers/longText/longText.js","sources":["../../../../../src/admin/plugins/fieldRenderers/longText/longText.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get.js\";\nimport type { CmsModelFieldRendererPlugin } from \"~/types.js\";\nimport { DelayedOnChange, Textarea } from \"@webiny/admin-ui\";\nimport { i18n } from \"@webiny/app/i18n/index.js\";\nimport { useFieldEffectiveRules, useModelField } from \"@webiny/app-headless-cms-common\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/text\");\n\nconst plugin: CmsModelFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-long-text-textarea\",\n    renderer: {\n        rendererName: \"long-text-text-area\",\n        name: t`Text Area`,\n        description: t`Renders a simple text area, suitable for larger amounts of text.`,\n        canUse({ field }) {\n            return (\n                field.type === \"long-text\" && !field.list && !get(field, \"predefinedValues.enabled\")\n            );\n        },\n        render({ getBind }) {\n            const { field } = useModelField();\n            const rules = useFieldEffectiveRules(field);\n            const Bind = getBind();\n\n            const disabled = !rules.canEdit || rules.disabled;\n\n            return (\n                <Bind>\n                    {bind => (\n                        <Bind.ValidationContainer>\n                            <DelayedOnChange\n                                value={bind.value}\n                                onChange={bind.onChange}\n                                onBlur={bind.validate}\n                            >\n                                <Textarea\n                                    disabled={disabled}\n                                    rows={5}\n                                    label={field.label}\n                                    placeholder={field.placeholder}\n                                    description={field.description}\n                                    note={field.note}\n                                    hint={field.help}\n                                    data-testid={`fr.input.longtext.${field.label}`}\n                                    validation={bind.validation}\n                                />\n                            </DelayedOnChange>\n                        </Bind.ValidationContainer>\n                    )}\n                </Bind>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"names":["t","i18n","plugin","field","get","getBind","useModelField","rules","useFieldEffectiveRules","Bind","disabled","bind","DelayedOnChange","Textarea"],"mappings":";;;;;AAOA,MAAMA,IAAIC,KAAK,EAAE,CAAC;AAElB,MAAMC,kBAAsC;IACxC,MAAM;IACN,MAAM;IACN,UAAU;QACN,cAAc;QACd,MAAMF,CAAC,CAAC,SAAS,CAAC;QAClB,aAAaA,CAAC,CAAC,gEAAgE,CAAC;QAChF,QAAO,EAAEG,KAAK,EAAE;YACZ,OACIA,AAAe,gBAAfA,MAAM,IAAI,IAAoB,CAACA,MAAM,IAAI,IAAI,CAACC,IAAID,OAAO;QAEjE;QACA,QAAO,EAAEE,OAAO,EAAE;YACd,MAAM,EAAEF,KAAK,EAAE,GAAGG;YAClB,MAAMC,QAAQC,uBAAuBL;YACrC,MAAMM,OAAOJ;YAEb,MAAMK,WAAW,CAACH,MAAM,OAAO,IAAIA,MAAM,QAAQ;YAEjD,OAAO,WAAP,GACI,oBAACE,MAAAA,MACIE,CAAAA,OAAAA,WAAAA,GACG,oBAACF,KAAK,mBAAmB,sBACrB,oBAACG,iBAAeA;oBACZ,OAAOD,KAAK,KAAK;oBACjB,UAAUA,KAAK,QAAQ;oBACvB,QAAQA,KAAK,QAAQ;iCAErB,oBAACE,UAAQA;oBACL,UAAUH;oBACV,MAAM;oBACN,OAAOP,MAAM,KAAK;oBAClB,aAAaA,MAAM,WAAW;oBAC9B,aAAaA,MAAM,WAAW;oBAC9B,MAAMA,MAAM,IAAI;oBAChB,MAAMA,MAAM,IAAI;oBAChB,eAAa,CAAC,kBAAkB,EAAEA,MAAM,KAAK,EAAE;oBAC/C,YAAYQ,KAAK,UAAU;;QAOvD;IACJ;AACJ;AAEA,iBAAeT"}

package/admin/plugins/fieldRenderers/longText/longTexts.js

@@ -1,55 +1,59 @@
-import React from "react";
+import react from "react";
 import get from "lodash/get.js";
 import { i18n } from "@webiny/app/i18n/index.js";
-import { ReactComponent as DeleteIcon } from "@webiny/icons/delete_outline.svg";
+import { ReactComponent } from "@webiny/icons/delete_outline.svg";
 import DynamicSection from "../DynamicSection.js";
 import { MultiValueRendererSettings } from "../MultiValueRendererSettings.js";
 import { DelayedOnChange, IconButton, Textarea } from "@webiny/admin-ui";
+import { CanEditField, useFieldEffectiveRules, useModelField } from "@webiny/app-headless-cms-common";
 const t = i18n.ns("app-headless-cms/admin/fields/text");
-const plugin = {
-  type: "cms-editor-field-renderer",
-  name: "cms-editor-field-renderer-long-text-inputs",
-  renderer: {
-    rendererName: "long-text-inputs",
-    name: t`Text Areas`,
-    description: t`Renders a simple list of text areas.`,
-    canUse({
-      field
-    }) {
-      return field.type === "long-text" && !!field.multipleValues && !get(field, "predefinedValues.enabled");
-    },
-    render(props) {
-      return /*#__PURE__*/React.createElement(DynamicSection, props, ({
-        bind,
-        index
-      }) => /*#__PURE__*/React.createElement("div", {
-        className: "relative"
-      }, /*#__PURE__*/React.createElement(DelayedOnChange, {
-        value: bind.index.value,
-        onChange: bind.index.onChange,
-        onBlur: bind.index.validate
-      }, /*#__PURE__*/React.createElement(Textarea, {
-        validation: bind.index.validation,
-        rows: 5,
-        label: t`Value {number}`({
-          number: index + 1
-        }),
-        placeholder: props.field.placeholderText,
-        "data-testid": `fr.input.longTexts.${props.field.label}.${index + 1}`
-      })), /*#__PURE__*/React.createElement("div", {
-        className: "absolute top-xl right-sm z-10"
-      }, /*#__PURE__*/React.createElement(IconButton, {
-        variant: "ghost",
-        size: "md",
-        icon: /*#__PURE__*/React.createElement(DeleteIcon, null),
-        onClick: () => bind.field.removeValue(index)
-      }))));
-    },
-    renderSettings(props) {
-      return /*#__PURE__*/React.createElement(MultiValueRendererSettings, props);
+const longTexts_plugin = {
+    type: "cms-editor-field-renderer",
+    name: "cms-editor-field-renderer-long-text-inputs",
+    renderer: {
+        rendererName: "long-text-inputs",
+        name: t`Text Areas`,
+        description: t`Renders a simple list of text areas.`,
+        canUse ({ field }) {
+            return "long-text" === field.type && !!field.list && !get(field, "predefinedValues.enabled");
+        },
+        render (props) {
+            const { field } = useModelField();
+            const rules = useFieldEffectiveRules(field);
+            const disabled = !rules.canEdit || rules.disabled;
+            return /*#__PURE__*/ react.createElement(DynamicSection, {
+                ...props,
+                disabled: disabled
+            }, ({ bind, index })=>/*#__PURE__*/ react.createElement("div", {
+                    className: "relative"
+                }, /*#__PURE__*/ react.createElement(DelayedOnChange, {
+                    value: bind.index.value,
+                    onChange: bind.index.onChange,
+                    onBlur: bind.index.validate
+                }, /*#__PURE__*/ react.createElement(Textarea, {
+                    disabled: disabled,
+                    validation: bind.index.validation,
+                    rows: 5,
+                    label: t`Value {number}`({
+                        number: index + 1
+                    }),
+                    placeholder: props.field.placeholder,
+                    "data-testid": `fr.input.longTexts.${props.field.label}.${index + 1}`
+                })), /*#__PURE__*/ react.createElement(CanEditField, null, /*#__PURE__*/ react.createElement("div", {
+                    className: "absolute top-xl right-sm z-10"
+                }, /*#__PURE__*/ react.createElement(IconButton, {
+                    variant: "ghost",
+                    size: "md",
+                    icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+                    onClick: ()=>bind.field.removeValue(index)
+                })))));
+        },
+        renderSettings (props) {
+            return /*#__PURE__*/ react.createElement(MultiValueRendererSettings, props);
+        }
     }
-  }
 };
-export default plugin;
+const longTexts = longTexts_plugin;
+export default longTexts;
 
 //# sourceMappingURL=longTexts.js.map

package/admin/plugins/fieldRenderers/longText/longTexts.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","get","i18n","ReactComponent","DeleteIcon","DynamicSection","MultiValueRendererSettings","DelayedOnChange","IconButton","Textarea","t","ns","plugin","type","name","renderer","rendererName","description","canUse","field","multipleValues","render","props","createElement","bind","index","className","value","onChange","onBlur","validate","validation","rows","label","number","placeholder","placeholderText","variant","size","icon","onClick","removeValue","renderSettings"],"sources":["longTexts.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get.js\";\nimport type { CmsModelFieldRendererPlugin } from \"~/types.js\";\nimport { i18n } from \"@webiny/app/i18n/index.js\";\nimport { ReactComponent as DeleteIcon } from \"@webiny/icons/delete_outline.svg\";\nimport DynamicSection from \"../DynamicSection.js\";\nimport { MultiValueRendererSettings } from \"~/admin/plugins/fieldRenderers/MultiValueRendererSettings.js\";\nimport { DelayedOnChange, IconButton, Textarea } from \"@webiny/admin-ui\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/text\");\n\nconst plugin: CmsModelFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-long-text-inputs\",\n    renderer: {\n        rendererName: \"long-text-inputs\",\n        name: t`Text Areas`,\n        description: t`Renders a simple list of text areas.`,\n        canUse({ field }) {\n            return (\n                field.type === \"long-text\" &&\n                !!field.multipleValues &&\n                !get(field, \"predefinedValues.enabled\")\n            );\n        },\n        render(props) {\n            return (\n                <DynamicSection {...props}>\n                    {({ bind, index }) => (\n                        <div className={\"relative\"}>\n                            <DelayedOnChange\n                                value={bind.index.value}\n                                onChange={bind.index.onChange}\n                                onBlur={bind.index.validate}\n                            >\n                                <Textarea\n                                    validation={bind.index.validation}\n                                    rows={5}\n                                    label={t`Value {number}`({ number: index + 1 })}\n                                    placeholder={props.field.placeholderText}\n                                    data-testid={`fr.input.longTexts.${props.field.label}.${\n                                        index + 1\n                                    }`}\n                                />\n                            </DelayedOnChange>\n                            <div className={\"absolute top-xl right-sm z-10\"}>\n                                <IconButton\n                                    variant={\"ghost\"}\n                                    size={\"md\"}\n                                    icon={<DeleteIcon />}\n                                    onClick={() => bind.field.removeValue(index)}\n                                />\n                            </div>\n                        </div>\n                    )}\n                </DynamicSection>\n            );\n        },\n        renderSettings(props) {\n            return <MultiValueRendererSettings {...props} />;\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,GAAG,MAAM,eAAe;AAE/B,SAASC,IAAI,QAAQ,2BAA2B;AAChD,SAASC,cAAc,IAAIC,UAAU,QAAQ,kCAAkC;AAC/E,OAAOC,cAAc;AACrB,SAASC,0BAA0B;AACnC,SAASC,eAAe,EAAEC,UAAU,EAAEC,QAAQ,QAAQ,kBAAkB;AAExE,MAAMC,CAAC,GAAGR,IAAI,CAACS,EAAE,CAAC,oCAAoC,CAAC;AAEvD,MAAMC,MAAmC,GAAG;EACxCC,IAAI,EAAE,2BAA2B;EACjCC,IAAI,EAAE,4CAA4C;EAClDC,QAAQ,EAAE;IACNC,YAAY,EAAE,kBAAkB;IAChCF,IAAI,EAAEJ,CAAC,YAAY;IACnBO,WAAW,EAAEP,CAAC,sCAAsC;IACpDQ,MAAMA,CAAC;MAAEC;IAAM,CAAC,EAAE;MACd,OACIA,KAAK,CAACN,IAAI,KAAK,WAAW,IAC1B,CAAC,CAACM,KAAK,CAACC,cAAc,IACtB,CAACnB,GAAG,CAACkB,KAAK,EAAE,0BAA0B,CAAC;IAE/C,CAAC;IACDE,MAAMA,CAACC,KAAK,EAAE;MACV,oBACItB,KAAA,CAAAuB,aAAA,CAAClB,cAAc,EAAKiB,KAAK,EACpB,CAAC;QAAEE,IAAI;QAAEC;MAAM,CAAC,kBACbzB,KAAA,CAAAuB,aAAA;QAAKG,SAAS,EAAE;MAAW,gBACvB1B,KAAA,CAAAuB,aAAA,CAAChB,eAAe;QACZoB,KAAK,EAAEH,IAAI,CAACC,KAAK,CAACE,KAAM;QACxBC,QAAQ,EAAEJ,IAAI,CAACC,KAAK,CAACG,QAAS;QAC9BC,MAAM,EAAEL,IAAI,CAACC,KAAK,CAACK;MAAS,gBAE5B9B,KAAA,CAAAuB,aAAA,CAACd,QAAQ;QACLsB,UAAU,EAAEP,IAAI,CAACC,KAAK,CAACM,UAAW;QAClCC,IAAI,EAAE,CAAE;QACRC,KAAK,EAAEvB,CAAC,gBAAgB,CAAC;UAAEwB,MAAM,EAAET,KAAK,GAAG;QAAE,CAAC,CAAE;QAChDU,WAAW,EAAEb,KAAK,CAACH,KAAK,CAACiB,eAAgB;QACzC,eAAa,sBAAsBd,KAAK,CAACH,KAAK,CAACc,KAAK,IAChDR,KAAK,GAAG,CAAC;MACV,CACN,CACY,CAAC,eAClBzB,KAAA,CAAAuB,aAAA;QAAKG,SAAS,EAAE;MAAgC,gBAC5C1B,KAAA,CAAAuB,aAAA,CAACf,UAAU;QACP6B,OAAO,EAAE,OAAQ;QACjBC,IAAI,EAAE,IAAK;QACXC,IAAI,eAAEvC,KAAA,CAAAuB,aAAA,CAACnB,UAAU,MAAE,CAAE;QACrBoC,OAAO,EAAEA,CAAA,KAAMhB,IAAI,CAACL,KAAK,CAACsB,WAAW,CAAChB,KAAK;MAAE,CAChD,CACA,CACJ,CAEG,CAAC;IAEzB,CAAC;IACDiB,cAAcA,CAACpB,KAAK,EAAE;MAClB,oBAAOtB,KAAA,CAAAuB,aAAA,CAACjB,0BAA0B,EAAKgB,KAAQ,CAAC;IACpD;EACJ;AACJ,CAAC;AAED,eAAeV,MAAM","ignoreList":[]}
+{"version":3,"file":"admin/plugins/fieldRenderers/longText/longTexts.js","sources":["../../../../../src/admin/plugins/fieldRenderers/longText/longTexts.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get.js\";\nimport type { CmsModelFieldRendererPlugin } from \"~/types.js\";\nimport { i18n } from \"@webiny/app/i18n/index.js\";\nimport { ReactComponent as DeleteIcon } from \"@webiny/icons/delete_outline.svg\";\nimport DynamicSection from \"../DynamicSection.js\";\nimport { MultiValueRendererSettings } from \"~/admin/plugins/fieldRenderers/MultiValueRendererSettings.js\";\nimport { DelayedOnChange, IconButton, Textarea } from \"@webiny/admin-ui\";\nimport {\n    CanEditField,\n    useFieldEffectiveRules,\n    useModelField\n} from \"@webiny/app-headless-cms-common\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/text\");\n\nconst plugin: CmsModelFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-long-text-inputs\",\n    renderer: {\n        rendererName: \"long-text-inputs\",\n        name: t`Text Areas`,\n        description: t`Renders a simple list of text areas.`,\n        canUse({ field }) {\n            return (\n                field.type === \"long-text\" &&\n                !!field.list &&\n                !get(field, \"predefinedValues.enabled\")\n            );\n        },\n        render(props) {\n            const { field } = useModelField();\n            const rules = useFieldEffectiveRules(field);\n            const disabled = !rules.canEdit || rules.disabled;\n\n            return (\n                <DynamicSection {...props} disabled={disabled}>\n                    {({ bind, index }) => (\n                        <div className={\"relative\"}>\n                            <DelayedOnChange\n                                value={bind.index.value}\n                                onChange={bind.index.onChange}\n                                onBlur={bind.index.validate}\n                            >\n                                <Textarea\n                                    disabled={disabled}\n                                    validation={bind.index.validation}\n                                    rows={5}\n                                    label={t`Value {number}`({ number: index + 1 })}\n                                    placeholder={props.field.placeholder}\n                                    data-testid={`fr.input.longTexts.${props.field.label}.${\n                                        index + 1\n                                    }`}\n                                />\n                            </DelayedOnChange>\n                            <CanEditField>\n                                <div className={\"absolute top-xl right-sm z-10\"}>\n                                    <IconButton\n                                        variant={\"ghost\"}\n                                        size={\"md\"}\n                                        icon={<DeleteIcon />}\n                                        onClick={() => bind.field.removeValue(index)}\n                                    />\n                                </div>\n                            </CanEditField>\n                        </div>\n                    )}\n                </DynamicSection>\n            );\n        },\n        renderSettings(props) {\n            return <MultiValueRendererSettings {...props} />;\n        }\n    }\n};\n\nexport default plugin;\n"],"names":["t","i18n","plugin","field","get","props","useModelField","rules","useFieldEffectiveRules","disabled","DynamicSection","bind","index","DelayedOnChange","Textarea","CanEditField","IconButton","DeleteIcon","MultiValueRendererSettings"],"mappings":";;;;;;;;AAcA,MAAMA,IAAIC,KAAK,EAAE,CAAC;AAElB,MAAMC,mBAAsC;IACxC,MAAM;IACN,MAAM;IACN,UAAU;QACN,cAAc;QACd,MAAMF,CAAC,CAAC,UAAU,CAAC;QACnB,aAAaA,CAAC,CAAC,oCAAoC,CAAC;QACpD,QAAO,EAAEG,KAAK,EAAE;YACZ,OACIA,AAAe,gBAAfA,MAAM,IAAI,IACV,CAAC,CAACA,MAAM,IAAI,IACZ,CAACC,IAAID,OAAO;QAEpB;QACA,QAAOE,KAAK;YACR,MAAM,EAAEF,KAAK,EAAE,GAAGG;YAClB,MAAMC,QAAQC,uBAAuBL;YACrC,MAAMM,WAAW,CAACF,MAAM,OAAO,IAAIA,MAAM,QAAQ;YAEjD,OAAO,WAAP,GACI,oBAACG,gBAAcA;gBAAE,GAAGL,KAAK;gBAAE,UAAUI;eAChC,CAAC,EAAEE,IAAI,EAAEC,KAAK,EAAE,iBACb,oBAAC;oBAAI,WAAW;iCACZ,oBAACC,iBAAeA;oBACZ,OAAOF,KAAK,KAAK,CAAC,KAAK;oBACvB,UAAUA,KAAK,KAAK,CAAC,QAAQ;oBAC7B,QAAQA,KAAK,KAAK,CAAC,QAAQ;iCAE3B,oBAACG,UAAQA;oBACL,UAAUL;oBACV,YAAYE,KAAK,KAAK,CAAC,UAAU;oBACjC,MAAM;oBACN,OAAOX,CAAC,CAAC,cAAc,CAAC,CAAC;wBAAE,QAAQY,QAAQ;oBAAE;oBAC7C,aAAaP,MAAM,KAAK,CAAC,WAAW;oBACpC,eAAa,CAAC,mBAAmB,EAAEA,MAAM,KAAK,CAAC,KAAK,CAAC,CAAC,EAClDO,QAAQ,GACV;mCAGV,oBAACG,cAAYA,MAAAA,WAAAA,GACT,oBAAC;oBAAI,WAAW;iCACZ,oBAACC,YAAUA;oBACP,SAAS;oBACT,MAAM;oBACN,oBAAM,oBAACC,gBAAUA;oBACjB,SAAS,IAAMN,KAAK,KAAK,CAAC,WAAW,CAACC;;QAQtE;QACA,gBAAeP,KAAK;YAChB,OAAO,WAAP,GAAO,oBAACa,4BAA+Bb;QAC3C;IACJ;AACJ;AAEA,kBAAeH"}

package/admin/plugins/fieldRenderers/number/index.js

@@ -1,5 +1,9 @@
 import numberInput from "./numberInput.js";
 import numberInputs from "./numberInputs.js";
-export default [numberInput, numberInputs];
+const number = [
+    numberInput,
+    numberInputs
+];
+export default number;
 
 //# sourceMappingURL=index.js.map

package/admin/plugins/fieldRenderers/number/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["numberInput","numberInputs"],"sources":["index.ts"],"sourcesContent":["import numberInput from \"./numberInput.js\";\nimport numberInputs from \"./numberInputs.js\";\n\nexport default [numberInput, numberInputs];\n"],"mappings":"AAAA,OAAOA,WAAW;AAClB,OAAOC,YAAY;AAEnB,eAAe,CAACD,WAAW,EAAEC,YAAY,CAAC","ignoreList":[]}
+{"version":3,"file":"admin/plugins/fieldRenderers/number/index.js","sources":["../../../../../src/admin/plugins/fieldRenderers/number/index.ts"],"sourcesContent":["import numberInput from \"./numberInput.js\";\nimport numberInputs from \"./numberInputs.js\";\n\nexport default [numberInput, numberInputs];\n"],"names":["numberInput","numberInputs"],"mappings":";;AAGA,eAAe;IAACA;IAAaC;CAAa"}

package/admin/plugins/fieldRenderers/number/numberInput.js

@@ -1,40 +1,43 @@
-import React from "react";
+import react from "react";
 import get from "lodash/get.js";
 import { i18n } from "@webiny/app/i18n/index.js";
 import { DelayedOnChange, Input } from "@webiny/admin-ui";
+import { useFieldEffectiveRules, useModelField } from "@webiny/app-headless-cms-common";
 const t = i18n.ns("app-headless-cms/admin/fields/number");
-const plugin = {
-  type: "cms-editor-field-renderer",
-  name: "cms-editor-field-renderer-number",
-  renderer: {
-    rendererName: "number-input",
-    name: t`Number Input`,
-    description: t`Renders a simple input with its type set to "number".`,
-    canUse({
-      field
-    }) {
-      return field.type === "number" && !field.multipleValues && !get(field, "predefinedValues.enabled");
-    },
-    render({
-      field,
-      getBind
-    }) {
-      const Bind = getBind();
-      return /*#__PURE__*/React.createElement(Bind, null, bind => /*#__PURE__*/React.createElement(Bind.ValidationContainer, null, /*#__PURE__*/React.createElement(DelayedOnChange, {
-        value: bind.value,
-        onChange: bind.onChange,
-        onBlur: bind.validate
-      }, /*#__PURE__*/React.createElement(Input, {
-        label: field.label,
-        placeholder: field.placeholderText,
-        description: field.helpText,
-        type: "number",
-        "data-testid": `fr.input.number.${field.label}`,
-        validation: bind.validation
-      }))));
+const numberInput_plugin = {
+    type: "cms-editor-field-renderer",
+    name: "cms-editor-field-renderer-number",
+    renderer: {
+        rendererName: "number-input",
+        name: t`Number Input`,
+        description: t`Renders a simple input with its type set to "number".`,
+        canUse ({ field }) {
+            return "number" === field.type && !field.list && !get(field, "predefinedValues.enabled");
+        },
+        render ({ getBind }) {
+            const { field } = useModelField();
+            const rules = useFieldEffectiveRules(field);
+            const disabled = !rules.canEdit || rules.disabled;
+            const Bind = getBind();
+            return /*#__PURE__*/ react.createElement(Bind, null, (bind)=>/*#__PURE__*/ react.createElement(Bind.ValidationContainer, null, /*#__PURE__*/ react.createElement(DelayedOnChange, {
+                    value: bind.value,
+                    onChange: bind.onChange,
+                    onBlur: bind.validate
+                }, /*#__PURE__*/ react.createElement(Input, {
+                    disabled: disabled,
+                    label: field.label,
+                    placeholder: field.placeholder,
+                    description: field.description,
+                    note: field.note,
+                    hint: field.help,
+                    type: "number",
+                    "data-testid": `fr.input.number.${field.label}`,
+                    validation: bind.validation
+                }))));
+        }
     }
-  }
 };
-export default plugin;
+const numberInput = numberInput_plugin;
+export default numberInput;
 
 //# sourceMappingURL=numberInput.js.map

package/admin/plugins/fieldRenderers/number/numberInput.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","get","i18n","DelayedOnChange","Input","t","ns","plugin","type","name","renderer","rendererName","description","canUse","field","multipleValues","render","getBind","Bind","createElement","bind","ValidationContainer","value","onChange","onBlur","validate","label","placeholder","placeholderText","helpText","validation"],"sources":["numberInput.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get.js\";\nimport type { CmsModelFieldRendererPlugin } from \"~/types.js\";\nimport { i18n } from \"@webiny/app/i18n/index.js\";\nimport { DelayedOnChange, Input } from \"@webiny/admin-ui\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/number\");\n\nconst plugin: CmsModelFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-number\",\n    renderer: {\n        rendererName: \"number-input\",\n        name: t`Number Input`,\n        description: t`Renders a simple input with its type set to \"number\".`,\n        canUse({ field }) {\n            return (\n                field.type === \"number\" &&\n                !field.multipleValues &&\n                !get(field, \"predefinedValues.enabled\")\n            );\n        },\n        render({ field, getBind }) {\n            const Bind = getBind();\n\n            return (\n                <Bind>\n                    {bind => (\n                        <Bind.ValidationContainer>\n                            <DelayedOnChange\n                                value={bind.value}\n                                onChange={bind.onChange}\n                                onBlur={bind.validate}\n                            >\n                                <Input\n                                    label={field.label}\n                                    placeholder={field.placeholderText}\n                                    description={field.helpText}\n                                    type=\"number\"\n                                    data-testid={`fr.input.number.${field.label}`}\n                                    validation={bind.validation}\n                                />\n                            </DelayedOnChange>\n                        </Bind.ValidationContainer>\n                    )}\n                </Bind>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,GAAG,MAAM,eAAe;AAE/B,SAASC,IAAI,QAAQ,2BAA2B;AAChD,SAASC,eAAe,EAAEC,KAAK,QAAQ,kBAAkB;AAEzD,MAAMC,CAAC,GAAGH,IAAI,CAACI,EAAE,CAAC,sCAAsC,CAAC;AAEzD,MAAMC,MAAmC,GAAG;EACxCC,IAAI,EAAE,2BAA2B;EACjCC,IAAI,EAAE,kCAAkC;EACxCC,QAAQ,EAAE;IACNC,YAAY,EAAE,cAAc;IAC5BF,IAAI,EAAEJ,CAAC,cAAc;IACrBO,WAAW,EAAEP,CAAC,uDAAuD;IACrEQ,MAAMA,CAAC;MAAEC;IAAM,CAAC,EAAE;MACd,OACIA,KAAK,CAACN,IAAI,KAAK,QAAQ,IACvB,CAACM,KAAK,CAACC,cAAc,IACrB,CAACd,GAAG,CAACa,KAAK,EAAE,0BAA0B,CAAC;IAE/C,CAAC;IACDE,MAAMA,CAAC;MAAEF,KAAK;MAAEG;IAAQ,CAAC,EAAE;MACvB,MAAMC,IAAI,GAAGD,OAAO,CAAC,CAAC;MAEtB,oBACIjB,KAAA,CAAAmB,aAAA,CAACD,IAAI,QACAE,IAAI,iBACDpB,KAAA,CAAAmB,aAAA,CAACD,IAAI,CAACG,mBAAmB,qBACrBrB,KAAA,CAAAmB,aAAA,CAAChB,eAAe;QACZmB,KAAK,EAAEF,IAAI,CAACE,KAAM;QAClBC,QAAQ,EAAEH,IAAI,CAACG,QAAS;QACxBC,MAAM,EAAEJ,IAAI,CAACK;MAAS,gBAEtBzB,KAAA,CAAAmB,aAAA,CAACf,KAAK;QACFsB,KAAK,EAAEZ,KAAK,CAACY,KAAM;QACnBC,WAAW,EAAEb,KAAK,CAACc,eAAgB;QACnChB,WAAW,EAAEE,KAAK,CAACe,QAAS;QAC5BrB,IAAI,EAAC,QAAQ;QACb,eAAa,mBAAmBM,KAAK,CAACY,KAAK,EAAG;QAC9CI,UAAU,EAAEV,IAAI,CAACU;MAAW,CAC/B,CACY,CACK,CAE5B,CAAC;IAEf;EACJ;AACJ,CAAC;AAED,eAAevB,MAAM","ignoreList":[]}
+{"version":3,"file":"admin/plugins/fieldRenderers/number/numberInput.js","sources":["../../../../../src/admin/plugins/fieldRenderers/number/numberInput.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get.js\";\nimport type { CmsModelFieldRendererPlugin } from \"~/types.js\";\nimport { i18n } from \"@webiny/app/i18n/index.js\";\nimport { DelayedOnChange, Input } from \"@webiny/admin-ui\";\nimport { useFieldEffectiveRules, useModelField } from \"@webiny/app-headless-cms-common\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/number\");\n\nconst plugin: CmsModelFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-number\",\n    renderer: {\n        rendererName: \"number-input\",\n        name: t`Number Input`,\n        description: t`Renders a simple input with its type set to \"number\".`,\n        canUse({ field }) {\n            return (\n                field.type === \"number\" && !field.list && !get(field, \"predefinedValues.enabled\")\n            );\n        },\n        render({ getBind }) {\n            const { field } = useModelField();\n            const rules = useFieldEffectiveRules(field);\n            const disabled = !rules.canEdit || rules.disabled;\n            const Bind = getBind();\n\n            return (\n                <Bind>\n                    {bind => (\n                        <Bind.ValidationContainer>\n                            <DelayedOnChange\n                                value={bind.value}\n                                onChange={bind.onChange}\n                                onBlur={bind.validate}\n                            >\n                                <Input\n                                    disabled={disabled}\n                                    label={field.label}\n                                    placeholder={field.placeholder}\n                                    description={field.description}\n                                    note={field.note}\n                                    hint={field.help}\n                                    type=\"number\"\n                                    data-testid={`fr.input.number.${field.label}`}\n                                    validation={bind.validation}\n                                />\n                            </DelayedOnChange>\n                        </Bind.ValidationContainer>\n                    )}\n                </Bind>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"names":["t","i18n","plugin","field","get","getBind","useModelField","rules","useFieldEffectiveRules","disabled","Bind","bind","DelayedOnChange","Input"],"mappings":";;;;;AAOA,MAAMA,IAAIC,KAAK,EAAE,CAAC;AAElB,MAAMC,qBAAsC;IACxC,MAAM;IACN,MAAM;IACN,UAAU;QACN,cAAc;QACd,MAAMF,CAAC,CAAC,YAAY,CAAC;QACrB,aAAaA,CAAC,CAAC,qDAAqD,CAAC;QACrE,QAAO,EAAEG,KAAK,EAAE;YACZ,OACIA,AAAe,aAAfA,MAAM,IAAI,IAAiB,CAACA,MAAM,IAAI,IAAI,CAACC,IAAID,OAAO;QAE9D;QACA,QAAO,EAAEE,OAAO,EAAE;YACd,MAAM,EAAEF,KAAK,EAAE,GAAGG;YAClB,MAAMC,QAAQC,uBAAuBL;YACrC,MAAMM,WAAW,CAACF,MAAM,OAAO,IAAIA,MAAM,QAAQ;YACjD,MAAMG,OAAOL;YAEb,OAAO,WAAP,GACI,oBAACK,MAAAA,MACIC,CAAAA,OAAAA,WAAAA,GACG,oBAACD,KAAK,mBAAmB,sBACrB,oBAACE,iBAAeA;oBACZ,OAAOD,KAAK,KAAK;oBACjB,UAAUA,KAAK,QAAQ;oBACvB,QAAQA,KAAK,QAAQ;iCAErB,oBAACE,OAAKA;oBACF,UAAUJ;oBACV,OAAON,MAAM,KAAK;oBAClB,aAAaA,MAAM,WAAW;oBAC9B,aAAaA,MAAM,WAAW;oBAC9B,MAAMA,MAAM,IAAI;oBAChB,MAAMA,MAAM,IAAI;oBAChB,MAAK;oBACL,eAAa,CAAC,gBAAgB,EAAEA,MAAM,KAAK,EAAE;oBAC7C,YAAYQ,KAAK,UAAU;;QAOvD;IACJ;AACJ;AAEA,oBAAeT"}

package/admin/plugins/fieldRenderers/number/numberInputs.js

@@ -1,53 +1,56 @@
-import React from "react";
+import react from "react";
 import get from "lodash/get.js";
 import { i18n } from "@webiny/app/i18n/index.js";
-import { ReactComponent as DeleteIcon } from "@webiny/icons/delete.svg";
+import { ReactComponent } from "@webiny/icons/delete.svg";
 import DynamicSection from "../DynamicSection.js";
 import { MultiValueRendererSettings } from "../MultiValueRendererSettings.js";
 import { DelayedOnChange, Icon, Input } from "@webiny/admin-ui";
+import { CanEditField, useFieldEffectiveRules, useModelField } from "@webiny/app-headless-cms-common";
 const t = i18n.ns("app-headless-cms/admin/fields/text");
-const plugin = {
-  type: "cms-editor-field-renderer",
-  name: "cms-editor-field-renderer-number-inputs",
-  renderer: {
-    rendererName: "number-inputs",
-    name: t`Number Inputs`,
-    description: t`Renders a simple list of number inputs.`,
-    canUse({
-      field
-    }) {
-      return field.type === "number" && !!field.multipleValues && !get(field, "predefinedValues.enabled");
-    },
-    render(props) {
-      return /*#__PURE__*/React.createElement(DynamicSection, props, ({
-        bind,
-        index
-      }) => /*#__PURE__*/React.createElement(DelayedOnChange, {
-        value: bind.index.value,
-        onChange: bind.index.onChange,
-        onBlur: bind.index.validate
-      }, /*#__PURE__*/React.createElement(Input, {
-        validation: bind.index.validation,
-        onEnter: () => bind.field.appendValue(""),
-        label: t`Value {number}`({
-          number: index + 1
-        }),
-        placeholder: props.field.placeholderText,
-        "data-testid": `fr.input.numbers.${props.field.label}.${index + 1}`,
-        type: "number",
-        endIcon: /*#__PURE__*/React.createElement(Icon, {
-          icon: /*#__PURE__*/React.createElement(DeleteIcon, null),
-          label: "Delete",
-          onClick: () => bind.field.removeValue(index),
-          className: "cursor-pointer"
-        })
-      })));
-    },
-    renderSettings(props) {
-      return /*#__PURE__*/React.createElement(MultiValueRendererSettings, props);
+const numberInputs_plugin = {
+    type: "cms-editor-field-renderer",
+    name: "cms-editor-field-renderer-number-inputs",
+    renderer: {
+        rendererName: "number-inputs",
+        name: t`Number Inputs`,
+        description: t`Renders a simple list of number inputs.`,
+        canUse ({ field }) {
+            return "number" === field.type && !!field.list && !get(field, "predefinedValues.enabled");
+        },
+        render (props) {
+            const { field } = useModelField();
+            const rules = useFieldEffectiveRules(field);
+            return /*#__PURE__*/ react.createElement(DynamicSection, {
+                ...props,
+                disabled: !rules.canEdit
+            }, ({ bind, index })=>/*#__PURE__*/ react.createElement(DelayedOnChange, {
+                    value: bind.index.value,
+                    onChange: bind.index.onChange,
+                    onBlur: bind.index.validate
+                }, /*#__PURE__*/ react.createElement(Input, {
+                    disabled: !rules.canEdit,
+                    validation: bind.index.validation,
+                    onEnter: ()=>bind.field.appendValue(""),
+                    label: t`Value {number}`({
+                        number: index + 1
+                    }),
+                    placeholder: props.field.placeholder,
+                    "data-testid": `fr.input.numbers.${props.field.label}.${index + 1}`,
+                    type: "number",
+                    endIcon: /*#__PURE__*/ react.createElement(CanEditField, null, /*#__PURE__*/ react.createElement(Icon, {
+                        icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+                        label: "Delete",
+                        onClick: ()=>bind.field.removeValue(index),
+                        className: "cursor-pointer"
+                    }))
+                })));
+        },
+        renderSettings (props) {
+            return /*#__PURE__*/ react.createElement(MultiValueRendererSettings, props);
+        }
     }
-  }
 };
-export default plugin;
+const numberInputs = numberInputs_plugin;
+export default numberInputs;
 
 //# sourceMappingURL=numberInputs.js.map

package/admin/plugins/fieldRenderers/number/numberInputs.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","get","i18n","ReactComponent","DeleteIcon","DynamicSection","MultiValueRendererSettings","DelayedOnChange","Icon","Input","t","ns","plugin","type","name","renderer","rendererName","description","canUse","field","multipleValues","render","props","createElement","bind","index","value","onChange","onBlur","validate","validation","onEnter","appendValue","label","number","placeholder","placeholderText","endIcon","icon","onClick","removeValue","className","renderSettings"],"sources":["numberInputs.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get.js\";\nimport type { CmsModelFieldRendererPlugin } from \"~/types.js\";\nimport { i18n } from \"@webiny/app/i18n/index.js\";\nimport { ReactComponent as DeleteIcon } from \"@webiny/icons/delete.svg\";\nimport DynamicSection from \"../DynamicSection.js\";\nimport { MultiValueRendererSettings } from \"~/admin/plugins/fieldRenderers/MultiValueRendererSettings.js\";\nimport { DelayedOnChange, Icon, Input } from \"@webiny/admin-ui\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/text\");\n\nconst plugin: CmsModelFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-number-inputs\",\n    renderer: {\n        rendererName: \"number-inputs\",\n        name: t`Number Inputs`,\n        description: t`Renders a simple list of number inputs.`,\n        canUse({ field }) {\n            return (\n                field.type === \"number\" &&\n                !!field.multipleValues &&\n                !get(field, \"predefinedValues.enabled\")\n            );\n        },\n        render(props) {\n            return (\n                <DynamicSection {...props}>\n                    {({ bind, index }) => (\n                        <DelayedOnChange\n                            value={bind.index.value}\n                            onChange={bind.index.onChange}\n                            onBlur={bind.index.validate}\n                        >\n                            <Input\n                                validation={bind.index.validation}\n                                onEnter={() => bind.field.appendValue(\"\")}\n                                label={t`Value {number}`({ number: index + 1 })}\n                                placeholder={props.field.placeholderText}\n                                data-testid={`fr.input.numbers.${props.field.label}.${index + 1}`}\n                                type=\"number\"\n                                endIcon={\n                                    <Icon\n                                        icon={<DeleteIcon />}\n                                        label={\"Delete\"}\n                                        onClick={() => bind.field.removeValue(index)}\n                                        className={\"cursor-pointer\"}\n                                    />\n                                }\n                            />\n                        </DelayedOnChange>\n                    )}\n                </DynamicSection>\n            );\n        },\n        renderSettings(props) {\n            return <MultiValueRendererSettings {...props} />;\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,GAAG,MAAM,eAAe;AAE/B,SAASC,IAAI,QAAQ,2BAA2B;AAChD,SAASC,cAAc,IAAIC,UAAU,QAAQ,0BAA0B;AACvE,OAAOC,cAAc;AACrB,SAASC,0BAA0B;AACnC,SAASC,eAAe,EAAEC,IAAI,EAAEC,KAAK,QAAQ,kBAAkB;AAE/D,MAAMC,CAAC,GAAGR,IAAI,CAACS,EAAE,CAAC,oCAAoC,CAAC;AAEvD,MAAMC,MAAmC,GAAG;EACxCC,IAAI,EAAE,2BAA2B;EACjCC,IAAI,EAAE,yCAAyC;EAC/CC,QAAQ,EAAE;IACNC,YAAY,EAAE,eAAe;IAC7BF,IAAI,EAAEJ,CAAC,eAAe;IACtBO,WAAW,EAAEP,CAAC,yCAAyC;IACvDQ,MAAMA,CAAC;MAAEC;IAAM,CAAC,EAAE;MACd,OACIA,KAAK,CAACN,IAAI,KAAK,QAAQ,IACvB,CAAC,CAACM,KAAK,CAACC,cAAc,IACtB,CAACnB,GAAG,CAACkB,KAAK,EAAE,0BAA0B,CAAC;IAE/C,CAAC;IACDE,MAAMA,CAACC,KAAK,EAAE;MACV,oBACItB,KAAA,CAAAuB,aAAA,CAAClB,cAAc,EAAKiB,KAAK,EACpB,CAAC;QAAEE,IAAI;QAAEC;MAAM,CAAC,kBACbzB,KAAA,CAAAuB,aAAA,CAAChB,eAAe;QACZmB,KAAK,EAAEF,IAAI,CAACC,KAAK,CAACC,KAAM;QACxBC,QAAQ,EAAEH,IAAI,CAACC,KAAK,CAACE,QAAS;QAC9BC,MAAM,EAAEJ,IAAI,CAACC,KAAK,CAACI;MAAS,gBAE5B7B,KAAA,CAAAuB,aAAA,CAACd,KAAK;QACFqB,UAAU,EAAEN,IAAI,CAACC,KAAK,CAACK,UAAW;QAClCC,OAAO,EAAEA,CAAA,KAAMP,IAAI,CAACL,KAAK,CAACa,WAAW,CAAC,EAAE,CAAE;QAC1CC,KAAK,EAAEvB,CAAC,gBAAgB,CAAC;UAAEwB,MAAM,EAAET,KAAK,GAAG;QAAE,CAAC,CAAE;QAChDU,WAAW,EAAEb,KAAK,CAACH,KAAK,CAACiB,eAAgB;QACzC,eAAa,oBAAoBd,KAAK,CAACH,KAAK,CAACc,KAAK,IAAIR,KAAK,GAAG,CAAC,EAAG;QAClEZ,IAAI,EAAC,QAAQ;QACbwB,OAAO,eACHrC,KAAA,CAAAuB,aAAA,CAACf,IAAI;UACD8B,IAAI,eAAEtC,KAAA,CAAAuB,aAAA,CAACnB,UAAU,MAAE,CAAE;UACrB6B,KAAK,EAAE,QAAS;UAChBM,OAAO,EAAEA,CAAA,KAAMf,IAAI,CAACL,KAAK,CAACqB,WAAW,CAACf,KAAK,CAAE;UAC7CgB,SAAS,EAAE;QAAiB,CAC/B;MACJ,CACJ,CACY,CAET,CAAC;IAEzB,CAAC;IACDC,cAAcA,CAACpB,KAAK,EAAE;MAClB,oBAAOtB,KAAA,CAAAuB,aAAA,CAACjB,0BAA0B,EAAKgB,KAAQ,CAAC;IACpD;EACJ;AACJ,CAAC;AAED,eAAeV,MAAM","ignoreList":[]}
+{"version":3,"file":"admin/plugins/fieldRenderers/number/numberInputs.js","sources":["../../../../../src/admin/plugins/fieldRenderers/number/numberInputs.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get.js\";\nimport type { CmsModelFieldRendererPlugin } from \"~/types.js\";\nimport { i18n } from \"@webiny/app/i18n/index.js\";\nimport { ReactComponent as DeleteIcon } from \"@webiny/icons/delete.svg\";\nimport DynamicSection from \"../DynamicSection.js\";\nimport { MultiValueRendererSettings } from \"~/admin/plugins/fieldRenderers/MultiValueRendererSettings.js\";\nimport { DelayedOnChange, Icon, Input } from \"@webiny/admin-ui\";\nimport {\n    CanEditField,\n    useFieldEffectiveRules,\n    useModelField\n} from \"@webiny/app-headless-cms-common\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/text\");\n\nconst plugin: CmsModelFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-number-inputs\",\n    renderer: {\n        rendererName: \"number-inputs\",\n        name: t`Number Inputs`,\n        description: t`Renders a simple list of number inputs.`,\n        canUse({ field }) {\n            return (\n                field.type === \"number\" && !!field.list && !get(field, \"predefinedValues.enabled\")\n            );\n        },\n        render(props) {\n            const { field } = useModelField();\n            const rules = useFieldEffectiveRules(field);\n\n            return (\n                <DynamicSection {...props} disabled={!rules.canEdit}>\n                    {({ bind, index }) => (\n                        <DelayedOnChange\n                            value={bind.index.value}\n                            onChange={bind.index.onChange}\n                            onBlur={bind.index.validate}\n                        >\n                            <Input\n                                disabled={!rules.canEdit}\n                                validation={bind.index.validation}\n                                onEnter={() => bind.field.appendValue(\"\")}\n                                label={t`Value {number}`({ number: index + 1 })}\n                                placeholder={props.field.placeholder}\n                                data-testid={`fr.input.numbers.${props.field.label}.${index + 1}`}\n                                type=\"number\"\n                                endIcon={\n                                    <CanEditField>\n                                        <Icon\n                                            icon={<DeleteIcon />}\n                                            label={\"Delete\"}\n                                            onClick={() => bind.field.removeValue(index)}\n                                            className={\"cursor-pointer\"}\n                                        />\n                                    </CanEditField>\n                                }\n                            />\n                        </DelayedOnChange>\n                    )}\n                </DynamicSection>\n            );\n        },\n        renderSettings(props) {\n            return <MultiValueRendererSettings {...props} />;\n        }\n    }\n};\n\nexport default plugin;\n"],"names":["t","i18n","plugin","field","get","props","useModelField","rules","useFieldEffectiveRules","DynamicSection","bind","index","DelayedOnChange","Input","CanEditField","Icon","DeleteIcon","MultiValueRendererSettings"],"mappings":";;;;;;;;AAcA,MAAMA,IAAIC,KAAK,EAAE,CAAC;AAElB,MAAMC,sBAAsC;IACxC,MAAM;IACN,MAAM;IACN,UAAU;QACN,cAAc;QACd,MAAMF,CAAC,CAAC,aAAa,CAAC;QACtB,aAAaA,CAAC,CAAC,uCAAuC,CAAC;QACvD,QAAO,EAAEG,KAAK,EAAE;YACZ,OACIA,AAAe,aAAfA,MAAM,IAAI,IAAiB,CAAC,CAACA,MAAM,IAAI,IAAI,CAACC,IAAID,OAAO;QAE/D;QACA,QAAOE,KAAK;YACR,MAAM,EAAEF,KAAK,EAAE,GAAGG;YAClB,MAAMC,QAAQC,uBAAuBL;YAErC,OAAO,WAAP,GACI,oBAACM,gBAAcA;gBAAE,GAAGJ,KAAK;gBAAE,UAAU,CAACE,MAAM,OAAO;eAC9C,CAAC,EAAEG,IAAI,EAAEC,KAAK,EAAE,iBACb,oBAACC,iBAAeA;oBACZ,OAAOF,KAAK,KAAK,CAAC,KAAK;oBACvB,UAAUA,KAAK,KAAK,CAAC,QAAQ;oBAC7B,QAAQA,KAAK,KAAK,CAAC,QAAQ;iCAE3B,oBAACG,OAAKA;oBACF,UAAU,CAACN,MAAM,OAAO;oBACxB,YAAYG,KAAK,KAAK,CAAC,UAAU;oBACjC,SAAS,IAAMA,KAAK,KAAK,CAAC,WAAW,CAAC;oBACtC,OAAOV,CAAC,CAAC,cAAc,CAAC,CAAC;wBAAE,QAAQW,QAAQ;oBAAE;oBAC7C,aAAaN,MAAM,KAAK,CAAC,WAAW;oBACpC,eAAa,CAAC,iBAAiB,EAAEA,MAAM,KAAK,CAAC,KAAK,CAAC,CAAC,EAAEM,QAAQ,GAAG;oBACjE,MAAK;oBACL,uBACI,oBAACG,cAAYA,MAAAA,WAAAA,GACT,oBAACC,MAAIA;wBACD,oBAAM,oBAACC,gBAAUA;wBACjB,OAAO;wBACP,SAAS,IAAMN,KAAK,KAAK,CAAC,WAAW,CAACC;wBACtC,WAAW;;;QAS/C;QACA,gBAAeN,KAAK;YAChB,OAAO,WAAP,GAAO,oBAACY,4BAA+BZ;QAC3C;IACJ;AACJ;AAEA,qBAAeH"}

package/admin/plugins/fieldRenderers/object/FieldSettings.d.ts

@@ -15,11 +15,13 @@ export declare class FieldSettings {
             fieldId: import("@webiny/app-headless-cms-common/types/model").CmsEditorFieldId;
             storageId?: string;
             label: string;
-            helpText?: string | React.ReactNode;
-            placeholderText?: string;
+            help?: string | React.ReactNode;
+            description?: string | React.ReactNode;
+            note?: string | React.ReactNode;
+            placeholder?: string;
             validation?: (import("@webiny/app-headless-cms-common/types/validation").CmsModelFieldValidator | import("@webiny/validation/types").Validator)[];
             listValidation?: import("@webiny/app-headless-cms-common/types/validation").CmsModelFieldValidator[];
-            multipleValues?: boolean;
+            list?: boolean;
             predefinedValues?: import("@webiny/app-headless-cms-common/types/index.js").CmsEditorFieldPredefinedValues;
             settings?: import("@webiny/app-headless-cms-common/types/model").CmsModelFieldSettings<unknown> | undefined;
             renderer: {
@@ -27,8 +29,9 @@ export declare class FieldSettings {
                 settings?: Record<string, any>;
             } | import("@webiny/app-headless-cms-common/types/index.js").CmsModelFieldRendererPlugin["renderer"]["render"];
             tags?: string[];
+            rules?: import("@webiny/app-headless-cms-common/types/model").FieldRule[];
         }[];
-        layout: string[][];
+        layout: import("@webiny/app-headless-cms-common/types/model").CmsEditorFieldsLayout;
         defaultValue?: string | boolean | number | null | undefined;
         defaultSetValue?: string;
         type?: string;

package/admin/plugins/fieldRenderers/object/FieldSettings.js

@@ -1,45 +1,32 @@
 const cache = new Map();
-
-/**
- * This class helps us handle the `field.settings` and encapsulate defaults, checks of undefined, etc.
- * We also want to prevent log spamming in the browser console, so we cache and reuse each instance
- * for every unique field object. That way, each instance can track its own state.
- */
-export class FieldSettings {
-  logged = false;
-  constructor(field) {
-    this.field = field;
-  }
-  getSettings() {
-    return {
-      ...this.field.settings,
-      fields: this.field.settings?.fields || [],
-      layout: this.field.settings?.layout || []
-    };
-  }
-  hasFields() {
-    if (!this.field.settings) {
-      return false;
+class FieldSettings {
+    constructor(field){
+        this.logged = false;
+        this.field = field;
+    }
+    getSettings() {
+        return {
+            ...this.field.settings,
+            fields: this.field.settings?.fields || [],
+            layout: this.field.settings?.layout || []
+        };
     }
-    if (!this.field.settings.fields) {
-      return false;
+    hasFields() {
+        if (!this.field.settings) return false;
+        if (!this.field.settings.fields) return false;
+        return this.field.settings.fields.length > 0;
     }
-    return this.field.settings.fields.length > 0;
-  }
-  logMissingFields() {
-    if (this.logged) {
-      return;
+    logMissingFields() {
+        if (this.logged) return;
+        console.info(`Skipping "${this.field.fieldId}" field. There are no fields defined for this object.`);
+        this.logged = true;
     }
-    console.info(`Skipping "${this.field.fieldId}" field. There are no fields defined for this object.`);
-    this.logged = true;
-  }
-  static createFrom(field) {
-    if (cache.has(field)) {
-      return cache.get(field);
+    static createFrom(field) {
+        if (cache.has(field)) return cache.get(field);
+        cache.set(field, new FieldSettings(field));
+        return cache.get(field);
     }
-    cache.set(field, new FieldSettings(field));
-    return cache.get(field);
-  }
 }
+export { FieldSettings };
 
 //# sourceMappingURL=FieldSettings.js.map