npm - @webiny/app-headless-cms - Versions diffs - 5.24.0 → 5.25.0-beta.2 - Mend

@webiny/app-headless-cms 5.24.0 → 5.25.0-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (427) hide show

package/admin/components/DropZone/Vertical.js CHANGED Viewed

@@ -67,7 +67,7 @@ var Vertical = function Vertical(_ref2) {
         height: "100%",
         position: "absolute",
         top: 0
-      }, _defineProperty(_ref4, last ? "right" : "left", 0), _defineProperty(_ref4, "zIndex", isDragging ? 1000 + depth : -1), _ref4)
+      }, _defineProperty(_ref4, last ? "right" : "left", 0), _defineProperty(_ref4, "zIndex", isDragging ? 1000 + (depth || 0) : -1), _ref4)
     }, /*#__PURE__*/React.createElement(OuterDivVertical, {
       isOver: isOver,
       isDragging: isDragging,

package/admin/components/DropZone/Vertical.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["Vertical.tsx"],"names":["React","styled","Droppable","InnerDivVertical","position","width","height","zIndex","borderRadius","display","boxSizing","border","borderSpacing","BackgroundColorDiv","OuterDivVertical","top","backgroundColor","props","last","borderColor","isOver","isDragging","opacity","Vertical","depth","onDrop","isVisible","drop","maxWidth"],"mappings":"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","sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { Droppable, IsVisibleCallable } from \"../Droppable\";\nimport { DragSource } from \"~/admin/components/FieldEditor/FieldEditorContext\";\n\nconst InnerDivVertical = styled(\"div\")({\n position: \"absolute\",\n width: 10,\n height: \"100%\",\n zIndex: 3,\n borderRadius: 0,\n display: \"none\",\n boxSizing: \"border-box\",\n border: \"1px dashed black\",\n borderSpacing: 5\n});\n\nconst BackgroundColorDiv = styled(\"div\")({\n width: \"100%\",\n height: \"100%\"\n});\n\ninterface OuterDivVerticalProps {\n isOver: boolean;\n last?: boolean;\n isVisible?: IsVisibleCallable;\n isDragging?: boolean;\n}\n\nconst OuterDivVertical = styled(\"div\")(\n {\n position: \"absolute\",\n width: \"30%\",\n top: 0,\n height: \"100%\",\n zIndex: 10,\n backgroundColor: \"transparent\"\n },\n (props: OuterDivVerticalProps) => ({\n [props.last ? \"right\" : \"left\"]: -9,\n textAlign: props.last ? \"right\" : \"left\",\n // @ts-ignore\n [InnerDivVertical]: {\n borderColor: props.isOver ? \"var(--mdc-theme-primary)\" : \"var(--mdc-theme-secondary)\",\n [props.last ? \"right\" : \"left\"]: -2,\n display: props.isDragging ? \"block\" : \"none\",\n // @ts-ignore\n [BackgroundColorDiv]: {\n opacity: 0.5,\n backgroundColor: props.isOver\n ? \"var(--mdc-theme-primary)\"\n : \"var(--mdc-theme-secondary)\"\n }\n }\n })\n);\n\ninterface VerticalProps {\n depth?: number;\n onDrop(item: DragSource): void;\n last?: boolean;\n isVisible?: any;\n}\n\nconst Vertical: React.FC<VerticalProps> = ({ depth, last, onDrop, isVisible }) => {\n return (\n <Droppable onDrop={onDrop} isVisible={isVisible}>\n {({ isOver, isDragging, drop }) => (\n <div\n ref={drop}\n style={{\n /* For dropzone debugging: border: \"1px solid blue\",*/\n width: \"30%\",\n maxWidth: \"100px\",\n height: \"100%\",\n position: \"absolute\",\n top: 0,\n [last ? \"right\" : \"left\"]: 0,\n zIndex: isDragging ? 1000 + (depth || 0) : -1\n }}\n >\n <OuterDivVertical isOver={isOver} isDragging={isDragging} last={last}>\n <InnerDivVertical>\n <BackgroundColorDiv />\n </InnerDivVertical>\n </OuterDivVertical>\n </div>\n )}\n </Droppable>\n );\n};\n\nexport default Vertical;\n"]}

package/admin/components/DropZone/index.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"sources":["index.ts"],"names":["Center","Horizontal","Vertical"],"mappings":"AAAA,OAAOA,MAAP;AACA,OAAOC,UAAP;AACA,OAAOC,QAAP;AAEA,SAASF,MAAT,EAAiBC,UAAjB,EAA6BC,QAA7B","sourcesContent":["import Center from \"./Center\";\nimport Horizontal from \"./Horizontal\";\nimport Vertical from \"./Vertical\";\n\nexport { Center, Horizontal, Vertical };\n"]}

package/admin/components/Droppable.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["Droppable.tsx"],"names":["React","useDrop","DroppableComponent","props","children","onDrop","isVisible","accept","collect","monitor","isOver","shallow","item","getItem","drop","_","isDragging","Boolean","Droppable","memo"],"mappings":";AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAA4BC,OAA5B,QAA2C,WAA3C;;AAiCA,IAAMC,kBAA4C,GAAG,SAA/CA,kBAA+C,CAAAC,KAAK,EAAI;AAC1D,MAAQC,QAAR,GAAqDD,KAArD,CAAQC,QAAR;AAAA,MAAkBC,MAAlB,GAAqDF,KAArD,CAAkBE,MAAlB;AAAA,yBAAqDF,KAArD,CAA0BG,SAA1B;AAAA,MAA0BA,SAA1B,iCAAsC;AAAA,WAAM,IAAN;AAAA,GAAtC;;AAEA,iBAAiCL,OAAO,CAAC;AACrCM,IAAAA,MAAM,EAAE,SAD6B;AAErCC,IAAAA,OAAO,EAAE,iBAAAC,OAAO;AAAA,aAAK;AACjBC,QAAAA,MAAM,EAAED,OAAO,CAACC,MAAR,MAAoBD,OAAO,CAACC,MAAR,CAAe;AAAEC,UAAAA,OAAO,EAAE;AAAX,SAAf,CADX;AAEjBC,QAAAA,IAAI,EAAEH,OAAO,CAACI,OAAR;AAFW,OAAL;AAAA,KAFqB;AAMrCC,IAAAA,IANqC,gBAMhCC,CANgC,EAM7BN,OAN6B,EAMpB;AACb,UAAI,OAAOJ,MAAP,KAAkB,UAAtB,EAAkC;AAC9B,eAAOA,MAAM,CAACI,OAAO,CAACI,OAAR,EAAD,CAAb;AACH;AACJ;AAVoC,GAAD,CAAxC;AAAA;AAAA;AAAA,MAASD,IAAT,cAASA,IAAT;AAAA,MAAeF,MAAf,cAAeA,MAAf;AAAA,MAAyBI,IAAzB;;AAaA,MAAIF,IAAI,IAAI,CAACN,SAAS,CAACM,IAAD,CAAtB,EAA8B;AAC1B,WAAO,IAAP;AACH;;AAED,SAAOR,QAAQ,CAAC;AAAEY,IAAAA,UAAU,EAAEC,OAAO,CAACL,IAAD,CAArB;AAA6BF,IAAAA,MAAM,EAANA,MAA7B;AAAqCE,IAAAA,IAAI,EAAJA,IAArC;AAA2CE,IAAAA,IAAI,EAAJA;AAA3C,GAAD,CAAf;AACH,CArBD;;AAuBA,OAAO,IAAMI,SAAmC,gBAAGlB,KAAK,CAACmB,IAAN,CAAWjB,kBAAX,CAA5C","sourcesContent":["import * as React from \"react\";\nimport { ConnectDropTarget, useDrop } from \"react-dnd\";\nimport { DragSource } from \"~/admin/components/FieldEditor/FieldEditorContext\";\n\nexport interface DroppableChildrenFunctionParams {\n isDragging: boolean;\n isOver: boolean;\n item: any;\n drop: ConnectDropTarget;\n}\nexport interface DroppableChildrenFunction {\n (params: DroppableChildrenFunctionParams): React.ReactElement;\n}\n\ninterface IsVisibleParams {\n type: \"row\" | \"field\" | \"newField\";\n item: any;\n isDragging: boolean;\n}\nexport interface IsVisibleCallable {\n (params: IsVisibleParams): boolean;\n}\nexport interface OnDropCallable {\n (item: DragSource): void;\n}\nexport interface DroppableProps {\n type?: string;\n children: DroppableChildrenFunction;\n isDragging?: boolean;\n isDroppable?: (item: any) => boolean;\n isVisible?: IsVisibleCallable;\n onDrop?: OnDropCallable;\n}\n\nconst DroppableComponent: React.FC<DroppableProps> = props => {\n const { children, onDrop, isVisible = () => true } = props;\n\n const [{ item, isOver }, drop] = useDrop({\n accept: \"element\",\n collect: monitor => ({\n isOver: monitor.isOver() && monitor.isOver({ shallow: true }),\n item: monitor.getItem()\n }),\n drop(_, monitor) {\n if (typeof onDrop === \"function\") {\n return onDrop(monitor.getItem());\n }\n }\n });\n\n if (item && !isVisible(item)) {\n return null;\n }\n\n return children({ isDragging: Boolean(item), isOver, item, drop });\n};\n\nexport const Droppable: React.FC<DroppableProps> = React.memo(DroppableComponent);\n"]}

