@webiny/app-headless-cms 5.36.2 → 5.37.0-beta.1

package/admin/plugins/fieldRenderers/file/fileField.js

@@ -8,10 +8,47 @@ exports.default = void 0;
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = _interopRequireDefault(require("react"));
 var _i18n = require("@webiny/app/i18n");
-var _Grid = require("@webiny/ui/Grid");
 var _components = require("@webiny/app-admin/components");
 var _File = _interopRequireDefault(require("./File"));
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+var _Typography = require("@webiny/ui/Typography");
 var _templateObject, _templateObject2;
+var ImageFieldWrapper = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "e1v0oxkt0",
+  label: "ImageFieldWrapper"
+})({
+  background: "var(--mdc-theme-on-background)",
+  borderBottom: "1px solid rgba(0, 0, 0, 0.42)",
+  height: "100%",
+  padding: "25px 15px",
+  boxSizing: "border-box",
+  display: "flex",
+  flexDirection: "column",
+  span: {
+    color: "var(--mdc-theme-text-primary-on-background)"
+  }
+});
+var InnerImageFieldWrapper = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "e1v0oxkt1",
+  label: "InnerImageFieldWrapper"
+})({
+  background: "repeating-conic-gradient(#efefef 0% 25%, transparent 0% 50%) 50%/25px 25px",
+  height: "100%",
+  width: "100%",
+  boxSizing: "border-box",
+  backgroundColor: "#fff",
+  border: "1px solid var(--mdc-theme-background)",
+  display: "flex",
+  justifyContent: "center",
+  alignItems: "center",
+  flexBasis: "100%",
+  maxHeight: "180px",
+  ">div": {
+    minWidth: "200px",
+    maxHeight: "180px",
+    padding: "30px"
+  }
+});
 var t = _i18n.i18n.ns("app-headless-cms/admin/fields/file");
 var plugin = {
   type: "cms-editor-field-renderer",
@@ -30,12 +67,12 @@ var plugin = {
         Label = _ref2.Label;
       var Bind = getBind();
       var imagesOnly = field.settings && field.settings.imagesOnly;
-      return /*#__PURE__*/_react.default.createElement(_Grid.Grid, null, /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
-        span: 12
-      }, /*#__PURE__*/_react.default.createElement(Label, null, field.label), /*#__PURE__*/_react.default.createElement(Bind, null, function (bind) {
+      return /*#__PURE__*/_react.default.createElement(ImageFieldWrapper, null, /*#__PURE__*/_react.default.createElement(Label, null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
+        use: "body1"
+      }, field.label)), /*#__PURE__*/_react.default.createElement(Bind, null, function (bind) {
         var value = bind.value,
           onChange = bind.onChange;
-        return /*#__PURE__*/_react.default.createElement(_components.FileManager, {
+        return /*#__PURE__*/_react.default.createElement(InnerImageFieldWrapper, null, /*#__PURE__*/_react.default.createElement(_components.FileManager, {
           images: imagesOnly,
           render: function render(_ref3) {
             var showFileManager = _ref3.showFileManager;
@@ -55,8 +92,8 @@ var plugin = {
               "data-testid": "fr.input.filefield.".concat(field.label)
             }));
           }
-        });
-      })));
+        }));
+      }));
     }
   }
 };

package/admin/plugins/fieldRenderers/file/fileField.js.map

@@ -1 +1 @@
-{"version":3,"names":["t","i18n","ns","plugin","type","name","renderer","rendererName","description","canUse","field","multipleValues","render","getBind","Label","Bind","imagesOnly","settings","label","bind","value","onChange","showFileManager","selectFile","file","src","placeholderText","helpText"],"sources":["fileField.tsx"],"sourcesContent":["import React from \"react\";\nimport { CmsEditorFieldRendererPlugin } from \"~/types\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { Cell, Grid } from \"@webiny/ui/Grid\";\nimport { FileManager } from \"@webiny/app-admin/components\";\nimport File from \"./File\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/file\");\n\nconst plugin: CmsEditorFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-file\",\n    renderer: {\n        rendererName: \"file-input\",\n        name: t`File Input`,\n        description: t`Enables selecting a single file via File Manager.`,\n        canUse({ field }) {\n            return field.type === \"file\" && !field.multipleValues;\n        },\n        render({ field, getBind, Label }) {\n            const Bind = getBind();\n\n            const imagesOnly = field.settings && field.settings.imagesOnly;\n            return (\n                <Grid>\n                    <Cell span={12}>\n                        <Label>{field.label}</Label>\n                        <Bind>\n                            {bind => {\n                                const { value, onChange } = bind;\n\n                                return (\n                                    <FileManager\n                                        images={imagesOnly}\n                                        render={({ showFileManager }) => {\n                                            const selectFile = () => {\n                                                showFileManager(file => onChange(file.src));\n                                            };\n                                            return (\n                                                <File\n                                                    {...bind}\n                                                    url={value}\n                                                    onRemove={() => onChange(null)}\n                                                    showFileManager={selectFile}\n                                                    placeholder={field.placeholderText}\n                                                    description={field.helpText}\n                                                    data-testid={`fr.input.filefield.${field.label}`}\n                                                />\n                                            );\n                                        }}\n                                    />\n                                );\n                            }}\n                        </Bind>\n                    </Cell>\n                </Grid>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;AAAA;AAEA;AACA;AACA;AACA;AAA0B;AAE1B,IAAMA,CAAC,GAAGC,UAAI,CAACC,EAAE,CAAC,oCAAoC,CAAC;AAEvD,IAAMC,MAAoC,GAAG;EACzCC,IAAI,EAAE,2BAA2B;EACjCC,IAAI,EAAE,gCAAgC;EACtCC,QAAQ,EAAE;IACNC,YAAY,EAAE,YAAY;IAC1BF,IAAI,EAAEL,CAAC,6FAAY;IACnBQ,WAAW,EAAER,CAAC,sIAAmD;IACjES,MAAM,wBAAY;MAAA,IAATC,KAAK,QAALA,KAAK;MACV,OAAOA,KAAK,CAACN,IAAI,KAAK,MAAM,IAAI,CAACM,KAAK,CAACC,cAAc;IACzD,CAAC;IACDC,MAAM,yBAA4B;MAAA,IAAzBF,KAAK,SAALA,KAAK;QAAEG,OAAO,SAAPA,OAAO;QAAEC,KAAK,SAALA,KAAK;MAC1B,IAAMC,IAAI,GAAGF,OAAO,EAAE;MAEtB,IAAMG,UAAU,GAAGN,KAAK,CAACO,QAAQ,IAAIP,KAAK,CAACO,QAAQ,CAACD,UAAU;MAC9D,oBACI,6BAAC,UAAI,qBACD,6BAAC,UAAI;QAAC,IAAI,EAAE;MAAG,gBACX,6BAAC,KAAK,QAAEN,KAAK,CAACQ,KAAK,CAAS,eAC5B,6BAAC,IAAI,QACA,UAAAC,IAAI,EAAI;QACL,IAAQC,KAAK,GAAeD,IAAI,CAAxBC,KAAK;UAAEC,QAAQ,GAAKF,IAAI,CAAjBE,QAAQ;QAEvB,oBACI,6BAAC,uBAAW;UACR,MAAM,EAAEL,UAAW;UACnB,MAAM,EAAE,uBAAyB;YAAA,IAAtBM,eAAe,SAAfA,eAAe;YACtB,IAAMC,UAAU,GAAG,SAAbA,UAAU,GAAS;cACrBD,eAAe,CAAC,UAAAE,IAAI;gBAAA,OAAIH,QAAQ,CAACG,IAAI,CAACC,GAAG,CAAC;cAAA,EAAC;YAC/C,CAAC;YACD,oBACI,6BAAC,aAAI,oBACGN,IAAI;cACR,GAAG,EAAEC,KAAM;cACX,QAAQ,EAAE;gBAAA,OAAMC,QAAQ,CAAC,IAAI,CAAC;cAAA,CAAC;cAC/B,eAAe,EAAEE,UAAW;cAC5B,WAAW,EAAEb,KAAK,CAACgB,eAAgB;cACnC,WAAW,EAAEhB,KAAK,CAACiB,QAAS;cAC5B,4CAAmCjB,KAAK,CAACQ,KAAK;YAAG,GACnD;UAEV;QAAE,EACJ;MAEV,CAAC,CACE,CACJ,CACJ;IAEf;EACJ;AACJ,CAAC;AAAC,eAEaf,MAAM;AAAA"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_i18n","_components","_File","_styled","_Typography","_templateObject","_templateObject2","ImageFieldWrapper","styled","target","label","background","borderBottom","height","padding","boxSizing","display","flexDirection","span","color","InnerImageFieldWrapper","width","backgroundColor","border","justifyContent","alignItems","flexBasis","maxHeight","minWidth","t","i18n","ns","plugin","type","name","renderer","rendererName","_taggedTemplateLiteral2","default","description","canUse","_ref","field","multipleValues","render","_ref2","getBind","Label","Bind","imagesOnly","settings","createElement","Typography","use","bind","value","onChange","FileManager","images","_ref3","showFileManager","selectFile","file","src","Object","assign","url","onRemove","placeholder","placeholderText","helpText","concat","_default","exports"],"sources":["fileField.tsx"],"sourcesContent":["import React from \"react\";\nimport { CmsEditorFieldRendererPlugin } from \"~/types\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { FileManager } from \"@webiny/app-admin/components\";\nimport File from \"./File\";\nimport styled from \"@emotion/styled\";\nimport { Typography } from \"@webiny/ui/Typography\";\n\nconst ImageFieldWrapper = styled(\"div\")({\n    background: \"var(--mdc-theme-on-background)\",\n    borderBottom: \"1px solid rgba(0, 0, 0, 0.42)\",\n    height: \"100%\",\n    padding: \"25px 15px\",\n    boxSizing: \"border-box\",\n    display: \"flex\",\n    flexDirection: \"column\",\n    span: {\n        color: \"var(--mdc-theme-text-primary-on-background)\"\n    }\n});\n\nconst InnerImageFieldWrapper = styled(\"div\")({\n    background: \"repeating-conic-gradient(#efefef 0% 25%, transparent 0% 50%) 50%/25px 25px\",\n    height: \"100%\",\n    width: \"100%\",\n    boxSizing: \"border-box\",\n    backgroundColor: \"#fff\",\n    border: \"1px solid var(--mdc-theme-background)\",\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n    flexBasis: \"100%\",\n    maxHeight: \"180px\",\n    \">div\": {\n        minWidth: \"200px\",\n        maxHeight: \"180px\",\n        padding: \"30px\"\n    }\n});\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/file\");\n\nconst plugin: CmsEditorFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-file\",\n    renderer: {\n        rendererName: \"file-input\",\n        name: t`File Input`,\n        description: t`Enables selecting a single file via File Manager.`,\n        canUse({ field }) {\n            return field.type === \"file\" && !field.multipleValues;\n        },\n        render({ field, getBind, Label }) {\n            const Bind = getBind();\n\n            const imagesOnly = field.settings && field.settings.imagesOnly;\n            return (\n                <ImageFieldWrapper>\n                    <Label>\n                        <Typography use=\"body1\">{field.label}</Typography>\n                    </Label>\n                    <Bind>\n                        {bind => {\n                            const { value, onChange } = bind;\n\n                            return (\n                                <InnerImageFieldWrapper>\n                                    <FileManager\n                                        images={imagesOnly}\n                                        render={({ showFileManager }) => {\n                                            const selectFile = () => {\n                                                showFileManager(file => onChange(file.src));\n                                            };\n                                            return (\n                                                <File\n                                                    {...bind}\n                                                    url={value}\n                                                    onRemove={() => onChange(null)}\n                                                    showFileManager={selectFile}\n                                                    placeholder={field.placeholderText}\n                                                    description={field.helpText}\n                                                    data-testid={`fr.input.filefield.${field.label}`}\n                                                />\n                                            );\n                                        }}\n                                    />\n                                </InnerImageFieldWrapper>\n                            );\n                        }}\n                    </Bind>\n                </ImageFieldWrapper>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":"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"}

package/admin/plugins/fieldRenderers/file/fileFields.d.ts

@@ -1,3 +1,3 @@
-import { CmsEditorFieldRendererPlugin } from "../../../../types";
-declare const plugin: CmsEditorFieldRendererPlugin;
+import { CmsModelFieldRendererPlugin } from "../../../../types";
+declare const plugin: CmsModelFieldRendererPlugin;
 export default plugin;

package/admin/plugins/fieldRenderers/file/fileFields.js

@@ -30,6 +30,29 @@ var FileUploadWrapper = /*#__PURE__*/(0, _styled.default)("div", {
     color: "var(--mdc-theme-text-secondary-on-background)"
   }
 });
