@webiny/app-headless-cms-common 6.3.0-beta.4 → 6.4.0-beta.0
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/Fields/ErrorBoundary.js +29 -34
- package/Fields/ErrorBoundary.js.map +1 -1
- package/Fields/FieldElement.js +38 -61
- package/Fields/FieldElement.js.map +1 -1
- package/Fields/FieldElementError.js +13 -22
- package/Fields/FieldElementError.js.map +1 -1
- package/Fields/FieldRulesProvider.js +11 -17
- package/Fields/FieldRulesProvider.js.map +1 -1
- package/Fields/Fields.js +76 -139
- package/Fields/Fields.js.map +1 -1
- package/Fields/Label.js +7 -7
- package/Fields/Label.js.map +1 -1
- package/Fields/LayoutDescriptorCell.js +33 -40
- package/Fields/LayoutDescriptorCell.js.map +1 -1
- package/Fields/evaluateExpression.js +54 -94
- package/Fields/evaluateExpression.js.map +1 -1
- package/Fields/fieldOptions.js +56 -104
- package/Fields/fieldOptions.js.map +1 -1
- package/Fields/index.js +0 -2
- package/Fields/layoutFieldRenderers/AlertFieldRenderer.js +7 -10
- package/Fields/layoutFieldRenderers/AlertFieldRenderer.js.map +1 -1
- package/Fields/layoutFieldRenderers/SeparatorFieldRenderer.js +12 -15
- package/Fields/layoutFieldRenderers/SeparatorFieldRenderer.js.map +1 -1
- package/Fields/layoutFieldRenderers/TabsFieldRenderer.js +52 -63
- package/Fields/layoutFieldRenderers/TabsFieldRenderer.js.map +1 -1
- package/Fields/operatorOptions.js +115 -87
- package/Fields/operatorOptions.js.map +1 -1
- package/Fields/useBind.js +101 -107
- package/Fields/useBind.js.map +1 -1
- package/Fields/useFieldRules.js +79 -133
- package/Fields/useFieldRules.js.map +1 -1
- package/Fields/useRenderPlugins.js +3 -2
- package/Fields/useRenderPlugins.js.map +1 -1
- package/ModelFieldProvider/CanEditField.js +6 -9
- package/ModelFieldProvider/CanEditField.js.map +1 -1
- package/ModelFieldProvider/ModelFieldContext.js +15 -22
- package/ModelFieldProvider/ModelFieldContext.js.map +1 -1
- package/ModelFieldProvider/index.js +0 -2
- package/ModelFieldProvider/useModelField.js +15 -21
- package/ModelFieldProvider/useModelField.js.map +1 -1
- package/ModelProvider/ModelContext.js +11 -15
- package/ModelProvider/ModelContext.js.map +1 -1
- package/ModelProvider/index.js +0 -2
- package/ModelProvider/useModel.js +7 -11
- package/ModelProvider/useModel.js.map +1 -1
- package/constants.js +2 -1
- package/constants.js.map +1 -1
- package/createFieldsList.js +27 -49
- package/createFieldsList.js.map +1 -1
- package/createValidationContainer.js +13 -20
- package/createValidationContainer.js.map +1 -1
- package/createValidators.js +42 -47
- package/createValidators.js.map +1 -1
- package/entries.graphql.d.ts +11 -0
- package/entries.graphql.js +74 -164
- package/entries.graphql.js.map +1 -1
- package/exports/admin/cms/model.js +0 -2
- package/exports/admin/cms.d.ts +1 -1
- package/exports/admin/cms.js +0 -3
- package/getModelTitleFieldId.js +4 -5
- package/getModelTitleFieldId.js.map +1 -1
- package/index.js +0 -2
- package/normalizeIcon.js +8 -7
- package/normalizeIcon.js.map +1 -1
- package/package.json +11 -13
- package/prepareFormData.js +39 -61
- package/prepareFormData.js.map +1 -1
- package/types/index.d.ts +2 -0
- package/types/index.js +1 -41
- package/types/model.js +4 -27
- package/types/model.js.map +1 -1
- package/types/shared.js +0 -3
- package/types/validation.js +0 -3
- package/Fields/index.js.map +0 -1
- package/ModelFieldProvider/index.js.map +0 -1
- package/ModelProvider/index.js.map +0 -1
- package/exports/admin/cms/model.js.map +0 -1
- package/exports/admin/cms.js.map +0 -1
- package/index.js.map +0 -1
- package/types/index.js.map +0 -1
- package/types/shared.js.map +0 -1
- package/types/validation.js.map +0 -1
package/Fields/ErrorBoundary.js
CHANGED
|
@@ -1,40 +1,35 @@
|
|
|
1
|
-
import
|
|
1
|
+
import react from "react";
|
|
2
2
|
import { FieldElementError } from "./FieldElementError.js";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
}
|
|
11
|
-
static getDerivedStateFromError(error) {
|
|
12
|
-
return {
|
|
13
|
-
hasError: true,
|
|
14
|
-
error
|
|
15
|
-
};
|
|
16
|
-
}
|
|
17
|
-
componentDidCatch(error, errorInfo) {
|
|
18
|
-
const {
|
|
19
|
-
field
|
|
20
|
-
} = this.props;
|
|
21
|
-
if (!field) {
|
|
22
|
-
return;
|
|
3
|
+
class ErrorBoundary extends react.Component {
|
|
4
|
+
constructor(props){
|
|
5
|
+
super(props);
|
|
6
|
+
this.state = {
|
|
7
|
+
hasError: false,
|
|
8
|
+
error: void 0
|
|
9
|
+
};
|
|
23
10
|
}
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
11
|
+
static getDerivedStateFromError(error) {
|
|
12
|
+
return {
|
|
13
|
+
hasError: true,
|
|
14
|
+
error
|
|
15
|
+
};
|
|
16
|
+
}
|
|
17
|
+
componentDidCatch(error, errorInfo) {
|
|
18
|
+
const { field } = this.props;
|
|
19
|
+
if (!field) return;
|
|
20
|
+
console.groupCollapsed(`%cFIELD ERROR%c: An error occurred while rendering model field "${field.fieldId}" (${field.id}) of type "${field.type}".`, "color:red", "color:default");
|
|
21
|
+
console.log("Field definition", field);
|
|
22
|
+
console.error(error, errorInfo);
|
|
23
|
+
console.groupEnd();
|
|
24
|
+
}
|
|
25
|
+
render() {
|
|
26
|
+
if (this.state.hasError) return /*#__PURE__*/ react.createElement(FieldElementError, {
|
|
27
|
+
title: `Error: ${this.state.error.message}`,
|
|
28
|
+
description: "See developer console for more details."
|
|
29
|
+
});
|
|
30
|
+
return this.props.children;
|
|
35
31
|
}
|
|
36
|
-
return this.props.children;
|
|
37
|
-
}
|
|
38
32
|
}
|
|
33
|
+
export { ErrorBoundary };
|
|
39
34
|
|
|
40
35
|
//# sourceMappingURL=ErrorBoundary.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"Fields/ErrorBoundary.js","sources":["../../src/Fields/ErrorBoundary.tsx"],"sourcesContent":["import type { ErrorInfo } from \"react\";\nimport React from \"react\";\nimport type { CmsModelField } from \"~/types/index.js\";\nimport { FieldElementError } from \"./FieldElementError.js\";\n\ntype State =\n | {\n hasError: true;\n error: Error;\n }\n | { hasError: false; error: undefined };\n\ninterface Props {\n field: CmsModelField;\n [key: string]: any;\n}\n\nexport class ErrorBoundary extends React.Component<Props, State> {\n constructor(props: Props) {\n super(props);\n this.state = {\n hasError: false,\n error: undefined\n };\n }\n\n static getDerivedStateFromError(error: Error) {\n return {\n hasError: true,\n error\n };\n }\n\n public override componentDidCatch(error: Error, errorInfo: ErrorInfo) {\n const { field } = this.props;\n if (!field) {\n return;\n }\n console.groupCollapsed(\n `%cFIELD ERROR%c: An error occurred while rendering model field \"${field.fieldId}\" (${field.id}) of type \"${field.type}\".`,\n \"color:red\",\n \"color:default\"\n );\n console.log(\"Field definition\", field);\n console.error(error, errorInfo);\n console.groupEnd();\n }\n\n public override render() {\n if (this.state.hasError) {\n return (\n <FieldElementError\n title={`Error: ${this.state.error.message}`}\n description={\"See developer console for more details.\"}\n />\n );\n }\n\n return this.props.children;\n }\n}\n"],"names":["ErrorBoundary","React","props","undefined","error","errorInfo","field","console","FieldElementError"],"mappings":";;AAiBO,MAAMA,sBAAsBC,MAAAA,SAAe;IAC9C,YAAYC,KAAY,CAAE;QACtB,KAAK,CAACA;QACN,IAAI,CAAC,KAAK,GAAG;YACT,UAAU;YACV,OAAOC;QACX;IACJ;IAEA,OAAO,yBAAyBC,KAAY,EAAE;QAC1C,OAAO;YACH,UAAU;YACVA;QACJ;IACJ;IAEgB,kBAAkBA,KAAY,EAAEC,SAAoB,EAAE;QAClE,MAAM,EAAEC,KAAK,EAAE,GAAG,IAAI,CAAC,KAAK;QAC5B,IAAI,CAACA,OACD;QAEJC,QAAQ,cAAc,CAClB,CAAC,gEAAgE,EAAED,MAAM,OAAO,CAAC,GAAG,EAAEA,MAAM,EAAE,CAAC,WAAW,EAAEA,MAAM,IAAI,CAAC,EAAE,CAAC,EAC1H,aACA;QAEJC,QAAQ,GAAG,CAAC,oBAAoBD;QAChCC,QAAQ,KAAK,CAACH,OAAOC;QACrBE,QAAQ,QAAQ;IACpB;IAEgB,SAAS;QACrB,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,EACnB,OAAO,WAAP,GACI,oBAACC,mBAAiBA;YACd,OAAO,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE;YAC3C,aAAa;;QAKzB,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ;IAC9B;AACJ"}
|
package/Fields/FieldElement.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import react from "react";
|
|
2
2
|
import get from "lodash/get.js";
|
|
3
3
|
import { makeDecoratable } from "@webiny/app-admin";
|
|
4
4
|
import { i18n } from "@webiny/app/i18n/index.js";
|
|
@@ -8,70 +8,47 @@ import { useRenderPlugins } from "./useRenderPlugins.js";
|
|
|
8
8
|
import { ModelFieldProvider, useModelField } from "../ModelFieldProvider/index.js";
|
|
9
9
|
import { ErrorBoundary } from "./ErrorBoundary.js";
|
|
10
10
|
const t = i18n.ns("app-headless-cms/admin/components/content-form");
|
|
11
|
-
const RenderField = props
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
field
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
if (typeof field.renderer === "function") {
|
|
24
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, field.renderer({
|
|
25
|
-
field,
|
|
26
|
-
getBind,
|
|
27
|
-
Label,
|
|
28
|
-
contentModel
|
|
11
|
+
const RenderField = (props)=>{
|
|
12
|
+
const renderPlugins = useRenderPlugins();
|
|
13
|
+
const { Bind, contentModel } = props;
|
|
14
|
+
const { field } = useModelField();
|
|
15
|
+
const getBind = useBind({
|
|
16
|
+
Bind
|
|
17
|
+
});
|
|
18
|
+
if ("function" == typeof field.renderer) return /*#__PURE__*/ react.createElement(react.Fragment, null, field.renderer({
|
|
19
|
+
field,
|
|
20
|
+
getBind,
|
|
21
|
+
Label: Label,
|
|
22
|
+
contentModel
|
|
29
23
|
}));
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
return t`Cannot render "{fieldName}" field - field renderer not defined.`({
|
|
34
|
-
fieldName: /*#__PURE__*/React.createElement("strong", null, field.fieldId)
|
|
24
|
+
const fieldRendererName = get(field, "renderer.name");
|
|
25
|
+
if (!fieldRendererName) return t`Cannot render "{fieldName}" field - field renderer not defined.`({
|
|
26
|
+
fieldName: /*#__PURE__*/ react.createElement("strong", null, field.fieldId)
|
|
35
27
|
});
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
return t`Cannot render "{fieldName}" field - field renderer missing in Admin UI plugins.`({
|
|
40
|
-
fieldName: /*#__PURE__*/React.createElement("strong", null, field.fieldId)
|
|
28
|
+
const renderPlugin = renderPlugins.find((plugin)=>plugin.renderer.rendererName === fieldRendererName);
|
|
29
|
+
if (!renderPlugin) return t`Cannot render "{fieldName}" field - field renderer missing in Admin UI plugins.`({
|
|
30
|
+
fieldName: /*#__PURE__*/ react.createElement("strong", null, field.fieldId)
|
|
41
31
|
});
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
}));
|
|
32
|
+
return /*#__PURE__*/ react.createElement(react.Fragment, null, renderPlugin.renderer.render({
|
|
33
|
+
field,
|
|
34
|
+
getBind,
|
|
35
|
+
Label: Label,
|
|
36
|
+
contentModel
|
|
37
|
+
}));
|
|
49
38
|
};
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
}, /*#__PURE__*/React.createElement(ErrorBoundary, {
|
|
62
|
-
field: field
|
|
63
|
-
}, /*#__PURE__*/React.createElement(ModelFieldProvider, {
|
|
64
|
-
field: field
|
|
65
|
-
}, /*#__PURE__*/React.createElement(RenderField, props))));
|
|
39
|
+
const FieldElement = makeDecoratable("FieldElement", ({ field, ...props })=>{
|
|
40
|
+
if (!field) return null;
|
|
41
|
+
return /*#__PURE__*/ react.createElement("hcms-model-field", {
|
|
42
|
+
"data-id": field.id,
|
|
43
|
+
"data-field-id": field.fieldId,
|
|
44
|
+
"data-type": field.type
|
|
45
|
+
}, /*#__PURE__*/ react.createElement(ErrorBoundary, {
|
|
46
|
+
field: field
|
|
47
|
+
}, /*#__PURE__*/ react.createElement(ModelFieldProvider, {
|
|
48
|
+
field: field
|
|
49
|
+
}, /*#__PURE__*/ react.createElement(RenderField, props))));
|
|
66
50
|
});
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
* @deprecated Use `FieldElement` instead.
|
|
70
|
-
*/
|
|
71
|
-
export const RenderFieldElement = FieldElement;
|
|
72
|
-
|
|
73
|
-
/**
|
|
74
|
-
* @deprecated Use `FieldElementProps` instead.
|
|
75
|
-
*/
|
|
51
|
+
const RenderFieldElement = FieldElement;
|
|
52
|
+
export { FieldElement, RenderFieldElement };
|
|
76
53
|
|
|
77
54
|
//# sourceMappingURL=FieldElement.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"Fields/FieldElement.js","sources":["../../src/Fields/FieldElement.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get.js\";\nimport { makeDecoratable } from \"@webiny/app-admin\";\nimport { i18n } from \"@webiny/app/i18n/index.js\";\nimport Label from \"./Label.js\";\nimport { useBind } from \"./useBind.js\";\nimport { useRenderPlugins } from \"./useRenderPlugins.js\";\nimport { ModelFieldProvider, useModelField } from \"../ModelFieldProvider/index.js\";\nimport type { BindComponent, CmsEditorContentModel, CmsModelField } from \"~/types/index.js\";\nimport { ErrorBoundary } from \"./ErrorBoundary.js\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/components/content-form\");\n\ndeclare module \"react\" {\n namespace JSX {\n interface IntrinsicElements {\n \"hcms-model-field\": {\n \"data-id\": string;\n \"data-type\": string;\n \"data-field-id\": string;\n children: React.ReactNode;\n };\n }\n }\n}\n\ntype RenderFieldProps = Omit<FieldElementProps, \"field\">;\n\nconst RenderField = (props: RenderFieldProps) => {\n const renderPlugins = useRenderPlugins();\n const { Bind, contentModel } = props;\n const { field } = useModelField();\n const getBind = useBind({ Bind });\n\n if (typeof field.renderer === \"function\") {\n return <>{field.renderer({ field, getBind, Label, contentModel })}</>;\n }\n\n const fieldRendererName = get(field, \"renderer.name\");\n if (!fieldRendererName) {\n return t`Cannot render \"{fieldName}\" field - field renderer not defined.`({\n fieldName: <strong>{field.fieldId}</strong>\n });\n }\n\n const renderPlugin = renderPlugins.find(\n plugin => plugin.renderer.rendererName === fieldRendererName\n );\n\n if (!renderPlugin) {\n return t`Cannot render \"{fieldName}\" field - field renderer missing in Admin UI plugins.`({\n fieldName: <strong>{field.fieldId}</strong>\n });\n }\n\n return <>{renderPlugin.renderer.render({ field, getBind, Label, contentModel })}</>;\n};\n\nexport interface FieldElementProps {\n field: CmsModelField;\n Bind: BindComponent;\n contentModel: CmsEditorContentModel;\n}\n\nexport const FieldElement = makeDecoratable(\n \"FieldElement\",\n ({ field, ...props }: FieldElementProps) => {\n if (!field) {\n return null;\n }\n\n return (\n <hcms-model-field\n data-id={field.id}\n data-field-id={field.fieldId}\n data-type={field.type}\n >\n <ErrorBoundary field={field}>\n <ModelFieldProvider field={field}>\n <RenderField {...props} />\n </ModelFieldProvider>\n </ErrorBoundary>\n </hcms-model-field>\n );\n }\n);\n\n/**\n * @deprecated Use `FieldElement` instead.\n */\nexport const RenderFieldElement = FieldElement;\n\n/**\n * @deprecated Use `FieldElementProps` instead.\n */\nexport type RenderFieldElementProps = FieldElementProps;\n"],"names":["t","i18n","RenderField","props","renderPlugins","useRenderPlugins","Bind","contentModel","field","useModelField","getBind","useBind","Label","fieldRendererName","get","renderPlugin","plugin","FieldElement","makeDecoratable","ErrorBoundary","ModelFieldProvider","RenderFieldElement"],"mappings":";;;;;;;;;AAWA,MAAMA,IAAIC,KAAK,EAAE,CAAC;AAiBlB,MAAMC,cAAc,CAACC;IACjB,MAAMC,gBAAgBC;IACtB,MAAM,EAAEC,IAAI,EAAEC,YAAY,EAAE,GAAGJ;IAC/B,MAAM,EAAEK,KAAK,EAAE,GAAGC;IAClB,MAAMC,UAAUC,QAAQ;QAAEL;IAAK;IAE/B,IAAI,AAA0B,cAA1B,OAAOE,MAAM,QAAQ,EACrB,OAAO,WAAP,GAAO,0CAAGA,MAAM,QAAQ,CAAC;QAAEA;QAAOE;QAASE,OAAKA;QAAEL;IAAa;IAGnE,MAAMM,oBAAoBC,IAAIN,OAAO;IACrC,IAAI,CAACK,mBACD,OAAOb,CAAC,CAAC,+DAA+D,CAAC,CAAC;QACtE,WAAW,WAAX,GAAW,oBAAC,gBAAQQ,MAAM,OAAO;IACrC;IAGJ,MAAMO,eAAeX,cAAc,IAAI,CACnCY,CAAAA,SAAUA,OAAO,QAAQ,CAAC,YAAY,KAAKH;IAG/C,IAAI,CAACE,cACD,OAAOf,CAAC,CAAC,+EAA+E,CAAC,CAAC;QACtF,WAAW,WAAX,GAAW,oBAAC,gBAAQQ,MAAM,OAAO;IACrC;IAGJ,OAAO,WAAP,GAAO,0CAAGO,aAAa,QAAQ,CAAC,MAAM,CAAC;QAAEP;QAAOE;QAASE,OAAKA;QAAEL;IAAa;AACjF;AAQO,MAAMU,eAAeC,gBACxB,gBACA,CAAC,EAAEV,KAAK,EAAE,GAAGL,OAA0B;IACnC,IAAI,CAACK,OACD,OAAO;IAGX,OAAO,WAAP,GACI,oBAAC;QACG,WAASA,MAAM,EAAE;QACjB,iBAAeA,MAAM,OAAO;QAC5B,aAAWA,MAAM,IAAI;qBAErB,oBAACW,eAAaA;QAAC,OAAOX;qBAClB,oBAACY,oBAAkBA;QAAC,OAAOZ;qBACvB,oBAACN,aAAgBC;AAKrC;AAMG,MAAMkB,qBAAqBJ"}
|
|
@@ -1,25 +1,16 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
name: "1ybf6v5",
|
|
14
|
-
styles: "border:2px solid red;background-color:#f87e7e;border-radius:5px;padding:5px 10px/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZpZWxkRWxlbWVudEVycm9yLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFHOEIiLCJmaWxlIjoiRmllbGRFbGVtZW50RXJyb3IudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5cbmNvbnN0IFN0eWxlZEVycm9yID0gc3R5bGVkLmRpdmBcbiAgICBib3JkZXI6IDJweCBzb2xpZCByZWQ7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogI2Y4N2U3ZTtcbiAgICBib3JkZXItcmFkaXVzOiA1cHg7XG4gICAgcGFkZGluZzogNXB4IDEwcHg7XG5gO1xuXG5pbnRlcmZhY2UgRmllbGRFbGVtZW50RXJyb3JQcm9wcyB7XG4gICAgdGl0bGU6IHN0cmluZztcbiAgICBkZXNjcmlwdGlvbjogc3RyaW5nO1xufVxuXG5jb25zdCBzaG93RXJyb3IgPSBwcm9jZXNzLmVudi5OT0RFX0VOViA9PT0gXCJkZXZlbG9wbWVudFwiO1xuXG5leHBvcnQgY29uc3QgRmllbGRFbGVtZW50RXJyb3IgPSAocHJvcHM6IEZpZWxkRWxlbWVudEVycm9yUHJvcHMpID0+IHtcbiAgICBpZiAoIXNob3dFcnJvcikge1xuICAgICAgICByZXR1cm4gbnVsbDtcbiAgICB9XG5cbiAgICByZXR1cm4gKFxuICAgICAgICA8U3R5bGVkRXJyb3I+XG4gICAgICAgICAgICA8aDU+e3Byb3BzLnRpdGxlfTwvaDU+XG4gICAgICAgICAgICA8cD57cHJvcHMuZGVzY3JpcHRpb259PC9wPlxuICAgICAgICA8L1N0eWxlZEVycm9yPlxuICAgICk7XG59O1xuIl19 */",
|
|
15
|
-
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
16
|
-
});
|
|
17
|
-
const showError = process.env.NODE_ENV === "development";
|
|
18
|
-
export const FieldElementError = props => {
|
|
19
|
-
if (!showError) {
|
|
20
|
-
return null;
|
|
21
|
-
}
|
|
22
|
-
return /*#__PURE__*/React.createElement(StyledError, null, /*#__PURE__*/React.createElement("h5", null, props.title), /*#__PURE__*/React.createElement("p", null, props.description));
|
|
1
|
+
import react from "react";
|
|
2
|
+
import styled from "@emotion/styled";
|
|
3
|
+
const StyledError = styled.div`
|
|
4
|
+
border: 2px solid red;
|
|
5
|
+
background-color: #f87e7e;
|
|
6
|
+
border-radius: 5px;
|
|
7
|
+
padding: 5px 10px;
|
|
8
|
+
`;
|
|
9
|
+
const showError = "development" === process.env.NODE_ENV;
|
|
10
|
+
const FieldElementError = (props)=>{
|
|
11
|
+
if (!showError) return null;
|
|
12
|
+
return /*#__PURE__*/ react.createElement(StyledError, null, /*#__PURE__*/ react.createElement("h5", null, props.title), /*#__PURE__*/ react.createElement("p", null, props.description));
|
|
23
13
|
};
|
|
14
|
+
export { FieldElementError };
|
|
24
15
|
|
|
25
16
|
//# sourceMappingURL=FieldElementError.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"Fields/FieldElementError.js","sources":["../../src/Fields/FieldElementError.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\n\nconst StyledError = styled.div`\n border: 2px solid red;\n background-color: #f87e7e;\n border-radius: 5px;\n padding: 5px 10px;\n`;\n\ninterface FieldElementErrorProps {\n title: string;\n description: string;\n}\n\nconst showError = process.env.NODE_ENV === \"development\";\n\nexport const FieldElementError = (props: FieldElementErrorProps) => {\n if (!showError) {\n return null;\n }\n\n return (\n <StyledError>\n <h5>{props.title}</h5>\n <p>{props.description}</p>\n </StyledError>\n );\n};\n"],"names":["StyledError","styled","showError","process","FieldElementError","props"],"mappings":";;AAGA,MAAMA,cAAcC,OAAO,GAAG,CAAC;;;;;AAK/B,CAAC;AAOD,MAAMC,YAAYC,AAAyB,kBAAzBA,QAAQ,GAAG,CAAC,QAAQ;AAE/B,MAAMC,oBAAoB,CAACC;IAC9B,IAAI,CAACH,WACD,OAAO;IAGX,OAAO,WAAP,GACI,oBAACF,aAAWA,MAAAA,WAAAA,GACR,oBAAC,YAAIK,MAAM,KAAK,iBAChB,oBAAC,WAAGA,MAAM,WAAW;AAGjC"}
|
|
@@ -1,20 +1,14 @@
|
|
|
1
|
-
import
|
|
2
|
-
const FieldRulesContext = /*#__PURE__*/createContext({
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
import react, { createContext, useContext } from "react";
|
|
2
|
+
const FieldRulesContext = /*#__PURE__*/ createContext({
|
|
3
|
+
canView: true,
|
|
4
|
+
canEdit: true,
|
|
5
|
+
hidden: false,
|
|
6
|
+
disabled: false
|
|
7
7
|
});
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
value: rules
|
|
14
|
-
}, children);
|
|
15
|
-
};
|
|
16
|
-
export const useParentRules = () => {
|
|
17
|
-
return useContext(FieldRulesContext);
|
|
18
|
-
};
|
|
8
|
+
const FieldRulesProvider = ({ rules, children })=>/*#__PURE__*/ react.createElement(FieldRulesContext.Provider, {
|
|
9
|
+
value: rules
|
|
10
|
+
}, children);
|
|
11
|
+
const useParentRules = ()=>useContext(FieldRulesContext);
|
|
12
|
+
export { FieldRulesProvider, useParentRules };
|
|
19
13
|
|
|
20
14
|
//# sourceMappingURL=FieldRulesProvider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"Fields/FieldRulesProvider.js","sources":["../../src/Fields/FieldRulesProvider.tsx"],"sourcesContent":["import React, { createContext, useContext } from \"react\";\nimport type { EffectiveFieldRules } from \"./useFieldRules.js\";\n\nconst FieldRulesContext = createContext<EffectiveFieldRules>({\n canView: true,\n canEdit: true,\n hidden: false,\n disabled: false\n});\n\ninterface FieldRulesProviderProps {\n rules: EffectiveFieldRules;\n children: React.ReactNode;\n}\n\nexport const FieldRulesProvider = ({ rules, children }: FieldRulesProviderProps) => {\n return <FieldRulesContext.Provider value={rules}>{children}</FieldRulesContext.Provider>;\n};\n\nexport const useParentRules = (): EffectiveFieldRules => {\n return useContext(FieldRulesContext);\n};\n"],"names":["FieldRulesContext","createContext","FieldRulesProvider","rules","children","useParentRules","useContext"],"mappings":";AAGA,MAAMA,oBAAoB,WAAHA,GAAGC,cAAmC;IACzD,SAAS;IACT,SAAS;IACT,QAAQ;IACR,UAAU;AACd;AAOO,MAAMC,qBAAqB,CAAC,EAAEC,KAAK,EAAEC,QAAQ,EAA2B,GACpE,WAAP,GAAO,oBAACJ,kBAAkB,QAAQ;QAAC,OAAOG;OAAQC;AAG/C,MAAMC,iBAAiB,IACnBC,WAAWN"}
|
package/Fields/Fields.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import react from "react";
|
|
2
2
|
import { Alert, Grid } from "@webiny/admin-ui";
|
|
3
3
|
import { FieldElement } from "./FieldElement.js";
|
|
4
4
|
import { FieldElementError } from "./FieldElementError.js";
|
|
@@ -7,150 +7,87 @@ import { LayoutDescriptorCell } from "./LayoutDescriptorCell.js";
|
|
|
7
7
|
import { useAuthentication } from "@webiny/app-admin";
|
|
8
8
|
import { FieldRulesProvider, useParentRules } from "./FieldRulesProvider.js";
|
|
9
9
|
import { evaluateAccessControlRules, useFieldEffectiveRules } from "./useFieldRules.js";
|
|
10
|
-
const getFieldById = (fields, id)
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
*/
|
|
22
|
-
|
|
23
|
-
const LayoutCell = ({
|
|
24
|
-
cell,
|
|
25
|
-
Bind,
|
|
26
|
-
fields,
|
|
27
|
-
contentModel,
|
|
28
|
-
gridClassName
|
|
29
|
-
}) => {
|
|
30
|
-
const isLayout = isLayoutField(cell);
|
|
31
|
-
const rules = useFieldEffectiveRules(isLayout ? cell : {});
|
|
32
|
-
if (!isLayout) {
|
|
33
|
-
return null;
|
|
34
|
-
}
|
|
35
|
-
if (!rules.canView || rules.hidden) {
|
|
36
|
-
return null;
|
|
37
|
-
}
|
|
38
|
-
return /*#__PURE__*/React.createElement(FieldRulesProvider, {
|
|
39
|
-
rules: rules
|
|
40
|
-
}, /*#__PURE__*/React.createElement(LayoutDescriptorCell, {
|
|
41
|
-
field: cell,
|
|
42
|
-
Bind: Bind,
|
|
43
|
-
fields: fields,
|
|
44
|
-
contentModel: contentModel,
|
|
45
|
-
gridClassName: gridClassName
|
|
46
|
-
}));
|
|
47
|
-
};
|
|
48
|
-
|
|
49
|
-
/**
|
|
50
|
-
* Renders a single data field cell with rules + permissions.
|
|
51
|
-
*/
|
|
52
|
-
|
|
53
|
-
const FieldCell = ({
|
|
54
|
-
id,
|
|
55
|
-
field,
|
|
56
|
-
span,
|
|
57
|
-
Bind,
|
|
58
|
-
contentModel
|
|
59
|
-
}) => {
|
|
60
|
-
const rules = useFieldEffectiveRules(field ?? {});
|
|
61
|
-
if (!rules.canView || rules.hidden) {
|
|
62
|
-
return null;
|
|
63
|
-
}
|
|
64
|
-
return /*#__PURE__*/React.createElement(Grid.Column, {
|
|
65
|
-
span: span
|
|
66
|
-
}, field ? /*#__PURE__*/React.createElement(FieldRulesProvider, {
|
|
67
|
-
rules: rules
|
|
68
|
-
}, /*#__PURE__*/React.createElement(FieldElement, {
|
|
69
|
-
field: field,
|
|
70
|
-
Bind: Bind,
|
|
71
|
-
contentModel: contentModel
|
|
72
|
-
})) : /*#__PURE__*/React.createElement(FieldElementError, {
|
|
73
|
-
title: `Missing field with id "${id}"!`,
|
|
74
|
-
description: "Make sure field layout contains the correct field ids (hint: check for typos)."
|
|
75
|
-
}));
|
|
76
|
-
};
|
|
77
|
-
|
|
78
|
-
/**
|
|
79
|
-
* Renders a single row, delegating each cell to FieldCell or LayoutCell.
|
|
80
|
-
*/
|
|
81
|
-
|
|
82
|
-
const RowRenderer = ({
|
|
83
|
-
row,
|
|
84
|
-
fields,
|
|
85
|
-
Bind,
|
|
86
|
-
contentModel,
|
|
87
|
-
gridClassName
|
|
88
|
-
}) => {
|
|
89
|
-
const {
|
|
90
|
-
identity
|
|
91
|
-
} = useAuthentication();
|
|
92
|
-
const parentRules = useParentRules();
|
|
93
|
-
|
|
94
|
-
// Count visible string cells for column span calculation.
|
|
95
|
-
// This count is approximate based on access control rules only (not entry value rules),
|
|
96
|
-
// because entry value rules require per-field hooks and we can't call them in a filter.
|
|
97
|
-
// The actual visibility is enforced in FieldCell.
|
|
98
|
-
const visibleStringCells = row.filter(c => {
|
|
99
|
-
if (typeof c !== "string") {
|
|
100
|
-
return false;
|
|
101
|
-
}
|
|
102
|
-
const f = getFieldById(fields, c);
|
|
103
|
-
if (!f) {
|
|
104
|
-
return true;
|
|
105
|
-
}
|
|
106
|
-
const acPerms = evaluateAccessControlRules(f, identity);
|
|
107
|
-
return parentRules.canView && acPerms.canView;
|
|
108
|
-
});
|
|
109
|
-
const span = visibleStringCells.length > 0 ? Math.floor(12 / visibleStringCells.length) : 12;
|
|
110
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, row.map(cell => {
|
|
111
|
-
if (isLayoutField(cell)) {
|
|
112
|
-
return /*#__PURE__*/React.createElement(LayoutCell, {
|
|
113
|
-
key: cell.id,
|
|
114
|
-
cell: cell,
|
|
10
|
+
const getFieldById = (fields, id)=>fields.find((field)=>field.id === id) || null;
|
|
11
|
+
const LayoutNotDefined = ()=>/*#__PURE__*/ react.createElement(Alert, {
|
|
12
|
+
type: "warning"
|
|
13
|
+
}, "You are missing the layout definition in your code content model. Please ensure you have the layout property correctly defined.");
|
|
14
|
+
const LayoutCell = ({ cell, Bind, fields, contentModel, gridClassName })=>{
|
|
15
|
+
const isLayout = isLayoutField(cell);
|
|
16
|
+
const rules = useFieldEffectiveRules(isLayout ? cell : {});
|
|
17
|
+
if (!isLayout) return null;
|
|
18
|
+
if (!rules.canView || rules.hidden) return null;
|
|
19
|
+
return /*#__PURE__*/ react.createElement(FieldRulesProvider, {
|
|
20
|
+
rules: rules
|
|
21
|
+
}, /*#__PURE__*/ react.createElement(LayoutDescriptorCell, {
|
|
22
|
+
field: cell,
|
|
115
23
|
Bind: Bind,
|
|
116
24
|
fields: fields,
|
|
117
25
|
contentModel: contentModel,
|
|
118
26
|
gridClassName: gridClassName
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
const
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
27
|
+
}));
|
|
28
|
+
};
|
|
29
|
+
const FieldCell = ({ id, field, span, Bind, contentModel })=>{
|
|
30
|
+
const rules = useFieldEffectiveRules(field ?? {});
|
|
31
|
+
if (!rules.canView || rules.hidden) return null;
|
|
32
|
+
return /*#__PURE__*/ react.createElement(Grid.Column, {
|
|
33
|
+
span: span
|
|
34
|
+
}, field ? /*#__PURE__*/ react.createElement(FieldRulesProvider, {
|
|
35
|
+
rules: rules
|
|
36
|
+
}, /*#__PURE__*/ react.createElement(FieldElement, {
|
|
37
|
+
field: field,
|
|
38
|
+
Bind: Bind,
|
|
39
|
+
contentModel: contentModel
|
|
40
|
+
})) : /*#__PURE__*/ react.createElement(FieldElementError, {
|
|
41
|
+
title: `Missing field with id "${id}"!`,
|
|
42
|
+
description: "Make sure field layout contains the correct field ids (hint: check for typos)."
|
|
43
|
+
}));
|
|
44
|
+
};
|
|
45
|
+
const RowRenderer = ({ row, fields, Bind, contentModel, gridClassName })=>{
|
|
46
|
+
const { identity } = useAuthentication();
|
|
47
|
+
const parentRules = useParentRules();
|
|
48
|
+
const visibleStringCells = row.filter((c)=>{
|
|
49
|
+
if ("string" != typeof c) return false;
|
|
50
|
+
const f = getFieldById(fields, c);
|
|
51
|
+
if (!f) return true;
|
|
52
|
+
const acPerms = evaluateAccessControlRules(f, identity);
|
|
53
|
+
return parentRules.canView && acPerms.canView;
|
|
130
54
|
});
|
|
131
|
-
|
|
55
|
+
const span = visibleStringCells.length > 0 ? Math.floor(12 / visibleStringCells.length) : 12;
|
|
56
|
+
return /*#__PURE__*/ react.createElement(react.Fragment, null, row.map((cell)=>{
|
|
57
|
+
if (isLayoutField(cell)) return /*#__PURE__*/ react.createElement(LayoutCell, {
|
|
58
|
+
key: cell.id,
|
|
59
|
+
cell: cell,
|
|
60
|
+
Bind: Bind,
|
|
61
|
+
fields: fields,
|
|
62
|
+
contentModel: contentModel,
|
|
63
|
+
gridClassName: gridClassName
|
|
64
|
+
});
|
|
65
|
+
const id = cell;
|
|
66
|
+
const field = getFieldById(fields, id);
|
|
67
|
+
return /*#__PURE__*/ react.createElement(FieldCell, {
|
|
68
|
+
key: id,
|
|
69
|
+
id: id,
|
|
70
|
+
field: field,
|
|
71
|
+
span: span,
|
|
72
|
+
Bind: Bind,
|
|
73
|
+
contentModel: contentModel
|
|
74
|
+
});
|
|
75
|
+
}));
|
|
132
76
|
};
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
}
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
key: rowIndex
|
|
147
|
-
}, /*#__PURE__*/React.createElement(RowRenderer, {
|
|
148
|
-
row: row,
|
|
149
|
-
fields: fields,
|
|
150
|
-
Bind: Bind,
|
|
151
|
-
contentModel: contentModel,
|
|
152
|
-
gridClassName: gridClassName
|
|
153
|
-
}))));
|
|
77
|
+
const Fields = ({ Bind, fields, layout, contentModel, gridClassName })=>{
|
|
78
|
+
if (contentModel.plugin && fields.length > 0 && 0 === layout.length) return /*#__PURE__*/ react.createElement(LayoutNotDefined, null);
|
|
79
|
+
return /*#__PURE__*/ react.createElement(Grid, {
|
|
80
|
+
className: gridClassName
|
|
81
|
+
}, layout.map((row, rowIndex)=>/*#__PURE__*/ react.createElement(react.Fragment, {
|
|
82
|
+
key: rowIndex
|
|
83
|
+
}, /*#__PURE__*/ react.createElement(RowRenderer, {
|
|
84
|
+
row: row,
|
|
85
|
+
fields: fields,
|
|
86
|
+
Bind: Bind,
|
|
87
|
+
contentModel: contentModel,
|
|
88
|
+
gridClassName: gridClassName
|
|
89
|
+
}))));
|
|
154
90
|
};
|
|
91
|
+
export { Fields };
|
|
155
92
|
|
|
156
93
|
//# sourceMappingURL=Fields.js.map
|
package/Fields/Fields.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","Alert","Grid","FieldElement","FieldElementError","isLayoutField","LayoutDescriptorCell","useAuthentication","FieldRulesProvider","useParentRules","evaluateAccessControlRules","useFieldEffectiveRules","getFieldById","fields","id","find","field","LayoutNotDefined","createElement","type","LayoutCell","cell","Bind","contentModel","gridClassName","isLayout","rules","canView","hidden","FieldCell","span","Column","title","description","RowRenderer","row","identity","parentRules","visibleStringCells","filter","c","f","acPerms","length","Math","floor","Fragment","map","key","Fields","layout","plugin","className","rowIndex"],"sources":["Fields.tsx"],"sourcesContent":["import React from \"react\";\nimport { Alert, type ColumnProps, Grid } from \"@webiny/admin-ui\";\nimport { FieldElement } from \"./FieldElement.js\";\nimport { FieldElementError } from \"./FieldElementError.js\";\nimport type {\n BindComponent,\n CmsEditorContentModel,\n CmsEditorFieldsLayout,\n CmsModelField\n} from \"~/types/index.js\";\nimport type { CmsEditorLayoutCell } from \"~/types/model.js\";\nimport { isLayoutField } from \"~/types/model.js\";\nimport { LayoutDescriptorCell } from \"./LayoutDescriptorCell.js\";\nimport { useAuthentication } from \"@webiny/app-admin\";\nimport { FieldRulesProvider, useParentRules } from \"./FieldRulesProvider.js\";\nimport { evaluateAccessControlRules, useFieldEffectiveRules } from \"./useFieldRules.js\";\n\ninterface FieldsProps {\n Bind: BindComponent;\n contentModel: CmsEditorContentModel;\n fields: CmsModelField[];\n layout: CmsEditorFieldsLayout;\n gridClassName?: string;\n}\n\nconst getFieldById = (fields: CmsModelField[], id: string): CmsModelField | null => {\n return fields.find(field => field.id === id) || null;\n};\n\nconst LayoutNotDefined = () => {\n return (\n <Alert type={\"warning\"}>\n You are missing the layout definition in your code content model. Please ensure you have\n the layout property correctly defined.\n </Alert>\n );\n};\n\n/**\n * Renders a single layout descriptor cell with rules + permissions.\n */\ninterface LayoutCellProps {\n cell: CmsEditorLayoutCell;\n Bind: BindComponent;\n fields: CmsModelField[];\n contentModel: CmsEditorContentModel;\n gridClassName?: string;\n}\n\nconst LayoutCell = ({ cell, Bind, fields, contentModel, gridClassName }: LayoutCellProps) => {\n const isLayout = isLayoutField(cell);\n const rules = useFieldEffectiveRules(isLayout ? cell : {});\n\n if (!isLayout) {\n return null;\n }\n\n if (!rules.canView || rules.hidden) {\n return null;\n }\n\n return (\n <FieldRulesProvider rules={rules}>\n <LayoutDescriptorCell\n field={cell}\n Bind={Bind}\n fields={fields}\n contentModel={contentModel}\n gridClassName={gridClassName}\n />\n </FieldRulesProvider>\n );\n};\n\n/**\n * Renders a single data field cell with rules + permissions.\n */\ninterface FieldCellProps {\n id: string;\n field: CmsModelField | null;\n span: ColumnProps[\"span\"];\n Bind: BindComponent;\n contentModel: CmsEditorContentModel;\n}\n\nconst FieldCell = ({ id, field, span, Bind, contentModel }: FieldCellProps) => {\n const rules = useFieldEffectiveRules(field ?? {});\n\n if (!rules.canView || rules.hidden) {\n return null;\n }\n\n return (\n <Grid.Column span={span}>\n {field ? (\n <FieldRulesProvider rules={rules}>\n <FieldElement field={field} Bind={Bind} contentModel={contentModel} />\n </FieldRulesProvider>\n ) : (\n <FieldElementError\n title={`Missing field with id \"${id}\"!`}\n description={\n \"Make sure field layout contains the correct field ids (hint: check for typos).\"\n }\n />\n )}\n </Grid.Column>\n );\n};\n\n/**\n * Renders a single row, delegating each cell to FieldCell or LayoutCell.\n */\ninterface RowRendererProps {\n row: CmsEditorLayoutCell[];\n fields: CmsModelField[];\n Bind: BindComponent;\n contentModel: CmsEditorContentModel;\n gridClassName?: string;\n}\n\nconst RowRenderer = ({ row, fields, Bind, contentModel, gridClassName }: RowRendererProps) => {\n const { identity } = useAuthentication();\n const parentRules = useParentRules();\n\n // Count visible string cells for column span calculation.\n // This count is approximate based on access control rules only (not entry value rules),\n // because entry value rules require per-field hooks and we can't call them in a filter.\n // The actual visibility is enforced in FieldCell.\n const visibleStringCells = row.filter(c => {\n if (typeof c !== \"string\") {\n return false;\n }\n const f = getFieldById(fields, c);\n if (!f) {\n return true;\n }\n const acPerms = evaluateAccessControlRules(f, identity);\n return parentRules.canView && acPerms.canView;\n });\n\n const span =\n visibleStringCells.length > 0\n ? (Math.floor(12 / visibleStringCells.length) as ColumnProps[\"span\"])\n : (12 as ColumnProps[\"span\"]);\n\n return (\n <>\n {row.map(cell => {\n if (isLayoutField(cell)) {\n return (\n <LayoutCell\n key={cell.id}\n cell={cell}\n Bind={Bind}\n fields={fields}\n contentModel={contentModel}\n gridClassName={gridClassName}\n />\n );\n }\n\n const id = cell as string;\n const field = getFieldById(fields, id);\n\n return (\n <FieldCell\n key={id}\n id={id}\n field={field}\n span={span}\n Bind={Bind}\n contentModel={contentModel}\n />\n );\n })}\n </>\n );\n};\n\nexport const Fields = ({ Bind, fields, layout, contentModel, gridClassName }: FieldsProps) => {\n if (contentModel.plugin && fields.length > 0 && layout.length === 0) {\n return <LayoutNotDefined />;\n }\n\n return (\n <Grid className={gridClassName}>\n {layout.map((row, rowIndex) => (\n <React.Fragment key={rowIndex}>\n <RowRenderer\n row={row}\n fields={fields}\n Bind={Bind}\n contentModel={contentModel}\n gridClassName={gridClassName}\n />\n </React.Fragment>\n ))}\n </Grid>\n );\n};\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"Fields/Fields.js","sources":["../../src/Fields/Fields.tsx"],"sourcesContent":["import React from \"react\";\nimport { Alert, type ColumnProps, Grid } from \"@webiny/admin-ui\";\nimport { FieldElement } from \"./FieldElement.js\";\nimport { FieldElementError } from \"./FieldElementError.js\";\nimport type {\n BindComponent,\n CmsEditorContentModel,\n CmsEditorFieldsLayout,\n CmsModelField\n} from \"~/types/index.js\";\nimport type { CmsEditorLayoutCell } from \"~/types/model.js\";\nimport { isLayoutField } from \"~/types/model.js\";\nimport { LayoutDescriptorCell } from \"./LayoutDescriptorCell.js\";\nimport { useAuthentication } from \"@webiny/app-admin\";\nimport { FieldRulesProvider, useParentRules } from \"./FieldRulesProvider.js\";\nimport { evaluateAccessControlRules, useFieldEffectiveRules } from \"./useFieldRules.js\";\n\ninterface FieldsProps {\n Bind: BindComponent;\n contentModel: CmsEditorContentModel;\n fields: CmsModelField[];\n layout: CmsEditorFieldsLayout;\n gridClassName?: string;\n}\n\nconst getFieldById = (fields: CmsModelField[], id: string): CmsModelField | null => {\n return fields.find(field => field.id === id) || null;\n};\n\nconst LayoutNotDefined = () => {\n return (\n <Alert type={\"warning\"}>\n You are missing the layout definition in your code content model. Please ensure you have\n the layout property correctly defined.\n </Alert>\n );\n};\n\n/**\n * Renders a single layout descriptor cell with rules + permissions.\n */\ninterface LayoutCellProps {\n cell: CmsEditorLayoutCell;\n Bind: BindComponent;\n fields: CmsModelField[];\n contentModel: CmsEditorContentModel;\n gridClassName?: string;\n}\n\nconst LayoutCell = ({ cell, Bind, fields, contentModel, gridClassName }: LayoutCellProps) => {\n const isLayout = isLayoutField(cell);\n const rules = useFieldEffectiveRules(isLayout ? cell : {});\n\n if (!isLayout) {\n return null;\n }\n\n if (!rules.canView || rules.hidden) {\n return null;\n }\n\n return (\n <FieldRulesProvider rules={rules}>\n <LayoutDescriptorCell\n field={cell}\n Bind={Bind}\n fields={fields}\n contentModel={contentModel}\n gridClassName={gridClassName}\n />\n </FieldRulesProvider>\n );\n};\n\n/**\n * Renders a single data field cell with rules + permissions.\n */\ninterface FieldCellProps {\n id: string;\n field: CmsModelField | null;\n span: ColumnProps[\"span\"];\n Bind: BindComponent;\n contentModel: CmsEditorContentModel;\n}\n\nconst FieldCell = ({ id, field, span, Bind, contentModel }: FieldCellProps) => {\n const rules = useFieldEffectiveRules(field ?? {});\n\n if (!rules.canView || rules.hidden) {\n return null;\n }\n\n return (\n <Grid.Column span={span}>\n {field ? (\n <FieldRulesProvider rules={rules}>\n <FieldElement field={field} Bind={Bind} contentModel={contentModel} />\n </FieldRulesProvider>\n ) : (\n <FieldElementError\n title={`Missing field with id \"${id}\"!`}\n description={\n \"Make sure field layout contains the correct field ids (hint: check for typos).\"\n }\n />\n )}\n </Grid.Column>\n );\n};\n\n/**\n * Renders a single row, delegating each cell to FieldCell or LayoutCell.\n */\ninterface RowRendererProps {\n row: CmsEditorLayoutCell[];\n fields: CmsModelField[];\n Bind: BindComponent;\n contentModel: CmsEditorContentModel;\n gridClassName?: string;\n}\n\nconst RowRenderer = ({ row, fields, Bind, contentModel, gridClassName }: RowRendererProps) => {\n const { identity } = useAuthentication();\n const parentRules = useParentRules();\n\n // Count visible string cells for column span calculation.\n // This count is approximate based on access control rules only (not entry value rules),\n // because entry value rules require per-field hooks and we can't call them in a filter.\n // The actual visibility is enforced in FieldCell.\n const visibleStringCells = row.filter(c => {\n if (typeof c !== \"string\") {\n return false;\n }\n const f = getFieldById(fields, c);\n if (!f) {\n return true;\n }\n const acPerms = evaluateAccessControlRules(f, identity);\n return parentRules.canView && acPerms.canView;\n });\n\n const span =\n visibleStringCells.length > 0\n ? (Math.floor(12 / visibleStringCells.length) as ColumnProps[\"span\"])\n : (12 as ColumnProps[\"span\"]);\n\n return (\n <>\n {row.map(cell => {\n if (isLayoutField(cell)) {\n return (\n <LayoutCell\n key={cell.id}\n cell={cell}\n Bind={Bind}\n fields={fields}\n contentModel={contentModel}\n gridClassName={gridClassName}\n />\n );\n }\n\n const id = cell as string;\n const field = getFieldById(fields, id);\n\n return (\n <FieldCell\n key={id}\n id={id}\n field={field}\n span={span}\n Bind={Bind}\n contentModel={contentModel}\n />\n );\n })}\n </>\n );\n};\n\nexport const Fields = ({ Bind, fields, layout, contentModel, gridClassName }: FieldsProps) => {\n if (contentModel.plugin && fields.length > 0 && layout.length === 0) {\n return <LayoutNotDefined />;\n }\n\n return (\n <Grid className={gridClassName}>\n {layout.map((row, rowIndex) => (\n <React.Fragment key={rowIndex}>\n <RowRenderer\n row={row}\n fields={fields}\n Bind={Bind}\n contentModel={contentModel}\n gridClassName={gridClassName}\n />\n </React.Fragment>\n ))}\n </Grid>\n );\n};\n"],"names":["getFieldById","fields","id","field","LayoutNotDefined","Alert","LayoutCell","cell","Bind","contentModel","gridClassName","isLayout","isLayoutField","rules","useFieldEffectiveRules","FieldRulesProvider","LayoutDescriptorCell","FieldCell","span","Grid","FieldElement","FieldElementError","RowRenderer","row","identity","useAuthentication","parentRules","useParentRules","visibleStringCells","c","f","acPerms","evaluateAccessControlRules","Math","Fields","layout","rowIndex","React"],"mappings":"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"}
|