package/admin/components/FieldEditor/EditFieldDialog/AppearanceTab.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["AppearanceTab.tsx"],"names":["React","useEffect","plugins","Grid","Cell","i18n","Radio","RadioGroup","Typography","css","validation","t","ns","style","topLabel","marginBottom","noComponentsMessage","textAlign","padding","radioContainer","AppearanceTab","props","field","form","renderPlugins","byType","filter","item","renderer","canUse","currentlySelectedRenderAvailable","find","rendererName","name","setValue","console","log","fieldId","length","Bind","create","onChange","getValue","map","description"],"mappings":"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","sourcesContent":["import React, { useEffect } from \"react\";\nimport { plugins } from \"@webiny/plugins\";\nimport { Grid, Cell } from \"@webiny/ui/Grid\";\nimport { CmsEditorField, CmsEditorFieldRendererPlugin } from \"~/types\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { Radio, RadioGroup } from \"@webiny/ui/Radio\";\nimport { Typography } from \"@webiny/ui/Typography\";\nimport { css } from \"emotion\";\nimport { validation } from \"@webiny/validation\";\nimport { FormRenderPropParams } from \"@webiny/form\";\n\nconst t = i18n.ns(\n \"app-headless-cms/admin/views/components/editor/tabs/edit-field-dialog/appearance-tab\"\n);\n\nconst style = {\n topLabel: css({\n marginBottom: 25\n }),\n noComponentsMessage: css({\n textAlign: \"center\",\n padding: 25\n }),\n radioContainer: css({\n marginBottom: 10\n })\n};\n\ninterface AppearanceTabProps {\n field: CmsEditorField;\n form: FormRenderPropParams;\n}\nconst AppearanceTab: React.FC<AppearanceTabProps> = props => {\n const { field, form } = props;\n\n const renderPlugins = plugins\n .byType<CmsEditorFieldRendererPlugin>(\"cms-editor-field-renderer\")\n .filter(item => item.renderer.canUse({ field }));\n\n useEffect((): void => {\n // If the currently selected render plugin is no longer available, select the first available one.\n const currentlySelectedRenderAvailable = renderPlugins.find(\n item => item.renderer.rendererName === field.renderer.name\n );\n if (currentlySelectedRenderAvailable) {\n return;\n } else if (renderPlugins[0]) {\n form.setValue(\"renderer.name\", renderPlugins[0].renderer.rendererName);\n return;\n }\n console.log(`No renderers for field ${field.fieldId} found.`, field);\n });\n\n if (renderPlugins.length === 0) {\n return (\n <Grid>\n <Cell\n span={12}\n className={style.noComponentsMessage}\n >{t`There are no components that can render this field.`}</Cell>\n </Grid>\n );\n }\n\n const { Bind } = form;\n\n return (\n <Grid>\n <Cell span={12}>\n <div\n className={style.topLabel}\n >{t`Choose a component that will render the field:`}</div>\n <Bind name={\"renderer.name\"} validate={validation.create(\"required\")}>\n <RadioGroup>\n {({ onChange, getValue }) => (\n <React.Fragment>\n {renderPlugins.map(item => (\n <div key={item.name} className={style.radioContainer}>\n <Radio\n value={getValue(item.renderer.rendererName)}\n onChange={onChange(item.renderer.rendererName)}\n label={\n <>\n <div>{item.renderer.name}</div>\n <div>\n <Typography use={\"caption\"}>\n {item.renderer.description}\n </Typography>\n </div>\n </>\n }\n />\n </div>\n ))}\n </React.Fragment>\n )}\n </RadioGroup>\n </Bind>\n </Cell>\n </Grid>\n );\n};\n\nexport default AppearanceTab;\n"]}

package/admin/components/FieldEditor/EditFieldDialog/GeneralTab.js CHANGED Viewed

