@webiny/app-headless-cms 5.29.0-beta.2 → 5.30.0-beta.1
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.
- package/HeadlessCMS.js +5 -1
- package/HeadlessCMS.js.map +1 -1
- package/admin/components/ContentEntryForm/useBind.js +23 -1
- package/admin/components/ContentEntryForm/useBind.js.map +1 -1
- package/admin/components/ContentModelEditor/Editor.js +1 -1
- package/admin/components/ContentModelEditor/Editor.js.map +1 -1
- package/admin/components/FieldEditor/EditFieldDialog/AppearanceTab.js +1 -1
- package/admin/components/FieldEditor/EditFieldDialog/AppearanceTab.js.map +1 -1
- package/admin/components/FieldEditor/EditFieldDialog/GeneralTab.js +10 -5
- package/admin/components/FieldEditor/EditFieldDialog/GeneralTab.js.map +1 -1
- package/admin/components/FieldEditor/EditFieldDialog/ValidatorsTab.js +1 -0
- package/admin/components/FieldEditor/EditFieldDialog/ValidatorsTab.js.map +1 -1
- package/admin/components/FieldEditor/EditFieldDialog.js +8 -7
- package/admin/components/FieldEditor/EditFieldDialog.js.map +1 -1
- package/admin/contexts/Cms/index.d.ts +60 -0
- package/admin/contexts/Cms/index.js +107 -9
- package/admin/contexts/Cms/index.js.map +1 -1
- package/admin/plugins/editor/defaultBar/SaveContentModelButton.js +1 -0
- package/admin/plugins/editor/defaultBar/SaveContentModelButton.js.map +1 -1
- package/admin/plugins/entry/DefaultOnEntryDelete.d.ts +2 -0
- package/admin/plugins/entry/DefaultOnEntryDelete.js +204 -0
- package/admin/plugins/entry/DefaultOnEntryDelete.js.map +1 -0
- package/admin/plugins/entry/DefaultOnEntryPublish.d.ts +2 -0
- package/admin/plugins/entry/DefaultOnEntryPublish.js +176 -0
- package/admin/plugins/entry/DefaultOnEntryPublish.js.map +1 -0
- package/admin/plugins/fieldRenderers/Accordion.js +3 -0
- package/admin/plugins/fieldRenderers/Accordion.js.map +1 -1
- package/admin/plugins/fieldRenderers/DynamicSection.d.ts +11 -8
- package/admin/plugins/fieldRenderers/DynamicSection.js +0 -3
- package/admin/plugins/fieldRenderers/DynamicSection.js.map +1 -1
- package/admin/plugins/fieldRenderers/boolean/booleanSwitch.js +2 -1
- package/admin/plugins/fieldRenderers/boolean/booleanSwitch.js.map +1 -1
- package/admin/plugins/fieldRenderers/checkboxes.js +2 -1
- package/admin/plugins/fieldRenderers/checkboxes.js.map +1 -1
- package/admin/plugins/fieldRenderers/dateTime/Input.js +2 -1
- package/admin/plugins/fieldRenderers/dateTime/Input.js.map +1 -1
- package/admin/plugins/fieldRenderers/dateTime/Select.js +2 -1
- package/admin/plugins/fieldRenderers/dateTime/Select.js.map +1 -1
- package/admin/plugins/fieldRenderers/dateTime/utils.d.ts +3 -3
- package/admin/plugins/fieldRenderers/file/fileField.js +2 -1
- package/admin/plugins/fieldRenderers/file/fileField.js.map +1 -1
- package/admin/plugins/fieldRenderers/file/fileFields.js +4 -2
- package/admin/plugins/fieldRenderers/file/fileFields.js.map +1 -1
- package/admin/plugins/fieldRenderers/longText/longText.js +2 -1
- package/admin/plugins/fieldRenderers/longText/longText.js.map +1 -1
- package/admin/plugins/fieldRenderers/number/numberInput.js +2 -1
- package/admin/plugins/fieldRenderers/number/numberInput.js.map +1 -1
- package/admin/plugins/fieldRenderers/object/StyledComponents.d.ts +2 -0
- package/admin/plugins/fieldRenderers/object/StyledComponents.js +37 -2
- package/admin/plugins/fieldRenderers/object/StyledComponents.js.map +1 -1
- package/admin/plugins/fieldRenderers/object/arrow_drop_down.svg +1 -0
- package/admin/plugins/fieldRenderers/object/arrow_drop_up.svg +1 -0
- package/admin/plugins/fieldRenderers/object/multipleObjects.js +101 -47
- package/admin/plugins/fieldRenderers/object/multipleObjects.js.map +1 -1
- package/admin/plugins/fieldRenderers/radioButtons.js +2 -1
- package/admin/plugins/fieldRenderers/radioButtons.js.map +1 -1
- package/admin/plugins/fieldRenderers/ref/components/ContentEntriesAutocomplete.js +5 -5
- package/admin/plugins/fieldRenderers/ref/components/ContentEntriesAutocomplete.js.map +1 -1
- package/admin/plugins/fieldRenderers/ref/components/useReference.js +6 -1
- package/admin/plugins/fieldRenderers/ref/components/useReference.js.map +1 -1
- package/admin/plugins/fieldRenderers/richText/richTextInput.js +2 -1
- package/admin/plugins/fieldRenderers/richText/richTextInput.js.map +1 -1
- package/admin/plugins/fieldRenderers/richText/richTextInputs.js +2 -2
- package/admin/plugins/fieldRenderers/richText/richTextInputs.js.map +1 -1
- package/admin/plugins/fieldRenderers/select.js +2 -1
- package/admin/plugins/fieldRenderers/select.js.map +1 -1
- package/admin/plugins/fieldRenderers/text/textInput.js +2 -1
- package/admin/plugins/fieldRenderers/text/textInput.js.map +1 -1
- package/admin/plugins/fieldValidators/date/availableValidators.d.ts +1 -1
- package/admin/plugins/validators/unique.d.ts +1 -1
- package/admin/views/contentEntries/ContentEntriesList.js +7 -2
- package/admin/views/contentEntries/ContentEntriesList.js.map +1 -1
- package/admin/views/contentEntries/ContentEntry/ContentEntryContext.d.ts +4 -6
- package/admin/views/contentEntries/ContentEntry/ContentEntryContext.js +12 -71
- package/admin/views/contentEntries/ContentEntry/ContentEntryContext.js.map +1 -1
- package/admin/views/contentEntries/ContentEntry/PublishEntryRevisionListItem.d.ts +1 -0
- package/admin/views/contentEntries/ContentEntry/PublishEntryRevisionListItem.js +35 -0
- package/admin/views/contentEntries/ContentEntry/PublishEntryRevisionListItem.js.map +1 -0
- package/admin/views/contentEntries/ContentEntry/RevisionListItem.js +9 -11
- package/admin/views/contentEntries/ContentEntry/RevisionListItem.js.map +1 -1
- package/admin/views/contentEntries/ContentEntry/cache.js +47 -21
- package/admin/views/contentEntries/ContentEntry/cache.js.map +1 -1
- package/admin/views/contentEntries/ContentEntry/header/contentFormOptionsMenu/ContentFormOptionsMenu.js +32 -46
- package/admin/views/contentEntries/ContentEntry/header/contentFormOptionsMenu/ContentFormOptionsMenu.js.map +1 -1
- package/admin/views/contentEntries/ContentEntry/header/index.js +6 -6
- package/admin/views/contentEntries/ContentEntry/header/index.js.map +1 -1
- package/admin/views/contentEntries/ContentEntry/header/requestChanges/RequestChanges.d.ts +1 -2
- package/admin/views/contentEntries/ContentEntry/header/requestChanges/RequestChanges.js +6 -4
- package/admin/views/contentEntries/ContentEntry/header/requestChanges/RequestChanges.js.map +1 -1
- package/admin/views/contentEntries/ContentEntry/header/requestReview/RequestReview.d.ts +1 -3
- package/admin/views/contentEntries/ContentEntry/header/requestReview/RequestReview.js +6 -4
- package/admin/views/contentEntries/ContentEntry/header/requestReview/RequestReview.js.map +1 -1
- package/admin/views/contentEntries/ContentEntry/header/saveAndPublishContent/SaveAndPublishContent.d.ts +1 -3
- package/admin/views/contentEntries/ContentEntry/header/saveAndPublishContent/SaveAndPublishContent.js +45 -38
- package/admin/views/contentEntries/ContentEntry/header/saveAndPublishContent/SaveAndPublishContent.js.map +1 -1
- package/admin/views/contentEntries/ContentEntry/useRevision.js +57 -70
- package/admin/views/contentEntries/ContentEntry/useRevision.js.map +1 -1
- package/admin/views/contentEntries/ContentEntry.js +2 -4
- package/admin/views/contentEntries/ContentEntry.js.map +1 -1
- package/admin/views/contentEntries/hooks/useContentEntry.js +7 -1
- package/admin/views/contentEntries/hooks/useContentEntry.js.map +1 -1
- package/admin/views/contentModels/NewContentModelDialog.js +6 -3
- package/admin/views/contentModels/NewContentModelDialog.js.map +1 -1
- package/package.json +21 -20
- package/types.d.ts +10 -7
- package/types.js.map +1 -1
package/HeadlessCMS.js
CHANGED
|
@@ -23,6 +23,10 @@ var _apiInformation = _interopRequireDefault(require("./admin/plugins/apiInforma
|
|
|
23
23
|
|
|
24
24
|
var _ContentEntriesModule = require("./admin/views/contentEntries/experiment/ContentEntriesModule");
|
|
25
25
|
|
|
26
|
+
var _DefaultOnEntryDelete = require("./admin/plugins/entry/DefaultOnEntryDelete");
|
|
27
|
+
|
|
28
|
+
var _DefaultOnEntryPublish = require("./admin/plugins/entry/DefaultOnEntryPublish");
|
|
29
|
+
|
|
26
30
|
var createHeadlessCMSProvider = function createHeadlessCMSProvider(createApolloClient) {
|
|
27
31
|
return function (Component) {
|
|
28
32
|
return function HeadlessCMSProvider(_ref) {
|
|
@@ -41,7 +45,7 @@ var HeadlessCMSExtension = function HeadlessCMSExtension(_ref2) {
|
|
|
41
45
|
|
|
42
46
|
return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_ContentEntriesModule.ContentEntriesModule, null), /*#__PURE__*/_react.default.createElement(_appAdmin.Provider, {
|
|
43
47
|
hoc: createHeadlessCMSProvider(createApolloClient)
|
|
44
|
-
}), /*#__PURE__*/_react.default.createElement(_appAdmin.Plugins, null, /*#__PURE__*/_react.default.createElement(_CmsMenuLoader.CmsMenuLoader, null)));
|
|
48
|
+
}), /*#__PURE__*/_react.default.createElement(_appAdmin.Plugins, null, /*#__PURE__*/_react.default.createElement(_CmsMenuLoader.CmsMenuLoader, null), /*#__PURE__*/_react.default.createElement(_DefaultOnEntryDelete.DefaultOnEntryDelete, null), /*#__PURE__*/_react.default.createElement(_DefaultOnEntryPublish.DefaultOnEntryPublish, null)));
|
|
45
49
|
};
|
|
46
50
|
|
|
47
51
|
var HeadlessCMS = /*#__PURE__*/(0, _react.memo)(HeadlessCMSExtension);
|
package/HeadlessCMS.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["createHeadlessCMSProvider","createApolloClient","Component","HeadlessCMSProvider","children","HeadlessCMSExtension","plugins","register","apiInformation","HeadlessCMS","memo"],"sources":["HeadlessCMS.tsx"],"sourcesContent":["import React, { Fragment, memo } from \"react\";\nimport { plugins } from \"@webiny/plugins\";\nimport { Plugins, Provider } from \"@webiny/app-admin\";\nimport { ApolloClient } from \"apollo-client\";\nimport { CmsProvider } from \"./admin/contexts/Cms\";\nimport { CmsMenuLoader } from \"~/admin/menus/CmsMenuLoader\";\nimport apiInformation from \"./admin/plugins/apiInformation\";\nimport { ContentEntriesModule } from \"./admin/views/contentEntries/experiment/ContentEntriesModule\";\n\nconst createHeadlessCMSProvider =\n (createApolloClient: CreateApolloClient) =>\n (Component: React.FC): React.FC => {\n return function HeadlessCMSProvider({ children }) {\n return (\n <CmsProvider createApolloClient={createApolloClient}>\n <Component>{children}</Component>\n </CmsProvider>\n );\n };\n };\n\ninterface CreateApolloClientParams {\n uri: string;\n}\ninterface CreateApolloClient {\n (params: CreateApolloClientParams): ApolloClient<any>;\n}\n\nexport interface HeadlessCMSProps {\n createApolloClient: CreateApolloClient;\n}\n\nconst HeadlessCMSExtension = ({ createApolloClient }: HeadlessCMSProps) => {\n plugins.register(apiInformation);\n\n return (\n <Fragment>\n <ContentEntriesModule />\n <Provider hoc={createHeadlessCMSProvider(createApolloClient)} />\n <Plugins>\n <CmsMenuLoader />\n </Plugins>\n </Fragment>\n );\n};\n\nexport const HeadlessCMS = memo(HeadlessCMSExtension);\n"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AAEA,IAAMA,yBAAyB,GAC3B,SADEA,yBACF,CAACC,kBAAD;EAAA,OACA,UAACC,SAAD,EAAmC;IAC/B,OAAO,SAASC,mBAAT,OAA2C;MAAA,IAAZC,QAAY,QAAZA,QAAY;MAC9C,oBACI,6BAAC,gBAAD;QAAa,kBAAkB,EAAEH;MAAjC,gBACI,6BAAC,SAAD,QAAYG,QAAZ,CADJ,CADJ;IAKH,CAND;EAOH,CATD;AAAA,CADJ;;AAuBA,IAAMC,oBAAoB,GAAG,SAAvBA,oBAAuB,QAA8C;EAAA,IAA3CJ,kBAA2C,SAA3CA,kBAA2C;;EACvEK,gBAAA,CAAQC,QAAR,CAAiBC,uBAAjB;;EAEA,oBACI,6BAAC,eAAD,qBACI,6BAAC,0CAAD,OADJ,eAEI,6BAAC,kBAAD;IAAU,GAAG,EAAER,yBAAyB,CAACC,kBAAD;EAAxC,EAFJ,eAGI,6BAAC,iBAAD,qBACI,6BAAC,4BAAD,OADJ,CAHJ,CADJ;
|
|
1
|
+
{"version":3,"names":["createHeadlessCMSProvider","createApolloClient","Component","HeadlessCMSProvider","children","HeadlessCMSExtension","plugins","register","apiInformation","HeadlessCMS","memo"],"sources":["HeadlessCMS.tsx"],"sourcesContent":["import React, { Fragment, memo } from \"react\";\nimport { plugins } from \"@webiny/plugins\";\nimport { Plugins, Provider } from \"@webiny/app-admin\";\nimport { ApolloClient } from \"apollo-client\";\nimport { CmsProvider } from \"./admin/contexts/Cms\";\nimport { CmsMenuLoader } from \"~/admin/menus/CmsMenuLoader\";\nimport apiInformation from \"./admin/plugins/apiInformation\";\nimport { ContentEntriesModule } from \"./admin/views/contentEntries/experiment/ContentEntriesModule\";\nimport { DefaultOnEntryDelete } from \"./admin/plugins/entry/DefaultOnEntryDelete\";\nimport { DefaultOnEntryPublish } from \"~/admin/plugins/entry/DefaultOnEntryPublish\";\n\nconst createHeadlessCMSProvider =\n (createApolloClient: CreateApolloClient) =>\n (Component: React.FC): React.FC => {\n return function HeadlessCMSProvider({ children }) {\n return (\n <CmsProvider createApolloClient={createApolloClient}>\n <Component>{children}</Component>\n </CmsProvider>\n );\n };\n };\n\ninterface CreateApolloClientParams {\n uri: string;\n}\ninterface CreateApolloClient {\n (params: CreateApolloClientParams): ApolloClient<any>;\n}\n\nexport interface HeadlessCMSProps {\n createApolloClient: CreateApolloClient;\n}\n\nconst HeadlessCMSExtension = ({ createApolloClient }: HeadlessCMSProps) => {\n plugins.register(apiInformation);\n\n return (\n <Fragment>\n <ContentEntriesModule />\n <Provider hoc={createHeadlessCMSProvider(createApolloClient)} />\n <Plugins>\n <CmsMenuLoader />\n <DefaultOnEntryDelete />\n <DefaultOnEntryPublish />\n </Plugins>\n </Fragment>\n );\n};\n\nexport const HeadlessCMS = memo(HeadlessCMSExtension);\n"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAEA,IAAMA,yBAAyB,GAC3B,SADEA,yBACF,CAACC,kBAAD;EAAA,OACA,UAACC,SAAD,EAAmC;IAC/B,OAAO,SAASC,mBAAT,OAA2C;MAAA,IAAZC,QAAY,QAAZA,QAAY;MAC9C,oBACI,6BAAC,gBAAD;QAAa,kBAAkB,EAAEH;MAAjC,gBACI,6BAAC,SAAD,QAAYG,QAAZ,CADJ,CADJ;IAKH,CAND;EAOH,CATD;AAAA,CADJ;;AAuBA,IAAMC,oBAAoB,GAAG,SAAvBA,oBAAuB,QAA8C;EAAA,IAA3CJ,kBAA2C,SAA3CA,kBAA2C;;EACvEK,gBAAA,CAAQC,QAAR,CAAiBC,uBAAjB;;EAEA,oBACI,6BAAC,eAAD,qBACI,6BAAC,0CAAD,OADJ,eAEI,6BAAC,kBAAD;IAAU,GAAG,EAAER,yBAAyB,CAACC,kBAAD;EAAxC,EAFJ,eAGI,6BAAC,iBAAD,qBACI,6BAAC,4BAAD,OADJ,eAEI,6BAAC,0CAAD,OAFJ,eAGI,6BAAC,4CAAD,OAHJ,CAHJ,CADJ;AAWH,CAdD;;AAgBO,IAAMQ,WAAW,gBAAG,IAAAC,WAAA,EAAKL,oBAAL,CAApB"}
|
|
@@ -76,6 +76,28 @@ function useBind(_ref) {
|
|
|
76
76
|
|
|
77
77
|
bind.form.validateInput(field.fieldId);
|
|
78
78
|
};
|
|
79
|
+
|
|
80
|
+
props.moveValueUp = function (index) {
|
|
81
|
+
if (index <= 0) {
|
|
82
|
+
return;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
var value = (0, _toConsumableArray2.default)(bind.value);
|
|
86
|
+
value.splice(index, 1);
|
|
87
|
+
value.splice(index - 1, 0, bind.value[index]);
|
|
88
|
+
bind.onChange(value);
|
|
89
|
+
};
|
|
90
|
+
|
|
91
|
+
props.moveValueDown = function (index) {
|
|
92
|
+
if (index >= bind.value.length) {
|
|
93
|
+
return;
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
var value = (0, _toConsumableArray2.default)(bind.value);
|
|
97
|
+
value.splice(index, 1);
|
|
98
|
+
value.splice(index + 1, 0, bind.value[index]);
|
|
99
|
+
bind.onChange(value);
|
|
100
|
+
};
|
|
79
101
|
}
|
|
80
102
|
|
|
81
103
|
if (typeof children === "function") {
|
|
@@ -90,4 +112,4 @@ function useBind(_ref) {
|
|
|
90
112
|
memoizedBindComponents.current[name].parentName = name;
|
|
91
113
|
return memoizedBindComponents.current[name];
|
|
92
114
|
}, [field.fieldId]);
|
|
93
|
-
}
|
|
115
|
+
} // [0,1,2,3,4,5]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useBind","ParentBind","Bind","field","memoizedBindComponents","useRef","useCallback","index","parentName","name","fieldId","undefined","filter","v","join","current","validators","createValidators","validation","listValidators","listValidation","defaultValue","multipleValues","isMultipleValues","inputValidators","UseBind","params","childName","childValidators","children","bind","props","appendValue","newValue","onChange","value","prependValue","appendValues","newValues","removeValue","slice","form","validateInput","cloneElement"],"sources":["useBind.tsx"],"sourcesContent":["import React, { useRef, useCallback, cloneElement } from \"react\";\nimport { createValidators } from \"./functions/createValidators\";\nimport { BindComponent, CmsEditorField } from \"~/types\";\nimport { Validator } from \"@webiny/validation/types\";\n\ninterface UseBindProps {\n field: CmsEditorField;\n Bind: BindComponent;\n}\n\ninterface UseBindParams {\n name?: string;\n validators?: Validator | Validator[];\n children?: any;\n}\n\nexport interface GetBindCallable {\n (index?: number): BindComponent;\n}\n\nexport function useBind({ Bind: ParentBind, field }: UseBindProps) {\n const memoizedBindComponents = useRef<Record<string, BindComponent>>({});\n\n return useCallback(\n (index = -1) => {\n const { parentName } = ParentBind;\n // If there's a parent name assigned to the given Bind component, we need to include it in the new field \"name\".\n // This allows us to have nested fields (like \"object\" field with nested properties)\n const name = [parentName, field.fieldId, index >= 0 ? index : undefined]\n .filter(v => v !== undefined)\n .join(\".\");\n\n if (memoizedBindComponents.current[name]) {\n return memoizedBindComponents.current[name];\n }\n\n const validators = createValidators(field.validation || []);\n const listValidators = createValidators(field.listValidation || []);\n const defaultValue: string[] | undefined = field.multipleValues ? [] : undefined;\n const isMultipleValues = index === -1 && field.multipleValues;\n const inputValidators = isMultipleValues ? listValidators : validators;\n\n memoizedBindComponents.current[name] = function UseBind(params: UseBindParams) {\n const { name: childName, validators: childValidators, children } = params;\n return (\n <ParentBind\n name={childName || name}\n validators={childValidators || inputValidators}\n defaultValue={index === -1 ? defaultValue : null}\n >\n {bind => {\n // Multiple-values functions below.\n const props = { ...bind };\n if (field.multipleValues && index === -1) {\n props.appendValue = (newValue: string) => {\n bind.onChange([...bind.value, newValue]);\n };\n props.prependValue = (newValue: string) => {\n bind.onChange([newValue, ...bind.value]);\n };\n props.appendValues = (newValues: string[]) => {\n bind.onChange([...bind.value, ...newValues]);\n };\n\n props.removeValue = (index: number) => {\n if (index < 0) {\n return;\n }\n let value = bind.value;\n value = [...value.slice(0, index), ...value.slice(index + 1)];\n\n bind.onChange(value);\n\n // To make sure the field is still valid, we must trigger validation.\n bind.form.validateInput(field.fieldId);\n };\n }\n\n if (typeof children === \"function\") {\n return children(props);\n }\n\n return cloneElement(children, props);\n }}\n </ParentBind>\n );\n };\n\n // We need to keep track of current field name, to support nested fields.\n memoizedBindComponents.current[name].parentName = name;\n\n return memoizedBindComponents.current[name];\n },\n [field.fieldId]\n );\n}\n"],"mappings":"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
|
|
1
|
+
{"version":3,"names":["useBind","ParentBind","Bind","field","memoizedBindComponents","useRef","useCallback","index","parentName","name","fieldId","undefined","filter","v","join","current","validators","createValidators","validation","listValidators","listValidation","defaultValue","multipleValues","isMultipleValues","inputValidators","UseBind","params","childName","childValidators","children","bind","props","appendValue","newValue","onChange","value","prependValue","appendValues","newValues","removeValue","slice","form","validateInput","moveValueUp","splice","moveValueDown","length","cloneElement"],"sources":["useBind.tsx"],"sourcesContent":["import React, { useRef, useCallback, cloneElement } from \"react\";\nimport { createValidators } from \"./functions/createValidators\";\nimport { BindComponent, CmsEditorField } from \"~/types\";\nimport { Validator } from \"@webiny/validation/types\";\n\ninterface UseBindProps {\n field: CmsEditorField;\n Bind: BindComponent;\n}\n\ninterface UseBindParams {\n name?: string;\n validators?: Validator | Validator[];\n children?: any;\n}\n\nexport interface GetBindCallable {\n (index?: number): BindComponent;\n}\n\nexport function useBind({ Bind: ParentBind, field }: UseBindProps) {\n const memoizedBindComponents = useRef<Record<string, BindComponent>>({});\n\n return useCallback(\n (index = -1) => {\n const { parentName } = ParentBind;\n // If there's a parent name assigned to the given Bind component, we need to include it in the new field \"name\".\n // This allows us to have nested fields (like \"object\" field with nested properties)\n const name = [parentName, field.fieldId, index >= 0 ? index : undefined]\n .filter(v => v !== undefined)\n .join(\".\");\n\n if (memoizedBindComponents.current[name]) {\n return memoizedBindComponents.current[name];\n }\n\n const validators = createValidators(field.validation || []);\n const listValidators = createValidators(field.listValidation || []);\n const defaultValue: string[] | undefined = field.multipleValues ? [] : undefined;\n const isMultipleValues = index === -1 && field.multipleValues;\n const inputValidators = isMultipleValues ? listValidators : validators;\n\n memoizedBindComponents.current[name] = function UseBind(params: UseBindParams) {\n const { name: childName, validators: childValidators, children } = params;\n return (\n <ParentBind\n name={childName || name}\n validators={childValidators || inputValidators}\n defaultValue={index === -1 ? defaultValue : null}\n >\n {bind => {\n // Multiple-values functions below.\n const props = { ...bind };\n if (field.multipleValues && index === -1) {\n props.appendValue = (newValue: string) => {\n bind.onChange([...bind.value, newValue]);\n };\n props.prependValue = (newValue: string) => {\n bind.onChange([newValue, ...bind.value]);\n };\n props.appendValues = (newValues: string[]) => {\n bind.onChange([...bind.value, ...newValues]);\n };\n\n props.removeValue = (index: number) => {\n if (index < 0) {\n return;\n }\n let value = bind.value;\n value = [...value.slice(0, index), ...value.slice(index + 1)];\n\n bind.onChange(value);\n\n // To make sure the field is still valid, we must trigger validation.\n bind.form.validateInput(field.fieldId);\n };\n\n props.moveValueUp = (index: number) => {\n if (index <= 0) {\n return;\n }\n\n const value = [...bind.value];\n value.splice(index, 1);\n value.splice(index - 1, 0, bind.value[index]);\n\n bind.onChange(value);\n };\n\n props.moveValueDown = (index: number) => {\n if (index >= bind.value.length) {\n return;\n }\n\n const value = [...bind.value];\n value.splice(index, 1);\n value.splice(index + 1, 0, bind.value[index]);\n\n bind.onChange(value);\n };\n }\n\n if (typeof children === \"function\") {\n return children(props);\n }\n\n return cloneElement(children, props);\n }}\n </ParentBind>\n );\n };\n\n // We need to keep track of current field name, to support nested fields.\n memoizedBindComponents.current[name].parentName = name;\n\n return memoizedBindComponents.current[name];\n },\n [field.fieldId]\n );\n}\n\n// [0,1,2,3,4,5]\n"],"mappings":"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"}
|
|
@@ -105,7 +105,7 @@ var Editor = function Editor() {
|
|
|
105
105
|
setData = _useContentModelEdito.setData,
|
|
106
106
|
isPristine = _useContentModelEdito.isPristine;
|
|
107
107
|
|
|
108
|
-
var tabsRef = (0, _react.useRef)(
|
|
108
|
+
var tabsRef = (0, _react.useRef)();
|
|
109
109
|
|
|
110
110
|
var _useState = (0, _react.useState)(0),
|
|
111
111
|
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["t","i18n","ns","prompt","ContentContainer","styled","paddingTop","EditContainer","padding","position","LeftBarTitle","borderBottom","display","alignItems","color","titleIcon","css","height","marginRight","LeftBarFieldList","overflow","formTabs","backgroundColor","Editor","useContentModelEditor","data","setData","isPristine","tabsRef","useRef","useState","activeTabIndex","setActiveTabIndex","onChange","fields","layout","current","switchTab","e"],"sources":["Editor.tsx"],"sourcesContent":["import React, { useRef, useState } from \"react\";\nimport { Prompt } from \"@webiny/react-router\";\nimport styled from \"@emotion/styled\";\nimport { css } from \"emotion\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { CircularProgress } from \"@webiny/ui/Progress\";\nimport { LeftPanel, RightPanel, SplitView } from \"@webiny/app-admin/components/SplitView\";\nimport { Icon } from \"@webiny/ui/Icon\";\nimport { Typography } from \"@webiny/ui/Typography\";\nimport { Tab, Tabs } from \"@webiny/ui/Tabs\";\nimport { ReactComponent as FormIcon } from \"./icons/round-assignment-24px.svg\";\nimport { FieldsSidebar } from \"./FieldsSidebar\";\nimport { FieldEditor } from \"../FieldEditor\";\nimport { PreviewTab } from \"./PreviewTab\";\nimport Header from \"./Header\";\nimport DragPreview from \"../DragPreview\";\nimport { useContentModelEditor } from \"./useContentModelEditor\";\nimport { CmsEditorField, CmsEditorFieldsLayout } from \"~/types\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/editor\");\n\nconst prompt = t`There are some unsaved changes! Are you sure you want to navigate away and discard all changes?`;\n\nconst ContentContainer = styled(\"div\")({\n paddingTop: 65\n});\n\nexport const EditContainer = styled(\"div\")({\n padding: 40,\n position: \"relative\"\n});\n\nconst LeftBarTitle = styled(\"div\")({\n borderBottom: \"1px solid var(--mdc-theme-on-background)\",\n display: \"flex\",\n alignItems: \"center\",\n padding: 25,\n color: \"var(--mdc-theme-on-surface)\"\n});\n\nconst titleIcon = css({\n height: 24,\n marginRight: 15,\n color: \"var(--mdc-theme-primary)\"\n});\n\nconst LeftBarFieldList = styled(\"div\")({\n padding: 40,\n overflow: \"auto\",\n height: \"calc(100vh - 250px)\"\n});\n\nconst formTabs = css({\n \"&.webiny-ui-tabs\": {\n \".webiny-ui-tabs__tab-bar\": {\n backgroundColor: \"var(--mdc-theme-surface)\"\n }\n }\n});\n\ninterface OnChangeParams {\n fields: CmsEditorField[];\n layout: CmsEditorFieldsLayout;\n}\n\nexport const Editor: React.FC = () => {\n const { data, setData, isPristine } = useContentModelEditor();\n\n const tabsRef = useRef<
|
|
1
|
+
{"version":3,"names":["t","i18n","ns","prompt","ContentContainer","styled","paddingTop","EditContainer","padding","position","LeftBarTitle","borderBottom","display","alignItems","color","titleIcon","css","height","marginRight","LeftBarFieldList","overflow","formTabs","backgroundColor","Editor","useContentModelEditor","data","setData","isPristine","tabsRef","useRef","useState","activeTabIndex","setActiveTabIndex","onChange","fields","layout","current","switchTab","e"],"sources":["Editor.tsx"],"sourcesContent":["import React, { useRef, useState } from \"react\";\nimport { Prompt } from \"@webiny/react-router\";\nimport styled from \"@emotion/styled\";\nimport { css } from \"emotion\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { CircularProgress } from \"@webiny/ui/Progress\";\nimport { LeftPanel, RightPanel, SplitView } from \"@webiny/app-admin/components/SplitView\";\nimport { Icon } from \"@webiny/ui/Icon\";\nimport { Typography } from \"@webiny/ui/Typography\";\nimport { Tab, Tabs, TabsImperativeApi } from \"@webiny/ui/Tabs\";\nimport { ReactComponent as FormIcon } from \"./icons/round-assignment-24px.svg\";\nimport { FieldsSidebar } from \"./FieldsSidebar\";\nimport { FieldEditor } from \"../FieldEditor\";\nimport { PreviewTab } from \"./PreviewTab\";\nimport Header from \"./Header\";\nimport DragPreview from \"../DragPreview\";\nimport { useContentModelEditor } from \"./useContentModelEditor\";\nimport { CmsEditorField, CmsEditorFieldsLayout } from \"~/types\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/editor\");\n\nconst prompt = t`There are some unsaved changes! Are you sure you want to navigate away and discard all changes?`;\n\nconst ContentContainer = styled(\"div\")({\n paddingTop: 65\n});\n\nexport const EditContainer = styled(\"div\")({\n padding: 40,\n position: \"relative\"\n});\n\nconst LeftBarTitle = styled(\"div\")({\n borderBottom: \"1px solid var(--mdc-theme-on-background)\",\n display: \"flex\",\n alignItems: \"center\",\n padding: 25,\n color: \"var(--mdc-theme-on-surface)\"\n});\n\nconst titleIcon = css({\n height: 24,\n marginRight: 15,\n color: \"var(--mdc-theme-primary)\"\n});\n\nconst LeftBarFieldList = styled(\"div\")({\n padding: 40,\n overflow: \"auto\",\n height: \"calc(100vh - 250px)\"\n});\n\nconst formTabs = css({\n \"&.webiny-ui-tabs\": {\n \".webiny-ui-tabs__tab-bar\": {\n backgroundColor: \"var(--mdc-theme-surface)\"\n }\n }\n});\n\ninterface OnChangeParams {\n fields: CmsEditorField[];\n layout: CmsEditorFieldsLayout;\n}\n\nexport const Editor: React.FC = () => {\n const { data, setData, isPristine } = useContentModelEditor();\n\n const tabsRef = useRef<TabsImperativeApi>();\n const [activeTabIndex, setActiveTabIndex] = useState<number>(0);\n\n const onChange = ({ fields, layout }: OnChangeParams) => {\n setData(data => ({ ...data, fields, layout }));\n };\n\n if (!data) {\n return <CircularProgress label={\"Loading content model...\"} />;\n }\n\n return (\n <div className={\"content-model-editor\"}>\n <Prompt when={!isPristine} message={prompt} />\n <Header />\n <ContentContainer>\n <SplitView>\n <LeftPanel span={4}>\n <LeftBarTitle>\n <Icon className={titleIcon} icon={<FormIcon />} />\n <Typography use={\"headline6\"}>Fields</Typography>\n </LeftBarTitle>\n <LeftBarFieldList>\n <FieldsSidebar\n onFieldDragStart={() => {\n if (!tabsRef.current) {\n return;\n }\n tabsRef.current.switchTab(0);\n }}\n />\n </LeftBarFieldList>\n </LeftPanel>\n <RightPanel span={8}>\n <Tabs\n className={formTabs}\n ref={tabsRef}\n onActivate={e => setActiveTabIndex(e)}\n >\n <Tab label={\"Edit\"} data-testid={\"cms.editor.tab.edit\"}>\n <EditContainer>\n <FieldEditor\n fields={data.fields}\n layout={data.layout || []}\n onChange={onChange}\n />\n </EditContainer>\n </Tab>\n <Tab label={\"Preview\"} data-testid={\"cms.editor.tab.preview\"}>\n <PreviewTab activeTab={activeTabIndex === 1} />\n </Tab>\n </Tabs>\n </RightPanel>\n </SplitView>\n </ContentContainer>\n <DragPreview />\n </div>\n );\n};\n"],"mappings":"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"}
|
|
@@ -67,7 +67,7 @@ var AppearanceTab = function AppearanceTab(props) {
|
|
|
67
67
|
return;
|
|
68
68
|
}
|
|
69
69
|
|
|
70
|
-
console.
|
|
70
|
+
console.info("No renderers for field ".concat(field.fieldId, " found."), field);
|
|
71
71
|
});
|
|
72
72
|
|
|
73
73
|
if (renderPlugins.length === 0) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["t","i18n","ns","style","topLabel","css","marginBottom","noComponentsMessage","textAlign","padding","radioContainer","AppearanceTab","props","field","form","renderPlugins","plugins","byType","filter","item","renderer","canUse","useEffect","currentlySelectedRenderAvailable","find","rendererName","name","setValue","console","
|
|
1
|
+
{"version":3,"names":["t","i18n","ns","style","topLabel","css","marginBottom","noComponentsMessage","textAlign","padding","radioContainer","AppearanceTab","props","field","form","renderPlugins","plugins","byType","filter","item","renderer","canUse","useEffect","currentlySelectedRenderAvailable","find","rendererName","name","setValue","console","info","fieldId","length","Bind","validation","create","onChange","getValue","map","description"],"sources":["AppearanceTab.tsx"],"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.info(`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"],"mappings":"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"}
|
|
@@ -111,7 +111,8 @@ var GeneralTab = function GeneralTab(_ref) {
|
|
|
111
111
|
}
|
|
112
112
|
}, /*#__PURE__*/_react.default.createElement(_Input.Input, {
|
|
113
113
|
label: "Label",
|
|
114
|
-
inputRef: inputRef
|
|
114
|
+
inputRef: inputRef,
|
|
115
|
+
"data-testid": "cms.editor.field.settings.general.label"
|
|
115
116
|
}))), /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
|
|
116
117
|
span: 6
|
|
117
118
|
}, /*#__PURE__*/_react.default.createElement(Bind, {
|
|
@@ -120,28 +121,32 @@ var GeneralTab = function GeneralTab(_ref) {
|
|
|
120
121
|
beforeChange: beforeChangeFieldId
|
|
121
122
|
}, /*#__PURE__*/_react.default.createElement(_Input.Input, {
|
|
122
123
|
label: "Field ID",
|
|
123
|
-
disabled: !!field.id
|
|
124
|
+
disabled: !!field.id,
|
|
125
|
+
"data-testid": "cms.editor.field.settings.general.label-".concat(field.id)
|
|
124
126
|
}))), /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
|
|
125
127
|
span: 6
|
|
126
128
|
}, /*#__PURE__*/_react.default.createElement(Bind, {
|
|
127
129
|
name: "multipleValues"
|
|
128
130
|
}, /*#__PURE__*/_react.default.createElement(_Switch.Switch, {
|
|
129
131
|
label: fieldPlugin.field.multipleValuesLabel,
|
|
130
|
-
disabled: !fieldPlugin.field.allowMultipleValues
|
|
132
|
+
disabled: !fieldPlugin.field.allowMultipleValues,
|
|
133
|
+
"data-testid": "cms.editor.field.settings.general.switch-multiplevalues"
|
|
131
134
|
}))), /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
|
|
132
135
|
span: 6
|
|
133
136
|
}, /*#__PURE__*/_react.default.createElement(Bind, {
|
|
134
137
|
name: "predefinedValues.enabled"
|
|
135
138
|
}, /*#__PURE__*/_react.default.createElement(_Switch.Switch, {
|
|
136
139
|
label: "Use predefined values",
|
|
137
|
-
disabled: !predefinedValuesEnabled
|
|
140
|
+
disabled: !predefinedValuesEnabled,
|
|
141
|
+
"data-testid": "cms.editor.field.settings.general.switch-predefinedvalues"
|
|
138
142
|
}))), /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
|
|
139
143
|
span: 12
|
|
140
144
|
}, /*#__PURE__*/_react.default.createElement(Bind, {
|
|
141
145
|
name: "helpText"
|
|
142
146
|
}, /*#__PURE__*/_react.default.createElement(_Input.Input, {
|
|
143
147
|
label: "Help text",
|
|
144
|
-
description: "Help text (optional)"
|
|
148
|
+
description: "Help text (optional)",
|
|
149
|
+
"data-testid": "cms.editor.field.settings.general.helptext"
|
|
145
150
|
})))), additionalSettings);
|
|
146
151
|
};
|
|
147
152
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["GeneralTab","field","form","fieldPlugin","Bind","setValue","inputRef","useRef","useContentModelEditor","data","useFieldEditor","getField","useEffect","setTimeout","current","focus","afterChangeLabel","useCallback","value","beforeChangeFieldId","baseOnChange","newValue","trim","fieldIdValidator","fieldId","toLowerCase","Error","uniqueFieldIdValidator","existingField","id","additionalSettings","renderSettings","contentModel","predefinedValuesEnabled","useMemo","allowPredefinedValues","renderPredefinedValues","validation","create","multipleValuesLabel","allowMultipleValues"],"sources":["GeneralTab.tsx"],"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"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["GeneralTab","field","form","fieldPlugin","Bind","setValue","inputRef","useRef","useContentModelEditor","data","useFieldEditor","getField","useEffect","setTimeout","current","focus","afterChangeLabel","useCallback","value","beforeChangeFieldId","baseOnChange","newValue","trim","fieldIdValidator","fieldId","toLowerCase","Error","uniqueFieldIdValidator","existingField","id","additionalSettings","renderSettings","contentModel","predefinedValuesEnabled","useMemo","allowPredefinedValues","renderPredefinedValues","validation","create","multipleValuesLabel","allowMultipleValues"],"sources":["GeneralTab.tsx"],"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\n label={\"Label\"}\n inputRef={inputRef}\n data-testid=\"cms.editor.field.settings.general.label\"\n />\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\n label={\"Field ID\"}\n disabled={!!field.id}\n data-testid={`cms.editor.field.settings.general.label-${field.id}`}\n />\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 data-testid={`cms.editor.field.settings.general.switch-multiplevalues`}\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 data-testid={`cms.editor.field.settings.general.switch-predefinedvalues`}\n />\n </Bind>\n </Cell>\n\n <Cell span={12}>\n <Bind name={\"helpText\"}>\n <Input\n label={\"Help text\"}\n description={\"Help text (optional)\"}\n data-testid={`cms.editor.field.settings.general.helptext`}\n />\n </Bind>\n </Cell>\n </Grid>\n {additionalSettings}\n </>\n );\n};\n\nexport default GeneralTab;\n"],"mappings":"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"}
|
|
@@ -122,6 +122,7 @@ var ValidatorsTab = function ValidatorsTab(props) {
|
|
|
122
122
|
}, function (bind) {
|
|
123
123
|
return /*#__PURE__*/_react.default.createElement(_Input.Input, Object.assign({}, bind, {
|
|
124
124
|
label: "Message",
|
|
125
|
+
"data-testid": "cms.editfield.validators.required",
|
|
125
126
|
description: "This message will be displayed to the user"
|
|
126
127
|
}));
|
|
127
128
|
}))), typeof validator.renderSettings === "function" && validator.renderSettings({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["onEnabledChange","params","data","validationValue","onChangeValidation","validator","index","findIndex","item","name","slice","settings","defaultSettings","message","defaultMessage","onFormChange","validatorIndex","newValidationValue","noMargin","css","margin","ValidatorsTab","props","field","validators","Bind","form","bind","value","onChange","map","optional","label","setValue","validation","create","renderSettings","setMessage"],"sources":["ValidatorsTab.tsx"],"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"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["onEnabledChange","params","data","validationValue","onChangeValidation","validator","index","findIndex","item","name","slice","settings","defaultSettings","message","defaultMessage","onFormChange","validatorIndex","newValidationValue","noMargin","css","margin","ValidatorsTab","props","field","validators","Bind","form","bind","value","onChange","map","optional","label","setValue","validation","create","renderSettings","setMessage"],"sources":["ValidatorsTab.tsx"],"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 data-testid=\"cms.editfield.validators.required\"\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"],"mappings":"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"}
|
|
@@ -196,6 +196,8 @@ var EditFieldDialog = function EditFieldDialog(_ref2) {
|
|
|
196
196
|
return _onSubmit(data);
|
|
197
197
|
}
|
|
198
198
|
}, function (form) {
|
|
199
|
+
var hasValidators = Array.isArray(fieldPlugin.field.validators) && fieldPlugin.field.validators.length > 0;
|
|
200
|
+
var showValidatorsTab = form.data.multipleValues || Array.isArray(fieldPlugin.field.validators) && fieldPlugin.field.validators.length > 0;
|
|
199
201
|
var predefinedValuesTabEnabled = fieldPlugin.field.allowPredefinedValues && form.data.predefinedValues && form.data.predefinedValues.enabled;
|
|
200
202
|
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Dialog.DialogContent, {
|
|
201
203
|
className: dialogBody
|
|
@@ -212,10 +214,10 @@ var EditFieldDialog = function EditFieldDialog(_ref2) {
|
|
|
212
214
|
form: form,
|
|
213
215
|
field: form.data,
|
|
214
216
|
fieldPlugin: fieldPlugin
|
|
215
|
-
})),
|
|
217
|
+
})), showValidatorsTab ? /*#__PURE__*/_react.default.createElement(_Tabs.Tab, {
|
|
216
218
|
label: "Validators",
|
|
217
219
|
"data-testid": "cms.editor.field.tabs.validators"
|
|
218
|
-
}, /*#__PURE__*/_react.default.createElement(_Grid.Grid, null, /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
|
|
220
|
+
}, form.data.multipleValues ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Grid.Grid, null, /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
|
|
219
221
|
span: 12
|
|
220
222
|
}, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
|
|
221
223
|
use: "headline5"
|
|
@@ -245,15 +247,12 @@ var EditFieldDialog = function EditFieldDialog(_ref2) {
|
|
|
245
247
|
form: form,
|
|
246
248
|
name: "validation",
|
|
247
249
|
validators: getFieldValidators(fieldPlugin)
|
|
248
|
-
}))))), !form.data.multipleValues &&
|
|
249
|
-
label: "Validators",
|
|
250
|
-
"data-testid": "cms.editor.field.tabs.validators"
|
|
251
|
-
}, /*#__PURE__*/_react.default.createElement(_ValidatorsTab.default, {
|
|
250
|
+
}))))) : null, !form.data.multipleValues && hasValidators ? /*#__PURE__*/_react.default.createElement(_ValidatorsTab.default, {
|
|
252
251
|
field: current,
|
|
253
252
|
form: form,
|
|
254
253
|
name: "validation",
|
|
255
254
|
validators: getFieldValidators(fieldPlugin)
|
|
256
|
-
})), /*#__PURE__*/_react.default.createElement(_Tabs.Tab, {
|
|
255
|
+
}) : null) : null, /*#__PURE__*/_react.default.createElement(_Tabs.Tab, {
|
|
257
256
|
label: t(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["Appearance"])))
|
|
258
257
|
}, /*#__PURE__*/_react.default.createElement(_AppearanceTab.default, {
|
|
259
258
|
form: form,
|
|
@@ -262,8 +261,10 @@ var EditFieldDialog = function EditFieldDialog(_ref2) {
|
|
|
262
261
|
,
|
|
263
262
|
fieldPlugin: fieldPlugin
|
|
264
263
|
})))), /*#__PURE__*/_react.default.createElement(_Dialog.DialogActions, null, /*#__PURE__*/_react.default.createElement(_Button.ButtonDefault, {
|
|
264
|
+
"data-testid": "cms.editor.field.settings.cancel",
|
|
265
265
|
onClick: onClose
|
|
266
266
|
}, t(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["Cancel"])))), /*#__PURE__*/_react.default.createElement(_Button.ButtonPrimary, {
|
|
267
|
+
"data-testid": "cms.editor.field.settings.save",
|
|
267
268
|
onClick: function onClick(ev) {
|
|
268
269
|
form.submit(ev);
|
|
269
270
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["t","i18n","namespace","dialogBody","css","width","height","getValidators","fieldPlugin","key","defaultValidators","mappedValidators","plugins","byType","map","validator","allowedValidators","field","includes","name","optional","filteredValidators","filter","Boolean","sort","a","b","getListValidators","getFieldValidators","fieldEditorDialog","maxWidth","maxHeight","paddingTop","EditFieldDialog","onSubmit","props","useState","current","setCurrent","useFieldEditor","getFieldPlugin","useEffect","clonedField","renderer","item","canUse","renderPlugin","rendererName","onClose","useCallback","render","headerTitle","type","invariant","fieldTypeLabel","label","data","form","predefinedValuesTabEnabled","allowPredefinedValues","predefinedValues","enabled","multipleValues","Array","isArray","validators","length","ev","submit"],"sources":["EditFieldDialog.tsx"],"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"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AAOA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEA,IAAMA,CAAC,GAAGC,UAAA,CAAKC,SAAL,CAAe,0CAAf,CAAV;;AAEA,IAAMC,UAAU,gBAAG,IAAAC,YAAA,EAAI;EACnB,+BAA+B;IAC3BC,KAAK,EAAE,GADoB;IAE3BC,MAAM,EAAE;EAFmB;AADZ,CAAJ,sBAAnB;;AAiBA,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAClBC,WADkB,EAKlBC,GALkB,EAOJ;EAAA,IADdC,iBACc,uEADgB,EAChB;;EACd,IAAMC,gBAAgB,GAAGC,gBAAA,CACpBC,MADoB,CACkB,4BADlB,EAEpBC,GAFoB,CAEhB,gBAAmB;IAAA,IAAhBC,SAAgB,QAAhBA,SAAgB;IACpB,IAAMC,iBAAiB,GAAGR,WAAW,CAACS,KAAZ,CAAkBR,GAAlB,KAA0BC,iBAApD;;IACA,IAAIM,iBAAiB,CAACE,QAAlB,CAA2BH,SAAS,CAACI,IAArC,CAAJ,EAAgD;MAC5C,OAAO;QACHC,QAAQ,EAAE,IADP;QAEHL,SAAS,EAATA;MAFG,CAAP;IAIH,CALD,MAKO,IAAIC,iBAAiB,CAACE,QAAlB,YAA+BH,SAAS,CAACI,IAAzC,EAAJ,EAAsD;MACzD,OAAO;QACHC,QAAQ,EAAE,KADP;QAEHL,SAAS,EAATA;MAFG,CAAP;IAIH;;IAED,OAAO,IAAP;EACH,CAjBoB,CAAzB;;EAmBA,IAAMM,kBAAkB,GAAGV,gBAAgB,CAACW,MAAjB,CAAwBC,OAAxB,CAA3B;EAEA,OACIF;EACI;AACZ;AACA;EAH0B,CAIbG,IAJL,CAIU,UAACC,CAAD,EAAeC,CAAf,EAAgC;IAClC,IAAI,CAACD,CAAC,CAACL,QAAH,IAAeM,CAAC,CAACN,QAArB,EAA+B;MAC3B,OAAO,CAAC,CAAR;IACH;;IAED,IAAIK,CAAC,CAACL,QAAF,IAAc,CAACM,CAAC,CAACN,QAArB,EAA+B;MAC3B,OAAO,CAAP;IACH;;IAED,OAAO,CAAP;EACH,CAdL,CADJ;AAiBH,CA9CD;;AAgDA,IAAMO,iBAAiB,GAAG,SAApBA,iBAAoB,CAACnB,WAAD,EAA2C;EACjE,OAAOD,aAAa,CAACC,WAAD,EAAc,gBAAd,EAAgC,CAAC,WAAD,EAAc,WAAd,CAAhC,CAApB;AACH,CAFD;;AAIA,IAAMoB,kBAAkB,GAAG,SAArBA,kBAAqB,CAACpB,WAAD,EAA2C;EAClE,OAAOD,aAAa,CAACC,WAAD,EAAc,YAAd,CAApB;AACH,CAFD;;AAIA,IAAMqB,iBAAiB,gBAAG,IAAAzB,YAAA,EAAI;EAC1BC,KAAK,EAAE,OADmB;EAE1BC,MAAM,EAAE,OAFkB;EAG1B,wBAAwB;IACpBwB,QAAQ,EAAE,iBADU;IAEpBC,SAAS,EAAE,iBAFS;IAGpB,8BAA8B;MAC1BD,QAAQ,EAAE,iBADgB;MAE1BC,SAAS,EAAE,iBAFe;MAG1B1B,KAAK,EAAE,OAHmB;MAI1BC,MAAM,EAAE,qBAJkB;MAK1B0B,UAAU,EAAE;IALc;EAHV;AAHE,CAAJ,6BAA1B;;AAgBA,IAAMC,eAA+C,GAAG,SAAlDA,eAAkD,QAAmC;EAAA,IAAhChB,KAAgC,SAAhCA,KAAgC;EAAA,IAAzBiB,SAAyB,SAAzBA,QAAyB;EAAA,IAAZC,KAAY;;EACvF,gBAA8B,IAAAC,eAAA,EAAgC,IAAhC,CAA9B;EAAA;EAAA,IAAOC,OAAP;EAAA,IAAgBC,UAAhB;;EAEA,sBAA2B,IAAAC,+BAAA,GAA3B;EAAA,IAAQC,cAAR,mBAAQA,cAAR;;EAEA,IAAAC,gBAAA,EAAU,YAAY;IAClB,IAAI,CAACxB,KAAL,EAAY;MACRqB,UAAU,CAACrB,KAAD,CAAV;MACA;IACH;;IAED,IAAMyB,WAAW,GAAG,yBAAUzB,KAAV,CAApB;;IAEA,IAAI,CAACyB,WAAW,CAACC,QAAb,IAAyB,CAACD,WAAW,CAACC,QAAZ,CAAqBxB,IAAnD,EAAyD;MACrD,4BAAuBP,gBAAA,CAClBC,MADkB,CACmB,2BADnB,EAElBS,MAFkB,CAEX,UAAAsB,IAAI;QAAA,OAAIA,IAAI,CAACD,QAAL,CAAcE,MAAd,CAAqB;UAAE5B,KAAK,EAALA;QAAF,CAArB,CAAJ;MAAA,CAFO,CAAvB;MAAA;MAAA,IAAO6B,YAAP;;MAIA,IAAIA,YAAJ,EAAkB;QACdJ,WAAW,CAACC,QAAZ,GAAuB;UAAExB,IAAI,EAAE2B,YAAY,CAACH,QAAb,CAAsBI;QAA9B,CAAvB;MACH;IACJ;;IAEDT,UAAU,CAACI,WAAD,CAAV;EACH,CAnBD,EAmBG,CAACzB,KAAD,CAnBH;EAqBA,IAAM+B,OAAO,GAAG,IAAAC,kBAAA,EAAY,YAAY;IACpCX,UAAU,CAAC,IAAD,CAAV;IACAH,KAAK,CAACa,OAAN;EACH,CAHe,EAGb,EAHa,CAAhB;EAKA,IAAIE,MAAM,GAAG,IAAb;EACA,IAAIC,WAAW,GAAGnD,CAAH,iGAAf;;EAEA,IAAIqC,OAAJ,EAAa;IACT;AACR;AACA;IACQ,IAAM7B,WAAW,GAAGgC,cAAc,CAACH,OAAO,CAACe,IAAT,CAAlC;IACA;AACR;AACA;;IACQ,IAAAC,kBAAA,EAAU7C,WAAV,4CAAyD6B,OAAO,CAACe,IAAjE;IAEAD,WAAW,GAAGnD,CAAC,sHAAD,CAAqC;MAC/CsD,cAAc,EAAE9C,WAAW,CAACS,KAAZ,CAAkBsC;IADa,CAArC,CAAd;IAIAL,MAAM,gBACF,6BAAC,UAAD;MACI,IAAI,EAAEb,OADV;MAEI,QAAQ,EAAE,kBAAAmB,IAAI,EAAI;QACd;AACpB;AACA;QACoB,OAAOtB,SAAQ,CAACsB,IAAD,CAAf;MACH;IAPL,GASK,UAAAC,IAAI,EAAI;MACL,IAAMC,0BAA0B,GAC5BlD,WAAW,CAACS,KAAZ,CAAkB0C,qBAAlB,IACAF,IAAI,CAACD,IAAL,CAAUI,gBADV,IAEAH,IAAI,CAACD,IAAL,CAAUI,gBAAV,CAA2BC,OAH/B;MAKA,oBACI,yEACI,6BAAC,qBAAD;QAAe,SAAS,EAAE1D;MAA1B,gBACI,6BAAC,UAAD,qBACI,6BAAC,SAAD;QAAK,KAAK,EAAEH,CAAF;MAAV,gBACI,6BAAC,mBAAD;QACI,IAAI,EAAEyD,IADV;QAEI,KAAK,EAAEA,IAAI,CAACD,IAFhB;QAGI,WAAW,EAAEhD;MAHjB,EADJ,CADJ,eAQI,6BAAC,SAAD;QACI,KAAK,EAAER,CAAF,sGADT;QAEI,QAAQ,EAAE,CAAC0D;MAFf,GAIKA,0BAA0B,iBACvB,6BAAC,yBAAD;QACI,IAAI,EAAED,IADV;QAEI,KAAK,EAAEA,IAAI,CAACD,IAFhB;QAGI,WAAW,EAAEhD;MAHjB,EALR,CARJ,EAqBKiD,IAAI,CAACD,IAAL,CAAUM,cAAV,iBACG,6BAAC,SAAD;QACI,KAAK,EAAE,YADX;QAEI,eAAa;MAFjB,gBAII,6BAAC,UAAD,qBACI,6BAAC,UAAD;QAAM,IAAI,EAAE;MAAZ,gBACI,6BAAC,sBAAD;QAAY,GAAG,EAAE;MAAjB,qBADJ,eAII,wCAJJ,eAKI,6BAAC,sBAAD;QAAY,GAAG,EAAE;MAAjB,gEALJ,CADJ,eAWI,6BAAC,UAAD;QAAM,IAAI,EAAE;MAAZ,gBACI,6BAAC,oBAAD;QAAW,CAAC,EAAE;MAAd,gBACI,6BAAC,sBAAD;QACI,KAAK,EAAEzB,OADX;QAEI,IAAI,EAAE,gBAFV;QAGI,UAAU,EAAEV,iBAAiB,CACzBnB,WADyB,CAHjC;QAMI,IAAI,EAAEiD;MANV,EADJ,CADJ,CAXJ,CAJJ,eA6BI,6BAAC,UAAD,qBACI,6BAAC,UAAD;QAAM,IAAI,EAAE;MAAZ,gBACI,6BAAC,sBAAD;QAAY,GAAG,EAAE;MAAjB,iCADJ,eAII,wCAJJ,eAKI,6BAAC,sBAAD;QAAY,GAAG,EAAE;MAAjB,6DALJ,CADJ,eAWI,6BAAC,UAAD;QAAM,IAAI,EAAE;MAAZ,gBACI,6BAAC,oBAAD;QAAW,CAAC,EAAE;MAAd,gBACI,6BAAC,sBAAD;QACI,KAAK,EAAEpB,OADX;QAEI,IAAI,EAAEoB,IAFV;QAGI,IAAI,EAAE,YAHV;QAII,UAAU,EAAE7B,kBAAkB,CAC1BpB,WAD0B;MAJlC,EADJ,CADJ,CAXJ,CA7BJ,CAtBR,EA8EK,CAACiD,IAAI,CAACD,IAAL,CAAUM,cAAX,IACGC,KAAK,CAACC,OAAN,CAAcxD,WAAW,CAACS,KAAZ,CAAkBgD,UAAhC,CADH,IAEGzD,WAAW,CAACS,KAAZ,CAAkBgD,UAAlB,CAA6BC,MAA7B,GAAsC,CAFzC,iBAGO,6BAAC,SAAD;QACI,KAAK,EAAE,YADX;QAEI,eAAa;MAFjB,gBAII,6BAAC,sBAAD;QACI,KAAK,EAAE7B,OADX;QAEI,IAAI,EAAEoB,IAFV;QAGI,IAAI,EAAE,YAHV;QAII,UAAU,EAAE7B,kBAAkB,CAACpB,WAAD;MAJlC,EAJJ,CAjFZ,eA6FI,6BAAC,SAAD;QAAK,KAAK,EAAER,CAAF;MAAV,gBACI,6BAAC,sBAAD;QACI,IAAI,EAAEyD,IADV;QAEI,KAAK,EAAEA,IAAI,CAACD,IAFhB,CAGI;QACA;QAJJ;QAKI,WAAW,EAAEhD;MALjB,EADJ,CA7FJ,CADJ,CADJ,eA0GI,6BAAC,qBAAD,qBACI,6BAAC,qBAAD;QAAe,OAAO,EAAEwC;MAAxB,GAAkChD,CAAlC,4FADJ,eAEI,6BAAC,qBAAD;QACI,OAAO,EAAE,iBAAAmE,EAAE,EAAI;UACXV,IAAI,CAACW,MAAL,CAAYD,EAAZ;QACH;MAHL,GAIEnE,CAJF,gGAFJ,CA1GJ,CADJ;IAqHH,CApIL,CADJ;EAwIH;;EAED,oBACI,6BAAC,cAAD;IACI,qBAAqB,MADzB;IAEI,IAAI,EAAE,CAAC,CAACqC,OAFZ;IAGI,OAAO,EAAEW,OAHb;IAII,eAAa,+BAJjB;IAKI,SAAS,EAAEnB;EALf,gBAOI,6BAAC,mBAAD,QAAcsB,WAAd,CAPJ,EAQKD,MARL,CADJ;AAYH,CAtMD;;eAwMejB,e"}
|
|
1
|
+
{"version":3,"names":["t","i18n","namespace","dialogBody","css","width","height","getValidators","fieldPlugin","key","defaultValidators","mappedValidators","plugins","byType","map","validator","allowedValidators","field","includes","name","optional","filteredValidators","filter","Boolean","sort","a","b","getListValidators","getFieldValidators","fieldEditorDialog","maxWidth","maxHeight","paddingTop","EditFieldDialog","onSubmit","props","useState","current","setCurrent","useFieldEditor","getFieldPlugin","useEffect","clonedField","renderer","item","canUse","renderPlugin","rendererName","onClose","useCallback","render","headerTitle","type","invariant","fieldTypeLabel","label","data","form","hasValidators","Array","isArray","validators","length","showValidatorsTab","multipleValues","predefinedValuesTabEnabled","allowPredefinedValues","predefinedValues","enabled","ev","submit"],"sources":["EditFieldDialog.tsx"],"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 hasValidators =\n Array.isArray(fieldPlugin.field.validators) &&\n fieldPlugin.field.validators.length > 0;\n\n const showValidatorsTab =\n form.data.multipleValues ||\n (Array.isArray(fieldPlugin.field.validators) &&\n fieldPlugin.field.validators.length > 0);\n\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 {showValidatorsTab ? (\n <Tab\n label={\"Validators\"}\n data-testid={\"cms.editor.field.tabs.validators\"}\n >\n {form.data.multipleValues ? (\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\n entire 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\n value 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 </>\n ) : null}\n\n {!form.data.multipleValues && hasValidators ? (\n <ValidatorsTab\n field={current}\n form={form}\n name={\"validation\"}\n validators={getFieldValidators(fieldPlugin)}\n />\n ) : null}\n </Tab>\n ) : null}\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\n data-testid=\"cms.editor.field.settings.cancel\"\n onClick={onClose}\n >{t`Cancel`}</ButtonDefault>\n <ButtonPrimary\n data-testid=\"cms.editor.field.settings.save\"\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"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AAOA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEA,IAAMA,CAAC,GAAGC,UAAA,CAAKC,SAAL,CAAe,0CAAf,CAAV;;AAEA,IAAMC,UAAU,gBAAG,IAAAC,YAAA,EAAI;EACnB,+BAA+B;IAC3BC,KAAK,EAAE,GADoB;IAE3BC,MAAM,EAAE;EAFmB;AADZ,CAAJ,sBAAnB;;AAiBA,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAClBC,WADkB,EAKlBC,GALkB,EAOJ;EAAA,IADdC,iBACc,uEADgB,EAChB;;EACd,IAAMC,gBAAgB,GAAGC,gBAAA,CACpBC,MADoB,CACkB,4BADlB,EAEpBC,GAFoB,CAEhB,gBAAmB;IAAA,IAAhBC,SAAgB,QAAhBA,SAAgB;IACpB,IAAMC,iBAAiB,GAAGR,WAAW,CAACS,KAAZ,CAAkBR,GAAlB,KAA0BC,iBAApD;;IACA,IAAIM,iBAAiB,CAACE,QAAlB,CAA2BH,SAAS,CAACI,IAArC,CAAJ,EAAgD;MAC5C,OAAO;QACHC,QAAQ,EAAE,IADP;QAEHL,SAAS,EAATA;MAFG,CAAP;IAIH,CALD,MAKO,IAAIC,iBAAiB,CAACE,QAAlB,YAA+BH,SAAS,CAACI,IAAzC,EAAJ,EAAsD;MACzD,OAAO;QACHC,QAAQ,EAAE,KADP;QAEHL,SAAS,EAATA;MAFG,CAAP;IAIH;;IAED,OAAO,IAAP;EACH,CAjBoB,CAAzB;;EAmBA,IAAMM,kBAAkB,GAAGV,gBAAgB,CAACW,MAAjB,CAAwBC,OAAxB,CAA3B;EAEA,OACIF;EACI;AACZ;AACA;EAH0B,CAIbG,IAJL,CAIU,UAACC,CAAD,EAAeC,CAAf,EAAgC;IAClC,IAAI,CAACD,CAAC,CAACL,QAAH,IAAeM,CAAC,CAACN,QAArB,EAA+B;MAC3B,OAAO,CAAC,CAAR;IACH;;IAED,IAAIK,CAAC,CAACL,QAAF,IAAc,CAACM,CAAC,CAACN,QAArB,EAA+B;MAC3B,OAAO,CAAP;IACH;;IAED,OAAO,CAAP;EACH,CAdL,CADJ;AAiBH,CA9CD;;AAgDA,IAAMO,iBAAiB,GAAG,SAApBA,iBAAoB,CAACnB,WAAD,EAA2C;EACjE,OAAOD,aAAa,CAACC,WAAD,EAAc,gBAAd,EAAgC,CAAC,WAAD,EAAc,WAAd,CAAhC,CAApB;AACH,CAFD;;AAIA,IAAMoB,kBAAkB,GAAG,SAArBA,kBAAqB,CAACpB,WAAD,EAA2C;EAClE,OAAOD,aAAa,CAACC,WAAD,EAAc,YAAd,CAApB;AACH,CAFD;;AAIA,IAAMqB,iBAAiB,gBAAG,IAAAzB,YAAA,EAAI;EAC1BC,KAAK,EAAE,OADmB;EAE1BC,MAAM,EAAE,OAFkB;EAG1B,wBAAwB;IACpBwB,QAAQ,EAAE,iBADU;IAEpBC,SAAS,EAAE,iBAFS;IAGpB,8BAA8B;MAC1BD,QAAQ,EAAE,iBADgB;MAE1BC,SAAS,EAAE,iBAFe;MAG1B1B,KAAK,EAAE,OAHmB;MAI1BC,MAAM,EAAE,qBAJkB;MAK1B0B,UAAU,EAAE;IALc;EAHV;AAHE,CAAJ,6BAA1B;;AAgBA,IAAMC,eAA+C,GAAG,SAAlDA,eAAkD,QAAmC;EAAA,IAAhChB,KAAgC,SAAhCA,KAAgC;EAAA,IAAzBiB,SAAyB,SAAzBA,QAAyB;EAAA,IAAZC,KAAY;;EACvF,gBAA8B,IAAAC,eAAA,EAAgC,IAAhC,CAA9B;EAAA;EAAA,IAAOC,OAAP;EAAA,IAAgBC,UAAhB;;EAEA,sBAA2B,IAAAC,+BAAA,GAA3B;EAAA,IAAQC,cAAR,mBAAQA,cAAR;;EAEA,IAAAC,gBAAA,EAAU,YAAY;IAClB,IAAI,CAACxB,KAAL,EAAY;MACRqB,UAAU,CAACrB,KAAD,CAAV;MACA;IACH;;IAED,IAAMyB,WAAW,GAAG,yBAAUzB,KAAV,CAApB;;IAEA,IAAI,CAACyB,WAAW,CAACC,QAAb,IAAyB,CAACD,WAAW,CAACC,QAAZ,CAAqBxB,IAAnD,EAAyD;MACrD,4BAAuBP,gBAAA,CAClBC,MADkB,CACmB,2BADnB,EAElBS,MAFkB,CAEX,UAAAsB,IAAI;QAAA,OAAIA,IAAI,CAACD,QAAL,CAAcE,MAAd,CAAqB;UAAE5B,KAAK,EAALA;QAAF,CAArB,CAAJ;MAAA,CAFO,CAAvB;MAAA;MAAA,IAAO6B,YAAP;;MAIA,IAAIA,YAAJ,EAAkB;QACdJ,WAAW,CAACC,QAAZ,GAAuB;UAAExB,IAAI,EAAE2B,YAAY,CAACH,QAAb,CAAsBI;QAA9B,CAAvB;MACH;IACJ;;IAEDT,UAAU,CAACI,WAAD,CAAV;EACH,CAnBD,EAmBG,CAACzB,KAAD,CAnBH;EAqBA,IAAM+B,OAAO,GAAG,IAAAC,kBAAA,EAAY,YAAY;IACpCX,UAAU,CAAC,IAAD,CAAV;IACAH,KAAK,CAACa,OAAN;EACH,CAHe,EAGb,EAHa,CAAhB;EAKA,IAAIE,MAAM,GAAG,IAAb;EACA,IAAIC,WAAW,GAAGnD,CAAH,iGAAf;;EAEA,IAAIqC,OAAJ,EAAa;IACT;AACR;AACA;IACQ,IAAM7B,WAAW,GAAGgC,cAAc,CAACH,OAAO,CAACe,IAAT,CAAlC;IACA;AACR;AACA;;IACQ,IAAAC,kBAAA,EAAU7C,WAAV,4CAAyD6B,OAAO,CAACe,IAAjE;IAEAD,WAAW,GAAGnD,CAAC,sHAAD,CAAqC;MAC/CsD,cAAc,EAAE9C,WAAW,CAACS,KAAZ,CAAkBsC;IADa,CAArC,CAAd;IAIAL,MAAM,gBACF,6BAAC,UAAD;MACI,IAAI,EAAEb,OADV;MAEI,QAAQ,EAAE,kBAAAmB,IAAI,EAAI;QACd;AACpB;AACA;QACoB,OAAOtB,SAAQ,CAACsB,IAAD,CAAf;MACH;IAPL,GASK,UAAAC,IAAI,EAAI;MACL,IAAMC,aAAa,GACfC,KAAK,CAACC,OAAN,CAAcpD,WAAW,CAACS,KAAZ,CAAkB4C,UAAhC,KACArD,WAAW,CAACS,KAAZ,CAAkB4C,UAAlB,CAA6BC,MAA7B,GAAsC,CAF1C;MAIA,IAAMC,iBAAiB,GACnBN,IAAI,CAACD,IAAL,CAAUQ,cAAV,IACCL,KAAK,CAACC,OAAN,CAAcpD,WAAW,CAACS,KAAZ,CAAkB4C,UAAhC,KACGrD,WAAW,CAACS,KAAZ,CAAkB4C,UAAlB,CAA6BC,MAA7B,GAAsC,CAH9C;MAKA,IAAMG,0BAA0B,GAC5BzD,WAAW,CAACS,KAAZ,CAAkBiD,qBAAlB,IACAT,IAAI,CAACD,IAAL,CAAUW,gBADV,IAEAV,IAAI,CAACD,IAAL,CAAUW,gBAAV,CAA2BC,OAH/B;MAKA,oBACI,yEACI,6BAAC,qBAAD;QAAe,SAAS,EAAEjE;MAA1B,gBACI,6BAAC,UAAD,qBACI,6BAAC,SAAD;QAAK,KAAK,EAAEH,CAAF;MAAV,gBACI,6BAAC,mBAAD;QACI,IAAI,EAAEyD,IADV;QAEI,KAAK,EAAEA,IAAI,CAACD,IAFhB;QAGI,WAAW,EAAEhD;MAHjB,EADJ,CADJ,eAQI,6BAAC,SAAD;QACI,KAAK,EAAER,CAAF,sGADT;QAEI,QAAQ,EAAE,CAACiE;MAFf,GAIKA,0BAA0B,iBACvB,6BAAC,yBAAD;QACI,IAAI,EAAER,IADV;QAEI,KAAK,EAAEA,IAAI,CAACD,IAFhB;QAGI,WAAW,EAAEhD;MAHjB,EALR,CARJ,EAqBKuD,iBAAiB,gBACd,6BAAC,SAAD;QACI,KAAK,EAAE,YADX;QAEI,eAAa;MAFjB,GAIKN,IAAI,CAACD,IAAL,CAAUQ,cAAV,gBACG,yEACI,6BAAC,UAAD,qBACI,6BAAC,UAAD;QAAM,IAAI,EAAE;MAAZ,gBACI,6BAAC,sBAAD;QAAY,GAAG,EAAE;MAAjB,qBADJ,eAII,wCAJJ,eAKI,6BAAC,sBAAD;QAAY,GAAG,EAAE;MAAjB,gEALJ,CADJ,eAWI,6BAAC,UAAD;QAAM,IAAI,EAAE;MAAZ,gBACI,6BAAC,oBAAD;QAAW,CAAC,EAAE;MAAd,gBACI,6BAAC,sBAAD;QACI,KAAK,EAAE3B,OADX;QAEI,IAAI,EAAE,gBAFV;QAGI,UAAU,EAAEV,iBAAiB,CACzBnB,WADyB,CAHjC;QAMI,IAAI,EAAEiD;MANV,EADJ,CADJ,CAXJ,CADJ,eA0BI,6BAAC,UAAD,qBACI,6BAAC,UAAD;QAAM,IAAI,EAAE;MAAZ,gBACI,6BAAC,sBAAD;QAAY,GAAG,EAAE;MAAjB,iCADJ,eAII,wCAJJ,eAKI,6BAAC,sBAAD;QAAY,GAAG,EAAE;MAAjB,6DALJ,CADJ,eAWI,6BAAC,UAAD;QAAM,IAAI,EAAE;MAAZ,gBACI,6BAAC,oBAAD;QAAW,CAAC,EAAE;MAAd,gBACI,6BAAC,sBAAD;QACI,KAAK,EAAEpB,OADX;QAEI,IAAI,EAAEoB,IAFV;QAGI,IAAI,EAAE,YAHV;QAII,UAAU,EAAE7B,kBAAkB,CAC1BpB,WAD0B;MAJlC,EADJ,CADJ,CAXJ,CA1BJ,CADH,GAoDG,IAxDR,EA0DK,CAACiD,IAAI,CAACD,IAAL,CAAUQ,cAAX,IAA6BN,aAA7B,gBACG,6BAAC,sBAAD;QACI,KAAK,EAAErB,OADX;QAEI,IAAI,EAAEoB,IAFV;QAGI,IAAI,EAAE,YAHV;QAII,UAAU,EAAE7B,kBAAkB,CAACpB,WAAD;MAJlC,EADH,GAOG,IAjER,CADc,GAoEd,IAzFR,eA0FI,6BAAC,SAAD;QAAK,KAAK,EAAER,CAAF;MAAV,gBACI,6BAAC,sBAAD;QACI,IAAI,EAAEyD,IADV;QAEI,KAAK,EAAEA,IAAI,CAACD,IAFhB,CAGI;QACA;QAJJ;QAKI,WAAW,EAAEhD;MALjB,EADJ,CA1FJ,CADJ,CADJ,eAuGI,6BAAC,qBAAD,qBACI,6BAAC,qBAAD;QACI,eAAY,kCADhB;QAEI,OAAO,EAAEwC;MAFb,GAGEhD,CAHF,4FADJ,eAKI,6BAAC,qBAAD;QACI,eAAY,gCADhB;QAEI,OAAO,EAAE,iBAAAqE,EAAE,EAAI;UACXZ,IAAI,CAACa,MAAL,CAAYD,EAAZ;QACH;MAJL,GAKErE,CALF,gGALJ,CAvGJ,CADJ;IAsHH,CA9IL,CADJ;EAkJH;;EAED,oBACI,6BAAC,cAAD;IACI,qBAAqB,MADzB;IAEI,IAAI,EAAE,CAAC,CAACqC,OAFZ;IAGI,OAAO,EAAEW,OAHb;IAII,eAAa,+BAJjB;IAKI,SAAS,EAAEnB;EALf,gBAOI,6BAAC,mBAAD,QAAcsB,WAAd,CAPJ,EAQKD,MARL,CADJ;AAYH,CAhND;;eAkNejB,e"}
|