@salt-ds/core 1.54.0 → 1.54.2

package/CHANGELOG.md

@@ -1,5 +1,27 @@
 # @salt-ds/core
 
+## 1.54.2
+
+### Patch Changes
+
+- ee94785: Fixed duplicate option registered by list when using virtualization. Fixes #5930.
+- Updated dependencies [f3a0eea]
+- Updated dependencies [fcc4021]
+  - @salt-ds/icons@1.17.0
+
+## 1.54.1
+
+### Patch Changes
+
+- f670363: Fixed support for React 16 and 17.
+- 9f9be9d: Fixed `Menu`, `Collapsible` and `Overlay` triggers not forwarding props.
+- 0d3fc12: Fixed `SaltProvider`'s incorrectly being marked as root when an empty theme name is passed in.
+- f670363: Fixed `ComboBox` scrolling to the top when trying to scroll to the bottom of its list with a value in the input.
+- Updated dependencies [0c664ed]
+- Updated dependencies [ee16c19]
+- Updated dependencies [ee16c19]
+  - @salt-ds/icons@1.16.0
+
 ## 1.54.0
 
 ### Minor Changes

package/css/salt-core.css

@@ -4102,12 +4102,12 @@ a:focus .saltCard-interactable.saltCard-disabled {
   box-sizing: border-box;
 }
 .saltTag-primary {
-  background: var(--tag-primary-background, var(--salt-category-1-subtle-background));
-  color: var(--tag-primary-foreground, var(--salt-category-1-subtle-foreground));
+  background: var(--tag-primary-background, var(--salt-category-1-background));
+  color: var(--tag-primary-foreground, var(--salt-category-1-foreground));
   border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) transparent;
 }
 .saltTag-bordered {
-  border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--tag-primary-borderColor, var(--salt-category-1-subtle-borderColor));
+  border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--tag-primary-borderColor, var(--salt-category-1-borderColor));
 }
 .saltTag-secondary {
   background: var(--tag-secondary-background, var(--salt-category-1-bold-background));
@@ -4115,123 +4115,123 @@ a:focus .saltCard-interactable.saltCard-disabled {
   border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) transparent;
 }
 .saltTag-category-1 {
-  --tag-primary-background: var(--salt-category-1-subtle-background);
-  --tag-primary-foreground: var(--salt-category-1-subtle-foreground);
-  --tag-primary-borderColor: var(--salt-category-1-subtle-borderColor);
+  --tag-primary-background: var(--salt-category-1-background);
+  --tag-primary-foreground: var(--salt-category-1-foreground);
+  --tag-primary-borderColor: var(--salt-category-1-borderColor);
   --tag-secondary-background: var(--salt-category-1-bold-background);
 }
 .saltTag-category-2 {
-  --tag-primary-background: var(--salt-category-2-subtle-background);
-  --tag-primary-foreground: var(--salt-category-2-subtle-foreground);
-  --tag-primary-borderColor: var(--salt-category-2-subtle-borderColor);
+  --tag-primary-background: var(--salt-category-2-background);
+  --tag-primary-foreground: var(--salt-category-2-foreground);
+  --tag-primary-borderColor: var(--salt-category-2-borderColor);
   --tag-secondary-background: var(--salt-category-2-bold-background);
 }
 .saltTag-category-3 {
-  --tag-primary-background: var(--salt-category-3-subtle-background);
-  --tag-primary-foreground: var(--salt-category-3-subtle-foreground);
-  --tag-primary-borderColor: var(--salt-category-3-subtle-borderColor);
+  --tag-primary-background: var(--salt-category-3-background);
+  --tag-primary-foreground: var(--salt-category-3-foreground);
+  --tag-primary-borderColor: var(--salt-category-3-borderColor);
   --tag-secondary-background: var(--salt-category-3-bold-background);
 }
 .saltTag-category-4 {
-  --tag-primary-background: var(--salt-category-4-subtle-background);
-  --tag-primary-foreground: var(--salt-category-4-subtle-foreground);
-  --tag-primary-borderColor: var(--salt-category-4-subtle-borderColor);
+  --tag-primary-background: var(--salt-category-4-background);
+  --tag-primary-foreground: var(--salt-category-4-foreground);
+  --tag-primary-borderColor: var(--salt-category-4-borderColor);
   --tag-secondary-background: var(--salt-category-4-bold-background);
 }
 .saltTag-category-5 {
-  --tag-primary-background: var(--salt-category-5-subtle-background);
-  --tag-primary-foreground: var(--salt-category-5-subtle-foreground);
-  --tag-primary-borderColor: var(--salt-category-5-subtle-borderColor);
+  --tag-primary-background: var(--salt-category-5-background);
+  --tag-primary-foreground: var(--salt-category-5-foreground);
+  --tag-primary-borderColor: var(--salt-category-5-borderColor);
   --tag-secondary-background: var(--salt-category-5-bold-background);
 }
 .saltTag-category-6 {
-  --tag-primary-background: var(--salt-category-6-subtle-background);
-  --tag-primary-foreground: var(--salt-category-6-subtle-foreground);
-  --tag-primary-borderColor: var(--salt-category-6-subtle-borderColor);
+  --tag-primary-background: var(--salt-category-6-background);
+  --tag-primary-foreground: var(--salt-category-6-foreground);
+  --tag-primary-borderColor: var(--salt-category-6-borderColor);
   --tag-secondary-background: var(--salt-category-6-bold-background);
 }
 .saltTag-category-7 {
-  --tag-primary-background: var(--salt-category-7-subtle-background);
-  --tag-primary-foreground: var(--salt-category-7-subtle-foreground);
-  --tag-primary-borderColor: var(--salt-category-7-subtle-borderColor);
+  --tag-primary-background: var(--salt-category-7-background);
+  --tag-primary-foreground: var(--salt-category-7-foreground);
+  --tag-primary-borderColor: var(--salt-category-7-borderColor);
   --tag-secondary-background: var(--salt-category-7-bold-background);
 }
 .saltTag-category-8 {
-  --tag-primary-background: var(--salt-category-8-subtle-background);
-  --tag-primary-foreground: var(--salt-category-8-subtle-foreground);
-  --tag-primary-borderColor: var(--salt-category-8-subtle-borderColor);
+  --tag-primary-background: var(--salt-category-8-background);
+  --tag-primary-foreground: var(--salt-category-8-foreground);
+  --tag-primary-borderColor: var(--salt-category-8-borderColor);
   --tag-secondary-background: var(--salt-category-8-bold-background);
 }
 .saltTag-category-9 {
-  --tag-primary-background: var(--salt-category-9-subtle-background);
-  --tag-primary-foreground: var(--salt-category-9-subtle-foreground);
-  --tag-primary-borderColor: var(--salt-category-9-subtle-borderColor);
+  --tag-primary-background: var(--salt-category-9-background);
+  --tag-primary-foreground: var(--salt-category-9-foreground);
+  --tag-primary-borderColor: var(--salt-category-9-borderColor);
   --tag-secondary-background: var(--salt-category-9-bold-background);
 }
 .saltTag-category-10 {
-  --tag-primary-background: var(--salt-category-10-subtle-background);
-  --tag-primary-foreground: var(--salt-category-10-subtle-foreground);
-  --tag-primary-borderColor: var(--salt-category-10-subtle-borderColor);
+  --tag-primary-background: var(--salt-category-10-background);
+  --tag-primary-foreground: var(--salt-category-10-foreground);
+  --tag-primary-borderColor: var(--salt-category-10-borderColor);
   --tag-secondary-background: var(--salt-category-10-bold-background);
 }
 .saltTag-category-11 {
-  --tag-primary-background: var(--salt-category-11-subtle-background);
-  --tag-primary-foreground: var(--salt-category-11-subtle-foreground);
-  --tag-primary-borderColor: var(--salt-category-11-subtle-borderColor);
+  --tag-primary-background: var(--salt-category-11-background);
+  --tag-primary-foreground: var(--salt-category-11-foreground);
+  --tag-primary-borderColor: var(--salt-category-11-borderColor);
   --tag-secondary-background: var(--salt-category-11-bold-background);
 }
 .saltTag-category-12 {
-  --tag-primary-background: var(--salt-category-12-subtle-background);
-  --tag-primary-foreground: var(--salt-category-12-subtle-foreground);
-  --tag-primary-borderColor: var(--salt-category-12-subtle-borderColor);
+  --tag-primary-background: var(--salt-category-12-background);
+  --tag-primary-foreground: var(--salt-category-12-foreground);
+  --tag-primary-borderColor: var(--salt-category-12-borderColor);
   --tag-secondary-background: var(--salt-category-12-bold-background);
 }
 .saltTag-category-13 {
-  --tag-primary-background: var(--salt-category-13-subtle-background);
-  --tag-primary-foreground: var(--salt-category-13-subtle-foreground);
-  --tag-primary-borderColor: var(--salt-category-13-subtle-borderColor);
+  --tag-primary-background: var(--salt-category-13-background);
+  --tag-primary-foreground: var(--salt-category-13-foreground);
+  --tag-primary-borderColor: var(--salt-category-13-borderColor);
   --tag-secondary-background: var(--salt-category-13-bold-background);
 }
 .saltTag-category-14 {
-  --tag-primary-background: var(--salt-category-14-subtle-background);
-  --tag-primary-foreground: var(--salt-category-14-subtle-foreground);
-  --tag-primary-borderColor: var(--salt-category-14-subtle-borderColor);
+  --tag-primary-background: var(--salt-category-14-background);
+  --tag-primary-foreground: var(--salt-category-14-foreground);
+  --tag-primary-borderColor: var(--salt-category-14-borderColor);
   --tag-secondary-background: var(--salt-category-14-bold-background);
 }
 .saltTag-category-15 {
-  --tag-primary-background: var(--salt-category-15-subtle-background);
-  --tag-primary-foreground: var(--salt-category-15-subtle-foreground);
-  --tag-primary-borderColor: var(--salt-category-15-subtle-borderColor);
+  --tag-primary-background: var(--salt-category-15-background);
+  --tag-primary-foreground: var(--salt-category-15-foreground);
+  --tag-primary-borderColor: var(--salt-category-15-borderColor);
   --tag-secondary-background: var(--salt-category-15-bold-background);
 }
 .saltTag-category-16 {
-  --tag-primary-background: var(--salt-category-16-subtle-background);
-  --tag-primary-foreground: var(--salt-category-16-subtle-foreground);
-  --tag-primary-borderColor: var(--salt-category-16-subtle-borderColor);
+  --tag-primary-background: var(--salt-category-16-background);
+  --tag-primary-foreground: var(--salt-category-16-foreground);
+  --tag-primary-borderColor: var(--salt-category-16-borderColor);
   --tag-secondary-background: var(--salt-category-16-bold-background);
 }
 .saltTag-category-17 {
-  --tag-primary-background: var(--salt-category-17-subtle-background);
-  --tag-primary-foreground: var(--salt-category-17-subtle-foreground);
-  --tag-primary-borderColor: var(--salt-category-17-subtle-borderColor);
+  --tag-primary-background: var(--salt-category-17-background);
+  --tag-primary-foreground: var(--salt-category-17-foreground);
+  --tag-primary-borderColor: var(--salt-category-17-borderColor);
   --tag-secondary-background: var(--salt-category-17-bold-background);
 }
 .saltTag-category-18 {
-  --tag-primary-background: var(--salt-category-18-subtle-background);
-  --tag-primary-foreground: var(--salt-category-18-subtle-foreground);
-  --tag-primary-borderColor: var(--salt-category-18-subtle-borderColor);
+  --tag-primary-background: var(--salt-category-18-background);
+  --tag-primary-foreground: var(--salt-category-18-foreground);
+  --tag-primary-borderColor: var(--salt-category-18-borderColor);
   --tag-secondary-background: var(--salt-category-18-bold-background);
 }
 .saltTag-category-19 {
-  --tag-primary-background: var(--salt-category-19-subtle-background);
-  --tag-primary-foreground: var(--salt-category-19-subtle-foreground);
-  --tag-primary-borderColor: var(--salt-category-19-subtle-borderColor);
+  --tag-primary-background: var(--salt-category-19-background);
+  --tag-primary-foreground: var(--salt-category-19-foreground);
+  --tag-primary-borderColor: var(--salt-category-19-borderColor);
   --tag-secondary-background: var(--salt-category-19-bold-background);
 }
 .saltTag-category-20 {
-  --tag-primary-background: var(--salt-category-20-subtle-background);
-  --tag-primary-foreground: var(--salt-category-20-subtle-foreground);
-  --tag-primary-borderColor: var(--salt-category-20-subtle-borderColor);
+  --tag-primary-background: var(--salt-category-20-background);
+  --tag-primary-foreground: var(--salt-category-20-foreground);
+  --tag-primary-borderColor: var(--salt-category-20-borderColor);
   --tag-secondary-background: var(--salt-category-20-bold-background);
 }
 