+var InnerImageFieldWrapper = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "eq80mh1",
+  label: "InnerImageFieldWrapper"
+})({
+  background: "repeating-conic-gradient(#efefef 0% 25%, transparent 0% 50%) 50%/25px 25px",
+  height: "100%",
+  width: "100%",
+  boxSizing: "border-box",
+  backgroundColor: "#fff",
+  border: "1px solid var(--mdc-theme-background)",
+  display: "flex",
+  justifyContent: "center",
+  alignItems: "center",
+  flexBasis: "100%",
+  maxHeight: "180px",
+  padding: "30px",
+  ">div": {
+    maxHeight: "180px",
+    img: {
+      padding: "15px"
+    }
+  }
+});
 var FieldRenderer = function FieldRenderer(_ref) {
   var getBind = _ref.getBind,
     Label = _ref.Label,
@@ -67,7 +90,7 @@ var FieldRenderer = function FieldRenderer(_ref) {
           return /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
             span: 3,
             key: url
-          }, /*#__PURE__*/_react.default.createElement(_File.default, {
+          }, /*#__PURE__*/_react.default.createElement(InnerImageFieldWrapper, null, /*#__PURE__*/_react.default.createElement(_File.default, {
             url: url,
             showFileManager: function showFileManager() {
               return selectFiles(index);
@@ -77,10 +100,10 @@ var FieldRenderer = function FieldRenderer(_ref) {
             },
             placeholder: t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Select a file\""]))),
             "data-testid": "fr.input.file.".concat(field.label, ".").concat(index)
-          }));
+          })));
         })), /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
           span: 3
-        }, /*#__PURE__*/_react.default.createElement(_File.default, Object.assign({
+        }, /*#__PURE__*/_react.default.createElement(InnerImageFieldWrapper, null, /*#__PURE__*/_react.default.createElement(_File.default, Object.assign({
           url: "",
           onRemove: function onRemove() {
             return void 0;
@@ -91,7 +114,7 @@ var FieldRenderer = function FieldRenderer(_ref) {
           },
           placeholder: t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["Select a file\""]))),
           "data-testid": "fr.input.file.".concat(field.label)
-        }))));
+        })))));
       }
     }));
   });

package/admin/plugins/fieldRenderers/file/fileFields.js.map

