@artsy/palette 45.13.1 → 45.14.0-canary.1497.33065.0

package/dist/esm/elements/Dropdown/Dropdown.js

@@ -0,0 +1,325 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+var _excluded = ["placement", "visible", "keepInDOM", "children", "offset", "dropdown", "dropdownZIndex", "openDropdownByClick", "transition", "flip", "returnFocus", "delay"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import styled from "styled-components";
+import { calculateMaxHeight, usePosition } from "../../utils";
+import { usePortal } from "../../utils/usePortal";
+import { Box } from "../Box";
+import { FocusOn } from "react-focus-on";
+import { themeGet } from "@styled-system/theme-get";
+import { debounce } from "es-toolkit";
+/**
+ * A `Dropdown` is a small modal-type element which is anchored, and can be
+ * positioned relative to, another element and designed to be transitioned in on hover or on click.
+ */
+export var Dropdown = function Dropdown(_ref) {
+  var _ref$placement = _ref.placement,
+    placement = _ref$placement === void 0 ? "bottom" : _ref$placement,
+    _ref$visible = _ref.visible,
+    _visible = _ref$visible === void 0 ? false : _ref$visible,
+    keepInDOM = _ref.keepInDOM,
+    children = _ref.children,
+    _ref$offset = _ref.offset,
+    offset = _ref$offset === void 0 ? 10 : _ref$offset,
+    dropdown = _ref.dropdown,
+    _ref$dropdownZIndex = _ref.dropdownZIndex,
+    dropdownZIndex = _ref$dropdownZIndex === void 0 ? 1 : _ref$dropdownZIndex,
+    openDropdownByClick = _ref.openDropdownByClick,
+    _ref$transition = _ref.transition,
+    _transition = _ref$transition === void 0 ? true : _ref$transition,
+    _ref$flip = _ref.flip,
+    flip = _ref$flip === void 0 ? true : _ref$flip,
+    _ref$returnFocus = _ref.returnFocus,
+    returnFocus = _ref$returnFocus === void 0 ? true : _ref$returnFocus,
+    _ref$delay = _ref.delay,
+    delay = _ref$delay === void 0 ? 0 : _ref$delay,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    visible = _useState2[0],
+    setVisible = _useState2[1];
+
+  // If prop updates/set initial visibility.
+  useEffect(function () {
+    setVisible(_visible);
+  }, [_visible]);
+  var timeoutRef = useRef(null);
+
+  // We need to keep the pointer state in sync with the visibility state, else we
+  // wind up with focus isolation out of sync.
+  var setVisibility = useCallback(function (_ref2) {
+    var visible = _ref2.visible,
+      _ref2$isPointer = _ref2.isPointer,
+      isPointer = _ref2$isPointer === void 0 ? false : _ref2$isPointer;
+    // Use custom delay when opening via pointer interaction (hover), but only if not using click mode
+    var defaultDelay = _transition ? visible ? 50 : 150 : visible ? 1 : 50;
+    var finalDelay = visible && isPointer && !openDropdownByClick ? delay : defaultDelay;
+    timeoutRef.current && clearTimeout(timeoutRef.current);
+    timeoutRef.current = setTimeout(function () {
+      if (!visible && activeRef.current) return;
+      pointerRef.current = isPointer;
+      setVisible(visible);
+    }, finalDelay);
+  }, [_transition, delay, openDropdownByClick]);
+  var onVisible = function onVisible() {
+    setVisibility({
+      visible: true
+    });
+  };
+  var onHide = useCallback(function () {
+    setVisibility({
+      visible: false
+    });
+  }, [setVisibility]);
+  var onToggleVisibility = function onToggleVisibility() {
+    if (visible) {
+      return onHide();
+    }
+    onVisible();
+  };
+  var _usePosition = usePosition({
+      position: placement,
+      offset: 0,
+      active: visible,
+      flip: flip,
+      padding: offset
+    }),
+    anchorRef = _usePosition.anchorRef,
+    panelRef = _usePosition.tooltipRef,
+    isFlipped = _usePosition.state.isFlipped;
+  useEffect(function () {
+    var handleKeyDown = function handleKeyDown(event) {
+      if (event.key === "Escape") {
+        onHide();
+      }
+    };
+
+    // Close dropdown when focus leaves element
+    var handleKeyUp = function handleKeyUp(event) {
+      if (!panelRef.current) return;
+      if (event.key === "Tab" && !(panelRef.current === document.activeElement || panelRef.current.contains(document.activeElement))) {
+        onHide();
+      }
+    };
+    var handleClick = function handleClick(event) {
+      if (!panelRef.current || !openDropdownByClick) return;
+      var target = event.target;
+      var tagName = target.tagName.toLowerCase();
+      var isClosableElement = tagName === "a";
+      var element = target;
+
+      // Find parent link element
+      if (!isClosableElement) {
+        element = target.closest("a");
+        isClosableElement = !!element;
+      }
+      if (isClosableElement && element && panelRef.current.contains(element)) {
+        onHide();
+      }
+    };
+    document.addEventListener("keydown", handleKeyDown);
+    document.addEventListener("keyup", handleKeyUp);
+    document.addEventListener("click", handleClick);
+    return function () {
+      document.removeEventListener("keydown", handleKeyDown);
+      document.removeEventListener("keyup", handleKeyUp);
+      document.removeEventListener("click", handleClick);
+    };
+  }, [panelRef, openDropdownByClick, onHide]);
+  var activeRef = useRef(false);
+  var handleMouseEnter = function handleMouseEnter() {
+    activeRef.current = true;
+  };
+  var handleMouseLeave = function handleMouseLeave() {
+    activeRef.current = false;
+    onHide();
+  };
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    transition = _useState4[0],
+    setTransition = _useState4[1];
+
+  // Wait for next tick so that animation runs
+  useEffect(function () {
+    requestAnimationFrame(function () {
+      setTransition(visible);
+    });
+  }, [visible]);
+  var translation = useMemo(function () {
+    switch (placement) {
+      case "top-start":
+      case "top":
+      case "top-end":
+        return "translateY(10px)";
+      case "bottom-start":
+      case "bottom":
+      case "bottom-end":
+        return "translateY(-10px)";
+      case "left-start":
+      case "left":
+      case "left-end":
+        return "translateX(10px)";
+      case "right-start":
+      case "right":
+      case "right-end":
+        return "translateX(-10px)";
+    }
+  }, [placement]);
+
+  // Fills offset gap between anchor and panel to prevent mouseout
+  var padding = useMemo(function () {
+    switch (placement) {
+      case "top-start":
+      case "top":
+      case "top-end":
+        return _defineProperty({}, isFlipped ? "pt" : "pb", offset);
+      case "bottom-start":
+      case "bottom":
+      case "bottom-end":
+        return _defineProperty({}, isFlipped ? "pb" : "pt", offset);
+      case "left-start":
+      case "left":
+      case "left-end":
+        return _defineProperty({}, isFlipped ? "pl" : "pr", offset);
+      case "right-start":
+      case "right":
+      case "right-end":
+        return _defineProperty({}, isFlipped ? "pr" : "pl", offset);
+    }
+  }, [placement, isFlipped, offset]);
+  var pointerRef = useRef(false);
+  var handlePointerVisible = function handlePointerVisible() {
+    setVisibility({
+      visible: true,
+      isPointer: true
+    });
+  };
+  var handlePointerHide = function handlePointerHide() {
+    setVisibility({
+      visible: false,
+      isPointer: false
+    });
+  };
+  var anchorProps = _objectSpread({
+    "aria-expanded": visible,
+    "aria-haspopup": true
+  }, openDropdownByClick ? {
+    onClick: onToggleVisibility
+  } : {
+    onMouseEnter: handlePointerVisible,
+    onMouseLeave: handlePointerHide,
+    onClick: onVisible
+  });
+  var _usePortal = usePortal(),
+    createPortal = _usePortal.createPortal;
+  var isPointer = !openDropdownByClick && pointerRef.current;
+  var focusEnabled = visible && !isPointer;
+  var _useState5 = useState(0),
+    _useState6 = _slicedToArray(_useState5, 2),
+    maxHeight = _useState6[0],
+    setMaxHeight = _useState6[1];
+  useEffect(function () {
+    var calculate = debounce(function () {
+      if (!anchorRef.current) return;
+      var nextMaxHeight = calculateMaxHeight({
+        anchorRect: anchorRef.current.getBoundingClientRect(),
+        position: placement,
+        offset: offset
+      });
+      setMaxHeight(nextMaxHeight);
+    }, 500);
+    window.addEventListener("resize", calculate, {
+      passive: true
+    });
+    window.addEventListener("scroll", calculate, {
+      passive: true
+    });
+    calculate();
+    return function () {
+      window.removeEventListener("resize", calculate);
+      window.removeEventListener("scroll", calculate);
+    };
+  }, [anchorRef, offset, placement, visible]);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, children === null || children === void 0 ? void 0 : children({
+    anchorRef: anchorRef,
+    anchorProps: anchorProps,
+    onVisible: onVisible,
+    onHide: onHide,
+    setVisible: setVisible,
+    visible: visible
+  }), (visible || keepInDOM) && createPortal( /*#__PURE__*/React.createElement(Container, _extends({
+    "aria-label": "Press escape to close",
+    tabIndex: 0,
+    ref: panelRef,
+    zIndex: dropdownZIndex,
+    display: "inline-block",
+    placement: placement,
+    style: _objectSpread({}, keepInDOM ? {
+      visibility: visible ? "visible" : "hidden"
+    } : {})
+  }, openDropdownByClick ? {} : {
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave
+  }, {
+    maxHeight: maxHeight + offset
+  }, padding, rest), /*#__PURE__*/React.createElement(Panel, {
+    transition: _transition,
+    maxHeight: maxHeight,
+    style: transition ?
+    // In
+    {
+      opacity: 1,
+      transform: "translate(0)"
+    } :
+    // Out
+    {
+      opacity: 0,
+      transform: translation
+    }
+  }, /*#__PURE__*/React.createElement(FocusOn, {
+    noIsolation: true,
+    enabled: focusEnabled,
+    onClickOutside: onHide,
+    returnFocus: returnFocus
+  }, /*#__PURE__*/React.createElement(Pane, {
+    maxHeight: maxHeight
+  }, typeof dropdown === "function" ? dropdown({
+    onVisible: onVisible,
+    onHide: onHide,
+    setVisible: setVisible,
+    visible: visible
+  }) : dropdown))))));
+};
+var Container = styled(Box).withConfig({
+  displayName: "Dropdown__Container",
+  componentId: "sc-je1xqj-0"
+})(["position:fixed;text-align:left;outline:0;"]);
+var Panel = styled(Box).withConfig({
+  displayName: "Dropdown__Panel",
+  componentId: "sc-je1xqj-1"
+})(["transition:", ";"], function (_ref7) {
+  var transition = _ref7.transition;
+  return transition ? "opacity 250ms ease-out, transform 250ms ease-out" : "none";
+});
+var Pane = styled(Box).withConfig({
+  displayName: "Dropdown__Pane",
+  componentId: "sc-je1xqj-2"
+})(["> div{max-height:", ";box-shadow:", ";background-color:", ";border:1px solid ", ";overflow-y:auto;}"], function (_ref8) {
+  var maxHeight = _ref8.maxHeight;
+  return maxHeight ? "".concat(maxHeight, "px") : "100vh";
+}, themeGet("effects.flatShadow"), themeGet("colors.mono0"), themeGet("colors.mono10"));
+//# sourceMappingURL=Dropdown.js.map

