@webiny/app-admin 6.5.0-beta.9 → 6.5.1-beta.0

package/base/Base/DefaultFieldRenderers.js

@@ -17,6 +17,7 @@ import { RadioButtonsRenderer } from "./FieldRenderers/RadioButtonsRenderer.js";
 import { CheckboxesRenderer } from "./FieldRenderers/CheckboxesRenderer.js";
 import { DateTimeRenderer } from "./FieldRenderers/DateTimeRenderer.js";
 import { DateTimeInputsRenderer } from "./FieldRenderers/DateTimeInputsRenderer.js";
+import { BirthdayInputRenderer } from "./FieldRenderers/BirthdayInputRenderer.js";
 import { HiddenRenderer } from "./FieldRenderers/HiddenRenderer.js";
 import { KeyValueTagsRenderer } from "./FieldRenderers/ObjectRenderer/KeyValueTagsRenderer.js";
 import { FilePickerRenderer } from "./FieldRenderers/FilePickerRenderer.js";
@@ -96,6 +97,9 @@ const DefaultFieldRenderers = ()=>/*#__PURE__*/ react.createElement(react.Fragme
     }), /*#__PURE__*/ react.createElement(AdminConfig.Form.FieldRenderer, {
         name: "dateTimeInputs",
         component: DateTimeInputsRenderer
+    }), /*#__PURE__*/ react.createElement(AdminConfig.Form.FieldRenderer, {
+        name: "birthdayInput",
+        component: BirthdayInputRenderer
     }), /*#__PURE__*/ react.createElement(AdminConfig.Form.FieldRenderer, {
         name: "hidden",
         component: HiddenRenderer

package/base/Base/DefaultFieldRenderers.js.map

@@ -1 +1 @@
-{"version":3,"file":"base/Base/DefaultFieldRenderers.js","sources":["../../../src/base/Base/DefaultFieldRenderers.tsx"],"sourcesContent":["import React from \"react\";\nimport { AdminConfig } from \"~/config/AdminConfig.js\";\nimport { InputRenderer } from \"~/base/Base/FieldRenderers/InputRenderer.js\";\nimport { SelectRenderer } from \"~/base/Base/FieldRenderers/SelectRenderer.js\";\nimport { ObjectRenderer } from \"~/base/Base/FieldRenderers/ObjectRenderer/ObjectRenderer.js\";\nimport { ObjectAccordionMultipleRenderer } from \"~/base/Base/FieldRenderers/ObjectRenderer/ObjectAccordionMultipleRenderer.js\";\nimport { DynamicZoneRenderer } from \"~/base/Base/FieldRenderers/ObjectRenderer/DynamicZoneRenderer.js\";\nimport { PassthroughRenderer } from \"~/base/Base/FieldRenderers/PassthroughRenderer.js\";\nimport { TextareaRenderer } from \"~/base/Base/FieldRenderers/TextareaRenderer.js\";\nimport { SwitchRenderer } from \"~/base/Base/FieldRenderers/SwitchRenderer.js\";\nimport { NumberInputRenderer } from \"~/base/Base/FieldRenderers/NumberInputRenderer.js\";\nimport { NumberInputsRenderer } from \"~/base/Base/FieldRenderers/NumberInputsRenderer.js\";\nimport { TextInputsRenderer } from \"~/base/Base/FieldRenderers/TextInputsRenderer.js\";\nimport { TextareasRenderer } from \"~/base/Base/FieldRenderers/TextareasRenderer.js\";\nimport { TagsRenderer } from \"~/base/Base/FieldRenderers/TagsRenderer.js\";\nimport { RadioButtonsRenderer } from \"~/base/Base/FieldRenderers/RadioButtonsRenderer.js\";\nimport { CheckboxesRenderer } from \"~/base/Base/FieldRenderers/CheckboxesRenderer.js\";\nimport { DateTimeRenderer } from \"~/base/Base/FieldRenderers/DateTimeRenderer.js\";\nimport { DateTimeInputsRenderer } from \"~/base/Base/FieldRenderers/DateTimeInputsRenderer.js\";\nimport { HiddenRenderer } from \"~/base/Base/FieldRenderers/HiddenRenderer.js\";\nimport { KeyValueTagsRenderer } from \"~/base/Base/FieldRenderers/ObjectRenderer/KeyValueTagsRenderer.js\";\nimport { FilePickerRenderer } from \"~/base/Base/FieldRenderers/FilePickerRenderer.js\";\nimport { FileUrlPickerRenderer } from \"~/base/Base/FieldRenderers/FileUrlPickerRenderer.js\";\nimport { MultiFilePickerRenderer } from \"~/base/Base/FieldRenderers/MultiFilePickerRenderer.js\";\nimport { CodeEditorRenderer } from \"~/base/Base/FieldRenderers/CodeEditorRenderer.js\";\nimport { LexicalRenderer } from \"~/base/Base/FieldRenderers/LexicalRenderer.js\";\nimport { LexicalEditorsRenderer } from \"~/base/Base/FieldRenderers/LexicalEditorsRenderer.js\";\nimport { PasswordInputRenderer } from \"~/base/Base/FieldRenderers/PasswordInputRenderer.js\";\nimport { PermissionsRenderer } from \"~/base/Base/FieldRenderers/PermissionsRenderer.js\";\nimport { RolesMultiSelectRenderer } from \"~/base/Base/FieldRenderers/RolesMultiSelectRenderer.js\";\nimport { ApiKeyTokenRenderer } from \"~/base/Base/FieldRenderers/ApiKeyTokenRenderer.js\";\nimport { MultiAutoCompleteRenderer } from \"~/base/Base/FieldRenderers/MultiAutoCompleteRenderer.js\";\nimport { AutoCompleteRenderer } from \"~/base/Base/FieldRenderers/AutoCompleteRenderer.js\";\nimport { MultiSelectRenderer } from \"~/base/Base/FieldRenderers/MultiSelectRenderer.js\";\nimport { RegisterFeature } from \"~/exports/admin.js\";\nimport { MultiValueDynamicZoneFeature } from \"~/base/Base/FieldRenderers/ObjectRenderer/MultiValueDynamicZone/feature.js\";\n\nexport const DefaultFieldRenderers = () => {\n    return (\n        <>\n            <RegisterFeature feature={MultiValueDynamicZoneFeature} />\n            <AdminConfig>\n                <AdminConfig.Form.FieldRenderer name={\"textInput\"} component={InputRenderer} />\n                <AdminConfig.Form.FieldRenderer name={\"textarea\"} component={TextareaRenderer} />\n                <AdminConfig.Form.FieldRenderer name={\"select\"} component={SelectRenderer} />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"autoComplete\"}\n                    component={AutoCompleteRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"multiSelect\"}\n                    component={MultiSelectRenderer}\n                />\n                {/* @deprecated \"dropdown\" is for BC only./ */}\n                <AdminConfig.Form.FieldRenderer name={\"dropdown\"} component={SelectRenderer} />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"objectAccordionSingle\"}\n                    component={ObjectRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"objectAccordionMultiple\"}\n                    component={ObjectAccordionMultipleRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"dynamicZone\"}\n                    component={DynamicZoneRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"passthrough\"}\n                    component={PassthroughRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer name={\"switch\"} component={SwitchRenderer} />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"numberInput\"}\n                    component={NumberInputRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"numberInputs\"}\n                    component={NumberInputsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"textInputs\"}\n                    component={TextInputsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer name={\"textareas\"} component={TextareasRenderer} />\n                <AdminConfig.Form.FieldRenderer name={\"tags\"} component={TagsRenderer} />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"radioButtons\"}\n                    component={RadioButtonsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"checkboxes\"}\n                    component={CheckboxesRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"dateTimeInput\"}\n                    component={DateTimeRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"dateTimeInputs\"}\n                    component={DateTimeInputsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer name={\"hidden\"} component={HiddenRenderer} />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"keyValueTags\"}\n                    component={KeyValueTagsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"filePicker\"}\n                    component={FilePickerRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"multiFilePicker\"}\n                    component={MultiFilePickerRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"fileUrlPicker\"}\n                    component={FileUrlPickerRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"codeEditor\"}\n                    component={CodeEditorRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer name={\"lexical\"} component={LexicalRenderer} />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"lexicalEditors\"}\n                    component={LexicalEditorsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"passwordInput\"}\n                    component={PasswordInputRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"permissions\"}\n                    component={PermissionsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"rolesMultiSelect\"}\n                    component={RolesMultiSelectRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"apiKeyToken\"}\n                    component={ApiKeyTokenRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"multiAutoComplete\"}\n                    component={MultiAutoCompleteRenderer}\n                />\n            </AdminConfig>\n        </>\n    );\n};\n"],"names":["DefaultFieldRenderers","RegisterFeature","MultiValueDynamicZoneFeature","AdminConfig","InputRenderer","TextareaRenderer","SelectRenderer","AutoCompleteRenderer","MultiSelectRenderer","ObjectRenderer","ObjectAccordionMultipleRenderer","DynamicZoneRenderer","PassthroughRenderer","SwitchRenderer","NumberInputRenderer","NumberInputsRenderer","TextInputsRenderer","TextareasRenderer","TagsRenderer","RadioButtonsRenderer","CheckboxesRenderer","DateTimeRenderer","DateTimeInputsRenderer","HiddenRenderer","KeyValueTagsRenderer","FilePickerRenderer","MultiFilePickerRenderer","FileUrlPickerRenderer","CodeEditorRenderer","LexicalRenderer","LexicalEditorsRenderer","PasswordInputRenderer","PermissionsRenderer","RolesMultiSelectRenderer","ApiKeyTokenRenderer","MultiAutoCompleteRenderer"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCO,MAAMA,wBAAwB,IAC1B,WAAP,GACI,wDACI,oBAACC,iBAAeA;QAAC,SAASC;sBAC1B,oBAACC,aAAWA,MAAAA,WAAAA,GACR,oBAACA,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAa,WAAWC;sBAC9D,oBAACD,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAY,WAAWE;sBAC7D,oBAACF,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAU,WAAWG;sBAC3D,oBAACH,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWI;sBAEf,oBAACJ,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWK;sBAGf,oBAACL,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAY,WAAWG;sBAC7D,oBAACH,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWM;sBAEf,oBAACN,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWO;sBAEf,oBAACP,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWQ;sBAEf,oBAACR,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWS;sBAEf,oBAACT,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAU,WAAWU;sBAC3D,oBAACV,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWW;sBAEf,oBAACX,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWY;sBAEf,oBAACZ,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWa;sBAEf,oBAACb,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAa,WAAWc;sBAC9D,oBAACd,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAQ,WAAWe;sBACzD,oBAACf,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWgB;sBAEf,oBAAChB,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWiB;sBAEf,oBAACjB,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWkB;sBAEf,oBAAClB,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWmB;sBAEf,oBAACnB,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAU,WAAWoB;sBAC3D,oBAACpB,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWqB;sBAEf,oBAACrB,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWsB;sBAEf,oBAACtB,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWuB;sBAEf,oBAACvB,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWwB;sBAEf,oBAACxB,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWyB;sBAEf,oBAACzB,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAW,WAAW0B;sBAC5D,oBAAC1B,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAW2B;sBAEf,oBAAC3B,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAW4B;sBAEf,oBAAC5B,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAW6B;sBAEf,oBAAC7B,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAW8B;sBAEf,oBAAC9B,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAW+B;sBAEf,oBAAC/B,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWgC"}
+{"version":3,"file":"base/Base/DefaultFieldRenderers.js","sources":["../../../src/base/Base/DefaultFieldRenderers.tsx"],"sourcesContent":["import React from \"react\";\nimport { AdminConfig } from \"~/config/AdminConfig.js\";\nimport { InputRenderer } from \"~/base/Base/FieldRenderers/InputRenderer.js\";\nimport { SelectRenderer } from \"~/base/Base/FieldRenderers/SelectRenderer.js\";\nimport { ObjectRenderer } from \"~/base/Base/FieldRenderers/ObjectRenderer/ObjectRenderer.js\";\nimport { ObjectAccordionMultipleRenderer } from \"~/base/Base/FieldRenderers/ObjectRenderer/ObjectAccordionMultipleRenderer.js\";\nimport { DynamicZoneRenderer } from \"~/base/Base/FieldRenderers/ObjectRenderer/DynamicZoneRenderer.js\";\nimport { PassthroughRenderer } from \"~/base/Base/FieldRenderers/PassthroughRenderer.js\";\nimport { TextareaRenderer } from \"~/base/Base/FieldRenderers/TextareaRenderer.js\";\nimport { SwitchRenderer } from \"~/base/Base/FieldRenderers/SwitchRenderer.js\";\nimport { NumberInputRenderer } from \"~/base/Base/FieldRenderers/NumberInputRenderer.js\";\nimport { NumberInputsRenderer } from \"~/base/Base/FieldRenderers/NumberInputsRenderer.js\";\nimport { TextInputsRenderer } from \"~/base/Base/FieldRenderers/TextInputsRenderer.js\";\nimport { TextareasRenderer } from \"~/base/Base/FieldRenderers/TextareasRenderer.js\";\nimport { TagsRenderer } from \"~/base/Base/FieldRenderers/TagsRenderer.js\";\nimport { RadioButtonsRenderer } from \"~/base/Base/FieldRenderers/RadioButtonsRenderer.js\";\nimport { CheckboxesRenderer } from \"~/base/Base/FieldRenderers/CheckboxesRenderer.js\";\nimport { DateTimeRenderer } from \"~/base/Base/FieldRenderers/DateTimeRenderer.js\";\nimport { DateTimeInputsRenderer } from \"~/base/Base/FieldRenderers/DateTimeInputsRenderer.js\";\nimport { BirthdayInputRenderer } from \"~/base/Base/FieldRenderers/BirthdayInputRenderer.js\";\nimport { HiddenRenderer } from \"~/base/Base/FieldRenderers/HiddenRenderer.js\";\nimport { KeyValueTagsRenderer } from \"~/base/Base/FieldRenderers/ObjectRenderer/KeyValueTagsRenderer.js\";\nimport { FilePickerRenderer } from \"~/base/Base/FieldRenderers/FilePickerRenderer.js\";\nimport { FileUrlPickerRenderer } from \"~/base/Base/FieldRenderers/FileUrlPickerRenderer.js\";\nimport { MultiFilePickerRenderer } from \"~/base/Base/FieldRenderers/MultiFilePickerRenderer.js\";\nimport { CodeEditorRenderer } from \"~/base/Base/FieldRenderers/CodeEditorRenderer.js\";\nimport { LexicalRenderer } from \"~/base/Base/FieldRenderers/LexicalRenderer.js\";\nimport { LexicalEditorsRenderer } from \"~/base/Base/FieldRenderers/LexicalEditorsRenderer.js\";\nimport { PasswordInputRenderer } from \"~/base/Base/FieldRenderers/PasswordInputRenderer.js\";\nimport { PermissionsRenderer } from \"~/base/Base/FieldRenderers/PermissionsRenderer.js\";\nimport { RolesMultiSelectRenderer } from \"~/base/Base/FieldRenderers/RolesMultiSelectRenderer.js\";\nimport { ApiKeyTokenRenderer } from \"~/base/Base/FieldRenderers/ApiKeyTokenRenderer.js\";\nimport { MultiAutoCompleteRenderer } from \"~/base/Base/FieldRenderers/MultiAutoCompleteRenderer.js\";\nimport { AutoCompleteRenderer } from \"~/base/Base/FieldRenderers/AutoCompleteRenderer.js\";\nimport { MultiSelectRenderer } from \"~/base/Base/FieldRenderers/MultiSelectRenderer.js\";\nimport { RegisterFeature } from \"~/exports/admin.js\";\nimport { MultiValueDynamicZoneFeature } from \"~/base/Base/FieldRenderers/ObjectRenderer/MultiValueDynamicZone/feature.js\";\n\nexport const DefaultFieldRenderers = () => {\n    return (\n        <>\n            <RegisterFeature feature={MultiValueDynamicZoneFeature} />\n            <AdminConfig>\n                <AdminConfig.Form.FieldRenderer name={\"textInput\"} component={InputRenderer} />\n                <AdminConfig.Form.FieldRenderer name={\"textarea\"} component={TextareaRenderer} />\n                <AdminConfig.Form.FieldRenderer name={\"select\"} component={SelectRenderer} />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"autoComplete\"}\n                    component={AutoCompleteRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"multiSelect\"}\n                    component={MultiSelectRenderer}\n                />\n                {/* @deprecated \"dropdown\" is for BC only./ */}\n                <AdminConfig.Form.FieldRenderer name={\"dropdown\"} component={SelectRenderer} />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"objectAccordionSingle\"}\n                    component={ObjectRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"objectAccordionMultiple\"}\n                    component={ObjectAccordionMultipleRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"dynamicZone\"}\n                    component={DynamicZoneRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"passthrough\"}\n                    component={PassthroughRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer name={\"switch\"} component={SwitchRenderer} />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"numberInput\"}\n                    component={NumberInputRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"numberInputs\"}\n                    component={NumberInputsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"textInputs\"}\n                    component={TextInputsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer name={\"textareas\"} component={TextareasRenderer} />\n                <AdminConfig.Form.FieldRenderer name={\"tags\"} component={TagsRenderer} />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"radioButtons\"}\n                    component={RadioButtonsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"checkboxes\"}\n                    component={CheckboxesRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"dateTimeInput\"}\n                    component={DateTimeRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"dateTimeInputs\"}\n                    component={DateTimeInputsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"birthdayInput\"}\n                    component={BirthdayInputRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer name={\"hidden\"} component={HiddenRenderer} />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"keyValueTags\"}\n                    component={KeyValueTagsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"filePicker\"}\n                    component={FilePickerRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"multiFilePicker\"}\n                    component={MultiFilePickerRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"fileUrlPicker\"}\n                    component={FileUrlPickerRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"codeEditor\"}\n                    component={CodeEditorRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer name={\"lexical\"} component={LexicalRenderer} />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"lexicalEditors\"}\n                    component={LexicalEditorsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"passwordInput\"}\n                    component={PasswordInputRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"permissions\"}\n                    component={PermissionsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"rolesMultiSelect\"}\n                    component={RolesMultiSelectRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"apiKeyToken\"}\n                    component={ApiKeyTokenRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"multiAutoComplete\"}\n                    component={MultiAutoCompleteRenderer}\n                />\n            </AdminConfig>\n        </>\n    );\n};\n"],"names":["DefaultFieldRenderers","RegisterFeature","MultiValueDynamicZoneFeature","AdminConfig","InputRenderer","TextareaRenderer","SelectRenderer","AutoCompleteRenderer","MultiSelectRenderer","ObjectRenderer","ObjectAccordionMultipleRenderer","DynamicZoneRenderer","PassthroughRenderer","SwitchRenderer","NumberInputRenderer","NumberInputsRenderer","TextInputsRenderer","TextareasRenderer","TagsRenderer","RadioButtonsRenderer","CheckboxesRenderer","DateTimeRenderer","DateTimeInputsRenderer","BirthdayInputRenderer","HiddenRenderer","KeyValueTagsRenderer","FilePickerRenderer","MultiFilePickerRenderer","FileUrlPickerRenderer","CodeEditorRenderer","LexicalRenderer","LexicalEditorsRenderer","PasswordInputRenderer","PermissionsRenderer","RolesMultiSelectRenderer","ApiKeyTokenRenderer","MultiAutoCompleteRenderer"],"mappings":"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"}

package/base/Base/FieldRenderers/BirthdayInputRenderer.d.ts

@@ -0,0 +1,21 @@
+import React from "react";
+declare module "../../../features/formModel/abstractions.js" {
+    interface IFieldRendererRegistry {
+        /**
+         * Picks a day, then a month, then a year. It offers only the dates the field's
+         * `dateGte`/`dateLte` limits allow; without limits, years run from this year back
+         * 120 years.
+         */
+        birthdayInput: {
+            fieldType: "datetime";
+            settings?: undefined;
+        };
+    }
+}
+/**
+ * Renders a date-only field as a step-by-step picker: day, then month, then year.
+ * The value is the same `YYYY-MM-DD` string the calendar picker stores.
+ */
+export declare const BirthdayInputRenderer: React.ComponentType<{
+    field: import("../../..").IFieldVM;
+}>;

package/base/Base/FieldRenderers/BirthdayInputRenderer.js

@@ -0,0 +1,39 @@
+import react, { useMemo } from "react";
+import { DatePicker } from "@webiny/admin-ui";
+import { createFieldRenderer } from "../../../features/formModel/createFieldRenderer.js";
+import { getDateLimits, resolveDateLimits } from "../../../features/formModel/fieldTypes/dateLimits.js";
+const toLocalDate = (value)=>{
+    const match = value?.match(/^(\d{4})-(\d{2})-(\d{2})/);
+    return match ? new Date(Number(match[1]), Number(match[2]) - 1, Number(match[3])) : void 0;
+};
+const BirthdayInputRenderer = createFieldRenderer(({ field })=>{
+    const { min, max } = resolveDateLimits(getDateLimits(field.rendererSettings));
+    const minDate = useMemo(()=>toLocalDate(min), [
+        min
+    ]);
+    const maxDate = useMemo(()=>toLocalDate(max), [
+        max
+    ]);
+    return /*#__PURE__*/ react.createElement("div", {
+        className: "w-full"
+    }, /*#__PURE__*/ react.createElement(DatePicker, {
+        hint: field.help,
+        type: "birthday",
+        value: field.value ?? void 0,
+        onChange: (value)=>{
+            field.onChange(value);
+            field.onBlur();
+        },
+        disabled: field.disabled,
+        minDate: minDate,
+        maxDate: maxDate,
+        label: field.label,
+        description: field.description,
+        note: field.note,
+        required: field.required,
+        validation: field.validation
+    }));
+});
+export { BirthdayInputRenderer };
+
+//# sourceMappingURL=BirthdayInputRenderer.js.map

package/base/Base/FieldRenderers/BirthdayInputRenderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"base/Base/FieldRenderers/BirthdayInputRenderer.js","sources":["../../../../src/base/Base/FieldRenderers/BirthdayInputRenderer.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { DatePicker } from \"@webiny/admin-ui\";\nimport { createFieldRenderer } from \"~/features/formModel/createFieldRenderer.js\";\nimport { getDateLimits, resolveDateLimits } from \"~/features/formModel/fieldTypes/dateLimits.js\";\n\ndeclare module \"../../../features/formModel/abstractions.js\" {\n    interface IFieldRendererRegistry {\n        /**\n         * Picks a day, then a month, then a year. It offers only the dates the field's\n         * `dateGte`/`dateLte` limits allow; without limits, years run from this year back\n         * 120 years.\n         */\n        birthdayInput: {\n            fieldType: \"datetime\";\n            settings?: undefined;\n        };\n    }\n}\n\n/** A `YYYY-MM-DD` date as local midnight, the way the picker compares dates. */\nconst toLocalDate = (value: string | undefined): Date | undefined => {\n    const match = value?.match(/^(\\d{4})-(\\d{2})-(\\d{2})/);\n    return match ? new Date(Number(match[1]), Number(match[2]) - 1, Number(match[3])) : undefined;\n};\n\n/**\n * Renders a date-only field as a step-by-step picker: day, then month, then year.\n * The value is the same `YYYY-MM-DD` string the calendar picker stores.\n */\nexport const BirthdayInputRenderer = createFieldRenderer<\"birthdayInput\">(({ field }) => {\n    // Worked out on every render, so the limits follow the editor's local date.\n    const { min, max } = resolveDateLimits(getDateLimits(field.rendererSettings));\n    const minDate = useMemo(() => toLocalDate(min), [min]);\n    const maxDate = useMemo(() => toLocalDate(max), [max]);\n\n    return (\n        <div className=\"w-full\">\n            <DatePicker\n                hint={field.help}\n                type={\"birthday\"}\n                value={(field.value as string | undefined) ?? undefined}\n                onChange={value => {\n                    field.onChange(value);\n                    field.onBlur();\n                }}\n                disabled={field.disabled}\n                minDate={minDate}\n                maxDate={maxDate}\n                label={field.label}\n                description={field.description}\n                note={field.note}\n                required={field.required}\n                validation={field.validation}\n            />\n        </div>\n    );\n});\n"],"names":["toLocalDate","value","match","Date","Number","undefined","BirthdayInputRenderer","createFieldRenderer","field","min","max","resolveDateLimits","getDateLimits","minDate","useMemo","maxDate","DatePicker"],"mappings":";;;;AAoBA,MAAMA,cAAc,CAACC;IACjB,MAAMC,QAAQD,OAAO,MAAM;IAC3B,OAAOC,QAAQ,IAAIC,KAAKC,OAAOF,KAAK,CAAC,EAAE,GAAGE,OAAOF,KAAK,CAAC,EAAE,IAAI,GAAGE,OAAOF,KAAK,CAAC,EAAE,KAAKG;AACxF;AAMO,MAAMC,wBAAwBC,oBAAqC,CAAC,EAAEC,KAAK,EAAE;IAEhF,MAAM,EAAEC,GAAG,EAAEC,GAAG,EAAE,GAAGC,kBAAkBC,cAAcJ,MAAM,gBAAgB;IAC3E,MAAMK,UAAUC,QAAQ,IAAMd,YAAYS,MAAM;QAACA;KAAI;IACrD,MAAMM,UAAUD,QAAQ,IAAMd,YAAYU,MAAM;QAACA;KAAI;IAErD,OAAO,WAAP,GACI,oBAAC;QAAI,WAAU;qBACX,oBAACM,YAAUA;QACP,MAAMR,MAAM,IAAI;QAChB,MAAM;QACN,OAAQA,MAAM,KAAK,IAA2BH;QAC9C,UAAUJ,CAAAA;YACNO,MAAM,QAAQ,CAACP;YACfO,MAAM,MAAM;QAChB;QACA,UAAUA,MAAM,QAAQ;QACxB,SAASK;QACT,SAASE;QACT,OAAOP,MAAM,KAAK;QAClB,aAAaA,MAAM,WAAW;QAC9B,MAAMA,MAAM,IAAI;QAChB,UAAUA,MAAM,QAAQ;QACxB,YAAYA,MAAM,UAAU;;AAI5C"}

package/base/Base/FieldRenderers/BirthdayInputRenderer.test.d.ts

@@ -0,0 +1 @@
+export {};

package/base/Base/FieldRenderers/BirthdayInputRenderer.test.js

@@ -0,0 +1,123 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import react from "react";
+import { cleanup, fireEvent, render, screen, within } from "@testing-library/react";
+import { AdminUiProvider } from "@webiny/admin-ui";
+import { DateTimeFieldBuilder } from "../../../features/formModel/fieldTypes/DateTimeFieldType.js";
+import { BirthdayInputRenderer } from "./BirthdayInputRenderer.js";
+vi.mock("@webiny/icons/calendar_month.svg", ()=>({
+        ReactComponent: ()=>null
+    }));
+vi.mock("@webiny/icons/close.svg", ()=>({
+        ReactComponent: ()=>null
+    }));
+const createAdultField = ()=>{
+    const config = new DateTimeFieldBuilder().dateOnly().dateLte({
+        expression: "today-18y"
+    }).renderer("birthdayInput").build("dob");
+    return {
+        name: "dob",
+        qualifiedName: "dob",
+        type: "datetime",
+        label: "Date of birth",
+        value: void 0,
+        validation: {
+            isValid: null
+        },
+        validating: false,
+        required: false,
+        visible: true,
+        disabled: false,
+        renderer: config.renderer,
+        rendererSettings: config.rendererSettings,
+        onChange: vi.fn(),
+        onBlur: vi.fn(),
+        addItem: vi.fn(),
+        removeItem: vi.fn(),
+        focusRequested: false,
+        clearFocusRequest: vi.fn(),
+        context: {}
+    };
+};
+const cell = (step, name)=>{
+    const panel = document.querySelector(`div[data-step="${step}"]`);
+    return within(panel).getByRole("button", {
+        name,
+        hidden: true
+    });
+};
+const years = ()=>{
+    const panel = document.querySelector('div[data-step="year"]');
+    return within(panel).getAllByRole("button", {
+        hidden: true
+    }).map((button)=>Number(button.textContent));
+};
+const renderField = (field)=>render(/*#__PURE__*/ react.createElement(AdminUiProvider, null, /*#__PURE__*/ react.createElement(BirthdayInputRenderer, {
+        field: field
+    })));
+const openPicker = ()=>{
+    fireEvent.click(screen.getByRole("button", {
+        expanded: false
+    }));
+};
+describe("BirthdayInputRenderer with a relative limit", ()=>{
+    beforeEach(()=>{
+        vi.useFakeTimers({
+            toFake: [
+                "Date"
+            ]
+        });
+        vi.stubGlobal("ResizeObserver", class {
+            observe() {}
+            unobserve() {}
+            disconnect() {}
+        });
+    });
+    afterEach(()=>{
+        cleanup();
+        vi.useRealTimers();
+        vi.unstubAllGlobals();
+    });
+    it("starts the year list at the cut-off year", ()=>{
+        vi.setSystemTime(new Date(2026, 9, 19, 12));
+        renderField(createAdultField());
+        openPicker();
+        expect(years()[0]).toBe(2008);
+        expect(years().some((year)=>year > 2008)).toBe(false);
+    });
+    it("dims the cut-off year for a day after the cut-off", ()=>{
+        vi.setSystemTime(new Date(2026, 9, 19, 12));
+        renderField(createAdultField());
+        openPicker();
+        fireEvent.click(cell("day", "20"));
+        fireEvent.click(cell("month", "October"));
+        expect(cell("year", "2008").disabled).toBe(true);
+        expect(cell("year", "2007").disabled).toBe(false);
+    });
+    it("allows the cut-off day itself", ()=>{
+        vi.setSystemTime(new Date(2026, 9, 19, 12));
+        const field = createAdultField();
+        renderField(field);
+        openPicker();
+        fireEvent.click(cell("day", "19"));
+        fireEvent.click(cell("month", "October"));
+        expect(cell("year", "2008").disabled).toBe(false);
+        fireEvent.click(cell("year", "2008"));
+        expect(field.onChange).toHaveBeenLastCalledWith("2008-10-19");
+    });
+    it("moves the cut-off with the date", ()=>{
+        vi.setSystemTime(new Date(2026, 9, 20, 12));
+        renderField(createAdultField());
+        openPicker();
+        fireEvent.click(cell("day", "20"));
+        fireEvent.click(cell("month", "October"));
+        expect(cell("year", "2008").disabled).toBe(false);
+    });
+    it("moves the year list on 1 January", ()=>{
+        vi.setSystemTime(new Date(2027, 0, 1, 12));
+        renderField(createAdultField());
+        openPicker();
+        expect(years()[0]).toBe(2009);
+    });
+});
+
+//# sourceMappingURL=BirthdayInputRenderer.test.js.map

package/base/Base/FieldRenderers/BirthdayInputRenderer.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"base/Base/FieldRenderers/BirthdayInputRenderer.test.js","sources":["../../../../src/base/Base/FieldRenderers/BirthdayInputRenderer.test.tsx"],"sourcesContent":["import { afterEach, beforeEach, describe, it, expect, vi } from \"vitest\";\nimport React from \"react\";\nimport { cleanup, fireEvent, render, screen, within } from \"@testing-library/react\";\nimport { AdminUiProvider } from \"@webiny/admin-ui\";\nimport type { IFieldVM } from \"~/features/formModel/abstractions.js\";\nimport { DateTimeFieldBuilder } from \"~/features/formModel/fieldTypes/DateTimeFieldType.js\";\nimport { BirthdayInputRenderer } from \"./BirthdayInputRenderer.js\";\n\n// Tests don't turn SVG files into components, so the picker's icons are stubbed.\nvi.mock(\"@webiny/icons/calendar_month.svg\", () => ({ ReactComponent: () => null }));\nvi.mock(\"@webiny/icons/close.svg\", () => ({ ReactComponent: () => null }));\n\n/** A date-only field of 18 or older, as `datetime()` hands it to the renderer. */\nconst createAdultField = (): IFieldVM => {\n    const config = new DateTimeFieldBuilder()\n        .dateOnly()\n        .dateLte({ expression: \"today-18y\" })\n        .renderer(\"birthdayInput\")\n        .build(\"dob\");\n\n    return {\n        name: \"dob\",\n        qualifiedName: \"dob\",\n        type: \"datetime\",\n        label: \"Date of birth\",\n        value: undefined,\n        validation: { isValid: null },\n        validating: false,\n        required: false,\n        visible: true,\n        disabled: false,\n        renderer: config.renderer,\n        rendererSettings: config.rendererSettings,\n        onChange: vi.fn(),\n        onBlur: vi.fn(),\n        addItem: vi.fn(),\n        removeItem: vi.fn(),\n        focusRequested: false,\n        clearFocusRequest: vi.fn(),\n        context: {}\n    };\n};\n\n/**\n * A step's grid. The header segments carry `data-step` too, so only the grid `div` matches.\n * Only the current step's grid is visible, so the cells are looked up as hidden as well.\n */\nconst cell = (step: \"day\" | \"month\" | \"year\", name: string) => {\n    const panel = document.querySelector<HTMLElement>(`div[data-step=\"${step}\"]`)!;\n    return within(panel).getByRole<HTMLButtonElement>(\"button\", { name, hidden: true });\n};\n\nconst years = () => {\n    const panel = document.querySelector<HTMLElement>(`div[data-step=\"year\"]`)!;\n    return within(panel)\n        .getAllByRole(\"button\", { hidden: true })\n        .map(button => Number(button.textContent));\n};\n\nconst renderField = (field: IFieldVM) =>\n    render(\n        <AdminUiProvider>\n            <BirthdayInputRenderer field={field} />\n        </AdminUiProvider>\n    );\n\nconst openPicker = () => {\n    fireEvent.click(screen.getByRole(\"button\", { expanded: false }));\n};\n\n/**\n * The renderer works the limits out from the editor's local date on every render. Only `Date`\n * is frozen, so the picker's own timers and animation frames run as usual.\n */\ndescribe(\"BirthdayInputRenderer with a relative limit\", () => {\n    beforeEach(() => {\n        vi.useFakeTimers({ toFake: [\"Date\"] });\n        // Polyfilled per test: jsdom has no ResizeObserver, which the popover and scroll area use.\n        vi.stubGlobal(\n            \"ResizeObserver\",\n            class {\n                observe() {}\n                unobserve() {}\n                disconnect() {}\n            }\n        );\n    });\n\n    afterEach(() => {\n        cleanup();\n        vi.useRealTimers();\n        vi.unstubAllGlobals();\n    });\n\n    it(\"starts the year list at the cut-off year\", () => {\n        vi.setSystemTime(new Date(2026, 9, 19, 12));\n        renderField(createAdultField());\n        openPicker();\n\n        expect(years()[0]).toBe(2008);\n        expect(years().some(year => year > 2008)).toBe(false);\n    });\n\n    it(\"dims the cut-off year for a day after the cut-off\", () => {\n        vi.setSystemTime(new Date(2026, 9, 19, 12));\n        renderField(createAdultField());\n        openPicker();\n\n        fireEvent.click(cell(\"day\", \"20\"));\n        fireEvent.click(cell(\"month\", \"October\"));\n\n        expect(cell(\"year\", \"2008\").disabled).toBe(true);\n        expect(cell(\"year\", \"2007\").disabled).toBe(false);\n    });\n\n    it(\"allows the cut-off day itself\", () => {\n        vi.setSystemTime(new Date(2026, 9, 19, 12));\n        const field = createAdultField();\n        renderField(field);\n        openPicker();\n\n        fireEvent.click(cell(\"day\", \"19\"));\n        fireEvent.click(cell(\"month\", \"October\"));\n        expect(cell(\"year\", \"2008\").disabled).toBe(false);\n\n        fireEvent.click(cell(\"year\", \"2008\"));\n        expect(field.onChange).toHaveBeenLastCalledWith(\"2008-10-19\");\n    });\n\n    it(\"moves the cut-off with the date\", () => {\n        vi.setSystemTime(new Date(2026, 9, 20, 12));\n        renderField(createAdultField());\n        openPicker();\n\n        fireEvent.click(cell(\"day\", \"20\"));\n        fireEvent.click(cell(\"month\", \"October\"));\n\n        expect(cell(\"year\", \"2008\").disabled).toBe(false);\n    });\n\n    it(\"moves the year list on 1 January\", () => {\n        vi.setSystemTime(new Date(2027, 0, 1, 12));\n        renderField(createAdultField());\n        openPicker();\n\n        expect(years()[0]).toBe(2009);\n    });\n});\n"],"names":["vi","createAdultField","config","DateTimeFieldBuilder","undefined","cell","step","name","panel","document","within","years","button","Number","renderField","field","render","AdminUiProvider","BirthdayInputRenderer","openPicker","fireEvent","screen","describe","beforeEach","afterEach","cleanup","it","Date","expect","year"],"mappings":"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"}

package/base/Base/FieldRenderers/ObjectRenderer/ObjectFieldComponents.d.ts

@@ -1,5 +1,6 @@
 import React from "react";
 import type { IObjectFieldItemVM, LayoutNodeVM } from "../../../../features/formModel/index.js";
+import { FieldValueFormatter } from "../../../../features/formModel/index.js";
 import type { ISortableItemProps } from "../../../../presentation/sortable/index.js";
 export declare const NestedLayout: (({ layout }: {
     layout: LayoutNodeVM[];
@@ -10,6 +11,7 @@ export declare const NestedLayout: (({ layout }: {
         layout: LayoutNodeVM[];
     }) => React.JSX.Element;
 };
+export declare function useFieldValueFormatters(): FieldValueFormatter.Interface[];
 export interface ListItemRendererProps {
     item: IObjectFieldItemVM;
     index: number;

package/base/Base/FieldRenderers/ObjectRenderer/ObjectFieldComponents.js

@@ -1,11 +1,12 @@
-import react, { useEffect, useState } from "react";
+import react, { useEffect, useMemo, useState } from "react";
 import { observer } from "mobx-react-lite";
 import { Accordion, Button, IconButton } from "@webiny/admin-ui";
 import { ReactComponent } from "@webiny/icons/add.svg";
 import { ReactComponent as delete_outline_svg_ReactComponent } from "@webiny/icons/delete_outline.svg";
 import { ReactComponent as arrow_upward_svg_ReactComponent } from "@webiny/icons/arrow_upward.svg";
 import { ReactComponent as arrow_downward_svg_ReactComponent } from "@webiny/icons/arrow_downward.svg";
-import { hasSubtreeFocusRequest } from "../../../../features/formModel/index.js";
+import { useContainer } from "@webiny/app";
+import { FieldValueFormatter, hasSubtreeFocusRequest } from "../../../../features/formModel/index.js";
 import { LayoutNodeRenderer } from "../../../../features/formModel/FormView.js";
 import { resolveItemDescription, resolveItemTitle } from "./resolveItemTitle.js";
 const NestedLayout = observer(({ layout })=>/*#__PURE__*/ react.createElement("div", {
@@ -14,8 +15,15 @@ const NestedLayout = observer(({ layout })=>/*#__PURE__*/ react.createElement("d
             key: index,
             node: node
         }))));
+function useFieldValueFormatters() {
+    const container = useContainer();
+    return useMemo(()=>container.resolveAll(FieldValueFormatter), [
+        container
+    ]);
+}
 const ListItemRenderer = observer(({ item, index, total, label, itemTitle, itemDescription, disabled, sortable })=>{
     const [open, setOpen] = useState(false);
+    const formatters = useFieldValueFormatters();
     const hasFocusRequest = hasSubtreeFocusRequest(item.fields);
     useEffect(()=>{
         if (hasFocusRequest) setOpen(true);
@@ -51,8 +59,8 @@ const ListItemRenderer = observer(({ item, index, total, label, itemTitle, itemD
         variant: "container",
         openClosedIndicatorPosition: "left"
     }, /*#__PURE__*/ react.createElement(Accordion.Item, {
-        title: resolveItemTitle(item, index, label, itemTitle),
-        description: resolveItemDescription(item, index, itemDescription),
+        title: resolveItemTitle(item.fields, index, `${label || "Item"} #${index + 1}`, itemTitle, formatters),
+        description: resolveItemDescription(item.fields, index, itemDescription, formatters),
         actions: disabled ? null : actions,
         open: open,
         onOpenChange: setOpen,
@@ -98,6 +106,6 @@ const AddItemButton = ({ label, disabled, onAdd })=>/*#__PURE__*/ react.createEl
         onClick: onAdd,
         disabled: disabled
     }));
-export { AddItemButton, ListItemRenderer, NestedLayout };
+export { AddItemButton, ListItemRenderer, NestedLayout, useFieldValueFormatters };
 
 //# sourceMappingURL=ObjectFieldComponents.js.map

package/base/Base/FieldRenderers/ObjectRenderer/ObjectFieldComponents.js.map

@@ -1 +1 @@
-{"version":3,"file":"base/Base/FieldRenderers/ObjectRenderer/ObjectFieldComponents.js","sources":["../../../../../src/base/Base/FieldRenderers/ObjectRenderer/ObjectFieldComponents.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport { observer } from \"mobx-react-lite\";\nimport { Accordion, Button, IconButton } from \"@webiny/admin-ui\";\nimport { ReactComponent as AddIcon } from \"@webiny/icons/add.svg\";\nimport { ReactComponent as DeleteIcon } from \"@webiny/icons/delete_outline.svg\";\nimport { ReactComponent as ArrowUp } from \"@webiny/icons/arrow_upward.svg\";\nimport { ReactComponent as ArrowDown } from \"@webiny/icons/arrow_downward.svg\";\nimport type { IObjectFieldItemVM, LayoutNodeVM } from \"~/features/formModel/index.js\";\nimport { hasSubtreeFocusRequest } from \"~/features/formModel/index.js\";\nimport { LayoutNodeRenderer } from \"~/features/formModel/FormView.js\";\nimport { resolveItemTitle, resolveItemDescription } from \"./resolveItemTitle.js\";\nimport type { ISortableItemProps } from \"~/presentation/sortable/index.js\";\n\nexport const NestedLayout = observer(({ layout }: { layout: LayoutNodeVM[] }) => {\n    return (\n        <div className={\"flex flex-col gap-md\"}>\n            {layout.map((node, index) => (\n                <LayoutNodeRenderer key={index} node={node} />\n            ))}\n        </div>\n    );\n});\n\nexport interface ListItemRendererProps {\n    item: IObjectFieldItemVM;\n    index: number;\n    total: number;\n    label?: string;\n    itemTitle?: string | ((data: Record<string, unknown>, index: number) => string);\n    itemDescription?: string | ((data: Record<string, unknown>, index: number) => string);\n    disabled: boolean;\n    sortable?: ISortableItemProps;\n}\n\nexport const ListItemRenderer = observer(\n    ({\n        item,\n        index,\n        total,\n        label,\n        itemTitle,\n        itemDescription,\n        disabled,\n        sortable\n    }: ListItemRendererProps) => {\n        const [open, setOpen] = useState(false);\n        const hasFocusRequest = hasSubtreeFocusRequest(item.fields);\n\n        useEffect(() => {\n            if (hasFocusRequest) {\n                setOpen(true);\n            }\n        }, [hasFocusRequest]);\n\n        const actions = (\n            <>\n                <IconButton\n                    icon={<ArrowDown />}\n                    onClick={e => {\n                        e.stopPropagation();\n                        item.moveDown();\n                    }}\n                    variant=\"ghost\"\n                    disabled={index === total - 1}\n                />\n                <IconButton\n                    icon={<ArrowUp />}\n                    onClick={e => {\n                        e.stopPropagation();\n                        item.moveUp();\n                    }}\n                    variant=\"ghost\"\n                    disabled={index === 0}\n                />\n                <Accordion.Item.Action.Separator />\n                <IconButton\n                    icon={<DeleteIcon />}\n                    onClick={e => {\n                        e.stopPropagation();\n                        item.remove();\n                    }}\n                    variant=\"ghost\"\n                />\n            </>\n        );\n\n        const accordion = (\n            <Accordion\n                background={\"base\"}\n                variant={\"container\"}\n                openClosedIndicatorPosition={\"left\"}\n            >\n                <Accordion.Item\n                    title={resolveItemTitle(item, index, label, itemTitle)}\n                    description={resolveItemDescription(item, index, itemDescription)}\n                    actions={disabled ? null : actions}\n                    open={open}\n                    onOpenChange={setOpen}\n                    draggable={!disabled && sortable !== undefined}\n                    dragHandleRef={sortable?.handleRef}\n                >\n                    <NestedLayout layout={item.layout} />\n                </Accordion.Item>\n            </Accordion>\n        );\n\n        if (!sortable) {\n            return accordion;\n        }\n\n        return (\n            <div\n                ref={sortable.ref}\n                data-sortable-item=\"\"\n                className={\"relative\"}\n                style={{ opacity: sortable.isDragging ? 0.4 : 1 }}\n            >\n                {sortable.closestEdge === \"top\" && (\n                    <DropIndicator position={\"top\"} isFirst={index === 0} />\n                )}\n                {accordion}\n                {sortable.closestEdge === \"bottom\" && (\n                    <DropIndicator position={\"bottom\"} isLast={index === total - 1} />\n                )}\n            </div>\n        );\n    }\n);\n\nconst DropIndicator = ({\n    position,\n    isFirst = false,\n    isLast = false\n}: {\n    position: \"top\" | \"bottom\";\n    isFirst?: boolean;\n    isLast?: boolean;\n}) => {\n    let offset = \"calc(var(--spacing-md) / -2)\";\n    if (position === \"top\" && isFirst) {\n        offset = \"0px\";\n    }\n    if (position === \"bottom\" && isLast) {\n        offset = \"0px\";\n    }\n\n    return (\n        <div\n            className={\"absolute left-0 right-0 z-10\"}\n            style={{\n                [position]: offset,\n                transform: position === \"top\" ? \"translateY(-50%)\" : \"translateY(50%)\"\n            }}\n        >\n            <div className={\"w-full h-[2px] bg-primary rounded-full\"} />\n        </div>\n    );\n};\n\nexport interface AddItemButtonProps {\n    label?: string;\n    disabled: boolean;\n    onAdd: () => void;\n}\n\nexport const AddItemButton = ({ label, disabled, onAdd }: AddItemButtonProps) => {\n    return (\n        <div>\n            <Button\n                icon={<AddIcon />}\n                text={label || \"Add Item\"}\n                variant={\"tertiary\"}\n                onClick={onAdd}\n                disabled={disabled}\n            />\n        </div>\n    );\n};\n"],"names":["NestedLayout","observer","layout","node","index","LayoutNodeRenderer","ListItemRenderer","item","total","label","itemTitle","itemDescription","disabled","sortable","open","setOpen","useState","hasFocusRequest","hasSubtreeFocusRequest","useEffect","actions","IconButton","ArrowDown","e","ArrowUp","Accordion","DeleteIcon","accordion","resolveItemTitle","resolveItemDescription","undefined","DropIndicator","position","isFirst","isLast","offset","AddItemButton","onAdd","Button","AddIcon"],"mappings":"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"}
+{"version":3,"file":"base/Base/FieldRenderers/ObjectRenderer/ObjectFieldComponents.js","sources":["../../../../../src/base/Base/FieldRenderers/ObjectRenderer/ObjectFieldComponents.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useState } from \"react\";\nimport { observer } from \"mobx-react-lite\";\nimport { Accordion, Button, IconButton } from \"@webiny/admin-ui\";\nimport { ReactComponent as AddIcon } from \"@webiny/icons/add.svg\";\nimport { ReactComponent as DeleteIcon } from \"@webiny/icons/delete_outline.svg\";\nimport { ReactComponent as ArrowUp } from \"@webiny/icons/arrow_upward.svg\";\nimport { ReactComponent as ArrowDown } from \"@webiny/icons/arrow_downward.svg\";\nimport { useContainer } from \"@webiny/app\";\nimport type { IObjectFieldItemVM, LayoutNodeVM } from \"~/features/formModel/index.js\";\nimport { FieldValueFormatter, hasSubtreeFocusRequest } from \"~/features/formModel/index.js\";\nimport { LayoutNodeRenderer } from \"~/features/formModel/FormView.js\";\nimport { resolveItemTitle, resolveItemDescription } from \"./resolveItemTitle.js\";\nimport type { ISortableItemProps } from \"~/presentation/sortable/index.js\";\n\nexport const NestedLayout = observer(({ layout }: { layout: LayoutNodeVM[] }) => {\n    return (\n        <div className={\"flex flex-col gap-md\"}>\n            {layout.map((node, index) => (\n                <LayoutNodeRenderer key={index} node={node} />\n            ))}\n        </div>\n    );\n});\n\nexport function useFieldValueFormatters(): FieldValueFormatter.Interface[] {\n    const container = useContainer();\n    return useMemo(() => container.resolveAll(FieldValueFormatter), [container]);\n}\n\nexport interface ListItemRendererProps {\n    item: IObjectFieldItemVM;\n    index: number;\n    total: number;\n    label?: string;\n    itemTitle?: string | ((data: Record<string, unknown>, index: number) => string);\n    itemDescription?: string | ((data: Record<string, unknown>, index: number) => string);\n    disabled: boolean;\n    sortable?: ISortableItemProps;\n}\n\nexport const ListItemRenderer = observer(\n    ({\n        item,\n        index,\n        total,\n        label,\n        itemTitle,\n        itemDescription,\n        disabled,\n        sortable\n    }: ListItemRendererProps) => {\n        const [open, setOpen] = useState(false);\n        const formatters = useFieldValueFormatters();\n        const hasFocusRequest = hasSubtreeFocusRequest(item.fields);\n\n        useEffect(() => {\n            if (hasFocusRequest) {\n                setOpen(true);\n            }\n        }, [hasFocusRequest]);\n\n        const actions = (\n            <>\n                <IconButton\n                    icon={<ArrowDown />}\n                    onClick={e => {\n                        e.stopPropagation();\n                        item.moveDown();\n                    }}\n                    variant=\"ghost\"\n                    disabled={index === total - 1}\n                />\n                <IconButton\n                    icon={<ArrowUp />}\n                    onClick={e => {\n                        e.stopPropagation();\n                        item.moveUp();\n                    }}\n                    variant=\"ghost\"\n                    disabled={index === 0}\n                />\n                <Accordion.Item.Action.Separator />\n                <IconButton\n                    icon={<DeleteIcon />}\n                    onClick={e => {\n                        e.stopPropagation();\n                        item.remove();\n                    }}\n                    variant=\"ghost\"\n                />\n            </>\n        );\n\n        const accordion = (\n            <Accordion\n                background={\"base\"}\n                variant={\"container\"}\n                openClosedIndicatorPosition={\"left\"}\n            >\n                <Accordion.Item\n                    title={resolveItemTitle(\n                        item.fields,\n                        index,\n                        `${label || \"Item\"} #${index + 1}`,\n                        itemTitle,\n                        formatters\n                    )}\n                    description={resolveItemDescription(\n                        item.fields,\n                        index,\n                        itemDescription,\n                        formatters\n                    )}\n                    actions={disabled ? null : actions}\n                    open={open}\n                    onOpenChange={setOpen}\n                    draggable={!disabled && sortable !== undefined}\n                    dragHandleRef={sortable?.handleRef}\n                >\n                    <NestedLayout layout={item.layout} />\n                </Accordion.Item>\n            </Accordion>\n        );\n\n        if (!sortable) {\n            return accordion;\n        }\n\n        return (\n            <div\n                ref={sortable.ref}\n                data-sortable-item=\"\"\n                className={\"relative\"}\n                style={{ opacity: sortable.isDragging ? 0.4 : 1 }}\n            >\n                {sortable.closestEdge === \"top\" && (\n                    <DropIndicator position={\"top\"} isFirst={index === 0} />\n                )}\n                {accordion}\n                {sortable.closestEdge === \"bottom\" && (\n                    <DropIndicator position={\"bottom\"} isLast={index === total - 1} />\n                )}\n            </div>\n        );\n    }\n);\n\nconst DropIndicator = ({\n    position,\n    isFirst = false,\n    isLast = false\n}: {\n    position: \"top\" | \"bottom\";\n    isFirst?: boolean;\n    isLast?: boolean;\n}) => {\n    let offset = \"calc(var(--spacing-md) / -2)\";\n    if (position === \"top\" && isFirst) {\n        offset = \"0px\";\n    }\n    if (position === \"bottom\" && isLast) {\n        offset = \"0px\";\n    }\n\n    return (\n        <div\n            className={\"absolute left-0 right-0 z-10\"}\n            style={{\n                [position]: offset,\n                transform: position === \"top\" ? \"translateY(-50%)\" : \"translateY(50%)\"\n            }}\n        >\n            <div className={\"w-full h-[2px] bg-primary rounded-full\"} />\n        </div>\n    );\n};\n\nexport interface AddItemButtonProps {\n    label?: string;\n    disabled: boolean;\n    onAdd: () => void;\n}\n\nexport const AddItemButton = ({ label, disabled, onAdd }: AddItemButtonProps) => {\n    return (\n        <div>\n            <Button\n                icon={<AddIcon />}\n                text={label || \"Add Item\"}\n                variant={\"tertiary\"}\n                onClick={onAdd}\n                disabled={disabled}\n            />\n        </div>\n    );\n};\n"],"names":["NestedLayout","observer","layout","node","index","LayoutNodeRenderer","useFieldValueFormatters","container","useContainer","useMemo","FieldValueFormatter","ListItemRenderer","item","total","label","itemTitle","itemDescription","disabled","sortable","open","setOpen","useState","formatters","hasFocusRequest","hasSubtreeFocusRequest","useEffect","actions","IconButton","ArrowDown","e","ArrowUp","Accordion","DeleteIcon","accordion","resolveItemTitle","resolveItemDescription","undefined","DropIndicator","position","isFirst","isLast","offset","AddItemButton","onAdd","Button","AddIcon"],"mappings":"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"}

package/base/Base/FieldRenderers/ObjectRenderer/ObjectRenderer.js

@@ -1,33 +1,12 @@
 import react, { useEffect, useState } from "react";
 import { Accordion } from "@webiny/admin-ui";
 import { createObjectFieldRenderer } from "../../../../features/formModel/createFieldRenderer.js";
-import { NestedLayout } from "./ObjectFieldComponents.js";
+import { NestedLayout, useFieldValueFormatters } from "./ObjectFieldComponents.js";
+import { resolveItemDescription, resolveItemTitle } from "./resolveItemTitle.js";
 import { hasSubtreeFocusRequest } from "../../../../features/formModel/index.js";
-function resolveTitle(field, itemTitle) {
-    if (!itemTitle) return field.label;
-    if ("string" == typeof itemTitle) {
-        const child = field.fields.find((f)=>f.name === itemTitle);
-        return (child ? String(child.value ?? "") : "") || field.label;
-    }
-    const data = {};
-    for (const child of field.fields)data[child.name] = child.value;
-    return itemTitle(data) || field.label;
-}
-function resolveDescription(field, itemDescription) {
-    if (!itemDescription) return;
-    if ("string" == typeof itemDescription) {
-        const child = field.fields.find((f)=>f.name === itemDescription);
-        return (child ? String(child.value ?? "") : "") || void 0;
-    }
-    const data = {};
-    for (const child of field.fields)data[child.name] = child.value;
-    return itemDescription(data) || void 0;
-}
 const ObjectRenderer = createObjectFieldRenderer(({ field })=>{
     const settings = field.rendererSettings;
-    if (settings?.container === false) return /*#__PURE__*/ react.createElement(NestedLayout, {
-        layout: field.layout
-    });
+    const formatters = useFieldValueFormatters();
     const focusInside = hasSubtreeFocusRequest(field.fields);
     const [open, setOpen] = useState(settings?.open ?? true);
     useEffect(()=>{
@@ -35,12 +14,15 @@ const ObjectRenderer = createObjectFieldRenderer(({ field })=>{
     }, [
         focusInside
     ]);
+    if (settings?.container === false) return /*#__PURE__*/ react.createElement(NestedLayout, {
+        layout: field.layout
+    });
     return /*#__PURE__*/ react.createElement(Accordion, {
         background: "base",
         variant: "container"
     }, /*#__PURE__*/ react.createElement(Accordion.Item, {
-        title: resolveTitle(field, settings?.itemTitle),
-        description: resolveDescription(field, settings?.itemDescription),
+        title: resolveItemTitle(field.fields, 0, field.label || "", settings?.itemTitle, formatters),
+        description: resolveItemDescription(field.fields, 0, settings?.itemDescription, formatters),
         open: open,
         onOpenChange: setOpen,
         className: "pl-sm"

package/base/Base/FieldRenderers/ObjectRenderer/ObjectRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"base/Base/FieldRenderers/ObjectRenderer/ObjectRenderer.js","sources":["../../../../../src/base/Base/FieldRenderers/ObjectRenderer/ObjectRenderer.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport { Accordion } from \"@webiny/admin-ui\";\nimport { createObjectFieldRenderer } from \"~/features/formModel/createFieldRenderer.js\";\nimport { NestedLayout } from \"./ObjectFieldComponents.js\";\nimport type { IObjectFieldVM } from \"~/features/formModel/index.js\";\nimport { hasSubtreeFocusRequest } from \"~/features/formModel/index.js\";\n\ndeclare module \"../../../../features/formModel/abstractions.js\" {\n    interface IFieldRendererRegistry {\n        objectAccordionSingle: {\n            fieldType: \"object\";\n            settings?: {\n                open?: boolean;\n                container?: boolean;\n                itemTitle?: string | ((data: Record<string, unknown>) => string);\n                itemDescription?: string | ((data: Record<string, unknown>) => string);\n            };\n        };\n    }\n}\n\nfunction resolveTitle(\n    field: IObjectFieldVM,\n    itemTitle: string | ((data: Record<string, unknown>) => string) | undefined\n): string | undefined {\n    if (!itemTitle) {\n        return field.label;\n    }\n\n    if (typeof itemTitle === \"string\") {\n        const child = field.fields.find(f => f.name === itemTitle);\n        return (child ? String(child.value ?? \"\") : \"\") || field.label;\n    }\n\n    const data: Record<string, unknown> = {};\n    for (const child of field.fields) {\n        data[child.name] = child.value;\n    }\n    return itemTitle(data) || field.label;\n}\n\nfunction resolveDescription(\n    field: IObjectFieldVM,\n    itemDescription: string | ((data: Record<string, unknown>) => string) | undefined\n): string | undefined {\n    if (!itemDescription) {\n        return undefined;\n    }\n\n    if (typeof itemDescription === \"string\") {\n        const child = field.fields.find(f => f.name === itemDescription);\n        return (child ? String(child.value ?? \"\") : \"\") || undefined;\n    }\n\n    const data: Record<string, unknown> = {};\n    for (const child of field.fields) {\n        data[child.name] = child.value;\n    }\n    return itemDescription(data) || undefined;\n}\n\nexport const ObjectRenderer = createObjectFieldRenderer<\"objectAccordionSingle\">(({ field }) => {\n    const settings = field.rendererSettings;\n\n    if (settings?.container === false) {\n        return <NestedLayout layout={field.layout} />;\n    }\n\n    // Force the object accordion open when a focus request lands anywhere in\n    // its subtree, so \"jump to field\" can cascade through collapsed levels.\n    const focusInside = hasSubtreeFocusRequest(field.fields);\n    const [open, setOpen] = useState(settings?.open ?? true);\n    useEffect(() => {\n        if (focusInside) {\n            setOpen(true);\n        }\n    }, [focusInside]);\n\n    return (\n        <Accordion background={\"base\"} variant={\"container\"}>\n            <Accordion.Item\n                title={resolveTitle(field, settings?.itemTitle)}\n                description={resolveDescription(field, settings?.itemDescription)}\n                open={open}\n                onOpenChange={setOpen}\n                className={\"pl-sm\"}\n            >\n                <NestedLayout layout={field.layout} />\n            </Accordion.Item>\n        </Accordion>\n    );\n});\n"],"names":["resolveTitle","field","itemTitle","child","f","String","data","resolveDescription","itemDescription","undefined","ObjectRenderer","createObjectFieldRenderer","settings","NestedLayout","focusInside","hasSubtreeFocusRequest","open","setOpen","useState","useEffect","Accordion"],"mappings":";;;;;AAqBA,SAASA,aACLC,KAAqB,EACrBC,SAA2E;IAE3E,IAAI,CAACA,WACD,OAAOD,MAAM,KAAK;IAGtB,IAAI,AAAqB,YAArB,OAAOC,WAAwB;QAC/B,MAAMC,QAAQF,MAAM,MAAM,CAAC,IAAI,CAACG,CAAAA,IAAKA,EAAE,IAAI,KAAKF;QAChD,OAAQC,AAAAA,CAAAA,QAAQE,OAAOF,MAAM,KAAK,IAAI,MAAM,EAAC,KAAMF,MAAM,KAAK;IAClE;IAEA,MAAMK,OAAgC,CAAC;IACvC,KAAK,MAAMH,SAASF,MAAM,MAAM,CAC5BK,IAAI,CAACH,MAAM,IAAI,CAAC,GAAGA,MAAM,KAAK;IAElC,OAAOD,UAAUI,SAASL,MAAM,KAAK;AACzC;AAEA,SAASM,mBACLN,KAAqB,EACrBO,eAAiF;IAEjF,IAAI,CAACA,iBACD;IAGJ,IAAI,AAA2B,YAA3B,OAAOA,iBAA8B;QACrC,MAAML,QAAQF,MAAM,MAAM,CAAC,IAAI,CAACG,CAAAA,IAAKA,EAAE,IAAI,KAAKI;QAChD,OAAQL,AAAAA,CAAAA,QAAQE,OAAOF,MAAM,KAAK,IAAI,MAAM,EAAC,KAAMM;IACvD;IAEA,MAAMH,OAAgC,CAAC;IACvC,KAAK,MAAMH,SAASF,MAAM,MAAM,CAC5BK,IAAI,CAACH,MAAM,IAAI,CAAC,GAAGA,MAAM,KAAK;IAElC,OAAOK,gBAAgBF,SAASG;AACpC;AAEO,MAAMC,iBAAiBC,0BAAmD,CAAC,EAAEV,KAAK,EAAE;IACvF,MAAMW,WAAWX,MAAM,gBAAgB;IAEvC,IAAIW,UAAU,cAAc,OACxB,OAAO,WAAP,GAAO,oBAACC,cAAYA;QAAC,QAAQZ,MAAM,MAAM;;IAK7C,MAAMa,cAAcC,uBAAuBd,MAAM,MAAM;IACvD,MAAM,CAACe,MAAMC,QAAQ,GAAGC,SAASN,UAAU,QAAQ;IACnDO,UAAU;QACN,IAAIL,aACAG,QAAQ;IAEhB,GAAG;QAACH;KAAY;IAEhB,OAAO,WAAP,GACI,oBAACM,WAASA;QAAC,YAAY;QAAQ,SAAS;qBACpC,oBAACA,UAAU,IAAI;QACX,OAAOpB,aAAaC,OAAOW,UAAU;QACrC,aAAaL,mBAAmBN,OAAOW,UAAU;QACjD,MAAMI;QACN,cAAcC;QACd,WAAW;qBAEX,oBAACJ,cAAYA;QAAC,QAAQZ,MAAM,MAAM;;AAIlD"}
+{"version":3,"file":"base/Base/FieldRenderers/ObjectRenderer/ObjectRenderer.js","sources":["../../../../../src/base/Base/FieldRenderers/ObjectRenderer/ObjectRenderer.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport { Accordion } from \"@webiny/admin-ui\";\nimport { createObjectFieldRenderer } from \"~/features/formModel/createFieldRenderer.js\";\nimport { NestedLayout, useFieldValueFormatters } from \"./ObjectFieldComponents.js\";\nimport { resolveItemDescription, resolveItemTitle } from \"./resolveItemTitle.js\";\nimport { hasSubtreeFocusRequest } from \"~/features/formModel/index.js\";\n\ndeclare module \"../../../../features/formModel/abstractions.js\" {\n    interface IFieldRendererRegistry {\n        objectAccordionSingle: {\n            fieldType: \"object\";\n            settings?: {\n                open?: boolean;\n                container?: boolean;\n                itemTitle?: string | ((data: Record<string, unknown>) => string);\n                itemDescription?: string | ((data: Record<string, unknown>) => string);\n            };\n        };\n    }\n}\n\nexport const ObjectRenderer = createObjectFieldRenderer<\"objectAccordionSingle\">(({ field }) => {\n    const settings = field.rendererSettings;\n    const formatters = useFieldValueFormatters();\n\n    // Force the object accordion open when a focus request lands anywhere in\n    // its subtree, so \"jump to field\" can cascade through collapsed levels.\n    const focusInside = hasSubtreeFocusRequest(field.fields);\n    const [open, setOpen] = useState(settings?.open ?? true);\n    useEffect(() => {\n        if (focusInside) {\n            setOpen(true);\n        }\n    }, [focusInside]);\n\n    if (settings?.container === false) {\n        return <NestedLayout layout={field.layout} />;\n    }\n\n    return (\n        <Accordion background={\"base\"} variant={\"container\"}>\n            <Accordion.Item\n                title={resolveItemTitle(\n                    field.fields,\n                    0,\n                    field.label || \"\",\n                    settings?.itemTitle,\n                    formatters\n                )}\n                description={resolveItemDescription(\n                    field.fields,\n                    0,\n                    settings?.itemDescription,\n                    formatters\n                )}\n                open={open}\n                onOpenChange={setOpen}\n                className={\"pl-sm\"}\n            >\n                <NestedLayout layout={field.layout} />\n            </Accordion.Item>\n        </Accordion>\n    );\n});\n"],"names":["ObjectRenderer","createObjectFieldRenderer","field","settings","formatters","useFieldValueFormatters","focusInside","hasSubtreeFocusRequest","open","setOpen","useState","useEffect","NestedLayout","Accordion","resolveItemTitle","resolveItemDescription"],"mappings":";;;;;;AAqBO,MAAMA,iBAAiBC,0BAAmD,CAAC,EAAEC,KAAK,EAAE;IACvF,MAAMC,WAAWD,MAAM,gBAAgB;IACvC,MAAME,aAAaC;IAInB,MAAMC,cAAcC,uBAAuBL,MAAM,MAAM;IACvD,MAAM,CAACM,MAAMC,QAAQ,GAAGC,SAASP,UAAU,QAAQ;IACnDQ,UAAU;QACN,IAAIL,aACAG,QAAQ;IAEhB,GAAG;QAACH;KAAY;IAEhB,IAAIH,UAAU,cAAc,OACxB,OAAO,WAAP,GAAO,oBAACS,cAAYA;QAAC,QAAQV,MAAM,MAAM;;IAG7C,OAAO,WAAP,GACI,oBAACW,WAASA;QAAC,YAAY;QAAQ,SAAS;qBACpC,oBAACA,UAAU,IAAI;QACX,OAAOC,iBACHZ,MAAM,MAAM,EACZ,GACAA,MAAM,KAAK,IAAI,IACfC,UAAU,WACVC;QAEJ,aAAaW,uBACTb,MAAM,MAAM,EACZ,GACAC,UAAU,iBACVC;QAEJ,MAAMI;QACN,cAAcC;QACd,WAAW;qBAEX,oBAACG,cAAYA;QAAC,QAAQV,MAAM,MAAM;;AAIlD"}

package/base/Base/FieldRenderers/ObjectRenderer/resolveItemTitle.d.ts

@@ -1,5 +1,10 @@
-import type { IObjectFieldItemVM } from "../../../../features/formModel/index.js";
+import type { IFieldValueFormatter, IFieldVM } from "../../../../features/formModel/index.js";
 type ItemStringSetting = string | ((data: Record<string, unknown>, index: number) => string);
-export declare function resolveItemTitle(item: IObjectFieldItemVM, index: number, label: string | undefined, itemTitle: ItemStringSetting | undefined): string;
-export declare function resolveItemDescription(item: IObjectFieldItemVM, index: number, itemDescription: ItemStringSetting | undefined): string | undefined;
+/**
+ * The text a field's value reads as in a summary. A formatter registered for the field's type
+ * wins; otherwise each value is printed, swapped for its option label when the field has options.
+ */
+export declare function formatFieldValue(field: IFieldVM, formatters: IFieldValueFormatter[]): string;
+export declare function resolveItemTitle(fields: IFieldVM[], index: number, fallback: string, itemTitle: ItemStringSetting | undefined, formatters: IFieldValueFormatter[]): string;
+export declare function resolveItemDescription(fields: IFieldVM[], index: number, itemDescription: ItemStringSetting | undefined, formatters: IFieldValueFormatter[]): string | undefined;
 export {};

package/base/Base/FieldRenderers/ObjectRenderer/resolveItemTitle.js

@@ -3,26 +3,34 @@ function fieldsToData(fields) {
     for (const field of fields)data[field.name] = field.value;
     return data;
 }
-function resolveItemTitle(item, index, label, itemTitle) {
-    const fallback = `${label || "Item"} #${index + 1}`;
-    if (!itemTitle) return fallback;
-    if ("string" == typeof itemTitle) {
-        const field = item.fields.find((f)=>f.name === itemTitle);
-        const value = field ? String(field.value ?? "") : "";
-        return value || fallback;
+function formatScalar(value, options) {
+    if (null == value || "object" == typeof value) return "";
+    const option = options?.find((o)=>String(o.value) === String(value));
+    return option ? option.label : String(value);
+}
+function formatFieldValue(field, formatters) {
+    const formatter = formatters.find((f)=>f.type === field.type);
+    if (formatter) return formatter.format(field) ?? "";
+    const values = Array.isArray(field.value) ? field.value : [
+        field.value
+    ];
+    return values.map((value)=>formatScalar(value, field.options)).filter(Boolean).join(", ");
+}
+function resolveSetting(fields, index, setting, formatters) {
+    if ("string" == typeof setting) {
+        const field = fields.find((f)=>f.name === setting);
+        return field ? formatFieldValue(field, formatters) : "";
     }
-    const data = fieldsToData(item.fields);
-    return itemTitle(data, index) || fallback;
+    return setting(fieldsToData(fields), index);
 }
-function resolveItemDescription(item, index, itemDescription) {
+function resolveItemTitle(fields, index, fallback, itemTitle, formatters) {
+    if (!itemTitle) return fallback;
+    return resolveSetting(fields, index, itemTitle, formatters) || fallback;
+}
+function resolveItemDescription(fields, index, itemDescription, formatters) {
     if (!itemDescription) return;
-    if ("string" == typeof itemDescription) {
-        const field = item.fields.find((f)=>f.name === itemDescription);
-        return field ? String(field.value ?? "") || void 0 : void 0;
-    }
-    const data = fieldsToData(item.fields);
-    return itemDescription(data, index) || void 0;
+    return resolveSetting(fields, index, itemDescription, formatters) || void 0;
 }
-export { resolveItemDescription, resolveItemTitle };
+export { formatFieldValue, resolveItemDescription, resolveItemTitle };
 
 //# sourceMappingURL=resolveItemTitle.js.map

package/base/Base/FieldRenderers/ObjectRenderer/resolveItemTitle.js.map

@@ -1 +1 @@
-{"version":3,"file":"base/Base/FieldRenderers/ObjectRenderer/resolveItemTitle.js","sources":["../../../../../src/base/Base/FieldRenderers/ObjectRenderer/resolveItemTitle.ts"],"sourcesContent":["import type { IFieldVM, IObjectFieldItemVM } from \"~/features/formModel/index.js\";\n\ntype ItemStringSetting = string | ((data: Record<string, unknown>, index: number) => string);\n\nfunction fieldsToData(fields: IFieldVM[]): Record<string, unknown> {\n    const data: Record<string, unknown> = {};\n    for (const field of fields) {\n        data[field.name] = field.value;\n    }\n    return data;\n}\n\nexport function resolveItemTitle(\n    item: IObjectFieldItemVM,\n    index: number,\n    label: string | undefined,\n    itemTitle: ItemStringSetting | undefined\n): string {\n    const fallback = `${label || \"Item\"} #${index + 1}`;\n\n    if (!itemTitle) {\n        return fallback;\n    }\n\n    if (typeof itemTitle === \"string\") {\n        const field = item.fields.find(f => f.name === itemTitle);\n        const value = field ? String(field.value ?? \"\") : \"\";\n        return value || fallback;\n    }\n\n    const data = fieldsToData(item.fields);\n    return itemTitle(data, index) || fallback;\n}\n\nexport function resolveItemDescription(\n    item: IObjectFieldItemVM,\n    index: number,\n    itemDescription: ItemStringSetting | undefined\n): string | undefined {\n    if (!itemDescription) {\n        return undefined;\n    }\n\n    if (typeof itemDescription === \"string\") {\n        const field = item.fields.find(f => f.name === itemDescription);\n        return field ? String(field.value ?? \"\") || undefined : undefined;\n    }\n\n    const data = fieldsToData(item.fields);\n    return itemDescription(data, index) || undefined;\n}\n"],"names":["fieldsToData","fields","data","field","resolveItemTitle","item","index","label","itemTitle","fallback","f","value","String","resolveItemDescription","itemDescription","undefined"],"mappings":"AAIA,SAASA,aAAaC,MAAkB;IACpC,MAAMC,OAAgC,CAAC;IACvC,KAAK,MAAMC,SAASF,OAChBC,IAAI,CAACC,MAAM,IAAI,CAAC,GAAGA,MAAM,KAAK;IAElC,OAAOD;AACX;AAEO,SAASE,iBACZC,IAAwB,EACxBC,KAAa,EACbC,KAAyB,EACzBC,SAAwC;IAExC,MAAMC,WAAW,GAAGF,SAAS,OAAO,EAAE,EAAED,QAAQ,GAAG;IAEnD,IAAI,CAACE,WACD,OAAOC;IAGX,IAAI,AAAqB,YAArB,OAAOD,WAAwB;QAC/B,MAAML,QAAQE,KAAK,MAAM,CAAC,IAAI,CAACK,CAAAA,IAAKA,EAAE,IAAI,KAAKF;QAC/C,MAAMG,QAAQR,QAAQS,OAAOT,MAAM,KAAK,IAAI,MAAM;QAClD,OAAOQ,SAASF;IACpB;IAEA,MAAMP,OAAOF,aAAaK,KAAK,MAAM;IACrC,OAAOG,UAAUN,MAAMI,UAAUG;AACrC;AAEO,SAASI,uBACZR,IAAwB,EACxBC,KAAa,EACbQ,eAA8C;IAE9C,IAAI,CAACA,iBACD;IAGJ,IAAI,AAA2B,YAA3B,OAAOA,iBAA8B;QACrC,MAAMX,QAAQE,KAAK,MAAM,CAAC,IAAI,CAACK,CAAAA,IAAKA,EAAE,IAAI,KAAKI;QAC/C,OAAOX,QAAQS,OAAOT,MAAM,KAAK,IAAI,OAAOY,SAAYA;IAC5D;IAEA,MAAMb,OAAOF,aAAaK,KAAK,MAAM;IACrC,OAAOS,gBAAgBZ,MAAMI,UAAUS;AAC3C"}
+{"version":3,"file":"base/Base/FieldRenderers/ObjectRenderer/resolveItemTitle.js","sources":["../../../../../src/base/Base/FieldRenderers/ObjectRenderer/resolveItemTitle.ts"],"sourcesContent":["import type { IFieldValueFormatter, IFieldVM, IValueOption } from \"~/features/formModel/index.js\";\n\ntype ItemStringSetting = string | ((data: Record<string, unknown>, index: number) => string);\n\nfunction fieldsToData(fields: IFieldVM[]): Record<string, unknown> {\n    const data: Record<string, unknown> = {};\n    for (const field of fields) {\n        data[field.name] = field.value;\n    }\n    return data;\n}\n\nfunction formatScalar(value: unknown, options: IValueOption[] | undefined): string {\n    if (value === null || value === undefined || typeof value === \"object\") {\n        return \"\";\n    }\n    // Predefined values store the option's value; the editor knows the option by its label.\n    const option = options?.find(o => String(o.value) === String(value));\n    return option ? option.label : String(value);\n}\n\n/**\n * The text a field's value reads as in a summary. A formatter registered for the field's type\n * wins; otherwise each value is printed, swapped for its option label when the field has options.\n */\nexport function formatFieldValue(field: IFieldVM, formatters: IFieldValueFormatter[]): string {\n    const formatter = formatters.find(f => f.type === field.type);\n    if (formatter) {\n        return formatter.format(field) ?? \"\";\n    }\n\n    const values = Array.isArray(field.value) ? field.value : [field.value];\n    return values\n        .map(value => formatScalar(value, field.options))\n        .filter(Boolean)\n        .join(\", \");\n}\n\nfunction resolveSetting(\n    fields: IFieldVM[],\n    index: number,\n    setting: ItemStringSetting,\n    formatters: IFieldValueFormatter[]\n): string {\n    if (typeof setting === \"string\") {\n        const field = fields.find(f => f.name === setting);\n        return field ? formatFieldValue(field, formatters) : \"\";\n    }\n\n    return setting(fieldsToData(fields), index);\n}\n\nexport function resolveItemTitle(\n    fields: IFieldVM[],\n    index: number,\n    fallback: string,\n    itemTitle: ItemStringSetting | undefined,\n    formatters: IFieldValueFormatter[]\n): string {\n    if (!itemTitle) {\n        return fallback;\n    }\n\n    return resolveSetting(fields, index, itemTitle, formatters) || fallback;\n}\n\nexport function resolveItemDescription(\n    fields: IFieldVM[],\n    index: number,\n    itemDescription: ItemStringSetting | undefined,\n    formatters: IFieldValueFormatter[]\n): string | undefined {\n    if (!itemDescription) {\n        return undefined;\n    }\n\n    return resolveSetting(fields, index, itemDescription, formatters) || undefined;\n}\n"],"names":["fieldsToData","fields","data","field","formatScalar","value","options","option","o","String","formatFieldValue","formatters","formatter","f","values","Array","Boolean","resolveSetting","index","setting","resolveItemTitle","fallback","itemTitle","resolveItemDescription","itemDescription","undefined"],"mappings":"AAIA,SAASA,aAAaC,MAAkB;IACpC,MAAMC,OAAgC,CAAC;IACvC,KAAK,MAAMC,SAASF,OAChBC,IAAI,CAACC,MAAM,IAAI,CAAC,GAAGA,MAAM,KAAK;IAElC,OAAOD;AACX;AAEA,SAASE,aAAaC,KAAc,EAAEC,OAAmC;IACrE,IAAID,QAAAA,SAAyC,AAAiB,YAAjB,OAAOA,OAChD,OAAO;IAGX,MAAME,SAASD,SAAS,KAAKE,CAAAA,IAAKC,OAAOD,EAAE,KAAK,MAAMC,OAAOJ;IAC7D,OAAOE,SAASA,OAAO,KAAK,GAAGE,OAAOJ;AAC1C;AAMO,SAASK,iBAAiBP,KAAe,EAAEQ,UAAkC;IAChF,MAAMC,YAAYD,WAAW,IAAI,CAACE,CAAAA,IAAKA,EAAE,IAAI,KAAKV,MAAM,IAAI;IAC5D,IAAIS,WACA,OAAOA,UAAU,MAAM,CAACT,UAAU;IAGtC,MAAMW,SAASC,MAAM,OAAO,CAACZ,MAAM,KAAK,IAAIA,MAAM,KAAK,GAAG;QAACA,MAAM,KAAK;KAAC;IACvE,OAAOW,OACF,GAAG,CAACT,CAAAA,QAASD,aAAaC,OAAOF,MAAM,OAAO,GAC9C,MAAM,CAACa,SACP,IAAI,CAAC;AACd;AAEA,SAASC,eACLhB,MAAkB,EAClBiB,KAAa,EACbC,OAA0B,EAC1BR,UAAkC;IAElC,IAAI,AAAmB,YAAnB,OAAOQ,SAAsB;QAC7B,MAAMhB,QAAQF,OAAO,IAAI,CAACY,CAAAA,IAAKA,EAAE,IAAI,KAAKM;QAC1C,OAAOhB,QAAQO,iBAAiBP,OAAOQ,cAAc;IACzD;IAEA,OAAOQ,QAAQnB,aAAaC,SAASiB;AACzC;AAEO,SAASE,iBACZnB,MAAkB,EAClBiB,KAAa,EACbG,QAAgB,EAChBC,SAAwC,EACxCX,UAAkC;IAElC,IAAI,CAACW,WACD,OAAOD;IAGX,OAAOJ,eAAehB,QAAQiB,OAAOI,WAAWX,eAAeU;AACnE;AAEO,SAASE,uBACZtB,MAAkB,EAClBiB,KAAa,EACbM,eAA8C,EAC9Cb,UAAkC;IAElC,IAAI,CAACa,iBACD;IAGJ,OAAOP,eAAehB,QAAQiB,OAAOM,iBAAiBb,eAAec;AACzE"}

package/base/Base/FieldRenderers/ObjectRenderer/resolveItemTitle.test.d.ts

@@ -0,0 +1 @@
+export {};