@@ -29,7 +29,11 @@ var GeneralTab = function GeneralTab(_ref) {
   useEffect(function () {
     setTimeout(function () {
-      inputRef.current && inputRef.current.focus();
+      if (!inputRef.current) {
+        return;
+      }
+      inputRef.current.focus();
     }, 200);
   }, []);
   var afterChangeLabel = useCallback(function (value) {
@@ -45,7 +49,7 @@ var GeneralTab = function GeneralTab(_ref) {
     }
     throw new Error("Cannot use \"id\" as Field ID.");
-  }, undefined);
+  }, []);
   var uniqueFieldIdValidator = useCallback(function (fieldId) {
     var existingField = getField({
       fieldId: fieldId
@@ -60,7 +64,7 @@ var GeneralTab = function GeneralTab(_ref) {
     }
     throw new Error("Please enter a unique Field ID.");
-  }, undefined);
+  }, []);
   var additionalSettings = null;
   if (typeof fieldPlugin.field.renderSettings === "function") {
@@ -80,7 +84,13 @@ var GeneralTab = function GeneralTab(_ref) {
   }, /*#__PURE__*/React.createElement(Bind, {
     name: "label",
     validators: validation.create("required"),
-    afterChange: !field.id && afterChangeLabel
+    afterChange: function afterChange(value) {
+      if (field.id) {
+        return;
+      }
+      afterChangeLabel(value);
+    }
   }, /*#__PURE__*/React.createElement(Input, {
     label: "Label",
     inputRef: inputRef

package/admin/components/FieldEditor/EditFieldDialog/GeneralTab.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["GeneralTab.tsx"],"names":["React","useEffect","useCallback","useRef","useMemo","Input","Switch","Grid","Cell","validation","useFieldEditor","useContentModelEditor","GeneralTab","field","form","fieldPlugin","Bind","setValue","inputRef","data","getField","setTimeout","current","focus","afterChangeLabel","value","beforeChangeFieldId","baseOnChange","newValue","trim","fieldIdValidator","fieldId","toLowerCase","Error","uniqueFieldIdValidator","existingField","id","additionalSettings","renderSettings","contentModel","predefinedValuesEnabled","allowPredefinedValues","renderPredefinedValues","create","multipleValuesLabel","allowMultipleValues"],"mappings":"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","sourcesContent":["import React, { useEffect, useCallback, useRef, useMemo } from \"react\";\nimport { camelCase } from \"lodash\";\nimport { Input } from \"@webiny/ui/Input\";\nimport { Switch } from \"@webiny/ui/Switch\";\nimport { Grid, Cell } from \"@webiny/ui/Grid\";\nimport { validation } from \"@webiny/validation\";\nimport { CmsEditorField, CmsEditorFieldTypePlugin } from \"~/types\";\nimport { FormRenderPropParams } from \"@webiny/form/types\";\n\nimport { useFieldEditor } from \"~/admin/components/FieldEditor\";\nimport { useContentModelEditor } from \"~/admin/components/ContentModelEditor/useContentModelEditor\";\n\ninterface GeneralTabProps {\n field: CmsEditorField;\n form: FormRenderPropParams;\n fieldPlugin: CmsEditorFieldTypePlugin;\n}\n\nconst GeneralTab: React.FC<GeneralTabProps> = ({ field, form, fieldPlugin }) => {\n const { Bind, setValue } = form;\n const inputRef = useRef<HTMLInputElement | null>(null);\n const { data } = useContentModelEditor();\n const { getField } = useFieldEditor();\n\n // Had problems with auto-focusing the \"label\" field. A couple of comments on this.\n // 1. It's probably caused by the Tabs component which wraps this component.\n // 2. It seems that the \"autoFocus\" prop on the Input doesn't work. I can't see it attached in the actual DOM.\n // 3. This works, but it's not 100%. Visually, the cursor is frozen, and that's probably caused by a bug / design\n // in the RMWC / Material library. If you were to click somewhere on screen, and then apply focus, then\n // it seems it's behaving correctly. ¯\\_(ツ)_/¯\n useEffect(() => {\n setTimeout(() => {\n if (!inputRef.current) {\n return;\n }\n inputRef.current.focus();\n }, 200);\n }, []);\n\n const afterChangeLabel = useCallback((value: string) => {\n setValue(\"fieldId\", camelCase(value));\n }, []);\n\n const beforeChangeFieldId = useCallback(\n (value: string, baseOnChange: (value: string) => void) => {\n const newValue = value.trim();\n\n baseOnChange(newValue);\n },\n []\n );\n\n const fieldIdValidator = useCallback(fieldId => {\n if (fieldId.trim().toLowerCase() !== \"id\") {\n return true;\n }\n\n throw new Error(`Cannot use \"id\" as Field ID.`);\n }, []);\n\n const uniqueFieldIdValidator = useCallback((fieldId: string) => {\n const existingField = getField({ fieldId });\n if (!existingField) {\n return false;\n }\n\n if (existingField.id === field.id) {\n return true;\n }\n throw new Error(\"Please enter a unique Field ID.\");\n }, []);\n\n let additionalSettings: React.ReactNode | null = null;\n if (typeof fieldPlugin.field.renderSettings === \"function\") {\n additionalSettings = fieldPlugin.field.renderSettings({\n form,\n afterChangeLabel,\n uniqueFieldIdValidator,\n contentModel: data\n });\n }\n\n const predefinedValuesEnabled = useMemo(\n (): boolean =>\n fieldPlugin.field.allowPredefinedValues &&\n typeof fieldPlugin.field.renderPredefinedValues === \"function\",\n [field.fieldId]\n );\n\n return (\n <>\n <Grid>\n <Cell span={6}>\n <Bind\n name={\"label\"}\n validators={validation.create(\"required\")}\n afterChange={(value: string) => {\n if (field.id) {\n return;\n }\n afterChangeLabel(value);\n }}\n >\n <Input label={\"Label\"} inputRef={inputRef} />\n </Bind>\n </Cell>\n <Cell span={6}>\n <Bind\n name={\"fieldId\"}\n validators={[\n validation.create(\"required\"),\n uniqueFieldIdValidator,\n fieldIdValidator\n ]}\n beforeChange={beforeChangeFieldId}\n >\n <Input label={\"Field ID\"} disabled={!!field.id} />\n </Bind>\n </Cell>\n\n <Cell span={6}>\n <Bind name={\"multipleValues\"}>\n <Switch\n label={fieldPlugin.field.multipleValuesLabel}\n disabled={!fieldPlugin.field.allowMultipleValues}\n />\n </Bind>\n </Cell>\n <Cell span={6}>\n <Bind name={\"predefinedValues.enabled\"}>\n <Switch\n label={\"Use predefined values\"}\n disabled={!predefinedValuesEnabled}\n />\n </Bind>\n </Cell>\n\n <Cell span={12}>\n <Bind name={\"helpText\"}>\n <Input label={\"Help text\"} description={\"Help text (optional)\"} />\n </Bind>\n </Cell>\n </Grid>\n {additionalSettings}\n </>\n );\n};\n\nexport default GeneralTab;\n"]}

package/admin/components/FieldEditor/EditFieldDialog/PredefinedValues.js CHANGED Viewed

@@ -1,5 +1,4 @@
 import _objectSpread from "@babel/runtime/helpers/objectSpread2";
-// TODO @ts-refactor figure out correct bind types and remove any
 import React, { useCallback, useRef, cloneElement } from "react";
 import getValue from "./functions/getValue";
 import setValue from "./functions/setValue";
@@ -51,6 +50,11 @@ var PredefinedValues = function PredefinedValues(_ref) {
     memoizedBindComponents.current[memoKey] = Bind;
     return memoizedBindComponents.current[memoKey];
   }, []);
+  if (!fieldPlugin.field.renderPredefinedValues) {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, "Missing \"field.renderPredefinedValues\" method in field type plugin: \"".concat(field.type, "\"."));
+  }
   return /*#__PURE__*/React.createElement(React.Fragment, null, fieldPlugin.field.renderPredefinedValues({
     field: field,
     getBind: getBind,

package/admin/components/FieldEditor/EditFieldDialog/PredefinedValues.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["PredefinedValues.tsx"],"names":["React","useCallback","useRef","cloneElement","getValue","setValue","PredefinedValues","field","fieldPlugin","form","memoizedBindComponents","BaseFormBind","Bind","getBind","index","memoKey","current","children","name","bind","props","value","onChange","renderPredefinedValues","type"],"mappings":";AAAA,OAAOA,KAAP,IAAgBC,WAAhB,EAA6BC,MAA7B,EAAqCC,YAArC,QAAyD,OAAzD;AACA,OAAOC,QAAP;AACA,OAAOC,QAAP;;AAeA,IAAMC,gBAAiD,GAAG,SAApDA,gBAAoD,OAAkC;AAAA,MAA/BC,KAA+B,QAA/BA,KAA+B;AAAA,MAAxBC,WAAwB,QAAxBA,WAAwB;AAAA,MAAXC,IAAW,QAAXA,IAAW;AACxF,MAAMC,sBAAsB,GAAGR,MAAM,CAAyB,EAAzB,CAArC;AACA,MAAcS,YAAd,GAA+BF,IAA/B,CAAQG,IAAR;AAEA,MAAMC,OAAO,GAAGZ,WAAW,CAAC,YAAgB;AAAA,QAAfa,KAAe,uEAAP,CAAC,CAAM;AACxC,QAAMC,OAAO,GAAGD,KAAhB;;AACA,QAAIJ,sBAAsB,CAACM,OAAvB,CAA+BD,OAA/B,CAAJ,EAA6C;AACzC,aAAOL,sBAAsB,CAACM,OAAvB,CAA+BD,OAA/B,CAAP;AACH;;AAED,QAAMH,IAAyB,GAAG,SAA5BA,IAA4B,QAAwB;AAAA,UAArBK,QAAqB,SAArBA,QAAqB;AAAA,UAAXC,IAAW,SAAXA,IAAW;AACtD,0BACI,oBAAC,YAAD;AAAc,QAAA,IAAI,EAAE;AAApB,SACK,UAAAC,IAAI,EAAI;AACL,YAAMC,KAAK,mCACJD,IADI;AAEPE,UAAAA,KAAK,EAAEjB,QAAQ,CAAC;AAAEe,YAAAA,IAAI,EAAJA,IAAF;AAAQL,YAAAA,KAAK,EAALA,KAAR;AAAeI,YAAAA,IAAI,EAAJA;AAAf,WAAD,CAFR;AAGPI,UAAAA,QAAQ,EAAE,kBAACD,KAAD,EAAqB;AAC3BhB,YAAAA,QAAQ,CAAC;AAAEgB,cAAAA,KAAK,EAALA,KAAF;AAASF,cAAAA,IAAI,EAAJA,IAAT;AAAeL,cAAAA,KAAK,EAALA,KAAf;AAAsBI,cAAAA,IAAI,EAAJA;AAAtB,aAAD,CAAR;AACH;AALM,UAAX;;AAQA,YAAI,OAAOD,QAAP,KAAoB,UAAxB,EAAoC;AAChC,iBAAOA,QAAQ,CAACG,KAAD,CAAf;AACH;;AAED,4BAAOjB,YAAY,CAACc,QAAD,EAA4CG,KAA5C,CAAnB;AACH,OAfL,CADJ;AAmBH,KApBD;;AAsBAV,IAAAA,sBAAsB,CAACM,OAAvB,CAA+BD,OAA/B,IAA0CH,IAA1C;AAEA,WAAOF,sBAAsB,CAACM,OAAvB,CAA+BD,OAA/B,CAAP;AACH,GA/B0B,EA+BxB,EA/BwB,CAA3B;;AAgCA,MAAI,CAACP,WAAW,CAACD,KAAZ,CAAkBgB,sBAAvB,EAA+C;AAC3C,wBACI,4HAA2EhB,KAAK,CAACiB,IAAjF,SADJ;AAGH;;AAED,sBAAO,0CAAGhB,WAAW,CAACD,KAAZ,CAAkBgB,sBAAlB,CAAyC;AAAEhB,IAAAA,KAAK,EAALA,KAAF;AAASM,IAAAA,OAAO,EAAPA,OAAT;AAAkBJ,IAAAA,IAAI,EAAJA;AAAlB,GAAzC,CAAH,CAAP;AACH,CA3CD;;AA6CA,eAAeH,gBAAf","sourcesContent":["import React, { useCallback, useRef, cloneElement } from \"react\";\nimport getValue from \"./functions/getValue\";\nimport setValue from \"./functions/setValue\";\nimport { CmsEditorField, CmsEditorFieldTypePlugin } from \"~/types\";\nimport { FormRenderPropParams } from \"@webiny/form\";\n\nexport interface PredefinedValuesProps {\n field: CmsEditorField;\n fieldPlugin: CmsEditorFieldTypePlugin;\n form: FormRenderPropParams;\n}\ninterface MemoizedBindComponents {\n [key: string]: React.FC<BindProps>;\n}\ninterface BindProps {\n name: string;\n}\nconst PredefinedValues: React.FC<PredefinedValuesProps> = ({ field, fieldPlugin, form }) => {\n const memoizedBindComponents = useRef<MemoizedBindComponents>({});\n const { Bind: BaseFormBind } = form;\n\n const getBind = useCallback((index = -1) => {\n const memoKey = index;\n if (memoizedBindComponents.current[memoKey]) {\n return memoizedBindComponents.current[memoKey];\n }\n\n const Bind: React.FC<BindProps> = ({ children, name }) => {\n return (\n <BaseFormBind name={\"predefinedValues.values\"}>\n {bind => {\n const props = {\n ...bind,\n value: getValue({ bind, index, name }),\n onChange: (value: string[]) => {\n setValue({ value, bind, index, name });\n }\n };\n\n if (typeof children === \"function\") {\n return children(props);\n }\n\n return cloneElement(children as unknown as React.ReactElement, props);\n }}\n </BaseFormBind>\n );\n };\n\n memoizedBindComponents.current[memoKey] = Bind;\n\n return memoizedBindComponents.current[memoKey];\n }, []);\n if (!fieldPlugin.field.renderPredefinedValues) {\n return (\n <>{`Missing \"field.renderPredefinedValues\" method in field type plugin: \"${field.type}\".`}</>\n );\n }\n\n return <>{fieldPlugin.field.renderPredefinedValues({ field, getBind, form })}</>;\n};\n\nexport default PredefinedValues;\n"]}

package/admin/components/FieldEditor/EditFieldDialog/ValidatorsTab.d.ts CHANGED Viewed

@@ -1,10 +1,15 @@
 import React from "react";
-import { CmsEditorField } from "../../../../types";
+import { FormRenderPropParams } from "@webiny/form";
+import { CmsEditorField, CmsEditorFieldValidatorPlugin } from "../../../../types";
+interface ValidatorsTabPropsValidator {
+    optional: boolean;
+    validator: CmsEditorFieldValidatorPlugin["validator"];
+}
 interface ValidatorsTabProps {
     name: string;
-    validators: any[];
-    form: any;
+    validators: ValidatorsTabPropsValidator[];
+    form: FormRenderPropParams;
     field: CmsEditorField;
 }
-declare const ValidatorsTab: React.FunctionComponent<ValidatorsTabProps>;
+declare const ValidatorsTab: React.FC<ValidatorsTabProps>;
 export default ValidatorsTab;

package/admin/components/FieldEditor/EditFieldDialog/ValidatorsTab.js CHANGED Viewed

@@ -59,7 +59,7 @@ var ValidatorsTab = function ValidatorsTab(props) {
   }, function (bind) {
     var validationValue = bind.value,
         onChangeValidation = bind.onChange;
-    return validators.map(function (_ref2) {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, validators.map(function (_ref2) {
       var optional = _ref2.optional,
           validator = _ref2.validator;
       var validatorIndex = (validationValue || []).findIndex(function (item) {
@@ -102,20 +102,27 @@ var ValidatorsTab = function ValidatorsTab(props) {
         }, /*#__PURE__*/React.createElement(Bind, {
           name: "message",
           validators: validation.create("required")
-        }, /*#__PURE__*/React.createElement(Input, {
-          label: "Message",
-          description: "This message will be displayed to the user"
-        })))), typeof validator.renderSettings === "function" && validator.renderSettings({
+        }, function (bind) {
+          return /*#__PURE__*/React.createElement(Input, Object.assign({}, bind, {
+            label: "Message",
+            description: "This message will be displayed to the user"
+          }));
+        }))), typeof validator.renderSettings === "function" && validator.renderSettings({
           field: field,
           setValue: setValue,
           setMessage: function setMessage(message) {
             setValue("message", message);
           },
           data: data,
+          /**
+           * TODO @ts-refactor
+           * Figure out type for Bind.
+           */
           Bind: Bind
         }));
       }));
-    });
+    }));
   });
 };