@@ -5556,4 +5556,4 @@ label.saltText small,
   color: var(--salt-status-error-foreground-informative);
 }
 
-/* src/5a699fff-d814-4b2c-a9d7-dab7b34e2781.css */
+/* src/1506bde8-03dd-48a7-8b24-ffcf6c1e8b46.css */

package/dist-cjs/collapsible/CollapsibleTrigger.js

@@ -13,7 +13,7 @@ var CollapsibleContext = require('./CollapsibleContext.js');
 
 const withBaseName = makePrefixer.makePrefixer("saltCollapsibleTrigger");
 const CollapsibleTrigger = React.forwardRef(function CollapsibleTrigger2(props, ref) {
-  const { children, className, onClick } = props;
+  const { children, className, onClick, ...rest } = props;
   const { open, setOpen, panelId } = CollapsibleContext.useCollapsibleContext();
   const handleClick = (event) => {
     setOpen(event, !open);
@@ -28,7 +28,8 @@ const CollapsibleTrigger = React.forwardRef(function CollapsibleTrigger2(props,
         className: clsx.clsx(withBaseName(), className),
         "aria-expanded": open,
         "aria-controls": panelId,
-        onClick: handleClick
+        onClick: handleClick,
+        ...rest
       },
       children.props
     ),

package/dist-cjs/collapsible/CollapsibleTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"CollapsibleTrigger.js","sources":["../src/collapsible/CollapsibleTrigger.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  type MouseEvent,\n  type ReactNode,\n  type Ref,\n} from \"react\";\nimport { makePrefixer, mergeProps } from \"../utils\";\nimport { useCollapsibleContext } from \"./CollapsibleContext\";\n\nexport interface CollapsibleTriggerProps\n  extends Pick<ComponentPropsWithoutRef<\"button\">, \"className\" | \"onClick\"> {\n  children: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltCollapsibleTrigger\");\n\nexport const CollapsibleTrigger = forwardRef<\n  HTMLButtonElement,\n  CollapsibleTriggerProps\n>(function CollapsibleTrigger(props, ref) {\n  const { children, className, onClick } = props;\n\n  const { open, setOpen, panelId } = useCollapsibleContext();\n\n  const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n    setOpen(event, !open);\n    onClick?.(event);\n  };\n\n  if (!children || !isValidElement<{ ref?: Ref<unknown> }>(children)) {\n    // Should we log or throw error?\n    return <>{children}</>;\n  }\n\n  return cloneElement(children, {\n    ...mergeProps(\n      {\n        className: clsx(withBaseName(), className),\n        \"aria-expanded\": open,\n        \"aria-controls\": panelId,\n        onClick: handleClick,\n      },\n      children.props,\n    ),\n    ref,\n  });\n});\n"],"names":["makePrefixer","forwardRef","CollapsibleTrigger","useCollapsibleContext","isValidElement","cloneElement","mergeProps","clsx"],"mappings":";;;;;;;;;;;;;AAkBA,MAAM,YAAA,GAAeA,0BAAa,wBAAwB,CAAA;AAEnD,MAAM,kBAAA,GAAqBC,gBAAA,CAGhC,SAASC,mBAAAA,CAAmB,OAAO,GAAA,EAAK;AACxC,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,OAAA,EAAQ,GAAI,KAAA;AAEzC,EAAA,MAAM,EAAE,IAAA,EAAM,OAAA,EAAS,OAAA,KAAYC,wCAAA,EAAsB;AAEzD,EAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAAyC;AAC5D,IAAA,OAAA,CAAQ,KAAA,EAAO,CAAC,IAAI,CAAA;AACpB,IAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAU,KAAA,CAAA;AAAA,EACZ,CAAA;AAEA,EAAA,IAAI,CAAC,QAAA,IAAY,CAACC,oBAAA,CAAuC,QAAQ,CAAA,EAAG;AAElE,IAAA,6DAAU,QAAA,EAAS,CAAA;AAAA,EACrB;AAEA,EAAA,OAAOC,mBAAa,QAAA,EAAU;AAAA,IAC5B,GAAGC,qBAAA;AAAA,MACD;AAAA,QACE,SAAA,EAAWC,SAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,QACzC,eAAA,EAAiB,IAAA;AAAA,QACjB,eAAA,EAAiB,OAAA;AAAA,QACjB,OAAA,EAAS;AAAA,OACX;AAAA,MACA,QAAA,CAAS;AAAA,KACX;AAAA,IACA;AAAA,GACD,CAAA;AACH,CAAC;;;;"}
+{"version":3,"file":"CollapsibleTrigger.js","sources":["../src/collapsible/CollapsibleTrigger.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  type MouseEvent,\n  type ReactNode,\n  type Ref,\n} from \"react\";\nimport { makePrefixer, mergeProps } from \"../utils\";\nimport { useCollapsibleContext } from \"./CollapsibleContext\";\n\nexport interface CollapsibleTriggerProps\n  extends Pick<ComponentPropsWithoutRef<\"button\">, \"className\" | \"onClick\"> {\n  children: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltCollapsibleTrigger\");\n\nexport const CollapsibleTrigger = forwardRef<\n  HTMLButtonElement,\n  CollapsibleTriggerProps\n>(function CollapsibleTrigger(props, ref) {\n  const { children, className, onClick, ...rest } = props;\n\n  const { open, setOpen, panelId } = useCollapsibleContext();\n\n  const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n    setOpen(event, !open);\n    onClick?.(event);\n  };\n\n  if (!children || !isValidElement<{ ref?: Ref<unknown> }>(children)) {\n    // Should we log or throw error?\n    return <>{children}</>;\n  }\n\n  return cloneElement(children, {\n    ...mergeProps(\n      {\n        className: clsx(withBaseName(), className),\n        \"aria-expanded\": open,\n        \"aria-controls\": panelId,\n        onClick: handleClick,\n        ...rest,\n      },\n      children.props,\n    ),\n    ref,\n  });\n});\n"],"names":["makePrefixer","forwardRef","CollapsibleTrigger","useCollapsibleContext","isValidElement","cloneElement","mergeProps","clsx"],"mappings":";;;;;;;;;;;;;AAkBA,MAAM,YAAA,GAAeA,0BAAa,wBAAwB,CAAA;AAEnD,MAAM,kBAAA,GAAqBC,gBAAA,CAGhC,SAASC,mBAAAA,CAAmB,OAAO,GAAA,EAAK;AACxC,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,OAAA,EAAS,GAAG,MAAK,GAAI,KAAA;AAElD,EAAA,MAAM,EAAE,IAAA,EAAM,OAAA,EAAS,OAAA,KAAYC,wCAAA,EAAsB;AAEzD,EAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAAyC;AAC5D,IAAA,OAAA,CAAQ,KAAA,EAAO,CAAC,IAAI,CAAA;AACpB,IAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAU,KAAA,CAAA;AAAA,EACZ,CAAA;AAEA,EAAA,IAAI,CAAC,QAAA,IAAY,CAACC,oBAAA,CAAuC,QAAQ,CAAA,EAAG;AAElE,IAAA,6DAAU,QAAA,EAAS,CAAA;AAAA,EACrB;AAEA,EAAA,OAAOC,mBAAa,QAAA,EAAU;AAAA,IAC5B,GAAGC,qBAAA;AAAA,MACD;AAAA,QACE,SAAA,EAAWC,SAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,QACzC,eAAA,EAAiB,IAAA;AAAA,QACjB,eAAA,EAAiB,OAAA;AAAA,QACjB,OAAA,EAAS,WAAA;AAAA,QACT,GAAG;AAAA,OACL;AAAA,MACA,QAAA,CAAS;AAAA,KACX;AAAA,IACA;AAAA,GACD,CAAA;AACH,CAAC;;;;"}

package/dist-cjs/list-control/ListControlState.js

@@ -40,13 +40,13 @@ function useListControl(props) {
   const [activeState, setActiveState] = React.useState(
     void 0
   );
-  const setActive = (option) => {
+  const setActive = React.useCallback((option) => {
     if (option) {
       setActiveState(option);
     } else {
       setActiveState(void 0);
     }
-  };
+  }, []);
   const [openState, setOpenState] = useControlled.useControlled({
     controlled: openProp,
     default: Boolean(defaultOpen),
@@ -98,6 +98,12 @@ function useListControl(props) {
   const register = React.useCallback(
     (optionValue, element) => {
       const { id } = optionValue;
+      const existingIndex = optionsRef.current.findIndex(
+        (item) => item.data.id === id
+      );
+      if (existingIndex !== -1) {
+        optionsRef.current.splice(existingIndex, 1);
+      }
       optionsRef.current.push({ data: optionValue, element });
       return () => {
         optionsRef.current = optionsRef.current.filter(
@@ -138,97 +144,118 @@ function useListControl(props) {
     sortOptions();
     return () => mutationObserver.disconnect();
   }, [listElement]);
-  const getOptionAtIndex = (index) => {
-    return optionsRef.current[index];
-  };
-  const getIndexOfOption = (option) => {
+  const getOptionAtIndex = React.useCallback(
+    (index) => {
+      return optionsRef.current[index];
+    },
+    []
+  );
+  const getIndexOfOption = React.useCallback((option) => {
     return optionsRef.current.findIndex(
       (item) => item.data.value === option.value
     );
-  };
-  const getOptionsMatching = (predicate) => {
-    return optionsRef.current.filter((item) => predicate(item.data));
-  };
-  const getOptionFromSearch = (search, startFrom) => {
-    const collator = new Intl.Collator("en", {
-      usage: "search",
-      sensitivity: "base"
-    });
-    const startIndex = startFrom ? getIndexOfOption(startFrom) + 1 : 0;
-    const searchList = optionsRef.current.map((item) => item.data);
-    let matches = searchList.filter(
-      (option) => collator.compare(
-        valueToString(option.value).substring(0, search.length),
-        search
-      ) === 0
-    );
-    if (matches.length === 0) {
-      const letters = search.split("");
-      const allSameLetter = letters.length > 0 && letters.every((letter) => collator.compare(letter, letters[0]) === 0);
-      if (allSameLetter) {
-        matches = searchList.filter(
-          (option) => collator.compare(
-            valueToString(option.value)[0].toLowerCase(),
-            letters[0]
-          ) === 0
-        );
+  }, []);
+  const getOptionsMatching = React.useCallback(
+    (predicate) => {
+      return optionsRef.current.filter((item) => predicate(item.data));
+    },
+    []
+  );
+  const getOptionFromSearch = React.useCallback(
+    (search, startFrom) => {
+      const collator = new Intl.Collator("en", {
+        usage: "search",
+        sensitivity: "base"
+      });
+      const startIndex = startFrom ? getIndexOfOption(startFrom) + 1 : 0;
+      const searchList = optionsRef.current.map((item) => item.data);
+      let matches = searchList.filter(
+        (option) => collator.compare(
+          valueToString(option.value).substring(0, search.length),
+          search
+        ) === 0
+      );
+      if (matches.length === 0) {
+        const letters = search.split("");
+        const allSameLetter = letters.length > 0 && letters.every((letter) => collator.compare(letter, letters[0]) === 0);
+        if (allSameLetter) {
+          matches = searchList.filter(
+            (option) => collator.compare(
+              valueToString(option.value)[0].toLowerCase(),
+              letters[0]
+            ) === 0
+          );
+        }
       }
-    }
-    return matches.find((option) => getIndexOfOption(option) >= startIndex);
-  };
-  const getFirstOption = () => {
+      return matches.find((option) => getIndexOfOption(option) >= startIndex);
+    },
+    [getIndexOfOption, valueToString]
+  );
+  const getFirstOption = React.useCallback(() => {
     return getOptionAtIndex(0);
-  };
-  const getLastOption = () => {
+  }, [getOptionAtIndex]);
+  const getLastOption = React.useCallback(() => {
     return getOptionAtIndex(optionsRef.current.length - 1);
-  };
-  const getOptionBefore = (option) => {
-    const index = getIndexOfOption(option);
-    return getOptionAtIndex(index - 1);
-  };
-  const getOptionAfter = (option) => {
-    const index = getIndexOfOption(option);
-    return getOptionAtIndex(index + 1);
-  };
-  const getOptionPageAbove = (start) => {
-    var _a;
-    const list = listRef.current;
-    let option = optionsRef.current.find((option2) => option2.data === start);
-    if (!list || !option) {
-      return void 0;
-    }
-    const containerRect = list.getBoundingClientRect();
-    let optionRect = option.element.getBoundingClientRect();
-    const listY = containerRect.y - list.scrollTop;
-    const pageY = Math.max(
-      0,
-      optionRect.y - listY + optionRect.height - containerRect.height
-    );
-    while (option && optionRect && optionRect.y - listY > pageY) {
-      option = getOptionBefore(option.data);
-      optionRect = (_a = option == null ? void 0 : option.element) == null ? void 0 : _a.getBoundingClientRect();
-    }
-    return option ?? getFirstOption();
-  };
-  const getOptionPageBelow = (start) => {
-    const list = listRef.current;
-    let option = optionsRef.current.find((option2) => option2.data === start);
-    if (!list || !option) {
-      return void 0;
-    }
-    const containerRect = list.getBoundingClientRect();
-    let optionRect = option.element.getBoundingClientRect();
-    const listY = containerRect.y - list.scrollTop;
-    const pageY = Math.min(
-      list.scrollHeight,
-      optionRect.y - listY - optionRect.height + containerRect.height
-    );
-    while (option && optionRect && optionRect.y - listY < pageY) {
-      option = getOptionAfter(option.data);
-      optionRect = option == null ? void 0 : option.element.getBoundingClientRect();
-    }
-    return option ?? getLastOption();
-  };
+  }, [getOptionAtIndex]);
+  const getOptionBefore = React.useCallback(
+    (option) => {
+      const index = getIndexOfOption(option);
+      return getOptionAtIndex(index - 1);
+    },
+    [getIndexOfOption, getOptionAtIndex]
+  );
+  const getOptionAfter = React.useCallback(
+    (option) => {
+      const index = getIndexOfOption(option);
+      return getOptionAtIndex(index + 1);
+    },
+    [getIndexOfOption, getOptionAtIndex]
+  );
+  const getOptionPageAbove = React.useCallback(
+    (start) => {
+      var _a;
+      const list = listRef.current;
+      let option = optionsRef.current.find((option2) => option2.data === start);
+      if (!list || !option) {
+        return void 0;
+      }
+      const containerRect = list.getBoundingClientRect();
+      let optionRect = option.element.getBoundingClientRect();
+      const listY = containerRect.y - list.scrollTop;
+      const pageY = Math.max(
+        0,
+        optionRect.y - listY + optionRect.height - containerRect.height
+      );
+      while (option && optionRect && optionRect.y - listY > pageY) {
+        option = getOptionBefore(option.data);
+        optionRect = (_a = option == null ? void 0 : option.element) == null ? void 0 : _a.getBoundingClientRect();
+      }
+      return option ?? getFirstOption();
+    },
+    [getFirstOption, getOptionBefore]
+  );
+  const getOptionPageBelow = React.useCallback(
+    (start) => {
+      const list = listRef.current;
+      let option = optionsRef.current.find((option2) => option2.data === start);
+      if (!list || !option) {
+        return void 0;
+      }
+      const containerRect = list.getBoundingClientRect();
+      let optionRect = option.element.getBoundingClientRect();
+      const listY = containerRect.y - list.scrollTop;
+      const pageY = Math.min(
+        list.scrollHeight,
+        optionRect.y - listY - optionRect.height + containerRect.height
+      );
+      while (option && optionRect && optionRect.y - listY < pageY) {
+        option = getOptionAfter(option.data);
+        optionRect = option == null ? void 0 : option.element.getBoundingClientRect();
+      }
+      return option ?? getLastOption();
+    },
+    [getLastOption, getOptionAfter]
+  );
   React.useEffect(() => {
     var _a;
     if (listRef.current) {

package/dist-cjs/list-control/ListControlState.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListControlState.js","sources":["../src/list-control/ListControlState.ts"],"sourcesContent":["import {\n  type SyntheticEvent,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { useControlled, useForkRef } from \"../utils\";\nimport type { OptionValue } from \"./ListControlContext\";\n\nexport type OpenChangeReason = \"input\" | \"manual\";\n\nexport type ListControlProps<Item> = {\n  /**\n   * If true, the control will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * If true, the control will be read-only.\n   */\n  readOnly?: boolean;\n  /**\n   * If true, the list will be open by default.\n   */\n  defaultOpen?: boolean;\n  /**\n   * If true, the list will be open. Useful for controlling the component.\n   */\n  open?: boolean;\n  /**\n   * Callback fired when the open state changes.\n   */\n  onOpenChange?: (newOpen: boolean, reason?: OpenChangeReason) => void;\n  /**\n   * The default selected options. If this is provided `defaultValue` should be provided as well.\n   */\n  defaultSelected?: Item[];\n  /**\n   * The selected options. The component will be controlled if this prop is provided.\n   */\n  selected?: Item[];\n  /**\n   * Callback fired when the selected options change.\n   */\n  onSelectionChange?: (event: SyntheticEvent, newSelected: Item[]) => void;\n  /**\n   * If true, multiple options can be selected.\n   */\n  multiselect?: boolean;\n  /**\n   * Callback used to convert an option's `value` to a string. This is needed when the value is different to the display value or the value is not a string.\n   */\n  valueToString?: (item: Item) => string;\n};\n\nexport function defaultValueToString<Item>(item: Item): string {\n  return String(item);\n}\n\nexport function useListControl<Item>(props: ListControlProps<Item>) {\n  const {\n    open: openProp,\n    defaultOpen,\n    onOpenChange,\n    multiselect,\n    defaultSelected,\n    selected: selectedProp,\n    onSelectionChange,\n    disabled,\n    readOnly,\n    valueToString = defaultValueToString,\n  } = props;\n\n  const listRef = useRef<HTMLDivElement>(null);\n  const [listElement, setListElement] = useState<HTMLDivElement | null>(null);\n  const setListRef = useForkRef<HTMLDivElement>(listRef, setListElement);\n\n  const [focusedState, setFocusedState] = useState(false);\n  const [focusVisibleState, setFocusVisibleState] = useState(false);\n\n  useEffect(() => {\n    // remove focus when controlling disabled\n    if (disabled && focusedState) {\n      setFocusedState(false);\n      setFocusVisibleState(false);\n    }\n  }, [disabled, focusedState]);\n\n  const [activeState, setActiveState] = useState<OptionValue<Item> | undefined>(\n    undefined,\n  );\n\n  const setActive = (option?: OptionValue<Item>) => {\n    if (option) {\n      setActiveState(option);\n    } else {\n      setActiveState(undefined);\n    }\n  };\n\n  const [openState, setOpenState] = useControlled({\n    controlled: openProp,\n    default: Boolean(defaultOpen),\n    name: \"ListControl\",\n    state: \"open\",\n  });\n\n  const openKey = useRef<string | undefined>(undefined);\n\n  const setOpen = (\n    newOpen: boolean,\n    reason?: OpenChangeReason,\n    key?: string,\n  ) => {\n    if (disabled || readOnly) {\n      return;\n    }\n\n    setOpenState(newOpen);\n    openKey.current = key;\n\n    if (newOpen !== openState) {\n      onOpenChange?.(newOpen, reason);\n    }\n  };\n\n  const [selectedState, setSelectedState] = useControlled({\n    controlled: selectedProp,\n    default: defaultSelected ?? [],\n    name: \"ListControl\",\n    state: \"selected\",\n  });\n\n  const select = (event: SyntheticEvent, option: OptionValue<Item>) => {\n    if (option.disabled || readOnly || disabled) {\n      return;\n    }\n\n    let newSelected = [option.value];\n\n    if (multiselect) {\n      if (selectedState.includes(option.value)) {\n        newSelected = selectedState.filter((item) => item !== option.value);\n      } else {\n        newSelected = selectedState.concat([option.value]);\n      }\n    }\n\n    setSelectedState(newSelected);\n    onSelectionChange?.(event, newSelected);\n\n    if (!multiselect) {\n      setOpen(false);\n    }\n  };\n\n  const clear = (event: SyntheticEvent) => {\n    setSelectedState([]);\n    if (selectedState.length !== 0) {\n      onSelectionChange?.(event, []);\n    }\n  };\n\n  const optionsRef = useRef<\n    { data: OptionValue<Item>; element: HTMLElement }[]\n  >([]);\n\n  const register = useCallback(\n    (optionValue: OptionValue<Item>, element: HTMLElement) => {\n      const { id } = optionValue;\n\n      optionsRef.current.push({ data: optionValue, element });\n\n      return () => {\n        optionsRef.current = optionsRef.current.filter(\n          (item) => item.data.id !== id,\n        );\n      };\n    },\n    [],\n  );\n\n  useEffect(() => {\n    const sortOptions = () => {\n      optionsRef.current = optionsRef.current\n        .filter((a) => a.element.isConnected)\n        .sort(({ element: a }, { element: b }) => {\n          if (a === b) return 0;\n          const pos = a.compareDocumentPosition(b);\n          if (pos & Node.DOCUMENT_POSITION_FOLLOWING) return -1;\n          if (pos & Node.DOCUMENT_POSITION_PRECEDING) return 1;\n          // Disconnected / impl-specific — keep input order (stable) or add your own rule\n          return 0;\n        });\n    };\n\n    const mutationObserver = new MutationObserver((mutations) => {\n      const optionsChanged = mutations.some((mutation) =>\n        Array.from(mutation.addedNodes).some(\n          (node) =>\n            node instanceof HTMLElement && node.matches?.('[role=\"option\"]'),\n        ),\n      );\n\n      if (optionsChanged) {\n        sortOptions();\n      }\n    });\n\n    if (!listElement) return;\n    mutationObserver.observe(listElement, {\n      childList: true,\n      subtree: true,\n    });\n\n    sortOptions();\n\n    return () => mutationObserver.disconnect();\n  }, [listElement]);\n\n  const getOptionAtIndex = (\n    index: number,\n  ): { data: OptionValue<Item>; element: HTMLElement } | undefined => {\n    return optionsRef.current[index];\n  };\n\n  const getIndexOfOption = (option: OptionValue<Item>) => {\n    return optionsRef.current.findIndex(\n      (item) => item.data.value === option.value,\n    );\n  };\n\n  const getOptionsMatching = (\n    predicate: (option: OptionValue<Item>) => boolean,\n  ) => {\n    return optionsRef.current.filter((item) => predicate(item.data));\n  };\n\n  const getOptionFromSearch = (\n    search: string,\n    startFrom?: OptionValue<Item>,\n  ) => {\n    const collator = new Intl.Collator(\"en\", {\n      usage: \"search\",\n      sensitivity: \"base\",\n    });\n\n    const startIndex = startFrom ? getIndexOfOption(startFrom) + 1 : 0;\n    const searchList = optionsRef.current.map((item) => item.data);\n\n    let matches = searchList.filter(\n      (option) =>\n        collator.compare(\n          valueToString(option.value).substring(0, search.length),\n          search,\n        ) === 0,\n    );\n\n    if (matches.length === 0) {\n      const letters = search.split(\"\");\n      const allSameLetter =\n        letters.length > 0 &&\n        letters.every((letter) => collator.compare(letter, letters[0]) === 0);\n      if (allSameLetter) {\n        matches = searchList.filter(\n          (option) =>\n            collator.compare(\n              valueToString(option.value)[0].toLowerCase(),\n              letters[0],\n            ) === 0,\n        );\n      }\n    }\n\n    return matches.find((option) => getIndexOfOption(option) >= startIndex);\n  };\n\n  const getFirstOption = () => {\n    return getOptionAtIndex(0);\n  };\n\n  const getLastOption = () => {\n    return getOptionAtIndex(optionsRef.current.length - 1);\n  };\n\n  const getOptionBefore = (option: OptionValue<Item>) => {\n    const index = getIndexOfOption(option);\n    return getOptionAtIndex(index - 1);\n  };\n\n  const getOptionAfter = (option: OptionValue<Item>) => {\n    const index = getIndexOfOption(option);\n    return getOptionAtIndex(index + 1);\n  };\n\n  const getOptionPageAbove = (start: OptionValue<Item>) => {\n    const list = listRef.current;\n    let option = optionsRef.current.find((option) => option.data === start);\n\n    if (!list || !option) {\n      return undefined;\n    }\n\n    const containerRect = list.getBoundingClientRect();\n    let optionRect: DOMRect | undefined =\n      option.element.getBoundingClientRect();\n\n    const listY = containerRect.y - list.scrollTop;\n    const pageY = Math.max(\n      0,\n      optionRect.y - listY + optionRect.height - containerRect.height,\n    );\n\n    while (option && optionRect && optionRect.y - listY > pageY) {\n      option = getOptionBefore(option.data);\n      optionRect = option?.element?.getBoundingClientRect();\n    }\n\n    return option ?? getFirstOption();\n  };\n\n  const getOptionPageBelow = (start: OptionValue<Item>) => {\n    const list = listRef.current;\n    let option = optionsRef.current.find((option) => option.data === start);\n\n    if (!list || !option) {\n      return undefined;\n    }\n\n    const containerRect = list.getBoundingClientRect();\n    let optionRect: DOMRect | undefined =\n      option.element.getBoundingClientRect();\n\n    const listY = containerRect.y - list.scrollTop;\n    const pageY = Math.min(\n      list.scrollHeight,\n      optionRect.y - listY - optionRect.height + containerRect.height,\n    );\n\n    while (option && optionRect && optionRect.y - listY < pageY) {\n      option = getOptionAfter(option.data);\n      optionRect = option?.element.getBoundingClientRect();\n    }\n\n    return option ?? getLastOption();\n  };\n\n  useEffect(() => {\n    if (listRef.current) {\n      const activeElement = optionsRef.current.find(\n        (option) => option.data === activeState,\n      )?.element;\n\n      if (!activeElement) {\n        return;\n      }\n\n      activeElement.scrollIntoView({\n        block: \"nearest\",\n        inline: \"nearest\",\n      });\n    }\n  }, [activeState]);\n\n  return {\n    multiselect: Boolean(multiselect),\n    openState,\n    setOpen,\n    openKey,\n    activeState,\n    setActive,\n    selectedState,\n    setSelectedState,\n    select,\n    clear,\n    focusVisibleState,\n    setFocusVisibleState,\n    focusedState,\n    setFocusedState,\n    setListRef,\n    listRef,\n    options: optionsRef.current.map((option) => option.element),\n    register,\n    getOptionAtIndex,\n    getIndexOfOption,\n    getOptionsMatching,\n    getOptionFromSearch,\n    getOptionAfter,\n    getOptionBefore,\n    getOptionPageAbove,\n    getOptionPageBelow,\n    getFirstOption,\n    getLastOption,\n    valueToString,\n    disabled,\n  };\n}\n"],"names":["useRef","useState","useForkRef","useEffect","useControlled","useCallback","option"],"mappings":"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"}
+{"version":3,"file":"ListControlState.js","sources":["../src/list-control/ListControlState.ts"],"sourcesContent":["import {\n  type SyntheticEvent,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { useControlled, useForkRef } from \"../utils\";\nimport type { OptionValue } from \"./ListControlContext\";\n\nexport type OpenChangeReason = \"input\" | \"manual\";\n\nexport type ListControlProps<Item> = {\n  /**\n   * If true, the control will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * If true, the control will be read-only.\n   */\n  readOnly?: boolean;\n  /**\n   * If true, the list will be open by default.\n   */\n  defaultOpen?: boolean;\n  /**\n   * If true, the list will be open. Useful for controlling the component.\n   */\n  open?: boolean;\n  /**\n   * Callback fired when the open state changes.\n   */\n  onOpenChange?: (newOpen: boolean, reason?: OpenChangeReason) => void;\n  /**\n   * The default selected options. If this is provided `defaultValue` should be provided as well.\n   */\n  defaultSelected?: Item[];\n  /**\n   * The selected options. The component will be controlled if this prop is provided.\n   */\n  selected?: Item[];\n  /**\n   * Callback fired when the selected options change.\n   */\n  onSelectionChange?: (event: SyntheticEvent, newSelected: Item[]) => void;\n  /**\n   * If true, multiple options can be selected.\n   */\n  multiselect?: boolean;\n  /**\n   * Callback used to convert an option's `value` to a string. This is needed when the value is different to the display value or the value is not a string.\n   */\n  valueToString?: (item: Item) => string;\n};\n\nexport function defaultValueToString<Item>(item: Item): string {\n  return String(item);\n}\n\nexport function useListControl<Item>(props: ListControlProps<Item>) {\n  const {\n    open: openProp,\n    defaultOpen,\n    onOpenChange,\n    multiselect,\n    defaultSelected,\n    selected: selectedProp,\n    onSelectionChange,\n    disabled,\n    readOnly,\n    valueToString = defaultValueToString,\n  } = props;\n\n  const listRef = useRef<HTMLDivElement>(null);\n  const [listElement, setListElement] = useState<HTMLDivElement | null>(null);\n  const setListRef = useForkRef<HTMLDivElement>(listRef, setListElement);\n\n  const [focusedState, setFocusedState] = useState(false);\n  const [focusVisibleState, setFocusVisibleState] = useState(false);\n\n  useEffect(() => {\n    // remove focus when controlling disabled\n    if (disabled && focusedState) {\n      setFocusedState(false);\n      setFocusVisibleState(false);\n    }\n  }, [disabled, focusedState]);\n\n  const [activeState, setActiveState] = useState<OptionValue<Item> | undefined>(\n    undefined,\n  );\n\n  const setActive = useCallback((option?: OptionValue<Item>) => {\n    if (option) {\n      setActiveState(option);\n    } else {\n      setActiveState(undefined);\n    }\n  }, []);\n\n  const [openState, setOpenState] = useControlled({\n    controlled: openProp,\n    default: Boolean(defaultOpen),\n    name: \"ListControl\",\n    state: \"open\",\n  });\n\n  const openKey = useRef<string | undefined>(undefined);\n\n  const setOpen = (\n    newOpen: boolean,\n    reason?: OpenChangeReason,\n    key?: string,\n  ) => {\n    if (disabled || readOnly) {\n      return;\n    }\n\n    setOpenState(newOpen);\n    openKey.current = key;\n\n    if (newOpen !== openState) {\n      onOpenChange?.(newOpen, reason);\n    }\n  };\n\n  const [selectedState, setSelectedState] = useControlled({\n    controlled: selectedProp,\n    default: defaultSelected ?? [],\n    name: \"ListControl\",\n    state: \"selected\",\n  });\n\n  const select = (event: SyntheticEvent, option: OptionValue<Item>) => {\n    if (option.disabled || readOnly || disabled) {\n      return;\n    }\n\n    let newSelected = [option.value];\n\n    if (multiselect) {\n      if (selectedState.includes(option.value)) {\n        newSelected = selectedState.filter((item) => item !== option.value);\n      } else {\n        newSelected = selectedState.concat([option.value]);\n      }\n    }\n\n    setSelectedState(newSelected);\n    onSelectionChange?.(event, newSelected);\n\n    if (!multiselect) {\n      setOpen(false);\n    }\n  };\n\n  const clear = (event: SyntheticEvent) => {\n    setSelectedState([]);\n    if (selectedState.length !== 0) {\n      onSelectionChange?.(event, []);\n    }\n  };\n\n  const optionsRef = useRef<\n    { data: OptionValue<Item>; element: HTMLElement }[]\n  >([]);\n\n  const register = useCallback(\n    (optionValue: OptionValue<Item>, element: HTMLElement) => {\n      const { id } = optionValue;\n\n      // Remove any existing entry with the same id to prevent duplicates.\n      // This is needed for virtualization where components may re-register.\n      const existingIndex = optionsRef.current.findIndex(\n        (item) => item.data.id === id,\n      );\n      if (existingIndex !== -1) {\n        optionsRef.current.splice(existingIndex, 1);\n      }\n\n      optionsRef.current.push({ data: optionValue, element });\n\n      return () => {\n        optionsRef.current = optionsRef.current.filter(\n          (item) => item.data.id !== id,\n        );\n      };\n    },\n    [],\n  );\n\n  useEffect(() => {\n    const sortOptions = () => {\n      optionsRef.current = optionsRef.current\n        .filter((a) => a.element.isConnected)\n        .sort(({ element: a }, { element: b }) => {\n          if (a === b) return 0;\n          const pos = a.compareDocumentPosition(b);\n          if (pos & Node.DOCUMENT_POSITION_FOLLOWING) return -1;\n          if (pos & Node.DOCUMENT_POSITION_PRECEDING) return 1;\n          // Disconnected / impl-specific — keep input order (stable) or add your own rule\n          return 0;\n        });\n    };\n\n    const mutationObserver = new MutationObserver((mutations) => {\n      const optionsChanged = mutations.some((mutation) =>\n        Array.from(mutation.addedNodes).some(\n          (node) =>\n            node instanceof HTMLElement && node.matches?.('[role=\"option\"]'),\n        ),\n      );\n\n      if (optionsChanged) {\n        sortOptions();\n      }\n    });\n\n    if (!listElement) return;\n    mutationObserver.observe(listElement, {\n      childList: true,\n      subtree: true,\n    });\n\n    sortOptions();\n\n    return () => mutationObserver.disconnect();\n  }, [listElement]);\n\n  const getOptionAtIndex = useCallback(\n    (\n      index: number,\n    ): { data: OptionValue<Item>; element: HTMLElement } | undefined => {\n      return optionsRef.current[index];\n    },\n    [],\n  );\n\n  const getIndexOfOption = useCallback((option: OptionValue<Item>) => {\n    return optionsRef.current.findIndex(\n      (item) => item.data.value === option.value,\n    );\n  }, []);\n\n  const getOptionsMatching = useCallback(\n    (predicate: (option: OptionValue<Item>) => boolean) => {\n      return optionsRef.current.filter((item) => predicate(item.data));\n    },\n    [],\n  );\n\n  const getOptionFromSearch = useCallback(\n    (search: string, startFrom?: OptionValue<Item>) => {\n      const collator = new Intl.Collator(\"en\", {\n        usage: \"search\",\n        sensitivity: \"base\",\n      });\n\n      const startIndex = startFrom ? getIndexOfOption(startFrom) + 1 : 0;\n      const searchList = optionsRef.current.map((item) => item.data);\n\n      let matches = searchList.filter(\n        (option) =>\n          collator.compare(\n            valueToString(option.value).substring(0, search.length),\n            search,\n          ) === 0,\n      );\n\n      if (matches.length === 0) {\n        const letters = search.split(\"\");\n        const allSameLetter =\n          letters.length > 0 &&\n          letters.every((letter) => collator.compare(letter, letters[0]) === 0);\n        if (allSameLetter) {\n          matches = searchList.filter(\n            (option) =>\n              collator.compare(\n                valueToString(option.value)[0].toLowerCase(),\n                letters[0],\n              ) === 0,\n          );\n        }\n      }\n\n      return matches.find((option) => getIndexOfOption(option) >= startIndex);\n    },\n    [getIndexOfOption, valueToString],\n  );\n\n  const getFirstOption = useCallback(() => {\n    return getOptionAtIndex(0);\n  }, [getOptionAtIndex]);\n\n  const getLastOption = useCallback(() => {\n    return getOptionAtIndex(optionsRef.current.length - 1);\n  }, [getOptionAtIndex]);\n\n  const getOptionBefore = useCallback(\n    (option: OptionValue<Item>) => {\n      const index = getIndexOfOption(option);\n      return getOptionAtIndex(index - 1);\n    },\n    [getIndexOfOption, getOptionAtIndex],\n  );\n\n  const getOptionAfter = useCallback(\n    (option: OptionValue<Item>) => {\n      const index = getIndexOfOption(option);\n      return getOptionAtIndex(index + 1);\n    },\n    [getIndexOfOption, getOptionAtIndex],\n  );\n\n  const getOptionPageAbove = useCallback(\n    (start: OptionValue<Item>) => {\n      const list = listRef.current;\n      let option = optionsRef.current.find((option) => option.data === start);\n\n      if (!list || !option) {\n        return undefined;\n      }\n\n      const containerRect = list.getBoundingClientRect();\n      let optionRect: DOMRect | undefined =\n        option.element.getBoundingClientRect();\n\n      const listY = containerRect.y - list.scrollTop;\n      const pageY = Math.max(\n        0,\n        optionRect.y - listY + optionRect.height - containerRect.height,\n      );\n\n      while (option && optionRect && optionRect.y - listY > pageY) {\n        option = getOptionBefore(option.data);\n        optionRect = option?.element?.getBoundingClientRect();\n      }\n\n      return option ?? getFirstOption();\n    },\n    [getFirstOption, getOptionBefore],\n  );\n\n  const getOptionPageBelow = useCallback(\n    (start: OptionValue<Item>) => {\n      const list = listRef.current;\n      let option = optionsRef.current.find((option) => option.data === start);\n\n      if (!list || !option) {\n        return undefined;\n      }\n\n      const containerRect = list.getBoundingClientRect();\n      let optionRect: DOMRect | undefined =\n        option.element.getBoundingClientRect();\n\n      const listY = containerRect.y - list.scrollTop;\n      const pageY = Math.min(\n        list.scrollHeight,\n        optionRect.y - listY - optionRect.height + containerRect.height,\n      );\n\n      while (option && optionRect && optionRect.y - listY < pageY) {\n        option = getOptionAfter(option.data);\n        optionRect = option?.element.getBoundingClientRect();\n      }\n\n      return option ?? getLastOption();\n    },\n    [getLastOption, getOptionAfter],\n  );\n\n  useEffect(() => {\n    if (listRef.current) {\n      const activeElement = optionsRef.current.find(\n        (option) => option.data === activeState,\n      )?.element;\n\n      if (!activeElement) {\n        return;\n      }\n\n      activeElement.scrollIntoView({\n        block: \"nearest\",\n        inline: \"nearest\",\n      });\n    }\n  }, [activeState]);\n\n  return {\n    multiselect: Boolean(multiselect),\n    openState,\n    setOpen,\n    openKey,\n    activeState,\n    setActive,\n    selectedState,\n    setSelectedState,\n    select,\n    clear,\n    focusVisibleState,\n    setFocusVisibleState,\n    focusedState,\n    setFocusedState,\n    setListRef,\n    listRef,\n    options: optionsRef.current.map((option) => option.element),\n    register,\n    getOptionAtIndex,\n    getIndexOfOption,\n    getOptionsMatching,\n    getOptionFromSearch,\n    getOptionAfter,\n    getOptionBefore,\n    getOptionPageAbove,\n    getOptionPageBelow,\n    getFirstOption,\n    getLastOption,\n    valueToString,\n    disabled,\n  };\n}\n"],"names":["useRef","useState","useForkRef","useEffect","useCallback","useControlled","option"],"mappings":"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"}

package/dist-cjs/menu/MenuTrigger.js

@@ -15,7 +15,7 @@ var MenuTriggerContext = require('./MenuTriggerContext.js');
 
 const MenuTrigger = React.forwardRef(
   function MenuTrigger2(props, ref) {
-    const { children } = props;
+    const { children, ...rest } = props;
     const { getReferenceProps, refs, setFocusInside, focusInside, openState } = MenuContext.useMenuContext();
     const { setFocusInside: setFocusInsideParent } = MenuPanelContext.useMenuPanelContext();
     const handleFloatingRef = useForkRef.useForkRef(
@@ -36,7 +36,8 @@ const MenuTrigger = React.forwardRef(
               onFocus() {
                 setFocusInsideParent(true);
                 setFocusInside(false);
-              }
+              },
+              ...rest
             }),
             children.props
           ),