@m4l/components 9.71.0 → 9.71.1-beta-improvement-786-m4l-components-dynamic-form.0

package/components/DynamicForm/helpers/isRenderableDynamicFormField/isRenderableDynamicFormField.js

@@ -0,0 +1,8 @@
+import { isSupportedInformationalField as o } from "../fieldContractAllowlist/fieldContractAllowlist.js";
+import { isSectionField as i } from "../resolveFormSections/resolveFormSections.js";
+function e(r) {
+  return !i(r) && (o(r) || typeof r.name == "string" && r.name.trim() !== "");
+}
+export {
+  e as isRenderableDynamicFormField
+};

package/components/DynamicForm/helpers/resolveEmptyStateLabel/index.d.ts

@@ -0,0 +1,2 @@
+export { resolveEmptyStateLabel } from './resolveEmptyStateLabel';
+//# sourceMappingURL=index.d.ts.map

package/components/DynamicForm/helpers/resolveEmptyStateLabel/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/DynamicForm/helpers/resolveEmptyStateLabel/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC"}

package/components/DynamicForm/helpers/resolveEmptyStateLabel/resolveEmptyStateLabel.d.ts

@@ -0,0 +1,4 @@
+import { GetLabelType } from '@m4l/core';
+/** Resolve empty-state copy while a deployment's dictionary receives the new entries. */
+export declare function resolveEmptyStateLabel(getLabel: GetLabelType, key: string, fallback: string): string;
+//# sourceMappingURL=resolveEmptyStateLabel.d.ts.map

package/components/DynamicForm/helpers/resolveEmptyStateLabel/resolveEmptyStateLabel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolveEmptyStateLabel.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/DynamicForm/helpers/resolveEmptyStateLabel/resolveEmptyStateLabel.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAE9C,yFAAyF;AACzF,wBAAgB,sBAAsB,CACpC,QAAQ,EAAE,YAAY,EACtB,GAAG,EAAE,MAAM,EACX,QAAQ,EAAE,MAAM,GACf,MAAM,CAMR"}

package/components/DynamicForm/helpers/resolveEmptyStateLabel/resolveEmptyStateLabel.js

@@ -0,0 +1,7 @@
+function o(l, e, n) {
+  const t = l(e);
+  return !t || t === e || t === `ND:${e}` || t === `N_D:[${e}]` ? n : t;
+}
+export {
+  o as resolveEmptyStateLabel
+};

package/components/DynamicForm/slots/DynamicFormEnum.d.ts

