@spscommerce/ds-react 7.17.1 → 7.17.3

package/lib/index.es.js

@@ -2916,6 +2916,13 @@ const Cv = {
             
             return (
               <>
+              <SpsSplitButton
+                  className="mr-1 mb-1"
+                  kind={ButtonKind.KEY}
+                  label="Loading at startup"
+                  spinning={true}
+                  spinningTitle="Loading ..."
+                />
                 <SpsSplitButton
                   onClick={() => handleConfirmationRequest("General confirmation")}
                   className="mr-1 mb-1"
@@ -12544,7 +12551,7 @@ function Pu({
   function Q(W) {
     const q = u || [];
     let z;
-    !q[0] || q[1] || J.isBefore(W, q[0]) ? z = [W, null] : (z = [q[0], W], x(!0), k && k.current && k.current.focus()), N && $(N) === "Before" && q[0] === null && q[1] === null && (z = [null, W], x(!0), k && k.current && k.current.focus()), N && $(N) === "After" && (x(!0), k && k.current && k.current.focus()), R(z), L(J.toStringRange(z)), K(void 0), (N && $(N) === "Before" && z && z[0] !== null || N && $(N) !== "Before" && $(N) !== "After") && O(null);
+    !q[0] || q[1] || J.isBefore(W, q[0]) ? z = [W, null] : (z = [q[0], W], x(!0), k && k.current && k.current.focus()), N && H(N) === "Before" && q[0] === null && q[1] === null && (z = [null, W], x(!0), k && k.current && k.current.focus()), N && H(N) === "After" && (x(!0), k && k.current && k.current.focus()), R(z), L(J.toStringRange(z)), K(void 0), (N && H(N) === "Before" && z && z[0] !== null || N && H(N) !== "Before" && H(N) !== "After") && O(null);
   }
   function Z(W) {
     L(W.target.value);
@@ -12565,13 +12572,17 @@ function Pu({
     }
   }
   function H(W) {
+    var q;
+    return W && /^design-system:/.test(W.label) ? T(W.label) : (q = W == null ? void 0 : W.label) != null ? q : "";
+  }
+  function $(W) {
     if (m && (W == null ? void 0 : W.definition) !== f && m(typeof (W == null ? void 0 : W.definition) == "string" ? W == null ? void 0 : W.definition : ""), !W) {
       O(null), R(void 0);
       return;
     }
     O(W);
     const q = J.createRangeFromPreset(W);
-    if (W && $(W) === "Before")
+    if (W && H(W) === "Before")
       if (u && u[0] && u[1]) {
         let z = J.createRangeFrom("-");
         z && R(z);
@@ -12579,7 +12590,7 @@ function Pu({
         let z = J.createRangeFrom(`-${J.toString(u && u[0])}`);
         z && R(z);
       }
-    else if (W && $(W) === "After")
+    else if (W && H(W) === "After")
       if (u && u[0] && u[1]) {
         let z = J.createRangeFrom("-");
         z && R(z);
@@ -12597,15 +12608,12 @@ function Pu({
           J.createRangeFromPreset(z)
         )
       );
-      q ? H(q) : u[0] === null || u[1] === null || O(null);
+      q ? $(q) : u[0] === null || u[1] === null || O(null);
     }
   }, [u]), s.useEffect(() => {
-    const W = N ? $(N) : "";
-    !u && !["Before", "After"].includes(W) ? U() : Array.isArray(u) && !N ? (u.every((q) => J.isValid(q) || q === null) && L(J.toStringRange(u)), K(void 0)) : Array.isArray(u) && u[0] && u[1] && (W === "Before" || W === "After") && u.every((q) => J.isValid(q) || q === null) ? L(J.toStringRange(u)) : Array.isArray(u) && N && L("");
+    const W = ["Before", "After"].includes(H(N));
+    N && !W ? L("") : Array.isArray(u) && (L(J.toStringRange(u)), N || K(void 0));
   }, [u, N]);
-  function $(W) {
-    return W && /^design-system:/.test(W.label) ? T(W.label) : W.label;
-  }
   const X = V(
     ld,
     "sps-text-input",
@@ -12628,7 +12636,7 @@ function Pu({
     className: "sps-datepicker__selected-preset"
   }, /* @__PURE__ */ s.createElement("span", {
     className: "sps-tag sps-tag--info"
-  }, $(N))), /* @__PURE__ */ s.createElement("input", {
+  }, H(N))), /* @__PURE__ */ s.createElement("input", {
     type: "text",
     ref: k,
     className: "sps-text-input__input",
@@ -12662,32 +12670,32 @@ function Pu({
     className: "sps-custom-control__input",
     checked: !N,
     name: `sps-date-range-picker-${w}__range`,
-    onChange: () => H()
+    onChange: () => $()
   }), /* @__PURE__ */ s.createElement("label", {
     className: "sps-custom-control__label",
     htmlFor: `sps-date-range-picker-${w}__range-custom`
   }, T("design-system:datepicker.preset.custom"))), p.map((W, q) => /* @__PURE__ */ s.createElement("div", {
-    key: $(W),
+    key: H(W),
     className: "sps-custom-control sps-custom-radio sps-custom-control--no-error"
   }, /* @__PURE__ */ s.createElement("input", {
     type: "radio",
     "data-testid": `${g}_preset_option_${W.label}`,
     id: `sps-date-range-picker-${w}__range-${q}`,
     name: `sps-date-range-picker-${w}__range`,
-    onChange: () => H(W),
+    onChange: () => $(W),
     checked: N != null && N.definition ? N.definition === W.definition : !1,
     className: "sps-custom-control__input"
   }), /* @__PURE__ */ s.createElement("label", {
     className: "sps-custom-control__label",
     htmlFor: `sps-date-range-picker-${w}__range-${q}`
-  }, $(W)))))), /* @__PURE__ */ s.createElement(Ea, {
+  }, H(W)))))), /* @__PURE__ */ s.createElement(Ea, {
     "data-testid": `${g}_calendar`,
     selectedRange: Array.isArray(u) ? u : P,
     onNewSelection: Q,
     minDate: l,
     maxDate: o,
     showTwoMonths: h,
-    selectedPreset: N && $(N)
+    selectedPreset: N && H(N)
   })));
 }
 Object.assign(Pu, {
@@ -27698,23 +27706,25 @@ function um(e) {
     spinningTitle: u,
     unsafelyReplaceClassName: h,
     ...g
-  } = e, y = s.useRef(null), [T, w] = s.useState({ width: 0 }), [C, I] = s.useState(!1);
+  } = e, y = s.useRef(null), [T, w] = s.useState({ width: 0 }), [C, I] = s.useState(!1), [k, b] = s.useState(!1);
   s.useLayoutEffect(() => {
     y.current && w({
       width: y.current.offsetWidth
     });
-  }, []);
-  const k = () => {
+  }, []), s.useEffect(() => {
+    b(Boolean(m));
+  }, [m]);
+  const M = () => {
     I(!0);
-  }, b = () => {
+  }, L = () => {
     I(!1);
-  }, M = V(
+  }, N = V(
     h || "sps-split-button",
     `sps-split-button--${f}`,
     C && "sps-split-button--open",
     n
   );