@@ -1 +1 @@
-{"version":3,"names":["t","i18n","ns","FileUploadWrapper","styled","position","opacity","pointerEvents","color","FieldRenderer","getBind","Label","field","Bind","imagesOnly","settings","bind","onChange","value","Array","isArray","filter","Boolean","imageWrapperStyles","showFileManager","selectFiles","index","files","urls","map","f","src","slice","label","url","dotProp","delete","defaultProps","validation","isValid","styles","width","height","plugin","type","name","renderer","rendererName","description","canUse","multipleValues","render"],"sources":["fileFields.tsx"],"sourcesContent":["import React from \"react\";\nimport dotProp from \"dot-prop-immutable\";\nimport { CmsModelField, CmsEditorFieldRendererPlugin } from \"~/types\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { Cell, GridInner } from \"@webiny/ui/Grid\";\nimport { imageWrapperStyles } from \"./utils\";\nimport { FileManager } from \"@webiny/app-admin/components\";\nimport styled from \"@emotion/styled\";\nimport File from \"./File\";\nimport { GetBindCallable } from \"~/admin/components/ContentEntryForm/useBind\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/file\");\n\nconst FileUploadWrapper = styled(\"div\")({\n    position: \"relative\",\n    \".disabled\": {\n        opacity: 0.75,\n        pointerEvents: \"none\"\n    },\n    \".mdc-text-field-helper-text\": {\n        color: \"var(--mdc-theme-text-secondary-on-background)\"\n    }\n});\n\ninterface FieldRendererProps {\n    getBind: GetBindCallable;\n    Label: React.FC;\n    field: CmsModelField;\n}\nconst FieldRenderer: React.FC<FieldRendererProps> = ({ getBind, Label, field }) => {\n    const Bind = getBind();\n\n    const imagesOnly = field.settings && field.settings.imagesOnly;\n\n    return (\n        <Bind>\n            {bind => {\n                const { onChange } = bind;\n\n                // We need to make sure the value is an array, since this is a multi-value component.\n                const value: string[] = (\n                    Array.isArray(bind.value) ? bind.value : [bind.value]\n                ).filter(Boolean);\n\n                return (\n                    <FileUploadWrapper className={imageWrapperStyles}>\n                        <FileManager\n                            multiple\n                            images={imagesOnly}\n                            render={({ showFileManager }) => {\n                                const selectFiles = (index = -1) => {\n                                    showFileManager(files => {\n                                        const urls = files.map(f => f.src);\n                                        if (index === -1) {\n                                            onChange([...value, ...urls]);\n                                        } else {\n                                            onChange([\n                                                ...value.slice(0, index),\n                                                ...urls,\n                                                ...value.slice(index + 1)\n                                            ]);\n                                        }\n                                    });\n                                };\n                                return (\n                                    <GridInner>\n                                        <Cell span={12}>\n                                            <Label>{field.label}</Label>\n                                        </Cell>\n\n                                        <>\n                                            {value.map((url: string, index: number) => (\n                                                <Cell span={3} key={url}>\n                                                    <File\n                                                        url={url}\n                                                        showFileManager={() => selectFiles(index)}\n                                                        onRemove={() =>\n                                                            onChange(dotProp.delete(value, index))\n                                                        }\n                                                        placeholder={t`Select a file\"`}\n                                                        data-testid={`fr.input.file.${field.label}.${index}`}\n                                                    />\n                                                </Cell>\n                                            ))}\n                                        </>\n\n                                        <Cell span={3}>\n                                            <File\n                                                url={\"\"}\n                                                onRemove={() => {\n                                                    return void 0;\n                                                }}\n                                                {...bind}\n                                                showFileManager={() => selectFiles()}\n                                                placeholder={t`Select a file\"`}\n                                                data-testid={`fr.input.file.${field.label}`}\n                                            />\n                                        </Cell>\n                                    </GridInner>\n                                );\n                            }}\n                        />\n                    </FileUploadWrapper>\n                );\n            }}\n        </Bind>\n    );\n};\n/**\n * Not used?\n */\n// TODO @ts-refactor\nFieldRenderer.defaultProps = {\n    validation: {\n        isValid: null\n    },\n    styles: { width: \"100%\", height: \"auto\" }\n} as Partial<FieldRendererProps>;\n\nconst plugin: CmsEditorFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-files\",\n    renderer: {\n        rendererName: \"file-inputs\",\n        name: t`File Inputs`,\n        description: t`Enables selecting multiple files via File Manager.`,\n        canUse({ field }) {\n            return field.type === \"file\" && !!field.multipleValues;\n        },\n        render({ field, getBind, Label }) {\n            return <FieldRenderer field={field} getBind={getBind} Label={Label} />;\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":"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"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_dotPropImmutable","_i18n","_Grid","_utils","_components","_styled","_File","_templateObject","_templateObject2","_templateObject3","_templateObject4","t","i18n","ns","FileUploadWrapper","styled","target","label","position","opacity","pointerEvents","color","InnerImageFieldWrapper","background","height","width","boxSizing","backgroundColor","border","display","justifyContent","alignItems","flexBasis","maxHeight","padding","img","FieldRenderer","_ref","getBind","Label","field","Bind","imagesOnly","settings","default","createElement","bind","onChange","value","Array","isArray","filter","Boolean","className","imageWrapperStyles","FileManager","multiple","images","render","_ref2","showFileManager","selectFiles","index","arguments","length","undefined","files","urls","map","f","src","concat","_toConsumableArray2","slice","GridInner","Cell","span","Fragment","url","key","onRemove","dotProp","delete","placeholder","_taggedTemplateLiteral2","Object","assign","defaultProps","validation","isValid","styles","plugin","type","name","renderer","rendererName","description","canUse","_ref3","multipleValues","_ref4","_default","exports"],"sources":["fileFields.tsx"],"sourcesContent":["import React from \"react\";\nimport dotProp from \"dot-prop-immutable\";\nimport { CmsModelField, CmsModelFieldRendererPlugin } from \"~/types\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { Cell, GridInner } from \"@webiny/ui/Grid\";\nimport { imageWrapperStyles } from \"./utils\";\nimport { FileManager } from \"@webiny/app-admin/components\";\nimport styled from \"@emotion/styled\";\nimport File from \"./File\";\nimport { GetBindCallable } from \"~/admin/components/ContentEntryForm/useBind\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/file\");\n\nconst FileUploadWrapper = styled(\"div\")({\n    position: \"relative\",\n    \".disabled\": {\n        opacity: 0.75,\n        pointerEvents: \"none\"\n    },\n    \".mdc-text-field-helper-text\": {\n        color: \"var(--mdc-theme-text-secondary-on-background)\"\n    }\n});\n\nconst InnerImageFieldWrapper = styled(\"div\")({\n    background: \"repeating-conic-gradient(#efefef 0% 25%, transparent 0% 50%) 50%/25px 25px\",\n    height: \"100%\",\n    width: \"100%\",\n    boxSizing: \"border-box\",\n    backgroundColor: \"#fff\",\n    border: \"1px solid var(--mdc-theme-background)\",\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n    flexBasis: \"100%\",\n    maxHeight: \"180px\",\n    padding: \"30px\",\n    \">div\": {\n        maxHeight: \"180px\",\n        img: {\n            padding: \"15px\"\n        }\n    }\n});\n\ninterface FieldRendererProps {\n    getBind: GetBindCallable;\n    Label: React.FC;\n    field: CmsModelField;\n}\nconst FieldRenderer: React.FC<FieldRendererProps> = ({ getBind, Label, field }) => {\n    const Bind = getBind();\n\n    const imagesOnly = field.settings && field.settings.imagesOnly;\n\n    return (\n        <Bind>\n            {bind => {\n                const { onChange } = bind;\n\n                // We need to make sure the value is an array, since this is a multi-value component.\n                const value: string[] = (\n                    Array.isArray(bind.value) ? bind.value : [bind.value]\n                ).filter(Boolean);\n\n                return (\n                    <FileUploadWrapper className={imageWrapperStyles}>\n                        <FileManager\n                            multiple\n                            images={imagesOnly}\n                            render={({ showFileManager }) => {\n                                const selectFiles = (index = -1) => {\n                                    showFileManager(files => {\n                                        const urls = files.map(f => f.src);\n                                        if (index === -1) {\n                                            onChange([...value, ...urls]);\n                                        } else {\n                                            onChange([\n                                                ...value.slice(0, index),\n                                                ...urls,\n                                                ...value.slice(index + 1)\n                                            ]);\n                                        }\n                                    });\n                                };\n                                return (\n                                    <GridInner>\n                                        <Cell span={12}>\n                                            <Label>{field.label}</Label>\n                                        </Cell>\n\n                                        <>\n                                            {value.map((url: string, index: number) => (\n                                                <Cell span={3} key={url}>\n                                                    <InnerImageFieldWrapper>\n                                                        <File\n                                                            url={url}\n                                                            showFileManager={() =>\n                                                                selectFiles(index)\n                                                            }\n                                                            onRemove={() =>\n                                                                onChange(\n                                                                    dotProp.delete(value, index)\n                                                                )\n                                                            }\n                                                            placeholder={t`Select a file\"`}\n                                                            data-testid={`fr.input.file.${field.label}.${index}`}\n                                                        />\n                                                    </InnerImageFieldWrapper>\n                                                </Cell>\n                                            ))}\n                                        </>\n\n                                        <Cell span={3}>\n                                            <InnerImageFieldWrapper>\n                                                <File\n                                                    url={\"\"}\n                                                    onRemove={() => {\n                                                        return void 0;\n                                                    }}\n                                                    {...bind}\n                                                    showFileManager={() => selectFiles()}\n                                                    placeholder={t`Select a file\"`}\n                                                    data-testid={`fr.input.file.${field.label}`}\n                                                />\n                                            </InnerImageFieldWrapper>\n                                        </Cell>\n                                    </GridInner>\n                                );\n                            }}\n                        />\n                    </FileUploadWrapper>\n                );\n            }}\n        </Bind>\n    );\n};\n/**\n * Not used?\n */\n// TODO @ts-refactor\nFieldRenderer.defaultProps = {\n    validation: {\n        isValid: null\n    },\n    styles: { width: \"100%\", height: \"auto\" }\n} as Partial<FieldRendererProps>;\n\nconst plugin: CmsModelFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-files\",\n    renderer: {\n        rendererName: \"file-inputs\",\n        name: t`File Inputs`,\n        description: t`Enables selecting multiple files via File Manager.`,\n        canUse({ field }) {\n            return field.type === \"file\" && !!field.multipleValues;\n        },\n        render({ field, getBind, Label }) {\n            return <FieldRenderer field={field} getBind={getBind} Label={Label} />;\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":"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"}

package/admin/plugins/fieldRenderers/file/index.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("../../../../types").CmsModelFieldRendererPlugin[];
+declare const _default: import("@webiny/app-headless-cms-common/types").CmsModelFieldRendererPlugin[];
 export default _default;

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

@@ -1 +1 @@
-{"version":3,"names":["fileField","fileFields"],"sources":["index.ts"],"sourcesContent":["import fileField from \"./fileField\";\nimport fileFields from \"./fileFields\";\n\nexport default [fileField, fileFields];\n"],"mappings":";;;;;;;AAAA;AACA;AAAsC,eAEvB,CAACA,kBAAS,EAAEC,mBAAU,CAAC;AAAA"}
+{"version":3,"names":["_fileField","_interopRequireDefault","require","_fileFields","_default","fileField","fileFields","exports","default"],"sources":["index.ts"],"sourcesContent":["import fileField from \"./fileField\";\nimport fileFields from \"./fileFields\";\n\nexport default [fileField, fileFields];\n"],"mappings":";;;;;;;AAAA,IAAAA,UAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,WAAA,GAAAF,sBAAA,CAAAC,OAAA;AAAsC,IAAAE,QAAA,GAEvB,CAACC,kBAAS,EAAEC,mBAAU,CAAC;AAAAC,OAAA,CAAAC,OAAA,GAAAJ,QAAA"}

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

@@ -8,7 +8,7 @@ exports.imageWrapperStyles = exports.imagePlugins = exports.createRenderImagePre
 var React = _interopRequireWildcard(require("react"));
 var _emotion = require("emotion");
 var _round_insert_drive_file24px = require("../../fields/icons/round_insert_drive_file-24px.svg");
-var imagePlugins = [".jpg", ".jpeg", ".gif", ".png", ".svg"];
+var imagePlugins = [".jpg", ".jpeg", ".gif", ".png", ".svg", ".webp"];
 exports.imagePlugins = imagePlugins;
 var imageWrapperStyles = /*#__PURE__*/(0, _emotion.css)({
   height: "auto"

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

@@ -1 +1 @@
-{"version":3,"names":["imagePlugins","imageWrapperStyles","css","height","fileLabel","padding","whiteSpace","overflow","textOverflow","fontSize","color","backgroundColor","IconWrapperStyle","display","justifyContent","alignItems","IconStyle","width","createRenderImagePreview","value","imagePreviewProps","fileName","getFileName","renderImagePreview","renderImageProps","split","pop"],"sources":["utils.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { css } from \"emotion\";\nimport { ReactComponent as FileIcon } from \"../../fields/icons/round_insert_drive_file-24px.svg\";\n\nexport const imagePlugins = [\".jpg\", \".jpeg\", \".gif\", \".png\", \".svg\"];\n\nexport const imageWrapperStyles = css({\n    height: \"auto\"\n});\n\nconst fileLabel = css({\n    padding: \"10px\",\n    whiteSpace: \"nowrap\",\n    overflow: \"hidden\",\n    textOverflow: \"ellipsis\",\n    fontSize: \"0.8rem\",\n    color: \"var(--mdc-theme-on-surface)\",\n    backgroundColor: \"var(--mdc-theme-on-background)\"\n});\n\nconst IconWrapperStyle = css({\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n    height: 200\n});\n\nconst IconStyle = css({\n    width: 64,\n    height: 64\n});\n\ninterface CreateRenderImagePreviewProps {\n    value: string;\n    // TODO @ts-refactor figure out correct type\n    imagePreviewProps: any;\n}\ninterface RenderImageProps {\n    [key: string]: string;\n}\nexport const createRenderImagePreview = ({\n    value,\n    imagePreviewProps\n}: CreateRenderImagePreviewProps) => {\n    const fileName = getFileName(value);\n\n    const renderImagePreview = (renderImageProps: RenderImageProps) => {\n        return (\n            <div {...renderImageProps} {...imagePreviewProps}>\n                <div className={IconWrapperStyle}>\n                    <FileIcon className={IconStyle} />\n                </div>\n                <div className={fileLabel}>{fileName}</div>\n            </div>\n        );\n    };\n    return renderImagePreview;\n};\n\nconst getFileName = (value?: string): string => {\n    if (!value) {\n        return \"unknown\";\n    }\n    return value.split(\"/\").pop() || \"unknown\";\n};\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AAEO,IAAMA,YAAY,GAAG,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC;AAAC;AAE/D,IAAMC,kBAAkB,gBAAG,IAAAC,YAAG,EAAC;EAClCC,MAAM,EAAE;AACZ,CAAC,8BAAC;AAAC;AAEH,IAAMC,SAAS,gBAAG,IAAAF,YAAG,EAAC;EAClBG,OAAO,EAAE,MAAM;EACfC,UAAU,EAAE,QAAQ;EACpBC,QAAQ,EAAE,QAAQ;EAClBC,YAAY,EAAE,UAAU;EACxBC,QAAQ,EAAE,QAAQ;EAClBC,KAAK,EAAE,6BAA6B;EACpCC,eAAe,EAAE;AACrB,CAAC,qBAAC;AAEF,IAAMC,gBAAgB,gBAAG,IAAAV,YAAG,EAAC;EACzBW,OAAO,EAAE,MAAM;EACfC,cAAc,EAAE,QAAQ;EACxBC,UAAU,EAAE,QAAQ;EACpBZ,MAAM,EAAE;AACZ,CAAC,4BAAC;AAEF,IAAMa,SAAS,gBAAG,IAAAd,YAAG,EAAC;EAClBe,KAAK,EAAE,EAAE;EACTd,MAAM,EAAE;AACZ,CAAC,qBAAC;AAUK,IAAMe,wBAAwB,GAAG,SAA3BA,wBAAwB,OAGA;EAAA,IAFjCC,KAAK,QAALA,KAAK;IACLC,iBAAiB,QAAjBA,iBAAiB;EAEjB,IAAMC,QAAQ,GAAGC,WAAW,CAACH,KAAK,CAAC;EAEnC,IAAMI,kBAAkB,GAAG,SAArBA,kBAAkB,CAAIC,gBAAkC,EAAK;IAC/D,oBACI,6CAASA,gBAAgB,EAAMJ,iBAAiB,gBAC5C;MAAK,SAAS,EAAER;IAAiB,gBAC7B,oBAAC,2CAAQ;MAAC,SAAS,EAAEI;IAAU,EAAG,CAChC,eACN;MAAK,SAAS,EAAEZ;IAAU,GAAEiB,QAAQ,CAAO,CACzC;EAEd,CAAC;EACD,OAAOE,kBAAkB;AAC7B,CAAC;AAAC;AAEF,IAAMD,WAAW,GAAG,SAAdA,WAAW,CAAIH,KAAc,EAAa;EAC5C,IAAI,CAACA,KAAK,EAAE;IACR,OAAO,SAAS;EACpB;EACA,OAAOA,KAAK,CAACM,KAAK,CAAC,GAAG,CAAC,CAACC,GAAG,EAAE,IAAI,SAAS;AAC9C,CAAC"}
+{"version":3,"names":["React","_interopRequireWildcard","require","_emotion","_round_insert_drive_file24px","imagePlugins","exports","imageWrapperStyles","css","height","fileLabel","padding","whiteSpace","overflow","textOverflow","fontSize","color","backgroundColor","IconWrapperStyle","display","justifyContent","alignItems","IconStyle","width","createRenderImagePreview","_ref","value","imagePreviewProps","fileName","getFileName","renderImagePreview","renderImageProps","createElement","Object","assign","className","ReactComponent","split","pop"],"sources":["utils.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { css } from \"emotion\";\nimport { ReactComponent as FileIcon } from \"../../fields/icons/round_insert_drive_file-24px.svg\";\n\nexport const imagePlugins = [\".jpg\", \".jpeg\", \".gif\", \".png\", \".svg\", \".webp\"];\n\nexport const imageWrapperStyles = css({\n    height: \"auto\"\n});\n\nconst fileLabel = css({\n    padding: \"10px\",\n    whiteSpace: \"nowrap\",\n    overflow: \"hidden\",\n    textOverflow: \"ellipsis\",\n    fontSize: \"0.8rem\",\n    color: \"var(--mdc-theme-on-surface)\",\n    backgroundColor: \"var(--mdc-theme-on-background)\"\n});\n\nconst IconWrapperStyle = css({\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n    height: 200\n});\n\nconst IconStyle = css({\n    width: 64,\n    height: 64\n});\n\ninterface CreateRenderImagePreviewProps {\n    value: string;\n    // TODO @ts-refactor figure out correct type\n    imagePreviewProps: any;\n}\ninterface RenderImageProps {\n    [key: string]: string;\n}\nexport const createRenderImagePreview = ({\n    value,\n    imagePreviewProps\n}: CreateRenderImagePreviewProps) => {\n    const fileName = getFileName(value);\n\n    const renderImagePreview = (renderImageProps: RenderImageProps) => {\n        return (\n            <div {...renderImageProps} {...imagePreviewProps}>\n                <div className={IconWrapperStyle}>\n                    <FileIcon className={IconStyle} />\n                </div>\n                <div className={fileLabel}>{fileName}</div>\n            </div>\n        );\n    };\n    return renderImagePreview;\n};\n\nconst getFileName = (value?: string): string => {\n    if (!value) {\n        return \"unknown\";\n    }\n    return value.split(\"/\").pop() || \"unknown\";\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,KAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,4BAAA,GAAAF,OAAA;AAEO,IAAMG,YAAY,GAAG,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC;AAACC,OAAA,CAAAD,YAAA,GAAAA,YAAA;AAExE,IAAME,kBAAkB,gBAAG,IAAAC,YAAG,EAAC;EAClCC,MAAM,EAAE;AACZ,CAAC,8BAAC;AAACH,OAAA,CAAAC,kBAAA,GAAAA,kBAAA;AAEH,IAAMG,SAAS,gBAAG,IAAAF,YAAG,EAAC;EAClBG,OAAO,EAAE,MAAM;EACfC,UAAU,EAAE,QAAQ;EACpBC,QAAQ,EAAE,QAAQ;EAClBC,YAAY,EAAE,UAAU;EACxBC,QAAQ,EAAE,QAAQ;EAClBC,KAAK,EAAE,6BAA6B;EACpCC,eAAe,EAAE;AACrB,CAAC,qBAAC;AAEF,IAAMC,gBAAgB,gBAAG,IAAAV,YAAG,EAAC;EACzBW,OAAO,EAAE,MAAM;EACfC,cAAc,EAAE,QAAQ;EACxBC,UAAU,EAAE,QAAQ;EACpBZ,MAAM,EAAE;AACZ,CAAC,4BAAC;AAEF,IAAMa,SAAS,gBAAG,IAAAd,YAAG,EAAC;EAClBe,KAAK,EAAE,EAAE;EACTd,MAAM,EAAE;AACZ,CAAC,qBAAC;AAUK,IAAMe,wBAAwB,GAAG,SAA3BA,wBAAwBA,CAAAC,IAAA,EAGA;EAAA,IAFjCC,KAAK,GAAAD,IAAA,CAALC,KAAK;IACLC,iBAAiB,GAAAF,IAAA,CAAjBE,iBAAiB;EAEjB,IAAMC,QAAQ,GAAGC,WAAW,CAACH,KAAK,CAAC;EAEnC,IAAMI,kBAAkB,GAAG,SAArBA,kBAAkBA,CAAIC,gBAAkC,EAAK;IAC/D,oBACI/B,KAAA,CAAAgC,aAAA,QAAAC,MAAA,CAAAC,MAAA,KAASH,gBAAgB,EAAMJ,iBAAiB,gBAC5C3B,KAAA,CAAAgC,aAAA;MAAKG,SAAS,EAAEjB;IAAiB,gBAC7BlB,KAAA,CAAAgC,aAAA,CAAC5B,4BAAA,CAAAgC,cAAQ;MAACD,SAAS,EAAEb;IAAU,CAAE,CAChC,CAAC,eACNtB,KAAA,CAAAgC,aAAA;MAAKG,SAAS,EAAEzB;IAAU,GAAEkB,QAAc,CACzC,CAAC;EAEd,CAAC;EACD,OAAOE,kBAAkB;AAC7B,CAAC;AAACxB,OAAA,CAAAkB,wBAAA,GAAAA,wBAAA;AAEF,IAAMK,WAAW,GAAG,SAAdA,WAAWA,CAAIH,KAAc,EAAa;EAC5C,IAAI,CAACA,KAAK,EAAE;IACR,OAAO,SAAS;EACpB;EACA,OAAOA,KAAK,CAACW,KAAK,CAAC,GAAG,CAAC,CAACC,GAAG,CAAC,CAAC,IAAI,SAAS;AAC9C,CAAC"}

package/admin/plugins/fieldRenderers/lexicalText/index.d.ts

@@ -0,0 +1 @@
+export declare const createLexicalInput: () => import("@webiny/app-headless-cms-common/types").CmsModelFieldRendererPlugin[];

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

@@ -0,0 +1,13 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createLexicalInput = void 0;
+var _lexicalTextInput = _interopRequireDefault(require("./lexicalTextInput"));
+var _lexicalTextInputs = _interopRequireDefault(require("./lexicalTextInputs"));
+var createLexicalInput = function createLexicalInput() {
+  return [_lexicalTextInput.default, _lexicalTextInputs.default];
+};
+exports.createLexicalInput = createLexicalInput;

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

@@ -0,0 +1 @@
+{"version":3,"names":["_lexicalTextInput","_interopRequireDefault","require","_lexicalTextInputs","createLexicalInput","lexicalTextInput","lexicalTextInputs","exports"],"sources":["index.ts"],"sourcesContent":["import lexicalTextInput from \"./lexicalTextInput\";\nimport lexicalTextInputs from \"./lexicalTextInputs\";\nexport const createLexicalInput = () => {\n    return [lexicalTextInput, lexicalTextInputs];\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,kBAAA,GAAAF,sBAAA,CAAAC,OAAA;AACO,IAAME,kBAAkB,GAAG,SAArBA,kBAAkBA,CAAA,EAAS;EACpC,OAAO,CAACC,yBAAgB,EAAEC,0BAAiB,CAAC;AAChD,CAAC;AAACC,OAAA,CAAAH,kBAAA,GAAAA,kBAAA"}

package/admin/plugins/fieldRenderers/lexicalText/lexicalTextInput.d.ts

@@ -0,0 +1,3 @@
+import { CmsEditorFieldRendererPlugin } from "../../../../types";
+declare const plugin: CmsEditorFieldRendererPlugin;
+export default plugin;

package/admin/plugins/fieldRenderers/lexicalText/lexicalTextInput.js

@@ -0,0 +1,53 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _react = _interopRequireDefault(require("react"));
+var _get = _interopRequireDefault(require("lodash/get"));
+var _i18n = require("@webiny/app/i18n");
+var _LexicalCmsEditor = require("../../../components/LexicalCmsEditor/LexicalCmsEditor");
+var _utils = require("../richText/utils");
+var _templateObject, _templateObject2;
+var t = _i18n.i18n.ns("app-headless-cms/admin/fields/rich-text");
+var getKey = function getKey(field, bind) {
+  var formId = bind.form.data.id || "new";
+  return "".concat(formId, ".").concat(field.fieldId);
+};
+var plugin = {
+  type: "cms-editor-field-renderer",
+  name: "cms-editor-field-renderer-lexical",
+  renderer: {
+    rendererName: "lexical-text-input",
+    name: t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Lexical Text Input"]))),
+    description: t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["Renders a lexical text editor."]))),
+    canUse: function canUse(_ref) {
+      var field = _ref.field,
+        model = _ref.model;
+      var canUse = field.type === "rich-text" && !field.multipleValues && !(0, _get.default)(field, "predefinedValues.enabled");
+      if (canUse && (0, _utils.modelHasLegacyRteField)(model)) {
+        return false;
+      }
+      return canUse;
+    },
+    render: function render(_ref2) {
+      var field = _ref2.field,
+        getBind = _ref2.getBind;
+      var Bind = getBind();
+      return /*#__PURE__*/_react.default.createElement(Bind, null, function (bind) {
+        return /*#__PURE__*/_react.default.createElement(_LexicalCmsEditor.LexicalCmsEditor, {
+          value: bind.value,
+          onChange: bind.onChange,
+          key: getKey(field, bind),
+          placeholder: field.placeholderText,
+          "data-testid": "fr.input.lexical.".concat(field.label)
+        });
+      });
+    }
+  }
+};
+var _default = plugin;
+exports.default = _default;

package/admin/plugins/fieldRenderers/lexicalText/lexicalTextInput.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_get","_i18n","_LexicalCmsEditor","_utils","_templateObject","_templateObject2","t","i18n","ns","getKey","field","bind","formId","form","data","id","concat","fieldId","plugin","type","name","renderer","rendererName","_taggedTemplateLiteral2","default","description","canUse","_ref","model","multipleValues","get","modelHasLegacyRteField","render","_ref2","getBind","Bind","createElement","LexicalCmsEditor","value","onChange","key","placeholder","placeholderText","label","_default","exports"],"sources":["lexicalTextInput.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { CmsEditorContentEntry, CmsModelField, CmsEditorFieldRendererPlugin } from \"~/types\";\nimport { BindComponentRenderProp } from \"@webiny/form\";\nimport { LexicalCmsEditor } from \"~/admin/components/LexicalCmsEditor/LexicalCmsEditor\";\nimport { modelHasLegacyRteField } from \"~/admin/plugins/fieldRenderers/richText/utils\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/rich-text\");\n\nconst getKey = (\n    field: CmsModelField,\n    bind: BindComponentRenderProp<string, CmsEditorContentEntry>\n): string => {\n    const formId = bind.form.data.id || \"new\";\n    return `${formId}.${field.fieldId}`;\n};\n\nconst plugin: CmsEditorFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-lexical\",\n    renderer: {\n        rendererName: \"lexical-text-input\",\n        name: t`Lexical Text Input`,\n        description: t`Renders a lexical text editor.`,\n        canUse({ field, model }) {\n            const canUse =\n                field.type === \"rich-text\" &&\n                !field.multipleValues &&\n                !get(field, \"predefinedValues.enabled\");\n\n            if (canUse && modelHasLegacyRteField(model)) {\n                return false;\n            }\n\n            return canUse;\n        },\n        render({ field, getBind }) {\n            const Bind = getBind();\n            return (\n                <Bind>\n                    {bind => {\n                        return (\n                            <LexicalCmsEditor\n                                value={bind.value}\n                                onChange={bind.onChange}\n                                key={getKey(field, bind as any)}\n                                placeholder={field.placeholderText}\n                                data-testid={`fr.input.lexical.${field.label}`}\n                            />\n                        );\n                    }}\n                </Bind>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,IAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AAGA,IAAAG,iBAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA;AAAuF,IAAAK,eAAA,EAAAC,gBAAA;AAEvF,IAAMC,CAAC,GAAGC,UAAI,CAACC,EAAE,CAAC,yCAAyC,CAAC;AAE5D,IAAMC,MAAM,GAAG,SAATA,MAAMA,CACRC,KAAoB,EACpBC,IAA4D,EACnD;EACT,IAAMC,MAAM,GAAGD,IAAI,CAACE,IAAI,CAACC,IAAI,CAACC,EAAE,IAAI,KAAK;EACzC,UAAAC,MAAA,CAAUJ,MAAM,OAAAI,MAAA,CAAIN,KAAK,CAACO,OAAO;AACrC,CAAC;AAED,IAAMC,MAAoC,GAAG;EACzCC,IAAI,EAAE,2BAA2B;EACjCC,IAAI,EAAE,mCAAmC;EACzCC,QAAQ,EAAE;IACNC,YAAY,EAAE,oBAAoB;IAClCF,IAAI,EAAEd,CAAC,CAAAF,eAAA,KAAAA,eAAA,OAAAmB,uBAAA,CAAAC,OAAA,2BAAoB;IAC3BC,WAAW,EAAEnB,CAAC,CAAAD,gBAAA,KAAAA,gBAAA,OAAAkB,uBAAA,CAAAC,OAAA,uCAAgC;IAC9CE,MAAM,WAAAA,OAAAC,IAAA,EAAmB;MAAA,IAAhBjB,KAAK,GAAAiB,IAAA,CAALjB,KAAK;QAAEkB,KAAK,GAAAD,IAAA,CAALC,KAAK;MACjB,IAAMF,MAAM,GACRhB,KAAK,CAACS,IAAI,KAAK,WAAW,IAC1B,CAACT,KAAK,CAACmB,cAAc,IACrB,CAAC,IAAAC,YAAG,EAACpB,KAAK,EAAE,0BAA0B,CAAC;MAE3C,IAAIgB,MAAM,IAAI,IAAAK,6BAAsB,EAACH,KAAK,CAAC,EAAE;QACzC,OAAO,KAAK;MAChB;MAEA,OAAOF,MAAM;IACjB,CAAC;IACDM,MAAM,WAAAA,OAAAC,KAAA,EAAqB;MAAA,IAAlBvB,KAAK,GAAAuB,KAAA,CAALvB,KAAK;QAAEwB,OAAO,GAAAD,KAAA,CAAPC,OAAO;MACnB,IAAMC,IAAI,GAAGD,OAAO,CAAC,CAAC;MACtB,oBACIrC,MAAA,CAAA2B,OAAA,CAAAY,aAAA,CAACD,IAAI,QACA,UAAAxB,IAAI,EAAI;QACL,oBACId,MAAA,CAAA2B,OAAA,CAAAY,aAAA,CAAClC,iBAAA,CAAAmC,gBAAgB;UACbC,KAAK,EAAE3B,IAAI,CAAC2B,KAAM;UAClBC,QAAQ,EAAE5B,IAAI,CAAC4B,QAAS;UACxBC,GAAG,EAAE/B,MAAM,CAACC,KAAK,EAAEC,IAAW,CAAE;UAChC8B,WAAW,EAAE/B,KAAK,CAACgC,eAAgB;UACnC,mCAAA1B,MAAA,CAAiCN,KAAK,CAACiC,KAAK;QAAG,CAClD,CAAC;MAEV,CACE,CAAC;IAEf;EACJ;AACJ,CAAC;AAAC,IAAAC,QAAA,GAEa1B,MAAM;AAAA2B,OAAA,CAAArB,OAAA,GAAAoB,QAAA"}

package/admin/plugins/fieldRenderers/lexicalText/lexicalTextInputs.d.ts

@@ -0,0 +1,3 @@
+import { CmsEditorFieldRendererPlugin } from "../../../../types";
+declare const plugin: CmsEditorFieldRendererPlugin;
+export default plugin;

package/admin/plugins/fieldRenderers/lexicalText/lexicalTextInputs.js

@@ -0,0 +1,74 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _react = _interopRequireDefault(require("react"));
+var _get = _interopRequireDefault(require("lodash/get"));
+var _i18n = require("@webiny/app/i18n");
+var _close = require("../../../icons/close.svg");
+var _DynamicSection = _interopRequireDefault(require("../DynamicSection"));
+var _Button = require("@webiny/ui/Button");
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+var _LexicalCmsEditor = require("../../../components/LexicalCmsEditor/LexicalCmsEditor");
+var _utils = require("../richText/utils");
+var _templateObject, _templateObject2;
+var t = _i18n.i18n.ns("app-headless-cms/admin/fields/rich-text");
+var getKey = function getKey(field, bind, index) {
+  var _bind$index$form, _bind$index$form$data;
+  var formId = ((_bind$index$form = bind.index.form) === null || _bind$index$form === void 0 ? void 0 : (_bind$index$form$data = _bind$index$form.data) === null || _bind$index$form$data === void 0 ? void 0 : _bind$index$form$data.id) || "new";
+  return "".concat(formId, ".").concat(field.fieldId, ".").concat(index);
+};
+var EditorWrapper = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "esuszrr0",
+  label: "EditorWrapper"
+})({
+  position: "relative",
+  "> button": {
+    position: "absolute",
+    top: 0,
+    right: 5,
+    zIndex: 10
+  }
+});
+var plugin = {
+  type: "cms-editor-field-renderer",
+  name: "cms-editor-field-renderer-lexical-inputs",
+  renderer: {
+    rendererName: "lexical-text-inputs",
+    name: t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Lexical Text Inputs"]))),
+    description: t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["Renders a list of lexical editors."]))),
+    canUse: function canUse(_ref) {
+      var field = _ref.field,
+        model = _ref.model;
+      var canUse = field.type === "rich-text" && !!field.multipleValues && !(0, _get.default)(field, "predefinedValues.enabled");
+      if (canUse && (0, _utils.modelHasLegacyRteField)(model)) {
+        return false;
+      }
+      return canUse;
+    },
+    render: function render(props) {
+      var field = props.field;
+      return /*#__PURE__*/_react.default.createElement(_DynamicSection.default, props, function (_ref2) {
+        var bind = _ref2.bind,
+          index = _ref2.index;
+        return /*#__PURE__*/_react.default.createElement(EditorWrapper, null, /*#__PURE__*/_react.default.createElement(_LexicalCmsEditor.LexicalCmsEditor, {
+          value: bind.index.value,
+          onChange: bind.index.onChange,
+          key: getKey(field, bind, index),
+          placeholder: field.placeholderText
+        }), index > 0 && /*#__PURE__*/_react.default.createElement(_Button.IconButton, {
+          icon: /*#__PURE__*/_react.default.createElement(_close.ReactComponent, null),
+          onClick: function onClick() {
+            return bind.field.removeValue(index);
+          }
+        }));
+      });
+    }
+  }
+};
+var _default = plugin;
+exports.default = _default;

