@mirohq/design-system-popover 5.1.11 → 5.1.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/main.js.map +1 -1
  2. package/dist/module.js.map +1 -1
  3. package/dist/types.d.ts +530 -9
  4. package/package.json +2 -2
package/dist/main.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"main.js","sources":["../src/partials/trigger.styled.tsx","../src/partials/trigger.tsx","../src/partials/content.styled.tsx","../src/partials/line.styled.tsx","../src/partials/line.tsx","../src/partials/arrow.styled.tsx","../src/use-popover-context.tsx","../src/partials/arrow.tsx","../src/partials/content.tsx","../src/partials/close.styled.tsx","../src/partials/close.tsx","../src/partials/portal.tsx","../src/popover.tsx"],"sourcesContent":["import { Trigger as RadixTrigger } from '@radix-ui/react-popover'\nimport { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\nexport const StyledTrigger = styled(RadixTrigger)\nexport type StyledTriggerProps = StrictComponentProps<typeof StyledTrigger>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { StyledTrigger } from './trigger.styled'\nimport type { StyledTriggerProps } from './trigger.styled'\n\nexport interface TriggerProps extends StyledTriggerProps {}\n\n/**\n * The trigger component is used to render the trigger element for the popover.\n */\nexport const Trigger = React.forwardRef<\n ElementRef<typeof StyledTrigger>,\n TriggerProps\n>((props, forwardRef) => <StyledTrigger {...props} ref={forwardRef} />)\n","import { Content as RadixContent } from '@radix-ui/react-popover'\nimport { styled } from '@mirohq/design-system-stitches'\nimport { animations } from '@mirohq/design-system-styles'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\nexport const StyledContent = styled(RadixContent, {\n backgroundColor: '$black',\n borderRadius: '$50',\n color: '$white',\n padding: '$200',\n boxShadow: '0 $1 $4 rgba(9, 9, 9, 0.4)',\n fontSize: '14px',\n lineHeight: '20px',\n '@media (prefers-reduced-motion: no-preference)': {\n animationDuration: '220ms',\n animationTimingFunction: 'ease',\n willChange: 'opacity',\n '&[data-state=\"open\"]': {\n animationName: animations.fadeIn,\n },\n '&[data-state=\"closed\"]': {\n animationName: animations.fadeOut,\n },\n },\n variants: {\n variant: {\n light: {\n background: '$white',\n boxShadow: '$50',\n color: '$black',\n },\n dark: {},\n },\n },\n zIndex: '$popover',\n})\n\nexport type StyledContentProps = StrictComponentProps<typeof StyledContent>\n","import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\nimport type { CSSProperties } from '@stitches/react'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\ntype Side = 'top' | 'right' | 'bottom' | 'left'\n\ninterface AlignStyle {\n [x: string]: CSSProperties\n}\n\nconst getAlignXStyle = (side: Side, width: number): AlignStyle => ({\n [`[data-side=\"${side}\"][data-align=\"start\"] > &`]: {\n left: `${width * 2}px`,\n },\n [`[data-side=\"${side}\"][data-align=\"center\"] > &`]: {\n left: `calc(50% - ${width / 2}px)`,\n },\n [`[data-side=\"${side}\"][data-align=\"end\"] > &`]: {\n left: `calc(100% - ${width * 3}px)`,\n },\n})\n\nconst getAlignYStyle = (\n side: Side,\n width: number,\n height: number\n): AlignStyle => ({\n [`[data-side=\"${side}\"][data-align=\"start\"] > &`]: {\n bottom: `calc(100% - (${height - width}px))`,\n },\n [`[data-side=\"${side}\"][data-align=\"center\"] > &`]: {\n bottom: `calc(50% - ${height / 2}px)`,\n },\n [`[data-side=\"${side}\"][data-align=\"end\"] > &`]: { bottom: `-${width}px` },\n})\n\nexport const getPlacement = (width: number, height: number): any => {\n const halfHeight = height / 2\n const halfWidth = width / 2\n\n return {\n '[data-side=\"top\"] > &': { bottom: `-${height}px` },\n ...getAlignXStyle('top', width),\n '[data-side=\"bottom\"] > &': {\n bottom: '100%',\n transform: 'rotate(180deg)',\n },\n ...getAlignXStyle('bottom', width),\n '[data-side=\"right\"] > &': {\n left: `-${halfHeight + halfWidth}px`,\n transform: 'rotate(90deg)',\n },\n ...getAlignYStyle('right', width, height),\n '[data-side=\"left\"] > &': {\n left: `calc(100% + ${halfHeight - halfWidth}px)`,\n transform: 'rotate(270deg)',\n },\n ...getAlignYStyle('left', width, height),\n }\n}\n\nexport const StyledLine = styled(Primitive.span, {\n width: '6px',\n height: '50px',\n position: 'absolute',\n rect: {\n fill: '$black',\n },\n 'svg #line': {\n width: '44px',\n height: '1px',\n transform: 'rotate(90 3.5 0)',\n },\n 'svg #circle': {\n width: '6px',\n height: '6px',\n rx: '3px',\n transform: 'rotate(90 6 44)',\n },\n})\n\nexport type StyledLineProps = StrictComponentProps<typeof StyledLine>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { StyledLine, getPlacement } from './line.styled'\nimport type { StyledLineProps } from './line.styled'\n\nexport interface LineProps extends StyledLineProps {}\n\nexport const Line = React.forwardRef<ElementRef<typeof StyledLine>, LineProps>(\n (props, forwardRef) => {\n const placement = getPlacement(6, 50)\n return (\n <StyledLine\n {...props}\n css={{ ...placement }}\n ref={forwardRef}\n aria-hidden\n >\n <svg viewBox='0 0 6 50'>\n <rect id='line' x='3.5' transform='rotate(90 3.5 0)' />\n <rect id='circle' x='6' y='44' transform='rotate(90 6 44)' />\n </svg>\n </StyledLine>\n )\n }\n)\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { Arrow as RadixArrow } from '@radix-ui/react-popover'\n\nexport const StyledArrow = styled(RadixArrow, {\n fill: '$black',\n height: '$1',\n paddingX: '2px',\n width: '$3',\n variants: {\n variant: {\n light: {\n fill: '$white',\n },\n dark: {},\n },\n },\n})\n\nexport type StyledArrowProps = StrictComponentProps<typeof StyledArrow>\n","import React, { createContext, useContext } from 'react'\nimport type { PropsWithChildren } from 'react'\n\nimport type { Variant } from './types'\n\ninterface PopoverValues {\n variant?: Variant\n}\n\ninterface PopoverContextProps {\n variant?: Variant\n}\n\nconst PopoverContext = createContext<PopoverContextProps>({} as any)\n\n/**\n * The PopoverProvider is used to manage the state of the popover,\n * when it opens or closes, and what triggers it.\n */\nexport const PopoverProvider = ({\n children,\n variant,\n}: PropsWithChildren<PopoverValues>): any => (\n <PopoverContext.Provider\n value={{\n variant,\n }}\n >\n {children}\n </PopoverContext.Provider>\n)\n\n/**\n * The usePopoverContext hook is used to access the state of the popover.\n */\nexport const usePopoverContext = (): PopoverContextProps =>\n useContext(PopoverContext)\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { StyledArrow } from './arrow.styled'\nimport type { StyledArrowProps } from './arrow.styled'\nimport { usePopoverContext } from '../use-popover-context'\n\nexport interface ArrowProps extends StyledArrowProps {}\n\nexport const Arrow = React.forwardRef<\n ElementRef<typeof StyledArrow>,\n ArrowProps\n>((props, forwardRef) => {\n const { variant } = usePopoverContext()\n return (\n <StyledArrow {...props} variant={variant} aria-hidden ref={forwardRef} />\n )\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\nimport { useSize } from '@radix-ui/react-use-size'\n\nimport { StyledContent } from './content.styled'\nimport { Line } from './line'\nimport { Arrow } from './arrow'\nimport { usePopoverContext } from '../use-popover-context'\nimport type { StyledContentProps } from './content.styled'\nimport type {\n Align,\n Side,\n AnchorType,\n PointerDownOutsideEvent,\n FocusOutsideEvent,\n} from '../types'\n\nexport interface ContentProps extends StyledContentProps {\n /**\n * When true, overrides the side and align preferences to prevent collisions\n * with window edges.\n */\n avoidCollisions?: boolean\n\n /**\n * The preferred alignment against the trigger. May change when collisions occur.\n */\n align?: Align\n\n /**\n * An offset in pixels from the \"start\" or \"end\" alignment option.\n */\n alignOffset?: number\n\n /**\n * The distance in pixels from the trigger's edge to the popover's anchor. Works only with the \"arrow\" or \"none\"\n * anchor.\n */\n sideOffset?: number\n\n /**\n * The preferred side of the trigger to render against when open.\n * Will be reversed when collisions occur and avoidCollisions is enabled.\n */\n side?: Side\n\n /**\n * The distance in pixels from the boundary edges where collision detection\n * should occur. Accepts a number (same for all sides).\n */\n collisionPadding?: number\n\n /**\n * The type of anchor to render.\n */\n anchor?: AnchorType\n\n /**\n * Whether to render in a Portal when open.\n */\n portalled?: boolean\n\n /**\n * Used to force mounting when more control is needed. Useful when controlling\n * animation with React animation libraries.\n */\n forceMount?: true\n\n /**\n * The element used as the collision boundary. By default this is the\n * viewport, though you can provide additional element(s) to be included in\n * this check.\n */\n collisionBoundary?: Element | null\n\n /**\n * The sticky behavior on the align axis. \"partial\" will keep the content in\n * the boundary as long as the trigger is at least partially in the boundary\n * whilst \"always\" will keep the content in the boundary regardless.\n */\n sticky?: 'partial' | 'always'\n\n /**\n * Whether to hide the content when the trigger becomes fully occluded.\n */\n hideWhenDetached?: boolean\n\n /**\n * Event handler called when a pointer event occurs outside the bounds of the\n * component. It can be prevented by calling event.preventDefault.\n */\n onPointerDownOutside?: (event: PointerDownOutsideEvent) => void\n\n /**\n * Event handler called when focus moves outside the bounds of the component.\n * It can be prevented by calling event.preventDefault.\n */\n onFocusOutside?: (event: FocusOutsideEvent) => void\n\n /**\n * Event handler called when the escape key is down. It can be prevented by\n * calling event.preventDefault.\n */\n onEscapeKeyDown?: (event: KeyboardEvent) => void\n\n /**\n * Event handler called when an interaction (pointer or focus event) happens\n * outside the bounds of the component. It can be prevented by calling\n * event.preventDefault.\n */\n onInteractOutside?: (\n event: PointerDownOutsideEvent | FocusOutsideEvent\n ) => void\n\n /**\n * Event handler called when focus moves into the component after opening.\n * It can be prevented by calling event.preventDefault().\n */\n onOpenAutoFocus?: (event: Event) => void\n\n /**\n * Event handler called when focus moves to the trigger after closing.\n * It can be prevented by calling event.preventDefault().\n */\n onCloseAutoFocus?: (event: Event) => void\n}\n\n/**\n * The content component is used to render rich content elements for the popover.\n */\nexport const Content = React.forwardRef<\n ElementRef<typeof StyledContent>,\n ContentProps\n>(\n (\n {\n align = 'center',\n alignOffset = 0,\n sideOffset = 0,\n avoidCollisions = true,\n collisionPadding = 0,\n side = 'top',\n children,\n anchor = 'line',\n sticky = 'partial',\n hideWhenDetached = false,\n ...restProps\n },\n forwardRef\n ) => {\n const [line, setLine] = React.useState<HTMLElement | null>(null)\n const lineSize = useSize(line)\n const { variant } = usePopoverContext()\n\n const anchorEl = React.useMemo(() => {\n switch (anchor) {\n case 'arrow':\n return <Arrow />\n case 'line':\n return <Line ref={setLine} />\n default:\n return null\n }\n }, [anchor, setLine])\n\n return (\n <StyledContent\n {...restProps}\n align={align}\n alignOffset={alignOffset}\n avoidCollisions={avoidCollisions}\n collisionPadding={collisionPadding}\n side={side}\n sideOffset={anchor === 'line' ? lineSize?.height : sideOffset}\n ref={forwardRef}\n role='dialog'\n aria-modal='true'\n sticky={sticky}\n hideWhenDetached={hideWhenDetached}\n variant={variant}\n >\n {children}\n {anchorEl}\n </StyledContent>\n )\n }\n)\n","import { Close as RadixClose } from '@radix-ui/react-popover'\nimport { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\nexport const StyledClose = styled(RadixClose, {\n all: 'unset',\n fontFamily: 'inherit',\n height: '$6',\n width: '$6',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n color: '$white',\n position: 'absolute',\n top: '5px',\n right: '5px',\n borderRadius: '$50',\n cursor: 'pointer',\n\n '&:hover': {\n backgroundColor: 'rgba(255, 255, 255, 0.12)',\n },\n '&:focus-visible': {\n boxShadow: '$focus-controls',\n },\n\n variants: {\n variant: {\n light: {\n color: '$black',\n },\n dark: {\n '&:focus-visible': {\n boxShadow:\n '0 0 0 1px #0F0F0F, 0 0 0 3px #6881FF, 0 0 0 5px #4961f699',\n },\n },\n },\n },\n})\n\nexport type StyledCloseProps = StrictComponentProps<typeof StyledClose>\n","import React from 'react'\nimport { IconCross } from '@mirohq/design-system-icons'\nimport type { ElementRef } from 'react'\n\nimport { StyledClose } from './close.styled'\nimport { usePopoverContext } from '../use-popover-context'\nimport type { StyledCloseProps } from './close.styled'\n\nexport interface CloseProps extends StyledCloseProps {}\n\nexport const Close = React.forwardRef<\n ElementRef<typeof StyledClose>,\n CloseProps\n>((props, forwardRef) => {\n const { variant } = usePopoverContext()\n\n return (\n <StyledClose\n {...props}\n ref={forwardRef}\n data-testid='close-icon'\n variant={variant}\n >\n <IconCross size='small' />\n </StyledClose>\n )\n})\n","import React from 'react'\nimport type { PopoverPortalProps } from '@radix-ui/react-popover'\nimport { Portal as RadixPortal } from '@radix-ui/react-popover'\n\nexport interface PortalProps extends PopoverPortalProps {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries. If used on this part,\n * it will be inherited by Popover.Content.\n */\n forceMount?: true\n\n /**\n * Specify a container element to portal the content into.\n */\n container?: HTMLElement | null\n}\n\nexport const Portal: React.FC<PortalProps> = props => <RadixPortal {...props} />\n","import React from 'react'\nimport * as RadixPopover from '@radix-ui/react-popover'\n\nimport { Trigger } from './partials/trigger'\nimport { Content } from './partials/content'\nimport { Close } from './partials/close'\nimport { Portal } from './partials/portal'\nimport { PopoverProvider } from './use-popover-context'\nimport type { Variant } from './types'\n\nexport interface PopoverProps {\n /**\n * The current controlled state of the popover.\n */\n open?: boolean\n\n /**\n * The initial open state of the popover. Use when you don't need to control its open state.\n */\n defaultOpen?: boolean\n\n /**\n * Event handler called when the popover opens.\n */\n onOpen?: () => void\n\n /**\n * Event handler called when the popover closes.\n */\n onClose?: () => void\n\n /**\n * Defines whether the interaction with outside elements will be enabled.\n */\n interactOutside?: boolean\n\n /**\n * Change the popover's appearance\n */\n variant?: Variant\n\n /**\n * The content\n */\n children: React.ReactNode\n}\n\nconst Root: React.FC<PopoverProps> = ({ onOpen, onClose, ...restProps }) => (\n <RadixPopover.Root\n {...restProps}\n onOpenChange={value => {\n if (value) {\n onOpen?.()\n } else {\n onClose?.()\n }\n }}\n modal={false}\n />\n)\n\nexport const Popover: React.FC<PopoverProps> & Partials = ({\n open,\n defaultOpen = false,\n onOpen,\n onClose,\n variant = 'dark',\n ...restProps\n}) => (\n <PopoverProvider variant={variant}>\n <Root\n {...restProps}\n open={open}\n defaultOpen={defaultOpen}\n onOpen={onOpen}\n onClose={onClose}\n />\n </PopoverProvider>\n)\n\n// Partials\n// -----------------------------------------------------------------------------\n\nexport interface Partials {\n Trigger: typeof Trigger\n Content: typeof Content\n Close: typeof Close\n Portal: typeof Portal\n Anchor: typeof RadixPopover.Anchor\n}\n\nPopover.Trigger = Trigger\nPopover.Content = Content\nPopover.Close = Close\nPopover.Portal = Portal\nPopover.Anchor = RadixPopover.Anchor\n"],"names":["styled","RadixTrigger","React","jsx","RadixContent","animations","Primitive","jsxs","RadixArrow","createContext","useContext","useSize","RadixClose","IconCross","RadixPortal","RadixPopover"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIa,MAAA,aAAA,GAAgBA,4BAAOC,oBAAY,CAAA;;ACOzC,MAAM,OAAU,GAAAC,yBAAA,CAAM,UAG3B,CAAA,CAAC,KAAO,EAAA,UAAA,qBAAgBC,cAAA,CAAA,aAAA,EAAA,EAAe,GAAG,KAAA,EAAO,GAAK,EAAA,UAAA,EAAY,CAAE,CAAA;;ACTzD,MAAA,aAAA,GAAgBH,4BAAOI,oBAAc,EAAA;AAAA,EAChD,eAAiB,EAAA,QAAA;AAAA,EACjB,YAAc,EAAA,KAAA;AAAA,EACd,KAAO,EAAA,QAAA;AAAA,EACP,OAAS,EAAA,MAAA;AAAA,EACT,SAAW,EAAA,4BAAA;AAAA,EACX,QAAU,EAAA,MAAA;AAAA,EACV,UAAY,EAAA,MAAA;AAAA,EACZ,gDAAkD,EAAA;AAAA,IAChD,iBAAmB,EAAA,OAAA;AAAA,IACnB,uBAAyB,EAAA,MAAA;AAAA,IACzB,UAAY,EAAA,SAAA;AAAA,IACZ,sBAAwB,EAAA;AAAA,MACtB,eAAeC,6BAAW,CAAA,MAAA;AAAA,KAC5B;AAAA,IACA,wBAA0B,EAAA;AAAA,MACxB,eAAeA,6BAAW,CAAA,OAAA;AAAA,KAC5B;AAAA,GACF;AAAA,EACA,QAAU,EAAA;AAAA,IACR,OAAS,EAAA;AAAA,MACP,KAAO,EAAA;AAAA,QACL,UAAY,EAAA,QAAA;AAAA,QACZ,SAAW,EAAA,KAAA;AAAA,QACX,KAAO,EAAA,QAAA;AAAA,OACT;AAAA,MACA,MAAM,EAAC;AAAA,KACT;AAAA,GACF;AAAA,EACA,MAAQ,EAAA,UAAA;AACV,CAAC,CAAA;;ACxBD,MAAM,cAAA,GAAiB,CAAC,IAAA,EAAY,KAA+B,MAAA;AAAA,EACjE,CAAC,cAAA,CAAe,MAAI,CAAA,IAAA,EAAA,4BAAA,CAA4B,GAAG;AAAA,IACjD,IAAA,EAAM,EAAG,CAAA,MAAA,CAAA,KAAA,GAAQ,CAAC,EAAA,IAAA,CAAA;AAAA,GACpB;AAAA,EACA,CAAC,cAAA,CAAe,MAAI,CAAA,IAAA,EAAA,6BAAA,CAA6B,GAAG;AAAA,IAClD,IAAA,EAAM,aAAc,CAAA,MAAA,CAAA,KAAA,GAAQ,CAAC,EAAA,KAAA,CAAA;AAAA,GAC/B;AAAA,EACA,CAAC,cAAA,CAAe,MAAI,CAAA,IAAA,EAAA,0BAAA,CAA0B,GAAG;AAAA,IAC/C,IAAA,EAAM,cAAe,CAAA,MAAA,CAAA,KAAA,GAAQ,CAAC,EAAA,KAAA,CAAA;AAAA,GAChC;AACF,CAAA,CAAA,CAAA;AAEA,MAAM,cAAiB,GAAA,CACrB,IACA,EAAA,KAAA,EACA,MACgB,MAAA;AAAA,EAChB,CAAC,cAAA,CAAe,MAAI,CAAA,IAAA,EAAA,4BAAA,CAA4B,GAAG;AAAA,IACjD,MAAA,EAAQ,eAAgB,CAAA,MAAA,CAAA,MAAA,GAAS,KAAK,EAAA,MAAA,CAAA;AAAA,GACxC;AAAA,EACA,CAAC,cAAA,CAAe,MAAI,CAAA,IAAA,EAAA,6BAAA,CAA6B,GAAG;AAAA,IAClD,MAAA,EAAQ,aAAc,CAAA,MAAA,CAAA,MAAA,GAAS,CAAC,EAAA,KAAA,CAAA;AAAA,GAClC;AAAA,EACA,CAAC,eAAe,MAAI,CAAA,IAAA,EAAA,0BAAA,CAA0B,GAAG,EAAE,MAAA,EAAQ,GAAI,CAAA,MAAA,CAAA,KAAA,EAAK,IAAK,CAAA,EAAA;AAC3E,CAAA,CAAA,CAAA;AAEa,MAAA,YAAA,GAAe,CAAC,KAAA,EAAe,MAAwB,KAAA;AAClE,EAAA,MAAM,aAAa,MAAS,GAAA,CAAA,CAAA;AAC5B,EAAA,MAAM,YAAY,KAAQ,GAAA,CAAA,CAAA;AAE1B,EAAO,OAAA;AAAA,IACL,uBAAyB,EAAA,EAAE,MAAQ,EAAA,GAAA,CAAI,eAAM,IAAK,CAAA,EAAA;AAAA,IAClD,GAAG,cAAe,CAAA,KAAA,EAAO,KAAK,CAAA;AAAA,IAC9B,0BAA4B,EAAA;AAAA,MAC1B,MAAQ,EAAA,MAAA;AAAA,MACR,SAAW,EAAA,gBAAA;AAAA,KACb;AAAA,IACA,GAAG,cAAe,CAAA,QAAA,EAAU,KAAK,CAAA;AAAA,IACjC,yBAA2B,EAAA;AAAA,MACzB,IAAA,EAAM,GAAI,CAAA,MAAA,CAAA,UAAA,GAAa,SAAS,EAAA,IAAA,CAAA;AAAA,MAChC,SAAW,EAAA,eAAA;AAAA,KACb;AAAA,IACA,GAAG,cAAA,CAAe,OAAS,EAAA,KAAA,EAAO,MAAM,CAAA;AAAA,IACxC,wBAA0B,EAAA;AAAA,MACxB,IAAA,EAAM,cAAe,CAAA,MAAA,CAAA,UAAA,GAAa,SAAS,EAAA,KAAA,CAAA;AAAA,MAC3C,SAAW,EAAA,gBAAA;AAAA,KACb;AAAA,IACA,GAAG,cAAA,CAAe,MAAQ,EAAA,KAAA,EAAO,MAAM,CAAA;AAAA,GACzC,CAAA;AACF,CAAA,CAAA;AAEa,MAAA,UAAA,GAAaL,2BAAO,CAAAM,+BAAA,CAAU,IAAM,EAAA;AAAA,EAC/C,KAAO,EAAA,KAAA;AAAA,EACP,MAAQ,EAAA,MAAA;AAAA,EACR,QAAU,EAAA,UAAA;AAAA,EACV,IAAM,EAAA;AAAA,IACJ,IAAM,EAAA,QAAA;AAAA,GACR;AAAA,EACA,WAAa,EAAA;AAAA,IACX,KAAO,EAAA,MAAA;AAAA,IACP,MAAQ,EAAA,KAAA;AAAA,IACR,SAAW,EAAA,kBAAA;AAAA,GACb;AAAA,EACA,aAAe,EAAA;AAAA,IACb,KAAO,EAAA,KAAA;AAAA,IACP,MAAQ,EAAA,KAAA;AAAA,IACR,EAAI,EAAA,KAAA;AAAA,IACJ,SAAW,EAAA,iBAAA;AAAA,GACb;AACF,CAAC,CAAA;;ACxEM,MAAM,OAAOJ,yBAAM,CAAA,UAAA;AAAA,EACxB,CAAC,OAAO,UAAe,KAAA;AACrB,IAAM,MAAA,SAAA,GAAY,YAAa,CAAA,CAAA,EAAG,EAAE,CAAA,CAAA;AACpC,IACE,uBAAAC,cAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACE,GAAG,KAAA;AAAA,QACJ,GAAA,EAAK,EAAE,GAAG,SAAU,EAAA;AAAA,QACpB,GAAK,EAAA,UAAA;AAAA,QACL,aAAW,EAAA,IAAA;AAAA,QAEX,QAAA,kBAAAI,eAAA,CAAC,KAAI,EAAA,EAAA,OAAA,EAAQ,UACX,EAAA,QAAA,EAAA;AAAA,0BAAAJ,cAAA,CAAC,UAAK,EAAG,EAAA,MAAA,EAAO,CAAE,EAAA,KAAA,EAAM,WAAU,kBAAmB,EAAA,CAAA;AAAA,0BACrDA,cAAA,CAAC,UAAK,EAAG,EAAA,QAAA,EAAS,GAAE,GAAI,EAAA,CAAA,EAAE,IAAK,EAAA,SAAA,EAAU,iBAAkB,EAAA,CAAA;AAAA,SAC7D,EAAA,CAAA;AAAA,OAAA;AAAA,KACF,CAAA;AAAA,GAEJ;AACF,CAAA;;ACrBa,MAAA,WAAA,GAAcH,4BAAOQ,kBAAY,EAAA;AAAA,EAC5C,IAAM,EAAA,QAAA;AAAA,EACN,MAAQ,EAAA,IAAA;AAAA,EACR,QAAU,EAAA,KAAA;AAAA,EACV,KAAO,EAAA,IAAA;AAAA,EACP,QAAU,EAAA;AAAA,IACR,OAAS,EAAA;AAAA,MACP,KAAO,EAAA;AAAA,QACL,IAAM,EAAA,QAAA;AAAA,OACR;AAAA,MACA,MAAM,EAAC;AAAA,KACT;AAAA,GACF;AACF,CAAC,CAAA;;ACJD,MAAM,cAAA,GAAiBC,mBAAmC,CAAA,EAAS,CAAA,CAAA;AAM5D,MAAM,kBAAkB,CAAC;AAAA,EAC9B,QAAA;AAAA,EACA,OAAA;AACF,CACE,qBAAAN,cAAA;AAAA,EAAC,cAAe,CAAA,QAAA;AAAA,EAAf;AAAA,IACC,KAAO,EAAA;AAAA,MACL,OAAA;AAAA,KACF;AAAA,IAEC,QAAA;AAAA,GAAA;AACH,CAAA,CAAA;AAMW,MAAA,iBAAA,GAAoB,MAC/BO,gBAAA,CAAW,cAAc,CAAA;;AC3BpB,MAAM,KAAQ,GAAAR,yBAAA,CAAM,UAGzB,CAAA,CAAC,OAAO,UAAe,KAAA;AACvB,EAAM,MAAA,EAAE,OAAQ,EAAA,GAAI,iBAAkB,EAAA,CAAA;AACtC,EACE,uBAAAC,cAAA,CAAC,eAAa,GAAG,KAAA,EAAO,SAAkB,aAAW,EAAA,IAAA,EAAC,KAAK,UAAY,EAAA,CAAA,CAAA;AAE3E,CAAC,CAAA;;ACiHM,MAAM,UAAUD,yBAAM,CAAA,UAAA;AAAA,EAI3B,CACE;AAAA,IACE,KAAQ,GAAA,QAAA;AAAA,IACR,WAAc,GAAA,CAAA;AAAA,IACd,UAAa,GAAA,CAAA;AAAA,IACb,eAAkB,GAAA,IAAA;AAAA,IAClB,gBAAmB,GAAA,CAAA;AAAA,IACnB,IAAO,GAAA,KAAA;AAAA,IACP,QAAA;AAAA,IACA,MAAS,GAAA,MAAA;AAAA,IACT,MAAS,GAAA,SAAA;AAAA,IACT,gBAAmB,GAAA,KAAA;AAAA,IACnB,GAAG,SAAA;AAAA,KAEL,UACG,KAAA;AACH,IAAA,MAAM,CAAC,IAAM,EAAA,OAAO,CAAI,GAAAA,yBAAA,CAAM,SAA6B,IAAI,CAAA,CAAA;AAC/D,IAAM,MAAA,QAAA,GAAWS,qBAAQ,IAAI,CAAA,CAAA;AAC7B,IAAM,MAAA,EAAE,OAAQ,EAAA,GAAI,iBAAkB,EAAA,CAAA;AAEtC,IAAM,MAAA,QAAA,GAAWT,yBAAM,CAAA,OAAA,CAAQ,MAAM;AACnC,MAAA,QAAQ,MAAQ;AAAA,QACd,KAAK,OAAA;AACH,UAAA,sCAAQ,KAAM,EAAA,EAAA,CAAA,CAAA;AAAA,QAChB,KAAK,MAAA;AACH,UAAO,uBAAAC,cAAA,CAAC,IAAK,EAAA,EAAA,GAAA,EAAK,OAAS,EAAA,CAAA,CAAA;AAAA,QAC7B;AACE,UAAO,OAAA,IAAA,CAAA;AAAA,OACX;AAAA,KACC,EAAA,CAAC,MAAQ,EAAA,OAAO,CAAC,CAAA,CAAA;AAEpB,IACE,uBAAAI,eAAA;AAAA,MAAC,aAAA;AAAA,MAAA;AAAA,QACE,GAAG,SAAA;AAAA,QACJ,KAAA;AAAA,QACA,WAAA;AAAA,QACA,eAAA;AAAA,QACA,gBAAA;AAAA,QACA,IAAA;AAAA,QACA,UAAY,EAAA,MAAA,KAAW,MAAS,GAAA,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAU,MAAS,GAAA,UAAA;AAAA,QACnD,GAAK,EAAA,UAAA;AAAA,QACL,IAAK,EAAA,QAAA;AAAA,QACL,YAAW,EAAA,MAAA;AAAA,QACX,MAAA;AAAA,QACA,gBAAA;AAAA,QACA,OAAA;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,QAAA;AAAA,UACA,QAAA;AAAA,SAAA;AAAA,OAAA;AAAA,KACH,CAAA;AAAA,GAEJ;AACF,CAAA;;ACtLa,MAAA,WAAA,GAAcP,4BAAOY,kBAAY,EAAA;AAAA,EAC5C,GAAK,EAAA,OAAA;AAAA,EACL,UAAY,EAAA,SAAA;AAAA,EACZ,MAAQ,EAAA,IAAA;AAAA,EACR,KAAO,EAAA,IAAA;AAAA,EACP,OAAS,EAAA,MAAA;AAAA,EACT,UAAY,EAAA,QAAA;AAAA,EACZ,cAAgB,EAAA,QAAA;AAAA,EAChB,KAAO,EAAA,QAAA;AAAA,EACP,QAAU,EAAA,UAAA;AAAA,EACV,GAAK,EAAA,KAAA;AAAA,EACL,KAAO,EAAA,KAAA;AAAA,EACP,YAAc,EAAA,KAAA;AAAA,EACd,MAAQ,EAAA,SAAA;AAAA,EAER,SAAW,EAAA;AAAA,IACT,eAAiB,EAAA,2BAAA;AAAA,GACnB;AAAA,EACA,iBAAmB,EAAA;AAAA,IACjB,SAAW,EAAA,iBAAA;AAAA,GACb;AAAA,EAEA,QAAU,EAAA;AAAA,IACR,OAAS,EAAA;AAAA,MACP,KAAO,EAAA;AAAA,QACL,KAAO,EAAA,QAAA;AAAA,OACT;AAAA,MACA,IAAM,EAAA;AAAA,QACJ,iBAAmB,EAAA;AAAA,UACjB,SACE,EAAA,2DAAA;AAAA,SACJ;AAAA,OACF;AAAA,KACF;AAAA,GACF;AACF,CAAC,CAAA;;AC7BM,MAAM,KAAQ,GAAAV,yBAAA,CAAM,UAGzB,CAAA,CAAC,OAAO,UAAe,KAAA;AACvB,EAAM,MAAA,EAAE,OAAQ,EAAA,GAAI,iBAAkB,EAAA,CAAA;AAEtC,EACE,uBAAAC,cAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACE,GAAG,KAAA;AAAA,MACJ,GAAK,EAAA,UAAA;AAAA,MACL,aAAY,EAAA,YAAA;AAAA,MACZ,OAAA;AAAA,MAEA,QAAA,kBAAAA,cAAA,CAACU,2BAAU,EAAA,EAAA,IAAA,EAAK,OAAQ,EAAA,CAAA;AAAA,KAAA;AAAA,GAC1B,CAAA;AAEJ,CAAC,CAAA;;ACRM,MAAM,MAAgC,GAAA,CAAA,KAAA,qBAAUV,cAAA,CAAAW,mBAAA,EAAA,EAAa,GAAG,KAAO,EAAA,CAAA;;AC6B9E,MAAM,OAA+B,CAAC,EAAE,QAAQ,OAAS,EAAA,GAAG,WAC1D,qBAAAX,cAAA;AAAA,EAACY,uBAAa,CAAA,IAAA;AAAA,EAAb;AAAA,IACE,GAAG,SAAA;AAAA,IACJ,cAAc,CAAS,KAAA,KAAA;AACrB,MAAA,IAAI,KAAO,EAAA;AACT,QAAA,MAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,MAAA,EAAA,CAAA;AAAA,OACK,MAAA;AACL,QAAA,OAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,OAAA,EAAA,CAAA;AAAA,OACF;AAAA,KACF;AAAA,IACA,KAAO,EAAA,KAAA;AAAA,GAAA;AACT,CAAA,CAAA;AAGK,MAAM,UAA6C,CAAC;AAAA,EACzD,IAAA;AAAA,EACA,WAAc,GAAA,KAAA;AAAA,EACd,MAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAU,GAAA,MAAA;AAAA,EACV,GAAG,SAAA;AACL,CACE,qBAAAZ,cAAA,CAAC,mBAAgB,OACf,EAAA,QAAA,kBAAAA,cAAA;AAAA,EAAC,IAAA;AAAA,EAAA;AAAA,IACE,GAAG,SAAA;AAAA,IACJ,IAAA;AAAA,IACA,WAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,GAAA;AACF,CACF,EAAA,EAAA;AAcF,OAAA,CAAQ,OAAU,GAAA,OAAA,CAAA;AAClB,OAAA,CAAQ,OAAU,GAAA,OAAA,CAAA;AAClB,OAAA,CAAQ,KAAQ,GAAA,KAAA,CAAA;AAChB,OAAA,CAAQ,MAAS,GAAA,MAAA,CAAA;AACjB,OAAA,CAAQ,SAASY,uBAAa,CAAA,MAAA;;;;;;;;;"}
1
+ {"version":3,"file":"main.js","sources":["../src/partials/trigger.styled.tsx","../src/partials/trigger.tsx","../src/partials/content.styled.tsx","../src/partials/line.styled.tsx","../src/partials/line.tsx","../src/partials/arrow.styled.tsx","../src/use-popover-context.tsx","../src/partials/arrow.tsx","../src/partials/content.tsx","../src/partials/close.styled.tsx","../src/partials/close.tsx","../src/partials/portal.tsx","../src/popover.tsx"],"sourcesContent":["import { Trigger as RadixTrigger } from '@radix-ui/react-popover'\nimport { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\nexport const StyledTrigger = styled(RadixTrigger)\nexport type StyledTriggerProps = StrictComponentProps<typeof StyledTrigger>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { StyledTrigger } from './trigger.styled'\nimport type { StyledTriggerProps } from './trigger.styled'\n\nexport interface TriggerProps extends StyledTriggerProps {}\n\n/**\n * The trigger component is used to render the trigger element for the popover.\n */\nexport const Trigger = React.forwardRef<\n ElementRef<typeof StyledTrigger>,\n TriggerProps\n>((props, forwardRef) => <StyledTrigger {...props} ref={forwardRef} />)\n","import { Content as RadixContent } from '@radix-ui/react-popover'\nimport { styled } from '@mirohq/design-system-stitches'\nimport { animations } from '@mirohq/design-system-styles'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\nexport const StyledContent = styled(RadixContent, {\n backgroundColor: '$black',\n borderRadius: '$50',\n color: '$white',\n padding: '$200',\n boxShadow: '0 $1 $4 rgba(9, 9, 9, 0.4)',\n fontSize: '14px',\n lineHeight: '20px',\n '@media (prefers-reduced-motion: no-preference)': {\n animationDuration: '220ms',\n animationTimingFunction: 'ease',\n willChange: 'opacity',\n '&[data-state=\"open\"]': {\n animationName: animations.fadeIn,\n },\n '&[data-state=\"closed\"]': {\n animationName: animations.fadeOut,\n },\n },\n variants: {\n variant: {\n light: {\n background: '$white',\n boxShadow: '$50',\n color: '$black',\n },\n dark: {},\n },\n },\n zIndex: '$popover',\n})\n\nexport type StyledContentProps = StrictComponentProps<typeof StyledContent>\n","import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\nimport type { CSSProperties } from '@stitches/react'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\ntype Side = 'top' | 'right' | 'bottom' | 'left'\n\ninterface AlignStyle {\n [x: string]: CSSProperties\n}\n\nconst getAlignXStyle = (side: Side, width: number): AlignStyle => ({\n [`[data-side=\"${side}\"][data-align=\"start\"] > &`]: {\n left: `${width * 2}px`,\n },\n [`[data-side=\"${side}\"][data-align=\"center\"] > &`]: {\n left: `calc(50% - ${width / 2}px)`,\n },\n [`[data-side=\"${side}\"][data-align=\"end\"] > &`]: {\n left: `calc(100% - ${width * 3}px)`,\n },\n})\n\nconst getAlignYStyle = (\n side: Side,\n width: number,\n height: number\n): AlignStyle => ({\n [`[data-side=\"${side}\"][data-align=\"start\"] > &`]: {\n bottom: `calc(100% - (${height - width}px))`,\n },\n [`[data-side=\"${side}\"][data-align=\"center\"] > &`]: {\n bottom: `calc(50% - ${height / 2}px)`,\n },\n [`[data-side=\"${side}\"][data-align=\"end\"] > &`]: { bottom: `-${width}px` },\n})\n\nexport const getPlacement = (width: number, height: number): any => {\n const halfHeight = height / 2\n const halfWidth = width / 2\n\n return {\n '[data-side=\"top\"] > &': { bottom: `-${height}px` },\n ...getAlignXStyle('top', width),\n '[data-side=\"bottom\"] > &': {\n bottom: '100%',\n transform: 'rotate(180deg)',\n },\n ...getAlignXStyle('bottom', width),\n '[data-side=\"right\"] > &': {\n left: `-${halfHeight + halfWidth}px`,\n transform: 'rotate(90deg)',\n },\n ...getAlignYStyle('right', width, height),\n '[data-side=\"left\"] > &': {\n left: `calc(100% + ${halfHeight - halfWidth}px)`,\n transform: 'rotate(270deg)',\n },\n ...getAlignYStyle('left', width, height),\n }\n}\n\nexport const StyledLine = styled(Primitive.span, {\n width: '6px',\n height: '50px',\n position: 'absolute',\n rect: {\n fill: '$black',\n },\n 'svg #line': {\n width: '44px',\n height: '1px',\n transform: 'rotate(90 3.5 0)',\n },\n 'svg #circle': {\n width: '6px',\n height: '6px',\n rx: '3px',\n transform: 'rotate(90 6 44)',\n },\n})\n\nexport type StyledLineProps = StrictComponentProps<typeof StyledLine>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { StyledLine, getPlacement } from './line.styled'\nimport type { StyledLineProps } from './line.styled'\n\nexport interface LineProps extends StyledLineProps {}\n\nexport const Line = React.forwardRef<ElementRef<typeof StyledLine>, LineProps>(\n (props, forwardRef) => {\n const placement = getPlacement(6, 50)\n return (\n <StyledLine\n {...props}\n css={{ ...placement }}\n ref={forwardRef}\n aria-hidden\n >\n <svg viewBox='0 0 6 50'>\n <rect id='line' x='3.5' transform='rotate(90 3.5 0)' />\n <rect id='circle' x='6' y='44' transform='rotate(90 6 44)' />\n </svg>\n </StyledLine>\n )\n }\n)\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { Arrow as RadixArrow } from '@radix-ui/react-popover'\n\nexport const StyledArrow = styled(RadixArrow, {\n fill: '$black',\n height: '$1',\n paddingX: '2px',\n width: '$3',\n variants: {\n variant: {\n light: {\n fill: '$white',\n },\n dark: {},\n },\n },\n})\n\nexport type StyledArrowProps = StrictComponentProps<typeof StyledArrow>\n","import React, { createContext, useContext } from 'react'\nimport type { PropsWithChildren } from 'react'\n\nimport type { Variant } from './types'\n\ninterface PopoverValues {\n variant?: Variant\n}\n\ninterface PopoverContextProps {\n variant?: Variant\n}\n\nconst PopoverContext = createContext<PopoverContextProps>({} as any)\n\n/**\n * The PopoverProvider is used to manage the state of the popover,\n * when it opens or closes, and what triggers it.\n */\nexport const PopoverProvider = ({\n children,\n variant,\n}: PropsWithChildren<PopoverValues>): any => (\n <PopoverContext.Provider\n value={{\n variant,\n }}\n >\n {children}\n </PopoverContext.Provider>\n)\n\n/**\n * The usePopoverContext hook is used to access the state of the popover.\n */\nexport const usePopoverContext = (): PopoverContextProps =>\n useContext(PopoverContext)\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { StyledArrow } from './arrow.styled'\nimport type { StyledArrowProps } from './arrow.styled'\nimport { usePopoverContext } from '../use-popover-context'\n\nexport interface ArrowProps extends StyledArrowProps {\n /**\n * The appearance of arrow.\n */\n variant?: StyledArrowProps['variant']\n}\n\nexport const Arrow = React.forwardRef<\n ElementRef<typeof StyledArrow>,\n ArrowProps\n>((props, forwardRef) => {\n const { variant } = usePopoverContext()\n return (\n <StyledArrow {...props} variant={variant} aria-hidden ref={forwardRef} />\n )\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\nimport { useSize } from '@radix-ui/react-use-size'\n\nimport { StyledContent } from './content.styled'\nimport { Line } from './line'\nimport { Arrow } from './arrow'\nimport { usePopoverContext } from '../use-popover-context'\nimport type { StyledContentProps } from './content.styled'\nimport type {\n Align,\n Side,\n AnchorType,\n PointerDownOutsideEvent,\n FocusOutsideEvent,\n} from '../types'\n\nexport interface ContentProps extends StyledContentProps {\n /**\n * When true, overrides the side and align preferences to prevent collisions\n * with window edges.\n * @default true\n */\n avoidCollisions?: boolean\n\n /**\n * The preferred alignment against the trigger. May change when collisions\n * occur.\n * @default 'center'\n */\n align?: Align\n\n /**\n * An offset in pixels from the \"start\" or \"end\" alignment option.\n * @default 0\n */\n alignOffset?: number\n\n /**\n * The distance in pixels from the trigger's edge to the popover's anchor.\n * Works only with the \"arrow\" or \"none\" anchor.\n * @default 0\n */\n sideOffset?: number\n\n /**\n * The preferred side of the trigger to render against when open.\n * Will be reversed when collisions occur and avoidCollisions is enabled.\n * @default 'top'\n */\n side?: Side\n\n /**\n * The distance in pixels from the boundary edges where collision detection\n * should occur. Accepts a number (same for all sides).\n * @default 0\n */\n collisionPadding?: number\n\n /**\n * The type of anchor to render.\n * @default 'line'\n */\n anchor?: AnchorType\n\n /**\n * Whether to render in a Portal when open.\n */\n portalled?: boolean\n\n /**\n * Used to force mounting when more control is needed. Useful when controlling\n * animation with React animation libraries.\n */\n forceMount?: true\n\n /**\n * The element used as the collision boundary. By default this is the\n * viewport, though you can provide additional element(s) to be included in\n * this check.\n */\n collisionBoundary?: Element | null\n\n /**\n * The sticky behavior on the align axis. \"partial\" will keep the content in\n * the boundary as long as the trigger is at least partially in the boundary\n * whilst \"always\" will keep the content in the boundary regardless.\n * @default 'partial'\n */\n sticky?: 'partial' | 'always'\n\n /**\n * Whether to hide the content when the trigger becomes fully occluded.\n * @default false\n */\n hideWhenDetached?: boolean\n\n /**\n * Event handler called when a pointer event occurs outside the bounds of the\n * component. It can be prevented by calling event.preventDefault.\n */\n onPointerDownOutside?: (event: PointerDownOutsideEvent) => void\n\n /**\n * Event handler called when focus moves outside the bounds of the component.\n * It can be prevented by calling event.preventDefault.\n */\n onFocusOutside?: (event: FocusOutsideEvent) => void\n\n /**\n * Event handler called when the escape key is down. It can be prevented by\n * calling event.preventDefault.\n */\n onEscapeKeyDown?: (event: KeyboardEvent) => void\n\n /**\n * Event handler called when an interaction (pointer or focus event) happens\n * outside the bounds of the component. It can be prevented by calling\n * event.preventDefault.\n */\n onInteractOutside?: (\n event: PointerDownOutsideEvent | FocusOutsideEvent\n ) => void\n\n /**\n * Event handler called when focus moves into the component after opening.\n * It can be prevented by calling event.preventDefault().\n */\n onOpenAutoFocus?: (event: Event) => void\n\n /**\n * Event handler called when focus moves to the trigger after closing.\n * It can be prevented by calling event.preventDefault().\n */\n onCloseAutoFocus?: (event: Event) => void\n}\n\n/**\n * The content component is used to render rich content elements for the popover.\n */\nexport const Content = React.forwardRef<\n ElementRef<typeof StyledContent>,\n ContentProps\n>(\n (\n {\n align = 'center',\n alignOffset = 0,\n sideOffset = 0,\n avoidCollisions = true,\n collisionPadding = 0,\n side = 'top',\n children,\n anchor = 'line',\n sticky = 'partial',\n hideWhenDetached = false,\n ...restProps\n },\n forwardRef\n ) => {\n const [line, setLine] = React.useState<HTMLElement | null>(null)\n const lineSize = useSize(line)\n const { variant } = usePopoverContext()\n\n const anchorEl = React.useMemo(() => {\n switch (anchor) {\n case 'arrow':\n return <Arrow />\n case 'line':\n return <Line ref={setLine} />\n default:\n return null\n }\n }, [anchor, setLine])\n\n return (\n <StyledContent\n {...restProps}\n align={align}\n alignOffset={alignOffset}\n avoidCollisions={avoidCollisions}\n collisionPadding={collisionPadding}\n side={side}\n sideOffset={anchor === 'line' ? lineSize?.height : sideOffset}\n ref={forwardRef}\n role='dialog'\n aria-modal='true'\n sticky={sticky}\n hideWhenDetached={hideWhenDetached}\n variant={variant}\n >\n {children}\n {anchorEl}\n </StyledContent>\n )\n }\n)\n","import { Close as RadixClose } from '@radix-ui/react-popover'\nimport { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\nexport const StyledClose = styled(RadixClose, {\n all: 'unset',\n fontFamily: 'inherit',\n height: '$6',\n width: '$6',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n color: '$white',\n position: 'absolute',\n top: '5px',\n right: '5px',\n borderRadius: '$50',\n cursor: 'pointer',\n\n '&:hover': {\n backgroundColor: 'rgba(255, 255, 255, 0.12)',\n },\n '&:focus-visible': {\n boxShadow: '$focus-controls',\n },\n\n variants: {\n variant: {\n light: {\n color: '$black',\n },\n dark: {\n '&:focus-visible': {\n boxShadow:\n '0 0 0 1px #0F0F0F, 0 0 0 3px #6881FF, 0 0 0 5px #4961f699',\n },\n },\n },\n },\n})\n\nexport type StyledCloseProps = StrictComponentProps<typeof StyledClose>\n","import React from 'react'\nimport { IconCross } from '@mirohq/design-system-icons'\nimport type { ElementRef } from 'react'\n\nimport { StyledClose } from './close.styled'\nimport { usePopoverContext } from '../use-popover-context'\nimport type { StyledCloseProps } from './close.styled'\n\nexport interface CloseProps extends StyledCloseProps {\n /**\n * The appearance of close's button.\n */\n variant?: StyledCloseProps['variant']\n}\n\nexport const Close = React.forwardRef<\n ElementRef<typeof StyledClose>,\n CloseProps\n>((props, forwardRef) => {\n const { variant } = usePopoverContext()\n\n return (\n <StyledClose\n {...props}\n ref={forwardRef}\n data-testid='close-icon'\n variant={variant}\n >\n <IconCross size='small' />\n </StyledClose>\n )\n})\n","import React from 'react'\nimport type { PopoverPortalProps } from '@radix-ui/react-popover'\nimport { Portal as RadixPortal } from '@radix-ui/react-popover'\n\nexport interface PortalProps extends PopoverPortalProps {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries. If used on this part,\n * it will be inherited by Popover.Content.\n */\n forceMount?: true\n\n /**\n * Specify a container element to portal the content into.\n */\n container?: HTMLElement | null\n}\n\nexport const Portal: React.FC<PortalProps> = props => <RadixPortal {...props} />\n","import React from 'react'\nimport * as RadixPopover from '@radix-ui/react-popover'\n\nimport { Trigger } from './partials/trigger'\nimport { Content } from './partials/content'\nimport { Close } from './partials/close'\nimport { Portal } from './partials/portal'\nimport { PopoverProvider } from './use-popover-context'\nimport type { Variant } from './types'\n\nexport interface PopoverProps {\n /**\n * The current controlled state of the popover.\n */\n open?: boolean\n\n /**\n * The initial open state of the popover. Use when you don't need to control\n * its open state.\n * @default false\n */\n defaultOpen?: boolean\n\n /**\n * Event handler called when the popover opens.\n */\n onOpen?: () => void\n\n /**\n * Event handler called when the popover closes.\n */\n onClose?: () => void\n\n /**\n * Defines whether the interaction with outside elements will be enabled.\n */\n interactOutside?: boolean\n\n /**\n * Change the popover's appearance.\n * @default 'dark'\n */\n variant?: Variant\n\n /**\n * The content.\n */\n children: React.ReactNode\n}\n\nconst Root: React.FC<PopoverProps> = ({ onOpen, onClose, ...restProps }) => (\n <RadixPopover.Root\n {...restProps}\n onOpenChange={value => {\n if (value) {\n onOpen?.()\n } else {\n onClose?.()\n }\n }}\n modal={false}\n />\n)\n\nexport const Popover: React.FC<PopoverProps> & Partials = ({\n open,\n defaultOpen = false,\n onOpen,\n onClose,\n variant = 'dark',\n ...restProps\n}) => (\n <PopoverProvider variant={variant}>\n <Root\n {...restProps}\n open={open}\n defaultOpen={defaultOpen}\n onOpen={onOpen}\n onClose={onClose}\n />\n </PopoverProvider>\n)\n\n// Partials\n// -----------------------------------------------------------------------------\n\nexport interface Partials {\n Trigger: typeof Trigger\n Content: typeof Content\n Close: typeof Close\n Portal: typeof Portal\n Anchor: typeof RadixPopover.Anchor\n}\n\nPopover.Trigger = Trigger\nPopover.Content = Content\nPopover.Close = Close\nPopover.Portal = Portal\nPopover.Anchor = RadixPopover.Anchor\n"],"names":["styled","RadixTrigger","React","jsx","RadixContent","animations","Primitive","jsxs","RadixArrow","createContext","useContext","useSize","RadixClose","IconCross","RadixPortal","RadixPopover"],"mappings":"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"}
package/dist/module.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"module.js","sources":["../src/partials/trigger.styled.tsx","../src/partials/trigger.tsx","../src/partials/content.styled.tsx","../src/partials/line.styled.tsx","../src/partials/line.tsx","../src/partials/arrow.styled.tsx","../src/use-popover-context.tsx","../src/partials/arrow.tsx","../src/partials/content.tsx","../src/partials/close.styled.tsx","../src/partials/close.tsx","../src/partials/portal.tsx","../src/popover.tsx"],"sourcesContent":["import { Trigger as RadixTrigger } from '@radix-ui/react-popover'\nimport { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\nexport const StyledTrigger = styled(RadixTrigger)\nexport type StyledTriggerProps = StrictComponentProps<typeof StyledTrigger>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { StyledTrigger } from './trigger.styled'\nimport type { StyledTriggerProps } from './trigger.styled'\n\nexport interface TriggerProps extends StyledTriggerProps {}\n\n/**\n * The trigger component is used to render the trigger element for the popover.\n */\nexport const Trigger = React.forwardRef<\n ElementRef<typeof StyledTrigger>,\n TriggerProps\n>((props, forwardRef) => <StyledTrigger {...props} ref={forwardRef} />)\n","import { Content as RadixContent } from '@radix-ui/react-popover'\nimport { styled } from '@mirohq/design-system-stitches'\nimport { animations } from '@mirohq/design-system-styles'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\nexport const StyledContent = styled(RadixContent, {\n backgroundColor: '$black',\n borderRadius: '$50',\n color: '$white',\n padding: '$200',\n boxShadow: '0 $1 $4 rgba(9, 9, 9, 0.4)',\n fontSize: '14px',\n lineHeight: '20px',\n '@media (prefers-reduced-motion: no-preference)': {\n animationDuration: '220ms',\n animationTimingFunction: 'ease',\n willChange: 'opacity',\n '&[data-state=\"open\"]': {\n animationName: animations.fadeIn,\n },\n '&[data-state=\"closed\"]': {\n animationName: animations.fadeOut,\n },\n },\n variants: {\n variant: {\n light: {\n background: '$white',\n boxShadow: '$50',\n color: '$black',\n },\n dark: {},\n },\n },\n zIndex: '$popover',\n})\n\nexport type StyledContentProps = StrictComponentProps<typeof StyledContent>\n","import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\nimport type { CSSProperties } from '@stitches/react'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\ntype Side = 'top' | 'right' | 'bottom' | 'left'\n\ninterface AlignStyle {\n [x: string]: CSSProperties\n}\n\nconst getAlignXStyle = (side: Side, width: number): AlignStyle => ({\n [`[data-side=\"${side}\"][data-align=\"start\"] > &`]: {\n left: `${width * 2}px`,\n },\n [`[data-side=\"${side}\"][data-align=\"center\"] > &`]: {\n left: `calc(50% - ${width / 2}px)`,\n },\n [`[data-side=\"${side}\"][data-align=\"end\"] > &`]: {\n left: `calc(100% - ${width * 3}px)`,\n },\n})\n\nconst getAlignYStyle = (\n side: Side,\n width: number,\n height: number\n): AlignStyle => ({\n [`[data-side=\"${side}\"][data-align=\"start\"] > &`]: {\n bottom: `calc(100% - (${height - width}px))`,\n },\n [`[data-side=\"${side}\"][data-align=\"center\"] > &`]: {\n bottom: `calc(50% - ${height / 2}px)`,\n },\n [`[data-side=\"${side}\"][data-align=\"end\"] > &`]: { bottom: `-${width}px` },\n})\n\nexport const getPlacement = (width: number, height: number): any => {\n const halfHeight = height / 2\n const halfWidth = width / 2\n\n return {\n '[data-side=\"top\"] > &': { bottom: `-${height}px` },\n ...getAlignXStyle('top', width),\n '[data-side=\"bottom\"] > &': {\n bottom: '100%',\n transform: 'rotate(180deg)',\n },\n ...getAlignXStyle('bottom', width),\n '[data-side=\"right\"] > &': {\n left: `-${halfHeight + halfWidth}px`,\n transform: 'rotate(90deg)',\n },\n ...getAlignYStyle('right', width, height),\n '[data-side=\"left\"] > &': {\n left: `calc(100% + ${halfHeight - halfWidth}px)`,\n transform: 'rotate(270deg)',\n },\n ...getAlignYStyle('left', width, height),\n }\n}\n\nexport const StyledLine = styled(Primitive.span, {\n width: '6px',\n height: '50px',\n position: 'absolute',\n rect: {\n fill: '$black',\n },\n 'svg #line': {\n width: '44px',\n height: '1px',\n transform: 'rotate(90 3.5 0)',\n },\n 'svg #circle': {\n width: '6px',\n height: '6px',\n rx: '3px',\n transform: 'rotate(90 6 44)',\n },\n})\n\nexport type StyledLineProps = StrictComponentProps<typeof StyledLine>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { StyledLine, getPlacement } from './line.styled'\nimport type { StyledLineProps } from './line.styled'\n\nexport interface LineProps extends StyledLineProps {}\n\nexport const Line = React.forwardRef<ElementRef<typeof StyledLine>, LineProps>(\n (props, forwardRef) => {\n const placement = getPlacement(6, 50)\n return (\n <StyledLine\n {...props}\n css={{ ...placement }}\n ref={forwardRef}\n aria-hidden\n >\n <svg viewBox='0 0 6 50'>\n <rect id='line' x='3.5' transform='rotate(90 3.5 0)' />\n <rect id='circle' x='6' y='44' transform='rotate(90 6 44)' />\n </svg>\n </StyledLine>\n )\n }\n)\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { Arrow as RadixArrow } from '@radix-ui/react-popover'\n\nexport const StyledArrow = styled(RadixArrow, {\n fill: '$black',\n height: '$1',\n paddingX: '2px',\n width: '$3',\n variants: {\n variant: {\n light: {\n fill: '$white',\n },\n dark: {},\n },\n },\n})\n\nexport type StyledArrowProps = StrictComponentProps<typeof StyledArrow>\n","import React, { createContext, useContext } from 'react'\nimport type { PropsWithChildren } from 'react'\n\nimport type { Variant } from './types'\n\ninterface PopoverValues {\n variant?: Variant\n}\n\ninterface PopoverContextProps {\n variant?: Variant\n}\n\nconst PopoverContext = createContext<PopoverContextProps>({} as any)\n\n/**\n * The PopoverProvider is used to manage the state of the popover,\n * when it opens or closes, and what triggers it.\n */\nexport const PopoverProvider = ({\n children,\n variant,\n}: PropsWithChildren<PopoverValues>): any => (\n <PopoverContext.Provider\n value={{\n variant,\n }}\n >\n {children}\n </PopoverContext.Provider>\n)\n\n/**\n * The usePopoverContext hook is used to access the state of the popover.\n */\nexport const usePopoverContext = (): PopoverContextProps =>\n useContext(PopoverContext)\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { StyledArrow } from './arrow.styled'\nimport type { StyledArrowProps } from './arrow.styled'\nimport { usePopoverContext } from '../use-popover-context'\n\nexport interface ArrowProps extends StyledArrowProps {}\n\nexport const Arrow = React.forwardRef<\n ElementRef<typeof StyledArrow>,\n ArrowProps\n>((props, forwardRef) => {\n const { variant } = usePopoverContext()\n return (\n <StyledArrow {...props} variant={variant} aria-hidden ref={forwardRef} />\n )\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\nimport { useSize } from '@radix-ui/react-use-size'\n\nimport { StyledContent } from './content.styled'\nimport { Line } from './line'\nimport { Arrow } from './arrow'\nimport { usePopoverContext } from '../use-popover-context'\nimport type { StyledContentProps } from './content.styled'\nimport type {\n Align,\n Side,\n AnchorType,\n PointerDownOutsideEvent,\n FocusOutsideEvent,\n} from '../types'\n\nexport interface ContentProps extends StyledContentProps {\n /**\n * When true, overrides the side and align preferences to prevent collisions\n * with window edges.\n */\n avoidCollisions?: boolean\n\n /**\n * The preferred alignment against the trigger. May change when collisions occur.\n */\n align?: Align\n\n /**\n * An offset in pixels from the \"start\" or \"end\" alignment option.\n */\n alignOffset?: number\n\n /**\n * The distance in pixels from the trigger's edge to the popover's anchor. Works only with the \"arrow\" or \"none\"\n * anchor.\n */\n sideOffset?: number\n\n /**\n * The preferred side of the trigger to render against when open.\n * Will be reversed when collisions occur and avoidCollisions is enabled.\n */\n side?: Side\n\n /**\n * The distance in pixels from the boundary edges where collision detection\n * should occur. Accepts a number (same for all sides).\n */\n collisionPadding?: number\n\n /**\n * The type of anchor to render.\n */\n anchor?: AnchorType\n\n /**\n * Whether to render in a Portal when open.\n */\n portalled?: boolean\n\n /**\n * Used to force mounting when more control is needed. Useful when controlling\n * animation with React animation libraries.\n */\n forceMount?: true\n\n /**\n * The element used as the collision boundary. By default this is the\n * viewport, though you can provide additional element(s) to be included in\n * this check.\n */\n collisionBoundary?: Element | null\n\n /**\n * The sticky behavior on the align axis. \"partial\" will keep the content in\n * the boundary as long as the trigger is at least partially in the boundary\n * whilst \"always\" will keep the content in the boundary regardless.\n */\n sticky?: 'partial' | 'always'\n\n /**\n * Whether to hide the content when the trigger becomes fully occluded.\n */\n hideWhenDetached?: boolean\n\n /**\n * Event handler called when a pointer event occurs outside the bounds of the\n * component. It can be prevented by calling event.preventDefault.\n */\n onPointerDownOutside?: (event: PointerDownOutsideEvent) => void\n\n /**\n * Event handler called when focus moves outside the bounds of the component.\n * It can be prevented by calling event.preventDefault.\n */\n onFocusOutside?: (event: FocusOutsideEvent) => void\n\n /**\n * Event handler called when the escape key is down. It can be prevented by\n * calling event.preventDefault.\n */\n onEscapeKeyDown?: (event: KeyboardEvent) => void\n\n /**\n * Event handler called when an interaction (pointer or focus event) happens\n * outside the bounds of the component. It can be prevented by calling\n * event.preventDefault.\n */\n onInteractOutside?: (\n event: PointerDownOutsideEvent | FocusOutsideEvent\n ) => void\n\n /**\n * Event handler called when focus moves into the component after opening.\n * It can be prevented by calling event.preventDefault().\n */\n onOpenAutoFocus?: (event: Event) => void\n\n /**\n * Event handler called when focus moves to the trigger after closing.\n * It can be prevented by calling event.preventDefault().\n */\n onCloseAutoFocus?: (event: Event) => void\n}\n\n/**\n * The content component is used to render rich content elements for the popover.\n */\nexport const Content = React.forwardRef<\n ElementRef<typeof StyledContent>,\n ContentProps\n>(\n (\n {\n align = 'center',\n alignOffset = 0,\n sideOffset = 0,\n avoidCollisions = true,\n collisionPadding = 0,\n side = 'top',\n children,\n anchor = 'line',\n sticky = 'partial',\n hideWhenDetached = false,\n ...restProps\n },\n forwardRef\n ) => {\n const [line, setLine] = React.useState<HTMLElement | null>(null)\n const lineSize = useSize(line)\n const { variant } = usePopoverContext()\n\n const anchorEl = React.useMemo(() => {\n switch (anchor) {\n case 'arrow':\n return <Arrow />\n case 'line':\n return <Line ref={setLine} />\n default:\n return null\n }\n }, [anchor, setLine])\n\n return (\n <StyledContent\n {...restProps}\n align={align}\n alignOffset={alignOffset}\n avoidCollisions={avoidCollisions}\n collisionPadding={collisionPadding}\n side={side}\n sideOffset={anchor === 'line' ? lineSize?.height : sideOffset}\n ref={forwardRef}\n role='dialog'\n aria-modal='true'\n sticky={sticky}\n hideWhenDetached={hideWhenDetached}\n variant={variant}\n >\n {children}\n {anchorEl}\n </StyledContent>\n )\n }\n)\n","import { Close as RadixClose } from '@radix-ui/react-popover'\nimport { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\nexport const StyledClose = styled(RadixClose, {\n all: 'unset',\n fontFamily: 'inherit',\n height: '$6',\n width: '$6',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n color: '$white',\n position: 'absolute',\n top: '5px',\n right: '5px',\n borderRadius: '$50',\n cursor: 'pointer',\n\n '&:hover': {\n backgroundColor: 'rgba(255, 255, 255, 0.12)',\n },\n '&:focus-visible': {\n boxShadow: '$focus-controls',\n },\n\n variants: {\n variant: {\n light: {\n color: '$black',\n },\n dark: {\n '&:focus-visible': {\n boxShadow:\n '0 0 0 1px #0F0F0F, 0 0 0 3px #6881FF, 0 0 0 5px #4961f699',\n },\n },\n },\n },\n})\n\nexport type StyledCloseProps = StrictComponentProps<typeof StyledClose>\n","import React from 'react'\nimport { IconCross } from '@mirohq/design-system-icons'\nimport type { ElementRef } from 'react'\n\nimport { StyledClose } from './close.styled'\nimport { usePopoverContext } from '../use-popover-context'\nimport type { StyledCloseProps } from './close.styled'\n\nexport interface CloseProps extends StyledCloseProps {}\n\nexport const Close = React.forwardRef<\n ElementRef<typeof StyledClose>,\n CloseProps\n>((props, forwardRef) => {\n const { variant } = usePopoverContext()\n\n return (\n <StyledClose\n {...props}\n ref={forwardRef}\n data-testid='close-icon'\n variant={variant}\n >\n <IconCross size='small' />\n </StyledClose>\n )\n})\n","import React from 'react'\nimport type { PopoverPortalProps } from '@radix-ui/react-popover'\nimport { Portal as RadixPortal } from '@radix-ui/react-popover'\n\nexport interface PortalProps extends PopoverPortalProps {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries. If used on this part,\n * it will be inherited by Popover.Content.\n */\n forceMount?: true\n\n /**\n * Specify a container element to portal the content into.\n */\n container?: HTMLElement | null\n}\n\nexport const Portal: React.FC<PortalProps> = props => <RadixPortal {...props} />\n","import React from 'react'\nimport * as RadixPopover from '@radix-ui/react-popover'\n\nimport { Trigger } from './partials/trigger'\nimport { Content } from './partials/content'\nimport { Close } from './partials/close'\nimport { Portal } from './partials/portal'\nimport { PopoverProvider } from './use-popover-context'\nimport type { Variant } from './types'\n\nexport interface PopoverProps {\n /**\n * The current controlled state of the popover.\n */\n open?: boolean\n\n /**\n * The initial open state of the popover. Use when you don't need to control its open state.\n */\n defaultOpen?: boolean\n\n /**\n * Event handler called when the popover opens.\n */\n onOpen?: () => void\n\n /**\n * Event handler called when the popover closes.\n */\n onClose?: () => void\n\n /**\n * Defines whether the interaction with outside elements will be enabled.\n */\n interactOutside?: boolean\n\n /**\n * Change the popover's appearance\n */\n variant?: Variant\n\n /**\n * The content\n */\n children: React.ReactNode\n}\n\nconst Root: React.FC<PopoverProps> = ({ onOpen, onClose, ...restProps }) => (\n <RadixPopover.Root\n {...restProps}\n onOpenChange={value => {\n if (value) {\n onOpen?.()\n } else {\n onClose?.()\n }\n }}\n modal={false}\n />\n)\n\nexport const Popover: React.FC<PopoverProps> & Partials = ({\n open,\n defaultOpen = false,\n onOpen,\n onClose,\n variant = 'dark',\n ...restProps\n}) => (\n <PopoverProvider variant={variant}>\n <Root\n {...restProps}\n open={open}\n defaultOpen={defaultOpen}\n onOpen={onOpen}\n onClose={onClose}\n />\n </PopoverProvider>\n)\n\n// Partials\n// -----------------------------------------------------------------------------\n\nexport interface Partials {\n Trigger: typeof Trigger\n Content: typeof Content\n Close: typeof Close\n Portal: typeof Portal\n Anchor: typeof RadixPopover.Anchor\n}\n\nPopover.Trigger = Trigger\nPopover.Content = Content\nPopover.Close = Close\nPopover.Portal = Portal\nPopover.Anchor = RadixPopover.Anchor\n"],"names":["RadixTrigger","RadixContent","RadixArrow","RadixClose","RadixPortal"],"mappings":"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"}
1
+ {"version":3,"file":"module.js","sources":["../src/partials/trigger.styled.tsx","../src/partials/trigger.tsx","../src/partials/content.styled.tsx","../src/partials/line.styled.tsx","../src/partials/line.tsx","../src/partials/arrow.styled.tsx","../src/use-popover-context.tsx","../src/partials/arrow.tsx","../src/partials/content.tsx","../src/partials/close.styled.tsx","../src/partials/close.tsx","../src/partials/portal.tsx","../src/popover.tsx"],"sourcesContent":["import { Trigger as RadixTrigger } from '@radix-ui/react-popover'\nimport { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\nexport const StyledTrigger = styled(RadixTrigger)\nexport type StyledTriggerProps = StrictComponentProps<typeof StyledTrigger>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { StyledTrigger } from './trigger.styled'\nimport type { StyledTriggerProps } from './trigger.styled'\n\nexport interface TriggerProps extends StyledTriggerProps {}\n\n/**\n * The trigger component is used to render the trigger element for the popover.\n */\nexport const Trigger = React.forwardRef<\n ElementRef<typeof StyledTrigger>,\n TriggerProps\n>((props, forwardRef) => <StyledTrigger {...props} ref={forwardRef} />)\n","import { Content as RadixContent } from '@radix-ui/react-popover'\nimport { styled } from '@mirohq/design-system-stitches'\nimport { animations } from '@mirohq/design-system-styles'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\nexport const StyledContent = styled(RadixContent, {\n backgroundColor: '$black',\n borderRadius: '$50',\n color: '$white',\n padding: '$200',\n boxShadow: '0 $1 $4 rgba(9, 9, 9, 0.4)',\n fontSize: '14px',\n lineHeight: '20px',\n '@media (prefers-reduced-motion: no-preference)': {\n animationDuration: '220ms',\n animationTimingFunction: 'ease',\n willChange: 'opacity',\n '&[data-state=\"open\"]': {\n animationName: animations.fadeIn,\n },\n '&[data-state=\"closed\"]': {\n animationName: animations.fadeOut,\n },\n },\n variants: {\n variant: {\n light: {\n background: '$white',\n boxShadow: '$50',\n color: '$black',\n },\n dark: {},\n },\n },\n zIndex: '$popover',\n})\n\nexport type StyledContentProps = StrictComponentProps<typeof StyledContent>\n","import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\nimport type { CSSProperties } from '@stitches/react'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\ntype Side = 'top' | 'right' | 'bottom' | 'left'\n\ninterface AlignStyle {\n [x: string]: CSSProperties\n}\n\nconst getAlignXStyle = (side: Side, width: number): AlignStyle => ({\n [`[data-side=\"${side}\"][data-align=\"start\"] > &`]: {\n left: `${width * 2}px`,\n },\n [`[data-side=\"${side}\"][data-align=\"center\"] > &`]: {\n left: `calc(50% - ${width / 2}px)`,\n },\n [`[data-side=\"${side}\"][data-align=\"end\"] > &`]: {\n left: `calc(100% - ${width * 3}px)`,\n },\n})\n\nconst getAlignYStyle = (\n side: Side,\n width: number,\n height: number\n): AlignStyle => ({\n [`[data-side=\"${side}\"][data-align=\"start\"] > &`]: {\n bottom: `calc(100% - (${height - width}px))`,\n },\n [`[data-side=\"${side}\"][data-align=\"center\"] > &`]: {\n bottom: `calc(50% - ${height / 2}px)`,\n },\n [`[data-side=\"${side}\"][data-align=\"end\"] > &`]: { bottom: `-${width}px` },\n})\n\nexport const getPlacement = (width: number, height: number): any => {\n const halfHeight = height / 2\n const halfWidth = width / 2\n\n return {\n '[data-side=\"top\"] > &': { bottom: `-${height}px` },\n ...getAlignXStyle('top', width),\n '[data-side=\"bottom\"] > &': {\n bottom: '100%',\n transform: 'rotate(180deg)',\n },\n ...getAlignXStyle('bottom', width),\n '[data-side=\"right\"] > &': {\n left: `-${halfHeight + halfWidth}px`,\n transform: 'rotate(90deg)',\n },\n ...getAlignYStyle('right', width, height),\n '[data-side=\"left\"] > &': {\n left: `calc(100% + ${halfHeight - halfWidth}px)`,\n transform: 'rotate(270deg)',\n },\n ...getAlignYStyle('left', width, height),\n }\n}\n\nexport const StyledLine = styled(Primitive.span, {\n width: '6px',\n height: '50px',\n position: 'absolute',\n rect: {\n fill: '$black',\n },\n 'svg #line': {\n width: '44px',\n height: '1px',\n transform: 'rotate(90 3.5 0)',\n },\n 'svg #circle': {\n width: '6px',\n height: '6px',\n rx: '3px',\n transform: 'rotate(90 6 44)',\n },\n})\n\nexport type StyledLineProps = StrictComponentProps<typeof StyledLine>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { StyledLine, getPlacement } from './line.styled'\nimport type { StyledLineProps } from './line.styled'\n\nexport interface LineProps extends StyledLineProps {}\n\nexport const Line = React.forwardRef<ElementRef<typeof StyledLine>, LineProps>(\n (props, forwardRef) => {\n const placement = getPlacement(6, 50)\n return (\n <StyledLine\n {...props}\n css={{ ...placement }}\n ref={forwardRef}\n aria-hidden\n >\n <svg viewBox='0 0 6 50'>\n <rect id='line' x='3.5' transform='rotate(90 3.5 0)' />\n <rect id='circle' x='6' y='44' transform='rotate(90 6 44)' />\n </svg>\n </StyledLine>\n )\n }\n)\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { Arrow as RadixArrow } from '@radix-ui/react-popover'\n\nexport const StyledArrow = styled(RadixArrow, {\n fill: '$black',\n height: '$1',\n paddingX: '2px',\n width: '$3',\n variants: {\n variant: {\n light: {\n fill: '$white',\n },\n dark: {},\n },\n },\n})\n\nexport type StyledArrowProps = StrictComponentProps<typeof StyledArrow>\n","import React, { createContext, useContext } from 'react'\nimport type { PropsWithChildren } from 'react'\n\nimport type { Variant } from './types'\n\ninterface PopoverValues {\n variant?: Variant\n}\n\ninterface PopoverContextProps {\n variant?: Variant\n}\n\nconst PopoverContext = createContext<PopoverContextProps>({} as any)\n\n/**\n * The PopoverProvider is used to manage the state of the popover,\n * when it opens or closes, and what triggers it.\n */\nexport const PopoverProvider = ({\n children,\n variant,\n}: PropsWithChildren<PopoverValues>): any => (\n <PopoverContext.Provider\n value={{\n variant,\n }}\n >\n {children}\n </PopoverContext.Provider>\n)\n\n/**\n * The usePopoverContext hook is used to access the state of the popover.\n */\nexport const usePopoverContext = (): PopoverContextProps =>\n useContext(PopoverContext)\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { StyledArrow } from './arrow.styled'\nimport type { StyledArrowProps } from './arrow.styled'\nimport { usePopoverContext } from '../use-popover-context'\n\nexport interface ArrowProps extends StyledArrowProps {\n /**\n * The appearance of arrow.\n */\n variant?: StyledArrowProps['variant']\n}\n\nexport const Arrow = React.forwardRef<\n ElementRef<typeof StyledArrow>,\n ArrowProps\n>((props, forwardRef) => {\n const { variant } = usePopoverContext()\n return (\n <StyledArrow {...props} variant={variant} aria-hidden ref={forwardRef} />\n )\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\nimport { useSize } from '@radix-ui/react-use-size'\n\nimport { StyledContent } from './content.styled'\nimport { Line } from './line'\nimport { Arrow } from './arrow'\nimport { usePopoverContext } from '../use-popover-context'\nimport type { StyledContentProps } from './content.styled'\nimport type {\n Align,\n Side,\n AnchorType,\n PointerDownOutsideEvent,\n FocusOutsideEvent,\n} from '../types'\n\nexport interface ContentProps extends StyledContentProps {\n /**\n * When true, overrides the side and align preferences to prevent collisions\n * with window edges.\n * @default true\n */\n avoidCollisions?: boolean\n\n /**\n * The preferred alignment against the trigger. May change when collisions\n * occur.\n * @default 'center'\n */\n align?: Align\n\n /**\n * An offset in pixels from the \"start\" or \"end\" alignment option.\n * @default 0\n */\n alignOffset?: number\n\n /**\n * The distance in pixels from the trigger's edge to the popover's anchor.\n * Works only with the \"arrow\" or \"none\" anchor.\n * @default 0\n */\n sideOffset?: number\n\n /**\n * The preferred side of the trigger to render against when open.\n * Will be reversed when collisions occur and avoidCollisions is enabled.\n * @default 'top'\n */\n side?: Side\n\n /**\n * The distance in pixels from the boundary edges where collision detection\n * should occur. Accepts a number (same for all sides).\n * @default 0\n */\n collisionPadding?: number\n\n /**\n * The type of anchor to render.\n * @default 'line'\n */\n anchor?: AnchorType\n\n /**\n * Whether to render in a Portal when open.\n */\n portalled?: boolean\n\n /**\n * Used to force mounting when more control is needed. Useful when controlling\n * animation with React animation libraries.\n */\n forceMount?: true\n\n /**\n * The element used as the collision boundary. By default this is the\n * viewport, though you can provide additional element(s) to be included in\n * this check.\n */\n collisionBoundary?: Element | null\n\n /**\n * The sticky behavior on the align axis. \"partial\" will keep the content in\n * the boundary as long as the trigger is at least partially in the boundary\n * whilst \"always\" will keep the content in the boundary regardless.\n * @default 'partial'\n */\n sticky?: 'partial' | 'always'\n\n /**\n * Whether to hide the content when the trigger becomes fully occluded.\n * @default false\n */\n hideWhenDetached?: boolean\n\n /**\n * Event handler called when a pointer event occurs outside the bounds of the\n * component. It can be prevented by calling event.preventDefault.\n */\n onPointerDownOutside?: (event: PointerDownOutsideEvent) => void\n\n /**\n * Event handler called when focus moves outside the bounds of the component.\n * It can be prevented by calling event.preventDefault.\n */\n onFocusOutside?: (event: FocusOutsideEvent) => void\n\n /**\n * Event handler called when the escape key is down. It can be prevented by\n * calling event.preventDefault.\n */\n onEscapeKeyDown?: (event: KeyboardEvent) => void\n\n /**\n * Event handler called when an interaction (pointer or focus event) happens\n * outside the bounds of the component. It can be prevented by calling\n * event.preventDefault.\n */\n onInteractOutside?: (\n event: PointerDownOutsideEvent | FocusOutsideEvent\n ) => void\n\n /**\n * Event handler called when focus moves into the component after opening.\n * It can be prevented by calling event.preventDefault().\n */\n onOpenAutoFocus?: (event: Event) => void\n\n /**\n * Event handler called when focus moves to the trigger after closing.\n * It can be prevented by calling event.preventDefault().\n */\n onCloseAutoFocus?: (event: Event) => void\n}\n\n/**\n * The content component is used to render rich content elements for the popover.\n */\nexport const Content = React.forwardRef<\n ElementRef<typeof StyledContent>,\n ContentProps\n>(\n (\n {\n align = 'center',\n alignOffset = 0,\n sideOffset = 0,\n avoidCollisions = true,\n collisionPadding = 0,\n side = 'top',\n children,\n anchor = 'line',\n sticky = 'partial',\n hideWhenDetached = false,\n ...restProps\n },\n forwardRef\n ) => {\n const [line, setLine] = React.useState<HTMLElement | null>(null)\n const lineSize = useSize(line)\n const { variant } = usePopoverContext()\n\n const anchorEl = React.useMemo(() => {\n switch (anchor) {\n case 'arrow':\n return <Arrow />\n case 'line':\n return <Line ref={setLine} />\n default:\n return null\n }\n }, [anchor, setLine])\n\n return (\n <StyledContent\n {...restProps}\n align={align}\n alignOffset={alignOffset}\n avoidCollisions={avoidCollisions}\n collisionPadding={collisionPadding}\n side={side}\n sideOffset={anchor === 'line' ? lineSize?.height : sideOffset}\n ref={forwardRef}\n role='dialog'\n aria-modal='true'\n sticky={sticky}\n hideWhenDetached={hideWhenDetached}\n variant={variant}\n >\n {children}\n {anchorEl}\n </StyledContent>\n )\n }\n)\n","import { Close as RadixClose } from '@radix-ui/react-popover'\nimport { styled } from '@mirohq/design-system-stitches'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\nexport const StyledClose = styled(RadixClose, {\n all: 'unset',\n fontFamily: 'inherit',\n height: '$6',\n width: '$6',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n color: '$white',\n position: 'absolute',\n top: '5px',\n right: '5px',\n borderRadius: '$50',\n cursor: 'pointer',\n\n '&:hover': {\n backgroundColor: 'rgba(255, 255, 255, 0.12)',\n },\n '&:focus-visible': {\n boxShadow: '$focus-controls',\n },\n\n variants: {\n variant: {\n light: {\n color: '$black',\n },\n dark: {\n '&:focus-visible': {\n boxShadow:\n '0 0 0 1px #0F0F0F, 0 0 0 3px #6881FF, 0 0 0 5px #4961f699',\n },\n },\n },\n },\n})\n\nexport type StyledCloseProps = StrictComponentProps<typeof StyledClose>\n","import React from 'react'\nimport { IconCross } from '@mirohq/design-system-icons'\nimport type { ElementRef } from 'react'\n\nimport { StyledClose } from './close.styled'\nimport { usePopoverContext } from '../use-popover-context'\nimport type { StyledCloseProps } from './close.styled'\n\nexport interface CloseProps extends StyledCloseProps {\n /**\n * The appearance of close's button.\n */\n variant?: StyledCloseProps['variant']\n}\n\nexport const Close = React.forwardRef<\n ElementRef<typeof StyledClose>,\n CloseProps\n>((props, forwardRef) => {\n const { variant } = usePopoverContext()\n\n return (\n <StyledClose\n {...props}\n ref={forwardRef}\n data-testid='close-icon'\n variant={variant}\n >\n <IconCross size='small' />\n </StyledClose>\n )\n})\n","import React from 'react'\nimport type { PopoverPortalProps } from '@radix-ui/react-popover'\nimport { Portal as RadixPortal } from '@radix-ui/react-popover'\n\nexport interface PortalProps extends PopoverPortalProps {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries. If used on this part,\n * it will be inherited by Popover.Content.\n */\n forceMount?: true\n\n /**\n * Specify a container element to portal the content into.\n */\n container?: HTMLElement | null\n}\n\nexport const Portal: React.FC<PortalProps> = props => <RadixPortal {...props} />\n","import React from 'react'\nimport * as RadixPopover from '@radix-ui/react-popover'\n\nimport { Trigger } from './partials/trigger'\nimport { Content } from './partials/content'\nimport { Close } from './partials/close'\nimport { Portal } from './partials/portal'\nimport { PopoverProvider } from './use-popover-context'\nimport type { Variant } from './types'\n\nexport interface PopoverProps {\n /**\n * The current controlled state of the popover.\n */\n open?: boolean\n\n /**\n * The initial open state of the popover. Use when you don't need to control\n * its open state.\n * @default false\n */\n defaultOpen?: boolean\n\n /**\n * Event handler called when the popover opens.\n */\n onOpen?: () => void\n\n /**\n * Event handler called when the popover closes.\n */\n onClose?: () => void\n\n /**\n * Defines whether the interaction with outside elements will be enabled.\n */\n interactOutside?: boolean\n\n /**\n * Change the popover's appearance.\n * @default 'dark'\n */\n variant?: Variant\n\n /**\n * The content.\n */\n children: React.ReactNode\n}\n\nconst Root: React.FC<PopoverProps> = ({ onOpen, onClose, ...restProps }) => (\n <RadixPopover.Root\n {...restProps}\n onOpenChange={value => {\n if (value) {\n onOpen?.()\n } else {\n onClose?.()\n }\n }}\n modal={false}\n />\n)\n\nexport const Popover: React.FC<PopoverProps> & Partials = ({\n open,\n defaultOpen = false,\n onOpen,\n onClose,\n variant = 'dark',\n ...restProps\n}) => (\n <PopoverProvider variant={variant}>\n <Root\n {...restProps}\n open={open}\n defaultOpen={defaultOpen}\n onOpen={onOpen}\n onClose={onClose}\n />\n </PopoverProvider>\n)\n\n// Partials\n// -----------------------------------------------------------------------------\n\nexport interface Partials {\n Trigger: typeof Trigger\n Content: typeof Content\n Close: typeof Close\n Portal: typeof Portal\n Anchor: typeof RadixPopover.Anchor\n}\n\nPopover.Trigger = Trigger\nPopover.Content = Content\nPopover.Close = Close\nPopover.Portal = Portal\nPopover.Anchor = RadixPopover.Anchor\n"],"names":["RadixTrigger","RadixContent","RadixArrow","RadixClose","RadixPortal"],"mappings":"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"}
package/dist/types.d.ts CHANGED
@@ -1,7 +1,7 @@
1
+ import * as _radix_ui_react_popover from '@radix-ui/react-popover';
2
+ import { PopoverPortalProps, PopoverAnchorProps } from '@radix-ui/react-popover';
1
3
  import * as react from 'react';