package/dist/esm/elements/Dropdown/Dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropdown.js","names":["React","useCallback","useEffect","useMemo","useRef","useState","styled","calculateMaxHeight","usePosition","usePortal","Box","FocusOn","themeGet","debounce","Dropdown","_ref","_ref$placement","placement","_ref$visible","visible","_visible","keepInDOM","children","_ref$offset","offset","dropdown","_ref$dropdownZIndex","dropdownZIndex","openDropdownByClick","_ref$transition","transition","_transition","_ref$flip","flip","_ref$returnFocus","returnFocus","_ref$delay","delay","rest","_objectWithoutProperties","_excluded","_useState","_useState2","_slicedToArray","setVisible","timeoutRef","setVisibility","_ref2","_ref2$isPointer","isPointer","defaultDelay","finalDelay","current","clearTimeout","setTimeout","activeRef","pointerRef","onVisible","onHide","onToggleVisibility","_usePosition","position","active","padding","anchorRef","panelRef","tooltipRef","isFlipped","state","handleKeyDown","event","key","handleKeyUp","document","activeElement","contains","handleClick","target","tagName","toLowerCase","isClosableElement","element","closest","addEventListener","removeEventListener","handleMouseEnter","handleMouseLeave","_useState3","_useState4","setTransition","requestAnimationFrame","translation","_defineProperty","handlePointerVisible","handlePointerHide","anchorProps","_objectSpread","onClick","onMouseEnter","onMouseLeave","_usePortal","createPortal","focusEnabled","_useState5","_useState6","maxHeight","setMaxHeight","calculate","nextMaxHeight","anchorRect","getBoundingClientRect","window","passive","createElement","Fragment","Container","_extends","tabIndex","ref","zIndex","display","style","visibility","Panel","opacity","transform","noIsolation","enabled","onClickOutside","Pane","withConfig","displayName","componentId","_ref7","_ref8","concat"],"sources":["../../../../src/elements/Dropdown/Dropdown.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useRef, useState } from \"react\"\nimport styled from \"styled-components\"\nimport { calculateMaxHeight, Position, usePosition } from \"../../utils\"\nimport { usePortal } from \"../../utils/usePortal\"\nimport { Box, BoxProps } from \"../Box\"\nimport { FocusOn } from \"react-focus-on\"\nimport { themeGet } from \"@styled-system/theme-get\"\nimport { debounce } from \"es-toolkit\"\n\nexport interface DropdownActions {\n  /** Call to show dropdown */\n  onVisible(): void\n  /** Call to hide dropdown */\n  onHide(): void\n  /** Manipulate visible directly */\n  setVisible(value: boolean): void\n  /** Pass ref to element you want the dropdown to be anchored to */\n  anchorRef: React.MutableRefObject<HTMLElement>\n  /** Spread props on element you want the dropdown to be anchored to */\n  anchorProps: React.HTMLAttributes<HTMLElement>\n  /** Whether or not the dropdown is visible */\n  visible: boolean\n}\n\ntype Children =\n  | React.ReactNode\n  | ((dropdownActions: DropdownActions) => React.ReactNode)\n\nexport interface DropdownProps extends Omit<BoxProps, \"children\"> {\n  placement?: Position\n  /** Intially visible by default? */\n  visible?: boolean\n  /** Whether or not we should animate the dropdown transition */\n  transition?: boolean\n  dropdown:\n    | React.ReactNode\n    | ((\n        dropdownActions: Pick<\n          DropdownActions,\n          \"onHide\" | \"onVisible\" | \"setVisible\" | \"visible\"\n        >\n      ) => void)\n  /** Custom zIndex to assign to the dropdown panel */\n  dropdownZIndex?: number\n  /** Distance in pixels from anchor */\n  offset?: number\n  /** Should the dropdown panel always be present in the DOM (vs removed when invisible) */\n  keepInDOM?: boolean\n  openDropdownByClick?: boolean\n  children: Children\n  /** Optionally disable flipping (default: `true`) */\n  flip?: boolean\n  /** Whether to return focus to the previous element when the dropdown closes (default: `true`) */\n  returnFocus?: boolean\n  /** Delay in milliseconds before showing the dropdown on hover (ignored when openDropdownByClick is true) */\n  delay?: number\n}\n\n/**\n * A `Dropdown` is a small modal-type element which is anchored, and can be\n * positioned relative to, another element and designed to be transitioned in on hover or on click.\n */\nexport const Dropdown = ({\n  placement = \"bottom\",\n  visible: _visible = false,\n  keepInDOM,\n  children,\n  offset = 10,\n  dropdown,\n  dropdownZIndex = 1,\n  openDropdownByClick,\n  transition: _transition = true,\n  flip = true,\n  returnFocus = true,\n  delay = 0,\n  ...rest\n}: DropdownProps) => {\n  const [visible, setVisible] = useState(false)\n\n  // If prop updates/set initial visibility.\n  useEffect(() => {\n    setVisible(_visible)\n  }, [_visible])\n\n  const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null)\n\n  // We need to keep the pointer state in sync with the visibility state, else we\n  // wind up with focus isolation out of sync.\n  const setVisibility = useCallback(\n    ({\n      visible,\n      isPointer = false,\n    }: {\n      visible: boolean\n      isPointer?: boolean\n    }) => {\n      // Use custom delay when opening via pointer interaction (hover), but only if not using click mode\n      const defaultDelay = _transition ? (visible ? 50 : 150) : visible ? 1 : 50\n      const finalDelay =\n        visible && isPointer && !openDropdownByClick ? delay : defaultDelay\n\n      timeoutRef.current && clearTimeout(timeoutRef.current)\n      timeoutRef.current = setTimeout(() => {\n        if (!visible && activeRef.current) return\n        pointerRef.current = isPointer\n        setVisible(visible)\n      }, finalDelay)\n    },\n    [_transition, delay, openDropdownByClick]\n  )\n\n  const onVisible = () => {\n    setVisibility({ visible: true })\n  }\n\n  const onHide = useCallback(() => {\n    setVisibility({ visible: false })\n  }, [setVisibility])\n\n  const onToggleVisibility = () => {\n    if (visible) {\n      return onHide()\n    }\n\n    onVisible()\n  }\n\n  const {\n    anchorRef,\n    tooltipRef: panelRef,\n    state: { isFlipped },\n  } = usePosition({\n    position: placement,\n    offset: 0,\n    active: visible,\n    flip,\n    padding: offset,\n  })\n\n  useEffect(() => {\n    const handleKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        onHide()\n      }\n    }\n\n    // Close dropdown when focus leaves element\n    const handleKeyUp = (event: KeyboardEvent) => {\n      if (!panelRef.current) return\n\n      if (\n        event.key === \"Tab\" &&\n        !(\n          panelRef.current === document.activeElement ||\n          panelRef.current.contains(document.activeElement)\n        )\n      ) {\n        onHide()\n      }\n    }\n\n    const handleClick = (event: MouseEvent) => {\n      if (!panelRef.current || !openDropdownByClick) return\n      const target = event.target as Element\n      const tagName = target.tagName.toLowerCase()\n      let isClosableElement = tagName === \"a\"\n      let element: Element | null = target\n\n      // Find parent link element\n      if (!isClosableElement) {\n        element = target.closest(\"a\")\n        isClosableElement = !!element\n      }\n\n      if (isClosableElement && element && panelRef.current.contains(element)) {\n        onHide()\n      }\n    }\n\n    document.addEventListener(\"keydown\", handleKeyDown)\n    document.addEventListener(\"keyup\", handleKeyUp)\n    document.addEventListener(\"click\", handleClick)\n\n    return () => {\n      document.removeEventListener(\"keydown\", handleKeyDown)\n      document.removeEventListener(\"keyup\", handleKeyUp)\n      document.removeEventListener(\"click\", handleClick)\n    }\n  }, [panelRef, openDropdownByClick, onHide])\n\n  const activeRef = useRef(false)\n\n  const handleMouseEnter = () => {\n    activeRef.current = true\n  }\n\n  const handleMouseLeave = () => {\n    activeRef.current = false\n    onHide()\n  }\n\n  const [transition, setTransition] = useState(false)\n\n  // Wait for next tick so that animation runs\n  useEffect(() => {\n    requestAnimationFrame(() => {\n      setTransition(visible)\n    })\n  }, [visible])\n\n  const translation = useMemo(() => {\n    switch (placement) {\n      case \"top-start\":\n      case \"top\":\n      case \"top-end\":\n        return `translateY(10px)`\n      case \"bottom-start\":\n      case \"bottom\":\n      case \"bottom-end\":\n        return `translateY(-10px)`\n      case \"left-start\":\n      case \"left\":\n      case \"left-end\":\n        return `translateX(10px)`\n      case \"right-start\":\n      case \"right\":\n      case \"right-end\":\n        return `translateX(-10px)`\n    }\n  }, [placement])\n\n  // Fills offset gap between anchor and panel to prevent mouseout\n  const padding = useMemo(() => {\n    switch (placement) {\n      case \"top-start\":\n      case \"top\":\n      case \"top-end\":\n        return { [isFlipped ? \"pt\" : \"pb\"]: offset }\n      case \"bottom-start\":\n      case \"bottom\":\n      case \"bottom-end\":\n        return { [isFlipped ? \"pb\" : \"pt\"]: offset }\n      case \"left-start\":\n      case \"left\":\n      case \"left-end\":\n        return { [isFlipped ? \"pl\" : \"pr\"]: offset }\n      case \"right-start\":\n      case \"right\":\n      case \"right-end\":\n        return { [isFlipped ? \"pr\" : \"pl\"]: offset }\n    }\n  }, [placement, isFlipped, offset])\n\n  const pointerRef = useRef(false)\n\n  const handlePointerVisible = () => {\n    setVisibility({ visible: true, isPointer: true })\n  }\n\n  const handlePointerHide = () => {\n    setVisibility({ visible: false, isPointer: false })\n  }\n\n  const anchorProps: React.HTMLAttributes<HTMLElement> = {\n    \"aria-expanded\": visible,\n    \"aria-haspopup\": true,\n    ...(openDropdownByClick\n      ? {\n          onClick: onToggleVisibility,\n        }\n      : {\n          onMouseEnter: handlePointerVisible,\n          onMouseLeave: handlePointerHide,\n          onClick: onVisible,\n        }),\n  }\n\n  const { createPortal } = usePortal()\n\n  const isPointer = !openDropdownByClick && pointerRef.current\n  const focusEnabled = visible && !isPointer\n\n  const [maxHeight, setMaxHeight] = useState(0)\n\n  useEffect(() => {\n    const calculate = debounce(() => {\n      if (!anchorRef.current) return\n\n      const nextMaxHeight = calculateMaxHeight({\n        anchorRect: anchorRef.current.getBoundingClientRect(),\n        position: placement,\n        offset,\n      })\n\n      setMaxHeight(nextMaxHeight)\n    }, 500)\n\n    window.addEventListener(\"resize\", calculate, { passive: true })\n    window.addEventListener(\"scroll\", calculate, { passive: true })\n    calculate()\n\n    return () => {\n      window.removeEventListener(\"resize\", calculate)\n      window.removeEventListener(\"scroll\", calculate)\n    }\n  }, [anchorRef, offset, placement, visible])\n\n  return (\n    <>\n      {(children as any)?.({\n        anchorRef: anchorRef as any,\n        anchorProps,\n        onVisible,\n        onHide,\n        setVisible,\n        visible,\n      })}\n\n      {(visible || keepInDOM) &&\n        createPortal(\n          <Container\n            aria-label=\"Press escape to close\"\n            tabIndex={0}\n            ref={panelRef as any}\n            zIndex={dropdownZIndex}\n            display=\"inline-block\"\n            placement={placement}\n            style={{\n              ...(keepInDOM\n                ? { visibility: visible ? \"visible\" : \"hidden\" }\n                : {}),\n            }}\n            {...(openDropdownByClick\n              ? {}\n              : {\n                  onMouseEnter: handleMouseEnter,\n                  onMouseLeave: handleMouseLeave,\n                })}\n            maxHeight={maxHeight + offset}\n            {...padding}\n            {...rest}\n          >\n            <Panel\n              transition={_transition}\n              maxHeight={maxHeight}\n              style={\n                transition\n                  ? // In\n                    { opacity: 1, transform: \"translate(0)\" }\n                  : // Out\n                    {\n                      opacity: 0,\n                      transform: translation,\n                    }\n              }\n            >\n              <FocusOn\n                noIsolation\n                enabled={focusEnabled}\n                onClickOutside={onHide}\n                returnFocus={returnFocus}\n              >\n                <Pane maxHeight={maxHeight}>\n                  {typeof dropdown === \"function\"\n                    ? (dropdown as any)({\n                        onVisible,\n                        onHide,\n                        setVisible,\n                        visible,\n                      })\n                    : dropdown}\n                </Pane>\n              </FocusOn>\n            </Panel>\n          </Container>\n        )}\n    </>\n  )\n}\n\nconst Container = styled(Box)<{ placement: Position } & BoxProps>`\n  position: fixed;\n  text-align: left;\n  outline: 0;\n`\n\nconst Panel = styled(Box)<{ transition: boolean; maxHeight: number }>`\n  transition: ${({ transition }) =>\n    transition ? \"opacity 250ms ease-out, transform 250ms ease-out\" : \"none\"};\n`\n\nconst Pane = styled(Box)`\n  > div {\n    max-height: ${({ maxHeight }) => (maxHeight ? `${maxHeight}px` : \"100vh\")};\n    box-shadow: ${themeGet(\"effects.flatShadow\")};\n    background-color: ${themeGet(\"colors.mono0\")};\n    border: 1px solid ${themeGet(\"colors.mono10\")};\n    overflow-y: auto;\n  }\n`\n"],"mappings":"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"}