package/admin/plugins/fieldRenderers/lexicalText/lexicalTextInputs.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_get","_i18n","_close","_DynamicSection","_Button","_styled","_LexicalCmsEditor","_utils","_templateObject","_templateObject2","t","i18n","ns","getKey","field","bind","index","_bind$index$form","_bind$index$form$data","formId","form","data","id","concat","fieldId","EditorWrapper","styled","target","label","position","top","right","zIndex","plugin","type","name","renderer","rendererName","_taggedTemplateLiteral2","default","description","canUse","_ref","model","multipleValues","get","modelHasLegacyRteField","render","props","createElement","_ref2","LexicalCmsEditor","value","onChange","key","placeholder","placeholderText","IconButton","icon","ReactComponent","onClick","removeValue","_default","exports"],"sources":["lexicalTextInputs.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { CmsModelField, CmsEditorFieldRendererPlugin } from \"~/types\";\nimport { ReactComponent as DeleteIcon } from \"~/admin/icons/close.svg\";\nimport DynamicSection, { DynamicSectionPropsChildrenParams } from \"../DynamicSection\";\nimport { IconButton } from \"@webiny/ui/Button\";\nimport styled from \"@emotion/styled\";\nimport { LexicalCmsEditor } from \"~/admin/components/LexicalCmsEditor/LexicalCmsEditor\";\nimport { modelHasLegacyRteField } from \"~/admin/plugins/fieldRenderers/richText/utils\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/rich-text\");\n\nconst getKey = (\n    field: CmsModelField,\n    bind: DynamicSectionPropsChildrenParams[\"bind\"],\n    index: number\n): string => {\n    const formId = bind.index.form?.data?.id || \"new\";\n    return `${formId}.${field.fieldId}.${index}`;\n};\n\nconst EditorWrapper = styled(\"div\")({\n    position: \"relative\",\n    \"> button\": {\n        position: \"absolute\",\n        top: 0,\n        right: 5,\n        zIndex: 10\n    }\n});\n\nconst plugin: CmsEditorFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-lexical-inputs\",\n    renderer: {\n        rendererName: \"lexical-text-inputs\",\n        name: t`Lexical Text Inputs`,\n        description: t`Renders a list of lexical editors.`,\n        canUse({ field, model }) {\n            const canUse =\n                field.type === \"rich-text\" &&\n                !!field.multipleValues &&\n                !get(field, \"predefinedValues.enabled\");\n\n            if (canUse && modelHasLegacyRteField(model)) {\n                return false;\n            }\n\n            return canUse;\n        },\n        render(props) {\n            const { field } = props;\n            return (\n                <DynamicSection {...props}>\n                    {({ bind, index }) => (\n                        <EditorWrapper>\n                            <LexicalCmsEditor\n                                value={bind.index.value}\n                                onChange={bind.index.onChange}\n                                key={getKey(field, bind, index)}\n                                placeholder={field.placeholderText}\n                            />\n                            {index > 0 && (\n                                <IconButton\n                                    icon={<DeleteIcon />}\n                                    onClick={() => bind.field.removeValue(index)}\n                                />\n                            )}\n                        </EditorWrapper>\n                    )}\n                </DynamicSection>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":"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"}

