@envisiongroup/porygon 1.0.0-rc.9 → 1.0.0

package/dist/react-components/fields/{EFWTagPicker → TagPicker}/EFWTagPicker.types.d.ts

@@ -1,4 +1,5 @@
-import { EFWFieldChildrenProps } from '../EFWField/EFWField.types';
+import { EFWFieldChildrenProps } from '../_shared/EFWField/EFWField.types';
+import { ReactNode } from 'react';
 
 /**
  * Representa un objeto de datos genérico que puede contener propiedades de tipo string,
@@ -15,7 +16,7 @@ type IItem = {
  *
  * @callback EFWTagPickerOnChange
  * @param {EFWTagPickerOption[]} selectedOptions - Array de opciones actualmente seleccionadas
- * @param {string} [displayValue] - Valor de visualización opcional
+ * @param {string} [displayValue] - Texto formateado de las opciones seleccionadas
  * @returns {void}
  */
 export type EFWTagPickerOnChange = (selectedOptions: EFWTagPickerOption[], displayValue?: string) => void;
@@ -53,6 +54,16 @@ export type EFWTagPickerValue = EFWTagPickerOption;
 export type AsyncOptionsLoader = (query: string, options?: {
     signal: AbortSignal;
 }) => Promise<EFWTagPickerOption[]>;
+export interface EFWTagPickerLabels {
+    noMatchesMessage?: string;
+    loadingMessage?: string;
+    placeholder?: string;
+    emptyState?: string;
+    selectedItemsAriaLabel?: string;
+    inputAriaLabel?: string;
+}
+export type EFWTagPickerOptionMediaRenderer = (option: EFWTagPickerOption) => ReactNode;
+export type EFWTagPickerNonEditableRenderer = (value: EFWTagPickerOption[], displayValue: string) => ReactNode;
 /**
  * Propiedades del componente EFWTagPicker.
  * Extiende EFWFieldChildrenProps para heredar propiedades comunes de campos de formulario.
@@ -61,21 +72,6 @@ export type AsyncOptionsLoader = (query: string, options?: {
  * @extends EFWFieldChildrenProps
  */
 export interface EFWTagPickerProps extends EFWFieldChildrenProps {
-    /**
-     * Mensaje personalizado a mostrar cuando no hay resultados coincidentes con la búsqueda
-     * @default "No se encontraron coincidencias"
-     */
-    noMatchesMessage?: string;
-    /**
-     * Mensaje personalizado a mostrar durante la carga asíncrona de opciones
-     * @default "Buscando información..."
-     */
-    loadingMessage?: string;
-    /**
-     * Texto de marcador de posición que se muestra cuando el campo está vacío
-     * @default "Selecciona una opción"
-     */
-    placeholder?: string;
     /**
      * Determina si el componente permite edición o solo muestra los valores seleccionados
      * @default true
@@ -135,7 +131,24 @@ export interface EFWTagPickerProps extends EFWFieldChildrenProps {
     onChange?: EFWTagPickerOnChange;
     /** Función para transformar o procesar las opciones antes de renderizarlas */
     beforeRenderOptions?: (options: EFWTagPickerOption[]) => EFWTagPickerOption[];
+    /**
+     * Función para renderizar el contenido visual de `media` en cada `TagPickerOption`.
+     * Si no se define, se usa un Avatar por defecto basado en `option.text`.
+     */
+    renderOptionMedia?: EFWTagPickerOptionMediaRenderer;
+    /**
+     * Indica si el `media` de cada opción también debe renderizarse dentro de la etiqueta
+     * seleccionada que aparece en el input.
+     * @default false
+     */
+    showOptionMediaInSelectedTags?: boolean;
     /** Función para establecer el estado de error y mostrar mensajes de validación */
     setError?: (hasError: boolean, message?: string) => void;
+    labels?: EFWTagPickerLabels;
+    /**
+     * Renderiza contenido custom cuando `editable={false}`.
+     * Si retorna `null` o `undefined`, se utiliza el render no editable por defecto.
+     */
+    readOnlyRenderer?: EFWTagPickerNonEditableRenderer;
 }
 export {};

package/dist/react-components/fields/TagPicker/EFWTagPicker.utils.d.ts

