@ariakit/react/cjs/__chunks/G2NDLMHV.cjs

Toolkit for building accessible web apps with React

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

var _AIFRJ53Zcjs = require('./AIFRJ53Z.cjs');


var _4Q5TABN7cjs = require('./4Q5TABN7.cjs');


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











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

// ../ariakit-react-components/dist/popover/popover-arrow-path.js
var POPOVER_ARROW_PATH = "M23 27.8C24.1 29 26.4 30 28 30H30H0H2C3.7 30 5.9 29 7 27.8L14 20.6C14.7 19.8 15.3 19.8 16 20.6L23 27.8Z";

// ../ariakit-react-components/dist/popover/popover-arrow.js
var _react = require('react');
var _jsxruntime = require('react/jsx-runtime');
var TagName = "div";
var defaultSize = 30;
var halfDefaultSize = defaultSize / 2;
var rotateMap = {
  top: `rotate(180 ${halfDefaultSize} ${halfDefaultSize})`,
  right: `rotate(-90 ${halfDefaultSize} ${halfDefaultSize})`,
  bottom: `rotate(0 ${halfDefaultSize} ${halfDefaultSize})`,
  left: `rotate(90 ${halfDefaultSize} ${halfDefaultSize})`
};
function useComputedStyle(store) {
  const [style, setStyle] = _react.useState.call(void 0, );
  const contentElement = _5FQZLBJ7cjs.useStoreState.call(void 0, store, "contentElement");
  _LZ6L3ECGcjs.useSafeLayoutEffect.call(void 0, () => {
    if (!contentElement) return;
    setStyle(_LZ6L3ECGcjs.getWindow.call(void 0, contentElement).getComputedStyle(contentElement));
  }, [contentElement]);
  return style;
}
function maskParentheses(text) {
  let masked = "";
  let depth = 0;
  for (const char of text) {
    if (char === "(") {
      depth += 1;
      masked += char;
      continue;
    }
    if (char === ")") {
      depth = Math.max(0, depth - 1);
      masked += char;
      continue;
    }
    masked += depth > 0 ? " " : char;
  }
  return masked;
}
var ringLengthsRegex = /(?:^|\s)0(?:px)?\s+0(?:px)?\s+0(?:px)?\s+((?:\d*\.)?\d+)px(?=\s|$)/;
function getRingFromSegment(segment, maskedSegment) {
  var _a;
  const match = maskedSegment.match(ringLengthsRegex);
  if (!match) return;
  const spread = match[1];
  if (!spread) return;
  const width = Number.parseFloat(spread);
  if (!width) return;
  const lengthsStart = (_a = match.index) != null ? _a : 0;
  const lengthsEnd = lengthsStart + match[0].length;
  return {
    width,
    color: `${segment.slice(0, lengthsStart)} ${segment.slice(lengthsEnd)}`.replace(/\binset\b/g, " ").trim() || void 0
  };
}
function getRing(style) {
  if (!style) return;
  const boxShadow = style.getPropertyValue("box-shadow");
  if (!boxShadow) return;
  if (boxShadow === "none") return;
  const masked = maskParentheses(boxShadow);
  let segmentStart = 0;
  for (let index = 0; index <= masked.length; index += 1) {
    if (index !== masked.length && masked[index] !== ",") continue;
    const ring = getRingFromSegment(boxShadow.slice(segmentStart, index), masked.slice(segmentStart, index));
    if (ring) return ring;
    segmentStart = index + 1;
  }
}
var usePopoverArrow = _LZ6L3ECGcjs.createHook.call(void 0, function usePopoverArrow2({ store, size = defaultSize, borderWidth: borderWidthProp, ...props }) {
  const context = _4Q5TABN7cjs.usePopoverContext.call(void 0, );
  store = store || context;
  _LZ6L3ECGcjs.invariant.call(void 0, store, process.env.NODE_ENV !== "production" && "PopoverArrow must be wrapped in a Popover component.");
  const dir = _5FQZLBJ7cjs.useStoreState.call(void 0, store, (state) => _AIFRJ53Zcjs.getBasePlacement.call(void 0, state.currentPlacement));
  const maskId = _LZ6L3ECGcjs.useId.call(void 0, );
  const style = useComputedStyle(store);
  const fill = (style == null ? void 0 : style.getPropertyValue("background-color")) || "none";
  const [borderWidth, isRing, ringColor] = _react.useMemo.call(void 0, () => {
    if (borderWidthProp != null) return [
      borderWidthProp,
      false,
      void 0
    ];
    if (!style) return [
      0,
      false,
      void 0
    ];
    const ring = getRing(style);
    if (ring) return [
      Math.ceil(ring.width),
      true,
      ring.color
    ];
    const borderWidth2 = style.getPropertyValue(`border-${dir}-width`);
    if (borderWidth2) {
      const parsed = Number.parseFloat(borderWidth2);
      if (!Number.isNaN(parsed)) return [
        Math.ceil(parsed),
        false,
        void 0
      ];
    }
    return [
      0,
      false,
      void 0
    ];
  }, [
    borderWidthProp,
    style,
    dir
  ]);
  const fallbackColor = isRing ? style == null ? void 0 : style.getPropertyValue("color") : style == null ? void 0 : style.getPropertyValue(`border-${dir}-color`);
  const stroke = ringColor || fallbackColor || "none";
  const strokeWidth = borderWidth * 2 * (defaultSize / size);
  const transform = rotateMap[dir];
  props = {
    children: _react.useMemo.call(void 0, () => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", {
      display: "block",
      viewBox: "0 0 30 30",
      children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "g", {
        transform,
        children: [
          !isRing && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", {
            fill: "none",
            stroke: fill,
            d: "M23 27.8C24.1 29 26.4 30 28 30H30H0H2C3.7 30 5.9 29 7 27.8L14 20.6C14.7 19.8 15.3 19.8 16 20.6L23 27.8Z",
            mask: `url(#${maskId})`
          }),
          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", {
            fill: "none",
            d: POPOVER_ARROW_PATH,
            mask: `url(#${maskId})`
          }),
          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", {
            stroke: "none",
            d: POPOVER_ARROW_PATH
          }),
          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "mask", {
            id: maskId,
            maskUnits: "userSpaceOnUse",
            children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "rect", {
              x: "-15",
              y: "0",
              width: "60",
              height: "30",
              fill: "white",
              stroke: "black"
            })
          })
        ]
      })
    }), [
      transform,
      isRing,
      fill,
      maskId
    ]),
    "aria-hidden": true,
    ...props,
    ref: _LZ6L3ECGcjs.useMergeRefs.call(void 0, store.setArrowElement, props.ref),
    style: {
      position: "absolute",
      fontSize: size,
      width: "1em",
      height: "1em",
      pointerEvents: "none",
      fill,
      stroke,
      strokeWidth,
      ...props.style
    }
  };
  return _LZ6L3ECGcjs.removeUndefinedValues.call(void 0, props);
});
var PopoverArrow = _LZ6L3ECGcjs.memo.call(void 0, _LZ6L3ECGcjs.forwardRef.call(void 0, function PopoverArrow2(props) {
  return _LZ6L3ECGcjs.createElement.call(void 0, TagName, usePopoverArrow(props));
}));




exports.usePopoverArrow = usePopoverArrow; exports.PopoverArrow = PopoverArrow;