@artsy/palette 45.1.0 → 45.3.0

package/dist/elements/Popover/Popover.d.ts

@@ -35,6 +35,8 @@ export interface PopoverProps extends BoxProps {
     /** Display triangular pointer back to anchor node */
     pointer?: boolean;
     popover: ((actions: Omit<PopoverActions, "anchorRef">) => JSX.Element) | React.ReactNode;
+    /** Show the close icon button */
+    showCloseButton?: boolean;
     variant?: PopoverVariant;
     /** Initial default visibility */
     visible?: boolean;
@@ -43,4 +45,4 @@ export interface PopoverProps extends BoxProps {
  * A `Popover` is a small modal-type element which is anchored, and can be
  * positioned relative to, another element.
  */
-export declare const Popover: ({ children, ignoreClickOutside, manageFocus, offset, onClose, onDismiss, placement, pointer, popover, variant, visible: _visible, zIndex, ...rest }: PopoverProps) => React.JSX.Element;
+export declare const Popover: ({ children, ignoreClickOutside, manageFocus, offset, onClose, onDismiss, placement, pointer, popover, showCloseButton, variant, visible: _visible, zIndex, ...rest }: PopoverProps) => React.JSX.Element;

package/dist/elements/Popover/Popover.js

@@ -15,7 +15,7 @@ var _Box = require("../Box");
 var _Clickable = require("../Clickable");
 var _Pointer = require("../Pointer");
 var _themeGet = require("@styled-system/theme-get");
-var _excluded = ["children", "ignoreClickOutside", "manageFocus", "offset", "onClose", "onDismiss", "placement", "pointer", "popover", "variant", "visible", "zIndex"];
+var _excluded = ["children", "ignoreClickOutside", "manageFocus", "offset", "onClose", "onDismiss", "placement", "pointer", "popover", "showCloseButton", "variant", "visible", "zIndex"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -57,6 +57,8 @@ var Popover = exports.Popover = function Popover(_ref) {
     _ref$pointer = _ref.pointer,
     pointer = _ref$pointer === void 0 ? false : _ref$pointer,
     popover = _ref.popover,
+    _ref$showCloseButton = _ref.showCloseButton,
+    showCloseButton = _ref$showCloseButton === void 0 ? true : _ref$showCloseButton,
     _ref$variant = _ref.variant,
     variant = _ref$variant === void 0 ? "defaultLight" : _ref$variant,
     _ref$visible = _ref.visible,
@@ -143,7 +145,7 @@ var Popover = exports.Popover = function Popover(_ref) {
     variant: variant,
     placement: placement,
     isFlipped: isFlipped
-  }), /*#__PURE__*/_react.default.createElement(Close, {
+  }), showCloseButton && /*#__PURE__*/_react.default.createElement(Close, {
     position: "relative",
     zIndex: 2,
     p: 1,

package/dist/elements/Popover/Popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"Popover.js","names":["_react","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_styledSystem","_CloseIcon","_utils","_useUpdateEffect","_Box","_Clickable","_Pointer","_themeGet","_excluded","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","_typeof","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","_slicedToArray","arr","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","POPOVER_VARIANTS","exports","defaultLight","backgroundColor","color","defaultDark","Popover","_ref","children","_ref$ignoreClickOutsi","ignoreClickOutside","_ref$manageFocus","manageFocus","_ref$offset","offset","onClose","onDismiss","_ref$placement","placement","_ref$pointer","pointer","popover","_ref$variant","variant","_ref$visible","visible","_visible","_ref$zIndex","zIndex","rest","_useState","useState","_useState2","setVisible","useEffect","useUpdateEffect","tooltipRef","current","focus","anchorRef","onVisible","useCallback","onHide","handleHide","handleDismiss","handleKeydown","event","document","addEventListener","removeEventListener","_usePosition","usePosition","position","active","isFlipped","state","useClickOutside","ref","onClickOutside","when","type","_usePortal","usePortal","createPortal","createElement","Fragment","Tip","tabIndex","display","Pointer","Close","p","onClick","fill","Panel","styled","Box","withConfig","displayName","componentId","themeGet","variants","Clickable"],"sources":["../../../src/elements/Popover/Popover.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from \"react\"\nimport styled from \"styled-components\"\nimport { variant } from \"styled-system\"\nimport CloseIcon from \"@artsy/icons/CloseIcon\"\nimport { Position, useClickOutside, usePortal, usePosition } from \"../../utils\"\nimport { useUpdateEffect } from \"../../utils/useUpdateEffect\"\nimport { Box, BoxProps } from \"../Box\"\nimport { Clickable } from \"../Clickable\"\nimport { Pointer } from \"../Pointer\"\nimport { themeGet } from \"@styled-system/theme-get\"\n\nexport const POPOVER_VARIANTS = {\n  defaultLight: {\n    backgroundColor: \"mono0\",\n    color: \"mono100\",\n  },\n  defaultDark: {\n    backgroundColor: \"mono100\",\n    color: \"mono0\",\n  },\n}\n\nexport type PopoverVariant = keyof typeof POPOVER_VARIANTS\n\nexport interface PopoverActions {\n  /** Call to show popover */\n  onVisible(): void\n  /** Call to hide popover */\n  onHide(): void\n  /** Call to dismiss popover */\n  onDismiss(): void\n  /** Pass ref to element you want the popover to be anchored to */\n  anchorRef: React.MutableRefObject<HTMLElement>\n}\n\nexport interface PopoverProps extends BoxProps {\n  children: (actions: PopoverActions) => JSX.Element\n  ignoreClickOutside?: boolean\n  manageFocus?: boolean\n  offset?: number\n  /** Called whenever the Popver is closed (both explcitly dismissed and through click outside) */\n  onClose?: () => void\n  /** Called whenever the Popover is dismissed (explicitly) */\n  onDismiss?: () => void\n  placement?: Position\n  /** Display triangular pointer back to anchor node */\n  pointer?: boolean\n  popover:\n    | ((actions: Omit<PopoverActions, \"anchorRef\">) => JSX.Element)\n    | React.ReactNode\n  variant?: PopoverVariant\n  /** Initial default visibility */\n  visible?: boolean\n}\n\n/**\n * A `Popover` is a small modal-type element which is anchored, and can be\n * positioned relative to, another element.\n */\nexport const Popover = ({\n  children,\n  ignoreClickOutside = false,\n  manageFocus = true,\n  offset = 10,\n  onClose,\n  onDismiss,\n  placement = \"top\",\n  pointer = false,\n  popover,\n  variant = \"defaultLight\",\n  visible: _visible = false,\n  zIndex = 1,\n  ...rest\n}: PopoverProps) => {\n  const [visible, setVisible] = useState(false)\n\n  // If prop updates/set initial visibility.\n  useEffect(() => {\n    setVisible(_visible)\n  }, [_visible])\n\n  // Yields focus back and forth between popover and anchor\n  useUpdateEffect(() => {\n    if (!manageFocus) return\n\n    if (visible && tooltipRef.current) {\n      tooltipRef.current.focus()\n      return\n    }\n\n    if (!anchorRef.current) return\n    anchorRef.current.focus()\n  }, [visible])\n\n  const onVisible = useCallback(() => {\n    setVisible(true)\n  }, [])\n\n  const onHide = useCallback(() => {\n    setVisible(false)\n  }, [])\n\n  const handleHide = useCallback(() => {\n    onHide()\n    onClose?.()\n  }, [onHide, onClose])\n\n  const handleDismiss = useCallback(() => {\n    handleHide()\n    onDismiss?.()\n  }, [handleHide, onDismiss])\n\n  useEffect(() => {\n    const handleKeydown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        handleHide()\n      }\n    }\n\n    document.addEventListener(\"keydown\", handleKeydown)\n\n    return () => {\n      document.removeEventListener(\"keydown\", handleKeydown)\n    }\n  }, [handleHide])\n\n  const {\n    anchorRef,\n    tooltipRef,\n    state: { isFlipped },\n  } = usePosition({\n    position: placement,\n    offset,\n    active: visible,\n  })\n\n  useClickOutside({\n    ref: tooltipRef,\n    onClickOutside: handleHide,\n    when: visible && !ignoreClickOutside,\n    type: \"click\",\n  })\n\n  const { createPortal } = usePortal()\n\n  return (\n    <>\n      {children({\n        anchorRef: anchorRef as any,\n        onVisible,\n        onHide: handleHide,\n        onDismiss: handleDismiss,\n      })}\n\n      {visible &&\n        createPortal(\n          <Tip\n            tabIndex={0}\n            ref={tooltipRef as any}\n            zIndex={zIndex}\n            display=\"inline-block\"\n            position=\"relative\"\n            variant={variant}\n          >\n            {pointer && (\n              <Pointer\n                anchorRef={anchorRef}\n                tooltipRef={tooltipRef}\n                variant={variant}\n                placement={placement}\n                isFlipped={isFlipped}\n              />\n            )}\n\n            <Close\n              position=\"relative\"\n              zIndex={2}\n              p={1}\n              onClick={handleDismiss}\n              aria-label=\"Close\"\n            >\n              <CloseIcon fill=\"currentColor\" display=\"block\" />\n            </Close>\n\n            <Panel\n              variant={variant}\n              position=\"relative\"\n              p={1}\n              zIndex={1}\n              {...rest}\n            >\n              {typeof popover === \"function\"\n                ? popover({\n                    onVisible,\n                    onHide: handleHide,\n                    onDismiss: handleDismiss,\n                  })\n                : popover}\n            </Panel>\n          </Tip>\n        )}\n    </>\n  )\n}\n\nconst Tip = styled(Box)<{ variant?: PopoverVariant }>`\n  position: fixed;\n  text-align: left;\n  transition: opacity 250ms ease-out;\n  box-shadow: ${themeGet(\"effects.dropShadow\")};\n  ${variant({ variants: POPOVER_VARIANTS })}\n`\n\nconst Panel = styled(Box)<{ variant?: PopoverVariant }>`\n  ${variant({ variants: POPOVER_VARIANTS })}\n`\n\nconst Close = styled(Clickable)`\n  float: right;\n`\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,aAAA,GAAAH,OAAA;AACA,IAAAI,UAAA,GAAAF,sBAAA,CAAAF,OAAA;AACA,IAAAK,MAAA,GAAAL,OAAA;AACA,IAAAM,gBAAA,GAAAN,OAAA;AACA,IAAAO,IAAA,GAAAP,OAAA;AACA,IAAAQ,UAAA,GAAAR,OAAA;AACA,IAAAS,QAAA,GAAAT,OAAA;AACA,IAAAU,SAAA,GAAAV,OAAA;AAAmD,IAAAW,SAAA;AAAA,SAAAT,uBAAAU,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,yBAAAC,WAAA,eAAAC,OAAA,kCAAAC,iBAAA,OAAAD,OAAA,QAAAE,gBAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,yBAAAC,WAAA,WAAAA,WAAA,GAAAG,gBAAA,GAAAD,iBAAA,KAAAF,WAAA;AAAA,SAAAjB,wBAAAa,GAAA,EAAAI,WAAA,SAAAA,WAAA,IAAAJ,GAAA,IAAAA,GAAA,CAAAC,UAAA,WAAAD,GAAA,QAAAA,GAAA,aAAAQ,OAAA,CAAAR,GAAA,yBAAAA,GAAA,4BAAAE,OAAA,EAAAF,GAAA,UAAAS,KAAA,GAAAN,wBAAA,CAAAC,WAAA,OAAAK,KAAA,IAAAA,KAAA,CAAAC,GAAA,CAAAV,GAAA,YAAAS,KAAA,CAAAE,GAAA,CAAAX,GAAA,SAAAY,MAAA,WAAAC,qBAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,GAAA,IAAAjB,GAAA,QAAAiB,GAAA,kBAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAApB,GAAA,EAAAiB,GAAA,SAAAI,IAAA,GAAAR,qBAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAhB,GAAA,EAAAiB,GAAA,cAAAI,IAAA,KAAAA,IAAA,CAAAV,GAAA,IAAAU,IAAA,CAAAC,GAAA,KAAAR,MAAA,CAAAC,cAAA,CAAAH,MAAA,EAAAK,GAAA,EAAAI,IAAA,YAAAT,MAAA,CAAAK,GAAA,IAAAjB,GAAA,CAAAiB,GAAA,SAAAL,MAAA,CAAAV,OAAA,GAAAF,GAAA,MAAAS,KAAA,IAAAA,KAAA,CAAAa,GAAA,CAAAtB,GAAA,EAAAY,MAAA,YAAAA,MAAA;AAAA,SAAAW,SAAA,IAAAA,QAAA,GAAAT,MAAA,CAAAU,MAAA,GAAAV,MAAA,CAAAU,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAV,GAAA,IAAAa,MAAA,QAAAhB,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAU,MAAA,EAAAb,GAAA,KAAAS,MAAA,CAAAT,GAAA,IAAAa,MAAA,CAAAb,GAAA,gBAAAS,MAAA,YAAAH,QAAA,CAAAQ,KAAA,OAAAH,SAAA;AAAA,SAAAI,eAAAC,GAAA,EAAAN,CAAA,WAAAO,eAAA,CAAAD,GAAA,KAAAE,qBAAA,CAAAF,GAAA,EAAAN,CAAA,KAAAS,2BAAA,CAAAH,GAAA,EAAAN,CAAA,KAAAU,gBAAA;AAAA,SAAAA,iBAAA,cAAAC,SAAA;AAAA,SAAAF,4BAAAG,CAAA,EAAAC,MAAA,SAAAD,CAAA,qBAAAA,CAAA,sBAAAE,iBAAA,CAAAF,CAAA,EAAAC,MAAA,OAAAE,CAAA,GAAA5B,MAAA,CAAAI,SAAA,CAAAyB,QAAA,CAAAvB,IAAA,CAAAmB,CAAA,EAAAK,KAAA,aAAAF,CAAA,iBAAAH,CAAA,CAAAM,WAAA,EAAAH,CAAA,GAAAH,CAAA,CAAAM,WAAA,CAAAC,IAAA,MAAAJ,CAAA,cAAAA,CAAA,mBAAAK,KAAA,CAAAC,IAAA,CAAAT,CAAA,OAAAG,CAAA,+DAAAO,IAAA,CAAAP,CAAA,UAAAD,iBAAA,CAAAF,CAAA,EAAAC,MAAA;AAAA,SAAAC,kBAAAR,GAAA,EAAAiB,GAAA,QAAAA,GAAA,YAAAA,GAAA,GAAAjB,GAAA,CAAAJ,MAAA,EAAAqB,GAAA,GAAAjB,GAAA,CAAAJ,MAAA,WAAAF,CAAA,MAAAwB,IAAA,OAAAJ,KAAA,CAAAG,GAAA,GAAAvB,CAAA,GAAAuB,GAAA,EAAAvB,CAAA,IAAAwB,IAAA,CAAAxB,CAAA,IAAAM,GAAA,CAAAN,CAAA,UAAAwB,IAAA;AAAA,SAAAhB,sBAAAF,GAAA,EAAAN,CAAA,QAAAyB,EAAA,WAAAnB,GAAA,gCAAAoB,MAAA,IAAApB,GAAA,CAAAoB,MAAA,CAAAC,QAAA,KAAArB,GAAA,4BAAAmB,EAAA,QAAAG,EAAA,EAAAC,EAAA,EAAAC,EAAA,EAAAC,EAAA,EAAAC,IAAA,OAAAC,EAAA,OAAAC,EAAA,iBAAAJ,EAAA,IAAAL,EAAA,GAAAA,EAAA,CAAAhC,IAAA,CAAAa,GAAA,GAAA6B,IAAA,QAAAnC,CAAA,QAAAb,MAAA,CAAAsC,EAAA,MAAAA,EAAA,UAAAQ,EAAA,uBAAAA,EAAA,IAAAL,EAAA,GAAAE,EAAA,CAAArC,IAAA,CAAAgC,EAAA,GAAAW,IAAA,MAAAJ,IAAA,CAAAK,IAAA,CAAAT,EAAA,CAAAU,KAAA,GAAAN,IAAA,CAAA9B,MAAA,KAAAF,CAAA,GAAAiC,EAAA,iBAAAM,GAAA,IAAAL,EAAA,OAAAL,EAAA,GAAAU,GAAA,yBAAAN,EAAA,YAAAR,EAAA,CAAAe,MAAA,KAAAT,EAAA,GAAAN,EAAA,CAAAe,MAAA,IAAArD,MAAA,CAAA4C,EAAA,MAAAA,EAAA,2BAAAG,EAAA,QAAAL,EAAA,aAAAG,IAAA;AAAA,SAAAzB,gBAAAD,GAAA,QAAAc,KAAA,CAAAqB,OAAA,CAAAnC,GAAA,UAAAA,GAAA;AAAA,SAAAoC,yBAAAvC,MAAA,EAAAwC,QAAA,QAAAxC,MAAA,yBAAAJ,MAAA,GAAA6C,6BAAA,CAAAzC,MAAA,EAAAwC,QAAA,OAAArD,GAAA,EAAAU,CAAA,MAAAb,MAAA,CAAA0D,qBAAA,QAAAC,gBAAA,GAAA3D,MAAA,CAAA0D,qBAAA,CAAA1C,MAAA,QAAAH,CAAA,MAAAA,CAAA,GAAA8C,gBAAA,CAAA5C,MAAA,EAAAF,CAAA,MAAAV,GAAA,GAAAwD,gBAAA,CAAA9C,CAAA,OAAA2C,QAAA,CAAAI,OAAA,CAAAzD,GAAA,uBAAAH,MAAA,CAAAI,SAAA,CAAAyD,oBAAA,CAAAvD,IAAA,CAAAU,MAAA,EAAAb,GAAA,aAAAS,MAAA,CAAAT,GAAA,IAAAa,MAAA,CAAAb,GAAA,cAAAS,MAAA;AAAA,SAAA6C,8BAAAzC,MAAA,EAAAwC,QAAA,QAAAxC,MAAA,yBAAAJ,MAAA,WAAAkD,UAAA,GAAA9D,MAAA,CAAA+D,IAAA,CAAA/C,MAAA,OAAAb,GAAA,EAAAU,CAAA,OAAAA,CAAA,MAAAA,CAAA,GAAAiD,UAAA,CAAA/C,MAAA,EAAAF,CAAA,MAAAV,GAAA,GAAA2D,UAAA,CAAAjD,CAAA,OAAA2C,QAAA,CAAAI,OAAA,CAAAzD,GAAA,kBAAAS,MAAA,CAAAT,GAAA,IAAAa,MAAA,CAAAb,GAAA,YAAAS,MAAA;AAE5C,IAAMoD,gBAAgB,GAAAC,OAAA,CAAAD,gBAAA,GAAG;EAC9BE,YAAY,EAAE;IACZC,eAAe,EAAE,OAAO;IACxBC,KAAK,EAAE;EACT,CAAC;EACDC,WAAW,EAAE;IACXF,eAAe,EAAE,SAAS;IAC1BC,KAAK,EAAE;EACT;AACF,CAAC;AAmCD;AACA;AACA;AACA;AACO,IAAME,OAAO,GAAAL,OAAA,CAAAK,OAAA,GAAG,SAAVA,OAAOA,CAAAC,IAAA,EAcA;EAAA,IAblBC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAAC,qBAAA,GAAAF,IAAA,CACRG,kBAAkB;IAAlBA,kBAAkB,GAAAD,qBAAA,cAAG,KAAK,GAAAA,qBAAA;IAAAE,gBAAA,GAAAJ,IAAA,CAC1BK,WAAW;IAAXA,WAAW,GAAAD,gBAAA,cAAG,IAAI,GAAAA,gBAAA;IAAAE,WAAA,GAAAN,IAAA,CAClBO,MAAM;IAANA,MAAM,GAAAD,WAAA,cAAG,EAAE,GAAAA,WAAA;IACXE,OAAO,GAAAR,IAAA,CAAPQ,OAAO;IACPC,SAAS,GAAAT,IAAA,CAATS,SAAS;IAAAC,cAAA,GAAAV,IAAA,CACTW,SAAS;IAATA,SAAS,GAAAD,cAAA,cAAG,KAAK,GAAAA,cAAA;IAAAE,YAAA,GAAAZ,IAAA,CACjBa,OAAO;IAAPA,OAAO,GAAAD,YAAA,cAAG,KAAK,GAAAA,YAAA;IACfE,OAAO,GAAAd,IAAA,CAAPc,OAAO;IAAAC,YAAA,GAAAf,IAAA,CACPgB,OAAO;IAAPA,OAAO,GAAAD,YAAA,cAAG,cAAc,GAAAA,YAAA;IAAAE,YAAA,GAAAjB,IAAA,CACxBkB,OAAO;IAAEC,QAAQ,GAAAF,YAAA,cAAG,KAAK,GAAAA,YAAA;IAAAG,WAAA,GAAApB,IAAA,CACzBqB,MAAM;IAANA,MAAM,GAAAD,WAAA,cAAG,CAAC,GAAAA,WAAA;IACPE,IAAI,GAAAtC,wBAAA,CAAAgB,IAAA,EAAAtF,SAAA;EAEP,IAAA6G,SAAA,GAA8B,IAAAC,eAAQ,EAAC,KAAK,CAAC;IAAAC,UAAA,GAAA9E,cAAA,CAAA4E,SAAA;IAAtCL,OAAO,GAAAO,UAAA;IAAEC,UAAU,GAAAD,UAAA;;EAE1B;EACA,IAAAE,gBAAS,EAAC,YAAM;IACdD,UAAU,CAACP,QAAQ,CAAC;EACtB,CAAC,EAAE,CAACA,QAAQ,CAAC,CAAC;;EAEd;EACA,IAAAS,gCAAe,EAAC,YAAM;IACpB,IAAI,CAACvB,WAAW,EAAE;IAElB,IAAIa,OAAO,IAAIW,UAAU,CAACC,OAAO,EAAE;MACjCD,UAAU,CAACC,OAAO,CAACC,KAAK,EAAE;MAC1B;IACF;IAEA,IAAI,CAACC,SAAS,CAACF,OAAO,EAAE;IACxBE,SAAS,CAACF,OAAO,CAACC,KAAK,EAAE;EAC3B,CAAC,EAAE,CAACb,OAAO,CAAC,CAAC;EAEb,IAAMe,SAAS,GAAG,IAAAC,kBAAW,EAAC,YAAM;IAClCR,UAAU,CAAC,IAAI,CAAC;EAClB,CAAC,EAAE,EAAE,CAAC;EAEN,IAAMS,MAAM,GAAG,IAAAD,kBAAW,EAAC,YAAM;IAC/BR,UAAU,CAAC,KAAK,CAAC;EACnB,CAAC,EAAE,EAAE,CAAC;EAEN,IAAMU,UAAU,GAAG,IAAAF,kBAAW,EAAC,YAAM;IACnCC,MAAM,EAAE;IACR3B,OAAO,aAAPA,OAAO,uBAAPA,OAAO,EAAI;EACb,CAAC,EAAE,CAAC2B,MAAM,EAAE3B,OAAO,CAAC,CAAC;EAErB,IAAM6B,aAAa,GAAG,IAAAH,kBAAW,EAAC,YAAM;IACtCE,UAAU,EAAE;IACZ3B,SAAS,aAATA,SAAS,uBAATA,SAAS,EAAI;EACf,CAAC,EAAE,CAAC2B,UAAU,EAAE3B,SAAS,CAAC,CAAC;EAE3B,IAAAkB,gBAAS,EAAC,YAAM;IACd,IAAMW,aAAa,GAAG,SAAhBA,aAAaA,CAAIC,KAAoB,EAAK;MAC9C,IAAIA,KAAK,CAAC3G,GAAG,KAAK,QAAQ,EAAE;QAC1BwG,UAAU,EAAE;MACd;IACF,CAAC;IAEDI,QAAQ,CAACC,gBAAgB,CAAC,SAAS,EAAEH,aAAa,CAAC;IAEnD,OAAO,YAAM;MACXE,QAAQ,CAACE,mBAAmB,CAAC,SAAS,EAAEJ,aAAa,CAAC;IACxD,CAAC;EACH,CAAC,EAAE,CAACF,UAAU,CAAC,CAAC;EAEhB,IAAAO,YAAA,GAII,IAAAC,kBAAW,EAAC;MACdC,QAAQ,EAAElC,SAAS;MACnBJ,MAAM,EAANA,MAAM;MACNuC,MAAM,EAAE5B;IACV,CAAC,CAAC;IAPAc,SAAS,GAAAW,YAAA,CAATX,SAAS;IACTH,UAAU,GAAAc,YAAA,CAAVd,UAAU;IACDkB,SAAS,GAAAJ,YAAA,CAAlBK,KAAK,CAAID,SAAS;EAOpB,IAAAE,sBAAe,EAAC;IACdC,GAAG,EAAErB,UAAU;IACfsB,cAAc,EAAEf,UAAU;IAC1BgB,IAAI,EAAElC,OAAO,IAAI,CAACf,kBAAkB;IACpCkD,IAAI,EAAE;EACR,CAAC,CAAC;EAEF,IAAAC,UAAA,GAAyB,IAAAC,gBAAS,GAAE;IAA5BC,YAAY,GAAAF,UAAA,CAAZE,YAAY;EAEpB,oBACE3J,MAAA,CAAAgB,OAAA,CAAA4I,aAAA,CAAA5J,MAAA,CAAAgB,OAAA,CAAA6I,QAAA,QACGzD,QAAQ,CAAC;IACR+B,SAAS,EAAEA,SAAgB;IAC3BC,SAAS,EAATA,SAAS;IACTE,MAAM,EAAEC,UAAU;IAClB3B,SAAS,EAAE4B;EACb,CAAC,CAAC,EAEDnB,OAAO,IACNsC,YAAY,eACV3J,MAAA,CAAAgB,OAAA,CAAA4I,aAAA,CAACE,GAAG;IACFC,QAAQ,EAAE,CAAE;IACZV,GAAG,EAAErB,UAAkB;IACvBR,MAAM,EAAEA,MAAO;IACfwC,OAAO,EAAC,cAAc;IACtBhB,QAAQ,EAAC,UAAU;IACnB7B,OAAO,EAAEA;EAAQ,GAEhBH,OAAO,iBACNhH,MAAA,CAAAgB,OAAA,CAAA4I,aAAA,CAACjJ,QAAA,CAAAsJ,OAAO;IACN9B,SAAS,EAAEA,SAAU;IACrBH,UAAU,EAAEA,UAAW;IACvBb,OAAO,EAAEA,OAAQ;IACjBL,SAAS,EAAEA,SAAU;IACrBoC,SAAS,EAAEA;EAAU,EAExB,eAEDlJ,MAAA,CAAAgB,OAAA,CAAA4I,aAAA,CAACM,KAAK;IACJlB,QAAQ,EAAC,UAAU;IACnBxB,MAAM,EAAE,CAAE;IACV2C,CAAC,EAAE,CAAE;IACLC,OAAO,EAAE5B,aAAc;IACvB,cAAW;EAAO,gBAElBxI,MAAA,CAAAgB,OAAA,CAAA4I,aAAA,CAACtJ,UAAA,CAAAU,OAAS;IAACqJ,IAAI,EAAC,cAAc;IAACL,OAAO,EAAC;EAAO,EAAG,CAC3C,eAERhK,MAAA,CAAAgB,OAAA,CAAA4I,aAAA,CAACU,KAAK,EAAAjI,QAAA;IACJ8E,OAAO,EAAEA,OAAQ;IACjB6B,QAAQ,EAAC,UAAU;IACnBmB,CAAC,EAAE,CAAE;IACL3C,MAAM,EAAE;EAAE,GACNC,IAAI,GAEP,OAAOR,OAAO,KAAK,UAAU,GAC1BA,OAAO,CAAC;IACNmB,SAAS,EAATA,SAAS;IACTE,MAAM,EAAEC,UAAU;IAClB3B,SAAS,EAAE4B;EACb,CAAC,CAAC,GACFvB,OAAO,CACL,CACJ,CACP,CACF;AAEP,CAAC;AAED,IAAM6C,GAAG,GAAG,IAAAS,yBAAM,EAACC,QAAG,CAAC,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,8FAIP,IAAAC,kBAAQ,EAAC,oBAAoB,CAAC,EAC1C,IAAAzD,qBAAO,EAAC;EAAE0D,QAAQ,EAAEjF;AAAiB,CAAC,CAAC,CAC1C;AAED,IAAM0E,KAAK,GAAG,IAAAC,yBAAM,EAACC,QAAG,CAAC,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,aACrB,IAAAxD,qBAAO,EAAC;EAAE0D,QAAQ,EAAEjF;AAAiB,CAAC,CAAC,CAC1C;AAED,IAAMsE,KAAK,GAAG,IAAAK,yBAAM,EAACO,oBAAS,CAAC,CAAAL,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,oBAE9B"}
+{"version":3,"file":"Popover.js","names":["_react","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_styledSystem","_CloseIcon","_utils","_useUpdateEffect","_Box","_Clickable","_Pointer","_themeGet","_excluded","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","_typeof","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","_slicedToArray","arr","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","POPOVER_VARIANTS","exports","defaultLight","backgroundColor","color","defaultDark","Popover","_ref","children","_ref$ignoreClickOutsi","ignoreClickOutside","_ref$manageFocus","manageFocus","_ref$offset","offset","onClose","onDismiss","_ref$placement","placement","_ref$pointer","pointer","popover","_ref$showCloseButton","showCloseButton","_ref$variant","variant","_ref$visible","visible","_visible","_ref$zIndex","zIndex","rest","_useState","useState","_useState2","setVisible","useEffect","useUpdateEffect","tooltipRef","current","focus","anchorRef","onVisible","useCallback","onHide","handleHide","handleDismiss","handleKeydown","event","document","addEventListener","removeEventListener","_usePosition","usePosition","position","active","isFlipped","state","useClickOutside","ref","onClickOutside","when","type","_usePortal","usePortal","createPortal","createElement","Fragment","Tip","tabIndex","display","Pointer","Close","p","onClick","fill","Panel","styled","Box","withConfig","displayName","componentId","themeGet","variants","Clickable"],"sources":["../../../src/elements/Popover/Popover.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from \"react\"\nimport styled from \"styled-components\"\nimport { variant } from \"styled-system\"\nimport CloseIcon from \"@artsy/icons/CloseIcon\"\nimport { Position, useClickOutside, usePortal, usePosition } from \"../../utils\"\nimport { useUpdateEffect } from \"../../utils/useUpdateEffect\"\nimport { Box, BoxProps } from \"../Box\"\nimport { Clickable } from \"../Clickable\"\nimport { Pointer } from \"../Pointer\"\nimport { themeGet } from \"@styled-system/theme-get\"\n\nexport const POPOVER_VARIANTS = {\n  defaultLight: {\n    backgroundColor: \"mono0\",\n    color: \"mono100\",\n  },\n  defaultDark: {\n    backgroundColor: \"mono100\",\n    color: \"mono0\",\n  },\n}\n\nexport type PopoverVariant = keyof typeof POPOVER_VARIANTS\n\nexport interface PopoverActions {\n  /** Call to show popover */\n  onVisible(): void\n  /** Call to hide popover */\n  onHide(): void\n  /** Call to dismiss popover */\n  onDismiss(): void\n  /** Pass ref to element you want the popover to be anchored to */\n  anchorRef: React.MutableRefObject<HTMLElement>\n}\n\nexport interface PopoverProps extends BoxProps {\n  children: (actions: PopoverActions) => JSX.Element\n  ignoreClickOutside?: boolean\n  manageFocus?: boolean\n  offset?: number\n  /** Called whenever the Popver is closed (both explcitly dismissed and through click outside) */\n  onClose?: () => void\n  /** Called whenever the Popover is dismissed (explicitly) */\n  onDismiss?: () => void\n  placement?: Position\n  /** Display triangular pointer back to anchor node */\n  pointer?: boolean\n  popover:\n    | ((actions: Omit<PopoverActions, \"anchorRef\">) => JSX.Element)\n    | React.ReactNode\n  /** Show the close icon button */\n  showCloseButton?: boolean\n  variant?: PopoverVariant\n  /** Initial default visibility */\n  visible?: boolean\n}\n\n/**\n * A `Popover` is a small modal-type element which is anchored, and can be\n * positioned relative to, another element.\n */\nexport const Popover = ({\n  children,\n  ignoreClickOutside = false,\n  manageFocus = true,\n  offset = 10,\n  onClose,\n  onDismiss,\n  placement = \"top\",\n  pointer = false,\n  popover,\n  showCloseButton = true,\n  variant = \"defaultLight\",\n  visible: _visible = false,\n  zIndex = 1,\n  ...rest\n}: PopoverProps) => {\n  const [visible, setVisible] = useState(false)\n\n  // If prop updates/set initial visibility.\n  useEffect(() => {\n    setVisible(_visible)\n  }, [_visible])\n\n  // Yields focus back and forth between popover and anchor\n  useUpdateEffect(() => {\n    if (!manageFocus) return\n\n    if (visible && tooltipRef.current) {\n      tooltipRef.current.focus()\n      return\n    }\n\n    if (!anchorRef.current) return\n    anchorRef.current.focus()\n  }, [visible])\n\n  const onVisible = useCallback(() => {\n    setVisible(true)\n  }, [])\n\n  const onHide = useCallback(() => {\n    setVisible(false)\n  }, [])\n\n  const handleHide = useCallback(() => {\n    onHide()\n    onClose?.()\n  }, [onHide, onClose])\n\n  const handleDismiss = useCallback(() => {\n    handleHide()\n    onDismiss?.()\n  }, [handleHide, onDismiss])\n\n  useEffect(() => {\n    const handleKeydown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        handleHide()\n      }\n    }\n\n    document.addEventListener(\"keydown\", handleKeydown)\n\n    return () => {\n      document.removeEventListener(\"keydown\", handleKeydown)\n    }\n  }, [handleHide])\n\n  const {\n    anchorRef,\n    tooltipRef,\n    state: { isFlipped },\n  } = usePosition({\n    position: placement,\n    offset,\n    active: visible,\n  })\n\n  useClickOutside({\n    ref: tooltipRef,\n    onClickOutside: handleHide,\n    when: visible && !ignoreClickOutside,\n    type: \"click\",\n  })\n\n  const { createPortal } = usePortal()\n\n  return (\n    <>\n      {children({\n        anchorRef: anchorRef as any,\n        onVisible,\n        onHide: handleHide,\n        onDismiss: handleDismiss,\n      })}\n\n      {visible &&\n        createPortal(\n          <Tip\n            tabIndex={0}\n            ref={tooltipRef as any}\n            zIndex={zIndex}\n            display=\"inline-block\"\n            position=\"relative\"\n            variant={variant}\n          >\n            {pointer && (\n              <Pointer\n                anchorRef={anchorRef}\n                tooltipRef={tooltipRef}\n                variant={variant}\n                placement={placement}\n                isFlipped={isFlipped}\n              />\n            )}\n\n            {showCloseButton && (\n              <Close\n                position=\"relative\"\n                zIndex={2}\n                p={1}\n                onClick={handleDismiss}\n                aria-label=\"Close\"\n              >\n                <CloseIcon fill=\"currentColor\" display=\"block\" />\n              </Close>\n            )}\n\n            <Panel\n              variant={variant}\n              position=\"relative\"\n              p={1}\n              zIndex={1}\n              {...rest}\n            >\n              {typeof popover === \"function\"\n                ? popover({\n                    onVisible,\n                    onHide: handleHide,\n                    onDismiss: handleDismiss,\n                  })\n                : popover}\n            </Panel>\n          </Tip>\n        )}\n    </>\n  )\n}\n\nconst Tip = styled(Box)<{ variant?: PopoverVariant }>`\n  position: fixed;\n  text-align: left;\n  transition: opacity 250ms ease-out;\n  box-shadow: ${themeGet(\"effects.dropShadow\")};\n  ${variant({ variants: POPOVER_VARIANTS })}\n`\n\nconst Panel = styled(Box)<{ variant?: PopoverVariant }>`\n  ${variant({ variants: POPOVER_VARIANTS })}\n`\n\nconst Close = styled(Clickable)`\n  float: right;\n`\n"],"mappings":"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"}

package/dist/elements/Popover/Popover.story.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
 import { PopoverProps } from "./Popover";
 declare const _default: {
-    component: ({ children, ignoreClickOutside, manageFocus, offset, onClose, onDismiss, placement, pointer, popover, variant, visible: _visible, zIndex, ...rest }: PopoverProps) => React.JSX.Element;
+    component: ({ children, ignoreClickOutside, manageFocus, offset, onClose, onDismiss, placement, pointer, popover, showCloseButton, variant, visible: _visible, zIndex, ...rest }: PopoverProps) => React.JSX.Element;
     title: string;
     tags: string[];
     parameters: {
@@ -39,7 +39,8 @@ export declare const Visible: {
         placement: string;
         visible: boolean;
         popover: React.JSX.Element;
-        children: ({ anchorRef }: {
+        children: ({ onVisible, anchorRef }: {
+            onVisible: any;
             anchorRef: any;
         }) => React.JSX.Element;
     };
@@ -57,7 +58,8 @@ export declare const WithContentInteraction: {
         placement: string;
         visible: boolean;
         popover: React.JSX.Element;
-        children: ({ anchorRef }: {
+        children: ({ onVisible, anchorRef }: {
+            onVisible: any;
             anchorRef: any;
         }) => React.JSX.Element;
     };
@@ -77,7 +79,8 @@ export declare const Pointer: {
         visible: boolean;
         p: number;
         popover: React.JSX.Element;
-        children: ({ anchorRef }: {
+        children: ({ onVisible, anchorRef }: {
+            onVisible: any;
             anchorRef: any;
         }) => React.JSX.Element;
     };
@@ -98,7 +101,28 @@ export declare const DarkVariant: {
         pointer: boolean;
         zIndex: number;
         popover: React.JSX.Element;
-        children: ({ anchorRef }: {
+        children: ({ onVisible, anchorRef }: {
+            onVisible: any;
+            anchorRef: any;
+        }) => React.JSX.Element;
+    };
+    parameters: {
+        docs: {
+            description: {
+                story: string;
+            };
+        };
+    };
+};
+export declare const HideCloseButton: {
+    tags: string[];
+    args: {
+        placement: string;
+        showCloseButton: boolean;
+        visible: boolean;
+        popover: React.JSX.Element;
+        children: ({ onVisible, anchorRef }: {
+            onVisible: any;
             anchorRef: any;
         }) => React.JSX.Element;
     };
@@ -114,9 +138,11 @@ export declare const IgnoreClickOutside: {
     tags: string[];
     args: {
         placement: string;
+        visible: boolean;
         ignoreClickOutside: boolean;
         popover: React.JSX.Element;
-        children: ({ anchorRef }: {
+        children: ({ onVisible, anchorRef }: {
+            onVisible: any;
             anchorRef: any;
         }) => React.JSX.Element;
     };

package/dist/elements/Popover/Popover.story.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.WithContentInteraction = exports.Visible = exports.PopoverActions = exports.Pointer = exports.Placement = exports.ManageFocus = exports.IgnoreClickOutside = exports.Default = exports.DarkVariant = exports.CrashAtSpecificZoomLevels = void 0;
+exports.default = exports.WithContentInteraction = exports.Visible = exports.PopoverActions = exports.Pointer = exports.Placement = exports.ManageFocus = exports.IgnoreClickOutside = exports.HideCloseButton = exports.Default = exports.DarkVariant = exports.CrashAtSpecificZoomLevels = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _storybookStates = require("storybook-states");
 var _utils = require("../../utils");
@@ -70,13 +70,15 @@ var Visible = exports.Visible = {
       width: 300
     }, CONTENT),
     children: function children(_ref2) {
-      var anchorRef = _ref2.anchorRef;
+      var onVisible = _ref2.onVisible,
+        anchorRef = _ref2.anchorRef;
       return /*#__PURE__*/_react.default.createElement(_Box.Box, {
         textAlign: "center"
       }, /*#__PURE__*/_react.default.createElement(_Button.Button, {
         ref: anchorRef,
         variant: "secondaryBlack",
-        size: "small"
+        size: "small",
+        onClick: onVisible
       }, "Popover Visible"));
     }
   },
@@ -98,13 +100,15 @@ var WithContentInteraction = exports.WithContentInteraction = {
       width: 300
     }, "| | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | \u2014 (Content interaction with close button.)"),
     children: function children(_ref3) {
-      var anchorRef = _ref3.anchorRef;
+      var onVisible = _ref3.onVisible,
+        anchorRef = _ref3.anchorRef;
       return /*#__PURE__*/_react.default.createElement(_Box.Box, {
         textAlign: "center"
       }, /*#__PURE__*/_react.default.createElement(_Button.Button, {
         ref: anchorRef,
         variant: "secondaryBlack",
-        size: "small"
+        size: "small",
+        onClick: onVisible
       }, "Popover With Content Interaction"));
     }
   },
@@ -134,13 +138,15 @@ var Pointer = exports.Pointer = {
       }, "Example Item");
     })),
     children: function children(_ref4) {
-      var anchorRef = _ref4.anchorRef;
+      var onVisible = _ref4.onVisible,
+        anchorRef = _ref4.anchorRef;
       return /*#__PURE__*/_react.default.createElement(_Box.Box, {
         textAlign: "center"
       }, /*#__PURE__*/_react.default.createElement(_Button.Button, {
         ref: anchorRef,
         variant: "secondaryBlack",
-        size: "small"
+        size: "small",
+        onClick: onVisible
       }, "Popover With Pointer"));
     }
   },
@@ -165,13 +171,15 @@ var DarkVariant = exports.DarkVariant = {
       width: 300
     }, CONTENT),
     children: function children(_ref5) {
-      var anchorRef = _ref5.anchorRef;
+      var onVisible = _ref5.onVisible,
+        anchorRef = _ref5.anchorRef;
       return /*#__PURE__*/_react.default.createElement(_Box.Box, {
         textAlign: "center"
       }, /*#__PURE__*/_react.default.createElement(_Button.Button, {
         ref: anchorRef,
         variant: "secondaryBlack",
-        size: "small"
+        size: "small",
+        onClick: onVisible
       }, "Popover Dark Variant"));
     }
   },
@@ -183,23 +191,57 @@ var DarkVariant = exports.DarkVariant = {
     }
   }
 };
+var HideCloseButton = exports.HideCloseButton = {
+  tags: ["!autodocs"],
+  args: {
+    placement: "bottom",
+    showCloseButton: false,
+    visible: true,
+    popover: /*#__PURE__*/_react.default.createElement(_Text.Text, {
+      variant: "xs",
+      width: 300
+    }, CONTENT),
+    children: function children(_ref6) {
+      var onVisible = _ref6.onVisible,
+        anchorRef = _ref6.anchorRef;
+      return /*#__PURE__*/_react.default.createElement(_Box.Box, {
+        textAlign: "center"
+      }, /*#__PURE__*/_react.default.createElement(_Button.Button, {
+        ref: anchorRef,
+        variant: "secondaryBlack",
+        size: "small",
+        onClick: onVisible
+      }, "Popover Without Close Button"));
+    }
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Popover with close button hidden."
+      }
+    }
+  }
+};
 var IgnoreClickOutside = exports.IgnoreClickOutside = {
   tags: ["!autodocs"],
   args: {
     placement: "bottom",
+    visible: true,
     ignoreClickOutside: true,
     popover: /*#__PURE__*/_react.default.createElement(_Text.Text, {
       variant: "xs",
       width: 300
     }, CONTENT),
-    children: function children(_ref6) {
-      var anchorRef = _ref6.anchorRef;
+    children: function children(_ref7) {
+      var onVisible = _ref7.onVisible,
+        anchorRef = _ref7.anchorRef;
       return /*#__PURE__*/_react.default.createElement(_Box.Box, {
         textAlign: "center"
       }, /*#__PURE__*/_react.default.createElement(_Button.Button, {
         ref: anchorRef,
         variant: "secondaryBlack",
-        size: "small"
+        size: "small",
+        onClick: onVisible
       }, "Popover Ignore Click Outside"));
     }
   },
@@ -228,8 +270,8 @@ var Placement = exports.Placement = {
         visible: true,
         variant: "defaultDark",
         pointer: true
-      }, props), function (_ref7) {
-        var anchorRef = _ref7.anchorRef;
+      }, props), function (_ref8) {
+        var anchorRef = _ref8.anchorRef;
         return /*#__PURE__*/_react.default.createElement(_Text.Text, {
           ref: anchorRef,
           variant: "xs",
@@ -270,9 +312,9 @@ var ManageFocus = exports.ManageFocus = {
         variant: "xs",
         width: 300
       }, CONTENT)
-    }, function (_ref8) {
-      var onVisible = _ref8.onVisible,
-        anchorRef = _ref8.anchorRef;
+    }, function (_ref9) {
+      var onVisible = _ref9.onVisible,
+        anchorRef = _ref9.anchorRef;
       return /*#__PURE__*/_react.default.createElement(_Box.Box, {
         textAlign: "center"
       }, /*#__PURE__*/_react.default.createElement(_Button.Button, {
@@ -300,9 +342,9 @@ var PopoverActions = exports.PopoverActions = {
       }]
     }, /*#__PURE__*/_react.default.createElement(_Popover.Popover, {
       placement: "bottom",
-      popover: function popover(_ref9) {
-        var onHide = _ref9.onHide,
-          onDismiss = _ref9.onDismiss;
+      popover: function popover(_ref10) {
+        var onHide = _ref10.onHide,
+          onDismiss = _ref10.onDismiss;
         return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Text.Text, {
           variant: "xs",
           width: 300
@@ -322,9 +364,9 @@ var PopoverActions = exports.PopoverActions = {
           onClick: onDismiss
         }, "Dismiss")));
       }
-    }, function (_ref10) {
-      var onVisible = _ref10.onVisible,
-        anchorRef = _ref10.anchorRef;
+    }, function (_ref11) {
+      var onVisible = _ref11.onVisible,
+        anchorRef = _ref11.anchorRef;
       return /*#__PURE__*/_react.default.createElement(_Box.Box, {
         textAlign: "center"
       }, /*#__PURE__*/_react.default.createElement(_Button.Button, {
@@ -355,9 +397,9 @@ var CrashAtSpecificZoomLevels = exports.CrashAtSpecificZoomLevels = {
       height: 200
     }), /*#__PURE__*/_react.default.createElement(_Popover.Popover, {
       placement: "top",
-      popover: function popover(_ref11) {
-        var onHide = _ref11.onHide,
-          onDismiss = _ref11.onDismiss;
+      popover: function popover(_ref12) {
+        var onHide = _ref12.onHide,
+          onDismiss = _ref12.onDismiss;
         return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Text.Text, {
           variant: "xs",
           width: 300
@@ -377,9 +419,9 @@ var CrashAtSpecificZoomLevels = exports.CrashAtSpecificZoomLevels = {
           onClick: onDismiss
         }, "Dismiss")));
       }
-    }, function (_ref12) {
-      var onVisible = _ref12.onVisible,
-        anchorRef = _ref12.anchorRef;
+    }, function (_ref13) {
+      var onVisible = _ref13.onVisible,
+        anchorRef = _ref13.anchorRef;
       return /*#__PURE__*/_react.default.createElement(_Box.Box, {
         textAlign: "center"
       }, /*#__PURE__*/_react.default.createElement(_Button.Button, {

package/dist/elements/Popover/Popover.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"Popover.story.js","names":["_react","_interopRequireDefault","require","_storybookStates","_utils","_Box","_Button","_Flex","_Spacer","_Text","_Popover","_storybookBlocklist","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","CONTENT","_default","exports","component","Popover","title","tags","parameters","docs","description","controls","exclude","STORYBOOK_PROPS_BLOCKLIST","Default","args","placement","popover","createElement","Text","variant","width","children","_ref","onVisible","anchorRef","Box","textAlign","Button","ref","size","onClick","story","Visible","visible","_ref2","WithContentInteraction","_ref3","Pointer","pointer","p","Fragment","Array","fill","map","_","overflowEllipsis","bg","px","py","_ref4","DarkVariant","zIndex","_ref5","IgnoreClickOutside","ignoreClickOutside","_ref6","Placement","render","States","states","keys","POSITION","props","JSON","stringify","_ref7","maxWidth","mx","chromatic","disable","ManageFocus","manageFocus","_ref8","PopoverActions","_ref9","onHide","onDismiss","Spacer","y","Flex","flex","x","_ref10","CrashAtSpecificZoomLevels","height","_ref11","_ref12"],"sources":["../../../src/elements/Popover/Popover.story.tsx"],"sourcesContent":["import React from \"react\"\nimport { States } from \"storybook-states\"\nimport { Position, POSITION } from \"../../utils\"\nimport { Box } from \"../Box\"\nimport { Button } from \"../Button\"\nimport { Flex } from \"../Flex\"\nimport { Spacer } from \"../Spacer\"\nimport { Text } from \"../Text\"\nimport { Popover, PopoverProps } from \"./Popover\"\nimport { STORYBOOK_PROPS_BLOCKLIST } from \"../../utils/storybookBlocklist\"\n\nconst CONTENT =\n  \"Lorem ipsum dolor sit amet consectetur adipisicing elit. Modi eius autem aliquid cumque, mollitia incidunt totam. Id ut quae hic in quisquam, cupiditate iure nobis, provident minus voluptatem tenetur consequatur.\"\n\nexport default {\n  component: Popover,\n  title: \"Components/Popover\",\n  tags: [\"autodocs\"],\n  parameters: {\n    docs: {\n      description: {\n        component:\n          \"A floating popover component that can be positioned relative to an anchor element.\",\n      },\n    },\n    controls: {\n      exclude: STORYBOOK_PROPS_BLOCKLIST,\n    },\n  },\n}\n\nexport const Default = {\n  args: {\n    placement: \"bottom\",\n    popover: (\n      <Text variant=\"xs\" width={300}>\n        {CONTENT}\n      </Text>\n    ),\n    children: ({ onVisible, anchorRef }) => (\n      <Box textAlign=\"center\">\n        <Button\n          ref={anchorRef}\n          variant=\"secondaryBlack\"\n          size=\"small\"\n          onClick={onVisible}\n        >\n          Click to display popover\n        </Button>\n      </Box>\n    ),\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Default popover.\",\n      },\n    },\n  },\n}\n\nexport const Visible = {\n  tags: [\"!autodocs\"],\n  args: {\n    placement: \"bottom\",\n    visible: true,\n    popover: (\n      <Text variant=\"xs\" width={300}>\n        {CONTENT}\n      </Text>\n    ),\n    children: ({ anchorRef }) => (\n      <Box textAlign=\"center\">\n        <Button ref={anchorRef} variant=\"secondaryBlack\" size=\"small\">\n          Popover Visible\n        </Button>\n      </Box>\n    ),\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Popover visible state.\",\n      },\n    },\n  },\n}\n\nexport const WithContentInteraction = {\n  tags: [\"!autodocs\"],\n  args: {\n    placement: \"bottom\",\n    visible: true,\n    popover: (\n      <Text variant=\"xs\" width={300}>\n        | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n        | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n        | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n        | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n        | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n        | | | | | | | | | | | | | | | | | | | | | — (Content interaction with\n        close button.)\n      </Text>\n    ),\n    children: ({ anchorRef }) => (\n      <Box textAlign=\"center\">\n        <Button ref={anchorRef} variant=\"secondaryBlack\" size=\"small\">\n          Popover With Content Interaction\n        </Button>\n      </Box>\n    ),\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Popover with content interaction.\",\n      },\n    },\n  },\n}\n\nexport const Pointer = {\n  tags: [\"!autodocs\"],\n  args: {\n    placement: \"bottom\",\n    pointer: true,\n    visible: true,\n    p: 0,\n    popover: (\n      <>\n        {new Array(4).fill(0).map((_, i) => (\n          <Text\n            key={i}\n            variant=\"sm-display\"\n            overflowEllipsis\n            bg=\"red10\"\n            px={1}\n            py={0.5}\n          >\n            Example Item\n          </Text>\n        ))}\n      </>\n    ),\n    children: ({ anchorRef }) => (\n      <Box textAlign=\"center\">\n        <Button ref={anchorRef} variant=\"secondaryBlack\" size=\"small\">\n          Popover With Pointer\n        </Button>\n      </Box>\n    ),\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Popover with pointer and multiple items.\",\n      },\n    },\n  },\n}\n\nexport const DarkVariant = {\n  tags: [\"!autodocs\"],\n  args: {\n    placement: \"bottom\",\n    variant: \"defaultDark\",\n    visible: true,\n    pointer: true,\n    zIndex: 99,\n    popover: (\n      <Text variant=\"xs\" width={300}>\n        {CONTENT}\n      </Text>\n    ),\n    children: ({ anchorRef }) => (\n      <Box textAlign=\"center\">\n        <Button ref={anchorRef} variant=\"secondaryBlack\" size=\"small\">\n          Popover Dark Variant\n        </Button>\n      </Box>\n    ),\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Popover with dark variant styling.\",\n      },\n    },\n  },\n}\n\nexport const IgnoreClickOutside = {\n  tags: [\"!autodocs\"],\n  args: {\n    placement: \"bottom\",\n    ignoreClickOutside: true,\n    popover: (\n      <Text variant=\"xs\" width={300}>\n        {CONTENT}\n      </Text>\n    ),\n    children: ({ anchorRef }) => (\n      <Box textAlign=\"center\">\n        <Button ref={anchorRef} variant=\"secondaryBlack\" size=\"small\">\n          Popover Ignore Click Outside\n        </Button>\n      </Box>\n    ),\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Popover with ignoreClickOutside enabled.\",\n      },\n    },\n  },\n}\n\nexport const Placement = {\n  tags: [\"!autodocs\"],\n  render: () => (\n    <States<Partial<PopoverProps>>\n      states={Object.keys(POSITION).map((placement) => ({\n        placement: placement as Position,\n      }))}\n    >\n      {(props) => (\n        <Popover\n          popover={<Text variant=\"xs\">{JSON.stringify(props)}</Text>}\n          visible\n          variant=\"defaultDark\"\n          pointer\n          {...props}\n        >\n          {({ anchorRef }) => (\n            <Text\n              ref={anchorRef as any}\n              variant=\"xs\"\n              textAlign=\"center\"\n              p={1}\n              maxWidth=\"50%\"\n              mx=\"auto\"\n              bg=\"mono10\"\n            >\n              {JSON.stringify(props)}\n            </Text>\n          )}\n        </Popover>\n      )}\n    </States>\n  ),\n  parameters: {\n    chromatic: { disable: true },\n    docs: {\n      description: {\n        story: \"Popover shown in all available placement positions.\",\n      },\n    },\n  },\n}\n\nexport const ManageFocus = {\n  tags: [\"!autodocs\"],\n  render: () => (\n    <States<Partial<PopoverProps>>\n      states={[\n        { visible: true, manageFocus: false },\n        { visible: true, manageFocus: true },\n      ]}\n    >\n      <Popover\n        placement=\"bottom\"\n        popover={\n          <Text variant=\"xs\" width={300}>\n            {CONTENT}\n          </Text>\n        }\n      >\n        {({ onVisible, anchorRef }) => (\n          <Box textAlign=\"center\">\n            <Button\n              ref={anchorRef}\n              variant=\"secondaryBlack\"\n              size=\"small\"\n              onClick={onVisible}\n            >\n              Click to display popover\n            </Button>\n          </Box>\n        )}\n      </Popover>\n    </States>\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"Popover with different focus management settings.\",\n      },\n    },\n  },\n}\n\nexport const PopoverActions = {\n  tags: [\"!autodocs\"],\n  render: () => (\n    <States<Partial<PopoverProps>> states={[{ visible: true }]}>\n      <Popover\n        placement=\"bottom\"\n        popover={({ onHide, onDismiss }) => (\n          <>\n            <Text variant=\"xs\" width={300}>\n              {CONTENT}\n            </Text>\n\n            <Spacer y={2} />\n\n            <Flex>\n              <Button\n                flex={1}\n                size=\"small\"\n                variant=\"secondaryBlack\"\n                onClick={onHide}\n              >\n                Hide\n              </Button>\n\n              <Spacer x={1} />\n\n              <Button\n                flex={1}\n                size=\"small\"\n                variant=\"secondaryBlack\"\n                onClick={onDismiss}\n              >\n                Dismiss\n              </Button>\n            </Flex>\n          </>\n        )}\n      >\n        {({ onVisible, anchorRef }) => (\n          <Box textAlign=\"center\">\n            <Button\n              ref={anchorRef}\n              variant=\"secondaryBlack\"\n              size=\"small\"\n              onClick={onVisible}\n            >\n              Click to display popover\n            </Button>\n          </Box>\n        )}\n      </Popover>\n    </States>\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"Popover with action buttons (Hide and Dismiss).\",\n      },\n    },\n  },\n}\n\nexport const CrashAtSpecificZoomLevels = {\n  tags: [\"!autodocs\"],\n  render: () => (\n    <>\n      <Box height={100}>Zoom to 90% in Chrome, click, then scroll.</Box>\n\n      <Box height={2000} bg=\"mono5\">\n        <Box height={200} />\n\n        <Popover\n          placement=\"top\"\n          popover={({ onHide, onDismiss }) => (\n            <>\n              <Text variant=\"xs\" width={300}>\n                {CONTENT}\n              </Text>\n\n              <Spacer y={2} />\n\n              <Flex>\n                <Button\n                  flex={1}\n                  size=\"small\"\n                  variant=\"secondaryBlack\"\n                  onClick={onHide}\n                >\n                  Hide\n                </Button>\n\n                <Spacer x={1} />\n\n                <Button\n                  flex={1}\n                  size=\"small\"\n                  variant=\"secondaryBlack\"\n                  onClick={onDismiss}\n                >\n                  Dismiss\n                </Button>\n              </Flex>\n            </>\n          )}\n        >\n          {({ onVisible, anchorRef }) => (\n            <Box textAlign=\"center\">\n              <Button\n                ref={anchorRef}\n                variant=\"secondaryBlack\"\n                size=\"small\"\n                onClick={onVisible}\n              >\n                Click to display popover\n              </Button>\n            </Box>\n          )}\n        </Popover>\n      </Box>\n    </>\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"Test case for popover behavior at specific zoom levels.\",\n      },\n    },\n  },\n}\n"],"mappings":"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"}
+{"version":3,"file":"Popover.story.js","names":["_react","_interopRequireDefault","require","_storybookStates","_utils","_Box","_Button","_Flex","_Spacer","_Text","_Popover","_storybookBlocklist","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","CONTENT","_default","exports","component","Popover","title","tags","parameters","docs","description","controls","exclude","STORYBOOK_PROPS_BLOCKLIST","Default","args","placement","popover","createElement","Text","variant","width","children","_ref","onVisible","anchorRef","Box","textAlign","Button","ref","size","onClick","story","Visible","visible","_ref2","WithContentInteraction","_ref3","Pointer","pointer","p","Fragment","Array","fill","map","_","overflowEllipsis","bg","px","py","_ref4","DarkVariant","zIndex","_ref5","HideCloseButton","showCloseButton","_ref6","IgnoreClickOutside","ignoreClickOutside","_ref7","Placement","render","States","states","keys","POSITION","props","JSON","stringify","_ref8","maxWidth","mx","chromatic","disable","ManageFocus","manageFocus","_ref9","PopoverActions","_ref10","onHide","onDismiss","Spacer","y","Flex","flex","x","_ref11","CrashAtSpecificZoomLevels","height","_ref12","_ref13"],"sources":["../../../src/elements/Popover/Popover.story.tsx"],"sourcesContent":["import React from \"react\"\nimport { States } from \"storybook-states\"\nimport { Position, POSITION } from \"../../utils\"\nimport { Box } from \"../Box\"\nimport { Button } from \"../Button\"\nimport { Flex } from \"../Flex\"\nimport { Spacer } from \"../Spacer\"\nimport { Text } from \"../Text\"\nimport { Popover, PopoverProps } from \"./Popover\"\nimport { STORYBOOK_PROPS_BLOCKLIST } from \"../../utils/storybookBlocklist\"\n\nconst CONTENT =\n  \"Lorem ipsum dolor sit amet consectetur adipisicing elit. Modi eius autem aliquid cumque, mollitia incidunt totam. Id ut quae hic in quisquam, cupiditate iure nobis, provident minus voluptatem tenetur consequatur.\"\n\nexport default {\n  component: Popover,\n  title: \"Components/Popover\",\n  tags: [\"autodocs\"],\n  parameters: {\n    docs: {\n      description: {\n        component:\n          \"A floating popover component that can be positioned relative to an anchor element.\",\n      },\n    },\n    controls: {\n      exclude: STORYBOOK_PROPS_BLOCKLIST,\n    },\n  },\n}\n\nexport const Default = {\n  args: {\n    placement: \"bottom\",\n    popover: (\n      <Text variant=\"xs\" width={300}>\n        {CONTENT}\n      </Text>\n    ),\n    children: ({ onVisible, anchorRef }) => (\n      <Box textAlign=\"center\">\n        <Button\n          ref={anchorRef}\n          variant=\"secondaryBlack\"\n          size=\"small\"\n          onClick={onVisible}\n        >\n          Click to display popover\n        </Button>\n      </Box>\n    ),\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Default popover.\",\n      },\n    },\n  },\n}\n\nexport const Visible = {\n  tags: [\"!autodocs\"],\n  args: {\n    placement: \"bottom\",\n    visible: true,\n    popover: (\n      <Text variant=\"xs\" width={300}>\n        {CONTENT}\n      </Text>\n    ),\n    children: ({ onVisible, anchorRef }) => (\n      <Box textAlign=\"center\">\n        <Button\n          ref={anchorRef}\n          variant=\"secondaryBlack\"\n          size=\"small\"\n          onClick={onVisible}\n        >\n          Popover Visible\n        </Button>\n      </Box>\n    ),\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Popover visible state.\",\n      },\n    },\n  },\n}\n\nexport const WithContentInteraction = {\n  tags: [\"!autodocs\"],\n  args: {\n    placement: \"bottom\",\n    visible: true,\n    popover: (\n      <Text variant=\"xs\" width={300}>\n        | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n        | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n        | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n        | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n        | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |\n        | | | | | | | | | | | | | | | | | | | | | — (Content interaction with\n        close button.)\n      </Text>\n    ),\n    children: ({ onVisible, anchorRef }) => (\n      <Box textAlign=\"center\">\n        <Button\n          ref={anchorRef}\n          variant=\"secondaryBlack\"\n          size=\"small\"\n          onClick={onVisible}\n        >\n          Popover With Content Interaction\n        </Button>\n      </Box>\n    ),\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Popover with content interaction.\",\n      },\n    },\n  },\n}\n\nexport const Pointer = {\n  tags: [\"!autodocs\"],\n  args: {\n    placement: \"bottom\",\n    pointer: true,\n    visible: true,\n    p: 0,\n    popover: (\n      <>\n        {new Array(4).fill(0).map((_, i) => (\n          <Text\n            key={i}\n            variant=\"sm-display\"\n            overflowEllipsis\n            bg=\"red10\"\n            px={1}\n            py={0.5}\n          >\n            Example Item\n          </Text>\n        ))}\n      </>\n    ),\n    children: ({ onVisible, anchorRef }) => (\n      <Box textAlign=\"center\">\n        <Button\n          ref={anchorRef}\n          variant=\"secondaryBlack\"\n          size=\"small\"\n          onClick={onVisible}\n        >\n          Popover With Pointer\n        </Button>\n      </Box>\n    ),\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Popover with pointer and multiple items.\",\n      },\n    },\n  },\n}\n\nexport const DarkVariant = {\n  tags: [\"!autodocs\"],\n  args: {\n    placement: \"bottom\",\n    variant: \"defaultDark\",\n    visible: true,\n    pointer: true,\n    zIndex: 99,\n    popover: (\n      <Text variant=\"xs\" width={300}>\n        {CONTENT}\n      </Text>\n    ),\n    children: ({ onVisible, anchorRef }) => (\n      <Box textAlign=\"center\">\n        <Button\n          ref={anchorRef}\n          variant=\"secondaryBlack\"\n          size=\"small\"\n          onClick={onVisible}\n        >\n          Popover Dark Variant\n        </Button>\n      </Box>\n    ),\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Popover with dark variant styling.\",\n      },\n    },\n  },\n}\n\nexport const HideCloseButton = {\n  tags: [\"!autodocs\"],\n  args: {\n    placement: \"bottom\",\n    showCloseButton: false,\n    visible: true,\n    popover: (\n      <Text variant=\"xs\" width={300}>\n        {CONTENT}\n      </Text>\n    ),\n    children: ({ onVisible, anchorRef }) => (\n      <Box textAlign=\"center\">\n        <Button\n          ref={anchorRef}\n          variant=\"secondaryBlack\"\n          size=\"small\"\n          onClick={onVisible}\n        >\n          Popover Without Close Button\n        </Button>\n      </Box>\n    ),\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Popover with close button hidden.\",\n      },\n    },\n  },\n}\n\nexport const IgnoreClickOutside = {\n  tags: [\"!autodocs\"],\n  args: {\n    placement: \"bottom\",\n    visible: true,\n    ignoreClickOutside: true,\n    popover: (\n      <Text variant=\"xs\" width={300}>\n        {CONTENT}\n      </Text>\n    ),\n    children: ({ onVisible, anchorRef }) => (\n      <Box textAlign=\"center\">\n        <Button\n          ref={anchorRef}\n          variant=\"secondaryBlack\"\n          size=\"small\"\n          onClick={onVisible}\n        >\n          Popover Ignore Click Outside\n        </Button>\n      </Box>\n    ),\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Popover with ignoreClickOutside enabled.\",\n      },\n    },\n  },\n}\n\nexport const Placement = {\n  tags: [\"!autodocs\"],\n  render: () => (\n    <States<Partial<PopoverProps>>\n      states={Object.keys(POSITION).map((placement) => ({\n        placement: placement as Position,\n      }))}\n    >\n      {(props) => (\n        <Popover\n          popover={<Text variant=\"xs\">{JSON.stringify(props)}</Text>}\n          visible\n          variant=\"defaultDark\"\n          pointer\n          {...props}\n        >\n          {({ anchorRef }) => (\n            <Text\n              ref={anchorRef as any}\n              variant=\"xs\"\n              textAlign=\"center\"\n              p={1}\n              maxWidth=\"50%\"\n              mx=\"auto\"\n              bg=\"mono10\"\n            >\n              {JSON.stringify(props)}\n            </Text>\n          )}\n        </Popover>\n      )}\n    </States>\n  ),\n  parameters: {\n    chromatic: { disable: true },\n    docs: {\n      description: {\n        story: \"Popover shown in all available placement positions.\",\n      },\n    },\n  },\n}\n\nexport const ManageFocus = {\n  tags: [\"!autodocs\"],\n  render: () => (\n    <States<Partial<PopoverProps>>\n      states={[\n        { visible: true, manageFocus: false },\n        { visible: true, manageFocus: true },\n      ]}\n    >\n      <Popover\n        placement=\"bottom\"\n        popover={\n          <Text variant=\"xs\" width={300}>\n            {CONTENT}\n          </Text>\n        }\n      >\n        {({ onVisible, anchorRef }) => (\n          <Box textAlign=\"center\">\n            <Button\n              ref={anchorRef}\n              variant=\"secondaryBlack\"\n              size=\"small\"\n              onClick={onVisible}\n            >\n              Click to display popover\n            </Button>\n          </Box>\n        )}\n      </Popover>\n    </States>\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"Popover with different focus management settings.\",\n      },\n    },\n  },\n}\n\nexport const PopoverActions = {\n  tags: [\"!autodocs\"],\n  render: () => (\n    <States<Partial<PopoverProps>> states={[{ visible: true }]}>\n      <Popover\n        placement=\"bottom\"\n        popover={({ onHide, onDismiss }) => (\n          <>\n            <Text variant=\"xs\" width={300}>\n              {CONTENT}\n            </Text>\n\n            <Spacer y={2} />\n\n            <Flex>\n              <Button\n                flex={1}\n                size=\"small\"\n                variant=\"secondaryBlack\"\n                onClick={onHide}\n              >\n                Hide\n              </Button>\n\n              <Spacer x={1} />\n\n              <Button\n                flex={1}\n                size=\"small\"\n                variant=\"secondaryBlack\"\n                onClick={onDismiss}\n              >\n                Dismiss\n              </Button>\n            </Flex>\n          </>\n        )}\n      >\n        {({ onVisible, anchorRef }) => (\n          <Box textAlign=\"center\">\n            <Button\n              ref={anchorRef}\n              variant=\"secondaryBlack\"\n              size=\"small\"\n              onClick={onVisible}\n            >\n              Click to display popover\n            </Button>\n          </Box>\n        )}\n      </Popover>\n    </States>\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"Popover with action buttons (Hide and Dismiss).\",\n      },\n    },\n  },\n}\n\nexport const CrashAtSpecificZoomLevels = {\n  tags: [\"!autodocs\"],\n  render: () => (\n    <>\n      <Box height={100}>Zoom to 90% in Chrome, click, then scroll.</Box>\n\n      <Box height={2000} bg=\"mono5\">\n        <Box height={200} />\n\n        <Popover\n          placement=\"top\"\n          popover={({ onHide, onDismiss }) => (\n            <>\n              <Text variant=\"xs\" width={300}>\n                {CONTENT}\n              </Text>\n\n              <Spacer y={2} />\n\n              <Flex>\n                <Button\n                  flex={1}\n                  size=\"small\"\n                  variant=\"secondaryBlack\"\n                  onClick={onHide}\n                >\n                  Hide\n                </Button>\n\n                <Spacer x={1} />\n\n                <Button\n                  flex={1}\n                  size=\"small\"\n                  variant=\"secondaryBlack\"\n                  onClick={onDismiss}\n                >\n                  Dismiss\n                </Button>\n              </Flex>\n            </>\n          )}\n        >\n          {({ onVisible, anchorRef }) => (\n            <Box textAlign=\"center\">\n              <Button\n                ref={anchorRef}\n                variant=\"secondaryBlack\"\n                size=\"small\"\n                onClick={onVisible}\n              >\n                Click to display popover\n              </Button>\n            </Box>\n          )}\n        </Popover>\n      </Box>\n    </>\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"Test case for popover behavior at specific zoom levels.\",\n      },\n    },\n  },\n}\n"],"mappings":"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"}

package/dist/elements/ReadMore/ReadMore.js

@@ -61,6 +61,8 @@ var ReadMore = exports.ReadMore = function ReadMore(_ref) {
   return /*#__PURE__*/_react.default.createElement(Container, {
     "aria-expanded": expanded
   }, /*#__PURE__*/_react.default.createElement(LineClamp, {
+    key: "".concat(expanded) // Forces a re-render on Mobile Safari
+    ,
     ref: ref,
     lineClamp: maxLinesToShow
   }, /*#__PURE__*/_react.default.createElement(_Box.Box, {

package/dist/elements/ReadMore/ReadMore.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReadMore.js","names":["_react","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_Clickable","_Text","_Box","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","_typeof","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_slicedToArray","arr","i","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","length","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","ReadMore","exports","_ref","expandedHTML","content","disabled","defaultExpanded","_ref$maxLines","maxLines","Infinity","onReadLessClicked","onReadMoreClicked","ref","useRef","_useState","useState","_useState2","overflowing","setOverflowing","_useState3","_useState4","expanded","setExpanded","maxLinesToShow","handleClick","prevExpanded","nextExpanded","handleResize","current","shouldExpand","scrollHeight","clientHeight","initialized","useEffect","createElement","Container","LineClamp","lineClamp","Box","position","dangerouslySetInnerHTML","__html","Clickable","cursor","textDecoration","onClick","display","width","Text","variant","fontWeight","displayName","styled","div","withConfig","componentId","props"],"sources":["../../../src/elements/ReadMore/ReadMore.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\"\nimport styled from \"styled-components\"\nimport { Clickable } from \"../Clickable\"\nimport { Text } from \"../Text\"\nimport { Box } from \"../Box\"\n\nexport interface ReadMoreProps {\n  content: string\n  disabled?: boolean\n  defaultExpanded?: boolean\n  maxLines?: number\n  onReadLessClicked?: () => void\n  onReadMoreClicked?: () => void\n}\n\nexport const ReadMore: React.FC<React.PropsWithChildren<ReadMoreProps>> = ({\n  content: expandedHTML,\n  disabled,\n  defaultExpanded,\n  maxLines = Infinity,\n  onReadLessClicked,\n  onReadMoreClicked,\n}) => {\n  const ref = useRef<HTMLDivElement>(null)\n\n  const [overflowing, setOverflowing] = useState(false)\n  const [expanded, setExpanded] = useState(!!defaultExpanded)\n\n  const maxLinesToShow = expanded ? Infinity : maxLines\n\n  const handleClick = () => {\n    if (disabled) return\n\n    setExpanded((prevExpanded) => {\n      const nextExpanded = !prevExpanded\n      nextExpanded ? onReadMoreClicked?.() : onReadLessClicked?.()\n      return nextExpanded\n    })\n  }\n\n  const handleResize = () => {\n    if (!ref.current) return false\n\n    const shouldExpand = ref.current.scrollHeight > ref.current.clientHeight\n    setOverflowing(shouldExpand)\n\n    return shouldExpand\n  }\n\n  const initialized = useRef(false)\n\n  useEffect(() => {\n    if (initialized.current) return\n\n    const shouldExpand = handleResize()\n    if (!shouldExpand) setExpanded(true)\n\n    initialized.current = true\n  }, [])\n\n  return (\n    <Container aria-expanded={expanded}>\n      <LineClamp ref={ref} lineClamp={maxLinesToShow}>\n        {/* LineClamp's `display` causes stacking of margins. Nested div ensures internal margins collapse. */}\n        <Box\n          position=\"relative\"\n          dangerouslySetInnerHTML={{\n            __html: expandedHTML,\n          }}\n        />\n      </LineClamp>\n\n      {overflowing && (\n        <Clickable\n          cursor=\"pointer\"\n          textDecoration=\"underline\"\n          onClick={handleClick}\n          display=\"block\"\n          width=\"100%\"\n        >\n          <Text variant=\"xs\" fontWeight=\"bold\">\n            Read {expanded ? \"less\" : \"more\"}\n          </Text>\n        </Clickable>\n      )}\n    </Container>\n  )\n}\n\nconst Container = styled.div`\n  position: relative;\n`\n\nContainer.displayName = \"Container\"\n\nconst LineClamp = styled.div<{ lineClamp: number }>`\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: ${(props) => props.lineClamp};\n  line-clamp: ${(props) => props.lineClamp};\n  overflow: hidden;\n`\n"],"mappings":"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"}
+{"version":3,"file":"ReadMore.js","names":["_react","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_Clickable","_Text","_Box","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","_typeof","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_slicedToArray","arr","i","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","length","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","ReadMore","exports","_ref","expandedHTML","content","disabled","defaultExpanded","_ref$maxLines","maxLines","Infinity","onReadLessClicked","onReadMoreClicked","ref","useRef","_useState","useState","_useState2","overflowing","setOverflowing","_useState3","_useState4","expanded","setExpanded","maxLinesToShow","handleClick","prevExpanded","nextExpanded","handleResize","current","shouldExpand","scrollHeight","clientHeight","initialized","useEffect","createElement","Container","LineClamp","concat","lineClamp","Box","position","dangerouslySetInnerHTML","__html","Clickable","cursor","textDecoration","onClick","display","width","Text","variant","fontWeight","displayName","styled","div","withConfig","componentId","props"],"sources":["../../../src/elements/ReadMore/ReadMore.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\"\nimport styled from \"styled-components\"\nimport { Clickable } from \"../Clickable\"\nimport { Text } from \"../Text\"\nimport { Box } from \"../Box\"\n\nexport interface ReadMoreProps {\n  content: string\n  disabled?: boolean\n  defaultExpanded?: boolean\n  maxLines?: number\n  onReadLessClicked?: () => void\n  onReadMoreClicked?: () => void\n}\n\nexport const ReadMore: React.FC<React.PropsWithChildren<ReadMoreProps>> = ({\n  content: expandedHTML,\n  disabled,\n  defaultExpanded,\n  maxLines = Infinity,\n  onReadLessClicked,\n  onReadMoreClicked,\n}) => {\n  const ref = useRef<HTMLDivElement>(null)\n\n  const [overflowing, setOverflowing] = useState(false)\n  const [expanded, setExpanded] = useState(!!defaultExpanded)\n\n  const maxLinesToShow = expanded ? Infinity : maxLines\n\n  const handleClick = () => {\n    if (disabled) return\n\n    setExpanded((prevExpanded) => {\n      const nextExpanded = !prevExpanded\n      nextExpanded ? onReadMoreClicked?.() : onReadLessClicked?.()\n      return nextExpanded\n    })\n  }\n\n  const handleResize = () => {\n    if (!ref.current) return false\n\n    const shouldExpand = ref.current.scrollHeight > ref.current.clientHeight\n    setOverflowing(shouldExpand)\n\n    return shouldExpand\n  }\n\n  const initialized = useRef(false)\n\n  useEffect(() => {\n    if (initialized.current) return\n\n    const shouldExpand = handleResize()\n    if (!shouldExpand) setExpanded(true)\n\n    initialized.current = true\n  }, [])\n\n  return (\n    <Container aria-expanded={expanded}>\n      <LineClamp\n        key={`${expanded}`} // Forces a re-render on Mobile Safari\n        ref={ref}\n        lineClamp={maxLinesToShow}\n      >\n        {/* LineClamp's `display` causes stacking of margins. Nested div ensures internal margins collapse. */}\n        <Box\n          position=\"relative\"\n          dangerouslySetInnerHTML={{\n            __html: expandedHTML,\n          }}\n        />\n      </LineClamp>\n\n      {overflowing && (\n        <Clickable\n          cursor=\"pointer\"\n          textDecoration=\"underline\"\n          onClick={handleClick}\n          display=\"block\"\n          width=\"100%\"\n        >\n          <Text variant=\"xs\" fontWeight=\"bold\">\n            Read {expanded ? \"less\" : \"more\"}\n          </Text>\n        </Clickable>\n      )}\n    </Container>\n  )\n}\n\nconst Container = styled.div`\n  position: relative;\n`\n\nContainer.displayName = \"Container\"\n\nconst LineClamp = styled.div<{ lineClamp: number }>`\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: ${(props) => props.lineClamp};\n  line-clamp: ${(props) => props.lineClamp};\n  overflow: hidden;\n`\n"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@artsy/palette",
-  "version": "45.1.0",
+  "version": "45.3.0",
   "description": "Design system library for react components",
   "main": "dist/index.js",
   "publishConfig": {
@@ -191,5 +191,5 @@
       "url": "http://localhost"
     }
   },
-  "gitHead": "a2560f5fe7c1f60d8854aa3689e15ecfed930228"
+  "gitHead": "076599faab06ee45dc095fb484ce0f213deb24a9"
 }