@@ -0,0 +1,6 @@
+import { EFWTagPickerOption } from './EFWTagPicker.types';
+
+/**
+ * Retorna el valor formateado que EFWTagPicker muestra cuando no está en modo editable.
+ */
+export declare const getTagPickerFormattedValue: (value: EFWTagPickerOption[] | undefined | null) => string;

package/dist/react-components/fields/TagPicker/EFWTagPicker.utils.js

@@ -0,0 +1,4 @@
+const r = (t) => !t || t.length === 0 ? "" : t.map((e) => e.text).join(", ");
+export {
+  r as getTagPickerFormattedValue
+};

package/dist/react-components/fields/TagPicker/EFWTagPickerField.js

@@ -0,0 +1,83 @@
+import { jsx as a } from "react/jsx-runtime";
+import { EFWField as I } from "../_shared/EFWField/EFWField.js";
+import { EFWTagPicker as R } from "./EFWTagPicker.js";
+import { mergeClasses as j } from "@griffel/react";
+const V = (i) => {
+  const {
+    title: n,
+    // description,
+    infoLabel: t,
+    hint: o,
+    className: l,
+    style: s = {},
+    required: r = !1,
+    labels: d,
+    validationState: g = "none",
+    validationMessage: m = "",
+    validationMessageIcon: p,
+    minQueryLength: f = 0,
+    options: c = [],
+    selectedOptions: h,
+    defaultSelectedOptions: u,
+    editable: e = !0,
+    disabled: b = !1,
+    hidden: C = !1,
+    noPopover: O = !1,
+    multiple: F = !1,
+    tagSize: P = "medium",
+    tagShape: S = "rounded",
+    tagAppearance: v = "brand",
+    onChange: M,
+    beforeRenderOptions: k,
+    renderOptionMedia: w,
+    showOptionMediaInSelectedTags: y = !1,
+    readOnlyRenderer: E,
+    onValidationChange: L,
+    ...N
+  } = i, T = (x = []) => {
+    M?.(x);
+  }, W = j(l, "efw-tagPicker-field");
+  return /* @__PURE__ */ a(
+    I,
+    {
+      hint: o,
+      className: W,
+      style: s,
+      title: n,
+      infoLabel: t,
+      weightLabel: e ? "regular" : "semibold",
+      required: r,
+      validationState: g,
+      validationMessage: m,
+      validationMessageIcon: p,
+      onValidationChange: L,
+      hidden: C,
+      ...N,
+      children: /* @__PURE__ */ a(
+        R,
+        {
+          editable: e,
+          labels: d,
+          selectedOptions: h,
+          defaultSelectedOptions: u,
+          minQueryLength: f,
+          options: c,
+          onChange: T,
+          beforeRenderOptions: k,
+          renderOptionMedia: w,
+          showOptionMediaInSelectedTags: y,
+          readOnlyRenderer: E,
+          disabled: b,
+          noPopover: O,
+          tagSize: P,
+          tagShape: S,
+          tagAppearance: v,
+          multiple: F
+        }
+      )
+    }
+  );
+};
+export {
+  V as EFWTagPickerField
+};

package/dist/react-components/fields/{EFWTagPickerField → TagPicker}/EFWTagPickerField.types.d.ts

@@ -1,5 +1,5 @@
-import { EFWFieldProps } from '../EFWField/EFWField.types';
-import { EFWTagPickerOption, EFWTagPickerProps, EFWTagPickerValue, EFWTagPickerOnChange } from '../EFWTagPicker';
+import { EFWFieldProps } from '../_shared/EFWField/EFWField.types';
+import { EFWTagPickerOption, EFWTagPickerProps, EFWTagPickerValue, EFWTagPickerOnChange } from './EFWTagPicker.types';
 
 export type EFWTagPickerFieldValue = EFWTagPickerValue;
 export type EFWTagPickerFieldOnChange = EFWTagPickerOnChange;

package/dist/react-components/fields/TagPicker/index.d.ts

@@ -0,0 +1,5 @@
+export { EFWTagPicker } from './EFWTagPicker';
+export { getTagPickerFormattedValue } from './EFWTagPicker.utils';
+export type { EFWTagPickerProps, EFWTagPickerValue, EFWTagPickerOption, EFWTagPickerOnChange, EFWTagPickerOptionMediaRenderer, EFWTagPickerNonEditableRenderer } from './EFWTagPicker.types';
+export { EFWTagPickerField } from './EFWTagPickerField';
+export type { EFWTagPickerFieldProps, EFWTagPickerFieldValue, EFWTagPickerFieldOnChange, EFWTagPickerFieldOption } from './EFWTagPickerField.types';