package/admin/components/FieldEditor/EditFieldDialog/ValidatorsTab.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["ValidatorsTab.tsx"],"names":["React","css","Switch","SimpleForm","SimpleFormContent","SimpleFormHeader","Form","Grid","Cell","validation","Input","onEnabledChange","params","data","validationValue","onChangeValidation","validator","index","findIndex","item","name","slice","settings","defaultSettings","message","defaultMessage","onFormChange","validatorIndex","newValidationValue","noMargin","margin","ValidatorsTab","props","field","validators","Bind","form","bind","value","onChange","map","optional","label","setValue","create","renderSettings","setMessage"],"mappings":"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","sourcesContent":["import React from \"react\";\nimport { css } from \"emotion\";\nimport { cloneDeep, debounce } from \"lodash\";\nimport { Switch } from \"@webiny/ui/Switch\";\nimport {\n SimpleForm,\n SimpleFormContent,\n SimpleFormHeader\n} from \"@webiny/app-admin/components/SimpleForm\";\nimport { Form, FormRenderPropParams } from \"@webiny/form\";\nimport { Grid, Cell } from \"@webiny/ui/Grid\";\nimport { validation } from \"@webiny/validation\";\nimport { Input } from \"@webiny/ui/Input\";\nimport {\n CmsEditorField,\n CmsEditorFieldValidator,\n CmsEditorFieldValidatorPlugin,\n CmsEditorFieldValidatorPluginValidator\n} from \"~/types\";\nimport { Validator } from \"@webiny/validation/types\";\n\ninterface OnChangeValidationCallable {\n (validators: CmsEditorFieldValidator[]): void;\n}\ninterface OnEnabledChangeParams {\n data: CmsEditorFieldValidator;\n validationValue: CmsEditorFieldValidator[];\n onChangeValidation: OnChangeValidationCallable;\n validator: CmsEditorFieldValidatorPluginValidator;\n}\nconst onEnabledChange = (params: OnEnabledChangeParams): void => {\n const { data, validationValue, onChangeValidation, validator } = params;\n if (data) {\n const index = validationValue.findIndex(item => item.name === validator.name);\n onChangeValidation([\n ...validationValue.slice(0, index),\n ...validationValue.slice(index + 1)\n ]);\n return;\n }\n onChangeValidation([\n ...validationValue,\n {\n name: validator.name,\n settings: validator.defaultSettings,\n message: validator.defaultMessage\n }\n ]);\n};\n\nconst onFormChange = debounce(({ data, validationValue, onChangeValidation, validatorIndex }) => {\n const newValidationValue = cloneDeep(validationValue);\n newValidationValue[validatorIndex] = {\n ...newValidationValue[validatorIndex],\n ...cloneDeep(data)\n };\n onChangeValidation(newValidationValue);\n}, 200);\n\nconst noMargin = css({\n margin: \"0 !important\"\n});\n\ninterface ValidatorsTabPropsValidator {\n optional: boolean;\n validator: CmsEditorFieldValidatorPlugin[\"validator\"];\n}\ninterface ValidatorsTabProps {\n name: string;\n validators: ValidatorsTabPropsValidator[];\n form: FormRenderPropParams;\n field: CmsEditorField;\n}\n\nconst ValidatorsTab: React.FC<ValidatorsTabProps> = props => {\n const {\n field,\n name,\n validators,\n form: { Bind }\n } = props;\n\n return (\n <Bind name={name} defaultValue={[]}>\n {bind => {\n const { value: validationValue, onChange: onChangeValidation } = bind;\n return (\n <>\n {validators.map(({ optional, validator }) => {\n const validatorIndex = (\n (validationValue || []) as Validator[]\n ).findIndex(item => item.name === validator.name);\n const data = (validationValue || [])[validatorIndex];\n\n return (\n <SimpleForm\n key={validator.name}\n noElevation\n className={noMargin}\n data-testid={`cms.editor.field-validator.${validator.name}`}\n >\n <SimpleFormHeader title={validator.label}>\n {optional && (\n <Switch\n label=\"Enabled\"\n value={validatorIndex >= 0}\n onChange={() =>\n onEnabledChange({\n data,\n validationValue,\n onChangeValidation,\n validator\n })\n }\n />\n )}\n </SimpleFormHeader>\n {data && (\n <Form\n data={data}\n onChange={data =>\n onFormChange({\n data,\n validationValue,\n onChangeValidation,\n validatorIndex\n })\n }\n >\n {({ Bind, setValue }) => (\n <SimpleFormContent>\n <Grid>\n <Cell span={12}>\n <Bind\n name={\"message\"}\n validators={validation.create(\n \"required\"\n )}\n >\n {bind => {\n return (\n <Input\n {...bind}\n label={\"Message\"}\n description={\n \"This message will be displayed to the user\"\n }\n />\n );\n }}\n </Bind>\n </Cell>\n </Grid>\n\n {typeof validator.renderSettings ===\n \"function\" &&\n validator.renderSettings({\n field,\n setValue,\n setMessage: (message: string) => {\n setValue(\"message\", message);\n },\n data,\n /**\n * TODO @ts-refactor\n * Figure out type for Bind.\n */\n Bind: Bind as any\n })}\n </SimpleFormContent>\n )}\n </Form>\n )}\n </SimpleForm>\n );\n })}\n </>\n );\n }}\n </Bind>\n );\n};\n\nexport default ValidatorsTab;\n"]}

package/admin/components/FieldEditor/EditFieldDialog/functions/getValue.d.ts CHANGED Viewed

@@ -1,5 +1,6 @@
+import { BindComponentRenderProp } from "@webiny/form";
 interface Params {
-    bind: any;
+    bind: BindComponentRenderProp;
     index: number;
     name: string;
 }

package/admin/components/FieldEditor/EditFieldDialog/functions/getValue.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["getValue.ts"],"names":["get","getValue","params","bind","index","name","value"],"mappings":"AAAA,OAAOA,GAAP,MAAgB,YAAhB;;AAQA,IAAMC,QAAQ,GAAG,SAAXA,QAAW,CAACC,MAAD,EAA0C;AACvD,MAAQC,IAAR,GAA8BD,MAA9B,CAAQC,IAAR;AAAA,MAAcC,KAAd,GAA8BF,MAA9B,CAAcE,KAAd;AAAA,MAAqBC,IAArB,GAA8BH,MAA9B,CAAqBG,IAArB;AACA,MAAMC,KAAK,GAAGH,IAAI,CAACG,KAAL,IAAc,EAA5B;;AAEA,MAAIF,KAAK,IAAI,CAAb,EAAgB;AACZ,WAAOJ,GAAG,CAACM,KAAD,YAAWF,KAAX,cAAoBC,IAApB,EAAV;AACH;;AAED,SAAOC,KAAP;AACH,CATD;;AAWA,eAAeL,QAAf","sourcesContent":["import get from \"lodash/get\";\nimport { BindComponentRenderProp } from \"@webiny/form\";\n\ninterface Params {\n bind: BindComponentRenderProp;\n index: number;\n name: string;\n}\nconst getValue = (params: Params): string[] | undefined => {\n const { bind, index, name } = params;\n const value = bind.value || [];\n\n if (index >= 0) {\n return get(value, `${index}.${name}`);\n }\n\n return value;\n};\n\nexport default getValue;\n"]}

package/admin/components/FieldEditor/EditFieldDialog/functions/setValue.d.ts CHANGED Viewed

@@ -1,6 +1,7 @@
+import { BindComponentRenderProp } from "@webiny/form";
 interface Params {
     value: string[];
-    bind: any;
+    bind: BindComponentRenderProp;
     index: number;
     name: string;
 }

package/admin/components/FieldEditor/EditFieldDialog/functions/setValue.js CHANGED Viewed

@@ -1,5 +1,4 @@
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
-// TODO @ts-refactor figure out correct bind types and remove any
 import set from "lodash/set";
 var setValue = function setValue(params) {

package/admin/components/FieldEditor/EditFieldDialog/functions/setValue.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["setValue.ts"],"names":["set","setValue","params","value","bind","index","name","newValue","onChange"],"mappings":";AAAA,OAAOA,GAAP,MAAgB,YAAhB;;AASA,IAAMC,QAAQ,GAAG,SAAXA,QAAW,CAACC,MAAD,EAA0B;AACvC,MAAQC,KAAR,GAAqCD,MAArC,CAAQC,KAAR;AAAA,MAAeC,IAAf,GAAqCF,MAArC,CAAeE,IAAf;AAAA,MAAqBC,KAArB,GAAqCH,MAArC,CAAqBG,KAArB;AAAA,MAA4BC,IAA5B,GAAqCJ,MAArC,CAA4BI,IAA5B;;AACA,MAAIC,QAAQ,sBAAQH,IAAI,CAACD,KAAL,IAAc,EAAtB,CAAZ;;AACA,MAAIE,KAAK,IAAI,CAAb,EAAgB;AACZL,IAAAA,GAAG,CAACO,QAAD,YAAcF,KAAd,cAAuBC,IAAvB,GAA+BH,KAA/B,CAAH;AACH,GAFD,MAEO;AACHI,IAAAA,QAAQ,GAAGJ,KAAX;AACH;;AAEDC,EAAAA,IAAI,CAACI,QAAL,CAAcD,QAAd;AACH,CAVD;;AAYA,eAAeN,QAAf","sourcesContent":["import set from \"lodash/set\";\nimport { BindComponentRenderProp } from \"@webiny/form\";\n\ninterface Params {\n value: string[];\n bind: BindComponentRenderProp;\n index: number;\n name: string;\n}\nconst setValue = (params: Params): void => {\n const { value, bind, index, name } = params;\n let newValue = [...(bind.value || [])];\n if (index >= 0) {\n set(newValue, `${index}.${name}`, value);\n } else {\n newValue = value;\n }\n\n bind.onChange(newValue);\n};\n\nexport default setValue;\n"]}

package/admin/components/FieldEditor/EditFieldDialog.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
 import React from "react";
 import { CmsEditorField } from "../../../types";
 interface EditFieldDialogProps {
-    field: CmsEditorField;
+    field: CmsEditorField | null;
     onClose: () => void;
     onSubmit: (data: CmsEditorField) => void;
 }

package/admin/components/FieldEditor/EditFieldDialog.js CHANGED Viewed

@@ -21,6 +21,7 @@ import { Grid, Cell } from "@webiny/ui/Grid";
 import { Typography } from "@webiny/ui/Typography";
 import { Elevation } from "@webiny/ui/Elevation";
 import { useFieldEditor } from "./useFieldEditor";
