@primer/react/dist/Popover/Popover.js

An implementation of GitHub's Primer Design System using React

import { c } from 'react-compiler-runtime';
import { clsx } from 'clsx';
import classes from './Popover.module.css.js';
import React, { useRef } from 'react';
import { jsx } from 'react/jsx-runtime';
import { useOnOutsideClick } from '../hooks/useOnOutsideClick.js';

const EMPTY_IGNORE_CLICK_REFS = [];
const Popover = /*#__PURE__*/React.forwardRef(function Popover(t0, forwardRef) {
  const $ = c(15);
  let className;
  let open;
  let props;
  let relative;
  let t1;
  if ($[0] !== t0) {
    ({
      className,
      caret: t1,
      open,
      relative,
      ...props
    } = t0);
    $[0] = t0;
    $[1] = className;
    $[2] = open;
    $[3] = props;
    $[4] = relative;
    $[5] = t1;
  } else {
    className = $[1];
    open = $[2];
    props = $[3];
    relative = $[4];
    t1 = $[5];
  }
  const caret = t1 === undefined ? "top" : t1;
  const t2 = open ? "" : undefined;
  const t3 = relative ? "" : undefined;
  let t4;
  if ($[6] !== className) {
    t4 = clsx(className, classes.Popover);
    $[6] = className;
    $[7] = t4;
  } else {
    t4 = $[7];
  }
  let t5;
  if ($[8] !== caret || $[9] !== forwardRef || $[10] !== props || $[11] !== t2 || $[12] !== t3 || $[13] !== t4) {
    t5 = /*#__PURE__*/jsx("div", {
      ...props,
      ref: forwardRef,
      "data-open": t2,
      "data-relative": t3,
      "data-caret": caret,
      className: t4
    });
    $[8] = caret;
    $[9] = forwardRef;
    $[10] = props;
    $[11] = t2;
    $[12] = t3;
    $[13] = t4;
    $[14] = t5;
  } else {
    t5 = $[14];
  }
  return t5;
});
Popover.displayName = 'Popover';
const PopoverContent = t0 => {
  var _onClickOutside, _ignoreClickRefs;
  const $ = c(17);
  let className;
  let ignoreClickRefs;
  let onClickOutside;
  let props;
  let t1;
  let t2;
  if ($[0] !== t0) {
    ({
      className,
      width: t1,
      height: t2,
      onClickOutside,
      ignoreClickRefs,
      ...props
    } = t0);
    $[0] = t0;
    $[1] = className;
    $[2] = ignoreClickRefs;
    $[3] = onClickOutside;
    $[4] = props;
    $[5] = t1;
    $[6] = t2;
  } else {
    className = $[1];
    ignoreClickRefs = $[2];
    onClickOutside = $[3];
    props = $[4];
    t1 = $[5];
    t2 = $[6];
  }
  const width = t1 === undefined ? "small" : t1;
  const height = t2 === undefined ? "fit-content" : t2;
  const divRef = useRef(null);
  const outsideClickHandler = (_onClickOutside = onClickOutside) !== null && _onClickOutside !== void 0 ? _onClickOutside : _temp;
  const t3 = (_ignoreClickRefs = ignoreClickRefs) !== null && _ignoreClickRefs !== void 0 ? _ignoreClickRefs : EMPTY_IGNORE_CLICK_REFS;
  let t4;
  if ($[7] !== outsideClickHandler || $[8] !== t3) {
    t4 = {
      onClickOutside: outsideClickHandler,
      containerRef: divRef,
      ignoreClickRefs: t3
    };
    $[7] = outsideClickHandler;
    $[8] = t3;
    $[9] = t4;
  } else {
    t4 = $[9];
  }
  useOnOutsideClick(t4);
  let t5;
  if ($[10] !== className) {
    t5 = clsx(className, classes.PopoverContent);
    $[10] = className;
    $[11] = t5;
  } else {
    t5 = $[11];
  }
  let t6;
  if ($[12] !== height || $[13] !== props || $[14] !== t5 || $[15] !== width) {
    t6 = /*#__PURE__*/jsx("div", {
      ref: divRef,
      "data-width": width,
      "data-height": height,
      className: t5,
      ...props
    });
    $[12] = height;
    $[13] = props;
    $[14] = t5;
    $[15] = width;
    $[16] = t6;
  } else {
    t6 = $[16];
  }
  return t6;
};
PopoverContent.displayName = 'Popover.Content';
var Popover_default = Object.assign(Popover, {
  Content: PopoverContent
});
function _temp() {}

export { Popover_default as default };