package/dist/react-components/fields/TagPicker/index.js

@@ -0,0 +1,8 @@
+import { EFWTagPicker as o } from "./EFWTagPicker.js";
+import { getTagPickerFormattedValue as a } from "./EFWTagPicker.utils.js";
+import { EFWTagPickerField as i } from "./EFWTagPickerField.js";
+export {
+  o as EFWTagPicker,
+  i as EFWTagPickerField,
+  a as getTagPickerFormattedValue
+};

package/dist/react-components/fields/TextArea/EFWTextArea.js

@@ -0,0 +1,153 @@
+import { jsx as v, Fragment as ne } from "react/jsx-runtime";
+import { makeStyles as re, tokens as h, mergeClasses as oe, Text as ae, Textarea as le } from "@fluentui/react-components";
+import { useMemo as B, useId as se, useRef as b, useState as ce, useCallback as i, useEffect as g, useLayoutEffect as ie } from "react";
+import { getTextAreaFormattedValue as ue } from "./EFWTextArea.utils.js";
+import { useFieldsLocaleText as de } from "../../i18n/PorygonI18nProvider.js";
+const fe = re({
+  efwTextArea: {
+    "& textarea": {
+      maxHeight: "none",
+      "&[disabled]": {
+        backgroundColor: h.colorNeutralBackground3,
+        color: h.colorNeutralForeground3
+      }
+    },
+    // Afectar el span que contiene el textarea disabled
+    "&:has([disabled])": {
+      backgroundColor: h.colorNeutralBackground3
+    }
+  },
+  efwTextAreaError: {
+    backgroundColor: h.colorPaletteRedBackground1
+    // '& textarea': {
+    // 	maxHeight: 'none',
+    // 	backgroundColor: "var(--colorPaletteRedBackground1)",
+    // },
+    // '.fui-Textarea': {
+    // 	backgroundColor: "var(--colorPaletteRedBackground1)",
+    // 	borderBottom: "2px solid var(--colorPaletteRedBorder2) !important"
+    // },
+    // '& textarea::after': {
+    // 	borderBottom: "2px solid var(--colorPaletteRedBorder2) !important"
+    // }
+  }
+}), w = (x) => x ?? "", ye = (x) => {
+  const {
+    value: d,
+    defaultValue: C,
+    onKeyDown: T,
+    onChange: A,
+    editable: K = !0,
+    disabled: W = !1,
+    autoComplete: q = "off",
+    className: U = "",
+    maxLength: p = 250,
+    labels: L,
+    readOnlyRenderer: _,
+    validationMessages: $,
+    size: G,
+    validationState: J = "none",
+    setParentComponentState: y,
+    autoResize: a = !0
+    // Nuevo prop con valor por defecto true
+  } = x, t = d !== void 0, Q = w(t ? d : C), f = w(C), V = de(), z = V.textArea.labels, X = V.textArea.validationMessages, S = z.placeholder, E = z.emptyState, k = L?.placeholder, F = L?.emptyState, R = B(() => ({
+    placeholder: k ?? S,
+    emptyState: F ?? E
+  }), [
+    k,
+    F,
+    S,
+    E
+  ]), N = X.maxLength, M = $?.maxLength, H = B(() => ({
+    maxLength: M ?? N
+  }), [
+    M,
+    N
+  ]), I = fe(), D = se(), u = b(null), s = b(null), [O, P] = ce(Q), j = b(!1), n = t ? w(d) : O, m = i(() => {
+    if (!a || !u.current) return;
+    const e = u.current;
+    e.style.height = "auto", e.style.height = `${e.scrollHeight}px`;
+  }, [a]), c = i(() => {
+    a && (s.current !== null && window.cancelAnimationFrame(s.current), s.current = window.requestAnimationFrame(() => {
+      s.current = null, m();
+    }));
+  }, [a, m]), l = i((e) => {
+    e.length > p ? y?.("error", H.maxLength(p)) : y?.("none", "");
+  }, [p, y, H]);
+  g(() => {
+    t && l(n);
+  }, [t, n, l]), g(() => {
+    t || j.current || (j.current = !0, l(n));
+  }, [t, n, l]), ie(() => {
+    m();
+  }, [n, m]), g(() => {
+    if (!u.current)
+      return;
+    const e = u.current;
+    if (!a) {
+      e.style.height = "";
+      return;
+    }
+    c();
+    const r = () => c();
+    window.addEventListener("resize", r);
+    let o = null;
+    return typeof ResizeObserver < "u" && (o = new ResizeObserver(() => {
+      c();
+    }), o.observe(e), e.parentElement && o.observe(e.parentElement)), () => {
+      window.removeEventListener("resize", r), o?.disconnect(), s.current !== null && (window.cancelAnimationFrame(s.current), s.current = null);
+    };
+  }, [a, c]);
+  const Y = i((e, r) => {
+    if (typeof r.value == "string") {
+      const o = r.value ?? "";
+      l(o), t || P(o), A?.(o, o);
+    }
+  }, [l, t, A]), Z = i((e) => {
+    T?.(e, n);
+  }, [T, n]), ee = i(() => {
+    c();
+  }, [c]), te = oe(
+    U,
+    I.efwTextArea,
+    J === "error" && I.efwTextAreaError
+  );
+  if (g(() => {
+    t || (P((e) => e === f ? e : f), l(f));
+  }, [t, f, l]), !K) {
+    const e = ue(n) || R.emptyState, r = _?.(
+      t ? d : O,
+      e
+    );
+    return r != null ? /* @__PURE__ */ v(ne, { children: r }) : /* @__PURE__ */ v(ae, { style: n ? void 0 : { opacity: 0.7 }, children: e });
+  }
+  return /* @__PURE__ */ v(
+    le,
+    {
+      ref: u,
+      className: te,
+      id: D,
+      name: D,
+      placeholder: R.placeholder,
+      disabled: W,
+      value: n,
+      autoComplete: q,
+      autoCorrect: "off",
+      autoCapitalize: "off",
+      spellCheck: "false",
+      onChange: Y,
+      onKeyDown: Z,
+      onFocus: ee,
+      size: G,
+      style: {
+        resize: a ? "none" : "vertical",
+        overflow: a ? "hidden" : "auto",
+        minHeight: "40px"
+        // Altura mínima para mantener usabilidad
+      }
+    }
+  );
+};
+export {
+  ye as EFWTextArea
+};

