npm - @hortiview/shared-components - Versions diffs - 2.28.3 → 2.29.0-alpha.df46fcc5.1 - Mend

@hortiview/shared-components 2.28.3 → 2.29.0-alpha.df46fcc5.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (20) hide show

package/CHANGELOG.md +807 -0
package/README.md +1387 -0
package/components/AllowedButton/AllowedButton.d.ts +1 -1
package/components/AllowedButton/AllowedButton.js +24 -21
package/components/AllowedIconButton/AllowedIconButton.d.ts +1 -1
package/components/AllowedIconButton/AllowedIconButton.js +20 -17
package/components/ContextMenu/ContextMenu.d.ts +3 -11
package/components/ContextMenu/ContextMenu.js +87 -97
package/components/FormComponents/FormNumber/CustomTextField.js +1 -1
package/components/FormComponents/FormText/FormText.js +101 -109
package/components/GenericTable/GenericTableService.js +22 -22
package/main.d.ts +0 -1
package/main.js +33 -35
package/package.json +1 -1
package/types/Permission.d.ts +1 -147
package/types/Permission.js +1 -4
package/components/ContextMenu/ContextMenuService.d.ts +0 -8
package/components/ContextMenu/ContextMenuService.js +0 -19
package/components/PermissionChecks/mockedPermissions.d.ts +0 -24
package/components/PermissionChecks/mockedPermissions.js +0 -299

package/components/AllowedButton/AllowedButton.d.ts CHANGED Viewed

@@ -47,4 +47,4 @@ export type AllowedButtonProps = Omit<ButtonProps & React.HTMLProps<HTMLButtonEl
  * @param {AllowedButtonProps} props - Component properties
  * @returns {JSX.Element | null} The button component or null if permissions are not met
  */
-export declare const AllowedButton: ({ buttonType, variant, "data-testid": testId, label, size, isLoading, ...props }: AllowedButtonProps) => import("react").JSX.Element;
+export declare const AllowedButton: ({ buttonType, variant, "data-testid": testId, label, size, isLoading, formId, permissions, entityIds, ...props }: AllowedButtonProps) => import("react").JSX.Element;

package/components/AllowedButton/AllowedButton.js CHANGED Viewed