-  return /* @__PURE__ */ s.createElement(s.Fragment, null, m ? /* @__PURE__ */ s.createElement(Ye, {
+  return /* @__PURE__ */ s.createElement(s.Fragment, null, k ? /* @__PURE__ */ s.createElement(Ye, {
     className: n,
     "data-testid": r,
     style: { width: T.width },
@@ -27725,7 +27735,7 @@ function um(e) {
     spinningTitle: u
   }, l) : /* @__PURE__ */ s.createElement("div", {
     ref: y,
-    className: M,
+    className: N,
     "data-testid": r,
     ...g
   }, /* @__PURE__ */ s.createElement(Ye, {
@@ -27737,8 +27747,8 @@ function um(e) {
     kind: f,
     options: c,
     disabled: a,
-    onOpen: k,
-    onClose: b
+    onOpen: M,
+    onClose: L
   })));
 }
 Object.assign(um, {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@spscommerce/ds-react",
   "description": "SPS Design System React components",
-  "version": "7.17.1",
+  "version": "7.17.3",
   "author": "SPS Commerce",
   "license": "UNLICENSED",
   "repository": "https://github.com/spscommerce/woodland/tree/main/packages/@spscommerce/ds-react",
@@ -46,11 +46,11 @@
     "moment-timezone": "^0.5.28",
     "react": "^16.9.0",
     "react-dom": "^16.9.0",
-    "@sps-woodland/illustrations": "7.17.1",
-    "@sps-woodland/tabs": "7.17.1",
-    "@spscommerce/ds-colors": "7.17.1",
-    "@spscommerce/ds-shared": "7.17.1",
-    "@spscommerce/positioning": "7.17.1"
+    "@sps-woodland/illustrations": "7.17.3",
+    "@sps-woodland/tabs": "7.17.3",
+    "@spscommerce/ds-colors": "7.17.3",
+    "@spscommerce/ds-shared": "7.17.3",
+    "@spscommerce/positioning": "7.17.3"
   },
   "devDependencies": {
     "@react-spectrum/provider": "^3.4.1",
@@ -72,12 +72,12 @@
     "raf-stub": "^2.0.2",
     "react": "^16.9.0",
     "react-dom": "^16.9.0",
-    "@sps-woodland/illustrations": "7.17.1",
-    "@sps-woodland/tabs": "7.17.1",
-    "@spscommerce/ds-colors": "7.17.1",
-    "@spscommerce/ds-shared": "7.17.1",
-    "@spscommerce/positioning": "7.17.1",
-    "test": "7.17.1"
+    "@sps-woodland/illustrations": "7.17.3",
+    "@sps-woodland/tabs": "7.17.3",
+    "@spscommerce/ds-colors": "7.17.3",
+    "@spscommerce/ds-shared": "7.17.3",
+    "@spscommerce/positioning": "7.17.3",
+    "test": "7.17.3"
   },
   "scripts": {
     "build": "pnpm run build:js && pnpm run build:types",