package/admin/plugins/fieldRenderers/lexicalText/utils.d.ts

@@ -0,0 +1,2 @@
+import { CmsModel } from "@webiny/app-headless-cms-common/types";
+export declare const modelHasLexicalField: (model: CmsModel) => boolean;

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

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.modelHasLexicalField = void 0;
+var modelHasLexicalField = function modelHasLexicalField(model) {
+  return model.fields.some(function (field) {
+    return field.renderer.name.startsWith("lexical-");
+  });
+};
+exports.modelHasLexicalField = modelHasLexicalField;

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

@@ -0,0 +1 @@
+{"version":3,"names":["modelHasLexicalField","model","fields","some","field","renderer","name","startsWith","exports"],"sources":["utils.ts"],"sourcesContent":["import { CmsModel } from \"@webiny/app-headless-cms-common/types\";\n\nexport const modelHasLexicalField = (model: CmsModel): boolean => {\n    return model.fields.some(field => field.renderer.name.startsWith(\"lexical-\"));\n};\n"],"mappings":";;;;;;AAEO,IAAMA,oBAAoB,GAAG,SAAvBA,oBAAoBA,CAAIC,KAAe,EAAc;EAC9D,OAAOA,KAAK,CAACC,MAAM,CAACC,IAAI,CAAC,UAAAC,KAAK;IAAA,OAAIA,KAAK,CAACC,QAAQ,CAACC,IAAI,CAACC,UAAU,CAAC,UAAU,CAAC;EAAA,EAAC;AACjF,CAAC;AAACC,OAAA,CAAAR,oBAAA,GAAAA,oBAAA"}

