@ariakit/react-core/cjs/__chunks/PWM7G7D3.cjs

Ariakit React core

"use strict";Object.defineProperty(exports, "__esModule", {value: true});


var _4R2KFV2Fcjs = require('./4R2KFV2F.cjs');


var _N37IROBRcjs = require('./N37IROBR.cjs');


var _YTEJF6TYcjs = require('./YTEJF6TY.cjs');


var _25BPIGZHcjs = require('./25BPIGZH.cjs');





var _WULEED4Qcjs = require('./WULEED4Q.cjs');





var _OZM4QA2Vcjs = require('./OZM4QA2V.cjs');




var _7EQBAZ46cjs = require('./7EQBAZ46.cjs');

// src/select/select-item.tsx
var _dom = require('@ariakit/core/utils/dom');
var _events = require('@ariakit/core/utils/events');
var _misc = require('@ariakit/core/utils/misc');
var _react = require('react');
var _jsxruntime = require('react/jsx-runtime');
var TagName = "div";
function isSelected(storeValue, itemValue) {
  if (itemValue == null) return;
  if (storeValue == null) return false;
  if (Array.isArray(storeValue)) {
    return storeValue.includes(itemValue);
  }
  return storeValue === itemValue;
}
var useSelectItem = _WULEED4Qcjs.createHook.call(void 0, 
  function useSelectItem2(_a) {
    var _b = _a, {
      store,
      value,
      getItem: getItemProp,
      hideOnClick,
      setValueOnClick = value != null,
      preventScrollOnKeyDown = true,
      focusOnHover = true
    } = _b, props = _7EQBAZ46cjs.__objRest.call(void 0, _b, [
      "store",
      "value",
      "getItem",
      "hideOnClick",
      "setValueOnClick",
      "preventScrollOnKeyDown",
      "focusOnHover"
    ]);
    var _a2;
    const context = _4R2KFV2Fcjs.useSelectScopedContext.call(void 0, );
    store = store || context;
    _misc.invariant.call(void 0, 
      store,
      process.env.NODE_ENV !== "production" && "SelectItem must be wrapped in a SelectList or SelectPopover component."
    );
    const id = _OZM4QA2Vcjs.useId.call(void 0, props.id);
    const disabled = _misc.disabledFromProps.call(void 0, props);
    const { listElement, multiSelectable, selected, autoFocus } = _25BPIGZHcjs.useStoreStateObject.call(void 0, store, {
      listElement: "listElement",
      multiSelectable(state) {
        return Array.isArray(state.value);
      },
      selected(state) {
        return isSelected(state.value, value);
      },
      autoFocus(state) {
        if (value == null) return false;
        if (state.value == null) return false;
        if (state.activeId !== id && (store == null ? void 0 : store.item(state.activeId))) {
          return false;
        }
        if (Array.isArray(state.value)) {
          return state.value[state.value.length - 1] === value;
        }
        return state.value === value;
      }
    });
    const getItem = _react.useCallback.call(void 0, 
      (item) => {
        const nextItem = _7EQBAZ46cjs.__spreadProps.call(void 0, _7EQBAZ46cjs.__spreadValues.call(void 0, {}, item), {
          value: disabled ? void 0 : value,
          children: value
        });
        if (getItemProp) {
          return getItemProp(nextItem);
        }
        return nextItem;
      },
      [disabled, value, getItemProp]
    );
    hideOnClick = hideOnClick != null ? hideOnClick : value != null && !multiSelectable;
    const onClickProp = props.onClick;
    const setValueOnClickProp = _OZM4QA2Vcjs.useBooleanEvent.call(void 0, setValueOnClick);
    const hideOnClickProp = _OZM4QA2Vcjs.useBooleanEvent.call(void 0, hideOnClick);
    const onClick = _OZM4QA2Vcjs.useEvent.call(void 0, (event) => {
      onClickProp == null ? void 0 : onClickProp(event);
      if (event.defaultPrevented) return;
      if (_events.isDownloading.call(void 0, event)) return;
      if (_events.isOpeningInNewTab.call(void 0, event)) return;
      if (setValueOnClickProp(event) && value != null) {
        store == null ? void 0 : store.setValue((prevValue) => {
          if (!Array.isArray(prevValue)) return value;
          if (prevValue.includes(value)) {
            return prevValue.filter((v) => v !== value);
          }
          return [...prevValue, value];
        });
      }
      if (hideOnClickProp(event)) {
        store == null ? void 0 : store.hide();
      }
    });
    props = _OZM4QA2Vcjs.useWrapElement.call(void 0, 
      props,
      (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _4R2KFV2Fcjs.SelectItemCheckedContext.Provider, { value: selected != null ? selected : false, children: element }),
      [selected]
    );
    props = _7EQBAZ46cjs.__spreadProps.call(void 0, _7EQBAZ46cjs.__spreadValues.call(void 0, {
      id,
      role: _dom.getPopupItemRole.call(void 0, listElement),
      "aria-selected": selected,
      children: value
    }, props), {
      autoFocus: (_a2 = props.autoFocus) != null ? _a2 : autoFocus,
      onClick
    });
    props = _YTEJF6TYcjs.useCompositeItem.call(void 0, _7EQBAZ46cjs.__spreadValues.call(void 0, {
      store,
      getItem,
      preventScrollOnKeyDown
    }, props));
    const focusOnHoverProp = _OZM4QA2Vcjs.useBooleanEvent.call(void 0, focusOnHover);
    props = _N37IROBRcjs.useCompositeHover.call(void 0, _7EQBAZ46cjs.__spreadProps.call(void 0, _7EQBAZ46cjs.__spreadValues.call(void 0, {
      store
    }, props), {
      // We have to disable focusOnHover when the popup is closed, otherwise
      // the active item will change to null (the container) when the popup is
      // closed by clicking on an item.
      focusOnHover(event) {
        if (!focusOnHoverProp(event)) return false;
        const state = store == null ? void 0 : store.getState();
        return !!(state == null ? void 0 : state.open);
      }
    }));
    return props;
  }
);
var SelectItem = _WULEED4Qcjs.memo.call(void 0, 
  _WULEED4Qcjs.forwardRef.call(void 0, function SelectItem2(props) {
    const htmlProps = useSelectItem(props);
    return _WULEED4Qcjs.createElement.call(void 0, TagName, htmlProps);
  })
);




exports.useSelectItem = useSelectItem; exports.SelectItem = SelectItem;