@navikt/ds-react 8.7.0 → 8.8.0

package/src/utils/components/Listbox/{item/ListboxItem.tsx → option/ListboxOption.tsx}

@@ -1,32 +1,32 @@
 import React from "react";
 import { cl } from "../../../helpers";
 
-export interface ListboxItemProps extends Omit<
+export interface ListboxOptionProps extends Omit<
   React.HTMLAttributes<HTMLDivElement>,
   "role" | "tabIndex"
 > {
   /**
-   * Unique ID used for tracking which item has virtual focus.
+   * Unique ID used for tracking which option has virtual focus.
    */
   id: string;
   hasVirtualFocus: boolean;
   children: React.ReactNode;
   /**
-   * Callback when item is selected.
-   * To improve performance when you have many items,
+   * Callback when option is selected.
+   * To improve performance when you have many options,
    * memoize the prop with e.g. useEventCallback.
    */
   onClick: React.MouseEventHandler<HTMLDivElement>;
 }
 
-function ListboxItemComponent({
+function ListboxOptionComponent({
   id,
   hasVirtualFocus,
   children,
   className,
   ...rest
-}: ListboxItemProps) {
-  //console.log("Rendering item", id);
+}: ListboxOptionProps) {
+  //console.log("Rendering option", id);
 
   // TODO: Slot?
 
@@ -34,12 +34,12 @@ function ListboxItemComponent({
     <div
       aria-selected={false}
       {...rest}
-      className={cl("aksel-listbox__item", className)}
+      className={cl("aksel-listbox__option", className)}
       role="option"
       tabIndex={-1}
       data-virtual-focus={hasVirtualFocus}
       data-id={id}
-      id={hasVirtualFocus ? "aksel-listbox__item-active" : undefined}
+      id={hasVirtualFocus ? "aksel-listbox__option-active" : undefined}
     >
       {children}
     </div>
@@ -47,11 +47,11 @@ function ListboxItemComponent({
 }
 
 /**
- * This component is memoized. To improve performance when you have many items,
+ * This component is memoized. To improve performance when you have many options,
  * make sure all object props have stable references (i.e. memoize the event handlers with e.g. useEventCallback).
  *
- * NB: Remember to set `aria-selected` on selected items!
+ * NB: Remember to set `aria-selected` on selected options!
  */
-export const ListboxItem = React.memo(
-  ListboxItemComponent,
-) as typeof ListboxItemComponent;
+export const ListboxOption = React.memo(
+  ListboxOptionComponent,
+) as typeof ListboxOptionComponent;

package/src/utils/components/Listbox/{list/ListboxList.tsx → options/ListboxOptions.tsx}

@@ -3,30 +3,30 @@
 import React from "react";
 import { cl } from "../../../helpers";
 
-export interface ListboxListProps extends Omit<
+export interface ListboxOptionsProps extends Omit<
   React.HTMLAttributes<HTMLDivElement>,
   "role" | "tabIndex" | "onMouseOver"
 > {
   children: React.ReactNode;
-  setVirtuallyFocusedItemId: (value: string) => void;
+  setVirtuallyFocusedOptionId: (value: string) => void;
 }
 
-function ListboxList({
+function ListboxOptions({
   children,
-  setVirtuallyFocusedItemId,
+  setVirtuallyFocusedOptionId,
   ...rest
-}: ListboxListProps) {
+}: ListboxOptionsProps) {
   return (
     <div
       {...rest}
-      className={cl(rest.className, "aksel-listbox__list")}
+      className={cl(rest.className, "aksel-listbox__options")}
       role="listbox"
       tabIndex={-1}
       onMouseOver={(event) => {
         const target = event.target as HTMLElement;
-        const itemEl: HTMLElement | null = target.closest('[role="option"]');
-        if (itemEl) {
-          setVirtuallyFocusedItemId(itemEl?.dataset.id || "");
+        const optionEl: HTMLElement | null = target.closest('[role="option"]');
+        if (optionEl) {
+          setVirtuallyFocusedOptionId(optionEl?.dataset.id || "");
         }
       }}
     >
@@ -35,4 +35,4 @@ function ListboxList({
   );
 }
 
-export { ListboxList };
+export { ListboxOptions };

package/src/utils/components/Listbox/root/ListboxRoot.tsx

@@ -3,22 +3,22 @@
 import React from "react";
 import { ListboxGroup } from "../group/ListboxGroup";
 import { ListboxInputSlot } from "../input-slot/ListboxInputSlot";
-import { ListboxItem } from "../item/ListboxItem";
-import { ListboxList } from "../list/ListboxList";
-import { findNextItem, findPrevItem } from "./domHelpers";
+import { ListboxOption } from "../option/ListboxOption";
+import { ListboxOptions } from "../options/ListboxOptions";
+import { findNextOption, findPrevOption } from "./domHelpers";
 
 export interface ListboxProps {
   children: React.ReactNode;
-  setVirtuallyFocusedItemId: (value: string) => void;
+  setVirtuallyFocusedOptionId: (value: string) => void;
 }
 
 /**
- * Low level component for displaying a list of selectable items with optional grouping.
+ * Low level component for displaying a list of selectable options with optional grouping.
  * Keyboard navigation is implemented with virtual focus so that real focus can remain on an input field.
  */
-function Listbox({ children, setVirtuallyFocusedItemId }: ListboxProps) {
-  const virtuallyFocusItem = (element: HTMLElement | null) => {
-    setVirtuallyFocusedItemId(element?.dataset.id || "");
+function Listbox({ children, setVirtuallyFocusedOptionId }: ListboxProps) {
+  const virtuallyFocusOption = (element: HTMLElement | null) => {
+    setVirtuallyFocusedOptionId(element?.dataset.id || "");
     element?.scrollIntoView({ block: "nearest" });
   };
 
@@ -32,59 +32,59 @@ function Listbox({ children, setVirtuallyFocusedItemId }: ListboxProps) {
         }
 
         // Helper functions
-        const getFirstItem = (suffix: string = "") =>
+        const getFirstOption = (suffix: string = "") =>
           listbox.querySelector<HTMLElement>(`[role="option"]${suffix}`);
-        const getLastItem = () => {
-          const allItems =
+        const getLastOption = () => {
+          const allOptions =
             listbox.querySelectorAll<HTMLElement>('[role="option"]');
-          return allItems[allItems.length - 1];
+          return allOptions[allOptions.length - 1];
         };
 
-        const focusedItemElm = getFirstItem('[data-virtual-focus="true"]');
+        const focusedOptionElm = getFirstOption('[data-virtual-focus="true"]');
 
-        // Doesn't make sense to have real focus on one item and virtual focus on another at the same time.
+        // Doesn't make sense to have real focus on one option and virtual focus on another at the same time.
         // Not sure if it matters, though 🤔
-        const itemElmWithRealFocus = getFirstItem(":focus");
-        if (itemElmWithRealFocus) {
+        const optionElmWithRealFocus = getFirstOption(":focus");
+        if (optionElmWithRealFocus) {
           listbox.focus();
         }
 
         const virtuallyFocusWithFallback = (
-          getNextElement: (currentItem: HTMLElement) => HTMLElement | null,
+          getNextElement: (currentOption: HTMLElement) => HTMLElement | null,
           getFallback: () => HTMLElement | null,
         ) => {
           event.preventDefault();
-          if (!focusedItemElm) {
-            virtuallyFocusItem(getFallback());
+          if (!focusedOptionElm) {
+            virtuallyFocusOption(getFallback());
             return;
           }
-          const nextItem = getNextElement(focusedItemElm);
-          if (!nextItem) {
-            virtuallyFocusItem(getFallback());
+          const nextOption = getNextElement(focusedOptionElm);
+          if (!nextOption) {
+            virtuallyFocusOption(getFallback());
             return;
           }
-          virtuallyFocusItem(nextItem);
+          virtuallyFocusOption(nextOption);
         };
 
         switch (event.key) {
           case "ArrowDown":
-            virtuallyFocusWithFallback(findNextItem, getFirstItem);
+            virtuallyFocusWithFallback(findNextOption, getFirstOption);
             break;
           case "ArrowUp":
-            virtuallyFocusWithFallback(findPrevItem, getLastItem);
+            virtuallyFocusWithFallback(findPrevOption, getLastOption);
             break;
           case "Home":
             event.preventDefault();
-            virtuallyFocusItem(getFirstItem());
+            virtuallyFocusOption(getFirstOption());
             break;
           case "End":
             event.preventDefault();
-            virtuallyFocusItem(getLastItem());
+            virtuallyFocusOption(getLastOption());
             break;
           case "Enter":
           case "Accept":
-            if (focusedItemElm) {
-              focusedItemElm.click();
+            if (focusedOptionElm) {
+              focusedOptionElm.click();
             }
             break;
           // TODO: Consider implementing PageUp/PageDown too
@@ -97,8 +97,8 @@ function Listbox({ children, setVirtuallyFocusedItemId }: ListboxProps) {
 }
 
 Listbox.InputSlot = ListboxInputSlot;
-Listbox.List = ListboxList;
-Listbox.Item = ListboxItem;
+Listbox.Options = ListboxOptions;
+Listbox.Option = ListboxOption;
 Listbox.Group = ListboxGroup;
 
 export default Listbox;

package/src/utils/components/Listbox/root/domHelpers.ts

@@ -1,5 +1,5 @@
-function findNextItem(currentItem: HTMLElement) {
-  const nextElement = currentItem.nextElementSibling as HTMLElement | null;
+function findNextOption(currentOption: HTMLElement) {
+  const nextElement = currentOption.nextElementSibling as HTMLElement | null;
   if (nextElement) {
     if (nextElement.role === "group") {
       return nextElement.querySelector<HTMLElement>('[role="option"]');
@@ -11,7 +11,7 @@ function findNextItem(currentItem: HTMLElement) {
 
   // No next element: Current element might be inside a group.
   // Check if the parent has a next sibling
-  const parentNextElement = currentItem.parentElement
+  const parentNextElement = currentOption.parentElement
     ?.nextElementSibling as HTMLElement | null;
   if (parentNextElement) {
     if (parentNextElement.role === "group") {
@@ -25,8 +25,9 @@ function findNextItem(currentItem: HTMLElement) {
   return null;
 }
 
-function findPrevItem(currentItem: HTMLElement) {
-  const prevElement = currentItem.previousElementSibling as HTMLElement | null;
+function findPrevOption(currentOption: HTMLElement) {
+  const prevElement =
+    currentOption.previousElementSibling as HTMLElement | null;
   if (prevElement) {
     if (prevElement.role === "group") {
       return prevElement.querySelector<HTMLElement>(
@@ -40,7 +41,7 @@ function findPrevItem(currentItem: HTMLElement) {
 
   // No previous element: Current element might be inside a group.
   // Check if the parent has a previous sibling.
-  const parentPrevElement = currentItem.parentElement
+  const parentPrevElement = currentOption.parentElement
     ?.previousElementSibling as HTMLElement | null;
   if (parentPrevElement) {
     if (parentPrevElement.role === "group") {
@@ -56,4 +57,4 @@ function findPrevItem(currentItem: HTMLElement) {
   return null;
 }
 
-export { findNextItem, findPrevItem };
+export { findNextOption, findPrevOption };

package/src/utils/components/floating/Floating.tsx

@@ -73,7 +73,7 @@ const Floating: FloatingComponent = ({ children }: FloatingProps) => {
  */
 type FloatingAnchorProps = HTMLAttributes<HTMLDivElement> &
   AsChildProps & {
-    virtualRef?: React.RefObject<Measurable>;
+    virtualRef?: Measurable;
   };
 
 /**
@@ -90,7 +90,7 @@ const FloatingAnchor = forwardRef<HTMLDivElement, FloatingAnchorProps>(
     useEffect(() => {
       // Allows anchoring the floating to non-DOM nodes like a cursor position.
       // We replace `anchorRef` with a virtual ref in such cases.
-      context.onAnchorChange(virtualRef?.current || ref.current);
+      context.onAnchorChange(virtualRef || ref.current);
     });
 
     const Comp = asChild ? Slot : "div";

package/src/utils/components/focus-boundary/FocusBoundary.tsx

@@ -31,7 +31,6 @@ interface FocusBoundaryProps extends React.HTMLAttributes<HTMLDivElement> {
    * tabbing. If focus is moved outside the boundary programmatically or by
    * pointer, it will not be moved back.
    *
-   * - Links (`<a>` elements), are not considered tabbable for the purpose of looping.
    * - Hidden inputs (i.e. `<input type="hidden">`) are not considered tabbable.
    * - Elements that are `display: none` or `visibility: hidden` are not considered tabbable.
    * - Elements with `tabIndex < 0` are not considered tabbable.
@@ -392,7 +391,7 @@ const FocusBoundary = forwardRef<HTMLDivElement, FocusBoundaryProps>(
  * Returns the first and last tabbable elements inside a container as a tuple.
  */
 function getTabbableEdges(container: HTMLElement) {
-  const candidates = getTabbableCandidates(container);
+  const candidates = getTabbableCandidates(container, { omitLinks: false });
   return [
     findFirstVisible(candidates, container),
     findFirstVisible(candidates.reverse(), container),

package/src/utils/components/link-anchor/LinkAnchor.tsx

@@ -29,6 +29,17 @@ const {
 
 type LinkAnchorOverlayProps = HTMLAttributes<HTMLDivElement> & AsChildProps;
 
+/*
+ * NB: Clicks on the overlay are captured with onClick. This does not work with middle-mouse-click.
+ * We could capture such click with onAuxClick, but last time we tried that,
+ * "forwarding" the click with dispatchEvent didn't work properly.
+ * - Chrome: Worked if we dispatched a regular click event.
+ * - Firefox: Did not work.
+ * - Safari: Opened the link in the same tab (tested in BrowserStack).
+ * We could use window.open() instead, but this would not run on(Aux)Click-callbacks on the link.
+ * We consider this unacceptable since many rely on this for tracking etc.
+ */
+
 const LinkAnchorOverlay = forwardRef<HTMLDivElement, LinkAnchorOverlayProps>(
   (
     {

package/src/utils/helpers/className.ts

@@ -41,7 +41,7 @@ function toVal(mix: Exclude<ClassValue, null | undefined | false>) {
 }
 
 function cl(...inputs: ClassValue[]) {
-  let parsedValue = "";
+  let parsedValue: string;
   let currentValue: ClassValue;
   let result = "";
 

package/src/utils/helpers/focus.ts

@@ -5,7 +5,10 @@
  * See: https://developer.mozilla.org/en-US/docs/Web/API/TreeWalker
  * Credit: https://github.com/discord/focus-layers/blob/master/src/util/wrapFocus.tsx#L1
  */
-function getTabbableCandidates(container: HTMLElement) {
+function getTabbableCandidates(
+  container: HTMLElement,
+  { omitLinks = true } = {},
+) {
   const nodes: HTMLElement[] = [];
   const walker = document.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {
     acceptNode: (node: any) => {
@@ -29,7 +32,7 @@ function getTabbableCandidates(container: HTMLElement) {
     nodes.push(walker.currentNode as HTMLElement);
   }
 
-  return removeLinks(nodes);
+  return omitLinks ? removeLinks(nodes) : nodes;
 }
 
 function removeLinks(items: HTMLElement[]) {

package/src/utils/helpers/index.ts

@@ -1,9 +1,9 @@
-export * from "./className";
-export * from "./composeEventHandlers";
-export * from "./clipboardCopy";
-export * from "./create-strict-context";
-export * from "./detectBrowser";
-export * from "./hideNonTargetElements";
-export * from "./owner";
-export * from "./requireReactElement";
-export * from "./resolveRef";
+export { cl } from "./className";
+export { composeEventHandlers } from "./composeEventHandlers";
+export { clipboardCopy } from "./clipboardCopy";
+export { createStrictContext } from "./create-strict-context";
+export { isIOS, isSafari, isWebKit } from "./detectBrowser";
+export { hideNonTargetElements } from "./hideNonTargetElements";
+export { ownerDocument, ownerWindow } from "./owner";
+export { requireReactElement } from "./requireReactElement";
+export { resolveRef } from "./resolveRef";

package/src/utils/hooks/index.ts

@@ -1,14 +1,21 @@
-export * from "./useControllableState";
-export * from "./useMergeRefs";
-export * from "./useMedia";
-export * from "./usePrevious";
-export * from "./useAnimationsFinished";
-export * from "./useEventCallback";
-export * from "./useOpenChangeAnimationComplete";
-export * from "./useRefWithInit";
-export * from "./useScrollLock";
-export * from "./useTimeout";
-export * from "./useTransitionStatus";
-export * from "./useValueAsRef";
-export * from "./descendants/useDescendant";
+export {
+  useControllableState,
+  type UseControllableStateProps,
+} from "./useControllableState";
+export { useMergeRefs, useMergeRefsN } from "./useMergeRefs";
+export { noMatchMedia, useMedia } from "./useMedia";
+export { usePrevious } from "./usePrevious";
+export { useAnimationsFinished } from "./useAnimationsFinished";
+export { useEventCallback } from "./useEventCallback";
+export { useOpenChangeAnimationComplete } from "./useOpenChangeAnimationComplete";
+export { useRefWithInit } from "./useRefWithInit";
+export { useScrollLock } from "./useScrollLock";
+export { Timeout, useTimeout } from "./useTimeout";
+export {
+  type TransitionStatus,
+  createTransitionStatusAttribute,
+  useTransitionStatus,
+} from "./useTransitionStatus";
+export { useValueAsRef } from "./useValueAsRef";
+export { createDescendantContext } from "./descendants/useDescendant";
 export { DescendantsManager } from "./descendants/descendant";

package/src/utils/hooks/useScrollLock.ts

@@ -6,6 +6,46 @@ let originalHtmlStyles: Partial<CSSStyleDeclaration> = {};
 let originalBodyStyles: Partial<CSSStyleDeclaration> = {};
 let originalHtmlScrollBehavior = "";
 
+function supportsStableScrollbarGutter(referenceElement: Element | null) {
+  const supported =
+    typeof CSS !== "undefined" &&
+    CSS.supports &&
+    CSS.supports("scrollbar-gutter", "stable");
+
+  if (!supported || typeof document === "undefined") {
+    return false;
+  }
+
+  /*
+   * We need to do aditional checks since the scenario:
+   * - Scrollbar is edited with `::-webkit-scrollbar`
+   * - MacOS setting: Show scroll bars -> Automatically based on mouse or tracked
+   * Causes the calculation of scrollbar width to be incorrect, and thus the scrollbar gutter to not work as intended.
+   */
+
+  const doc = ownerDocument(referenceElement);
+  const html = doc.documentElement;
+  const body = doc.body;
+
+  const scrollContainer = isOverflowElement(html) ? html : body;
+
+  const originalScrollContainerOverflowY = scrollContainer.style.overflowY;
+  const originalHtmlStyleGutter = html.style.scrollbarGutter;
+
+  html.style.scrollbarGutter = "stable";
+
+  scrollContainer.style.overflowY = "scroll";
+  const before = scrollContainer.offsetWidth;
+
+  scrollContainer.style.overflowY = "hidden";
+  const after = scrollContainer.offsetWidth;
+
+  scrollContainer.style.overflowY = originalScrollContainerOverflowY;
+  html.style.scrollbarGutter = originalHtmlStyleGutter;
+
+  return before === after;
+}
+
 function hasInsetScrollbars(referenceElement: Element | null) {
   if (typeof document === "undefined") {
     return false;
@@ -59,6 +99,9 @@ function preventScrollStandard(referenceElement: Element | null) {
 
     const htmlStyles = win.getComputedStyle(html);
     const bodyStyles = win.getComputedStyle(body);
+    const htmlScrollbarGutterValue = htmlStyles.scrollbarGutter || "";
+    const hasBothEdges = htmlScrollbarGutterValue.includes("both-edges");
+    const scrollbarGutterValue = hasBothEdges ? "stable both-edges" : "stable";
 
     scrollTop = html.scrollTop;
     scrollLeft = html.scrollLeft;
@@ -103,26 +146,27 @@ function preventScrollStandard(referenceElement: Element | null) {
     /**
      * Check support for stable scrollbar gutter to avoid layout shift when scrollbars appear/disappear.
      */
-    const supportsStableScrollbarGutter =
-      typeof CSS !== "undefined" &&
-      CSS.supports?.("scrollbar-gutter", "stable");
+    const supportsScrollbarGutter =
+      supportsStableScrollbarGutter(referenceElement);
+
     /*
      * DOM writes:
      * Do not read the DOM past this point!
      */
 
+    if (supportsScrollbarGutter) {
+      const elementToLock = isOverflowElement(html) ? html : body;
+
+      html.style.scrollbarGutter = scrollbarGutterValue;
+      elementToLock.style.overflowY = "hidden";
+      elementToLock.style.overflowX = "hidden";
+      return;
+    }
+
     Object.assign(html.style, {
       scrollbarGutter: "stable",
-      overflowY:
-        !supportsStableScrollbarGutter &&
-        (isScrollableY || hasConstantOverflowY)
-          ? "scroll"
-          : "hidden",
-      overflowX:
-        !supportsStableScrollbarGutter &&
-        (isScrollableX || hasConstantOverflowX)
-          ? "scroll"
-          : "hidden",
+      overflowY: isScrollableY || hasConstantOverflowY ? "scroll" : "hidden",
+      overflowX: isScrollableX || hasConstantOverflowX ? "scroll" : "hidden",
     });
 
     Object.assign(body.style, {

package/cjs/utils/components/Listbox/item/ListboxItem.d.ts

@@ -1,24 +0,0 @@
-import React from "react";
-export interface ListboxItemProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "role" | "tabIndex"> {
-    /**
-     * Unique ID used for tracking which item has virtual focus.
-     */
-    id: string;
-    hasVirtualFocus: boolean;
-    children: React.ReactNode;
-    /**
-     * Callback when item is selected.
-     * To improve performance when you have many items,
-     * memoize the prop with e.g. useEventCallback.
-     */
-    onClick: React.MouseEventHandler<HTMLDivElement>;
-}
-declare function ListboxItemComponent({ id, hasVirtualFocus, children, className, ...rest }: ListboxItemProps): React.JSX.Element;
-/**
- * This component is memoized. To improve performance when you have many items,
- * make sure all object props have stable references (i.e. memoize the event handlers with e.g. useEventCallback).
- *
- * NB: Remember to set `aria-selected` on selected items!
- */
-export declare const ListboxItem: typeof ListboxItemComponent;
-export {};

package/cjs/utils/components/Listbox/item/ListboxItem.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ListboxItem.js","sourceRoot":"","sources":["../../../../../src/utils/components/Listbox/item/ListboxItem.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,8CAAsC;AAoBtC,SAAS,oBAAoB,CAAC,EAMX;IACjB,oCAAoC;QAPR,EAC5B,EAAE,EACF,eAAe,EACf,QAAQ,EACR,SAAS,OAEQ,EADd,IAAI,cALqB,kDAM7B,CADQ;IAIP,cAAc;IAEd,OAAO,CACL,sEACiB,KAAK,IAChB,IAAI,IACR,SAAS,EAAE,IAAA,YAAE,EAAC,qBAAqB,EAAE,SAAS,CAAC,EAC/C,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC,CAAC,wBACQ,eAAe,aAC1B,EAAE,EACX,EAAE,EAAE,eAAe,CAAC,CAAC,CAAC,4BAA4B,CAAC,CAAC,CAAC,SAAS,KAE7D,QAAQ,CACL,CACP,CAAC;AACJ,CAAC;AAED;;;;;GAKG;AACU,QAAA,WAAW,GAAG,eAAK,CAAC,IAAI,CACnC,oBAAoB,CACU,CAAC"}

package/cjs/utils/components/Listbox/list/ListboxList.d.ts

@@ -1,8 +0,0 @@
-/** biome-ignore-all lint/a11y/useKeyWithMouseEvents: We know what we are doing */
-import React from "react";
-export interface ListboxListProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "role" | "tabIndex" | "onMouseOver"> {
-    children: React.ReactNode;
-    setVirtuallyFocusedItemId: (value: string) => void;
-}
-declare function ListboxList({ children, setVirtuallyFocusedItemId, ...rest }: ListboxListProps): React.JSX.Element;
-export { ListboxList };

package/cjs/utils/components/Listbox/list/ListboxList.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ListboxList.js","sourceRoot":"","sources":["../../../../../src/utils/components/Listbox/list/ListboxList.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAqCS,kCAAW;AArCpB,0DAA0D;AAC1D,kFAAkF;AAClF,kDAA0B;AAC1B,8CAAsC;AAUtC,SAAS,WAAW,CAAC,EAIF;QAJE,EACnB,QAAQ,EACR,yBAAyB,OAER,EADd,IAAI,cAHY,yCAIpB,CADQ;IAEP,OAAO,CACL,uDACM,IAAI,IACR,SAAS,EAAE,IAAA,YAAE,EAAC,IAAI,CAAC,SAAS,EAAE,qBAAqB,CAAC,EACpD,IAAI,EAAC,SAAS,EACd,QAAQ,EAAE,CAAC,CAAC,EACZ,WAAW,EAAE,CAAC,KAAK,EAAE,EAAE;YACrB,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAC;YAC3C,MAAM,MAAM,GAAuB,MAAM,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC;YACrE,IAAI,MAAM,EAAE,CAAC;gBACX,yBAAyB,CAAC,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,OAAO,CAAC,EAAE,KAAI,EAAE,CAAC,CAAC;YACtD,CAAC;QACH,CAAC,KAEA,QAAQ,CACL,CACP,CAAC;AACJ,CAAC"}

package/esm/utils/components/Listbox/item/ListboxItem.d.ts

@@ -1,24 +0,0 @@
-import React from "react";
-export interface ListboxItemProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "role" | "tabIndex"> {
-    /**
-     * Unique ID used for tracking which item has virtual focus.
-     */
-    id: string;
-    hasVirtualFocus: boolean;
-    children: React.ReactNode;
-    /**
-     * Callback when item is selected.
-     * To improve performance when you have many items,
-     * memoize the prop with e.g. useEventCallback.
-     */
-    onClick: React.MouseEventHandler<HTMLDivElement>;
-}
-declare function ListboxItemComponent({ id, hasVirtualFocus, children, className, ...rest }: ListboxItemProps): React.JSX.Element;
-/**
- * This component is memoized. To improve performance when you have many items,
- * make sure all object props have stable references (i.e. memoize the event handlers with e.g. useEventCallback).
- *
- * NB: Remember to set `aria-selected` on selected items!
- */
-export declare const ListboxItem: typeof ListboxItemComponent;
-export {};

package/esm/utils/components/Listbox/item/ListboxItem.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ListboxItem.js","sourceRoot":"","sources":["../../../../../src/utils/components/Listbox/item/ListboxItem.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AAoBtC,SAAS,oBAAoB,CAAC,EAMX;IACjB,oCAAoC;QAPR,EAC5B,EAAE,EACF,eAAe,EACf,QAAQ,EACR,SAAS,OAEQ,EADd,IAAI,cALqB,kDAM7B,CADQ;IAIP,cAAc;IAEd,OAAO,CACL,4DACiB,KAAK,IAChB,IAAI,IACR,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,SAAS,CAAC,EAC/C,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC,CAAC,wBACQ,eAAe,aAC1B,EAAE,EACX,EAAE,EAAE,eAAe,CAAC,CAAC,CAAC,4BAA4B,CAAC,CAAC,CAAC,SAAS,KAE7D,QAAQ,CACL,CACP,CAAC;AACJ,CAAC;AAED;;;;;GAKG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,KAAK,CAAC,IAAI,CACnC,oBAAoB,CACU,CAAC"}

package/esm/utils/components/Listbox/list/ListboxList.d.ts

@@ -1,8 +0,0 @@
-/** biome-ignore-all lint/a11y/useKeyWithMouseEvents: We know what we are doing */
-import React from "react";
-export interface ListboxListProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "role" | "tabIndex" | "onMouseOver"> {
-    children: React.ReactNode;
-    setVirtuallyFocusedItemId: (value: string) => void;
-}
-declare function ListboxList({ children, setVirtuallyFocusedItemId, ...rest }: ListboxListProps): React.JSX.Element;
-export { ListboxList };

package/esm/utils/components/Listbox/list/ListboxList.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ListboxList.js","sourceRoot":"","sources":["../../../../../src/utils/components/Listbox/list/ListboxList.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,0DAA0D;AAC1D,kFAAkF;AAClF,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AAUtC,SAAS,WAAW,CAAC,EAIF;QAJE,EACnB,QAAQ,EACR,yBAAyB,OAER,EADd,IAAI,cAHY,yCAIpB,CADQ;IAEP,OAAO,CACL,6CACM,IAAI,IACR,SAAS,EAAE,EAAE,CAAC,IAAI,CAAC,SAAS,EAAE,qBAAqB,CAAC,EACpD,IAAI,EAAC,SAAS,EACd,QAAQ,EAAE,CAAC,CAAC,EACZ,WAAW,EAAE,CAAC,KAAK,EAAE,EAAE;YACrB,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAC;YAC3C,MAAM,MAAM,GAAuB,MAAM,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC;YACrE,IAAI,MAAM,EAAE,CAAC;gBACX,yBAAyB,CAAC,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,OAAO,CAAC,EAAE,KAAI,EAAE,CAAC,CAAC;YACtD,CAAC;QACH,CAAC,KAEA,QAAQ,CACL,CACP,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,WAAW,EAAE,CAAC"}