package/admin/plugins/fieldRenderers/longText/index.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("../../../../types").CmsModelFieldRendererPlugin[];
+declare const _default: import("@webiny/app-headless-cms-common/types").CmsModelFieldRendererPlugin[];
 export default _default;

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

@@ -1 +1 @@
-{"version":3,"names":["longText","longTexts"],"sources":["index.ts"],"sourcesContent":["import longText from \"./longText\";\nimport longTexts from \"./longTexts\";\n\nexport default [longText, longTexts];\n"],"mappings":";;;;;;;AAAA;AACA;AAAoC,eAErB,CAACA,iBAAQ,EAAEC,kBAAS,CAAC;AAAA"}
+{"version":3,"names":["_longText","_interopRequireDefault","require","_longTexts","_default","longText","longTexts","exports","default"],"sources":["index.ts"],"sourcesContent":["import longText from \"./longText\";\nimport longTexts from \"./longTexts\";\n\nexport default [longText, longTexts];\n"],"mappings":";;;;;;;AAAA,IAAAA,SAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,UAAA,GAAAF,sBAAA,CAAAC,OAAA;AAAoC,IAAAE,QAAA,GAErB,CAACC,iBAAQ,EAAEC,kBAAS,CAAC;AAAAC,OAAA,CAAAC,OAAA,GAAAJ,QAAA"}

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

