@page-speed/forms 0.4.7 → 0.4.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/inputs.cjs CHANGED
@@ -642,6 +642,7 @@ function Select({
642
642
  const [isOpen, setIsOpen] = React9__namespace.useState(false);
643
643
  const [searchQuery, setSearchQuery] = React9__namespace.useState("");
644
644
  const [focusedIndex, setFocusedIndex] = React9__namespace.useState(-1);
645
+ const [hasInteracted, setHasInteracted] = React9__namespace.useState(false);
645
646
  const triggerRef = React9__namespace.useRef(null);
646
647
  const dropdownRef = React9__namespace.useRef(null);
647
648
  const searchInputRef = React9__namespace.useRef(null);
@@ -682,6 +683,9 @@ function Select({
682
683
  if (disabled) return;
683
684
  const newIsOpen = !isOpen;
684
685
  setIsOpen(newIsOpen);
686
+ if (newIsOpen && !hasInteracted) {
687
+ setHasInteracted(true);
688
+ }
685
689
  if (newIsOpen && searchable && searchInputRef.current) {
686
690
  setTimeout(() => searchInputRef.current?.focus(), 0);
687
691
  }
@@ -768,11 +772,14 @@ function Select({
768
772
  }
769
773
  };
770
774
  const closeDropdown = React9__namespace.useCallback(() => {
775
+ if (!isOpen) return;
771
776
  setIsOpen(false);
772
777
  setSearchQuery("");
773
778
  setFocusedIndex(-1);
774
- onBlur?.();
775
- }, [onBlur]);
779
+ if (hasInteracted) {
780
+ onBlur?.();
781
+ }
782
+ }, [isOpen, hasInteracted, onBlur]);
776
783
  useOnClickOutside.useOnClickOutside([triggerRef, dropdownRef], closeDropdown, void 0, {
777
784
  capture: true
778
785
  });
@@ -933,6 +940,7 @@ function MultiSelect({
933
940
  const [isOpen, setIsOpen] = React9__namespace.useState(false);
934
941
  const [searchQuery, setSearchQuery] = React9__namespace.useState("");
935
942
  const [focusedIndex, setFocusedIndex] = React9__namespace.useState(-1);
943
+ const [hasInteracted, setHasInteracted] = React9__namespace.useState(false);
936
944
  const triggerRef = React9__namespace.useRef(null);
937
945
  const dropdownRef = React9__namespace.useRef(null);
938
946
  const searchInputRef = React9__namespace.useRef(null);
@@ -991,6 +999,9 @@ function MultiSelect({
991
999
  if (disabled) return;
992
1000
  const newIsOpen = !isOpen;
993
1001
  setIsOpen(newIsOpen);
1002
+ if (newIsOpen && !hasInteracted) {
1003
+ setHasInteracted(true);
1004
+ }
994
1005
  if (newIsOpen && searchable && searchInputRef.current) {
995
1006
  setTimeout(() => searchInputRef.current?.focus(), 0);
996
1007
  }
@@ -1071,11 +1082,14 @@ function MultiSelect({
1071
1082
  }
1072
1083
  };
1073
1084
  const closeDropdown = React9__namespace.useCallback(() => {
1085
+ if (!isOpen) return;
1074
1086
  setIsOpen(false);
1075
1087
  setSearchQuery("");
1076
1088
  setFocusedIndex(-1);
1077
- onBlur?.();
1078
- }, [onBlur]);
1089
+ if (hasInteracted) {
1090
+ onBlur?.();
1091
+ }
1092
+ }, [isOpen, hasInteracted, onBlur]);
1079
1093
  useOnClickOutside.useOnClickOutside([triggerRef, dropdownRef], closeDropdown, void 0, {
1080
1094
  capture: true
1081
1095
  });
@@ -1849,6 +1863,7 @@ function DatePicker({
1849
1863
  ...props
1850
1864
  }) {
1851
1865
  const [isOpen, setIsOpen] = React9__namespace.useState(false);
1866
+ const [hasInteracted, setHasInteracted] = React9__namespace.useState(false);
1852
1867
  const [selectedMonth, setSelectedMonth] = React9__namespace.useState(
1853
1868
  value || /* @__PURE__ */ new Date()
1854
1869
  );
@@ -1871,7 +1886,13 @@ function DatePicker({
1871
1886
  };
1872
1887
  const handleToggle = () => {
1873
1888
  if (disabled) return;
1874
- setIsOpen((prev) => !prev);
1889
+ setIsOpen((prev) => {
1890
+ const newIsOpen = !prev;
1891
+ if (newIsOpen && !hasInteracted) {
1892
+ setHasInteracted(true);
1893
+ }
1894
+ return newIsOpen;
1895
+ });
1875
1896
  };
1876
1897
  const isDisabled = (date) => {
1877
1898
  if (minDate && date < minDate) return true;
@@ -1881,9 +1902,12 @@ function DatePicker({
1881
1902
  return false;
1882
1903
  };
1883
1904
  const closeCalendar = React9__namespace.useCallback(() => {
1905
+ if (!isOpen) return;
1884
1906
  setIsOpen(false);
1885
- onBlur?.();
1886
- }, [onBlur]);
1907
+ if (hasInteracted) {
1908
+ onBlur?.();
1909
+ }
1910
+ }, [isOpen, hasInteracted, onBlur]);
1887
1911
  useOnClickOutside.useOnClickOutside([inputRef, dropdownRef], closeCalendar, void 0, {
1888
1912
  capture: true
1889
1913
  });
@@ -2245,6 +2269,7 @@ function DateRangePicker({
2245
2269
  ...props
2246
2270
  }) {
2247
2271
  const [isOpen, setIsOpen] = React9__namespace.useState(false);
2272
+ const [hasInteracted, setHasInteracted] = React9__namespace.useState(false);
2248
2273
  const [selectedMonth, setSelectedMonth] = React9__namespace.useState(
2249
2274
  value.start || /* @__PURE__ */ new Date()
2250
2275
  );
@@ -2287,7 +2312,13 @@ function DateRangePicker({
2287
2312
  };
2288
2313
  const handleToggle = () => {
2289
2314
  if (disabled) return;
2290
- setIsOpen((prev) => !prev);
2315
+ setIsOpen((prev) => {
2316
+ const newIsOpen = !prev;
2317
+ if (newIsOpen && !hasInteracted) {
2318
+ setHasInteracted(true);
2319
+ }
2320
+ return newIsOpen;
2321
+ });
2291
2322
  };
2292
2323
  const isDisabled = (date) => {
2293
2324
  if (minDate && date < minDate) return true;
@@ -2297,9 +2328,12 @@ function DateRangePicker({
2297
2328
  return false;
2298
2329
  };
2299
2330
  const closeCalendar = React9__namespace.useCallback(() => {
2331
+ if (!isOpen) return;
2300
2332
  setIsOpen(false);
2301
- onBlur?.();
2302
- }, [onBlur]);
2333
+ if (hasInteracted) {
2334
+ onBlur?.();
2335
+ }
2336
+ }, [isOpen, hasInteracted, onBlur]);
2303
2337
  useOnClickOutside.useOnClickOutside([triggerRef, dropdownRef], closeCalendar, void 0, {
2304
2338
  capture: true
2305
2339
  });