+import invariant from "invariant";
 import { ButtonDefault, ButtonPrimary } from "@webiny/ui/Button";
 var t = i18n.namespace("app-headless-cms/admin/components/editor");
 var dialogBody = /*#__PURE__*/css({
@@ -32,9 +33,8 @@ var dialogBody = /*#__PURE__*/css({
 var getValidators = function getValidators(fieldPlugin, key) {
   var defaultValidators = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
-  return plugins.byType("cms-editor-field-validator").map(function (plugin) {
-    return plugin.validator;
-  }).map(function (validator) {
+  var mappedValidators = plugins.byType("cms-editor-field-validator").map(function (_ref) {
+    var validator = _ref.validator;
     var allowedValidators = fieldPlugin.field[key] || defaultValidators;
     if (allowedValidators.includes(validator.name)) {
@@ -50,7 +50,13 @@ var getValidators = function getValidators(fieldPlugin, key) {
     }
     return null;
-  }).filter(Boolean).sort(function (a, b) {
+  });
+  var filteredValidators = mappedValidators.filter(Boolean);
+  return filteredValidators
+  /**
+   * We can safely cast because we are filtering in previous step.
+   */
+  .sort(function (a, b) {
     if (!a.optional && b.optional) {
       return -1;
     }
@@ -87,10 +93,10 @@ var fieldEditorDialog = /*#__PURE__*/css({
   }
 }, "label:fieldEditorDialog;");
-var EditFieldDialog = function EditFieldDialog(_ref) {
-  var field = _ref.field,
-      onSubmit = _ref.onSubmit,
-      props = _objectWithoutProperties(_ref, _excluded);
+var EditFieldDialog = function EditFieldDialog(_ref2) {
+  var field = _ref2.field,
+      _onSubmit = _ref2.onSubmit,
+      props = _objectWithoutProperties(_ref2, _excluded);
   var _useState = useState(null),
       _useState2 = _slicedToArray(_useState, 2),
@@ -129,22 +135,31 @@ var EditFieldDialog = function EditFieldDialog(_ref) {
   var onClose = useCallback(function () {
     setCurrent(null);
     props.onClose();
-  }, undefined);
+  }, []);
   var render = null;
   var headerTitle = t(_templateObject || (_templateObject = _taggedTemplateLiteral(["Field Settings"])));
   if (current) {
+    /**
+     * Something must be very wrong for field plugin to be missing.
+     */
     var fieldPlugin = getFieldPlugin(current.type);
+    /**
+     * We will throw error because of that.
+     */
-    if (fieldPlugin) {
-      headerTitle = t(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["Field Settings - {fieldTypeLabel}"])))({
-        fieldTypeLabel: fieldPlugin.field.label
-      });
-    }
+    invariant(fieldPlugin, "Missing field plugin for type \"".concat(current.type, "\"."));
+    headerTitle = t(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["Field Settings - {fieldTypeLabel}"])))({
+      fieldTypeLabel: fieldPlugin.field.label
+    });
     render = /*#__PURE__*/React.createElement(Form, {
       data: current,
-      onSubmit: onSubmit
+      onSubmit: function onSubmit(data) {
+        /**
+         * We know that data is CmsEditorField.
+         */
+        return _onSubmit(data);
+      }
     }, function (form) {
       var predefinedValuesTabEnabled = fieldPlugin.field.allowPredefinedValues && form.data.predefinedValues && form.data.predefinedValues.enabled;
       return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DialogContent, {
@@ -176,7 +191,7 @@ var EditFieldDialog = function EditFieldDialog(_ref) {
       }, /*#__PURE__*/React.createElement(Elevation, {
         z: 2
       }, /*#__PURE__*/React.createElement(ValidatorsTab, {
-        field: field,
+        field: current,
         name: "listValidation",
         validators: getListValidators(fieldPlugin),
         form: form
@@ -214,7 +229,9 @@ var EditFieldDialog = function EditFieldDialog(_ref) {
       })))), /*#__PURE__*/React.createElement(DialogActions, null, /*#__PURE__*/React.createElement(ButtonDefault, {
         onClick: onClose
       }, t(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["Cancel"])))), /*#__PURE__*/React.createElement(ButtonPrimary, {
-        onClick: form.submit
+        onClick: function onClick(ev) {
+          form.submit(ev);
+        }
       }, t(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["Save Field"]))))));
     });
   }

package/admin/components/FieldEditor/EditFieldDialog.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["EditFieldDialog.tsx"],"names":["React","useState","useEffect","useCallback","css","Dialog","DialogContent","DialogTitle","DialogActions","Form","Tabs","Tab","i18n","plugins","GeneralTab","AppearanceTab","PredefinedValues","ValidatorsTab","Grid","Cell","Typography","Elevation","useFieldEditor","invariant","ButtonDefault","ButtonPrimary","t","namespace","dialogBody","width","height","getValidators","fieldPlugin","key","defaultValidators","mappedValidators","byType","map","validator","allowedValidators","field","includes","name","optional","filteredValidators","filter","Boolean","sort","a","b","getListValidators","getFieldValidators","fieldEditorDialog","maxWidth","maxHeight","paddingTop","EditFieldDialog","onSubmit","props","current","setCurrent","getFieldPlugin","clonedField","renderer","item","canUse","renderPlugin","rendererName","onClose","render","headerTitle","type","fieldTypeLabel","label","data","form","predefinedValuesTabEnabled","allowPredefinedValues","predefinedValues","enabled","multipleValues","Array","isArray","validators","length","ev","submit"],"mappings":"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","sourcesContent":["import React, { useState, useEffect, useCallback } from \"react\";\nimport { cloneDeep } from \"lodash\";\nimport { css } from \"emotion\";\nimport { Dialog, DialogContent, DialogTitle, DialogActions } from \"@webiny/ui/Dialog\";\nimport { Form } from \"@webiny/form\";\nimport { Tabs, Tab } from \"@webiny/ui/Tabs\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport {\n CmsEditorField,\n CmsEditorFieldRendererPlugin,\n CmsEditorFieldTypePlugin,\n CmsEditorFieldValidatorPlugin\n} from \"~/types\";\nimport { plugins } from \"@webiny/plugins\";\nimport GeneralTab from \"./EditFieldDialog/GeneralTab\";\nimport AppearanceTab from \"./EditFieldDialog/AppearanceTab\";\nimport PredefinedValues from \"./EditFieldDialog/PredefinedValues\";\nimport ValidatorsTab from \"./EditFieldDialog/ValidatorsTab\";\nimport { Grid, Cell } from \"@webiny/ui/Grid\";\nimport { Typography } from \"@webiny/ui/Typography\";\nimport { Elevation } from \"@webiny/ui/Elevation\";\nimport { useFieldEditor } from \"~/admin/components/FieldEditor/useFieldEditor\";\nimport invariant from \"invariant\";\nimport { ButtonDefault, ButtonPrimary } from \"@webiny/ui/Button\";\n\nconst t = i18n.namespace(\"app-headless-cms/admin/components/editor\");\n\nconst dialogBody = css({\n \"&.webiny-ui-dialog__content\": {\n width: 875,\n height: 450\n }\n});\n\ninterface EditFieldDialogProps {\n field: CmsEditorField | null;\n onClose: () => void;\n onSubmit: (data: CmsEditorField) => void;\n}\n\ninterface Validator {\n optional: boolean;\n validator: CmsEditorFieldValidatorPlugin[\"validator\"];\n}\nconst getValidators = (\n fieldPlugin: CmsEditorFieldTypePlugin,\n /**\n * We only have validators and listValidators, thats why the strict string types\n */\n key: \"validators\" | \"listValidators\",\n defaultValidators: string[] = []\n): Validator[] => {\n const mappedValidators = plugins\n .byType<CmsEditorFieldValidatorPlugin>(\"cms-editor-field-validator\")\n .map(({ validator }) => {\n const allowedValidators = fieldPlugin.field[key] || defaultValidators;\n if (allowedValidators.includes(validator.name)) {\n return {\n optional: true,\n validator\n };\n } else if (allowedValidators.includes(`!${validator.name}`)) {\n return {\n optional: false,\n validator\n };\n }\n\n return null;\n });\n\n const filteredValidators = mappedValidators.filter(Boolean) as Validator[];\n\n return (\n filteredValidators\n /**\n * We can safely cast because we are filtering in previous step.\n */\n .sort((a: Validator, b: Validator) => {\n if (!a.optional && b.optional) {\n return -1;\n }\n\n if (a.optional && !b.optional) {\n return 1;\n }\n\n return 0;\n }) as Validator[]\n );\n};\n\nconst getListValidators = (fieldPlugin: CmsEditorFieldTypePlugin) => {\n return getValidators(fieldPlugin, \"listValidators\", [\"minLength\", \"maxLength\"]);\n};\n\nconst getFieldValidators = (fieldPlugin: CmsEditorFieldTypePlugin) => {\n return getValidators(fieldPlugin, \"validators\");\n};\n\nconst fieldEditorDialog = css({\n width: \"100vw\",\n height: \"100vh\",\n \".mdc-dialog__surface\": {\n maxWidth: \"100% !important\",\n maxHeight: \"100% !important\",\n \".webiny-ui-dialog__content\": {\n maxWidth: \"100% !important\",\n maxHeight: \"100% !important\",\n width: \"100vw\",\n height: \"calc(100vh - 155px)\",\n paddingTop: \"0 !important\"\n }\n }\n});\n\nconst EditFieldDialog: React.FC<EditFieldDialogProps> = ({ field, onSubmit, ...props }) => {\n const [current, setCurrent] = useState<CmsEditorField | null>(null);\n\n const { getFieldPlugin } = useFieldEditor();\n\n useEffect((): void => {\n if (!field) {\n setCurrent(field);\n return;\n }\n\n const clonedField = cloneDeep(field);\n\n if (!clonedField.renderer || !clonedField.renderer.name) {\n const [renderPlugin] = plugins\n .byType<CmsEditorFieldRendererPlugin>(\"cms-editor-field-renderer\")\n .filter(item => item.renderer.canUse({ field }));\n\n if (renderPlugin) {\n clonedField.renderer = { name: renderPlugin.renderer.rendererName };\n }\n }\n\n setCurrent(clonedField);\n }, [field]);\n\n const onClose = useCallback((): void => {\n setCurrent(null);\n props.onClose();\n }, []);\n\n let render = null;\n let headerTitle = t`Field Settings`;\n\n if (current) {\n /**\n * Something must be very wrong for field plugin to be missing.\n */\n const fieldPlugin = getFieldPlugin(current.type) as CmsEditorFieldTypePlugin;\n /**\n * We will throw error because of that.\n */\n invariant(fieldPlugin, `Missing field plugin for type \"${current.type}\".`);\n\n headerTitle = t`Field Settings - {fieldTypeLabel}`({\n fieldTypeLabel: fieldPlugin.field.label\n });\n\n render = (\n <Form\n data={current}\n onSubmit={data => {\n /**\n * We know that data is CmsEditorField.\n */\n return onSubmit(data as unknown as CmsEditorField);\n }}\n >\n {form => {\n const predefinedValuesTabEnabled =\n fieldPlugin.field.allowPredefinedValues &&\n form.data.predefinedValues &&\n form.data.predefinedValues.enabled;\n\n return (\n <>\n <DialogContent className={dialogBody}>\n <Tabs>\n <Tab label={t`General`}>\n <GeneralTab\n form={form}\n field={form.data as CmsEditorField}\n fieldPlugin={fieldPlugin}\n />\n </Tab>\n <Tab\n label={t`Predefined Values`}\n disabled={!predefinedValuesTabEnabled}\n >\n {predefinedValuesTabEnabled && (\n <PredefinedValues\n form={form}\n field={form.data as CmsEditorField}\n fieldPlugin={fieldPlugin}\n />\n )}\n </Tab>\n\n {form.data.multipleValues && (\n <Tab\n label={\"Validators\"}\n data-testid={\"cms.editor.field.tabs.validators\"}\n >\n <Grid>\n <Cell span={12}>\n <Typography use={\"headline5\"}>\n List validators\n </Typography>\n <br />\n <Typography use={\"body2\"}>\n These validators are applied to the entire\n list of values.\n </Typography>\n </Cell>\n <Cell span={12}>\n <Elevation z={2}>\n <ValidatorsTab\n field={current}\n name={\"listValidation\"}\n validators={getListValidators(\n fieldPlugin\n )}\n form={form}\n />\n </Elevation>\n </Cell>\n </Grid>\n\n <Grid>\n <Cell span={12}>\n <Typography use={\"headline5\"}>\n Individual value validators\n </Typography>\n <br />\n <Typography use={\"body2\"}>\n These validators are applied to each value\n in the list.\n </Typography>\n </Cell>\n <Cell span={12}>\n <Elevation z={2}>\n <ValidatorsTab\n field={current}\n form={form}\n name={\"validation\"}\n validators={getFieldValidators(\n fieldPlugin\n )}\n />\n </Elevation>\n </Cell>\n </Grid>\n </Tab>\n )}\n\n {!form.data.multipleValues &&\n Array.isArray(fieldPlugin.field.validators) &&\n fieldPlugin.field.validators.length > 0 && (\n <Tab\n label={\"Validators\"}\n data-testid={\"cms.editor.field.tabs.validators\"}\n >\n <ValidatorsTab\n field={current}\n form={form}\n name={\"validation\"}\n validators={getFieldValidators(fieldPlugin)}\n />\n </Tab>\n )}\n <Tab label={t`Appearance`}>\n <AppearanceTab\n form={form}\n field={form.data as CmsEditorField}\n // TODO @ts-refactor verify that this actually worked? There was no fieldPlugin in AppearanceTab props\n // @ts-ignore\n fieldPlugin={fieldPlugin}\n />\n </Tab>\n </Tabs>\n </DialogContent>\n <DialogActions>\n <ButtonDefault onClick={onClose}>{t`Cancel`}</ButtonDefault>\n <ButtonPrimary\n onClick={ev => {\n form.submit(ev);\n }}\n >{t`Save Field`}</ButtonPrimary>\n </DialogActions>\n </>\n );\n }}\n </Form>\n );\n }\n\n return (\n <Dialog\n preventOutsideDismiss\n open={!!current}\n onClose={onClose}\n data-testid={\"cms-editor-edit-fields-dialog\"}\n className={fieldEditorDialog}\n >\n <DialogTitle>{headerTitle}</DialogTitle>\n {render}\n </Dialog>\n );\n};\n\nexport default EditFieldDialog;\n"]}

