@box/metadata-filter 1.26.1 → 1.26.2

package/dist/esm/lib/components/metadata-filter-fields/components/metadata-date-field/metadata-date-field-advanced.js

@@ -3,179 +3,183 @@ import me from "clsx";
 import { useFormikContext as fe, getIn as ve, Field as b } from "formik";
 import { useState as L, useRef as X, useCallback as v, useEffect as pe, useMemo as q } from "react";
 import { useIntl as he } from "react-intl";
-import { R as n } from "../../../../../../chunks/types.js";
+import { R as s } from "../../../../../../chunks/types.js";
 import { DEFAULT_MAX_DATE as z } from "./constants.js";
 import { getRelativeFromToValues as J, convertToFormikValueRanged as K } from "./date-conversion-utils.js";
 import { s as p } from "../../../../../../chunks/metadata-date-field.module.js";
 import { E as A } from "../../../../../../chunks/types2.js";
 import { useDateValidation as ge } from "./use-date-validation.js";
 import { useIntegerValidation as Fe } from "./use-integer-validation.js";
-import { getDynamicMaxMinValue as Q } from "./utils.js";
+import { processRelativeDaysInput as De, getDynamicMaxMinValue as Q } from "./utils.js";
 import i from "../../../../messages.js";
-import { jsx as s, jsxs as W } from "react/jsx-runtime";
+import { jsx as n, jsxs as W } from "react/jsx-runtime";
 import { A as Me } from "../../../../../../chunks/index.js";
