@mantine/core/cjs/components/Tooltip/use-tooltip.cjs.map

React components library focused on usability, accessibility and developer experience

{"version":3,"file":"use-tooltip.cjs","names":["TooltipGroupContext","autoUpdate"],"sources":["../../../src/components/Tooltip/use-tooltip.ts"],"sourcesContent":["import { use, useCallback, useState } from 'react';\nimport {\n  arrow,\n  autoUpdate,\n  flip,\n  inline,\n  offset,\n  shift,\n  useDelayGroup,\n  useDismiss,\n  useFloating,\n  useFocus,\n  useHover,\n  useInteractions,\n  useRole,\n  type Middleware,\n} from '@floating-ui/react';\nimport { useDidUpdate, useId } from '@mantine/hooks';\nimport { FloatingAxesOffsets, FloatingPosition, FloatingStrategy } from '../../utils/Floating';\nimport { type TooltipMiddlewares } from './Tooltip.types';\nimport { TooltipGroupContext } from './TooltipGroup/TooltipGroup';\n\ninterface UseTooltip {\n  position: FloatingPosition;\n  closeDelay?: number;\n  openDelay?: number;\n  onPositionChange?: (position: FloatingPosition) => void;\n  opened?: boolean;\n  defaultOpened?: boolean;\n  offset: number | FloatingAxesOffsets;\n  arrowRef?: React.RefObject<HTMLDivElement | null>;\n  arrowOffset?: number;\n  events?: { hover: boolean; focus: boolean; touch: boolean };\n  inline?: boolean;\n  strategy?: FloatingStrategy;\n  middlewares?: TooltipMiddlewares;\n}\n\nfunction getDefaultMiddlewares(middlewares: TooltipMiddlewares | undefined): TooltipMiddlewares {\n  if (middlewares === undefined) {\n    return { shift: true, flip: true };\n  }\n\n  const result = { ...middlewares };\n  if (middlewares.shift === undefined) {\n    result.shift = true;\n  }\n\n  if (middlewares.flip === undefined) {\n    result.flip = true;\n  }\n\n  return result;\n}\n\nfunction getTooltipMiddlewares(settings: UseTooltip) {\n  const middlewaresOptions = getDefaultMiddlewares(settings.middlewares);\n  const middlewares: Middleware[] = [offset(settings.offset)];\n\n  if (middlewaresOptions.shift) {\n    middlewares.push(\n      shift(\n        typeof middlewaresOptions.shift === 'boolean'\n          ? { padding: 8 }\n          : { padding: 8, ...middlewaresOptions.shift }\n      )\n    );\n  }\n\n  if (middlewaresOptions.flip) {\n    middlewares.push(\n      typeof middlewaresOptions.flip === 'boolean' ? flip() : flip(middlewaresOptions.flip)\n    );\n  }\n\n  middlewares.push(arrow({ element: settings.arrowRef!, padding: settings.arrowOffset }));\n\n  if (middlewaresOptions.inline) {\n    middlewares.push(\n      typeof middlewaresOptions.inline === 'boolean' ? inline() : inline(middlewaresOptions.inline)\n    );\n  } else if (settings.inline) {\n    middlewares.push(inline());\n  }\n\n  return middlewares;\n}\n\nexport function useTooltip(settings: UseTooltip) {\n  const [uncontrolledOpened, setUncontrolledOpened] = useState(settings.defaultOpened);\n  const controlled = typeof settings.opened === 'boolean';\n  const opened = controlled ? settings.opened : uncontrolledOpened;\n  const withinGroup = use(TooltipGroupContext).withinGroup;\n  const uid = useId();\n\n  const onChange = useCallback(\n    (_opened: boolean) => {\n      setUncontrolledOpened(_opened);\n\n      if (_opened) {\n        setCurrentId(uid);\n      }\n    },\n    [uid]\n  );\n\n  const {\n    x,\n    y,\n    context,\n    refs,\n    placement,\n    middlewareData: { arrow: { x: arrowX, y: arrowY } = {} },\n  } = useFloating({\n    strategy: settings.strategy,\n    placement: settings.position,\n    open: opened,\n    onOpenChange: onChange,\n    middleware: getTooltipMiddlewares(settings),\n    whileElementsMounted: autoUpdate,\n  });\n\n  const { delay: groupDelay, currentId, setCurrentId } = useDelayGroup(context, { id: uid });\n\n  const { getReferenceProps, getFloatingProps } = useInteractions([\n    useHover(context, {\n      enabled: settings.events?.hover,\n      delay: withinGroup ? groupDelay : { open: settings.openDelay, close: settings.closeDelay },\n      mouseOnly: !settings.events?.touch,\n    }),\n    useFocus(context, { enabled: settings.events?.focus, visibleOnly: true }),\n    useRole(context, { role: 'tooltip' }),\n    // Cannot be used with controlled tooltip, page jumps\n    useDismiss(context, { enabled: typeof settings.opened === 'undefined' }),\n  ]);\n\n  useDidUpdate(() => {\n    settings.onPositionChange?.(placement);\n  }, [placement]);\n\n  const isGroupPhase = opened && currentId && currentId !== uid;\n\n  return {\n    x,\n    y,\n    arrowX,\n    arrowY,\n    reference: refs.setReference,\n    floating: refs.setFloating,\n    getFloatingProps,\n    getReferenceProps,\n    isGroupPhase,\n    opened,\n    placement,\n  };\n}\n"],"mappings":";;;;;;;AAsCA,SAAS,sBAAsB,aAAiE;AAC9F,KAAI,gBAAgB,KAAA,EAClB,QAAO;EAAE,OAAO;EAAM,MAAM;EAAM;CAGpC,MAAM,SAAS,EAAE,GAAG,aAAa;AACjC,KAAI,YAAY,UAAU,KAAA,EACxB,QAAO,QAAQ;AAGjB,KAAI,YAAY,SAAS,KAAA,EACvB,QAAO,OAAO;AAGhB,QAAO;;AAGT,SAAS,sBAAsB,UAAsB;CACnD,MAAM,qBAAqB,sBAAsB,SAAS,YAAY;CACtE,MAAM,cAA4B,EAAA,GAAA,mBAAA,QAAQ,SAAS,OAAO,CAAC;AAE3D,KAAI,mBAAmB,MACrB,aAAY,MAAA,GAAA,mBAAA,OAER,OAAO,mBAAmB,UAAU,YAChC,EAAE,SAAS,GAAG,GACd;EAAE,SAAS;EAAG,GAAG,mBAAmB;EAAO,CAChD,CACF;AAGH,KAAI,mBAAmB,KACrB,aAAY,KACV,OAAO,mBAAmB,SAAS,aAAA,GAAA,mBAAA,OAAkB,IAAA,GAAA,mBAAA,MAAQ,mBAAmB,KAAK,CACtF;AAGH,aAAY,MAAA,GAAA,mBAAA,OAAW;EAAE,SAAS,SAAS;EAAW,SAAS,SAAS;EAAa,CAAC,CAAC;AAEvF,KAAI,mBAAmB,OACrB,aAAY,KACV,OAAO,mBAAmB,WAAW,aAAA,GAAA,mBAAA,SAAoB,IAAA,GAAA,mBAAA,QAAU,mBAAmB,OAAO,CAC9F;UACQ,SAAS,OAClB,aAAY,MAAA,GAAA,mBAAA,SAAa,CAAC;AAG5B,QAAO;;AAGT,SAAgB,WAAW,UAAsB;CAC/C,MAAM,CAAC,oBAAoB,0BAAA,GAAA,MAAA,UAAkC,SAAS,cAAc;CAEpF,MAAM,SADa,OAAO,SAAS,WAAW,YAClB,SAAS,SAAS;CAC9C,MAAM,eAAA,GAAA,MAAA,KAAkBA,qBAAAA,oBAAoB,CAAC;CAC7C,MAAM,OAAA,GAAA,eAAA,QAAa;CAEnB,MAAM,YAAA,GAAA,MAAA,cACH,YAAqB;AACpB,wBAAsB,QAAQ;AAE9B,MAAI,QACF,cAAa,IAAI;IAGrB,CAAC,IAAI,CACN;CAED,MAAM,EACJ,GACA,GACA,SACA,MACA,WACA,gBAAgB,EAAE,OAAO,EAAE,GAAG,QAAQ,GAAG,WAAW,EAAE,QAAA,GAAA,mBAAA,aACxC;EACd,UAAU,SAAS;EACnB,WAAW,SAAS;EACpB,MAAM;EACN,cAAc;EACd,YAAY,sBAAsB,SAAS;EAC3C,sBAAsBC,mBAAAA;EACvB,CAAC;CAEF,MAAM,EAAE,OAAO,YAAY,WAAW,kBAAA,GAAA,mBAAA,eAA+B,SAAS,EAAE,IAAI,KAAK,CAAC;CAE1F,MAAM,EAAE,mBAAmB,sBAAA,GAAA,mBAAA,iBAAqC;mCACrD,SAAS;GAChB,SAAS,SAAS,QAAQ;GAC1B,OAAO,cAAc,aAAa;IAAE,MAAM,SAAS;IAAW,OAAO,SAAS;IAAY;GAC1F,WAAW,CAAC,SAAS,QAAQ;GAC9B,CAAC;mCACO,SAAS;GAAE,SAAS,SAAS,QAAQ;GAAO,aAAa;GAAM,CAAC;kCACjE,SAAS,EAAE,MAAM,WAAW,CAAC;qCAE1B,SAAS,EAAE,SAAS,OAAO,SAAS,WAAW,aAAa,CAAC;EACzE,CAAC;AAEF,EAAA,GAAA,eAAA,oBAAmB;AACjB,WAAS,mBAAmB,UAAU;IACrC,CAAC,UAAU,CAAC;CAEf,MAAM,eAAe,UAAU,aAAa,cAAc;AAE1D,QAAO;EACL;EACA;EACA;EACA;EACA,WAAW,KAAK;EAChB,UAAU,KAAK;EACf;EACA;EACA;EACA;EACA;EACD"}