2
4
  import react__default from 'react';
3
- import * as _radix_ui_react_popover from '@radix-ui/react-popover';
4
- import { PopoverPortalProps } from '@radix-ui/react-popover';
5
5
  import * as _mirohq_design_system_stitches from '@mirohq/design-system-stitches';
6
6
  import { StrictComponentProps } from '@mirohq/design-system-stitches';
7
7
  import * as _stitches_react_types_styled_component from '@stitches/react/types/styled-component';
@@ -1032,33 +1032,41 @@ interface ContentProps extends StyledContentProps {
1032
1032
  /**
1033
1033
  * When true, overrides the side and align preferences to prevent collisions
1034
1034
  * with window edges.
1035
+ * @default true
1035
1036
  */
1036
1037
  avoidCollisions?: boolean;
1037
1038
  /**
1038
- * The preferred alignment against the trigger. May change when collisions occur.
1039
+ * The preferred alignment against the trigger. May change when collisions
1040
+ * occur.
1041
+ * @default 'center'
1039
1042
  */
1040
1043
  align?: Align;
1041
1044
  /**
1042
1045
  * An offset in pixels from the "start" or "end" alignment option.
1046
+ * @default 0
1043
1047
  */
1044
1048
  alignOffset?: number;
1045
1049
  /**
1046
- * The distance in pixels from the trigger's edge to the popover's anchor. Works only with the "arrow" or "none"
1047
- * anchor.
1050
+ * The distance in pixels from the trigger's edge to the popover's anchor.
1051
+ * Works only with the "arrow" or "none" anchor.
1052
+ * @default 0
1048
1053
  */
1049
1054
  sideOffset?: number;
1050
1055
  /**
1051
1056
  * The preferred side of the trigger to render against when open.
1052
1057
  * Will be reversed when collisions occur and avoidCollisions is enabled.
1058
+ * @default 'top'
1053
1059
  */
1054
1060
  side?: Side;
1055
1061
  /**
1056
1062
  * The distance in pixels from the boundary edges where collision detection
1057
1063
  * should occur. Accepts a number (same for all sides).
1064
+ * @default 0
1058
1065
  */
1059
1066
  collisionPadding?: number;
1060
1067
  /**
1061
1068
  * The type of anchor to render.
1069
+ * @default 'line'
1062
1070
  */
1063
1071
  anchor?: AnchorType;
1064
1072
  /**
@@ -1080,10 +1088,12 @@ interface ContentProps extends StyledContentProps {
1080
1088
  * The sticky behavior on the align axis. "partial" will keep the content in
1081
1089
  * the boundary as long as the trigger is at least partially in the boundary
1082
1090
  * whilst "always" will keep the content in the boundary regardless.
1091
+ * @default 'partial'
1083
1092
  */
1084
1093
  sticky?: 'partial' | 'always';
1085
1094
  /**
1086
1095
  * Whether to hide the content when the trigger becomes fully occluded.
1096
+ * @default false
1087
1097
  */
1088
1098
  hideWhenDetached?: boolean;
1089
1099
  /**
@@ -1619,6 +1629,10 @@ declare const StyledClose: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_des
1619
1629
  declare type StyledCloseProps = StrictComponentProps<typeof StyledClose>;
1620
1630
 
1621
1631
  interface CloseProps extends StyledCloseProps {
1632
+ /**
1633
+ * The appearance of close's button.
1634
+ */
1635
+ variant?: StyledCloseProps['variant'];
1622
1636
  }