package/admin/components/FieldEditor/Field.js CHANGED Viewed

@@ -133,8 +133,8 @@ var Field = function Field(props) {
     return null;
   }
-  var isTitleField = field.fieldId === data.titleFieldId && !parent;
-  var lockedFields = data.lockedFields || [];
+  var isTitleField = data && field.fieldId === data.titleFieldId && !parent;
+  var lockedFields = data ? data.lockedFields || [] : [];
   return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(FieldContainer, null, /*#__PURE__*/React.createElement(Info, null, /*#__PURE__*/React.createElement(Typography, {
     use: "subtitle1"
   }, field.label), /*#__PURE__*/React.createElement(Typography, {

package/admin/components/FieldEditor/Field.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["Field.tsx"],"names":["React","Fragment","useCallback","css","styled","IconButton","Typography","ReactComponent","EditIcon","DeleteIcon","TitleIcon","MoreVerticalIcon","Menu","MenuItem","plugins","ListItemGraphic","Icon","i18n","useSnackbar","useContentModelEditor","useFieldEditor","t","ns","FieldContainer","display","flexDirection","justifyContent","alignItems","Info","flex","lineHeight","Actions","menuStyles","width","right","left","opacity","pointerEvents","allowedTitleFieldTypes","isFieldAllowedToBeTitle","field","parent","multipleValues","includes","type","Field","props","onEdit","showSnackbar","setData","data","getFieldPlugin","onDelete","fieldId","setAsTitle","titleFieldId","response","error","message","fieldPlugin","editorFieldOptionPlugins","byType","isTitleField","lockedFields","label","map","pl","cloneElement","render","key","name","some","lockedField","find","memo"],"mappings":";;;;;;;AAAA,OAAOA,KAAP,IAAgBC,QAAhB,EAA0BC,WAA1B,QAA6C,OAA7C;AACA,SAASC,GAAT,QAAoB,SAApB;AACA,OAAOC,MAAP,MAAmB,iBAAnB;AACA,SAASC,UAAT,QAA2B,mBAA3B;AACA,SAASC,UAAT,QAA2B,uBAA3B;AACA,SAASC,cAAc,IAAIC,QAA3B;AACA,SAASD,cAAc,IAAIE,UAA3B;AACA,SAASF,cAAc,IAAIG,SAA3B;AACA,SAASH,cAAc,IAAII,gBAA3B;AACA,SAASC,IAAT,EAAeC,QAAf,QAA+B,iBAA/B;AACA,SAASC,OAAT,QAAwB,iBAAxB;AAEA,SAASC,eAAT,QAAgC,iBAAhC;AACA,SAASC,IAAT,QAAqB,iBAArB;AACA,SAASC,IAAT,QAAqB,kBAArB;AACA,SAASC,WAAT,QAA4B,qCAA5B;AACA,SAASC,qBAAT;AACA,SAASC,cAAT;AAEA,IAAMC,CAAC,GAAGJ,IAAI,CAACK,EAAL,CAAQ,gDAAR,CAAV;AAEA,IAAMC,cAAc,gBAAGnB,MAAH,CAAU,KAAV;AAAA;AAAA;AAAA,GAAiB;AACjCoB,EAAAA,OAAO,EAAE,MADwB;AAEjCC,EAAAA,aAAa,EAAE,KAFkB;AAGjCC,EAAAA,cAAc,EAAE,eAHiB;AAIjCC,EAAAA,UAAU,EAAE;AAJqB,CAAjB,CAApB;AAOA,IAAMC,IAAI,gBAAGxB,MAAH,CAAU,KAAV;AAAA;AAAA;AAAA,GAAiB;AACvBoB,EAAAA,OAAO,EAAE,MADc;AAEvBC,EAAAA,aAAa,EAAE,QAFQ;AAGvB,SAAO;AACHI,IAAAA,IAAI,EAAE,QADH;AAEHC,IAAAA,UAAU,EAAE;AAFT;AAHgB,CAAjB,CAAV;AASA,IAAMC,OAAO,gBAAG3B,MAAH,CAAU,KAAV;AAAA;AAAA;AAAA,GAAiB;AAC1BoB,EAAAA,OAAO,EAAE,MADiB;AAE1BC,EAAAA,aAAa,EAAE,KAFW;AAG1BE,EAAAA,UAAU,EAAE,OAHc;AAI1B,SAAO;AACHE,IAAAA,IAAI,EAAE;AADH;AAJmB,CAAjB,CAAb;AASA,IAAMG,UAAU,gBAAG7B,GAAG,CAAC;AACnB8B,EAAAA,KAAK,EAAE,GADY;AAEnBC,EAAAA,KAAK,EAAE,CAAC,GAFW;AAGnBC,EAAAA,IAAI,EAAE,iBAHa;AAInB,eAAa;AACTC,IAAAA,OAAO,EAAE,GADA;AAETC,IAAAA,aAAa,EAAE;AAFN;AAJM,CAAD,sBAAtB;AAUA,IAAMC,sBAAgC,GAAG,CAAC,MAAD,EAAS,QAAT,CAAzC;;AAEA,IAAMC,uBAAuB,GAAG,SAA1BA,uBAA0B,CAACC,KAAD,EAAwBC,MAAxB,EAAoD;AAChF,MAAID,KAAK,CAACE,cAAN,IAAwBD,MAA5B,EAAoC;AAChC,WAAO,KAAP;AACH,GAFD,MAEO,IAAIH,sBAAsB,CAACK,QAAvB,CAAgCH,KAAK,CAACI,IAAtC,MAAgD,KAApD,EAA2D;AAC9D,WAAO,KAAP;AACH;;AACD,SAAO,IAAP;AACH,CAPD;;AAeA,IAAMC,KAA2B,GAAG,SAA9BA,KAA8B,CAAAC,KAAK,EAAI;AACzC,MAAQN,KAAR,GAAkCM,KAAlC,CAAQN,KAAR;AAAA,MAAeO,MAAf,GAAkCD,KAAlC,CAAeC,MAAf;AAAA,MAAuBN,MAAvB,GAAkCK,KAAlC,CAAuBL,MAAvB;;AACA,qBAAyBvB,WAAW,EAApC;AAAA,MAAQ8B,YAAR,gBAAQA,YAAR;;AACA,8BAA0B7B,qBAAqB,EAA/C;AAAA,MAAQ8B,OAAR,yBAAQA,OAAR;AAAA,MAAiBC,IAAjB,yBAAiBA,IAAjB;;AACA,wBAA2B9B,cAAc,EAAzC;AAAA,MAAQ+B,cAAR,mBAAQA,cAAR;;AAEA,MAAMC,QAAQ,GAAGlD,WAAW,CAAC,YAAM;AAC/B4C,IAAAA,KAAK,CAACM,QAAN,CAAeZ,KAAf;AACH,GAF2B,EAEzB,CAACA,KAAK,CAACa,OAAP,CAFyB,CAA5B;AAIA,MAAMC,UAAU,GAAGpD,WAAW,wEAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBACJ+C,OAAO,CAAC,UAAAC,IAAI,EAAI;AACnC,qDAAYA,IAAZ;AAAkBK,gBAAAA,YAAY,EAAEf,KAAK,CAACa;AAAtC;AACH,aAF6B,CADH;;AAAA;AACrBG,YAAAA,QADqB;;AAAA,iBAKvBA,QAAQ,CAACC,KALc;AAAA;AAAA;AAAA;;AAAA,6CAMhBT,YAAY,CAACQ,QAAQ,CAACC,KAAT,CAAeC,OAAhB,CANI;;AAAA;AAS3BV,YAAAA,YAAY,CAAC3B,CAAD,mGAAZ;;AAT2B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAAD,IAU3B,CAACmB,KAAK,CAACa,OAAP,CAV2B,CAA9B;AAYA,MAAMM,WAAW,GAAGR,cAAc,CAACX,KAAK,CAACI,IAAP,CAAlC;AACA,MAAMgB,wBAAwB,GAC1B9C,OAAO,CAAC+C,MAAR,CAA2C,yBAA3C,CADJ;;AAGA,MAAI,CAACF,WAAL,EAAkB;AACd,WAAO,IAAP;AACH;;AAED,MAAMG,YAAY,GAAGZ,IAAI,IAAIV,KAAK,CAACa,OAAN,KAAkBH,IAAI,CAACK,YAA/B,IAA+C,CAACd,MAArE;AAEA,MAAMsB,YAAY,GAAGb,IAAI,GAAGA,IAAI,CAACa,YAAL,IAAqB,EAAxB,GAA6B,EAAtD;AACA,sBACI,oBAAC,QAAD,qBACI,oBAAC,cAAD,qBACI,oBAAC,IAAD,qBACI,oBAAC,UAAD;AAAY,IAAA,GAAG,EAAE;AAAjB,KAA+BvB,KAAK,CAACwB,KAArC,CADJ,eAEI,oBAAC,UAAD;AAAY,IAAA,GAAG,EAAE;AAAjB,KACKL,WAAW,CAACnB,KAAZ,CAAkBwB,KADvB,EAC8B,GAD9B,EAEKxB,KAAK,CAACE,cAAN,iBAAwB,+CAAIrB,CAAJ,4FAF7B,EAGKyC,YAAY,iBAAI,+CAAIzC,CAAJ,wFAHrB,CAFJ,CADJ,eASI,oBAAC,OAAD,qBACI,oBAAC,UAAD;AACI,mBAAa,uBADjB;AAEI,IAAA,IAAI,eAAE,oBAAC,QAAD,OAFV;AAGI,IAAA,OAAO,EAAE;AAAA,aAAM0B,MAAM,CAACP,KAAD,CAAZ;AAAA;AAHb,IADJ,eAMI,oBAAC,IAAD;AACI,IAAA,SAAS,EAAER,UADf;AAEI,IAAA,MAAM,eAAE,oBAAC,UAAD;AAAY,MAAA,IAAI,eAAE,oBAAC,gBAAD;AAAlB;AAFZ,KAIK4B,wBAAwB,CAACK,GAAzB,CAA6B,UAAAC,EAAE;AAAA,wBAC5BlE,KAAK,CAACmE,YAAN,CAAmBD,EAAE,CAACE,MAAH,EAAnB,EAAgC;AAAEC,MAAAA,GAAG,EAAEH,EAAE,CAACI;AAAV,KAAhC,CAD4B;AAAA,GAA/B,CAJL,eAQI,oBAAC,QAAD;AACI,IAAA,QAAQ,EAAE,CAAC/B,uBAAuB,CAACC,KAAD,EAAQC,MAAR,CADtC;AAEI,IAAA,OAAO,EAAEa;AAFb,kBAII,oBAAC,eAAD,qBACI,oBAAC,IAAD;AAAM,IAAA,IAAI,eAAE,oBAAC,SAAD;AAAZ,IADJ,CAJJ,EAOKjC,CAPL,oFARJ,eAiBI,oBAAC,QAAD;AACI,IAAA,QAAQ,EAAE0C,YAAY,CAACQ,IAAb,CACN,UAAAC,WAAW;AAAA,aAAIA,WAAW,CAACnB,OAAZ,KAAwBb,KAAK,CAACa,OAAlC;AAAA,KADL,CADd;AAII,IAAA,OAAO,EAAED;AAJb,kBAMI,oBAAC,eAAD,qBACI,oBAAC,IAAD;AAAM,IAAA,IAAI,eAAE,oBAAC,UAAD;AAAZ,IADJ,CANJ,EASKW,YAAY,CAACU,IAAb,CAAkB,UAAAD,WAAW;AAAA,WAAIA,WAAW,CAACnB,OAAZ,KAAwBb,KAAK,CAACa,OAAlC;AAAA,GAA7B,IACKhC,CADL,uFAEKA,CAFL,6EATL,CAjBJ,CANJ,CATJ,CADJ,eAiDI;AAAK,IAAA,SAAS,EAAE;AAAhB,KACKsC,WAAW,CAACnB,KAAZ,CAAkB4B,MAAlB,IAA4BT,WAAW,CAACnB,KAAZ,CAAkB4B,MAAlB,CAAyB;AAAE5B,IAAAA,KAAK,EAALA,KAAF;AAASU,IAAAA,IAAI,EAAJA,IAAT;AAAeD,IAAAA,OAAO,EAAPA;AAAf,GAAzB,CADjC,CAjDJ,CADJ;AAuDH,CAxFD;;AA0FA,4BAAejD,KAAK,CAAC0E,IAAN,CAAW7B,KAAX,CAAf","sourcesContent":["import React, { Fragment, useCallback } from \"react\";\nimport { css } from \"emotion\";\nimport styled from \"@emotion/styled\";\nimport { IconButton } from \"@webiny/ui/Button\";\nimport { Typography } from \"@webiny/ui/Typography\";\nimport { ReactComponent as EditIcon } from \"~/admin/icons/edit.svg\";\nimport { ReactComponent as DeleteIcon } from \"~/admin/icons/delete.svg\";\nimport { ReactComponent as TitleIcon } from \"~/admin/icons/title-24px.svg\";\nimport { ReactComponent as MoreVerticalIcon } from \"~/admin/icons/more_vert.svg\";\nimport { Menu, MenuItem } from \"@webiny/ui/Menu\";\nimport { plugins } from \"@webiny/plugins\";\nimport { CmsEditorField, CmsEditorFieldOptionPlugin } from \"~/types\";\nimport { ListItemGraphic } from \"@webiny/ui/List\";\nimport { Icon } from \"@webiny/ui/Icon\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { useSnackbar } from \"@webiny/app-admin/hooks/useSnackbar\";\nimport { useContentModelEditor } from \"~/admin/components/ContentModelEditor/useContentModelEditor\";\nimport { useFieldEditor } from \"~/admin/components/FieldEditor/useFieldEditor\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/components/editor/field\");\n\nconst FieldContainer = styled(\"div\")({\n display: \"flex\",\n flexDirection: \"row\",\n justifyContent: \"space-between\",\n alignItems: \"center\"\n});\n\nconst Info = styled(\"div\")({\n display: \"flex\",\n flexDirection: \"column\",\n \"> *\": {\n flex: \"1 100%\",\n lineHeight: \"150%\"\n }\n});\n\nconst Actions = styled(\"div\")({\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"right\",\n \"> *\": {\n flex: \"1 100%\"\n }\n});\n\nconst menuStyles = css({\n width: 220,\n right: -105,\n left: \"auto !important\",\n \".disabled\": {\n opacity: 0.5,\n pointerEvents: \"none\"\n }\n});\n\nconst allowedTitleFieldTypes: string[] = [\"text\", \"number\"];\n\nconst isFieldAllowedToBeTitle = (field: CmsEditorField, parent?: CmsEditorField) => {\n if (field.multipleValues || parent) {\n return false;\n } else if (allowedTitleFieldTypes.includes(field.type) === false) {\n return false;\n }\n return true;\n};\n\nexport interface FieldProps {\n field: CmsEditorField;\n onDelete: (field: CmsEditorField) => void;\n onEdit: (field: CmsEditorField) => void;\n parent?: CmsEditorField;\n}\nconst Field: React.FC<FieldProps> = props => {\n const { field, onEdit, parent } = props;\n const { showSnackbar } = useSnackbar();\n const { setData, data } = useContentModelEditor();\n const { getFieldPlugin } = useFieldEditor();\n\n const onDelete = useCallback(() => {\n props.onDelete(field);\n }, [field.fieldId]);\n\n const setAsTitle = useCallback(async (): Promise<void> => {\n const response = await setData(data => {\n return { ...data, titleFieldId: field.fieldId };\n });\n\n if (response.error) {\n return showSnackbar(response.error.message);\n }\n\n showSnackbar(t`Title field set successfully.`);\n }, [field.fieldId]);\n\n const fieldPlugin = getFieldPlugin(field.type);\n const editorFieldOptionPlugins =\n plugins.byType<CmsEditorFieldOptionPlugin>(\"cms-editor-field-option\");\n\n if (!fieldPlugin) {\n return null;\n }\n\n const isTitleField = data && field.fieldId === data.titleFieldId && !parent;\n\n const lockedFields = data ? data.lockedFields || [] : [];\n return (\n <Fragment>\n <FieldContainer>\n <Info>\n <Typography use={\"subtitle1\"}>{field.label}</Typography>\n <Typography use={\"caption\"}>\n {fieldPlugin.field.label}{\" \"}\n {field.multipleValues && <>({t`multiple values`})</>}\n {isTitleField && <>({t`entry title`})</>}\n </Typography>\n </Info>\n <Actions>\n <IconButton\n data-testid={\"cms.editor.edit-field\"}\n icon={<EditIcon />}\n onClick={() => onEdit(field)}\n />\n <Menu\n className={menuStyles}\n handle={<IconButton icon={<MoreVerticalIcon />} />}\n >\n {editorFieldOptionPlugins.map(pl =>\n React.cloneElement(pl.render(), { key: pl.name })\n )}\n {/* We only allow this action for top-level fields. */}\n <MenuItem\n disabled={!isFieldAllowedToBeTitle(field, parent)}\n onClick={setAsTitle}\n >\n <ListItemGraphic>\n <Icon icon={<TitleIcon />} />\n </ListItemGraphic>\n {t`Use as title`}\n </MenuItem>\n <MenuItem\n disabled={lockedFields.some(\n lockedField => lockedField.fieldId === field.fieldId\n )}\n onClick={onDelete}\n >\n <ListItemGraphic>\n <Icon icon={<DeleteIcon />} />\n </ListItemGraphic>\n {lockedFields.find(lockedField => lockedField.fieldId === field.fieldId)\n ? t`Cannot delete`\n : t`Delete`}\n </MenuItem>\n </Menu>\n </Actions>\n </FieldContainer>\n <div className={\"field-extra\"}>\n {fieldPlugin.field.render && fieldPlugin.field.render({ field, data, setData })}\n </div>\n </Fragment>\n );\n};\n\nexport default React.memo(Field);\n"]}

package/admin/components/FieldEditor/FieldEditor.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["FieldEditor.tsx"],"names":["React","Fragment","get","Icon","i18n","ReactComponent","HandleIcon","Center","Vertical","Horizontal","Draggable","EditFieldDialog","Field","rowHandle","fieldHandle","fieldContainer","Row","RowContainer","useFieldEditor","FieldEditorProvider","t","namespace","fieldTypes","Editor","parent","depth","insertField","updateField","deleteField","fields","noConflict","editField","onFieldDrop","onEndDrag","field","dropTarget","length","item","row","index","padding","map","fieldId","type","pos","f","join","drag","isDragging","opacity","fieldIndex","includes","id","position","FieldEditor","props"],"mappings":"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","sourcesContent":["import React, { Fragment } from \"react\";\nimport get from \"lodash/get\";\nimport { Icon } from \"@webiny/ui/Icon\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { ReactComponent as HandleIcon } from \"~/admin/icons/round-drag_indicator-24px.svg\";\nimport { Center, Vertical, Horizontal } from \"../DropZone\";\nimport Draggable from \"../Draggable\";\nimport EditFieldDialog from \"./EditFieldDialog\";\nimport Field from \"./Field\";\nimport { rowHandle, fieldHandle, fieldContainer, Row, RowContainer } from \"./Styled\";\nimport { useFieldEditor } from \"./useFieldEditor\";\nimport { FieldEditorProvider } from \"./FieldEditorContext\";\nimport { CmsEditorField, CmsEditorFieldsLayout } from \"~/types\";\n\nconst t = i18n.namespace(\"app-headless-cms/admin/components/editor\");\n\nconst fieldTypes: string[] = [\"field\", \"newField\"];\n\nconst Editor: React.FC = () => {\n const {\n parent,\n depth,\n insertField,\n updateField,\n deleteField,\n fields,\n noConflict,\n editField,\n onFieldDrop,\n onEndDrag,\n field,\n dropTarget\n } = useFieldEditor();\n\n return (\n <Fragment>\n {fields.length === 0 && (\n <Center\n onDrop={item =>\n onFieldDrop(item, {\n row: 0,\n index: 0\n })\n }\n style={{ padding: \"5px 0 15px 0\" }}\n >\n {t`Drop your first field here`}\n </Center>\n )}\n\n {fields.map((row, index) => (\n <Draggable\n beginDrag={{\n parent: parent ? parent.fieldId : null,\n type: \"row\",\n fields: row,\n pos: { row: index }\n }}\n endDrag={onEndDrag}\n key={row.map(f => f.fieldId).join(\".\")}\n >\n {(\n {\n drag,\n isDragging\n } /* RowContainer start - includes drag handle, drop zones and the Row itself. */\n ) => (\n <RowContainer style={{ opacity: isDragging ? 0.3 : 1 }}>\n <div className={rowHandle} ref={drag}>\n <Icon icon={<HandleIcon />} />\n </div>\n <Horizontal\n data-testid={`cms-editor-row-droppable-top-${index}`}\n isVisible={noConflict()}\n onDrop={item => onFieldDrop(item, { row: index, index: null })}\n />\n {/* Row start - includes field drop zones and fields */}\n <Row data-testid={\"cms.editor.field-row\"}>\n {row.map((field, fieldIndex) => (\n <Draggable\n key={field.fieldId}\n beginDrag={{\n parent: parent ? parent.fieldId : null,\n type: \"field\",\n field,\n pos: {\n row: index,\n index: fieldIndex\n }\n }}\n endDrag={onEndDrag}\n >\n {({ drag }) => (\n <div className={fieldContainer} ref={drag}>\n <Vertical\n depth={depth}\n onDrop={item =>\n onFieldDrop(item, {\n row: index,\n index: fieldIndex\n })\n }\n isVisible={noConflict(\n item =>\n fieldTypes.includes(item.type) &&\n (row.length < 4 ||\n get(item, \"pos.row\") === index)\n )}\n />\n\n <div className={fieldHandle}>\n <Field\n parent={parent}\n field={field}\n onEdit={editField}\n onDelete={deleteField}\n />\n </div>\n\n {/* Field end */}\n {fieldIndex === row.length - 1 && (\n <Vertical\n last\n depth={depth}\n isVisible={noConflict(\n item =>\n fieldTypes.includes(item.type) &&\n (row.length < 4 ||\n get(item, \"pos.row\") === index)\n )}\n onDrop={item =>\n onFieldDrop(item, {\n row: index,\n index: fieldIndex + 1\n })\n }\n />\n )}\n </div>\n )}\n </Draggable>\n ))}\n </Row>\n {/* Row end */}\n {index === fields.length - 1 && (\n <Horizontal\n data-testid={`cms-editor-row-droppable-bottom-${index}`}\n last\n isVisible={noConflict()}\n onDrop={item =>\n onFieldDrop(item, {\n row: index + 1,\n index: null\n })\n }\n />\n )}\n </RowContainer>\n )}\n </Draggable>\n ))}\n\n <EditFieldDialog\n field={field}\n onClose={() => editField(null)}\n onSubmit={field => {\n if (field.id) {\n updateField(field);\n editField(null);\n return;\n }\n insertField({ field, position: dropTarget });\n\n editField(null);\n }}\n />\n </Fragment>\n );\n};\n\nexport interface FieldEditorProps {\n parent?: CmsEditorField;\n layout: CmsEditorFieldsLayout;\n fields: CmsEditorField[];\n onChange: (params: { fields: CmsEditorField[]; layout: CmsEditorFieldsLayout }) => void;\n}\n\nexport const FieldEditor: React.FC<FieldEditorProps> = props => {\n return (\n <FieldEditorProvider {...props}>\n <Editor />\n </FieldEditorProvider>\n );\n};\n"]}

package/admin/components/FieldEditor/FieldEditorContext.d.ts CHANGED Viewed

@@ -4,7 +4,7 @@ import { FieldEditorProps } from "./FieldEditor";
 import { DragObjectWithType, DragSourceMonitor } from "react-dnd";
 interface DropTarget {
     row: number;
-    index: number;
+    index: number | null;
 }
 interface Position {
     row: number;
@@ -15,7 +15,7 @@ export interface DragSource extends DragObjectWithType {
     pos?: Partial<Position>;
     type: "row" | "field" | "newField";
     fieldType?: string;
-    field?: CmsEditorField;
+    field?: CmsEditorField | null;
     fields?: CmsEditorField[];
 }
 /**
@@ -37,10 +37,10 @@ interface GetFieldsInLayoutCallable {
     (): CmsEditorField[][];
 }
 interface GetFieldPluginCallable {
-    (type: string): CmsEditorFieldTypePlugin;
+    (type: string): CmsEditorFieldTypePlugin | undefined;
 }
 interface GetFieldCallable {
-    (query: GetFieldParams): CmsEditorField;
+    (query: GetFieldParams): CmsEditorField | undefined;
 }
 interface OnFieldDropCallable {
     (source: Partial<DragSource>, target: DropTarget): void;
@@ -58,10 +58,10 @@ interface MoveRowCallable {
     (source: number, destination: number): void;
 }
 interface UpdateFieldCallable {
-    (field: CmsEditorField): void;
+    (field: Pick<CmsEditorField, "id">): void;
 }
 interface DeleteFieldCallable {
-    (field: CmsEditorField): void;
+    (field: Pick<CmsEditorField, "id">): void;
 }
 interface IsVisibleCallable {
     (item: DragSource): boolean;
@@ -78,10 +78,10 @@ export interface FieldEditorContextValue {
     getFieldPlugin: GetFieldPluginCallable;
     getField: GetFieldCallable;
     editField: (field: CmsEditorField | null) => void;
-    field: CmsEditorField;
-    parent: CmsEditorField;
+    field: CmsEditorField | null;
+    parent?: CmsEditorField;
     depth: number;
-    dropTarget?: DropTarget;
+    dropTarget: DropTarget;
     onFieldDrop: OnFieldDropCallable;
     onEndDrag: OnEndDragCallable;
     insertField: InsertFieldCallable;