@@ -8,6 +8,7 @@ export declare enum DynamicFormSlots {
     formTitle = "formTitle",
     formDescription = "formDescription",
     fieldsFlow = "fieldsFlow",
+    emptyState = "emptyState",
     sectionsGrid = "sectionsGrid",
     ungroupedCard = "ungroupedCard",
     fieldWrapper = "fieldWrapper",

package/components/DynamicForm/slots/DynamicFormEnum.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DynamicFormEnum.d.ts","sourceRoot":"","sources":["../../../../../../../packages/components/src/components/DynamicForm/slots/DynamicFormEnum.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,oBAAY,gBAAgB;IAC1B,WAAW,gBAAgB;IAC3B,YAAY,iBAAiB;IAC7B,UAAU,eAAe;IACzB,SAAS,cAAc;IACvB,eAAe,oBAAoB;IACnC,UAAU,eAAe;IACzB,YAAY,iBAAiB;IAC7B,aAAa,kBAAkB;IAC/B,YAAY,iBAAiB;IAC7B,cAAc,mBAAmB;IACjC,UAAU,eAAe;IACzB,KAAK,UAAU;IACf,UAAU,eAAe;IACzB,cAAc,mBAAmB;IACjC,oBAAoB,yBAAyB;IAC7C,mBAAmB,wBAAwB;CAC5C"}
+{"version":3,"file":"DynamicFormEnum.d.ts","sourceRoot":"","sources":["../../../../../../../packages/components/src/components/DynamicForm/slots/DynamicFormEnum.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,oBAAY,gBAAgB;IAC1B,WAAW,gBAAgB;IAC3B,YAAY,iBAAiB;IAC7B,UAAU,eAAe;IACzB,SAAS,cAAc;IACvB,eAAe,oBAAoB;IACnC,UAAU,eAAe;IACzB,UAAU,eAAe;IACzB,YAAY,iBAAiB;IAC7B,aAAa,kBAAkB;IAC/B,YAAY,iBAAiB;IAC7B,cAAc,mBAAmB;IACjC,UAAU,eAAe;IACzB,KAAK,UAAU;IACf,UAAU,eAAe;IACzB,cAAc,mBAAmB;IACjC,oBAAoB,yBAAyB;IAC7C,mBAAmB,wBAAwB;CAC5C"}

package/components/DynamicForm/slots/DynamicFormEnum.js

@@ -1,4 +1,4 @@
-var r = /* @__PURE__ */ ((e) => (e.contentRoot = "contentRoot", e.formProvider = "formProvider", e.formHeader = "formHeader", e.formTitle = "formTitle", e.formDescription = "formDescription", e.fieldsFlow = "fieldsFlow", e.sectionsGrid = "sectionsGrid", e.ungroupedCard = "ungroupedCard", e.fieldWrapper = "fieldWrapper", e.submitFeedback = "submitFeedback", e.actionsRow = "actionsRow", e.label = "label", e.helperText = "helperText", e.sectionDivider = "sectionDivider", e.checkableListWrapper = "checkableListWrapper", e.fallbackEndIconChip = "fallbackEndIconChip", e))(r || {});
+var r = /* @__PURE__ */ ((e) => (e.contentRoot = "contentRoot", e.formProvider = "formProvider", e.formHeader = "formHeader", e.formTitle = "formTitle", e.formDescription = "formDescription", e.fieldsFlow = "fieldsFlow", e.emptyState = "emptyState", e.sectionsGrid = "sectionsGrid", e.ungroupedCard = "ungroupedCard", e.fieldWrapper = "fieldWrapper", e.submitFeedback = "submitFeedback", e.actionsRow = "actionsRow", e.label = "label", e.helperText = "helperText", e.sectionDivider = "sectionDivider", e.checkableListWrapper = "checkableListWrapper", e.fallbackEndIconChip = "fallbackEndIconChip", e))(r || {});
 export {
   r as DynamicFormSlots
 };

package/components/DynamicForm/slots/DynamicFormSlots.d.ts

@@ -19,6 +19,9 @@ export declare const DynamicFormFormDescriptionStyled: import('@emotion/styled')
 export declare const DynamicFormFieldsFlowStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown> & {
     ownerState?: (Partial<import('../types').DynamicFormOwnerState> & Record<string, unknown>) | undefined;
 }, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const DynamicFormEmptyStateStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown> & {
+    ownerState?: (Partial<import('../types').DynamicFormOwnerState> & Record<string, unknown>) | undefined;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
 export declare const DynamicFormSectionsGridStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown> & {
     ownerState?: (Partial<import('../types').DynamicFormOwnerState> & Record<string, unknown>) | undefined;
 }, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;

package/components/DynamicForm/slots/DynamicFormSlots.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DynamicFormSlots.d.ts","sourceRoot":"","sources":["../../../../../../../packages/components/src/components/DynamicForm/slots/DynamicFormSlots.ts"],"names":[],"mappings":"AAOA,OAAO,EAAE,YAAY,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,sCAAsC,CAAC;AAC5G,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAGpD,eAAO,MAAM,iCAAiC;;UAGb,CAAC;AAGlC,eAAO,MAAM,6BAA6B,EAAmD,CAC3F,CAAC,SAAS,YAAY,EAEtB,KAAK,EAAE,mBAAmB,CAAC,CAAC,CAAC,GAAG,aAAa,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,KAChE,YAAY,CAAC;AAElB,eAAO,MAAM,4BAA4B;;6NAGT,CAAC;AAEjC,eAAO,MAAM,2BAA2B;;iNAGT,CAAC;AAEhC,eAAO,MAAM,0BAA0B;;UAGT,CAAC;AAE/B,eAAO,MAAM,gCAAgC;;UAGT,CAAC;AAErC,eAAO,MAAM,2BAA2B;;6NAGT,CAAC;AAEhC,eAAO,MAAM,6BAA6B;;6NAGT,CAAC;AAElC,eAAO,MAAM,8BAA8B;;6NAGT,CAAC;AAEnC,eAAO,MAAM,6BAA6B;;UAGT,CAAC;AAElC,eAAO,MAAM,+BAA+B;;UAGT,CAAC;AAEpC,eAAO,MAAM,2BAA2B;;UAGT,CAAC;AAEhC,eAAO,MAAM,sBAAsB;;6NAGT,CAAC;AAE3B,eAAO,MAAM,2BAA2B;;6NAGT,CAAC;AAEhC,eAAO,MAAM,+BAA+B;;6NAGT,CAAC;AAEpC,eAAO,MAAM,qCAAqC;;6NAGT,CAAC;AAE1C,eAAO,MAAM,oCAAoC;;UAGT,CAAC"}
+{"version":3,"file":"DynamicFormSlots.d.ts","sourceRoot":"","sources":["../../../../../../../packages/components/src/components/DynamicForm/slots/DynamicFormSlots.ts"],"names":[],"mappings":"AAOA,OAAO,EAAE,YAAY,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,sCAAsC,CAAC;AAC5G,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAGpD,eAAO,MAAM,iCAAiC;;UAGb,CAAC;AAGlC,eAAO,MAAM,6BAA6B,EAAmD,CAC3F,CAAC,SAAS,YAAY,EAEtB,KAAK,EAAE,mBAAmB,CAAC,CAAC,CAAC,GAAG,aAAa,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,KAChE,YAAY,CAAC;AAElB,eAAO,MAAM,4BAA4B;;6NAGT,CAAC;AAEjC,eAAO,MAAM,2BAA2B;;iNAGT,CAAC;AAEhC,eAAO,MAAM,0BAA0B;;UAGT,CAAC;AAE/B,eAAO,MAAM,gCAAgC;;UAGT,CAAC;AAErC,eAAO,MAAM,2BAA2B;;6NAGT,CAAC;AAEhC,eAAO,MAAM,2BAA2B;;6NAGT,CAAC;AAEhC,eAAO,MAAM,6BAA6B;;6NAGT,CAAC;AAElC,eAAO,MAAM,8BAA8B;;6NAGT,CAAC;AAEnC,eAAO,MAAM,6BAA6B;;UAGT,CAAC;AAElC,eAAO,MAAM,+BAA+B;;UAGT,CAAC;AAEpC,eAAO,MAAM,2BAA2B;;UAGT,CAAC;AAEhC,eAAO,MAAM,sBAAsB;;6NAGT,CAAC;AAE3B,eAAO,MAAM,2BAA2B;;6NAGT,CAAC;AAEhC,eAAO,MAAM,+BAA+B;;6NAGT,CAAC;AAEpC,eAAO,MAAM,qCAAqC;;6NAGT,CAAC;AAE1C,eAAO,MAAM,oCAAoC;;UAGT,CAAC"}

package/components/DynamicForm/slots/DynamicFormSlots.js

@@ -2,76 +2,80 @@ import { styled as o } from "@mui/material/styles";
 import { Box as m } from "@mui/material";
 import { Typography as i } from "@m4l/base";
 import { DynamicFormSlots as e } from "./DynamicFormEnum.js";
-import { componentStyles as r } from "../DynamicForm.styles.js";
-import { DYNAMIC_FORM_KEY_COMPONENT as t } from "../constants.js";
+import { componentStyles as t } from "../DynamicForm.styles.js";
+import { DYNAMIC_FORM_KEY_COMPONENT as r } from "../constants.js";
 import { RHFormProvider as n } from "../../hook-form/RHFormProvider/RHFormProvider.js";
 import { Chip as a } from "../../Chip/Chip.js";
 const l = o(n, {
-  name: t,
+  name: r,
   slot: e.formProvider
-})(r?.formProvider), S = l, v = o("div", {
-  name: t,
+})(t?.formProvider), S = l, v = o("div", {
+  name: r,
   slot: e.contentRoot
-})(r?.contentRoot), b = o("header", {
-  name: t,
+})(t?.contentRoot), b = o("header", {
+  name: r,
   slot: e.formHeader
-})(r?.formHeader), h = o(i, {
-  name: t,
+})(t?.formHeader), h = o(i, {
+  name: r,
   slot: e.formTitle
-})(r?.formTitle), C = o(i, {
-  name: t,
+})(t?.formTitle), C = o(i, {
+  name: r,
   slot: e.formDescription
-})(r?.formDescription), k = o("div", {
-  name: t,
+})(t?.formDescription), k = o("div", {
+  name: r,
   slot: e.fieldsFlow
-})(r?.fieldsFlow), u = o("div", {
-  name: t,
+})(t?.fieldsFlow), u = o("div", {
+  name: r,
+  slot: e.emptyState
+})(t?.emptyState), R = o("div", {
+  name: r,
   slot: e.sectionsGrid
-})(r?.sectionsGrid), R = o("div", {
-  name: t,
+})(t?.sectionsGrid), T = o("div", {
+  name: r,
   slot: e.ungroupedCard
-})(r?.ungroupedCard), T = o(m, {
-  name: t,
+})(t?.ungroupedCard), w = o(m, {
+  name: r,
   slot: e.fieldWrapper
-})(r?.fieldWrapper), w = o(m, {
-  name: t,
+})(t?.fieldWrapper), E = o(m, {
+  name: r,
   slot: e.submitFeedback
-})(r?.submitFeedback), P = o(m, {
-  name: t,
+})(t?.submitFeedback), P = o(m, {
+  name: r,
   slot: e.actionsRow
-})(r?.actionsRow);
+})(t?.actionsRow);
 o("div", {
-  name: t,
+  name: r,
   slot: e.label
-})(r?.label);
+})(t?.label);
 o("div", {
-  name: t,
+  name: r,
   slot: e.helperText
-})(r?.helperText);
+})(t?.helperText);
 o("div", {
-  name: t,
+  name: r,
   slot: e.sectionDivider
-})(r?.sectionDivider);
+})(t?.sectionDivider);
 const W = o("div", {
-  name: t,
+  name: r,
   slot: e.checkableListWrapper
-})(r?.checkableListWrapper), E = o(a, {
-  name: t,
+})(t?.checkableListWrapper), g = o(a, {
+  name: r,
   slot: e.fallbackEndIconChip
-})(r?.fallbackEndIconChip);
+})(t?.fallbackEndIconChip);
 export {
   P as DynamicFormActionsRowStyled,
   W as DynamicFormCheckableListWrapperStyled,
   v as DynamicFormContentRootStyled,
-  E as DynamicFormFallbackEndIconChipStyled,
-  T as DynamicFormFieldWrapperStyled,
+  u as DynamicFormEmptyStateStyled,
+  g as DynamicFormFallbackEndIconChipStyled,
+  w as DynamicFormFieldWrapperStyled,
   k as DynamicFormFieldsFlowStyled,
   C as DynamicFormFormDescriptionStyled,
   b as DynamicFormFormHeaderStyled,
   S as DynamicFormFormProviderStyled,
   l as DynamicFormFormProviderStyledBase,
   h as DynamicFormFormTitleStyled,
-  u as DynamicFormSectionsGridStyled,
-  w as DynamicFormSubmitFeedbackStyled,
-  R as DynamicFormUngroupedCardStyled
+  R as DynamicFormSectionsGridStyled,
+  E as DynamicFormSubmitFeedbackStyled,
+  T as DynamicFormUngroupedCardStyled
 };

