@base-ui-components/react/esm/utils/popupStateMapping.js

Base UI is a library of headless ('unstyled') React components and low-level hooks. You gain complete control over your app's CSS and accessibility features.

import { TransitionStatusDataAttributes } from "./stateAttributesMapping.js";
export let CommonPopupDataAttributes = function (CommonPopupDataAttributes) {
  /**
   * Present when the popup is open.
   */
  CommonPopupDataAttributes["open"] = "data-open";
  /**
   * Present when the popup is closed.
   */
  CommonPopupDataAttributes["closed"] = "data-closed";
  /**
   * Present when the popup is animating in.
   */
  CommonPopupDataAttributes[CommonPopupDataAttributes["startingStyle"] = TransitionStatusDataAttributes.startingStyle] = "startingStyle";
  /**
   * Present when the popup is animating out.
   */
  CommonPopupDataAttributes[CommonPopupDataAttributes["endingStyle"] = TransitionStatusDataAttributes.endingStyle] = "endingStyle";
  /**
   * Present when the anchor is hidden.
   */
  CommonPopupDataAttributes["anchorHidden"] = "data-anchor-hidden";
  return CommonPopupDataAttributes;
}({});
export let CommonTriggerDataAttributes = /*#__PURE__*/function (CommonTriggerDataAttributes) {
  /**
   * Present when the popup is open.
   */
  CommonTriggerDataAttributes["popupOpen"] = "data-popup-open";
  /**
   * Present when a pressable trigger is pressed.
   */
  CommonTriggerDataAttributes["pressed"] = "data-pressed";
  return CommonTriggerDataAttributes;
}({});
const TRIGGER_HOOK = {
  [CommonTriggerDataAttributes.popupOpen]: ''
};
const PRESSABLE_TRIGGER_HOOK = {
  [CommonTriggerDataAttributes.popupOpen]: '',
  [CommonTriggerDataAttributes.pressed]: ''
};
const POPUP_OPEN_HOOK = {
  [CommonPopupDataAttributes.open]: ''
};
const POPUP_CLOSED_HOOK = {
  [CommonPopupDataAttributes.closed]: ''
};
const ANCHOR_HIDDEN_HOOK = {
  [CommonPopupDataAttributes.anchorHidden]: ''
};
export const triggerOpenStateMapping = {
  open(value) {
    if (value) {
      return TRIGGER_HOOK;
    }
    return null;
  }
};
export const pressableTriggerOpenStateMapping = {
  open(value) {
    if (value) {
      return PRESSABLE_TRIGGER_HOOK;
    }
    return null;
  }
};
export const popupStateMapping = {
  open(value) {
    if (value) {
      return POPUP_OPEN_HOOK;
    }
    return POPUP_CLOSED_HOOK;
  },
  anchorHidden(value) {
    if (value) {
      return ANCHOR_HIDDEN_HOOK;
    }
    return null;
  }
};