@ariakit/react-core/esm/combobox/combobox-item-offscreen.js

Ariakit React core

"use client";
import {
  useCompositeItemOffscreen
} from "../__chunks/SC6AOPSH.js";
import {
  ComboboxItem
} from "../__chunks/QKXRU7QI.js";
import "../__chunks/RIJYZEV5.js";
import "../__chunks/FIT2LC3L.js";
import "../__chunks/5VQZOHHZ.js";
import "../__chunks/EDO57HR4.js";
import {
  Role
} from "../__chunks/HIN2NSI2.js";
import "../__chunks/DTXGDDAC.js";
import {
  ComboboxListRoleContext,
  useComboboxScopedContext
} from "../__chunks/7P7IWEBR.js";
import "../__chunks/MWF5B7KS.js";
import "../__chunks/63N3TCQX.js";
import "../__chunks/FFSBKSAM.js";
import "../__chunks/72IB6YNO.js";
import "../__chunks/WJ7PHYH7.js";
import "../__chunks/US3TW2XI.js";
import "../__chunks/SWN3JYXT.js";
import "../__chunks/Q3KUZPD7.js";
import "../__chunks/45YOMIF3.js";
import {
  forwardRef
} from "../__chunks/ILRXHV7V.js";
import {
  useMergeRefs
} from "../__chunks/K2XTQB3X.js";
import "../__chunks/YXGXYGQX.js";

// src/combobox/combobox-item-offscreen.tsx
import { useContext } from "react";
import { jsx } from "react/jsx-runtime";
var TagName = "div";
var itemRoleByPopupRole = {
  menu: "menuitem",
  listbox: "option",
  tree: "treeitem"
};
function getItemRole(popupRole) {
  var _a;
  const key = popupRole;
  return (_a = itemRoleByPopupRole[key]) != null ? _a : "option";
}
function useComboboxItemOffscreen({ store, value, ...props }) {
  const context = useComboboxScopedContext();
  store = store || context;
  const offscreenProps = useCompositeItemOffscreen({ store, value, ...props });
  const popupRole = useContext(ComboboxListRoleContext);
  if (!offscreenProps.active) {
    return {
      ...offscreenProps,
      role: getItemRole(popupRole)
    };
  }
  return offscreenProps;
}
var ComboboxItem2 = forwardRef(function ComboboxItem3({
  offscreenBehavior,
  offscreenRoot,
  ...props
}) {
  const { active, ref, ...rest } = useComboboxItemOffscreen({
    offscreenBehavior,
    offscreenRoot,
    ...props
  });
  const allProps = { ...rest, ...props, ref: useMergeRefs(ref, props.ref) };
  if (active) {
    return /* @__PURE__ */ jsx(ComboboxItem, { ...allProps });
  }
  const {
    store,
    value,
    hideOnClick,
    setValueOnClick,
    selectValueOnClick,
    resetValueOnSelect,
    focusOnHover,
    blurOnHoverEnd,
    moveOnKeyPress,
    getItem,
    ...htmlProps
  } = allProps;
  const Component = Role[TagName];
  return /* @__PURE__ */ jsx(Component, { ...htmlProps });
});
export {
  ComboboxItem2 as ComboboxItem,
  useComboboxItemOffscreen
};