-const Ue = ({
+const _e = ({
   disableForm: h,
-  fieldNamePrefix: d,
-  label: N,
+  fieldNamePrefix: u,
+  label: I,
   locale: C,
-  portalElement: D,
+  portalElement: M,
   filterOptionsMap: Y,
   onAdvancedFilterOptionChange: g,
-  fieldAdvancedFilterOptions: I,
+  fieldAdvancedFilterOptions: N,
   hasAccordion: Z
 }) => {
-  const T = `${d}.value.advancedFilterOption`, u = `${d}.value.relativeDays`, r = `${d}.value.range.gt`, o = `${d}.value.range.lt`, {
+  const T = `${u}.value.advancedFilterOption`, m = `${u}.value.relativeDays`, o = `${u}.value.range.gt`, r = `${u}.value.range.lt`, {
     values: E,
     setFieldValue: a,
-    setFieldTouched: B
+    setFieldTouched: S
   } = fe(), {
-    validateDates: S,
+    validateDates: B,
     fromDatePickerValue: F,
-    toDatePickerValue: M,
+    toDatePickerValue: D,
     fromErrorType: x,
     toErrorType: P
-  } = ge(E, r, o, C, !0), {
+  } = ge(E, o, r, C, !0), {
     validatePositiveInteger: ee
-  } = Fe(), l = he(), [m, te] = L(I || ""), [U, V] = L(!1), c = ve(E, u), [_, O] = L(n.FROM), R = X(F), k = X(M), $ = {
+  } = Fe(), l = he(), [f, te] = L(N || ""), [U, V] = L(!1), d = ve(E, m), [_, R] = L(s.FROM), y = X(F), O = X(D), $ = {
     clearDatePickerAriaLabel: l.formatMessage(i.clearSelectedDate),
     nextMonthAriaLabel: l.formatMessage(i.switchToNextMonth),
     openCalendarDropdownAriaLabel: l.formatMessage(i.openCalendar),
     previousMonthAriaLabel: l.formatMessage(i.switchToNextMonth)
   }, w = v(() => {
-    if (m === "today") {
+    if (f === "today") {
       const {
         from: e,
         to: t
       } = J("today", void 0);
-      a(r, e), a(o, t);
-    } else if (c !== void 0) {
-      const e = typeof c == "string" ? Number(c) : c;
+      a(o, e), a(r, t);
+    } else if (d !== void 0) {
+      const e = typeof d == "string" ? Number(d) : d;
       if (!isNaN(e) && e > 0) {
-        const t = m;
+        const t = f;
         if (["next", "past", "olderThan"].includes(t)) {
           const {
-            from: f,
-            to: y
+            from: c,
+            to: k
           } = J(t, e);
-          a(r, f), a(o, y);
+          a(o, c), a(r, k);
         }
       }
     }
-  }, [m, c, r, o, a]);
+  }, [f, d, o, r, a]);
   pe(() => {
     U && (w(), V(!1));
   }, [U, w]);
   const ae = v((e) => {
     const t = e;
-    te(t), a(T, t), g && g(d, t);
-    const f = () => {
-      a(u, void 0), a(r, void 0), a(o, void 0);
-    }, y = () => {
-      a(r, void 0), a(o, void 0);
+    te(t), a(T, t), g && g(u, t);
+    const c = () => {
+      a(m, void 0), a(o, void 0), a(r, void 0);
+    }, k = () => {
+      a(o, void 0), a(r, void 0);
     };
-    ["isBlank", "isNotBlank", "selectFilterType"].includes(t) || !t || t === "customRange" ? f() : t === "today" ? (a(u, void 0), V(!0)) : y();
-  }, [d, g, a, T, u, r, o]), re = v((e) => {
-    a(u, e), Number(e) > 0 && V(!0);
-  }, [a, u]), oe = v((e) => {
-    const t = K(e, n.FROM);
-    R.current = e, a(r, t), O(n.FROM);
-  }, [a, r]), ne = v((e) => {
-    const t = K(e, n.TO);
-    k.current = e, a(o, t), O(n.TO);
-  }, [a, o]), j = v((e) => {
-    const t = e === n.FROM ? r : o;
-    B(t, !0), O(e);
-  }, [B, r, o]), se = q(() => Q(M, z), [M]), le = q(() => Q(F), [F]), G = (e, t, f) => !!(t === A.MAX && e === A.OVERLAPPING || e === A.OVERLAPPING && f), ie = ["isBlank", "isNotBlank", "selectFilterType", "today"], ce = () => !m || ie.includes(m) ? null : m === "customRange" ? /* @__PURE__ */ W("div", {
+    ["isBlank", "isNotBlank", "selectFilterType"].includes(t) || !t || t === "customRange" ? c() : t === "today" ? (a(m, void 0), V(!0)) : k();
+  }, [u, g, a, T, m, o, r]), oe = v((e) => {
+    const {
+      valueToStore: t,
+      shouldTriggerUpdate: c
+    } = De(e);
+    a(m, t), c && V(!0);
+  }, [a, m]), re = v((e) => {
+    const t = K(e, s.FROM);
+    y.current = e, a(o, t), R(s.FROM);
+  }, [a, o]), se = v((e) => {
+    const t = K(e, s.TO);
+    O.current = e, a(r, t), R(s.TO);
+  }, [a, r]), j = v((e) => {
+    const t = e === s.FROM ? o : r;
+    S(t, !0), R(e);
+  }, [S, o, r]), ne = q(() => Q(D, z), [D]), le = q(() => Q(F), [F]), G = (e, t, c) => !!(t === A.MAX && e === A.OVERLAPPING || e === A.OVERLAPPING && c), ie = ["isBlank", "isNotBlank", "selectFilterType", "today"], ce = () => !f || ie.includes(f) ? null : f === "customRange" ? /* @__PURE__ */ W("div", {
     className: me(p.rangeInputsContainer, p.verticalLayout),
-    children: [/* @__PURE__ */ s(b, {
-      name: r,
-      validate: (e) => S(R.current, k.current, n.FROM),
+    children: [/* @__PURE__ */ n(b, {
+      name: o,
+      validate: (e) => B(y.current, O.current, s.FROM),
       children: ({
         field: e,
         meta: t
-      }) => /* @__PURE__ */ s("div", {
+      }) => /* @__PURE__ */ n("div", {
         className: p.datePicker,
-        children: /* @__PURE__ */ s(H, {
+        children: /* @__PURE__ */ n(H, {
           ...e,
           ...$,
           calendarAriaLabel: l.formatMessage(i.selectStartDate),
-          error: !G(x, P, _ !== n.FROM) && t.error,
+          error: !G(x, P, _ !== s.FROM) && t.error,
           isDisabled: h,
           label: l.formatMessage(i.afterDate),
-          maxValue: se,
-          onBlur: () => j(n.FROM),
-          onChange: oe,
-          portalElement: D,
+          maxValue: ne,
+          onBlur: () => j(s.FROM),
+          onChange: re,
+          portalElement: M,
           value: F
         })
       })
-    }), /* @__PURE__ */ s(b, {
-      name: o,
-      validate: (e) => S(R.current, k.current, n.TO),
+    }), /* @__PURE__ */ n(b, {
+      name: r,
+      validate: (e) => B(y.current, O.current, s.TO),
       children: ({
         field: e,
         meta: t
-      }) => /* @__PURE__ */ s("div", {
+      }) => /* @__PURE__ */ n("div", {
         className: p.datePicker,
-        children: /* @__PURE__ */ s(H, {
+        children: /* @__PURE__ */ n(H, {
           ...e,
           ...$,
           calendarAriaLabel: l.formatMessage(i.selectEndDate),
-          error: !G(P, x, _ !== n.TO) && t.error,
+          error: !G(P, x, _ !== s.TO) && t.error,
           isDisabled: h,
           label: l.formatMessage(i.beforeDate),
           maxValue: z,
           minValue: le,
-          onBlur: () => j(n.TO),
-          onChange: ne,
-          portalElement: D,
-          value: M
+          onBlur: () => j(s.TO),
+          onChange: se,
+          portalElement: M,
+          value: D
         })
       })
     })]
-  }) : /* @__PURE__ */ s(b, {
-    name: u,
+  }) : /* @__PURE__ */ n(b, {
+    name: m,
     validate: (e) => ee((e == null ? void 0 : e.toString()) || ""),
     children: ({
       field: e,
       meta: t
-    }) => /* @__PURE__ */ s("div", {
+    }) => /* @__PURE__ */ n("div", {
       className: p.daysInputContainer,
-      children: /* @__PURE__ */ s(ue, {
+      children: /* @__PURE__ */ n(ue, {
         ...e,
         disabled: h,
         error: t.touched && t.error,
         hideLabel: !0,
         label: l.formatMessage(i.relativeDaysSelectLabel),
-        onChange: (f) => re(f.target.value),
+        onChange: (c) => oe(c.target.value),
         placeholder: l.formatMessage(i.numberOfDays),
-        value: (c == null ? void 0 : c.toString()) || ""
+        value: (d == null ? void 0 : d.toString()) || ""
       })
     })
   });
-  return /* @__PURE__ */ s(de, {
+  return /* @__PURE__ */ n(de, {
     locale: C,
     children: /* @__PURE__ */ W("div", {
       className: p.advancedDateContainer,
-      "data-testid": `${N}-advanced-field`,
-      children: [/* @__PURE__ */ s(Me, {
+      "data-testid": `${I}-advanced-field`,
+      children: [/* @__PURE__ */ n(Me, {
         advancedFilterFieldName: T,
         disableForm: h,
-        fieldAdvancedFilterOptions: I,
-        fieldNamePrefix: d,
+        fieldAdvancedFilterOptions: N,
+        fieldNamePrefix: u,
         filterOptionsMap: Y,
-        label: N,
+        label: I,
         onAdvancedFilterOptionChange: g,
         onValueChange: ae,
-        portalElement: D,
+        portalElement: M,
         showLabel: !Z,
-        value: m
+        value: f
       }), ce()]
     })
   });
 };
 export {
-  Ue as MetadataDateFieldAdvanced,
-  Ue as default
+  _e as MetadataDateFieldAdvanced,
+  _e as default
 };

package/dist/esm/lib/components/metadata-filter-fields/components/metadata-date-field/utils.js

@@ -1,5 +1,12 @@
 import { DEFAULT_MAX_DATE as i } from "./constants.js";
-const m = (r, o) => r ? r.compare(i) > 0 ? i : r : o;
+const s = (r, t) => r ? r.compare(i) > 0 ? i : r : t, n = (r) => {
+  const t = Number(r), e = !isNaN(t) && t > 0 && /^\d+$/.test(r.trim());
+  return {
+    valueToStore: e ? t : r,
+    shouldTriggerUpdate: e
+  };
+};
 export {
-  m as getDynamicMaxMinValue
+  s as getDynamicMaxMinValue,
+  n as processRelativeDaysInput
 };

package/dist/types/lib/components/metadata-filter-fields/components/metadata-date-field/utils.d.ts

@@ -1,2 +1,6 @@
 import { CalendarDateType } from './types';
 export declare const getDynamicMaxMinValue: (calendarDate: CalendarDateType, nullDefault?: CalendarDateType) => import('@internationalized/date').CalendarDate;
+export declare const processRelativeDaysInput: (value: string) => {
+    valueToStore: string | number;
+    shouldTriggerUpdate: boolean;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@box/metadata-filter",
-    "version": "1.26.1",
+    "version": "1.26.2",
     "peerDependencies": {
         "@box/blueprint-web": "^7.8.0",
         "@box/blueprint-web-assets": "^4.16.0",
@@ -11,7 +11,7 @@
         "react-intl": "6.4.2"
     },
     "devDependencies": {
-        "@box/blueprint-web": "^12.64.3",
+        "@box/blueprint-web": "^12.64.4",
         "@box/blueprint-web-assets": "^4.65.0",
         "@box/storybook-utils": "^0.14.1",
         "react": "^18.3.0",