@@ -1 +1 @@
-{"version":3,"names":["t","i18n","ns","plugin","type","name","renderer","rendererName","description","canUse","field","multipleValues","get","render","getBind","Bind","bind","label","placeholderText","helpText"],"sources":["longText.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get\";\nimport { CmsEditorFieldRendererPlugin } from \"~/types\";\nimport { Input } from \"@webiny/ui/Input\";\nimport { i18n } from \"@webiny/app/i18n\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/text\");\n\nconst plugin: CmsEditorFieldRendererPlugin = {\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                        <Input\n                            {...bind}\n                            rows={5}\n                            label={field.label}\n                            placeholder={field.placeholderText}\n                            description={field.helpText}\n                            data-testid={`fr.input.longtext.${field.label}`}\n                        />\n                    )}\n                </Bind>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;AAAA;AACA;AAEA;AACA;AAAwC;AAExC,IAAMA,CAAC,GAAGC,UAAI,CAACC,EAAE,CAAC,oCAAoC,CAAC;AAEvD,IAAMC,MAAoC,GAAG;EACzCC,IAAI,EAAE,2BAA2B;EACjCC,IAAI,EAAE,8CAA8C;EACpDC,QAAQ,EAAE;IACNC,YAAY,EAAE,qBAAqB;IACnCF,IAAI,EAAEL,CAAC,4FAAW;IAClBQ,WAAW,EAAER,CAAC,qJAAkE;IAChFS,MAAM,wBAAY;MAAA,IAATC,KAAK,QAALA,KAAK;MACV,OACIA,KAAK,CAACN,IAAI,KAAK,WAAW,IAC1B,CAACM,KAAK,CAACC,cAAc,IACrB,CAAC,IAAAC,YAAG,EAACF,KAAK,EAAE,0BAA0B,CAAC;IAE/C,CAAC;IACDG,MAAM,yBAAqB;MAAA,IAAlBH,KAAK,SAALA,KAAK;QAAEI,OAAO,SAAPA,OAAO;MACnB,IAAMC,IAAI,GAAGD,OAAO,EAAE;MAEtB,oBACI,6BAAC,IAAI,QACA,UAAAE,IAAI;QAAA,oBACD,6BAAC,YAAK,oBACEA,IAAI;UACR,IAAI,EAAE,CAAE;UACR,KAAK,EAAEN,KAAK,CAACO,KAAM;UACnB,WAAW,EAAEP,KAAK,CAACQ,eAAgB;UACnC,WAAW,EAAER,KAAK,CAACS,QAAS;UAC5B,2CAAkCT,KAAK,CAACO,KAAK;QAAG,GAClD;MAAA,CACL,CACE;IAEf;EACJ;AACJ,CAAC;AAAC,eAEad,MAAM;AAAA"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_get","_Input","_i18n","_templateObject","_templateObject2","t","i18n","ns","plugin","type","name","renderer","rendererName","_taggedTemplateLiteral2","default","description","canUse","_ref","field","multipleValues","get","render","_ref2","getBind","Bind","createElement","bind","Input","Object","assign","rows","label","placeholder","placeholderText","helpText","concat","_default","exports"],"sources":["longText.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get\";\nimport { CmsEditorFieldRendererPlugin } from \"~/types\";\nimport { Input } from \"@webiny/ui/Input\";\nimport { i18n } from \"@webiny/app/i18n\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/text\");\n\nconst plugin: CmsEditorFieldRendererPlugin = {\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                        <Input\n                            {...bind}\n                            rows={5}\n                            label={field.label}\n                            placeholder={field.placeholderText}\n                            description={field.helpText}\n                            data-testid={`fr.input.longtext.${field.label}`}\n                        />\n                    )}\n                </Bind>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,IAAA,GAAAF,sBAAA,CAAAC,OAAA;AAEA,IAAAE,MAAA,GAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AAAwC,IAAAI,eAAA,EAAAC,gBAAA;AAExC,IAAMC,CAAC,GAAGC,UAAI,CAACC,EAAE,CAAC,oCAAoC,CAAC;AAEvD,IAAMC,MAAoC,GAAG;EACzCC,IAAI,EAAE,2BAA2B;EACjCC,IAAI,EAAE,8CAA8C;EACpDC,QAAQ,EAAE;IACNC,YAAY,EAAE,qBAAqB;IACnCF,IAAI,EAAEL,CAAC,CAAAF,eAAA,KAAAA,eAAA,OAAAU,uBAAA,CAAAC,OAAA,kBAAW;IAClBC,WAAW,EAAEV,CAAC,CAAAD,gBAAA,KAAAA,gBAAA,OAAAS,uBAAA,CAAAC,OAAA,yEAAkE;IAChFE,MAAM,WAAAA,OAAAC,IAAA,EAAY;MAAA,IAATC,KAAK,GAAAD,IAAA,CAALC,KAAK;MACV,OACIA,KAAK,CAACT,IAAI,KAAK,WAAW,IAC1B,CAACS,KAAK,CAACC,cAAc,IACrB,CAAC,IAAAC,YAAG,EAACF,KAAK,EAAE,0BAA0B,CAAC;IAE/C,CAAC;IACDG,MAAM,WAAAA,OAAAC,KAAA,EAAqB;MAAA,IAAlBJ,KAAK,GAAAI,KAAA,CAALJ,KAAK;QAAEK,OAAO,GAAAD,KAAA,CAAPC,OAAO;MACnB,IAAMC,IAAI,GAAGD,OAAO,CAAC,CAAC;MAEtB,oBACI1B,MAAA,CAAAiB,OAAA,CAAAW,aAAA,CAACD,IAAI,QACA,UAAAE,IAAI;QAAA,oBACD7B,MAAA,CAAAiB,OAAA,CAAAW,aAAA,CAACxB,MAAA,CAAA0B,KAAK,EAAAC,MAAA,CAAAC,MAAA,KACEH,IAAI;UACRI,IAAI,EAAE,CAAE;UACRC,KAAK,EAAEb,KAAK,CAACa,KAAM;UACnBC,WAAW,EAAEd,KAAK,CAACe,eAAgB;UACnClB,WAAW,EAAEG,KAAK,CAACgB,QAAS;UAC5B,oCAAAC,MAAA,CAAkCjB,KAAK,CAACa,KAAK;QAAG,EACnD,CAAC;MAAA,CAEJ,CAAC;IAEf;EACJ;AACJ,CAAC;AAAC,IAAAK,QAAA,GAEa5B,MAAM;AAAA6B,OAAA,CAAAvB,OAAA,GAAAsB,QAAA"}

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

@@ -1 +1 @@
-{"version":3,"names":["t","i18n","ns","plugin","type","name","renderer","rendererName","description","canUse","field","multipleValues","get","render","props","bind","index","number","icon","onClick","removeValue"],"sources":["longTexts.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get\";\nimport { CmsEditorFieldRendererPlugin } from \"~/types\";\nimport { Input } from \"@webiny/ui/Input\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { ReactComponent as DeleteIcon } from \"~/admin/icons/close.svg\";\nimport DynamicSection from \"../DynamicSection\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/text\");\n\nconst plugin: CmsEditorFieldRendererPlugin = {\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                        <Input\n                            {...bind.index}\n                            rows={5}\n                            label={t`Value {number}`({ number: index + 1 })}\n                            trailingIcon={\n                                index > 0 && {\n                                    icon: <DeleteIcon />,\n                                    onClick: () => bind.field.removeValue(index)\n                                }\n                            }\n                        />\n                    )}\n                </DynamicSection>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;AAAA;AACA;AAEA;AACA;AACA;AACA;AAA+C;AAE/C,IAAMA,CAAC,GAAGC,UAAI,CAACC,EAAE,CAAC,oCAAoC,CAAC;AAEvD,IAAMC,MAAoC,GAAG;EACzCC,IAAI,EAAE,2BAA2B;EACjCC,IAAI,EAAE,4CAA4C;EAClDC,QAAQ,EAAE;IACNC,YAAY,EAAE,kBAAkB;IAChCF,IAAI,EAAEL,CAAC,6FAAY;IACnBQ,WAAW,EAAER,CAAC,yHAAsC;IACpDS,MAAM,wBAAY;MAAA,IAATC,KAAK,QAALA,KAAK;MACV,OACIA,KAAK,CAACN,IAAI,KAAK,WAAW,IAC1B,CAAC,CAACM,KAAK,CAACC,cAAc,IACtB,CAAC,IAAAC,YAAG,EAACF,KAAK,EAAE,0BAA0B,CAAC;IAE/C,CAAC;IACDG,MAAM,kBAACC,KAAK,EAAE;MACV,oBACI,6BAAC,uBAAc,EAAKA,KAAK,EACpB;QAAA,IAAGC,IAAI,SAAJA,IAAI;UAAEC,KAAK,SAALA,KAAK;QAAA,oBACX,6BAAC,YAAK,oBACED,IAAI,CAACC,KAAK;UACd,IAAI,EAAE,CAAE;UACR,KAAK,EAAEhB,CAAC,oGAAiB;YAAEiB,MAAM,EAAED,KAAK,GAAG;UAAE,CAAC,CAAE;UAChD,YAAY,EACRA,KAAK,GAAG,CAAC,IAAI;YACTE,IAAI,eAAE,6BAAC,qBAAU,OAAG;YACpBC,OAAO,EAAE;cAAA,OAAMJ,IAAI,CAACL,KAAK,CAACU,WAAW,CAACJ,KAAK,CAAC;YAAA;UAChD;QACH,GACH;MAAA,CACL,CACY;IAEzB;EACJ;AACJ,CAAC;AAAC,eAEab,MAAM;AAAA"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_get","_Input","_i18n","_close","_DynamicSection","_templateObject","_templateObject2","_templateObject3","t","i18n","ns","plugin","type","name","renderer","rendererName","_taggedTemplateLiteral2","default","description","canUse","_ref","field","multipleValues","get","render","props","createElement","_ref2","bind","index","Input","Object","assign","rows","label","number","trailingIcon","icon","ReactComponent","onClick","removeValue","_default","exports"],"sources":["longTexts.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get\";\nimport { CmsEditorFieldRendererPlugin } from \"~/types\";\nimport { Input } from \"@webiny/ui/Input\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { ReactComponent as DeleteIcon } from \"~/admin/icons/close.svg\";\nimport DynamicSection from \"../DynamicSection\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/text\");\n\nconst plugin: CmsEditorFieldRendererPlugin = {\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                        <Input\n                            {...bind.index}\n                            rows={5}\n                            label={t`Value {number}`({ number: index + 1 })}\n                            trailingIcon={\n                                index > 0 && {\n                                    icon: <DeleteIcon />,\n                                    onClick: () => bind.field.removeValue(index)\n                                }\n                            }\n                        />\n                    )}\n                </DynamicSection>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,IAAA,GAAAF,sBAAA,CAAAC,OAAA;AAEA,IAAAE,MAAA,GAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA;AACA,IAAAK,eAAA,GAAAN,sBAAA,CAAAC,OAAA;AAA+C,IAAAM,eAAA,EAAAC,gBAAA,EAAAC,gBAAA;AAE/C,IAAMC,CAAC,GAAGC,UAAI,CAACC,EAAE,CAAC,oCAAoC,CAAC;AAEvD,IAAMC,MAAoC,GAAG;EACzCC,IAAI,EAAE,2BAA2B;EACjCC,IAAI,EAAE,4CAA4C;EAClDC,QAAQ,EAAE;IACNC,YAAY,EAAE,kBAAkB;IAChCF,IAAI,EAAEL,CAAC,CAAAH,eAAA,KAAAA,eAAA,OAAAW,uBAAA,CAAAC,OAAA,mBAAY;IACnBC,WAAW,EAAEV,CAAC,CAAAF,gBAAA,KAAAA,gBAAA,OAAAU,uBAAA,CAAAC,OAAA,6CAAsC;IACpDE,MAAM,WAAAA,OAAAC,IAAA,EAAY;MAAA,IAATC,KAAK,GAAAD,IAAA,CAALC,KAAK;MACV,OACIA,KAAK,CAACT,IAAI,KAAK,WAAW,IAC1B,CAAC,CAACS,KAAK,CAACC,cAAc,IACtB,CAAC,IAAAC,YAAG,EAACF,KAAK,EAAE,0BAA0B,CAAC;IAE/C,CAAC;IACDG,MAAM,WAAAA,OAACC,KAAK,EAAE;MACV,oBACI5B,MAAA,CAAAoB,OAAA,CAAAS,aAAA,CAACtB,eAAA,CAAAa,OAAc,EAAKQ,KAAK,EACpB,UAAAE,KAAA;QAAA,IAAGC,IAAI,GAAAD,KAAA,CAAJC,IAAI;UAAEC,KAAK,GAAAF,KAAA,CAALE,KAAK;QAAA,oBACXhC,MAAA,CAAAoB,OAAA,CAAAS,aAAA,CAACzB,MAAA,CAAA6B,KAAK,EAAAC,MAAA,CAAAC,MAAA,KACEJ,IAAI,CAACC,KAAK;UACdI,IAAI,EAAE,CAAE;UACRC,KAAK,EAAE1B,CAAC,CAAAD,gBAAA,KAAAA,gBAAA,OAAAS,uBAAA,CAAAC,OAAA,wBAAiB;YAAEkB,MAAM,EAAEN,KAAK,GAAG;UAAE,CAAC,CAAE;UAChDO,YAAY,EACRP,KAAK,GAAG,CAAC,IAAI;YACTQ,IAAI,eAAExC,MAAA,CAAAoB,OAAA,CAAAS,aAAA,CAACvB,MAAA,CAAAmC,cAAU,MAAE,CAAC;YACpBC,OAAO,EAAE,SAAAA,QAAA;cAAA,OAAMX,IAAI,CAACP,KAAK,CAACmB,WAAW,CAACX,KAAK,CAAC;YAAA;UAChD;QACH,EACJ,CAAC;MAAA,CAEM,CAAC;IAEzB;EACJ;AACJ,CAAC;AAAC,IAAAY,QAAA,GAEa9B,MAAM;AAAA+B,OAAA,CAAAzB,OAAA,GAAAwB,QAAA"}

package/admin/plugins/fieldRenderers/number/index.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("../../../../types").CmsModelFieldRendererPlugin[];
+declare const _default: import("@webiny/app-headless-cms-common/types").CmsModelFieldRendererPlugin[];
 export default _default;

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

@@ -1 +1 @@
-{"version":3,"names":["numberInput","numberInputs"],"sources":["index.ts"],"sourcesContent":["import numberInput from \"./numberInput\";\nimport numberInputs from \"./numberInputs\";\n\nexport default [numberInput, numberInputs];\n"],"mappings":";;;;;;;AAAA;AACA;AAA0C,eAE3B,CAACA,oBAAW,EAAEC,qBAAY,CAAC;AAAA"}
+{"version":3,"names":["_numberInput","_interopRequireDefault","require","_numberInputs","_default","numberInput","numberInputs","exports","default"],"sources":["index.ts"],"sourcesContent":["import numberInput from \"./numberInput\";\nimport numberInputs from \"./numberInputs\";\n\nexport default [numberInput, numberInputs];\n"],"mappings":";;;;;;;AAAA,IAAAA,YAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,aAAA,GAAAF,sBAAA,CAAAC,OAAA;AAA0C,IAAAE,QAAA,GAE3B,CAACC,oBAAW,EAAEC,qBAAY,CAAC;AAAAC,OAAA,CAAAC,OAAA,GAAAJ,QAAA"}

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

@@ -1 +1 @@
-{"version":3,"names":["t","i18n","ns","plugin","type","name","renderer","rendererName","description","canUse","field","multipleValues","get","render","getBind","Bind","bindProps","value","onChange","label","placeholderText","helpText"],"sources":["numberInput.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get\";\nimport { CmsEditorFieldRendererPlugin } from \"~/types\";\nimport { Input } from \"@webiny/ui/Input\";\nimport { i18n } from \"@webiny/app/i18n\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/number\");\n\nconst plugin: CmsEditorFieldRendererPlugin = {\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                    {bindProps => {\n                        return (\n                            <Input\n                                {...bindProps}\n                                onChange={value => {\n                                    return bindProps.onChange(value);\n                                }}\n                                label={field.label}\n                                placeholder={field.placeholderText}\n                                description={field.helpText}\n                                type=\"number\"\n                                data-testid={`fr.input.number.${field.label}`}\n                            />\n                        );\n                    }}\n                </Bind>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;AAAA;AACA;AAEA;AACA;AAAwC;AAExC,IAAMA,CAAC,GAAGC,UAAI,CAACC,EAAE,CAAC,sCAAsC,CAAC;AAEzD,IAAMC,MAAoC,GAAG;EACzCC,IAAI,EAAE,2BAA2B;EACjCC,IAAI,EAAE,kCAAkC;EACxCC,QAAQ,EAAE;IACNC,YAAY,EAAE,cAAc;IAC5BF,IAAI,EAAEL,CAAC,+FAAc;IACrBQ,WAAW,EAAER,CAAC,4IAAuD;IACrES,MAAM,wBAAY;MAAA,IAATC,KAAK,QAALA,KAAK;MACV,OACIA,KAAK,CAACN,IAAI,KAAK,QAAQ,IACvB,CAACM,KAAK,CAACC,cAAc,IACrB,CAAC,IAAAC,YAAG,EAACF,KAAK,EAAE,0BAA0B,CAAC;IAE/C,CAAC;IACDG,MAAM,yBAAqB;MAAA,IAAlBH,KAAK,SAALA,KAAK;QAAEI,OAAO,SAAPA,OAAO;MACnB,IAAMC,IAAI,GAAGD,OAAO,EAAE;MAEtB,oBACI,6BAAC,IAAI,QACA,UAAAE,SAAS,EAAI;QACV,oBACI,6BAAC,YAAK,oBACEA,SAAS;UACb,QAAQ,EAAE,kBAAAC,KAAK,EAAI;YACf,OAAOD,SAAS,CAACE,QAAQ,CAACD,KAAK,CAAC;UACpC,CAAE;UACF,KAAK,EAAEP,KAAK,CAACS,KAAM;UACnB,WAAW,EAAET,KAAK,CAACU,eAAgB;UACnC,WAAW,EAAEV,KAAK,CAACW,QAAS;UAC5B,IAAI,EAAC,QAAQ;UACb,yCAAgCX,KAAK,CAACS,KAAK;QAAG,GAChD;MAEV,CAAC,CACE;IAEf;EACJ;AACJ,CAAC;AAAC,eAEahB,MAAM;AAAA"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_get","_Input","_i18n","_templateObject","_templateObject2","t","i18n","ns","plugin","type","name","renderer","rendererName","_taggedTemplateLiteral2","default","description","canUse","_ref","field","multipleValues","get","render","_ref2","getBind","Bind","createElement","bindProps","Input","Object","assign","onChange","value","label","placeholder","placeholderText","helpText","concat","_default","exports"],"sources":["numberInput.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get\";\nimport { CmsEditorFieldRendererPlugin } from \"~/types\";\nimport { Input } from \"@webiny/ui/Input\";\nimport { i18n } from \"@webiny/app/i18n\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/number\");\n\nconst plugin: CmsEditorFieldRendererPlugin = {\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                    {bindProps => {\n                        return (\n                            <Input\n                                {...bindProps}\n                                onChange={value => {\n                                    return bindProps.onChange(value);\n                                }}\n                                label={field.label}\n                                placeholder={field.placeholderText}\n                                description={field.helpText}\n                                type=\"number\"\n                                data-testid={`fr.input.number.${field.label}`}\n                            />\n                        );\n                    }}\n                </Bind>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,IAAA,GAAAF,sBAAA,CAAAC,OAAA;AAEA,IAAAE,MAAA,GAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AAAwC,IAAAI,eAAA,EAAAC,gBAAA;AAExC,IAAMC,CAAC,GAAGC,UAAI,CAACC,EAAE,CAAC,sCAAsC,CAAC;AAEzD,IAAMC,MAAoC,GAAG;EACzCC,IAAI,EAAE,2BAA2B;EACjCC,IAAI,EAAE,kCAAkC;EACxCC,QAAQ,EAAE;IACNC,YAAY,EAAE,cAAc;IAC5BF,IAAI,EAAEL,CAAC,CAAAF,eAAA,KAAAA,eAAA,OAAAU,uBAAA,CAAAC,OAAA,qBAAc;IACrBC,WAAW,EAAEV,CAAC,CAAAD,gBAAA,KAAAA,gBAAA,OAAAS,uBAAA,CAAAC,OAAA,gEAAuD;IACrEE,MAAM,WAAAA,OAAAC,IAAA,EAAY;MAAA,IAATC,KAAK,GAAAD,IAAA,CAALC,KAAK;MACV,OACIA,KAAK,CAACT,IAAI,KAAK,QAAQ,IACvB,CAACS,KAAK,CAACC,cAAc,IACrB,CAAC,IAAAC,YAAG,EAACF,KAAK,EAAE,0BAA0B,CAAC;IAE/C,CAAC;IACDG,MAAM,WAAAA,OAAAC,KAAA,EAAqB;MAAA,IAAlBJ,KAAK,GAAAI,KAAA,CAALJ,KAAK;QAAEK,OAAO,GAAAD,KAAA,CAAPC,OAAO;MACnB,IAAMC,IAAI,GAAGD,OAAO,CAAC,CAAC;MAEtB,oBACI1B,MAAA,CAAAiB,OAAA,CAAAW,aAAA,CAACD,IAAI,QACA,UAAAE,SAAS,EAAI;QACV,oBACI7B,MAAA,CAAAiB,OAAA,CAAAW,aAAA,CAACxB,MAAA,CAAA0B,KAAK,EAAAC,MAAA,CAAAC,MAAA,KACEH,SAAS;UACbI,QAAQ,EAAE,SAAAA,SAAAC,KAAK,EAAI;YACf,OAAOL,SAAS,CAACI,QAAQ,CAACC,KAAK,CAAC;UACpC,CAAE;UACFC,KAAK,EAAEd,KAAK,CAACc,KAAM;UACnBC,WAAW,EAAEf,KAAK,CAACgB,eAAgB;UACnCnB,WAAW,EAAEG,KAAK,CAACiB,QAAS;UAC5B1B,IAAI,EAAC,QAAQ;UACb,kCAAA2B,MAAA,CAAgClB,KAAK,CAACc,KAAK;QAAG,EACjD,CAAC;MAEV,CACE,CAAC;IAEf;EACJ;AACJ,CAAC;AAAC,IAAAK,QAAA,GAEa7B,MAAM;AAAA8B,OAAA,CAAAxB,OAAA,GAAAuB,QAAA"}