1623
1637
  declare const Close: react__default.ForwardRefExoticComponent<Omit<CloseProps, "ref"> & react__default.RefAttributes<HTMLButtonElement>>;
1624
1638
 
@@ -1642,7 +1656,9 @@ interface PopoverProps {
1642
1656
  */
1643
1657
  open?: boolean;
1644
1658
  /**
1645
- * The initial open state of the popover. Use when you don't need to control its open state.
1659
+ * The initial open state of the popover. Use when you don't need to control
1660
+ * its open state.
1661
+ * @default false
1646
1662
  */
1647
1663
  defaultOpen?: boolean;
1648
1664
  /**
@@ -1658,11 +1674,12 @@ interface PopoverProps {
1658
1674
  */
1659
1675
  interactOutside?: boolean;
1660
1676
  /**
1661
- * Change the popover's appearance
1677
+ * Change the popover's appearance.
1678
+ * @default 'dark'
1662
1679
  */
1663
1680
  variant?: Variant;
1664
1681
  /**
1665
- * The content
1682
+ * The content.
1666
1683
  */
1667
1684
  children: react__default.ReactNode;
1668
1685
  }
@@ -1675,4 +1692,508 @@ interface Partials {
1675
1692
  Anchor: typeof _radix_ui_react_popover.Anchor;
1676
1693
  }
