@envisiongroup/porygon 1.0.0-rc.33 → 1.0.0-rc.34

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

@@ -1,17 +1,17 @@
 import { jsx as a } from "react/jsx-runtime";
-import { EFWField as y } from "../_shared/EFWField/EFWField.js";
-import { EFWAttachment as L } from "./EFWAttachments.js";
-import { mergeClasses as M } from "@griffel/react";
-const I = (t) => {
+import { EFWField as L } from "../_shared/EFWField/EFWField.js";
+import { EFWAttachment as M } from "./EFWAttachments.js";
+import { mergeClasses as S } from "@griffel/react";
+const P = (t) => {
   const {
     title: l,
-    infoLabel: i,
-    hint: s,
+    infoLabel: s,
+    hint: i,
     className: n,
     style: o = {},
-    required: m = !1,
-    validationState: d,
-    validationMessage: r,
+    required: r = !1,
+    validationState: m,
+    validationMessage: d,
     validationMessageIcon: c,
     disabled: f = !1,
     editable: e = !0,
@@ -24,32 +24,34 @@ const I = (t) => {
     labels: C,
     onRemoveAttachment: v,
     onChange: x,
-    onValidationChange: A
-  } = t, E = (W, w) => {
-    x?.(W, w);
-  }, N = M(n, "efw-attachments-field");
+    onValidationChange: A,
+    ...E
+  } = t, N = (w, y) => {
+    x?.(w, y);
+  }, W = S(n, "efw-attachments-field");
   return /* @__PURE__ */ a(
-    y,
+    L,
     {
-      className: N,
+      className: W,
       style: o,
       title: l,
-      infoLabel: i,
+      infoLabel: s,
       weightLabel: e ? "regular" : "semibold",
-      hint: s,
+      hint: i,
       hidden: h,
-      required: m,
-      validationState: d,
-      validationMessage: r,
+      required: r,
+      validationState: m,
+      validationMessage: d,
       validationMessageIcon: c,
       onValidationChange: A,
+      ...E,
       children: /* @__PURE__ */ a(
-        L,
+        M,
         {
           files: g,
           defaultFiles: p,
           editable: e,
-          onChange: E,
+          onChange: N,
           disabled: f,
           multiple: u,
           acceptedTypes: F,
@@ -62,5 +64,5 @@ const I = (t) => {
   );
 };
 export {
-  I as EFWAttachmentsField
+  P as EFWAttachmentsField
 };

package/dist/react-components/fields/DatePicker/EFWDatePickerField.js

@@ -1,12 +1,12 @@
-import { jsx as o, jsxs as ie } from "react/jsx-runtime";
-import { EFWField as oe } from "../_shared/EFWField/EFWField.js";
+import { jsx as o, jsxs as oe } from "react/jsx-runtime";
+import { EFWField as se } from "../_shared/EFWField/EFWField.js";
 import { EFWDatePicker as q } from "./EFWDatePicker.js";
-import { getDatePickerFormattedValue as se } from "./EFWDatePicker.utils.js";
-import { EFWInput as re } from "../Input/EFWInput.js";
-import { useMemo as C, useState as ce, useRef as de, useEffect as Y, useCallback as _ } from "react";
-import { makeStyles as me, mergeClasses as ue, Text as A } from "@fluentui/react-components";
-import { useFieldsLocaleText as fe } from "../../i18n/PorygonI18nProvider.js";
-const he = me({
+import { getDatePickerFormattedValue as re } from "./EFWDatePicker.utils.js";
+import { EFWInput as ce } from "../Input/EFWInput.js";
+import { useMemo as C, useState as de, useRef as me, useEffect as Y, useCallback as _ } from "react";
+import { makeStyles as ue, mergeClasses as fe, Text as A } from "@fluentui/react-components";
+import { useFieldsLocaleText as he } from "../../i18n/PorygonI18nProvider.js";
+const De = ue({
   dateTimeContainer: {
     display: "flex",
     gap: "8px",
@@ -35,7 +35,7 @@ const he = me({
       width: "75px"
     }
   }
-}), De = {}, ge = [];
+}), ge = {}, Se = [];
 function $(e, t) {
   const l = new Date(e.getTime());
   if (t && t.length === 4) {
@@ -45,23 +45,23 @@ function $(e, t) {
   }
   return l.setHours(0, 0, 0, 0), l;
 }
-function Se(e) {
+function Te(e) {
   const t = e.getHours().toString().padStart(2, "0"), l = e.getMinutes().toString().padStart(2, "0");
   return `${t}${l}`;
 }
-const Te = (e) => {
-  const t = he(), l = C(
+const be = (e) => {
+  const t = De(), l = C(
     () => ({ placeholder: e.timePlaceholder }),
     [e.timePlaceholder]
   );
   if (!e.editable) {
-    const i = se(e.currentDate, {
+    const i = re(e.currentDate, {
       includeTime: !0,
       timeValue: e.currentTime
     });
     return i ? /* @__PURE__ */ o(A, { children: i }) : /* @__PURE__ */ o(A, { style: { opacity: 0.7 }, children: e.labels?.emptyState ?? "" });
   }
-  return /* @__PURE__ */ ie("div", { className: t.dateTimeContainer, children: [
+  return /* @__PURE__ */ oe("div", { className: t.dateTimeContainer, children: [
     /* @__PURE__ */ o("div", { className: t.datePickerWrapper, children: /* @__PURE__ */ o(
       q,
       {
@@ -87,7 +87,7 @@ const Te = (e) => {
       }
     ) }),
     /* @__PURE__ */ o("div", { className: t.timeInputWrapper, children: /* @__PURE__ */ o(
-      re,
+      ce,
       {
         value: e.currentTime,
         formatType: "time",
@@ -100,13 +100,13 @@ const Te = (e) => {
       }
     ) })
   ] });
-}, Ee = (e) => {
+}, Ne = (e) => {
   const {
     title: t,
     infoLabel: l,
     hint: i,
     className: c,
-    style: U = De,
+    style: U = ge,
     required: J = !1,
     validationState: K,
     validationMessage: Q,
@@ -118,7 +118,7 @@ const Te = (e) => {
     selectedDates: s,
     defaultSelectedDates: f,
     allowRangeSelection: w = !1,
-    restrictedDates: y = ge,
+    restrictedDates: y = Se,
     allowTextInput: P = !0,
     minDate: I,
     maxDate: v,
@@ -134,8 +134,9 @@ const Te = (e) => {
     includeTime: u = !1,
     timeValue: R,
     defaultTimeValue: ee = "",
-    timePlaceholder: te = "HH:MM"
-  } = e, V = fe().datePicker.labels, H = V.placeholder, O = V.emptyState, j = M?.placeholder, z = M?.emptyState, B = C(() => ({
+    timePlaceholder: te = "HH:MM",
+    ...ae
+  } = e, V = he().datePicker.labels, H = V.placeholder, O = V.emptyState, j = M?.placeholder, z = M?.emptyState, B = C(() => ({
     placeholder: j ?? H,
     emptyState: z ?? O
   }), [
@@ -143,7 +144,7 @@ const Te = (e) => {
     z,
     H,
     O
-  ]), d = R !== void 0, [ae, D] = ce(ee), g = d ? R : ae, S = de(null), T = C(() => {
+  ]), d = R !== void 0, [ne, D] = de(ee), g = d ? R : ne, S = me(null), T = C(() => {
     const n = s ?? f ?? [];
     if (n.length === 0) return null;
     const a = n[0];
@@ -158,7 +159,7 @@ const Te = (e) => {
       return;
     }
     const n = s[0], a = n instanceof Date ? n : new Date(n);
-    isNaN(a.getTime()) || d || D(Se(a));
+    isNaN(a.getTime()) || d || D(Te(a));
   }, [s, u, d]);
   const G = _((n) => {
     const a = (r) => r instanceof Date ? r.toISOString() : r;
@@ -168,17 +169,17 @@ const Te = (e) => {
     }
     const b = n.map((r) => r instanceof Date ? $(r, g).toISOString() : r);
     m?.(b);
-  }, [u, g, m]), ne = _((n) => {
+  }, [u, g, m]), le = _((n) => {
     const a = n ?? "";
     if (d || D(a), S.current && a.length === 4) {
       const b = $(S.current, a);
       m?.([b.toISOString()]);
     }
-  }, [d, m]), le = ue(c, "efw-datePicker-field");
+  }, [d, m]), ie = fe(c, "efw-datePicker-field");
   return /* @__PURE__ */ o(
-    oe,
+    se,
     {
-      className: le,
+      className: ie,
       style: U,
       title: t,
       infoLabel: l,
@@ -190,8 +191,9 @@ const Te = (e) => {
       validationMessage: Q,
       validationMessageIcon: X,
       onValidationChange: p,
+      ...ae,
       children: u ? /* @__PURE__ */ o(
-        Te,
+        be,
         {
           editable: h,
           disabled: x,
@@ -211,7 +213,7 @@ const Te = (e) => {
           onFormatDate: L,
           labels: B,
           currentTime: g,
-          onTimeChange: ne,
+          onTimeChange: le,
           timePlaceholder: te,
           currentDate: T
         }
@@ -241,5 +243,5 @@ const Te = (e) => {
   );
 };
 export {
-  Ee as EFWDatePickerField
+  Ne as EFWDatePickerField
 };

package/dist/react-components/fields/Input/EFWInputField.js

@@ -1,8 +1,8 @@
 import { jsx as t } from "react/jsx-runtime";
 import { EFWField as A } from "../_shared/EFWField/EFWField.js";
 import { EFWInput as B } from "./EFWInput.js";
-import { mergeClasses as P } from "@griffel/react";
-const G = (a) => {
+import { mergeClasses as S } from "@griffel/react";
+const H = (a) => {
   const {
     title: n,
     infoLabel: o,
@@ -14,10 +14,10 @@ const G = (a) => {
     contentBefore: f,
     contentAfter: m,
     minLength: g = 0,
-    maxLength: u = 250,
-    validationState: c,
-    validationMessage: h,
-    validationMessageIcon: p,
+    maxLength: p = 250,
+    validationState: u,
+    validationMessage: c,
+    validationMessageIcon: h,
     value: C,
     defaultValue: b,
     editable: e = !0,
@@ -31,10 +31,11 @@ const G = (a) => {
     formatFunction: M,
     labels: N,
     validationMessages: W,
-    onValidationChange: w
+    onValidationChange: w,
+    ...P
   } = a, V = (q, z) => {
     x?.(q, z);
-  }, j = P(r, "efw-input-field");
+  }, j = S(r, "efw-input-field");
   return /* @__PURE__ */ t(
     A,
     {
@@ -46,11 +47,12 @@ const G = (a) => {
       hint: i,
       size: s,
       required: d,
-      validationState: c,
-      validationMessage: h,
-      validationMessageIcon: p,
+      validationState: u,
+      validationMessage: c,
+      validationMessageIcon: h,
       onValidationChange: w,
       hidden: v,
+      ...P,
       children: /* @__PURE__ */ t(
         B,
         {
@@ -59,7 +61,7 @@ const G = (a) => {
           editable: e,
           onChange: V,
           minLength: g,
-          maxLength: u,
+          maxLength: p,
           disabled: F,
           autoComplete: L,
           type: y,
@@ -76,5 +78,5 @@ const G = (a) => {
   );
 };
 export {
-  G as EFWInputField
+  H as EFWInputField
 };

package/dist/react-components/fields/NumberInput/EFWNumberInputField.js

@@ -1,21 +1,21 @@
 import { jsx as a } from "react/jsx-runtime";
-import { EFWField as A } from "../_shared/EFWField/EFWField.js";
-import { EFWNumberInput as B } from "./EFWNumberInput.js";
+import { EFWField as B } from "../_shared/EFWField/EFWField.js";
+import { EFWNumberInput as P } from "./EFWNumberInput.js";
 import { mergeClasses as T } from "@griffel/react";
 const H = (t) => {
   const {
     title: n,
     infoLabel: o,
     hint: l,
-    className: i,
-    style: r = {},
+    className: r,
+    style: i = {},
     required: s = !1,
     contentBefore: m,
     contentAfter: d,
     minValue: u,
     maxValue: f,
-    validationState: c,
-    validationMessage: p,
+    validationState: p,
+    validationMessage: c,
     validationMessageIcon: b,
     value: g,
     defaultValue: h,
@@ -31,32 +31,34 @@ const H = (t) => {
     decimalSeparator: M,
     labels: S,
     validationMessages: W,
-    onValidationChange: w
-  } = t, y = (j, q) => {
-    v?.(j, q);
-  }, L = T(i, "efw-numberInput-field");
+    onValidationChange: w,
+    ...y
+  } = t, L = (q, A) => {
+    v?.(q, A);
+  }, j = T(r, "efw-numberInput-field");
   return /* @__PURE__ */ a(
-    A,
+    B,
     {
-      className: L,
-      style: r,
+      className: j,
+      style: i,
       title: n,
       infoLabel: o,
       weightLabel: e ? "regular" : "semibold",
       hint: l,
       required: s,
-      validationState: c,
-      validationMessage: p,
+      validationState: p,
+      validationMessage: c,
       validationMessageIcon: b,
       onValidationChange: w,
       hidden: F,
+      ...y,
       children: /* @__PURE__ */ a(
-        B,
+        P,
         {
           value: g,
           defaultValue: h,
           editable: e,
-          onChange: y,
+          onChange: L,
           disabled: C,
           autoComplete: N,
           contentBefore: m,

package/dist/react-components/fields/Switch/EFWSwitchField.js

@@ -1,16 +1,16 @@
 import { jsx as a } from "react/jsx-runtime";
-import { EFWField as N } from "../_shared/EFWField/EFWField.js";
-import { EFWSwitch as S } from "./EFWSwitch.js";
-import { mergeClasses as W } from "@griffel/react";
-const j = (l) => {
+import { EFWField as S } from "../_shared/EFWField/EFWField.js";
+import { EFWSwitch as W } from "./EFWSwitch.js";
+import { mergeClasses as x } from "@griffel/react";
+const q = (l) => {
   const {
     title: i,
-    infoLabel: t,
-    hint: s,
+    infoLabel: s,
+    hint: t,
     className: o,
     style: n = {},
-    required: d = !1,
-    validationState: r,
+    required: r = !1,
+    validationState: d,
     validationMessage: m,
     validationMessageIcon: f,
     value: h,
@@ -19,33 +19,35 @@ const j = (l) => {
     disabled: g = !1,
     hidden: u = !1,
     labels: b,
-    onChange: C,
-    onValidationChange: p
-  } = l, w = (v, E) => {
-    C?.(v, E);
-  }, F = W(o, "efw-switch-field");
+    onChange: p,
+    onValidationChange: C,
+    ...w
+  } = l, F = (E, N) => {
+    p?.(E, N);
+  }, v = x(o, "efw-switch-field");
   return /* @__PURE__ */ a(
-    N,
+    S,
     {
-      className: F,
+      className: v,
       style: n,
       title: i,
-      infoLabel: t,
+      infoLabel: s,
       weightLabel: e ? "regular" : "semibold",
-      hint: s,
-      required: d,
-      validationState: r,
+      hint: t,
+      required: r,
+      validationState: d,
       validationMessage: m,
       validationMessageIcon: f,
-      onValidationChange: p,
+      onValidationChange: C,
       hidden: u,
+      ...w,
       children: /* @__PURE__ */ a(
-        S,
+        W,
         {
           value: h,
           defaultValue: c,
           editable: e,
-          onChange: w,
+          onChange: F,
           disabled: g,
           labels: b
         }
@@ -54,5 +56,5 @@ const j = (l) => {
   );
 };
 export {
-  j as EFWSwitchField
+  q as EFWSwitchField
 };

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

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

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

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