@@ -1,28 +1,31 @@
-import { jsx as e } from "react/jsx-runtime";
-import { B as l } from "../../index.es-B9C7vzr4.js";
-import { Allowed as s } from "../Allowed/Allowed.js";
-import { LoadingSpinner as a } from "../LoadingSpinner/Default/LoadingSpinner.js";
-const c = ({
+import { jsx as t } from "react/jsx-runtime";
+import { B as u } from "../../index.es-B9C7vzr4.js";
+import { Allowed as f } from "../Allowed/Allowed.js";
+import { LoadingSpinner as p } from "../LoadingSpinner/Default/LoadingSpinner.js";
+const h = ({
   buttonType: d = "button",
-  variant: n = "filled",
-  "data-testid": o,
-  label: r,
-  size: m = "medium",
-  isLoading: i = !1,
-  ...t
-}) => /* @__PURE__ */ e(s, { neededPermissions: t.permissions, entityIds: t.entityIds, children: /* @__PURE__ */ e(
-  l,
+  variant: i = "filled",
+  "data-testid": r,
+  label: n,
+  size: l = "medium",
+  isLoading: e = !1,
+  formId: m,
+  permissions: s,
+  entityIds: a,
+  ...o
+}) => /* @__PURE__ */ t(f, { neededPermissions: s, entityIds: a, children: /* @__PURE__ */ t(
+  u,
   {
-    ...t,
-    buttonSize: m,
-    "data-testid": `allowed-button-${o}`,
-    disabled: t.disabled || i,
-    form: t.formId,
+    ...o,
+    buttonSize: l,
+    "data-testid": `allowed-button-${r}`,
+    disabled: o.disabled || e,
+    form: m,
     type: d,
-    variant: n,
-    children: i ? /* @__PURE__ */ e(a, { size: "sm", spinnerOnly: !0 }) : r
+    variant: i,
+    children: e ? /* @__PURE__ */ t(p, { size: "sm", spinnerOnly: !0 }) : n
   }
 ) });
 export {
-  c as AllowedButton
+  h as AllowedButton
 };

package/components/AllowedIconButton/AllowedIconButton.d.ts CHANGED Viewed

@@ -39,4 +39,4 @@ export type AllowedIconButtonProps = Omit<IconButtonProps & React.HTMLProps<HTML
  * @param {AllowedIconButtonProps} props - Component properties
  * @returns {JSX.Element | null} The icon button component or null if permissions are not met
  */
-export declare const AllowedIconButton: ({ "data-testid": testId, variant, iconType, size, ...props }: AllowedIconButtonProps) => import("react").JSX.Element;
+export declare const AllowedIconButton: ({ "data-testid": testId, variant, iconType, size, formId, permissions, entityIds, ...props }: AllowedIconButtonProps) => import("react").JSX.Element;

package/components/AllowedIconButton/AllowedIconButton.js CHANGED Viewed

@@ -1,23 +1,26 @@
-import { jsx as i } from "react/jsx-runtime";
-import { I as m } from "../../index.es-BwhRJBEH.js";
-import { Allowed as l } from "../Allowed/Allowed.js";
-const f = ({
-  "data-testid": o,
+import { jsx as o } from "react/jsx-runtime";
+import { I as s } from "../../index.es-BwhRJBEH.js";
+import { Allowed as a } from "../Allowed/Allowed.js";
+const u = ({
+  "data-testid": t,
   variant: e = "filled-primary",
-  iconType: d = "filled",
-  size: n = "medium",
-  ...t
-}) => /* @__PURE__ */ i(l, { neededPermissions: t.permissions, entityIds: t.entityIds, children: /* @__PURE__ */ i(
-  m,
+  iconType: i = "filled",
+  size: d = "medium",
+  formId: r,
+  permissions: l,
+  entityIds: m,
+  ...n
+}) => /* @__PURE__ */ o(a, { neededPermissions: l, entityIds: m, children: /* @__PURE__ */ o(
+  s,
   {
-    "data-testid": `allowed-icon-button-${o}`,
-    form: t.formId,
-    iconSize: n,
-    iconType: d,
-    variant: e,
-    ...t
+    ...n,
+    "data-testid": `allowed-icon-button-${t}`,
+    form: r,
+    iconSize: d,
+    iconType: i,
+    variant: e
   }
 ) });
 export {
-  f as AllowedIconButton
+  u as AllowedIconButton
 };

package/components/ContextMenu/ContextMenu.d.ts CHANGED Viewed

@@ -1,8 +1,7 @@
 import { ListItemProps } from '@element-public/react-list';
-import { MenuProps } from '@element-public/react-menu';
 import { OfflineViewProps } from '../OfflineView/OfflineView';
 import { IsAllowedProps } from '../PermissionChecks/PermissionService.tsx';
-type ContextMenuProps = MenuProps & {
+type ContextMenuProps = {
     /**
      * If not null, the menu will be open
      */
@@ -26,10 +25,6 @@ type ContextMenuProps = MenuProps & {
      * Props forwarded to <OfflineView /> when offline.
      */
     offlineViewProps?: Partial<OfflineViewProps>;
-    /**
-     * Optional className to apply to the menu container
-     */
-    className?: string;
 };
 export type ActionProps = ListItemProps & {
     closeOnClick?: boolean;
@@ -59,8 +54,7 @@ export type ActionProps = ListItemProps & {
  *
  * @param {boolean} triggerOpen indicates if the menu should be open
  * @param {ListItemProps[]} actions list of actions to display in the context menu as ListItems
- * @param {'vertical' | 'horizontal'} iconOrientation determines if menu icon should be vertical or horizontal three dots. Default is 'vertical'
- * @param {string} data-testid id for testing, automatically prefixed
+ * @param testId id for testing, automatically prefixed
  * @recommended `primaryText`, `onClick`, `leadingBlock`
  * @requires `ListItemProps` from `@element-public/react-components`
  * @example const actions = [
@@ -70,9 +64,7 @@ export type ActionProps = ListItemProps & {
  * ];
  * @param {boolean} isOnline Whether the user is online; shows OfflineView when false.
  * @param {OfflineViewProps} offlineViewProps Props forwarded to OfflineView when offline.
- * @param {string} className Optional className to apply to the menu container
- * @param {MenuProps} menuProps Element Menu props, e.g. `hoistToBody`, `themeColor`, etc.
  * @returns a context menu with the given actions as ListItems
  */
-export declare const ContextMenu: ({ triggerOpen, actions, iconOrientation, "data-testid": dataTestId, isOnline, offlineViewProps, className, ...menuProps }: ContextMenuProps) => import("react").JSX.Element | null;
+export declare const ContextMenu: ({ triggerOpen, actions, iconOrientation, "data-testid": dataTestId, isOnline, offlineViewProps, }: ContextMenuProps) => import("react").JSX.Element | null;
 export {};

package/components/ContextMenu/ContextMenu.js CHANGED Viewed

@@ -1,130 +1,120 @@
-import { jsx as t, jsxs as L } from "react/jsx-runtime";
-import { I as A } from "../../index.es-BwhRJBEH.js";
-import { M as B, L as O, a as x, b as V } from "../../index.es-BIgjyLDa.js";
-import { c as C } from "../../index-_-9ybP20.js";
-import { u as E } from "../../uniqueId-CJo-XRQb.js";
-import { useState as I, useRef as T, useCallback as M, useEffect as k, useMemo as N, Fragment as R, useLayoutEffect as z } from "react";
-import { u as H } from "../../useBreakpoints-DDrM9Cfx.js";
-import { OfflineView as S } from "../OfflineView/OfflineView.js";
-import { useIsAllowed as $ } from "../PermissionChecks/PermissionService.js";
-import { repositionMenuVertically as j } from "./ContextMenuService.js";
-import '../../assets/ContextMenu.css';const q = "_menu_52omh_1", D = "_mobile_52omh_7", F = "_desktop_52omh_11", G = "_icon_52omh_15", J = "_listItem_52omh_19", K = "_offlineViewMargin_52omh_51", Q = "_primaryTextTruncated_52omh_55", o = {
-  menu: q,
-  mobile: D,
-  desktop: F,
-  icon: G,
-  listItem: J,
-  offlineViewMargin: K,
-  primaryTextTruncated: Q
-}, oe = ({
-  triggerOpen: n = null,
-  actions: u,
-  iconOrientation: m = "vertical",
-  "data-testid": f,
-  isOnline: d = !0,
-  offlineViewProps: y,
-  className: g,
-  ...s
+import { jsx as i, jsxs as M } from "react/jsx-runtime";
+import { I as k } from "../../index.es-BwhRJBEH.js";
+import { M as v, L as w, a as x, b as C } from "../../index.es-BIgjyLDa.js";
+import { useState as g, useCallback as T, useEffect as I, useMemo as b, Fragment as A, useRef as L, useLayoutEffect as B } from "react";
+import { c as V } from "../../index-_-9ybP20.js";
+import { u as z } from "../../uniqueId-CJo-XRQb.js";
+import { OfflineView as H } from "../OfflineView/OfflineView.js";
+import { useIsAllowed as N } from "../PermissionChecks/PermissionService.js";
+import { u as O } from "../../useBreakpoints-DDrM9Cfx.js";
+import '../../assets/ContextMenu.css';const E = "_menu_52omh_1", R = "_mobile_52omh_7", S = "_desktop_52omh_11", $ = "_icon_52omh_15", j = "_listItem_52omh_19", q = "_offlineViewMargin_52omh_51", D = "_primaryTextTruncated_52omh_55", n = {
+  menu: E,
+  mobile: R,
+  desktop: S,
+  icon: $,
+  listItem: j,
+  offlineViewMargin: q,
+  primaryTextTruncated: D
+}, P = ({
+  triggerOpen: t = null,
+  actions: l,
+  iconOrientation: a = "vertical",
+  "data-testid": c,
+  isOnline: m = !0,
+  offlineViewProps: f
 }) => {
-  const { isMobile: w } = H(), [l, c] = I(!1), _ = T(null), a = T(null), r = $(), i = M(() => {
-    c(!1);
-  }, []), p = M(() => {
-    c((e) => !e);
+  const { isMobile: d } = O(), [u, o] = g(!1), _ = N(), p = T(() => {
+    o(!1);
+  }, []), h = T(() => {
+    o((e) => !e);
   }, []);
-  k(() => {
-    c(n !== null ? n : !1);
-  }, [n]), k(() => {
-    if (!l || !s.hoistToBody) return;
-    const e = () => {
-      j(_.current, a.current) && i();
-    };
-    return window.addEventListener("scroll", e, !0), () => window.removeEventListener("scroll", e, !0);
-  }, [l, i, s.hoistToBody]);
-  const b = C(o.menu, g), v = N(() => u.filter((e) => e.isHidden || e.isAllowed === !1 ? !1 : !(e.permissionConfiguration && !r(e.permissionConfiguration))), [u, r]);
-  return v.length === 0 ? null : /* @__PURE__ */ t("div", { ref: _, children: /* @__PURE__ */ t(
-    B,
+  I(() => {
+    o(t !== null ? t : !1);
+  }, [t]);
+  const r = b(() => l.filter((e) => e.isHidden || e.isAllowed === !1 ? !1 : !(e.permissionConfiguration && !_(e.permissionConfiguration))), [l, _]);
+  return r.length === 0 ? null : /* @__PURE__ */ i(
+    v,
     {
-      ref: a,
-      className: b,
-      "data-testid": f ?? "contextMenu-undefined",
-      open: l,
+      className: n.menu,
+      "data-testid": c ?? "contextMenu-undefined",
+      open: u,
       surfaceOnly: !0,
-      onClose: i,
-      trigger: /* @__PURE__ */ t(
-        A,
+      hoistToBody: !0,
+      onClose: p,
+      trigger: /* @__PURE__ */ i(
+        k,
         {
-          className: o.icon,
-          variant: l ? "filled-primary" : void 0,
+          className: n.icon,
+          variant: u ? "filled-primary" : void 0,
           "data-testid": "open-button",
-          icon: m === "vertical" ? "more_vert" : "more_horiz",
-          onClick: p
+          icon: a === "vertical" ? "more_vert" : "more_horiz",
+          onClick: h
         }
       ),
-      ...s,
-      children: d ? /* @__PURE__ */ t(O, { "data-testid": "selection-list", children: v.map((e, h) => /* @__PURE__ */ L(R, { children: [
-        e.dividerBefore && h !== 0 && /* @__PURE__ */ t(x, {}),
-        /* @__PURE__ */ t(
-          U,
+      children: m ? /* @__PURE__ */ i(w, { "data-testid": "selection-list", children: r.map((e, s) => /* @__PURE__ */ M(A, { children: [
+        e.dividerBefore && s !== 0 && /* @__PURE__ */ i(x, {}),
+        /* @__PURE__ */ i(
+          F,
           {
             actionProps: e,
-            index: h,
-            isMobile: w,
-            closeMenu: i
+            index: s,
+            isMobile: d,
+            closeMenu: p
           }
         ),
-        e.dividerAfter && h !== v.length - 1 && /* @__PURE__ */ t(x, {})
-      ] }, E(`LI_${e.primaryText?.toString()}_`))) }) : /* @__PURE__ */ t(
-        S,
+        e.dividerAfter && s !== r.length - 1 && /* @__PURE__ */ i(x, {})
+      ] }, z(`LI_${e.primaryText?.toString()}_`))) }) : /* @__PURE__ */ i(
+        H,
         {
           size: "small",
           variant: "filled",
-          className: o.offlineViewMargin,
-          ...y
+          className: n.offlineViewMargin,
+          ...f
         }
       )
     },
-    `contextMenu-${f ?? "undefined"}`
-  ) });
-}, U = ({
-  actionProps: n,
-  index: u,
-  isMobile: m,
-  closeMenu: f
+    `contextMenu-${c ?? "undefined"}`
+  );
+}, F = ({
+  actionProps: t,
+  index: l,
+  isMobile: a,
+  closeMenu: c
 }) => {
-  const d = T(null), [y, g] = I(!1), { closeOnClick: s, permissionConfiguration: w, isAllowed: l, isHidden: c, ..._ } = n;
-  return z(() => {
-    const a = d.current;
-    if (!a) return;
-    const r = a.querySelector(
+  const m = L(null), [f, d] = g(!1), { closeOnClick: u, permissionConfiguration: o, isAllowed: _, isHidden: p, ...h } = t;
+  return B(() => {
+    const r = m.current;
+    if (!r) return;
+    const e = r.querySelector(
       "[class*='mdc-list-item__primary-text']"
     );
-    if (!r) return;
-    const i = () => {
-      g(r.scrollHeight > r.clientHeight);
+    if (!e) return;
+    const s = () => {
+      d(e.scrollHeight > e.clientHeight);
     };
-    i();
-    const p = new ResizeObserver(i);
-    return p.observe(r), () => {
-      p.disconnect();
+    s();
+    const y = new ResizeObserver(s);
+    return y.observe(e), () => {
+      y.disconnect();
     };
-  }, [n.primaryText, m]), /* @__PURE__ */ t(
-    V,
+  }, [t.primaryText, a]), /* @__PURE__ */ i(
+    C,
     {
-      ref: d,
-      "data-testid": n["data-testid"] ?? `contextMenu-action-${u}`,
-      className: C(
-        o.listItem,
-        y && o.primaryTextTruncated,
-        m ? o.mobile : o.desktop
+      ref: m,
+      "data-testid": t["data-testid"] ?? `contextMenu-action-${l}`,
+      className: V(
+        n.listItem,
+        f && n.primaryTextTruncated,
+        a ? n.mobile : n.desktop
       ),
-      ..._,
+      ...h,
       leadingBlockType: "icon",
       onClick: () => {
-        n?.onClick?.(), s !== !1 && f();
+        t?.onClick?.(), u !== !1 && c();
       }
     }
   );
 };
 export {
-  oe as ContextMenu
+  P as ContextMenu
 };

package/components/FormComponents/FormNumber/CustomTextField.js CHANGED Viewed

@@ -14,7 +14,7 @@ import '../../../assets/CustomTextField.css';const c = "_invalid_142hx_1", h = "
     trigger: i,
     watch: l
   } = s(), a = l(e.propertyName), d = v(() => {
-    if (!(a == null || e.value == null))
+    if (!(!a || e.value === null))
       return e.value;
   }, [a, e.value]);
   return /* @__PURE__ */ m(

package/components/FormComponents/FormText/FormText.js CHANGED Viewed

@@ -1,131 +1,123 @@
-import { jsx as t, Fragment as _, jsxs as z } from "react/jsx-runtime";
-import { T as M } from "../../../index.es-CJIPOFSz.js";
-import { a as P } from "../../../index.es-CdZp67J9.js";
-import { useState as V, useCallback as W, useMemo as d } from "react";
-import { useFormContext as D, Controller as v } from "react-hook-form";
-import { useHelperText as E } from "../../../hooks/useHelperText.js";
-import '../../../assets/FormText.css';const G = "_formTextAreaHelperText_x4g1e_1", I = "_invalid_x4g1e_7", J = "_required_x4g1e_11", K = "_formTextArea_x4g1e_1", O = "_characterCount_x4g1e_25", Q = "_withoutCharacterCount_x4g1e_31", U = "_formText_x4g1e_1", r = {
-  formTextAreaHelperText: G,
-  invalid: I,
-  required: J,
-  formTextArea: K,
-  characterCount: O,
-  withoutCharacterCount: Q,
-  formText: U
-}, X = ({
+import { jsx as t, Fragment as g, jsxs as R } from "react/jsx-runtime";
+import { T as k } from "../../../index.es-CJIPOFSz.js";
+import { a as z } from "../../../index.es-CdZp67J9.js";
+import { useMemo as u } from "react";
+import { useFormContext as M, Controller as C } from "react-hook-form";
+import { useHelperText as P } from "../../../hooks/useHelperText.js";
+import '../../../assets/FormText.css';const V = "_formTextAreaHelperText_x4g1e_1", W = "_invalid_x4g1e_7", b = "_required_x4g1e_11", D = "_formTextArea_x4g1e_1", E = "_characterCount_x4g1e_25", G = "_withoutCharacterCount_x4g1e_31", I = "_formText_x4g1e_1", r = {
+  formTextAreaHelperText: V,
+  invalid: W,
+  required: b,
+  formTextArea: D,
+  characterCount: E,
+  withoutCharacterCount: G,
+  formText: I
+}, J = ({
   count: e,
-  maxCount: x,
-  invalid: s = !1,
-  hasRequiredText: n = !1
+  maxCount: c,
+  invalid: x = !1,
+  hasRequiredText: o = !1
 }) => /* @__PURE__ */ t(
   "div",
   {
     "data-testid": "character-counter-container",
-    className: `${r.formTextAreaHelperText} ${s ? r.invalid : ""} ${n ? r.required : ""}`,
-    children: /* @__PURE__ */ t(P, { children: `${e}/${x}` })
+    className: `${r.formTextAreaHelperText} ${x ? r.invalid : ""} ${o ? r.required : ""}`,
+    children: /* @__PURE__ */ t(z, { children: `${e}/${c}` })
   }
-), ne = (e) => e.textarea ? /* @__PURE__ */ t(Y, { ...e }) : /* @__PURE__ */ t(Z, { ...e }), Y = (e) => /* @__PURE__ */ t("div", { "data-testid": "form-text-area", className: r.formTextArea, children: /* @__PURE__ */ t(A, { ...e }) }), Z = (e) => /* @__PURE__ */ t(
+), p = (e) => e.textarea ? /* @__PURE__ */ t(K, { ...e }) : /* @__PURE__ */ t(O, { ...e }), K = (e) => /* @__PURE__ */ t("div", { "data-testid": "form-text-area", className: r.formTextArea, children: /* @__PURE__ */ t(_, { ...e }) }), O = (e) => /* @__PURE__ */ t(
   "div",
   {
     "data-testid": "form-text-field",
     className: `${e.hasCharacterCount ? r.characterCount : r.withoutCharacterCount}`,
-    children: /* @__PURE__ */ t(A, { ...e })
+    children: /* @__PURE__ */ t(_, { ...e })
   }
-), A = ({
+), _ = ({
   propertyName: e,
-  label: x,
-  disabled: s = !1,
-  textarea: n = !1,
-  hasCharacterCount: i = !1,
-  hidden: $ = !1,
-  placeholder: F,
-  type: q,
-  prefixText: H,
-  inputMode: L,
-  trailingIcon: w,
-  trigger: h = "likeForm",
-  rules: a,
-  ...o
+  label: c,
+  disabled: x = !1,
+  textarea: o = !1,
+  hasCharacterCount: d = !1,
+  hidden: v = !1,
+  placeholder: A,
+  type: $,
+  prefixText: F,
+  inputMode: q,
+  trailingIcon: H,
+  trigger: s = "likeForm",
+  rules: n,
+  ...a
 }) => {
-  const { control: f, getFieldState: u, trigger: T } = D(), [B, g] = V(0), S = W(
-    (m) => {
-      if (!(!n && !i)) {
-        if (m) {
-          g(m.length);
-          return;
-        }
-        g(0);
-      }
-    },
-    [i, n]
-  ), l = d(
-    () => o.maxlength ? o.maxlength : a?.maxLength?.value,
-    [a, o.maxlength]
-  ), j = d(
-    () => a?.minLength?.value,
-    [a]
-  ), C = d(
-    () => a?.required?.message,
-    [a]
-  ), { helperText: k, helperTextPersistent: R } = E({
+  const { control: h, getFieldState: m, trigger: f } = M(), i = u(
+    () => a.maxlength ? a.maxlength : n?.maxLength?.value,
+    [n, a.maxlength]
+  ), L = u(
+    () => n?.minLength?.value,
+    [n]
+  ), T = u(
+    () => n?.required?.message,
+    [n]
+  ), { helperText: w, helperTextPersistent: B } = P({
     propertyName: e,
-    helperText: o.helperText,
-    requiredText: C,
-    maxLength: l,
-    hasCharacterCount: n || i
+    helperText: a.helperText,
+    requiredText: T,
+    maxLength: i,
+    hasCharacterCount: o || d
   });
-  return $ ? /* @__PURE__ */ t(v, { name: e, control: f, render: () => /* @__PURE__ */ t(_, {}) }) : /* @__PURE__ */ t(
-    v,
+  return v ? /* @__PURE__ */ t(C, { name: e, control: h, render: () => /* @__PURE__ */ t(g, {}) }) : /* @__PURE__ */ t(
+    C,
     {
       name: e,
-      rules: a,
-      control: f,
-      render: ({ field: { ref: m, ...c } }) => (S(c.value), /* @__PURE__ */ z(_, { children: [
-        /* @__PURE__ */ t(
-          M,
-          {
-            ...o,
-            ...c,
-            value: c.value ?? "",
-            type: q,
-            fullWidth: !0,
-            "data-testid": `textfield-${e}`,
-            inputMode: L,
-            placeholder: F,
-            prefixText: H,
-            disabled: s,
-            helperText: k,
-            helperTextPersistent: R,
-            label: x,
-            variant: "outlined",
-            maxlength: l,
-            minLength: j,
-            textarea: n,
-            noResize: !1,
-            onBlur: () => {
-              h === "onBlur" && T(e), o.onBlur?.();
-            },
-            onChange: (b) => {
-              c.onChange(b), h === "onChange" && T(e);
-            },
-            valid: !u(e).invalid,
-            className: `${r.formText} ${u(e).invalid ? r.invalid : ""}`,
-            trailingIcon: w
-          }
-        ),
-        l !== void 0 && (i || n) && /* @__PURE__ */ t(
-          X,
-          {
-            count: B,
-            maxCount: l,
-            invalid: u(e).invalid,
-            hasRequiredText: !!o.helperText || !!C
-          }
-        )
-      ] }))
+      rules: n,
+      control: h,
+      render: ({ field: { ref: Q, ...l } }) => {
+        const S = String(l.value ?? "").length;
+        return /* @__PURE__ */ R(g, { children: [
+          /* @__PURE__ */ t(
+            k,
+            {
+              ...a,
+              ...l,
+              value: l.value ?? "",
+              type: $,
+              fullWidth: !0,
+              "data-testid": `textfield-${e}`,
+              inputMode: q,
+              placeholder: A,
+              prefixText: F,
+              disabled: x,
+              helperText: w,
+              helperTextPersistent: B,
+              label: c,
+              variant: "outlined",
+              maxlength: i,
+              minLength: L,
+              textarea: o,
+              noResize: !1,
+              onBlur: () => {
+                s === "onBlur" && f(e), a.onBlur?.();
+              },
+              onChange: (j) => {
+                l.onChange(j), s === "onChange" && f(e);
+              },
+              valid: !m(e).invalid,
+              className: `${r.formText} ${m(e).invalid ? r.invalid : ""}`,
+              trailingIcon: H
+            }
+          ),
+          i !== void 0 && (d || o) && /* @__PURE__ */ t(
+            J,
+            {
+              count: S,
+              maxCount: i,
+              invalid: m(e).invalid,
+              hasRequiredText: !!a.helperText || !!T
+            }
+          )
+        ] });
+      }
     }
   );
 };
 export {
-  ne as FormText
+  p as FormText
 };