@m4l/components 9.60.0 → 9.61.0-beta-hotfix-semantic-width-dynamicform.0

package/components/DynamicForm/helpers/resolveAdaptiveFieldLayout/resolveAdaptiveFieldLayout.js

@@ -0,0 +1,174 @@
+import { isFullRowSemanticWidth as M, resolveSemanticWidthPx as _ } from "../../../PropertyValue/semanticWidth.js";
+const s = {
+  narrow: 0.28,
+  normal: 0.6,
+  punctuation: 0.28,
+  space: 0.26,
+  thin: 0.38,
+  uppercase: 0.68,
+  wide: 0.86
+}, A = {
+  small: {
+    fontSize: 10,
+    helperIcon: 18,
+    letterSpacing: 0.8,
+    mandatoryMarker: 9,
+    safetyBuffer: 2
+  },
+  medium: {
+    fontSize: 11,
+    helperIcon: 20,
+    letterSpacing: 0.8,
+    mandatoryMarker: 10,
+    safetyBuffer: 2
+  }
+}, C = 796, l = 37, u = 16, m = 24, W = 0.06, H = [
+  { columns: 22, maxContainerWidth: 1255 },
+  { columns: 20, maxContainerWidth: 1149 },
+  { columns: 18, maxContainerWidth: 1043 },
+  { columns: 16, maxContainerWidth: 937 },
+  { columns: 14, maxContainerWidth: 831 },
+  { columns: 12, maxContainerWidth: 725 },
+  { columns: 10, maxContainerWidth: 619 },
+  { columns: 8, maxContainerWidth: 513 },
+  { columns: 6, maxContainerWidth: 407 },
+  { columns: 4, maxContainerWidth: 359 },
+  { columns: 3, maxContainerWidth: 343 },
+  { columns: 2, maxContainerWidth: 335 },
+  { columns: 1, maxContainerWidth: 319 }
+], p = "ijlI|!", I = ".,;:'", R = "ftr()[]{}/\\", N = "mwMW@%#&";
+function E(n) {
+  const { hasHelperMessage: t = !1, label: e, mandatory: i = !1, size: o } = n, r = A[o], c = Array.from(e), S = c.reduce((f, h) => f + G(h), 0) * r.fontSize + c.length * r.letterSpacing;
+  return Math.ceil(
+    S + r.safetyBuffer + (i ? r.mandatoryMarker : 0) + (t ? r.helperIcon : 0)
+  );
+}
+function L(n) {
+  const { requestedSemanticWidth: t } = n, e = E(n), i = _(t);
+  if (M(t))
+    return {
+      controlWidth: i,
+      estimatedLabelWidth: e,
+      gridColumnSpan: m,
+      isFullWidth: !0,
+      requestedSemanticWidth: t
+    };
+  if (!i || e > C)
+    return {
+      controlWidth: i,
+      estimatedLabelWidth: e,
+      gridColumnSpan: m,
+      isFullWidth: !0,
+      requestedSemanticWidth: t
+    };
+  const o = Math.max(i, e), r = e <= i ? i : F(o);
+  return r ? {
+    controlWidth: i,
+    estimatedLabelWidth: e,
+    gridColumnSpan: x(
+      r,
+      i
+    ),
+    isFullWidth: !1,
+    labelWidth: r,
+    requestedSemanticWidth: t,
+    wrapperWidth: r
+  } : {
+    controlWidth: i,
+    estimatedLabelWidth: e,
+    gridColumnSpan: m,
+    isFullWidth: !0,
+    requestedSemanticWidth: t
+  };
+}
+function F(n) {
+  if (!(!Number.isFinite(n) || n <= 0) && !(n > C))
+    return Math.ceil(n);
+}
+function x(n, t = n) {
+  if (!Number.isFinite(n))
+    return m;
+  const e = a(
+    Math.ceil(
+      (n + u) / (l + u)
+    )
+  ), i = Number.isFinite(t) ? t : n, o = a(
+    Math.ceil(
+      (i + u) / (l + u)
+    )
+  ), r = Math.max(o, e - 1);
+  return r < e && D(n, r) ? r : e;
+}
+function P(n, t) {
+  return Math.min(
+    a(n),
+    a(t)
+  );
+}
+function d(n) {
+  const t = a(n);
+  return t * l + (t - 1) * u;
+}
+function T(n, t, e) {
+  const i = a(t), o = Math.min(
+    a(n),
+    i
+  );
+  if (!Number.isFinite(e) || e <= 0)
+    return d(o);
+  const r = (i - 1) * u, c = Math.max(0, e - r) / i;
+  return o * c + (o - 1) * u;
+}
+function b(n, t, e) {
+  if (!Number.isFinite(n) || n <= 0)
+    return 0;
+  const i = a(e), o = Math.min(
+    a(t),
+    i
+  );
+  return Math.ceil(
+    (i * n + (i - o) * u) / o
+  );
+}
+function z(n, t, e) {
+  if (!Number.isFinite(n))
+    return a(t);
+  const i = a(t);
+  for (let o = 1; o <= i; o += 1)
+    if (T(
+      o,
+      i,
+      e
+    ) >= n)
+      return o;
+  return i;
+}
+function a(n) {
+  return Number.isFinite(n) ? Math.min(
+    m,
+    Math.max(1, Math.ceil(n))
+  ) : m;
+}
+function D(n, t) {
+  const e = d(t);
+  return e >= n ? !0 : (n - e) / n <= W;
+}
+function G(n) {
+  return n.trim() === "" ? s.space : p.includes(n) ? s.narrow : I.includes(n) ? s.punctuation : R.includes(n) ? s.thin : N.includes(n) ? s.wide : n >= "A" && n <= "Z" ? s.uppercase : s.normal;
+}
+export {
+  l as DYNAMIC_FORM_SEMANTIC_GRID_BASE_COLUMN_WIDTH,
+  H as DYNAMIC_FORM_SEMANTIC_GRID_COLUMN_BREAKPOINTS,
+  u as DYNAMIC_FORM_SEMANTIC_GRID_COLUMN_GAP,
+  m as DYNAMIC_FORM_SEMANTIC_GRID_MAX_COLUMNS,
+  W as DYNAMIC_FORM_SEMANTIC_GRID_SPAN_PRECISION_THRESHOLD,
+  E as estimateLabelWidthPx,
+  L as resolveAdaptiveFieldLayout,
+  F as resolveAdaptiveFieldLayoutVisualTrackWidth,
+  b as resolveSemanticGridContainerWidthForSpan,
+  x as resolveSemanticGridFieldColumnSpan,
+  P as resolveSemanticGridSpanForColumnCount,
+  z as resolveSemanticGridSpanForContainerWidth,
+  d as resolveSemanticGridSpanWidth,
+  T as resolveSemanticGridSpanWidthForContainer
+};

