@ariakit/react/cjs/__chunks/Y4UFQFAT.cjs

Toolkit for building accessible web apps with React

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







var _FHQLDZSWcjs = require('./FHQLDZSW.cjs');


var _SBAK37L7cjs = require('./SBAK37L7.cjs');



var _5FQZLBJ7cjs = require('./5FQZLBJ7.cjs');


var _LF4ENSO4cjs = require('./LF4ENSO4.cjs');






















var _LZ6L3ECGcjs = require('./LZ6L3ECG.cjs');

// ../ariakit-react-components/dist/composite/composite-item.js
var _react = require('react');
var _jsxruntime = require('react/jsx-runtime');
var TagName = "button";
function isEditableElement(element) {
  if (_LZ6L3ECGcjs.isTextbox.call(void 0, element)) return true;
  return element.tagName === "INPUT" && !_LZ6L3ECGcjs.isButton.call(void 0, element);
}
function getNextPageOffset(scrollingElement, pageUp = false) {
  const height = scrollingElement.clientHeight;
  const { top } = scrollingElement.getBoundingClientRect();
  const pageSize = Math.max(height * 0.875, height - 40) * 1.5;
  const pageOffset = pageUp ? height - pageSize + top : pageSize + top;
  if (scrollingElement.tagName === "HTML") return pageOffset + scrollingElement.scrollTop;
  return pageOffset;
}
function getItemOffset(itemElement, pageUp = false) {
  const { top } = itemElement.getBoundingClientRect();
  if (pageUp) return top + itemElement.clientHeight;
  return top;
}
function findNextPageItemId(element, store, next, pageUp = false) {
  var _a;
  if (!store) return;
  if (!next) return;
  const { renderedItems } = store.getState();
  const scrollingElement = _LZ6L3ECGcjs.getScrollingElement.call(void 0, element);
  if (!scrollingElement) return;
  const nextPageOffset = getNextPageOffset(scrollingElement, pageUp);
  let id;
  let prevDifference;
  for (let i = 0; i < renderedItems.length; i += 1) {
    const previousId = id;
    id = next(i);
    if (!id) break;
    if (id === previousId) continue;
    const itemElement = (_a = _FHQLDZSWcjs.getEnabledItem.call(void 0, store, id)) == null ? void 0 : _a.element;
    if (!itemElement) continue;
    const difference = getItemOffset(itemElement, pageUp) - nextPageOffset;
    const absDifference = Math.abs(difference);
    if (pageUp && difference <= 0 || !pageUp && difference >= 0) {
      if (prevDifference !== void 0 && prevDifference < absDifference) id = previousId;
      break;
    }
    prevDifference = absDifference;
  }
  return id;
}
function targetIsAnotherItem(event, store) {
  if (_LZ6L3ECGcjs.isSelfTarget.call(void 0, event)) return false;
  return _FHQLDZSWcjs.isItem.call(void 0, store, event.target);
}
var useCompositeItem = _LZ6L3ECGcjs.createHook.call(void 0, function useCompositeItem2({ store, rowId: rowIdProp, preventScrollOnKeyDown = false, moveOnKeyPress = true, tabbable = false, getItem: getItemProp, "aria-setsize": ariaSetSizeProp, "aria-posinset": ariaPosInSetProp, ...props }) {
  const context = _FHQLDZSWcjs.useCompositeScopedContext.call(void 0, );
  store = store || context;
  const id = _LZ6L3ECGcjs.useId.call(void 0, props.id);
  const ref = _react.useRef.call(void 0, null);
  const row = _react.useContext.call(void 0, _FHQLDZSWcjs.CompositeRowContext);
  const trulyDisabled = _LZ6L3ECGcjs.disabledFromProps.call(void 0, props) && !props.accessibleWhenDisabled;
  const shouldRegisterItem = props.shouldRegisterItem;
  const getRowId = (state) => {
    if (rowIdProp) return rowIdProp;
    if (!state) return;
    if (!(row == null ? void 0 : row.baseElement)) return;
    if (row.baseElement !== state.baseElement) return;
    return row.id;
  };
  const { rowId, baseElement, isActiveItem, ariaSetSize, ariaPosInSet, isTabbable } = _5FQZLBJ7cjs.useStoreStateObject.call(void 0, store, {
    rowId: getRowId,
    baseElement(state) {
      return (state == null ? void 0 : state.baseElement) || void 0;
    },
    isActiveItem(state) {
      return !!state && state.activeId === id;
    },
    ariaSetSize(state) {
      if (ariaSetSizeProp != null) return ariaSetSizeProp;
      if (!state) return;
      if (!(row == null ? void 0 : row.ariaSetSize)) return;
      if (row.baseElement !== state.baseElement) return;
      return row.ariaSetSize;
    },
    ariaPosInSet(state) {
      if (ariaPosInSetProp != null) return ariaPosInSetProp;
      if (!state) return;
      if (!(row == null ? void 0 : row.ariaPosInSet)) return;
      if (row.baseElement !== state.baseElement) return;
      const rowId2 = getRowId(state);
      const itemsInRow = state.renderedItems.filter((item) => item.rowId === rowId2);
      return row.ariaPosInSet + itemsInRow.findIndex((item) => item.id === id);
    },
    isTabbable(state) {
      if (!(state == null ? void 0 : state.renderedItems.length)) return true;
      if (state.virtualFocus) return false;
      if (tabbable) return true;
      if (state.activeId === null) return false;
      const item = store == null ? void 0 : store.item(state.activeId);
      if (item == null ? void 0 : item.disabled) return true;
      if (!(item == null ? void 0 : item.element)) return true;
      return state.activeId === id;
    }
  });
  const getItem = _react.useCallback.call(void 0, (item) => {
    var _a;
    const nextItem = {
      ...item,
      id: id || item.id,
      rowId,
      disabled: trulyDisabled,
      children: (_a = item.element) == null ? void 0 : _a.textContent
    };
    if (getItemProp) return getItemProp(nextItem);
    return nextItem;
  }, [
    id,
    rowId,
    trulyDisabled,
    getItemProp
  ]);
  const onFocusProp = props.onFocus;
  const hasFocusedComposite = _react.useRef.call(void 0, false);
  const cancelScheduledFocusRedirectRef = _react.useRef.call(void 0, null);
  const onFocus = _LZ6L3ECGcjs.useEvent.call(void 0, (event) => {
    onFocusProp == null ? void 0 : onFocusProp(event);
    if (event.defaultPrevented) return;
    if (_LZ6L3ECGcjs.isPortalEvent.call(void 0, event)) return;
    if (!id) return;
    if (!store) return;
    if (targetIsAnotherItem(event, store)) return;
    const { virtualFocus, baseElement: baseElement2 } = store.getState();
    store.setActiveId(id);
    if (_LZ6L3ECGcjs.isTextbox.call(void 0, event.currentTarget)) _FHQLDZSWcjs.selectTextField.call(void 0, event.currentTarget);
    if (!virtualFocus) return;
    if (!_LZ6L3ECGcjs.isSelfTarget.call(void 0, event)) return;
    if (isEditableElement(event.currentTarget)) return;
    const redirectFocusToBaseElement = (currentTarget2, relatedTarget2, baseElement3) => {
      if (_LZ6L3ECGcjs.isSafari.call(void 0, ) && currentTarget2.hasAttribute("data-autofocus")) currentTarget2.scrollIntoView({
        block: "nearest",
        inline: "nearest"
      });
      hasFocusedComposite.current = true;
      if (relatedTarget2 === baseElement3 || _FHQLDZSWcjs.isItem.call(void 0, store, relatedTarget2)) _FHQLDZSWcjs.focusSilently.call(void 0, baseElement3);
      else baseElement3.focus();
    };
    if (baseElement2 == null ? void 0 : baseElement2.isConnected) {
      redirectFocusToBaseElement(event.currentTarget, event.relatedTarget, baseElement2);
      return;
    }
    if (shouldRegisterItem === false) return;
    const { currentTarget, relatedTarget } = event;
    const cancelScheduledFocusRedirect = () => {
      var _a;
      (_a = cancelScheduledFocusRedirectRef.current) == null ? void 0 : _a.call(cancelScheduledFocusRedirectRef);
      cancelScheduledFocusRedirectRef.current = null;
    };
    cancelScheduledFocusRedirect();
    cancelScheduledFocusRedirectRef.current = _5FQZLBJ7cjs.subscribe.call(void 0, store, null, () => {
      if (_LZ6L3ECGcjs.getActiveElement.call(void 0, currentTarget) !== currentTarget) {
        cancelScheduledFocusRedirect();
        return;
      }
      const state = store.getState();
      const nextBaseElement = state.baseElement;
      if (!(nextBaseElement == null ? void 0 : nextBaseElement.isConnected)) return;
      cancelScheduledFocusRedirect();
      if (!state.virtualFocus) return;
      redirectFocusToBaseElement(currentTarget, relatedTarget, nextBaseElement);
    });
  });
  const onBlurCaptureProp = props.onBlurCapture;
  const onBlurCapture = _LZ6L3ECGcjs.useEvent.call(void 0, (event) => {
    var _a;
    onBlurCaptureProp == null ? void 0 : onBlurCaptureProp(event);
    if (event.defaultPrevented) return;
    if (((_a = store == null ? void 0 : store.getState()) == null ? void 0 : _a.virtualFocus) && hasFocusedComposite.current) {
      hasFocusedComposite.current = false;
      event.preventDefault();
      event.stopPropagation();
    }
  });
  const onKeyDownProp = props.onKeyDown;
  const preventScrollOnKeyDownProp = _LZ6L3ECGcjs.useBooleanEvent.call(void 0, preventScrollOnKeyDown);
  const moveOnKeyPressProp = _LZ6L3ECGcjs.useBooleanEvent.call(void 0, moveOnKeyPress);
  const onKeyDown = _LZ6L3ECGcjs.useEvent.call(void 0, (event) => {
    var _a;
    onKeyDownProp == null ? void 0 : onKeyDownProp(event);
    if (event.defaultPrevented) return;
    if (!_LZ6L3ECGcjs.isSelfTarget.call(void 0, event)) return;
    if (!store) return;
    const { currentTarget } = event;
    const state = store.getState();
    const isGrid = !!((_a = store.item(id)) == null ? void 0 : _a.rowId);
    const isVertical = state.orientation !== "horizontal";
    const isHorizontal = state.orientation !== "vertical";
    const canHomeEnd = () => {
      if (isGrid) return true;
      if (isHorizontal) return true;
      if (!state.baseElement) return true;
      if (!_LZ6L3ECGcjs.isTextField.call(void 0, state.baseElement)) return true;
      return false;
    };
    const action = {
      ArrowUp: (isGrid || isVertical) && store.up,
      ArrowRight: (isGrid || isHorizontal) && store.next,
      ArrowDown: (isGrid || isVertical) && store.down,
      ArrowLeft: (isGrid || isHorizontal) && store.previous,
      Home: () => {
        if (!canHomeEnd()) return;
        if (!isGrid || event.ctrlKey) return store == null ? void 0 : store.first();
        return store == null ? void 0 : store.previous(-1);
      },
      End: () => {
        if (!canHomeEnd()) return;
        if (!isGrid || event.ctrlKey) return store == null ? void 0 : store.last();
        return store == null ? void 0 : store.next(-1);
      },
      PageUp: () => {
        return findNextPageItemId(currentTarget, store, store == null ? void 0 : store.up, true);
      },
      PageDown: () => {
        return findNextPageItemId(currentTarget, store, store == null ? void 0 : store.down);
      }
    }[event.key];
    if (action) {
      if (_LZ6L3ECGcjs.isTextbox.call(void 0, currentTarget)) {
        const selection = _LZ6L3ECGcjs.getTextboxSelection.call(void 0, currentTarget);
        const isLeft = isHorizontal && event.key === "ArrowLeft";
        const isRight = isHorizontal && event.key === "ArrowRight";
        const isUp = isVertical && event.key === "ArrowUp";
        const isDown = isVertical && event.key === "ArrowDown";
        if (isRight || isDown) {
          const { length: valueLength } = _LZ6L3ECGcjs.getTextboxValue.call(void 0, currentTarget);
          if (selection.end !== valueLength) return;
        } else if ((isLeft || isUp) && selection.start !== 0) return;
      }
      const nextId = action();
      if (preventScrollOnKeyDownProp(event) || nextId !== void 0) {
        if (!moveOnKeyPressProp(event)) return;
        event.preventDefault();
        store.move(nextId);
      }
    }
  });
  const providerValue = _react.useMemo.call(void 0, () => ({
    id,
    baseElement
  }), [id, baseElement]);
  props = _LZ6L3ECGcjs.useWrapElement.call(void 0, props, (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _FHQLDZSWcjs.CompositeItemContext.Provider, {
    value: providerValue,
    children: element
  }), [providerValue]);
  props = {
    "data-active-item": isActiveItem || void 0,
    ...props,
    id,
    ref: _LZ6L3ECGcjs.useMergeRefs.call(void 0, ref, props.ref),
    tabIndex: isTabbable ? props.tabIndex : -1,
    onFocus,
    onBlurCapture,
    onKeyDown
  };
  props = _LF4ENSO4cjs.useCommand.call(void 0, props);
  props = _SBAK37L7cjs.useCollectionItem.call(void 0, {
    store,
    ...props,
    getItem,
    shouldRegisterItem: id ? shouldRegisterItem : false
  });
  return _LZ6L3ECGcjs.removeUndefinedValues.call(void 0, {
    ...props,
    "aria-setsize": ariaSetSize,
    "aria-posinset": ariaPosInSet
  });
});
var CompositeItem = _LZ6L3ECGcjs.memo.call(void 0, _LZ6L3ECGcjs.forwardRef.call(void 0, function CompositeItem2(props) {
  return _LZ6L3ECGcjs.createElement.call(void 0, TagName, useCompositeItem(props));
}));




exports.useCompositeItem = useCompositeItem; exports.CompositeItem = CompositeItem;