@envisiongroup/porygon 0.1.0-rc.2 → 0.1.0-rc.3

package/dist/react-components/fields/EFWAttachments/EFWAttachments.js

@@ -1,11 +1,11 @@
-import { jsxs as x, jsx as r } from "react/jsx-runtime";
-import { makeStyles as k, mergeClasses as B, CardFooter as N, Button as j, Text as M } from "@fluentui/react-components";
-import { useId as V, useRef as $, useState as T, useEffect as F, useCallback as m } from "react";
-import { EFWAttachmentsContainer as q } from "./EFWAttachmentsCard/EFWAttachmentsCard.js";
-import { Attach20Regular as D } from "@fluentui/react-icons";
-import { formatFileSize as I } from "../../commons/utils.js";
-import { v4 as P } from "uuid";
-const G = k({
+import { jsxs as C, jsx as r } from "react/jsx-runtime";
+import { makeStyles as j, mergeClasses as $, CardFooter as V, Button as D, Text as T } from "@fluentui/react-components";
+import { useId as q, useRef as I, useMemo as P, useState as U, useEffect as S, useCallback as d } from "react";
+import { EFWAttachmentsContainer as G } from "./EFWAttachmentsCard/EFWAttachmentsCard.js";
+import { Attach20Regular as H } from "@fluentui/react-icons";
+import { formatFileSize as J } from "../../commons/utils.js";
+import { v4 as K } from "uuid";
+const L = j({
   efwAttachmentError: {
     //...
   },
@@ -18,101 +18,102 @@ const G = k({
   efwAttachmentsContainer: {
     display: "flex"
   }
-}), X = (g) => {
+}), te = (w) => {
   const {
-    editable: d = !0,
-    disabled: o = !1,
-    files: f = [],
-    className: S = "",
-    validationState: w = "none",
-    setParentComponentState: l,
-    multiple: u = !0,
-    acceptedTypes: C = "*/*",
-    maxFileSize: c = 100 * 1024 * 1024,
+    editable: f = !0,
+    disabled: i = !1,
+    files: y,
+    defaultFiles: u,
+    className: z = "",
+    validationState: E = "none",
+    setParentComponentState: c,
+    multiple: h = !0,
+    acceptedTypes: R = "*/*",
+    maxFileSize: m = 100 * 1024 * 1024,
     // 100MB por defecto
     onChange: a,
-    onRemoveAttachment: h
-  } = g, z = V(), p = G(), i = $(null), [t, A] = T(f);
-  F(() => {
-    A(f);
-  }, [f]);
-  const y = m((n) => {
-    for (const s of n)
-      if (s.size !== void 0 && s.size > c)
+    onRemoveAttachment: p
+  } = w, b = q(), A = L(), l = I(null), s = y !== void 0, F = P(() => u ?? [], [u]), [W, v] = U(() => u ?? []), t = s ? y ?? [] : W;
+  S(() => {
+    s || v(F);
+  }, [s, F]);
+  const x = d((n) => {
+    for (const o of n)
+      if (o.size !== void 0 && o.size > m)
         return !1;
     return !0;
-  }, [c]);
-  F(() => {
-    t.length > 0 ? y(t) ? l?.("none") : l?.("error", `Existe un adjunto que excede el peso máximo de ${I(c)}.`) : l?.("none");
-  }, [t, y, l, c]);
-  const E = m(() => {
-    i.current && !o && i.current.click();
-  }, [o]), R = m(async (n) => {
-    const s = t.find((e) => e.id === n);
-    if (!s) {
+  }, [m]);
+  S(() => {
+    t.length > 0 ? x(t) ? c?.("none") : c?.("error", `Existe un adjunto que excede el peso máximo de ${J(m)}.`) : c?.("none");
+  }, [t, x, c, m]);
+  const k = d(() => {
+    l.current && !i && l.current.click();
+  }, [i]), B = d(async (n) => {
+    const o = t.find((e) => e.id === n);
+    if (!o) {
       console.warn(`[EFWAttachment]: Attachment with id ${n} not found`);
       return;
     }
     try {
-      if (h && !await h(s)) {
+      if (p && !await p(o)) {
         console.log(`[EFWAttachment]: Removal of file ${n} was cancelled`);
         return;
       }
-      const e = t.filter((v) => v.id !== n);
-      A(e), a && a(e), console.log(`[EFWAttachment]: File ${n} removed successfully`);
+      const e = t.filter((g) => g.id !== n);
+      s || v(e), a && a(e), console.log(`[EFWAttachment]: File ${n} removed successfully`);
     } catch (e) {
       console.error("[EFWAttachment]: Detele file error:", e);
     }
-  }, [t, h, a]), b = m((n) => {
-    const s = Array.from(n.target.files || []).map((e) => ({
-      id: P(),
+  }, [t, p, a, s]), M = d((n) => {
+    const o = Array.from(n.target.files || []).map((e) => ({
+      id: K(),
       name: e.name,
       size: e.size,
       type: e.type,
       lastModified: e.lastModified,
       file: e
     }));
-    if (s.length > 0) {
-      const e = u ? [...t, ...s] : s;
-      A(e), a?.(e);
+    if (o.length > 0) {
+      const e = h ? [...t, ...o] : o;
+      s || v(e), a?.(e);
     }
-    i.current && (i.current.value = "");
-  }, [t, u, a]), W = B(
-    S,
-    w === "error" && p.efwAttachmentError
+    l.current && (l.current.value = "");
+  }, [t, h, a, s]), N = $(
+    z,
+    E === "error" && A.efwAttachmentError
   );
-  return /* @__PURE__ */ x("div", { className: W, children: [
-    d && /* @__PURE__ */ x(N, { style: { display: "disabled" }, children: [
+  return /* @__PURE__ */ C("div", { className: N, children: [
+    f && /* @__PURE__ */ C(V, { style: { display: "disabled" }, children: [
       /* @__PURE__ */ r(
         "input",
         {
-          ref: i,
-          id: z,
+          ref: l,
+          id: b,
           type: "file",
-          className: p.efwAttachmentInput,
-          accept: C,
-          multiple: u,
-          onChange: b,
-          disabled: o
+          className: A.efwAttachmentInput,
+          accept: R,
+          multiple: h,
+          onChange: M,
+          disabled: i
         }
       ),
       /* @__PURE__ */ r(
-        j,
+        D,
         {
           size: "medium",
-          onClick: E,
-          icon: /* @__PURE__ */ r(D, {}),
-          disabled: o,
-          className: p.efwAttachmentsButton,
+          onClick: k,
+          icon: /* @__PURE__ */ r(H, {}),
+          disabled: i,
+          className: A.efwAttachmentsButton,
           children: "Adjuntar archivos"
         }
       )
     ] }),
-    !d && t.length === 0 ? /* @__PURE__ */ r(M, { style: { opacity: 0.7 }, children: "Sin archivos disponibles" }) : /* @__PURE__ */ r(
-      q,
+    !f && t.length === 0 ? /* @__PURE__ */ r(T, { style: { opacity: 0.7 }, children: "Sin archivos disponibles" }) : /* @__PURE__ */ r(
+      G,
       {
-        enableRemoveButtons: d && !o,
-        onRemoveAttachment: R,
+        enableRemoveButtons: f && !i,
+        onRemoveAttachment: B,
         attachments: t,
         emptyMessage: "Sin archivos disponibles"
       }
@@ -120,5 +121,5 @@ const G = k({
   ] });
 };
 export {
-  X as EFWAttachment
+  te as EFWAttachment
 };

package/dist/react-components/fields/EFWAttachments/EFWAttachments.types.d.ts

@@ -33,10 +33,16 @@ export type EFWAttachmentsOnChange = (values: EFWAttachmentsValue[], displayValu
  */
 export interface EFWAttachmentsProps extends EFWFieldChildrenProps {
     /**
-     * Lista inicial de archivos adjuntos
-     * @default []
+     * Lista de archivos adjuntos controlada desde el componente padre.
+     * Cuando se define, el componente opera en modo controlled y renderiza exactamente
+     * los archivos proporcionados en esta propiedad.
      */
     files?: EFWAttachmentsValue[];
+    /**
+     * Lista inicial de archivos adjuntos en modo uncontrolled.
+     * Solo se usa durante el montaje cuando `files` no está definido.
+     */
+    defaultFiles?: EFWAttachmentsValue[];
     /**
      * Indica si el componente permite cargar o eliminar adjuntos
      * @default true

package/dist/react-components/fields/EFWAttachmentsField/EFWAttachmentsField.js

@@ -1,7 +1,7 @@
 import { jsx as t } from "react/jsx-runtime";
-import { EFWField as v } from "../EFWField/EFWField.js";
-import { EFWAttachment as A } from "../EFWAttachments/EFWAttachments.js";
-const L = (a) => {
+import { EFWField as A } from "../EFWField/EFWField.js";
+import { EFWAttachment as E } from "../EFWAttachments/EFWAttachments.js";
+const j = (a) => {
   const {
     title: n,
     infoLabel: i,
@@ -13,15 +13,16 @@ const L = (a) => {
     disabled: h = !1,
     editable: e = !0,
     hidden: m = !1,
-    files: c = [],
-    multiple: f = !0,
-    acceptedTypes: g = "*/*",
-    onRemoveAttachment: p,
-    onChange: u,
+    files: c,
+    defaultFiles: f,
+    multiple: g = !0,
+    acceptedTypes: p = "*/*",
+    onRemoveAttachment: u,
+    onChange: F,
     onValidationChange: b
   } = a;
   return /* @__PURE__ */ t(
-    v,
+    A,
     {
       style: o,
       title: n,
@@ -34,22 +35,23 @@ const L = (a) => {
       validationMessage: s,
       onValidationChange: b,
       children: /* @__PURE__ */ t(
-        A,
+        E,
         {
           files: c,
+          defaultFiles: f,
           editable: e,
-          onChange: (C, F) => {
-            u?.(C, F);
+          onChange: (C, v) => {
+            F?.(C, v);
           },
           disabled: h,
-          multiple: f,
-          acceptedTypes: g,
-          onRemoveAttachment: p
+          multiple: g,
+          acceptedTypes: p,
+          onRemoveAttachment: u
         }
       )
     }
   );
 };
 export {
-  L as EFWAttachmentsField
+  j as EFWAttachmentsField
 };

package/dist/react-components/fields/EFWDatePicker/EFWDatePicker.js

@@ -1,135 +1,114 @@
-import { jsx as D, Fragment as W } from "react/jsx-runtime";
-import { makeStyles as j, tokens as u, mergeClasses as q, Text as G } from "@fluentui/react-components";
-import { useId as U, useState as H, useRef as b, useEffect as J, useCallback as h } from "react";
-import { DatePicker as K } from "@fluentui/react-datepicker-compat";
-import { arraysAreEqual as O, esLocalizedStrings as F } from "./EFWDatePicker.utils.js";
-const Q = j({
+import { jsx as h, Fragment as H } from "react/jsx-runtime";
+import { makeStyles as J, tokens as l, mergeClasses as K, Text as O } from "@fluentui/react-components";
+import { useId as Q, useMemo as y, useState as X, useRef as M, useCallback as D, useEffect as Z } from "react";
+import { DatePicker as ee } from "@fluentui/react-datepicker-compat";
+import { mapToValidDates as p, esLocalizedStrings as F } from "./EFWDatePicker.utils.js";
+const C = [], te = J({
   efwDatePickerControl: {
     "& [disabled]": {
-      backgroundColor: u.colorNeutralBackground3,
-      color: u.colorNeutralForeground2,
+      backgroundColor: l.colorNeutralBackground3,
+      color: l.colorNeutralForeground2,
       "&::placeholder": {
         color: "transparent"
       }
     },
     // Afectar el span que contiene el input disabled
     "&:has([disabled])": {
-      backgroundColor: u.colorNeutralBackground3
+      backgroundColor: l.colorNeutralBackground3
     }
   },
   efwDatePickerControlError: {
-    backgroundColor: u.colorPaletteRedBackground1,
+    backgroundColor: l.colorPaletteRedBackground1,
     "::after": {
-      borderBottomColor: u.colorPaletteRedBorder2,
+      borderBottomColor: l.colorPaletteRedBorder2,
       borderBottomStyle: "solid",
       borderBottomWidth: "2px"
     }
   }
-});
-function P(i) {
-  return i.map((a) => {
-    if (a instanceof Date)
-      return p(a) ? a : null;
-    if (typeof a == "string") {
-      const l = new Date(a);
-      return p(l) ? l : null;
-    }
-    if (typeof a == "number") {
-      const l = new Date(a);
-      return p(l) ? l : null;
-    }
-    return null;
-  }).filter((a) => a !== null);
-}
-function p(i) {
-  return i instanceof Date && !isNaN(i.getTime());
-}
-const ot = (i) => {
+}), se = (x) => {
   const {
-    editable: a = !0,
-    disabled: l = !1,
-    placeholder: M = "DD/MM/YYYY",
-    className: x = "",
-    selectedDates: r = [],
-    allowTextInput: w = !0,
-    localizedStrings: B = F,
-    minDate: N,
-    maxDate: T,
-    showGoToToday: V = !0,
-    showCloseButton: Y = !0,
-    restrictedDates: $ = [],
-    friendlyDateFormat: C = !1,
-    onSelectDate: d,
-    onChange: g,
-    validationState: R = "none",
-    setParentComponentState: m
-  } = i, k = U(), y = Q(), [t, S] = H(P(r)), v = b(null), E = b(null);
-  J(() => {
-    const o = r.length === 0 && t.length > 0, n = t.length === 0 && r.length > 0, e = r.length > 0 && !O(r, t);
-    console.log("useeffect initialValues", r);
-    let s = P(r);
-    (o || n || e) && (console.log("Actualizando valores:", {
-      isReset: o,
-      isFirstMount: n,
-      isExternalUpdate: e,
-      newValues: s
-    }), S(s));
-  }, [r]);
-  const I = h((o) => {
+    editable: T = !0,
+    disabled: Y = !1,
+    placeholder: B = "DD/MM/YYYY",
+    className: V = "",
+    selectedDates: u = C,
+    defaultSelectedDates: d = C,
+    allowTextInput: $ = !0,
+    localizedStrings: w = F,
+    minDate: E,
+    maxDate: I,
+    showGoToToday: N = !0,
+    showCloseButton: R = !0,
+    restrictedDates: v = C,
+    friendlyDateFormat: S = !1,
+    onSelectDate: s,
+    onChange: m,
+    validationState: z = "none",
+    setParentComponentState: f
+  } = x, k = Q(), P = te(), n = u !== void 0, A = y(() => p(u ?? []), [u]), b = y(() => p(d), [d]), [L, g] = X(() => p(d)), e = n ? A : L, W = M(null), j = M(null), G = D((o) => {
     if (!o) return "";
-    const n = o.getDate(), e = o.getMonth(), s = o.getFullYear();
-    if (C)
-      return `${F.months[e]} ${n}, ${s}`;
+    const a = o.getDate(), t = o.getMonth(), c = o.getFullYear();
+    if (S)
+      return `${F.months[t]} ${a}, ${c}`;
     {
-      const f = n < 10 ? `0${n}` : n, c = e + 1 < 10 ? `0${e + 1}` : e + 1;
-      return `${f}/${c}/${s}`;
+      const i = a < 10 ? `0${a}` : a, r = t + 1 < 10 ? `0${t + 1}` : t + 1;
+      return `${i}/${r}/${c}`;
+    }
+  }, [S]), U = D((o) => {
+    const a = e.length && e[0] instanceof Date ? e[0] : /* @__PURE__ */ new Date(), t = (o || "").trim().split("/"), c = t.length > 0 ? Math.max(1, Math.min(31, parseInt(t[0], 10))) : a.getDate(), i = t.length > 1 ? Math.max(1, Math.min(12, parseInt(t[1], 10))) - 1 : a.getMonth();
+    let r = t.length > 2 ? parseInt(t[2], 10) : a.getFullYear();
+    return r < 100 && (r += a.getFullYear() - a.getFullYear() % 100), new Date(r, i, c);
+  }, [e]), _ = D((o) => {
+    if (!(o instanceof Date)) {
+      !n && e.length > 0 && g([]), s?.(null), m?.([]), f?.("none", "");
+      return;
+    }
+    if (e.length > 0 && e[0] instanceof Date ? e[0].getTime() === o.getTime() : !1) {
+      s?.(o);
+      return;
     }
-  }, [C]), z = h((o) => {
-    const n = t.length && t[0] instanceof Date ? t[0] : /* @__PURE__ */ new Date(), e = (o || "").trim().split("/"), s = e.length > 0 ? Math.max(1, Math.min(31, parseInt(e[0], 10))) : n.getDate(), f = e.length > 1 ? Math.max(1, Math.min(12, parseInt(e[1], 10))) - 1 : n.getMonth();
-    let c = e.length > 2 ? parseInt(e[2], 10) : n.getFullYear();
-    return c < 100 && (c += n.getFullYear() - n.getFullYear() % 100), new Date(c, f, s);
-  }, [t]), A = h((o) => {
-    if ((t.length === 0 || (o instanceof Date && t[0] instanceof Date ? o.getTime() !== t[0].getTime() : o !== t[0])) && o instanceof Date) {
-      const e = [o];
-      S(e), d?.(o), g?.(e), m?.("none", "");
-    } else
-      d?.(null), g?.([]), m?.("none", "");
-  }, [t, d, g, m]), L = q(
-    x,
-    y.efwDatePickerControl,
-    R === "error" && y.efwDatePickerControlError
+    const t = [o];
+    n || g(t), s?.(o), m?.(t), f?.("none", "");
+  }, [e, n, s, m, f]);
+  Z(() => {
+    n || g(b);
+  }, [n, b]);
+  const q = K(
+    V,
+    P.efwDatePickerControl,
+    z === "error" && P.efwDatePickerControlError
   );
-  return /* @__PURE__ */ D(W, { children: a ? /* @__PURE__ */ D(
-    K,
+  return /* @__PURE__ */ h(H, { children: T ? /* @__PURE__ */ h(
+    ee,
     {
       calendar: {
-        componentRef: E,
-        restrictedDates: $
+        componentRef: j,
+        restrictedDates: v
       },
-      strings: B,
-      className: L,
-      ref: v,
+      strings: w,
+      className: q,
+      ref: W,
       id: k,
       name: k,
       autoComplete: "off",
       autoCorrect: "off",
       autoCapitalize: "off",
       spellCheck: "false",
-      allowTextInput: w,
+      allowTextInput: $,
       disableAutoFocus: !0,
-      value: t.length > 0 ? t[0] : null,
-      minDate: N,
-      maxDate: T,
-      disabled: l,
-      onSelectDate: A,
-      formatDate: I,
-      parseDateFromString: z,
-      placeholder: M,
-      showGoToToday: V,
-      showCloseButton: Y
+      value: e.length > 0 ? e[0] : null,
+      minDate: E,
+      maxDate: I,
+      disabled: Y,
+      onSelectDate: _,
+      formatDate: G,
+      parseDateFromString: U,
+      placeholder: B,
+      showGoToToday: N,
+      showCloseButton: R
     }
-  ) : /* @__PURE__ */ D(G, { style: t.length ? void 0 : { opacity: 0.7 }, children: t.length > 0 && t[0] instanceof Date ? t[0].toLocaleDateString() : "Sin datos disponibles" }) });
+  ) : /* @__PURE__ */ h(O, { style: e.length ? void 0 : { opacity: 0.7 }, children: e.length > 0 && e[0] instanceof Date ? e[0].toLocaleDateString() : "Sin datos disponibles" }) });
 };
 export {
-  ot as EFWDatePicker
+  se as EFWDatePicker
 };

package/dist/react-components/fields/EFWDatePicker/EFWDatePicker.types.d.ts

@@ -10,9 +10,14 @@ export type EFWDatePickerOnChange = (value: EFWDatePickerValue[]) => void;
 export interface EFWDatePickerProps extends Omit<Partial<DatePickerProps>, 'onChange' | 'id' | 'value'>, EFWFieldChildrenProps {
     /**
      * Array de fechas seleccionadas iniciales. Puede contener objetos Date o strings que representen fechas.
-     * @default []
+     * Si se proporciona, el componente opera en modo controlled.
      */
     selectedDates?: EFWDatePickerValue[];
+    /**
+     * Valor inicial para modo uncontrolled. Solo se usa cuando `selectedDates` no está definido.
+     * @default []
+     */
+    defaultSelectedDates?: EFWDatePickerValue[];
     /**
      * Permite la entrada de texto manual para introducir fechas directamente en el campo de entrada.
      * @default true

package/dist/react-components/fields/EFWDatePicker/EFWDatePicker.utils.d.ts

@@ -19,4 +19,6 @@ declare const esLocalizedStrings: CalendarStrings;
 declare const esOnFormatDate: (date?: Date, friendlyFormat?: boolean) => string;
 declare const normalizeToDate: (value: Date | string | null | undefined) => Date | null;
 declare const arraysAreEqual: (arr1: (Date | string)[], arr2: (Date | string)[]) => boolean;
+export declare const mapToValidDates: (arr?: unknown[]) => Date[];
+export declare const isValidDate: (date: Date) => boolean;
 export { esLocalizedStrings, esOnFormatDate, normalizeToDate, arraysAreEqual };

package/dist/react-components/fields/EFWDatePicker/EFWDatePicker.utils.js

@@ -1,5 +1,5 @@
 import { defaultDatePickerStrings as l } from "@fluentui/react-datepicker-compat";
-const u = {
+const c = {
   ...l,
   days: [
     "Domingo",
@@ -40,37 +40,51 @@ const u = {
     "Dic"
   ],
   goToToday: "Ir a hoy"
-}, f = (t, o = !1) => {
+}, g = (t, n = !1) => {
   if (!t) return "";
-  const e = t.getDate(), n = t.getMonth(), r = t.getFullYear();
-  if (o)
-    return `${u.months[n]} ${e}, ${r}`;
+  const e = t.getDate(), r = t.getMonth(), o = t.getFullYear();
+  if (n)
+    return `${c.months[r]} ${e}, ${o}`;
   {
-    const s = e < 10 ? `0${e}` : e, a = n + 1 < 10 ? `0${n + 1}` : n + 1;
-    return `${s}/${a}/${r}`;
+    const i = e < 10 ? `0${e}` : e, u = r + 1 < 10 ? `0${r + 1}` : r + 1;
+    return `${i}/${u}/${o}`;
   }
-}, i = (t) => {
+}, a = (t) => {
   if (t instanceof Date) return t;
   if (typeof t == "string")
     try {
-      const o = new Date(t);
-      return isNaN(o.getTime()) ? null : o;
+      const n = new Date(t);
+      return isNaN(n.getTime()) ? null : n;
     } catch {
       return null;
     }
   return null;
-}, g = (t, o) => {
-  if (t.length !== o.length) return !1;
+}, D = (t, n) => {
+  if (t.length !== n.length) return !1;
   for (let e = 0; e < t.length; e++) {
-    const n = i(t[e]), r = i(o[e]);
-    if (!(n === null && r === null) && (n === null || r === null || n.getTime() !== r.getTime()))
+    const r = a(t[e]), o = a(n[e]);
+    if (!(r === null && o === null) && (r === null || o === null || r.getTime() !== o.getTime()))
       return !1;
   }
   return !0;
-};
+}, h = (t = []) => t.map((n) => {
+  if (n instanceof Date)
+    return s(n) ? n : null;
+  if (typeof n == "string") {
+    const e = new Date(n);
+    return s(e) ? e : null;
+  }
+  if (typeof n == "number") {
+    const e = new Date(n);
+    return s(e) ? e : null;
+  }
+  return null;
+}).filter((n) => n !== null), s = (t) => t instanceof Date && !isNaN(t.getTime());
 export {
-  g as arraysAreEqual,
-  u as esLocalizedStrings,
-  f as esOnFormatDate,
-  i as normalizeToDate
+  D as arraysAreEqual,
+  c as esLocalizedStrings,
+  g as esOnFormatDate,
+  s as isValidDate,
+  h as mapToValidDates,
+  a as normalizeToDate
 };