1677
1694
 
1678
- export { Popover, ContentProps as PopoverContentProps, PortalProps as PopoverPortalProps, PopoverProps, TriggerProps as PopoverTriggerProps, types as PopoverTypes };
1695
+ declare const StyledArrow: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<_stitches_react_types_styled_component.StyledComponent<react.ForwardRefExoticComponent<_radix_ui_react_popover.PopoverArrowProps & react.RefAttributes<SVGSVGElement>>, {}, {}, _stitches_react_types_css_util.CSS<{}, {
1696
+ 'border-widths': {
1697
+ readonly none: 0;
1698
+ readonly sm: "1px";
1699
+ readonly md: "2px";
1700
+ readonly lg: "4px";
1701
+ };
1702
+ colors: {
1703
+ readonly black: any;
1704
+ readonly 'blue-100': any;
1705
+ readonly 'blue-200': any;
1706
+ readonly 'blue-300': any;
1707
+ readonly 'blue-400': any;
1708
+ readonly 'blue-500': any;
1709
+ readonly 'blue-600': any;
1710
+ readonly 'blue-700': any;
1711
+ readonly 'blue-800': any;
1712
+ readonly 'blue-900': any;
1713
+ readonly 'blue-1000': any;
1714
+ readonly 'gray-100': any;
1715
+ readonly 'gray-200': any;
1716
+ readonly 'gray-300': any;
1717
+ readonly 'gray-400': any;
1718
+ readonly 'gray-500': any;
1719
+ readonly 'gray-600': any;
1720
+ readonly 'gray-700': any;
1721
+ readonly 'gray-800': any;
1722
+ readonly 'gray-900': any;
1723
+ readonly 'green-100': any;
1724
+ readonly 'green-200': any;
1725
+ readonly 'green-300': any;
1726
+ readonly 'green-400': any;
1727
+ readonly 'green-500': any;
1728
+ readonly 'green-600': any;
1729
+ readonly 'green-700': any;
1730
+ readonly 'green-800': any;
1731
+ readonly 'green-900': any;
1732
+ readonly 'indigo-100': any;
1733
+ readonly 'indigo-200': any;
1734
+ readonly 'indigo-300': any;
1735
+ readonly 'indigo-400': any;
1736
+ readonly 'indigo-500': any;
1737
+ readonly 'indigo-600': any;
1738
+ readonly 'indigo-700': any;
1739
+ readonly 'indigo-800': any;
1740
+ readonly 'indigo-900': any;
1741
+ readonly 'red-100': any;
1742
+ readonly 'red-200': any;
1743
+ readonly 'red-300': any;
1744
+ readonly 'red-400': any;
1745
+ readonly 'red-500': any;
1746
+ readonly 'red-600': any;
1747
+ readonly 'red-700': any;
1748
+ readonly 'red-800': any;
1749
+ readonly 'red-900': any;
1750
+ readonly transparent: any;
1751
+ readonly white: any;
1752
+ readonly 'yellow-100': any;
1753
+ readonly 'yellow-200': any;
1754
+ readonly 'yellow-300': any;
1755
+ readonly 'yellow-400': any;
1756
+ readonly 'yellow-500': any;
1757
+ readonly 'yellow-600': any;
1758
+ readonly 'yellow-700': any;
1759
+ readonly 'yellow-800': any;
1760
+ readonly 'yellow-900': any;
1761
+ "background-alpha-active"?: any;
1762
+ "background-alpha-hover"?: any;
1763
+ "background-danger-prominent"?: any;
1764
+ "background-danger-prominent-active"?: any;
1765
+ "background-danger-prominent-hover"?: any;
1766
+ "background-danger-subtle"?: any;
1767
+ "background-danger-subtle-active"?: any;
1768
+ "background-danger-subtle-hover"?: any;
1769
+ "background-neutrals"?: any;
1770
+ "background-neutrals-active"?: any;
1771
+ "background-neutrals-container"?: any;
1772
+ "background-neutrals-controls-disabled"?: any;
1773
+ "background-neutrals-disabled"?: any;
1774
+ "background-neutrals-hover"?: any;
1775
+ "background-neutrals-inactive"?: any;
1776
+ "background-neutrals-inactive-hover"?: any;
1777
+ "background-neutrals-inverted"?: any;
1778
+ "background-neutrals-inverted-subtle"?: any;
1779
+ "background-neutrals-page"?: any;
1780
+ "background-neutrals-page-subtle"?: any;
1781
+ "background-neutrals-scrolls"?: any;
1782
+ "background-neutrals-scrolls-expanded"?: any;
1783
+ "background-neutrals-scrolls-hover"?: any;
1784
+ "background-neutrals-scrolls-pressed"?: any;
1785
+ "background-neutrals-scrolls-pressed-hover"?: any;
1786
+ "background-neutrals-subtle"?: any;
1787
+ "background-neutrals-subtle-active"?: any;
1788
+ "background-neutrals-subtle-hover"?: any;
1789
+ "background-primary-prominent"?: any;
1790
+ "background-primary-prominent-active"?: any;
1791
+ "background-primary-prominent-expanded"?: any;
1792
+ "background-primary-prominent-hover"?: any;
1793
+ "background-primary-prominent-pressed"?: any;
1794
+ "background-primary-prominent-pressed-hover"?: any;
1795
+ "background-primary-prominent-selected"?: any;
1796
+ "background-primary-subtle"?: any;
1797
+ "background-primary-subtle-active"?: any;
1798
+ "background-primary-subtle-expanded"?: any;
1799
+ "background-primary-subtle-hover"?: any;
1800
+ "background-primary-subtle-pressed"?: any;
1801
+ "background-primary-subtle-pressed-hover"?: any;
1802
+ "background-primary-subtle-selected"?: any;
1803
+ "background-success"?: any;
1804
+ "background-success-prominent"?: any;
1805
+ "background-success-prominent-active"?: any;
1806
+ "background-success-prominent-hover"?: any;
1807
+ "background-warning-prominent"?: any;
1808
+ "background-warning-subtle"?: any;
1809
+ "border-danger"?: any;
1810
+ "border-danger-active"?: any;
1811
+ "border-danger-hover"?: any;
1812
+ "border-focus-inner"?: any;
1813
+ "border-focus-middle"?: any;
1814
+ "border-focus-outer"?: any;
1815
+ "border-neutrals"?: any;
1816
+ "border-neutrals-active"?: any;
1817
+ "border-neutrals-controls"?: any;
1818
+ "border-neutrals-controls-disabled"?: any;
1819
+ "border-neutrals-disabled"?: any;
1820
+ "border-neutrals-hover"?: any;
1821
+ "border-neutrals-inverted"?: any;
1822
+ "border-neutrals-subtle"?: any;
1823
+ "border-neutrals-text"?: any;
1824
+ "border-neutrals-text-active"?: any;
1825
+ "border-neutrals-text-hover"?: any;
1826
+ "border-neutrals-text-subtle"?: any;
1827
+ "border-neutrals-text-subtle-active"?: any;
1828
+ "border-neutrals-text-subtle-hover"?: any;
1829
+ "border-neutrals-transparent"?: any;
1830
+ "border-primary"?: any;
1831
+ "border-primary-active"?: any;
1832
+ "border-primary-hover"?: any;
1833
+ "border-primary-inverted"?: any;
1834
+ "border-success"?: any;
1835
+ "border-success-active"?: any;
1836
+ "border-success-hover"?: any;
1837
+ "border-warning"?: any;
1838
+ "icon-danger"?: any;
1839
+ "icon-danger-active"?: any;
1840
+ "icon-danger-hover"?: any;
1841
+ "icon-danger-inverted"?: any;
1842
+ "icon-neutrals"?: any;
1843
+ "icon-neutrals-disabled"?: any;
1844
+ "icon-neutrals-inactive"?: any;
1845
+ "icon-neutrals-inactive-hover"?: any;
1846
+ "icon-neutrals-inverted"?: any;
1847
+ "icon-neutrals-search"?: any;
1848
+ "icon-neutrals-subtle"?: any;
1849
+ "icon-neutrals-text"?: any;
1850
+ "icon-primary"?: any;
1851
+ "icon-primary-active"?: any;
1852
+ "icon-primary-hover"?: any;
1853
+ "icon-primary-inverted"?: any;
1854
+ "icon-primary-selected"?: any;
1855
+ "icon-success"?: any;
1856
+ "icon-success-active"?: any;
1857
+ "icon-success-hover"?: any;
1858
+ "icon-success-inverted"?: any;
1859
+ "icon-warning"?: any;
1860
+ "icon-warning-prominent"?: any;
1861
+ "icon-warning-subtle"?: any;
1862
+ "text-danger"?: any;
1863
+ "text-danger-active"?: any;
1864
+ "text-danger-hover"?: any;
1865
+ "text-danger-inverted"?: any;
1866
+ "text-neutrals"?: any;
1867
+ "text-neutrals-active"?: any;
1868
+ "text-neutrals-disabled"?: any;
1869
+ "text-neutrals-hover"?: any;
1870
+ "text-neutrals-inverted"?: any;
1871
+ "text-neutrals-placeholder"?: any;
1872
+ "text-neutrals-placeholder-only"?: any;
1873
+ "text-neutrals-subtle"?: any;
1874
+ "text-neutrals-subtle-active"?: any;
1875
+ "text-neutrals-subtle-hover"?: any;
1876
+ "text-primary"?: any;
1877
+ "text-primary-active"?: any;
1878
+ "text-primary-hover"?: any;
1879
+ "text-primary-inverted"?: any;
1880
+ "text-primary-inverted-subtle"?: any;
1881
+ "text-primary-selected"?: any;
1882
+ "text-success"?: any;
1883
+ "text-success-active"?: any;
1884
+ "text-success-hover"?: any;
1885
+ "text-success-inverted"?: any;
1886
+ "text-warning"?: any;
1887
+ "text-warning-subtle"?: any;
1888
+ };
1889
+ 'font-sizes': {
1890
+ readonly 150: "0.75rem";
1891
+ readonly 175: "0.875rem";
1892
+ readonly 200: "1rem";
1893
+ readonly 225: "1.125rem";
1894
+ readonly 250: "1.25rem";
1895
+ readonly 300: "1.5rem";
1896
+ readonly 400: "2rem";
1897
+ readonly 500: "2.5rem";
1898
+ readonly 600: "3rem";
1899
+ readonly 800: "4rem";
1900
+ readonly 900: "4.5rem";
1901
+ };
1902
+ fonts: {
1903
+ readonly heading: "Roobert, sans-serif";
1904
+ readonly body: "Open Sans, sans-serif";
1905
+ };
1906
+ radii: {
1907
+ readonly none: 0;
1908
+ readonly half: "999em";
1909
+ readonly 25: "2px";
1910
+ readonly 50: "4px";
1911
+ readonly 75: "6px";
1912
+ readonly 100: "8px";
1913
+ readonly 200: "16px";
1914
+ };
1915
+ shadows: {
1916
+ readonly 'focus-small': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-inner";
1917
+ readonly 'focus-small-outline': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 1px $colors$border-focus-middle, inset 0 0 0 2px $colors$border-focus-inner";
1918
+ readonly 'focus-large': "0 0 0 4px $colors$border-focus-inner, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-outer";
1919
+ readonly 'focus-controls': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-focus-middle, 0 0 0 5px $colors$border-focus-outer";
1920
+ readonly 'focus-controls-error': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-danger, 0 0 0 5px $colors$background-danger-subtle-hover";
1921
+ readonly 'focus-controls-success': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$background-success-prominent, 0 0 0 5px $colors$background-success";
1922
+ };
1923
+ sizes: {
1924
+ readonly number: string;
1925
+ readonly 'icon-200': "16px";
1926
+ readonly 'icon-300': "24px";
1927
+ readonly 'icon-400': "32px";
1928
+ };
1929
+ space: {
1930
+ readonly 0: "0px";
1931
+ readonly 25: "2px";
1932
+ readonly 50: "4px";
1933
+ readonly 100: "8px";
1934
+ readonly 150: "12px";
1935
+ readonly 200: "16px";
1936
+ readonly 300: "24px";
1937
+ readonly 400: "32px";
1938
+ readonly 500: "40px";
1939
+ readonly 600: "48px";
1940
+ readonly 700: "56px";
1941
+ readonly 800: "64px";
1942
+ readonly 1200: "96px";
1943
+ readonly 1600: "128px";
1944
+ };
1945
+ 'space-gap': {
1946
+ readonly 0: any;
1947
+ readonly 50: any;
1948
+ readonly 100: any;
1949
+ readonly 200: any;
1950
+ readonly 300: any;
1951
+ };
1952
+ 'space-inset': {
1953
+ readonly 0: any;
1954
+ readonly 50: any;
1955
+ readonly 100: any;
1956
+ readonly 150: any;
1957
+ readonly 200: any;
1958
+ readonly 300: any;
1959
+ readonly 400: any;
1960
+ readonly 500: any;
1961
+ readonly 600: any;
1962
+ readonly 700: any;
1963
+ readonly 800: any;
1964
+ readonly 1200: any;
1965
+ readonly 1600: any;
1966
+ };
1967
+ 'space-offset': {
1968
+ readonly 0: any;
1969
+ readonly 50: any;
1970
+ readonly 100: any;
1971
+ readonly 150: any;
1972
+ readonly 200: any;
1973
+ readonly 300: any;
1974
+ readonly 400: any;
1975
+ readonly 600: any;
1976
+ readonly 800: any;
1977
+ readonly 1200: any;
1978
+ readonly 1600: any;
1979
+ readonly 'stacking-0': any;
1980
+ readonly 'stacking-100': any;
1981
+ readonly 'stacking-200': any;
1982
+ readonly 'stacking-300': any;
1983
+ readonly 'stacking-400': any;
1984
+ readonly 'stacking-500': any;
1985
+ readonly 'stacking-800': any;
1986
+ };
1987
+ 'stroke-width': {
1988
+ readonly thin: "1.5px";
1989
+ readonly normal: "2px";
1990
+ readonly bold: "4px";
1991
+ };
1992
+ 'z-indices': {
1993
+ readonly dropdownMenu: 100;
1994
+ readonly select: 200;
1995
+ readonly popover: 300;
1996
+ readonly tooltip: 400;
1997
+ };
1998
+ }, {
1999
+ readonly background: "colors";
2000
+ readonly backgroundColor: "colors";
2001
+ readonly backgroundImage: "colors";
2002
+ readonly blockSize: "sizes";
2003
+ readonly border: "colors";
2004
+ readonly borderBlock: "colors";
2005
+ readonly borderBlockEnd: "colors";
2006
+ readonly borderBlockStart: "colors";
2007
+ readonly borderBottom: "colors";
2008
+ readonly borderBottomColor: "colors";
2009
+ readonly borderBottomLeftRadius: "radii";
2010
+ readonly borderBottomRightRadius: "radii";
2011
+ readonly borderBottomStyle: "border-styles";
2012
+ readonly borderBottomWidth: "border-widths";
2013
+ readonly borderColor: "colors";
2014
+ readonly borderImage: "colors";
2015
+ readonly borderInline: "colors";
2016
+ readonly borderInlineEnd: "colors";
2017
+ readonly borderInlineStart: "colors";
2018
+ readonly borderLeft: "colors";
2019
+ readonly borderLeftColor: "colors";
2020
+ readonly borderLeftStyle: "border-styles";
2021
+ readonly borderLeftWidth: "border-widths";
2022
+ readonly borderRadius: "radii";
2023
+ readonly borderRight: "colors";
2024
+ readonly borderRightColor: "colors";
2025
+ readonly borderRightStyle: "border-styles";
2026
+ readonly borderRightWidth: "border-widths";
2027
+ readonly borderSpacing: "space-offset";
2028
+ readonly borderStyle: "border-styles";
2029
+ readonly borderTop: "colors";
2030
+ readonly borderTopColor: "colors";
2031
+ readonly borderTopLeftRadius: "radii";
2032
+ readonly borderTopRightRadius: "radii";
2033
+ readonly borderTopStyle: "border-styles";
2034
+ readonly borderTopWidth: "border-widths";
2035
+ readonly borderWidth: "border-widths";
2036
+ readonly bottom: "space";
2037
+ readonly boxShadow: "shadows";
2038
+ readonly caretColor: "colors";
2039
+ readonly color: "colors";
2040
+ readonly columnGap: "space-gap";
2041
+ readonly columnRuleColor: "colors";
2042
+ readonly fill: "colors";
2043
+ readonly flexBasis: "sizes";
2044
+ readonly fontFamily: "fonts";
2045
+ readonly fontSize: "font-sizes";
2046
+ readonly fontWeight: "font-weights";
2047
+ readonly gap: "space-gap";
2048
+ readonly gridColumnGap: "space-gap";
2049
+ readonly gridGap: "space-gap";
2050
+ readonly gridRowGap: "space-gap";
2051
+ readonly gridTemplateColumns: "sizes";
2052
+ readonly gridTemplateRows: "sizes";
2053
+ readonly height: "sizes";
2054
+ readonly inlineSize: "sizes";
2055
+ readonly inset: "space-inset";
2056
+ readonly insetBlock: "space-inset";
2057
+ readonly insetBlockEnd: "space-inset";
2058
+ readonly insetBlockStart: "space-inset";
2059
+ readonly insetInline: "space-inset";
2060
+ readonly insetInlineEnd: "space-inset";
2061
+ readonly insetInlineStart: "space-inset";
2062
+ readonly left: "space";
2063
+ readonly letterSpacing: "letter-spacings";
2064
+ readonly lineHeight: "line-heights";
2065
+ readonly margin: "space-offset";
2066
+ readonly marginBlock: "space-offset";
2067
+ readonly marginBlockEnd: "space-offset";
2068
+ readonly marginBlockStart: "space-offset";
2069
+ readonly marginBottom: "space-offset";
2070
+ readonly marginInline: "space-offset";
2071
+ readonly marginInlineEnd: "space-offset";
2072
+ readonly marginInlineStart: "space-offset";
2073
+ readonly marginLeft: "space-offset";
2074
+ readonly marginRight: "space-offset";
2075
+ readonly marginTop: "space-offset";
2076
+ readonly maxBlockSize: "sizes";
2077
+ readonly maxHeight: "sizes";
2078
+ readonly maxInlineSize: "sizes";
2079
+ readonly maxWidth: "sizes";
2080
+ readonly minBlockSize: "sizes";
2081
+ readonly minHeight: "sizes";
2082
+ readonly minInlineSize: "sizes";
2083
+ readonly minWidth: "sizes";
2084
+ readonly outline: "colors";
2085
+ readonly outlineColor: "colors";
2086
+ readonly padding: "space-inset";
2087
+ readonly paddingBlock: "space-inset";
2088
+ readonly paddingBlockEnd: "space-inset";
2089
+ readonly paddingBlockStart: "space-inset";
2090
+ readonly paddingBottom: "space-inset";
2091
+ readonly paddingInline: "space-inset";
2092
+ readonly paddingInlineEnd: "space-inset";
2093
+ readonly paddingInlineStart: "space-inset";
2094
+ readonly paddingLeft: "space-inset";
2095
+ readonly paddingRight: "space-inset";
2096
+ readonly paddingTop: "space-inset";
2097
+ readonly right: "space";
2098
+ readonly rowGap: "space-gap";
2099
+ readonly scrollMargin: "space-offset";
2100
+ readonly scrollMarginBlock: "space-offset";
2101
+ readonly scrollMarginBlockEnd: "space-offset";
2102
+ readonly scrollMarginBlockStart: "space-offset";
2103
+ readonly scrollMarginBottom: "space-offset";
2104
+ readonly scrollMarginInline: "space-offset";
2105
+ readonly scrollMarginInlineEnd: "space-offset";
2106
+ readonly scrollMarginInlineStart: "space-offset";
2107
+ readonly scrollMarginLeft: "space-offset";
2108
+ readonly scrollMarginRight: "space-offset";
2109
+ readonly scrollMarginTop: "space-offset";
2110
+ readonly scrollPadding: "space-inset";
2111
+ readonly scrollPaddingBlock: "space-inset";
2112
+ readonly scrollPaddingBlockEnd: "space-inset";
2113
+ readonly scrollPaddingBlockStart: "space-inset";
2114
+ readonly scrollPaddingBottom: "space-inset";
2115
+ readonly scrollPaddingInline: "space-inset";
2116
+ readonly scrollPaddingInlineEnd: "space-inset";
2117
+ readonly scrollPaddingInlineStart: "space-inset";
2118
+ readonly scrollPaddingLeft: "space-inset";
2119
+ readonly scrollPaddingRight: "space-inset";
2120
+ readonly scrollPaddingTop: "space-inset";
2121
+ readonly stroke: "colors";
2122
+ readonly strokeWidth: "stroke-width";
2123
+ readonly textDecorationColor: "colors";
2124
+ readonly textShadow: "shadows";
2125
+ readonly top: "space";
2126
+ readonly transition: "transitions";
2127
+ readonly width: "sizes";
2128
+ readonly zIndex: "z-indices";
2129
+ }, {
2130
+ paddingX: (value: {
2131
+ readonly [$$PropertyValue]: "padding";
2132
+ }) => {
2133
+ paddingLeft: {
2134
+ readonly [$$PropertyValue]: "padding";
2135
+ };
2136
+ paddingRight: {
2137
+ readonly [$$PropertyValue]: "padding";
2138
+ };
2139
+ };
2140
+ paddingY: (value: {
2141
+ readonly [$$PropertyValue]: "padding";
2142
+ }) => {
2143
+ paddingTop: {
2144
+ readonly [$$PropertyValue]: "padding";
2145
+ };
2146
+ paddingBottom: {
2147
+ readonly [$$PropertyValue]: "padding";
2148
+ };
2149
+ };
2150
+ marginX: (value: {
2151
+ readonly [$$PropertyValue]: "margin";
2152
+ }) => {
2153
+ marginLeft: {
2154
+ readonly [$$PropertyValue]: "margin";
2155
+ };
2156
+ marginRight: {
2157
+ readonly [$$PropertyValue]: "margin";
2158
+ };
2159
+ };
2160
+ marginY: (value: {
2161
+ readonly [$$PropertyValue]: "margin";
2162
+ }) => {
2163
+ marginTop: {
2164
+ readonly [$$PropertyValue]: "margin";
2165
+ };
2166
+ marginBottom: {
2167
+ readonly [$$PropertyValue]: "margin";
2168
+ };
2169
+ };
2170
+ square: (value: {
2171
+ readonly [$$PropertyValue]: "width";
2172
+ }) => {
2173
+ width: {
2174
+ readonly [$$PropertyValue]: "width";
2175
+ };
2176
+ height: {
2177
+ readonly [$$PropertyValue]: "width";
2178
+ };
2179
+ };
2180
+ _hover: (css: _stitches_react_types_css_util.CSSProperties) => {
2181
+ '&:hover, &[data-hovered]': _stitches_react_types_css_util.CSSProperties;
2182
+ };
2183
+ }>>>, "variant"> & _stitches_react_types_styled_component.TransformProps<{
2184
+ variant?: "dark" | "light" | undefined;
2185
+ }, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<SVGSVGElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_radix_ui_react_popover.PopoverArrowProps & react.RefAttributes<SVGSVGElement>>, {
2186
+ variant?: "dark" | "light" | undefined;
2187
+ }, {}>;
2188
+ declare type StyledArrowProps = StrictComponentProps<typeof StyledArrow>;
2189
+
2190
+ interface ArrowProps extends StyledArrowProps {
2191
+ /**
2192
+ * The appearance of arrow.
2193
+ */
2194
+ variant?: StyledArrowProps['variant'];
2195
+ }
2196
+
2197
+ declare type AnchorProps = PopoverAnchorProps;
2198
+
2199
+ export { Popover, AnchorProps as PopoverAnchorProps, ArrowProps as PopoverArrowProps, CloseProps as PopoverCloseProps, ContentProps as PopoverContentProps, PortalProps as PopoverPortalProps, PopoverProps, TriggerProps as PopoverTriggerProps, types as PopoverTypes };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mirohq/design-system-popover",
3
- "version": "5.1.11",
3
+ "version": "5.1.13",
4
4
  "description": "",
5
5
  "author": "Miro",
6
6
  "source": "src/index.ts",
@@ -29,8 +29,8 @@
29
29
  "dependencies": {
30
30
  "@radix-ui/react-popover": "^1.0.0",
31
31
  "@radix-ui/react-use-size": "^1.0.1",
32
+ "@mirohq/design-system-icons": "^0.33.1",
32
33
  "@mirohq/design-system-primitive": "^1.1.1",
33
- "@mirohq/design-system-icons": "^0.32.7",
34
34
  "@mirohq/design-system-styles": "^1.1.19",
35
35
  "@mirohq/design-system-stitches": "^2.6.0"
36
36
  },