@spscommerce/ds-react 5.33.7 → 5.33.10

package/lib/index.es.js

@@ -1419,6 +1419,17 @@ const SpsFormComponentWrapper = React.forwardRef((props2, ref2) => {
       onClick(event);
     }
   }
+  React.useEffect(() => {
+    function handleMouseDown(e2) {
+      if (e2.target.classList.contains("sps-form-control__clear-btn")) {
+        e2.preventDefault();
+      }
+    }
+    document.addEventListener("mousedown", handleMouseDown);
+    return () => {
+      document.removeEventListener("mousedown", handleMouseDown);
+    };
+  }, []);
   return /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({}, rest), {
     className: classes,
     ref: ref2,
@@ -2404,7 +2415,7 @@ const SpsOptionList = React.forwardRef((props2, ref2) => {
     ref: optionsRef,
     "data-testid": `${testId}-options`,
     style: optionsInlineStyles
-  }, !loading && !searchState.pending && zeroState && (searchState.value || !searchState.isAsync) && optionList.length === 0 && /* @__PURE__ */ React.createElement("div", {
+  }, !loading && !searchState.pending && zeroState && optionList.length === 0 && /* @__PURE__ */ React.createElement("div", {
     className: "sps-option-list__zero-state"
   }, zeroState), (loading || searchState.pending) && /* @__PURE__ */ React.createElement("div", {
     className: "sps-option-list__loading"
@@ -31100,7 +31111,7 @@ function SpsPageSelector(props2) {
   }, [pageProp]);
   function updatePage(newPage) {
     const constrainedPage = constrain(newPage, [1, numPages]);
-    if (constrainedPage !== inputPage) {
+    if (newPage !== page) {
       setPage(constrainedPage);
       setInputPage(constrainedPage);
       if (onPageChange && typeof onPageChange === "function") {
@@ -31108,10 +31119,8 @@ function SpsPageSelector(props2) {
       }
     }
   }
-  const debouncedPageUpdate = debounce(updatePage, 500);
   function onTextInputInput(event) {
-    setInputPage(event.target.value);
-    void debouncedPageUpdate(parseInt(event.target.value, 10));
+    setInputPage(Number(event.target.value) || "");
   }
   const classes = clsx(unsafelyReplaceClassName || "sps-page-selector", className);
   const id2 = useElementId(null);
@@ -31126,7 +31135,9 @@ function SpsPageSelector(props2) {
   }, inputPage), /* @__PURE__ */ React.createElement("label", {
     htmlFor: id2.current,
     className: "sr-only"
-  }, t2("design-system:pagination.page")), /* @__PURE__ */ React.createElement("input", {
+  }, t2("design-system:pagination.page")), /* @__PURE__ */ React.createElement(SpsForm, {
+    onSubmit: () => updatePage(Number(inputPage))
+  }, /* @__PURE__ */ React.createElement("input", {
     id: id2.current,
     type: "text",
     value: inputPage,
@@ -31134,8 +31145,9 @@ function SpsPageSelector(props2) {
     onChange: () => {
     },
     className: "sps-form-control sps-pagination__input",
-    disabled
-  })), /* @__PURE__ */ React.createElement("span", {
+    disabled,
+    onBlur: () => updatePage(Number(inputPage))
+  }))), /* @__PURE__ */ React.createElement("span", {
     className: "sps-page-selector__total-pages",
     "data-testid": `${testId}_page-count`
   }, Number.isNaN(numPages) ? t2("design-system:pagination.ofMany") : t2("design-system:pagination.ofPageCount", { pageCount: numPages })), /* @__PURE__ */ React.createElement("div", {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@spscommerce/ds-react",
   "description": "SPS Design System React components",
-  "version": "5.33.7",
+  "version": "5.33.10",
   "author": "SPS Commerce",
   "license": "UNLICENSED",
   "repository": "https://github.com/spscommerce/design-system/tree/main/packages/@spscommerce/ds-react",
@@ -28,11 +28,11 @@
   },
   "peerDependencies": {
     "@react-stately/collections": "^3.3.3",
-    "@spscommerce/ds-colors": "5.33.7",
-    "@spscommerce/ds-illustrations": "5.33.7",
-    "@spscommerce/ds-shared": "5.33.7",
-    "@spscommerce/positioning": "5.33.7",
-    "@spscommerce/utils": "5.33.7",
+    "@spscommerce/ds-colors": "5.33.10",
+    "@spscommerce/ds-illustrations": "5.33.10",
+    "@spscommerce/ds-shared": "5.33.10",
+    "@spscommerce/positioning": "5.33.10",
+    "@spscommerce/utils": "5.33.10",
     "moment": "^2.25.3",
     "moment-timezone": "^0.5.28",
     "react": "^16.9.0",
@@ -40,11 +40,11 @@
   },
   "devDependencies": {
     "@react-stately/collections": "^3.3.3",
-    "@spscommerce/ds-colors": "5.33.7",
-    "@spscommerce/ds-illustrations": "5.33.7",
-    "@spscommerce/ds-shared": "5.33.7",
-    "@spscommerce/positioning": "5.33.7",
-    "@spscommerce/utils": "5.33.7",
+    "@spscommerce/ds-colors": "5.33.10",
+    "@spscommerce/ds-illustrations": "5.33.10",
+    "@spscommerce/ds-shared": "5.33.10",
+    "@spscommerce/positioning": "5.33.10",
+    "@spscommerce/utils": "5.33.10",
     "@testing-library/react": "^9.3.2",
     "@types/prop-types": "^15.7.1",
     "@types/react": "^16.9.0",