package/components/DynamicForm/subcomponents/DynamicFormContent/DynamicFormContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DynamicFormContent.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/DynamicForm/subcomponents/DynamicFormContent/DynamicFormContent.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EACV,uBAAuB,EAExB,MAAM,aAAa,CAAC;AAerB,eAAO,MAAM,kBAAkB,oHAqL7B,CAAC"}
+{"version":3,"file":"DynamicFormContent.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/DynamicForm/subcomponents/DynamicFormContent/DynamicFormContent.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EACV,uBAAuB,EAExB,MAAM,aAAa,CAAC;AAgBrB,eAAO,MAAM,kBAAkB,oHAgN7B,CAAC"}

package/components/DynamicForm/subcomponents/DynamicFormContent/DynamicFormContent.js

@@ -1,82 +1,86 @@
-import { jsx as o, jsxs as N } from "@emotion/react/jsx-runtime";
-import { forwardRef as H, useMemo as b } from "react";
-import k from "clsx";
-import { useModuleDictionary as U } from "@m4l/core";
-import { NotificationCheckCircleFill as B, NotificationWarningFill as G } from "@m4l/icons";
-import { Icon as P } from "@m4l/base";
-import { TEST_PROP_ID as W } from "../../../../test/constants_no_mock.js";
-import { ActionsContainer as Y } from "../../../CommonActions/components/ActionsContainer/ActionsContainer.js";
-import { ActionFormIntro as j } from "../../../CommonActions/components/ActionFormIntro/ActionFormIntro.js";
-import { useDynamicFormConditionals as L } from "../../hooks/useDynamicFormConditionals/useDynamicFormConditionals.js";
-import { DYNAMIC_FORM_DICTIONARY as f } from "../../dictionary.js";
-import { DYNAMIC_FORM_CLASSES as l } from "../../constants.js";
-import { DynamicFormFieldsFlow as V } from "../DynamicFormFieldsFlow/DynamicFormFieldsFlow.js";
-import { DynamicFormSection as q } from "../DynamicFormSection/DynamicFormSection.js";
-import { DynamicFormSectionsGridStyled as J, DynamicFormSubmitFeedbackStyled as K, DynamicFormContentRootStyled as Q, DynamicFormFormHeaderStyled as X, DynamicFormFormTitleStyled as Z, DynamicFormFormDescriptionStyled as $, DynamicFormUngroupedCardStyled as oo, DynamicFormActionsRowStyled as eo } from "../../slots/DynamicFormSlots.js";
-import { resolveFormHeader as ro } from "../../helpers/resolveFormHeader/resolveFormHeader.js";
-import { resolveFormSections as to } from "../../helpers/resolveFormSections/resolveFormSections.js";
-import { Chip as g } from "../../../Chip/Chip.js";
-const io = H((_, E) => {
+import { jsx as e, jsxs as g } from "@emotion/react/jsx-runtime";
+import { forwardRef as G, useMemo as b } from "react";
+import P from "clsx";
+import { useModuleDictionary as V } from "@m4l/core";
+import { NotificationCheckCircleFill as W, NotificationWarningFill as j, LegacyS3NoItemSelectedNoSelectedOutlined as q } from "@m4l/icons";
+import { Icon as J } from "@m4l/base";
+import { TEST_PROP_ID as K } from "../../../../test/constants_no_mock.js";
+import { ActionsContainer as Q } from "../../../CommonActions/components/ActionsContainer/ActionsContainer.js";
+import { ActionFormIntro as X } from "../../../CommonActions/components/ActionFormIntro/ActionFormIntro.js";
+import { useDynamicFormConditionals as Z } from "../../hooks/useDynamicFormConditionals/useDynamicFormConditionals.js";
+import { DYNAMIC_FORM_DICTIONARY as s, DYNAMIC_FORM_EMPTY_STATE_LABELS as T } from "../../dictionary.js";
+import { DYNAMIC_FORM_CLASSES as n } from "../../constants.js";
+import { DynamicFormFieldsFlow as $ } from "../DynamicFormFieldsFlow/DynamicFormFieldsFlow.js";
+import { DynamicFormSection as ee } from "../DynamicFormSection/DynamicFormSection.js";
+import { DynamicFormSectionsGridStyled as oe, DynamicFormSubmitFeedbackStyled as te, DynamicFormContentRootStyled as re, DynamicFormFormHeaderStyled as ie, DynamicFormFormTitleStyled as se, DynamicFormFormDescriptionStyled as ne, DynamicFormEmptyStateStyled as ce, DynamicFormUngroupedCardStyled as ae, DynamicFormActionsRowStyled as le } from "../../slots/DynamicFormSlots.js";
+import { isRenderableDynamicFormField as me } from "../../helpers/isRenderableDynamicFormField/isRenderableDynamicFormField.js";
+import { resolveFormHeader as de } from "../../helpers/resolveFormHeader/resolveFormHeader.js";
+import { ImageText as pe } from "../../../ImageText/ImageText.js";
+import { resolveEmptyStateLabel as A } from "../../helpers/resolveEmptyStateLabel/resolveEmptyStateLabel.js";
+import { resolveFormSections as Se } from "../../helpers/resolveFormSections/resolveFormSections.js";
+import { Chip as M } from "../../../Chip/Chip.js";
+const fe = G((R, O) => {
   const {
-    data: s,
-    contractIssues: R = [],
-    currentSize: r,
-    fieldWrapperClassName: F,
-    dataTestId: T,
+    data: c,
+    contractIssues: v = [],
+    currentSize: o,
+    fieldWrapperClassName: y,
+    dataTestId: L,
     dataMeta: u,
-    coupled: S = !1,
-    actionFormIntroProps: A,
-    renderActions: y,
-    readOnly: t = !1,
-    suppressFormHeader: M = !0,
+    coupled: h = !1,
+    actionFormIntroProps: w,
+    renderActions: I,
+    readOnly: r = !1,
+    suppressFormHeader: z = !0,
     submitFeedbackStatus: i,
-    fieldFlow: n = "responsiveWrap"
-  } = _, { getLabel: h } = U(), { visibleFields: C } = L(s), c = M ? null : ro(s.form), a = b(
-    () => to(s.fields ?? []),
-    [s.fields]
-  ), v = new Set(C.map((e) => e.id)), D = C.filter((e) => !a.ownerByFieldId.has(e.id)), m = b(
+    statusLoad: D = "ready",
+    fieldFlow: a = "responsiveWrap"
+  } = R, { getLabel: l } = V(), { visibleFields: x } = Z(c), p = x.filter(me), E = p.length > 0, C = !E && (D === "ready" || D === "new"), m = z || C ? null : de(c.form), S = b(
+    () => Se(c.fields ?? []),
+    [c.fields]
+  ), B = new Set(p.map((t) => t.id)), _ = p.filter((t) => !S.ownerByFieldId.has(t.id)), d = b(
     () => ({
-      size: r,
-      readOnly: t,
-      fieldFlow: n
+      size: o,
+      readOnly: r,
+      fieldFlow: a
     }),
-    [r, n, t]
-  ), d = a.sections.map(({ field: e, fields: p }) => ({
-    section: e,
-    fields: p.filter((x) => v.has(x.id))
-  })).filter(({ fields: e }) => e.length > 0), O = d.length > 0 ? /* @__PURE__ */ o(J, { ownerState: m, children: d.map(({ section: e, fields: p }) => /* @__PURE__ */ o(
-    q,
+    [o, a, r]
+  ), f = S.sections.map(({ field: t, fields: F }) => ({
+    section: t,
+    fields: F.filter((k) => B.has(k.id))
+  })).filter(({ fields: t }) => t.length > 0), H = f.length > 0 ? /* @__PURE__ */ e(oe, { ownerState: d, children: f.map(({ section: t, fields: F }) => /* @__PURE__ */ e(
+    ee,
     {
-      section: e,
-      fields: p,
-      currentSize: r,
-      fieldWrapperClassName: F,
-      fieldFlow: n,
-      readOnly: t,
-      ownerState: m
+      section: t,
+      fields: F,
+      currentSize: o,
+      fieldWrapperClassName: y,
+      fieldFlow: a,
+      readOnly: r,
+      ownerState: d
     },
-    e.id
-  )) }) : null, I = /* @__PURE__ */ o(
-    V,
+    t.id
+  )) }) : null, N = /* @__PURE__ */ e(
+    $,
     {
-      fields: D,
-      currentSize: r,
-      fieldWrapperClassName: F,
-      fieldFlow: n,
-      readOnly: t,
-      ownerState: m
+      fields: _,
+      currentSize: o,
+      fieldWrapperClassName: y,
+      fieldFlow: a,
+      readOnly: r,
+      ownerState: d
     }
-  ), w = R.length > 0 || a.issues.length > 0, z = !S && i ? /* @__PURE__ */ o(K, { children: /* @__PURE__ */ o(
-    g,
+  ), U = v.length > 0 || S.issues.length > 0, Y = !h && i ? /* @__PURE__ */ e(te, { children: /* @__PURE__ */ e(
+    M,
     {
-      size: r,
-      label: h(
-        i === "success" ? f.SUBMIT_SUCCESS_MESSAGE : f.SUBMIT_ERROR_MESSAGE
+      size: o,
+      label: l(
+        i === "success" ? s.SUBMIT_SUCCESS_MESSAGE : s.SUBMIT_ERROR_MESSAGE
       ),
-      startIcon: /* @__PURE__ */ o(
-        P,
+      startIcon: /* @__PURE__ */ e(
+        J,
         {
-          src: i === "success" ? /* @__PURE__ */ o(B, {}) : /* @__PURE__ */ o(G, {}),
+          src: i === "success" ? /* @__PURE__ */ e(W, {}) : /* @__PURE__ */ e(j, {}),
           color: i === "success" ? "chips.success.contained.color" : "chips.error.contained.color"
         }
       ),
@@ -84,69 +88,94 @@ const io = H((_, E) => {
       opacity: !0
     }
   ) }) : null;
-  return /* @__PURE__ */ N(
-    Q,
+  return /* @__PURE__ */ g(
+    re,
     {
-      ref: E,
-      ownerState: m,
-      className: k(l.contentRoot),
+      ref: O,
+      ownerState: d,
+      className: P(n.contentRoot),
       ...typeof u == "string" ? { "data-meta": u } : {},
-      ...process.env.NODE_ENV !== "production" ? { [W]: T } : {},
+      ...process.env.NODE_ENV !== "production" ? { [K]: L } : {},
       children: [
-        c?.title && /* @__PURE__ */ N(
-          X,
+        m?.title && /* @__PURE__ */ g(
+          ie,
           {
-            className: l.formHeader,
+            className: n.formHeader,
             children: [
-              /* @__PURE__ */ o(
-                Z,
+              /* @__PURE__ */ e(
+                se,
                 {
-                  className: l.formTitle,
+                  className: n.formTitle,
                   component: "h2",
-                  size: r,
+                  size: o,
                   variant: "paragraphDens",
-                  children: c.title
+                  children: m.title
                 }
               ),
-              c.description && /* @__PURE__ */ o(
-                $,
+              m.description && /* @__PURE__ */ e(
+                ne,
                 {
-                  className: l.formDescription,
+                  className: n.formDescription,
                   color: "text.secondary",
                   component: "p",
-                  size: r,
+                  size: o,
                   variant: "bodyStandard",
-                  children: c.description
+                  children: m.description
                 }
               )
             ]
           }
         ),
-        w && /* @__PURE__ */ o(
-          g,
+        U && /* @__PURE__ */ e(
+          M,
           {
-            size: r,
-            label: h(f.SECTION_CONTRACT_NOTICE),
+            size: o,
+            label: l(s.SECTION_CONTRACT_NOTICE),
             color: "warning",
             opacity: !0
           }
         ),
-        O,
-        d.length > 0 ? D.length > 0 && /* @__PURE__ */ o(oo, { children: I }) : I,
-        !S && !t && /* @__PURE__ */ o(eo, { children: /* @__PURE__ */ o(Y, { children: y ? y() : /* @__PURE__ */ o(
-          j,
+        C && /* @__PURE__ */ e(
+          ce,
+          {
+            className: n.emptyState,
+            role: "status",
+            "aria-live": "polite",
+            children: /* @__PURE__ */ e(
+              pe,
+              {
+                size: o,
+                title: A(
+                  l,
+                  s.NO_VISIBLE_FIELDS_TITLE,
+                  T.title
+                ),
+                message: A(
+                  l,
+                  s.NO_VISIBLE_FIELDS_MESSAGE,
+                  T.message
+                ),
+                imageUrl: /* @__PURE__ */ e(q, {})
+              }
+            )
+          }
+        ),
+        H,
+        f.length > 0 ? _.length > 0 && /* @__PURE__ */ e(ae, { children: N }) : N,
+        !h && !r && E && /* @__PURE__ */ e(le, { children: /* @__PURE__ */ e(Q, { children: I ? I() : /* @__PURE__ */ e(
+          X,
           {
-            size: r,
+            size: o,
             color: "default",
-            ...A
+            ...w
           }
         ) }) }),
-        z
+        Y
       ]
     }
   );
 });
-io.displayName = "DynamicFormContent";
+fe.displayName = "DynamicFormContent";
 export {
-  io as DynamicFormContent
+  fe as DynamicFormContent
 };

package/components/DynamicForm/subcomponents/DynamicFormFieldsFlow/DynamicFormFieldsFlow.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DynamicFormFieldsFlow.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/DynamicForm/subcomponents/DynamicFormFieldsFlow/DynamicFormFieldsFlow.tsx"],"names":[],"mappings":"AAmBA,OAAO,KAAK,EAGV,0BAA0B,EAC3B,MAAM,SAAS,CAAC;AAmIjB,qFAAqF;AACrF,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,0BAA0B,+DAmDtE"}
+{"version":3,"file":"DynamicFormFieldsFlow.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/DynamicForm/subcomponents/DynamicFormFieldsFlow/DynamicFormFieldsFlow.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAGV,0BAA0B,EAC3B,MAAM,SAAS,CAAC;AAmIjB,qFAAqF;AACrF,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,0BAA0B,+DAmDtE"}

package/components/DynamicForm/subcomponents/DynamicFormFieldsFlow/DynamicFormFieldsFlow.js

@@ -1,28 +1,29 @@
 import { jsx as m } from "@emotion/react/jsx-runtime";
 import { memo as W } from "react";
 import L from "clsx";
-import { useModuleDictionary as b, useEnvironment as g } from "@m4l/core";
-import { PropertyValue as C } from "../../../PropertyValue/PropertyValue.js";
-import { resolveFieldRenderHelperMessage as D } from "../../helpers/resolveFieldRenderHelperMessage/resolveFieldRenderHelperMessage.js";
-import { resolveFieldInputLabel as O } from "../../helpers/resolveFieldInputLabel/resolveFieldInputLabel.js";
-import { resolveAdaptiveFieldLayout as R } from "../../helpers/resolveAdaptiveFieldLayout/resolveAdaptiveFieldLayout.js";
+import { useModuleDictionary as b, useEnvironment as D } from "@m4l/core";
+import { PropertyValue as R } from "../../../PropertyValue/PropertyValue.js";
+import { resolveFieldRenderHelperMessage as g } from "../../helpers/resolveFieldRenderHelperMessage/resolveFieldRenderHelperMessage.js";
+import { resolveFieldInputLabel as C } from "../../helpers/resolveFieldInputLabel/resolveFieldInputLabel.js";
+import { resolveAdaptiveFieldLayout as O } from "../../helpers/resolveAdaptiveFieldLayout/resolveAdaptiveFieldLayout.js";
 import { DYNAMIC_FORM_CLASSES as S } from "../../constants.js";
 import { DynamicFormFieldsFlowStyled as M, DynamicFormFieldWrapperStyled as I } from "../../slots/DynamicFormSlots.js";
 import { isSupportedInformationalField as N } from "../../helpers/fieldContractAllowlist/fieldContractAllowlist.js";
-import { resolveFieldReadOnly as _, resolveFieldMandatory as E } from "../../helpers/resolveFieldContractAliases/resolveFieldContractAliases.js";
-import { resolveFieldComponent as G } from "../../helpers/resolveFieldComponent/resolveFieldComponent.js";
-const A = /* @__PURE__ */ new Set([
+import { isRenderableDynamicFormField as _ } from "../../helpers/isRenderableDynamicFormField/isRenderableDynamicFormField.js";
+import { resolveFieldReadOnly as E, resolveFieldMandatory as G } from "../../helpers/resolveFieldContractAliases/resolveFieldContractAliases.js";
+import { resolveFieldComponent as A } from "../../helpers/resolveFieldComponent/resolveFieldComponent.js";
+const H = /* @__PURE__ */ new Set([
   "RHFCheckableList"
 ]);
-function H(a) {
+function z(a) {
   const o = a.fieldType?.componentId;
-  return o && A.has(o) ? "verticalGrow" : "default";
+  return o && H.has(o) ? "verticalGrow" : "default";
 }
-function z(a) {
+function x(a) {
   const o = [];
   let e = [];
   return a.forEach((l) => {
-    const i = H(l);
+    const i = z(l);
     if (i === "verticalGrow") {
       e.length > 0 && (o.push({ layout: "default", fields: e }), e = []), o.push({ layout: i, fields: [l] });
       return;
@@ -38,16 +39,16 @@ const y = W(function(o) {
     fieldFlow: u,
     layout: p,
     readOnly: F = !1
-  } = o, { getLabel: t } = b(), { host_api_remote: c } = g(), r = p === "verticalGrow", n = N(e);
-  if (!n && (typeof e.name != "string" || e.name.trim() === ""))
+  } = o, { getLabel: t } = b(), { host_api_remote: c } = D(), r = p === "verticalGrow", n = N(e);
+  if (!_(e))
     return null;
-  const s = _(e, F), h = n ? void 0 : D(e, t), v = n ? typeof e.label == "string" ? e.label : "" : O(e, t), w = E(e), d = R({
+  const s = E(e, F), h = n ? void 0 : g(e, t), v = n ? typeof e.label == "string" ? e.label : "" : C(e, t), w = G(e), d = O({
     hasHelperMessage: !s && !!h,
     label: n ? "" : v,
     mandatory: !n && !s && w,
     requestedSemanticWidth: e.metadata?.semanticWidth,
     size: l
-  }), f = G(e, {
+  }), f = A(e, {
     size: l,
     getLabel: t,
     hostApiRemote: c,
@@ -68,7 +69,7 @@ const y = W(function(o) {
       },
       className: L(i, S.fieldWrapper),
       children: n ? f : /* @__PURE__ */ m(
-        C,
+        R,
         {
           controlWidth: d.controlWidth,
           labelOverflow: "visible",
@@ -87,7 +88,7 @@ const y = W(function(o) {
   ) : null;
 });
 y.displayName = "DynamicFormFieldRow";
-function U(a) {
+function Z(a) {
   const {
     fields: o,
     currentSize: e,
@@ -96,7 +97,7 @@ function U(a) {
     readOnly: u,
     ownerState: p
   } = a;
-  return z(o).map((t) => {
+  return x(o).map((t) => {
     if (t.layout === "verticalGrow") {
       const r = t.fields[0];
       return r ? /* @__PURE__ */ m(
@@ -136,5 +137,5 @@ function U(a) {
   });
 }
 export {
-  U as DynamicFormFieldsFlow
+  Z as DynamicFormFieldsFlow
 };

package/components/DynamicForm/types.d.ts

@@ -653,6 +653,7 @@ interface DynamicFormPropsBase {
     /**
      * When true, omits the form metadata header from the rendered layout while
      * preserving the provided form data unchanged. Defaults to true.
+     * The empty state always omits this header, including when this flag is false.
      */
     suppressFormHeader?: boolean;
     /**
@@ -681,14 +682,15 @@ interface DynamicFormPropsBase {
     fieldFlow?: DynamicFormFieldFlow;
     /**
      * Props to customize ActionFormIntro.
-     * Only used when coupled is false (decoupled mode).
+     * Only used for decoupled, editable forms with visible renderable fields.
      * If not provided, default values are used.
      */
     actionFormIntroProps?: Partial<ActionsFormIntroProps>;
     /**
      * Custom render for form actions.
-     * Only used when coupled is false (decoupled mode).
-     * If provided, replaces the default ActionsContainer and ActionFormIntro.
+     * Only called for decoupled, editable forms with visible renderable fields.
+     * If provided, replaces ActionFormIntro inside the existing ActionsContainer.
+     * The whole slot, including custom navigation, is omitted when no fields are visible.
      */
     renderActions?: () => ReactNode;
 }
@@ -769,6 +771,8 @@ export type DynamicFormRef = RHFormProviderRef<DynamicFormValues>;
  */
 export interface DynamicFormContentProps {
     data: DynamicFormApiResponse;
+    /** Delay the empty state until the form's field values have finished loading. */
+    statusLoad?: FormStatusLoad;
     /** Structural backend issues found before option hydration. */
     contractIssues?: import('./helpers/resolveFormSections/types').FormSectionIssue[];
     currentSize: 'small' | 'medium';