@webiny/app-headless-cms-common 6.4.8 → 6.4.9
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/Fields.js +6 -2
- package/Fields/Fields.js.map +1 -1
- package/Fields/useBind.d.ts +3 -1
- package/Fields/useBind.js +1 -1
- package/Fields/useBind.js.map +1 -1
- package/package.json +9 -9
package/Fields/Fields.js
CHANGED
|
@@ -7,6 +7,7 @@ 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
|
+
import { BindParentNameContext } from "./useBind.js";
|
|
10
11
|
const getFieldById = (fields, id)=>fields.find((field)=>field.id === id) || null;
|
|
11
12
|
const LayoutNotDefined = ()=>/*#__PURE__*/ react.createElement(Alert, {
|
|
12
13
|
type: "warning"
|
|
@@ -76,7 +77,10 @@ const RowRenderer = ({ row, fields, Bind, contentModel, gridClassName })=>{
|
|
|
76
77
|
};
|
|
77
78
|
const Fields = ({ Bind, fields, layout, contentModel, gridClassName })=>{
|
|
78
79
|
if (contentModel.plugin && fields.length > 0 && 0 === layout.length) return /*#__PURE__*/ react.createElement(LayoutNotDefined, null);
|
|
79
|
-
|
|
80
|
+
const parentName = Bind.parentName || "";
|
|
81
|
+
return /*#__PURE__*/ react.createElement(BindParentNameContext.Provider, {
|
|
82
|
+
value: parentName
|
|
83
|
+
}, /*#__PURE__*/ react.createElement(Grid, {
|
|
80
84
|
className: gridClassName
|
|
81
85
|
}, layout.map((row, rowIndex)=>/*#__PURE__*/ react.createElement(react.Fragment, {
|
|
82
86
|
key: rowIndex
|
|
@@ -86,7 +90,7 @@ const Fields = ({ Bind, fields, layout, contentModel, gridClassName })=>{
|
|
|
86
90
|
Bind: Bind,
|
|
87
91
|
contentModel: contentModel,
|
|
88
92
|
gridClassName: gridClassName
|
|
89
|
-
}))));
|
|
93
|
+
})))));
|
|
90
94
|
};
|
|
91
95
|
export { Fields };
|
|
92
96
|
|
package/Fields/Fields.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
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
|
|
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\";\nimport { BindParentNameContext } from \"./useBind.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 const parentName = Bind.parentName || \"\";\n\n return (\n <BindParentNameContext.Provider value={parentName}>\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 </BindParentNameContext.Provider>\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","parentName","BindParentNameContext","rowIndex","React"],"mappings":"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"}
|
package/Fields/useBind.d.ts
CHANGED
|
@@ -1,5 +1,8 @@
|
|
|
1
|
+
import React from "react";
|
|
1
2
|
import type { BindComponent } from "../types/index.js";
|
|
3
|
+
declare const BindParentNameContext: React.Context<string>;
|
|
2
4
|
export declare const useBindParentName: () => string;
|
|
5
|
+
export { BindParentNameContext };
|
|
3
6
|
interface UseBindProps {
|
|
4
7
|
Bind: BindComponent;
|
|
5
8
|
}
|
|
@@ -7,4 +10,3 @@ export interface GetBindCallable {
|
|
|
7
10
|
(index?: number): BindComponent;
|
|
8
11
|
}
|
|
9
12
|
export declare function useBind({ Bind }: UseBindProps): (index?: number) => BindComponent;
|
|
10
|
-
export {};
|
package/Fields/useBind.js
CHANGED
package/Fields/useBind.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Fields/useBind.js","sources":["../../src/Fields/useBind.tsx"],"sourcesContent":["import React, { createContext, useContext, useRef, cloneElement } from \"react\";\nimport type { Validator } from \"@webiny/validation/types.js\";\nimport { useForm } from \"@webiny/form\";\nimport { createValidators } from \"~/createValidators.js\";\nimport type { BindComponent, CmsModelField } from \"~/types/index.js\";\nimport { useModelField } from \"~/ModelFieldProvider/index.js\";\nimport { createValidationContainer } from \"~/createValidationContainer.js\";\n\nconst BindParentNameContext = createContext<string>(\"\");\n\nexport const useBindParentName = (): string => useContext(BindParentNameContext);\n\ninterface UseBindProps {\n Bind: BindComponent;\n}\n\ninterface UseBindParams {\n name?: string;\n validators?: Validator | Validator[];\n children?: any;\n defaultValue?: any;\n}\n\nconst createFieldCacheKey = (field: CmsModelField) => {\n return [\n field.id,\n field.fieldId,\n JSON.stringify(field.validation),\n JSON.stringify(field.listValidation)\n ].join(\";\");\n};\n\nexport interface GetBindCallable {\n (index?: number): BindComponent;\n}\n\nconst emptyValidators: Validator[] = [];\n\nexport function useBind({ Bind }: UseBindProps) {\n const { field } = useModelField();\n const memoizedBindComponents = useRef<Record<string, BindComponent>>({});\n const cacheKey = createFieldCacheKey(field);\n const form = useForm();\n\n return (index = -1) => {\n const { parentName } = Bind;\n\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 const componentId = `${name};${cacheKey}`;\n\n if (memoizedBindComponents.current[componentId]) {\n return memoizedBindComponents.current[componentId];\n }\n\n const validators = createValidators(field, field.validation || emptyValidators);\n const listValidators = createValidators(field, field.listValidation || emptyValidators);\n const isMultipleValues = index === -1 && field.list;\n const inputValidators = isMultipleValues ? listValidators : validators;\n\n // We only use default values for single-value fields.\n const defaultValueFromSettings = !isMultipleValues ? field.settings?.defaultValue : null;\n\n memoizedBindComponents.current[componentId] = function UseBind(params: UseBindParams) {\n const {\n name: childName,\n validators: childValidators,\n children,\n defaultValue = defaultValueFromSettings\n } = params;\n\n const { field } = useModelField();\n\n return (\n <BindParentNameContext.Provider value={name}>\n <Bind\n name={childName || name}\n validators={childValidators || inputValidators}\n defaultValue={defaultValue ?? null}\n context={{ field }}\n >\n {bind => {\n // Multiple-values functions below.\n const props = { ...bind };\n if (field.list && index === -1) {\n props.appendValue = (newValue: any, index?: number) => {\n const currentValue = bind.value || [];\n const newIndex = index ?? currentValue.length;\n\n bind.onChange([\n ...currentValue.slice(0, newIndex),\n newValue,\n ...currentValue.slice(newIndex)\n ]);\n };\n props.prependValue = (newValue: any) => {\n bind.onChange([newValue, ...(bind.value || [])]);\n };\n props.appendValues = (newValues: any[]) => {\n bind.onChange([...(bind.value || []), ...newValues]);\n };\n\n props.removeValue = (index: number) => {\n if (index < 0) {\n return;\n }\n\n const value = [\n ...bind.value.slice(0, index),\n ...bind.value.slice(index + 1)\n ];\n\n bind.onChange(value.length === 0 ? null : value);\n\n // To make sure the field is still valid, we must trigger validation.\n 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 return typeof children === \"function\"\n ? children(props)\n : cloneElement(children, props);\n }}\n </Bind>\n </BindParentNameContext.Provider>\n );\n } as BindComponent;\n\n // We need to keep track of current field name, to support nested fields.\n memoizedBindComponents.current[componentId].parentName = name;\n memoizedBindComponents.current[componentId].displayName = `Bind<${name}>`;\n memoizedBindComponents.current[componentId].ValidationContainer =\n createValidationContainer(name);\n\n return memoizedBindComponents.current[componentId];\n };\n}\n"],"names":["BindParentNameContext","createContext","useBindParentName","useContext","createFieldCacheKey","field","JSON","emptyValidators","useBind","Bind","useModelField","memoizedBindComponents","useRef","cacheKey","form","useForm","index","parentName","name","undefined","v","componentId","validators","createValidators","listValidators","isMultipleValues","inputValidators","defaultValueFromSettings","params","childName","childValidators","children","defaultValue","bind","props","newValue","currentValue","newIndex","newValues","value","cloneElement","createValidationContainer"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Fields/useBind.js","sources":["../../src/Fields/useBind.tsx"],"sourcesContent":["import React, { createContext, useContext, useRef, cloneElement } from \"react\";\nimport type { Validator } from \"@webiny/validation/types.js\";\nimport { useForm } from \"@webiny/form\";\nimport { createValidators } from \"~/createValidators.js\";\nimport type { BindComponent, CmsModelField } from \"~/types/index.js\";\nimport { useModelField } from \"~/ModelFieldProvider/index.js\";\nimport { createValidationContainer } from \"~/createValidationContainer.js\";\n\nconst BindParentNameContext = createContext<string>(\"\");\n\nexport const useBindParentName = (): string => useContext(BindParentNameContext);\nexport { BindParentNameContext };\n\ninterface UseBindProps {\n Bind: BindComponent;\n}\n\ninterface UseBindParams {\n name?: string;\n validators?: Validator | Validator[];\n children?: any;\n defaultValue?: any;\n}\n\nconst createFieldCacheKey = (field: CmsModelField) => {\n return [\n field.id,\n field.fieldId,\n JSON.stringify(field.validation),\n JSON.stringify(field.listValidation)\n ].join(\";\");\n};\n\nexport interface GetBindCallable {\n (index?: number): BindComponent;\n}\n\nconst emptyValidators: Validator[] = [];\n\nexport function useBind({ Bind }: UseBindProps) {\n const { field } = useModelField();\n const memoizedBindComponents = useRef<Record<string, BindComponent>>({});\n const cacheKey = createFieldCacheKey(field);\n const form = useForm();\n\n return (index = -1) => {\n const { parentName } = Bind;\n\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 const componentId = `${name};${cacheKey}`;\n\n if (memoizedBindComponents.current[componentId]) {\n return memoizedBindComponents.current[componentId];\n }\n\n const validators = createValidators(field, field.validation || emptyValidators);\n const listValidators = createValidators(field, field.listValidation || emptyValidators);\n const isMultipleValues = index === -1 && field.list;\n const inputValidators = isMultipleValues ? listValidators : validators;\n\n // We only use default values for single-value fields.\n const defaultValueFromSettings = !isMultipleValues ? field.settings?.defaultValue : null;\n\n memoizedBindComponents.current[componentId] = function UseBind(params: UseBindParams) {\n const {\n name: childName,\n validators: childValidators,\n children,\n defaultValue = defaultValueFromSettings\n } = params;\n\n const { field } = useModelField();\n\n return (\n <BindParentNameContext.Provider value={name}>\n <Bind\n name={childName || name}\n validators={childValidators || inputValidators}\n defaultValue={defaultValue ?? null}\n context={{ field }}\n >\n {bind => {\n // Multiple-values functions below.\n const props = { ...bind };\n if (field.list && index === -1) {\n props.appendValue = (newValue: any, index?: number) => {\n const currentValue = bind.value || [];\n const newIndex = index ?? currentValue.length;\n\n bind.onChange([\n ...currentValue.slice(0, newIndex),\n newValue,\n ...currentValue.slice(newIndex)\n ]);\n };\n props.prependValue = (newValue: any) => {\n bind.onChange([newValue, ...(bind.value || [])]);\n };\n props.appendValues = (newValues: any[]) => {\n bind.onChange([...(bind.value || []), ...newValues]);\n };\n\n props.removeValue = (index: number) => {\n if (index < 0) {\n return;\n }\n\n const value = [\n ...bind.value.slice(0, index),\n ...bind.value.slice(index + 1)\n ];\n\n bind.onChange(value.length === 0 ? null : value);\n\n // To make sure the field is still valid, we must trigger validation.\n 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 return typeof children === \"function\"\n ? children(props)\n : cloneElement(children, props);\n }}\n </Bind>\n </BindParentNameContext.Provider>\n );\n } as BindComponent;\n\n // We need to keep track of current field name, to support nested fields.\n memoizedBindComponents.current[componentId].parentName = name;\n memoizedBindComponents.current[componentId].displayName = `Bind<${name}>`;\n memoizedBindComponents.current[componentId].ValidationContainer =\n createValidationContainer(name);\n\n return memoizedBindComponents.current[componentId];\n };\n}\n"],"names":["BindParentNameContext","createContext","useBindParentName","useContext","createFieldCacheKey","field","JSON","emptyValidators","useBind","Bind","useModelField","memoizedBindComponents","useRef","cacheKey","form","useForm","index","parentName","name","undefined","v","componentId","validators","createValidators","listValidators","isMultipleValues","inputValidators","defaultValueFromSettings","params","childName","childValidators","children","defaultValue","bind","props","newValue","currentValue","newIndex","newValues","value","cloneElement","createValidationContainer"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@webiny/app-headless-cms-common",
|
|
3
|
-
"version": "6.4.
|
|
3
|
+
"version": "6.4.9",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"exports": {
|
|
6
6
|
".": "./index.js",
|
|
@@ -21,13 +21,13 @@
|
|
|
21
21
|
"@emotion/styled": "11.14.1",
|
|
22
22
|
"@fortawesome/fontawesome-svg-core": "7.3.0",
|
|
23
23
|
"@fortawesome/react-fontawesome": "3.4.0",
|
|
24
|
-
"@webiny/admin-ui": "6.4.
|
|
25
|
-
"@webiny/app": "6.4.
|
|
26
|
-
"@webiny/app-admin": "6.4.
|
|
27
|
-
"@webiny/form": "6.4.
|
|
28
|
-
"@webiny/plugins": "6.4.
|
|
29
|
-
"@webiny/react-composition": "6.4.
|
|
30
|
-
"@webiny/validation": "6.4.
|
|
24
|
+
"@webiny/admin-ui": "6.4.9",
|
|
25
|
+
"@webiny/app": "6.4.9",
|
|
26
|
+
"@webiny/app-admin": "6.4.9",
|
|
27
|
+
"@webiny/form": "6.4.9",
|
|
28
|
+
"@webiny/plugins": "6.4.9",
|
|
29
|
+
"@webiny/react-composition": "6.4.9",
|
|
30
|
+
"@webiny/validation": "6.4.9",
|
|
31
31
|
"dnd-core": "16.0.1",
|
|
32
32
|
"graphql": "16.14.2",
|
|
33
33
|
"graphql-tag": "2.12.7",
|
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
},
|
|
37
37
|
"devDependencies": {
|
|
38
38
|
"@types/react": "18.3.31",
|
|
39
|
-
"@webiny/build-tools": "6.4.
|
|
39
|
+
"@webiny/build-tools": "6.4.9",
|
|
40
40
|
"rimraf": "6.1.3",
|
|
41
41
|
"typescript": "6.0.3"
|
|
42
42
|
},
|