package/dist/react-components/fields/{EFWTextArea → TextArea}/EFWTextArea.types.d.ts

@@ -1,9 +1,24 @@
-import { EFWFieldChildrenProps } from '../EFWField/EFWField.types';
+import { EFWFieldChildrenProps } from '../_shared/EFWField/EFWField.types';
+import { ReactNode } from 'react';
 
 /**
- * Representa el valor que puede contener un componente EFWTextArea
+ * Representa el valor que puede contener un componente EFWTextArea.
+ * Semántica recomendada:
+ * - `undefined`: prop ausente (modo uncontrolled)
+ * - `null`: vacío explícito recibido desde integración externa
+ * - `string`: valor efectivo del campo
+ *
+ * Nota: el callback `onChange` emite `string` normalizado.
  */
 export type EFWTextAreaValue = string | null;
+export type EFWTextAreaNonEditableRenderer = (value: EFWTextAreaValue, displayValue: string) => ReactNode;
+export interface EFWTextAreaLabels {
+    placeholder?: string;
+    emptyState?: string;
+}
+export interface EFWTextAreaValidationMessages {
+    maxLength?: (maxLength: number) => string;
+}
 /**
  * Propiedades del componente EFWTextArea
  */
@@ -39,10 +54,6 @@ export interface EFWTextAreaProps extends Partial<EFWFieldChildrenProps> {
      * @default ""
      */
     className?: string;
-    /**
-     * Texto de marcador de posición que se muestra cuando el textarea está vacío
-     */
-    placeholder?: string;
     /**
      * Patrón de formato a aplicar al texto (actualmente no implementado)
      */
@@ -61,16 +72,23 @@ export interface EFWTextAreaProps extends Partial<EFWFieldChildrenProps> {
      * Habilita el redimensionamiento automático de altura basado en el contenido
      * @default true
      */
-    autoResize?: true;
+    autoResize?: boolean;
     /**
      * Función personalizada para formatear el valor del textarea
      * @param value - El valor actual del textarea
      * @returns El valor formateado
      */
     formatFunction?: (value: EFWTextAreaValue) => EFWTextAreaValue;
+    labels?: EFWTextAreaLabels;
+    validationMessages?: EFWTextAreaValidationMessages;
+    /**
+     * Renderiza contenido custom cuando `editable={false}`.
+     * Si retorna `null` o `undefined`, se utiliza el render no editable por defecto.
+     */
+    readOnlyRenderer?: EFWTextAreaNonEditableRenderer;
     /**
      * Callback que se ejecuta cuando el valor del textarea cambia
-     * @param value - El nuevo valor del textarea
+     * @param value - El nuevo valor del textarea (emisión real: `string`)
      * @param displayValue - El valor formateado para mostrar (opcional)
      */
     onChange?: (value: EFWTextAreaValue, displayValue?: string) => void;

package/dist/react-components/fields/TextArea/EFWTextArea.utils.d.ts

@@ -0,0 +1,6 @@
+import { EFWTextAreaValue } from './EFWTextArea.types';
+
+/**
+ * Retorna el valor formateado que EFWTextArea muestra cuando no está en modo editable.
+ */
+export declare const getTextAreaFormattedValue: (value: EFWTextAreaValue | undefined) => string;

package/dist/react-components/fields/TextArea/EFWTextArea.utils.js

@@ -0,0 +1,4 @@
+const t = (e) => e ?? "";
+export {
+  t as getTextAreaFormattedValue
+};

package/dist/react-components/fields/TextArea/EFWTextAreaField.js

@@ -0,0 +1,80 @@
+import { jsx as a } from "react/jsx-runtime";
+import { EFWField as q } from "../_shared/EFWField/EFWField.js";
+import { EFWTextArea as z } from "./EFWTextArea.js";
+import { mergeClasses as B } from "@griffel/react";
+const R = (t) => {
+  const {
+    title: o,
+    infoLabel: n,
+    hint: l,
+    className: r,
+    style: s = {},
+    required: i = !1,
+    contentBefore: d,
+    contentAfter: f,
+    maxLength: m = 1e3,
+    size: c,
+    validationState: g,
+    validationMessage: h,
+    validationMessageIcon: u,
+    value: p,
+    defaultValue: C,
+    editable: e = !0,
+    disabled: b = !1,
+    hidden: x = !1,
+    onChange: F,
+    onKeyDown: v,
+    autoComplete: A = "off",
+    formatPattern: w,
+    formatFunction: y,
+    labels: E,
+    readOnlyRenderer: L,
+    validationMessages: M,
+    onValidationChange: N,
+    ...W
+  } = t, P = (V, j) => {
+    F?.(V, j);
+  }, T = B(r, "efw-textArea-field");
+  return /* @__PURE__ */ a(
+    q,
+    {
+      className: T,
+      style: s,
+      title: o,
+      infoLabel: n,
+      weightLabel: e ? "regular" : "semibold",
+      hint: l,
+      required: i,
+      validationState: g,
+      validationMessage: h,
+      validationMessageIcon: u,
+      onValidationChange: N,
+      hidden: x,
+      ...W,
+      children: /* @__PURE__ */ a(
+        z,
+        {
+          value: p,
+          defaultValue: C,
+          editable: e,
+          onChange: P,
+          onKeyDown: v,
+          maxLength: m,
+          size: c,
+          disabled: b,
+          autoComplete: A,
+          contentBefore: d,
+          contentAfter: f,
+          formatPattern: w,
+          formatFunction: y,
+          labels: E,
+          readOnlyRenderer: L,
+          validationMessages: M
+        }
+      )
+    }
+  );
+};
+export {
+  R as EFWTextAreaField
+};

package/dist/react-components/fields/{EFWTextAreaField → TextArea}/EFWTextAreaField.types.d.ts

@@ -1,5 +1,5 @@
-import { EFWFieldProps } from '../EFWField/EFWField.types';
-import { EFWTextAreaProps, EFWTextAreaValue } from '../EFWTextArea/EFWTextArea.types';
+import { EFWFieldProps } from '../_shared/EFWField/EFWField.types';
+import { EFWTextAreaProps, EFWTextAreaValue } from './EFWTextArea.types';
 
 export type EFWTextAreaFieldValue = EFWTextAreaValue;
 export interface EFWTextAreaFieldProps extends Omit<EFWFieldProps, 'children'>, EFWTextAreaProps {

package/dist/react-components/fields/TextArea/index.d.ts

@@ -0,0 +1,5 @@
+export { EFWTextArea } from './EFWTextArea';
+export { getTextAreaFormattedValue } from './EFWTextArea.utils';
+export type { EFWTextAreaProps, EFWTextAreaValue, EFWTextAreaNonEditableRenderer } from './EFWTextArea.types';
+export { EFWTextAreaField } from './EFWTextAreaField';
+export type { EFWTextAreaFieldProps, EFWTextAreaFieldValue } from './EFWTextAreaField.types';

package/dist/react-components/fields/TextArea/index.js

@@ -0,0 +1,8 @@
+import { EFWTextArea as t } from "./EFWTextArea.js";
+import { getTextAreaFormattedValue as x } from "./EFWTextArea.utils.js";
+import { EFWTextAreaField as m } from "./EFWTextAreaField.js";
+export {
+  t as EFWTextArea,
+  m as EFWTextAreaField,
+  x as getTextAreaFormattedValue
+};

package/dist/react-components/fields/_shared/EFWField/EFWField.js

@@ -0,0 +1,119 @@
+import { jsx as u } from "react/jsx-runtime";
+import { makeStyles as B, tokens as a, InfoLabel as C, mergeClasses as L, Field as k } from "@fluentui/react-components";
+import N, { useMemo as i } from "react";
+import { getValidationIcon as O } from "./EFWField.utils.js";
+import { useSyncedValidationState as j } from "./useSyncedValidationState.js";
+const E = B({
+  "efw-textField": {
+    "& .fui-Field__validationMessage:empty": {
+      display: "none !important"
+    }
+  },
+  "efw-textField-success": {
+    "& .fui-Field__validationMessage": {
+      color: a.colorPaletteGreenBorder2
+    }
+  },
+  "efw-textField-warning": {
+    "& .fui-Field__validationMessage": {
+      color: a.colorPaletteDarkOrangeForeground1
+    }
+  },
+  "efw-textField-loading": {
+    "& .fui-Field__validationMessage": {
+      color: a.colorBrandForeground1
+    },
+    "& .fui-Spinner__spinner": {
+      width: "13px",
+      height: "13px"
+    }
+  },
+  "efw-textField-error": {
+    "::after": {
+      borderBottom: `2px solid ${a.colorPaletteRedBorder2} !important`
+    }
+  }
+}), W = (n) => {
+  const {
+    title: l,
+    hint: m,
+    className: F,
+    style: w = {},
+    infoLabel: s,
+    weightLabel: r = "regular",
+    required: d = !1,
+    hidden: v = !1,
+    orientation: x,
+    size: p,
+    children: c,
+    validationMessageIcon: f,
+    validationState: M = "none",
+    validationMessage: S = "",
+    onValidationChange: h,
+    ..._
+  } = n, t = E(), {
+    validationState: e,
+    validationMessage: g,
+    setFieldState: y
+  } = j({
+    externalValidationState: M,
+    externalValidationMessage: S,
+    onValidationChange: h
+  }), o = i(
+    () => O(e),
+    [e]
+  ), V = i(() => Object.prototype.hasOwnProperty.call(n, "validationMessageIcon") ? f ?? o : o, [n, o, f]), b = i(() => {
+    switch (e) {
+      case "success":
+      case "warning":
+      case "error":
+      case "none":
+        return e;
+      default:
+        return "none";
+    }
+  }, [e]), I = i(
+    () => /* @__PURE__ */ u(
+      C,
+      {
+        weight: r,
+        info: s || "",
+        required: d,
+        children: l
+      }
+    ),
+    [s, d, r, l]
+  );
+  if (v) return null;
+  const P = L(
+    F,
+    t["efw-textField"],
+    e === "success" && t["efw-textField-success"],
+    e === "warning" && t["efw-textField-warning"],
+    e === "loading" && t["efw-textField-loading"],
+    e === "error" && t["efw-textField-error"]
+  );
+  return /* @__PURE__ */ u(
+    k,
+    {
+      style: { ...w },
+      className: P,
+      label: I,
+      hint: m,
+      validationState: b,
+      validationMessage: g,
+      validationMessageIcon: V,
+      orientation: x,
+      size: p,
+      ..._,
+      children: c && N.cloneElement(c, {
+        setParentComponentState: y,
+        validationState: e,
+        validationMessage: g
+      })
+    }
+  );
+};
+export {
+  W as EFWField
+};