package/components/DynamicForm/helpers/resolveFieldComponent/strategies/numberInputStrategy/numberInputStrategy.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"numberInputStrategy.d.ts","sourceRoot":"","sources":["../../../../../../../../../../packages/components/src/components/DynamicForm/helpers/resolveFieldComponent/strategies/numberInputStrategy/numberInputStrategy.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,sBAAsB,EAAiC,MAAM,UAAU,CAAC;AAGtF,+BAA+B;AAC/B,eAAO,MAAM,mBAAmB,EAAE,sBAsBjC,CAAC"}
+{"version":3,"file":"numberInputStrategy.d.ts","sourceRoot":"","sources":["../../../../../../../../../../packages/components/src/components/DynamicForm/helpers/resolveFieldComponent/strategies/numberInputStrategy/numberInputStrategy.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,sBAAsB,EAAiC,MAAM,UAAU,CAAC;AAsBtF,+BAA+B;AAC/B,eAAO,MAAM,mBAAmB,EAAE,sBA4BjC,CAAC"}

package/components/DynamicForm/helpers/resolveFieldComponent/strategies/numberInputStrategy/numberInputStrategy.js

@@ -1,21 +1,31 @@
-import { jsx as c } from "@emotion/react/jsx-runtime";
-import { resolveFieldMandatory as f, resolveFieldSymbol as F } from "../../../resolveFieldContractAliases/resolveFieldContractAliases.js";
+import { jsx as a } from "@emotion/react/jsx-runtime";
+import { Typography as v } from "@m4l/base";
+import { resolveFieldMandatory as F, resolveFieldSymbol as g } from "../../../resolveFieldContractAliases/resolveFieldContractAliases.js";
 import { normalizeNumberInputPropsFromBackend as I } from "../../normalizations/normalizeNumberInputPropsFromBackend/normalizeNumberInputPropsFromBackend.js";
 import { RHFNumberInput as O } from "../../../../../hook-form/RHFNumberInput/RHFNumberInput.js";
+function z(r, e, n) {
+  if (r)
+    return /* @__PURE__ */ a(v, { size: e, disabled: n, variant: "body", children: r });
+}
 const N = {
   componentIds: ["RHFNumberInput"],
   /** Renders the RHFNumberInput component for the given field and context. */
-  render(o) {
-    const { field: e, props: r } = o, { size: n = "medium", disabled: l, readOnly: t, getLabel: s, suppressLabel: a } = r, { name: m } = e, d = f(e), p = I(e, s), { resolvedLabel: i, readOnly: b, ...u } = p, y = !!(t || b);
-    return /* @__PURE__ */ c(
+  render(r) {
+    const { field: e, props: n } = r, { size: o = "medium", disabled: t, readOnly: m, getLabel: l, suppressLabel: i } = n, { name: s } = e, p = F(e), u = I(e, l), { resolvedLabel: c, readOnly: y, ...b } = u, f = !!(m || y), d = z(
+      g(e),
+      o,
+      t
+    );
+    return /* @__PURE__ */ a(
       O,
       {
-        name: m,
-        size: n,
-        ...!a && { mandatory: d, label: i, symbol: F(e) },
-        disabled: l,
-        readOnly: y,
-        ...u
+        name: s,
+        size: o,
+        ...!i && { mandatory: p, label: c },
+        disabled: t,
+        readOnly: f,
+        ...b,
+        ...d && { endAdornment: d }
       }
     );
   }

package/components/DynamicForm/helpers/resolveFieldComponent/strategies/textFieldStrategy/textFieldStrategy.js

@@ -1,75 +1,75 @@
-import { jsx as r } from "@emotion/react/jsx-runtime";
+import { jsx as e } from "@emotion/react/jsx-runtime";
 import { NotificationWarningFill as h } from "@m4l/icons";
-import { DYNAMIC_FORM_DICTIONARY as E } from "../../../../dictionary.js";
-import { Icon as H } from "@m4l/base";
-import { resolveFieldMandatory as P, resolveFieldSymbol as y } from "../../../resolveFieldContractAliases/resolveFieldContractAliases.js";
-import { normalizeTextFieldPropsFromBackend as k } from "../../normalizations/normalizeTextFieldPropsFromBackend/normalizeTextFieldPropsFromBackend.js";
-import { DynamicFormFallbackEndIconChipStyled as z } from "../../../../slots/DynamicFormSlots.js";
-import { RHFTextFieldPassword as D } from "../../../../../hook-form/RHFTextFieldPassword/RHFTextFieldPassword.js";
-import { RHFResourceDictionary as M } from "../../../../../hook-form/RHFResourceDictionary/RHFResourceDictionary.js";
-import { RHFTextField as g } from "../../../../../hook-form/RHFTextField/RHFTextField.js";
-const G = {
+import { DYNAMIC_FORM_DICTIONARY as v } from "../../../../dictionary.js";
+import { Icon as E } from "@m4l/base";
+import { resolveFieldMandatory as H } from "../../../resolveFieldContractAliases/resolveFieldContractAliases.js";
+import { normalizeTextFieldPropsFromBackend as P } from "../../normalizations/normalizeTextFieldPropsFromBackend/normalizeTextFieldPropsFromBackend.js";
+import { DynamicFormFallbackEndIconChipStyled as k } from "../../../../slots/DynamicFormSlots.js";
+import { RHFTextFieldPassword as z } from "../../../../../hook-form/RHFTextFieldPassword/RHFTextFieldPassword.js";
+import { RHFResourceDictionary as D } from "../../../../../hook-form/RHFResourceDictionary/RHFResourceDictionary.js";
+import { RHFTextField as M } from "../../../../../hook-form/RHFTextField/RHFTextField.js";
+const j = {
   componentIds: ["RHFTextField", "RHFTextFieldPassword", "RHFResourceDictionary"],
   /** Renders the RHFTextField component for the given field and context. */
-  render(I) {
-    const { field: o, props: b, isFallback: e } = I, { size: n = "medium", disabled: l, readOnly: R, getLabel: F, hostApiRemote: u, slots: O, suppressLabel: a } = b, { name: d, placeholder: t } = o, i = P(o), T = k(o, F, u), {
+  render(f) {
+    const { field: r, props: I, isFallback: o } = f, { size: n = "medium", disabled: l, readOnly: R, getLabel: F, hostApiRemote: b, slots: u, suppressLabel: a } = I, { name: t, placeholder: d } = r, i = H(r), O = P(r, F, b), {
       resolvedLabel: c,
       startIcon: s,
       endIcon: m,
-      readOnly: v,
+      readOnly: T,
       ...p
-    } = T, f = !!(R || v), x = /* @__PURE__ */ r(
-      z,
+    } = O, y = !!(R || T), x = /* @__PURE__ */ e(
+      k,
       {
         size: n,
-        label: F(E.UNKNOWN_COMPONENT_MESSAGE),
-        startIcon: /* @__PURE__ */ r(H, { src: /* @__PURE__ */ r(h, {}), color: "chips.warning.contained.color" }),
+        label: F(v.UNKNOWN_COMPONENT_MESSAGE),
+        startIcon: /* @__PURE__ */ e(E, { src: /* @__PURE__ */ e(h, {}), color: "chips.warning.contained.color" }),
         color: "warning",
         opacity: !0
       }
-    ), N = e ? O?.fallbackEndIcon ?? x : void 0;
-    return !e && o.fieldType.componentId === "RHFTextFieldPassword" ? /* @__PURE__ */ r(
-      D,
+    ), N = o ? u?.fallbackEndIcon ?? x : void 0;
+    return !o && r.fieldType.componentId === "RHFTextFieldPassword" ? /* @__PURE__ */ e(
+      z,
       {
-        name: d,
+        name: t,
         size: n,
-        ...!a && { label: c, symbol: y(o), mandatory: i },
+        ...!a && { label: c, mandatory: i },
         disabled: l,
-        readOnly: f,
-        placeholder: t || void 0,
+        readOnly: y,
+        placeholder: d || void 0,
         ...p,
         startIcon: s,
         endIcon: m
       }
-    ) : !e && o.fieldType.componentId === "RHFResourceDictionary" ? /* @__PURE__ */ r(
-      M,
+    ) : !o && r.fieldType.componentId === "RHFResourceDictionary" ? /* @__PURE__ */ e(
+      D,
       {
-        name: d,
+        name: t,
         size: n,
-        ...!a && { label: c, symbol: y(o), mandatory: i },
+        ...!a && { label: c, mandatory: i },
         disabled: l,
-        placeholder: t || void 0,
+        placeholder: d || void 0,
         ...p,
         startIcon: s,
         endIcon: m
       }
-    ) : /* @__PURE__ */ r(
-      g,
+    ) : /* @__PURE__ */ e(
+      M,
       {
-        name: d,
+        name: t,
         size: n,
-        ...!a && { label: c, symbol: y(o), mandatory: i },
+        ...!a && { label: c, mandatory: i },
         disabled: l,
-        readOnly: e || f,
-        placeholder: t || void 0,
+        readOnly: o || y,
+        placeholder: d || void 0,
         ...p,
         startIcon: s,
-        endIcon: e ? N : m,
-        InputProps: e ? { readOnly: !0 } : void 0
+        endIcon: o ? N : m,
+        InputProps: o ? { readOnly: !0 } : void 0
       }
     );
   }
 };
 export {
-  G as textFieldStrategy
+  j as textFieldStrategy
 };

package/components/DynamicForm/helpers/resolveFieldComponent/types.d.ts

@@ -21,7 +21,7 @@ export interface ResolveFieldComponentProps {
     /** Slot overrides for the rendered field elements. */
     slots?: ResolveFieldComponentSlots;
     /**
-     * When true, strategies omit `label`, `mandatory`, and `symbol` from the rendered RHF component.
+     * When true, strategies omit `label` and `mandatory` from the rendered RHF component.
      * Use this when the caller (e.g. DynamicFormContent via PropertyValue) provides the label externally.
      */
     suppressLabel?: boolean;

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

@@ -12,10 +12,6 @@ export declare function resolveFieldMandatory(field: Pick<Field, 'mandatory'>):
 export declare function resolveFieldHelperMessage(field: Pick<Field, 'helperMessage'>): string | null;
 /** Resolve the field label value from `label`. */
 export declare function resolveFieldLabelValue(field: Pick<Field, 'label'>): string | null;
-/**
- * Resolve the magnitude-unit symbol shown in parentheses after the field label
- * (e.g. `V` → `Voltage (V)`). Returns `undefined` when `magnitudeUnit` or its
- * `symbol` is falsy (undefined, null, empty string) so the `symbol` prop is omitted.
- */
+/** Resolve the non-empty magnitude-unit symbol used by components that own unit presentation. */
 export declare function resolveFieldSymbol(field: Pick<Field, 'magnitudeUnit'>): string | undefined;
 //# sourceMappingURL=resolveFieldContractAliases.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"resolveFieldContractAliases.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/DynamicForm/helpers/resolveFieldContractAliases/resolveFieldContractAliases.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,sCAAsC,EACtC,KAAK,EACL,SAAS,EACV,MAAM,aAAa,CAAC;AAErB;;;GAGG;AACH,wBAAgB,8BAA8B,CAC5C,SAAS,EAAE,IAAI,CAAC,SAAS,EAAE,gBAAgB,CAAC,GAAG,IAAI,GAAG,SAAS,GAC9D,sCAAsC,GAAG,SAAS,CAKpD;AAED,+EAA+E;AAC/E,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,WAAW,CAAC,GAAG,OAAO,CAE9E;AAED;;GAEG;AACH,wBAAgB,yBAAyB,CACvC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,eAAe,CAAC,GAClC,MAAM,GAAG,IAAI,CAEf;AAED,kDAAkD;AAClD,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,OAAO,CAAC,GAAG,MAAM,GAAG,IAAI,CAEjF;AAED;;;;GAIG;AACH,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,eAAe,CAAC,GAAG,MAAM,GAAG,SAAS,CAE1F"}
+{"version":3,"file":"resolveFieldContractAliases.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/DynamicForm/helpers/resolveFieldContractAliases/resolveFieldContractAliases.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,sCAAsC,EACtC,KAAK,EACL,SAAS,EACV,MAAM,aAAa,CAAC;AAErB;;;GAGG;AACH,wBAAgB,8BAA8B,CAC5C,SAAS,EAAE,IAAI,CAAC,SAAS,EAAE,gBAAgB,CAAC,GAAG,IAAI,GAAG,SAAS,GAC9D,sCAAsC,GAAG,SAAS,CAKpD;AAED,+EAA+E;AAC/E,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,WAAW,CAAC,GAAG,OAAO,CAE9E;AAED;;GAEG;AACH,wBAAgB,yBAAyB,CACvC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,eAAe,CAAC,GAClC,MAAM,GAAG,IAAI,CAEf;AAED,kDAAkD;AAClD,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,OAAO,CAAC,GAAG,MAAM,GAAG,IAAI,CAEjF;AAED,iGAAiG;AACjG,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,eAAe,CAAC,GAAG,MAAM,GAAG,SAAS,CAE1F"}

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":"AAuBA,OAAO,KAAK,EACV,uBAAuB,EAKxB,MAAM,aAAa,CAAC;AAmJrB,eAAO,MAAM,kBAAkB,oHAwK7B,CAAC"}
+{"version":3,"file":"DynamicFormContent.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/DynamicForm/subcomponents/DynamicFormContent/DynamicFormContent.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EACV,uBAAuB,EAKxB,MAAM,aAAa,CAAC;AAiKrB,eAAO,MAAM,kBAAkB,oHAwK7B,CAAC"}