@vector-im/compound-web 8.3.6 → 9.0.0

package/dist/components/Tooltip/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["/*\nCopyright 2023, 2024 New Vector Ltd.\n\nSPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial\nPlease see LICENSE files in the repository root for full details.\n*/\n\nimport { TooltipContext, useTooltipContext } from \"./TooltipContext\";\nimport {\n  FloatingArrow,\n  FloatingPortal,\n  useMergeRefs,\n} from \"@floating-ui/react\";\nimport React, {\n  type PropsWithChildren,\n  type Ref,\n  type JSX,\n  isValidElement,\n  cloneElement,\n  useMemo,\n  type ReactNode,\n  type FC,\n  type ReactElement,\n} from \"react\";\n\nimport classNames from \"classnames\";\nimport styles from \"./Tooltip.module.css\";\nimport {\n  type CommonUseTooltipProps,\n  type TooltipDescription,\n  type TooltipLabel,\n  useTooltip,\n} from \"./useTooltip\";\n\n// Unfortunately Omit doesn't distribute nicely over sum types, so we have to\n// piece together the useTooltip options type by hand\ntype TooltipProps = Omit<CommonUseTooltipProps, \"isTriggerInteractive\"> &\n  (TooltipLabel | TooltipDescription) & {\n    /**\n     * Whether the trigger element is interactive.\n     * When trigger is interactive:\n     *      - tooltip will be shown after a 300ms delay.\n     * When trigger is not interactive:\n     *      - tooltip will be shown instantly when pointer enters trigger.\n     *      - trigger will be wrapped in a span with a tab index from prop nonInteractiveTriggerTabIndex\n     * @default true\n     */\n    isTriggerInteractive?: boolean;\n    /**\n     * The tab index for the non interactive trigger.\n     * @default 0\n     */\n    nonInteractiveTriggerTabIndex?: number;\n  };\n\nconst hasLabel = (\n  props: TooltipLabel | TooltipDescription,\n): props is TooltipLabel => \"label\" in props && !!props.label;\n\n/**\n * A tooltip component\n */\nexport function Tooltip({\n  children,\n  isTriggerInteractive = true,\n  nonInteractiveTriggerTabIndex = 0,\n  ...props\n}: PropsWithChildren<TooltipProps>): JSX.Element {\n  const context = useTooltip({ isTriggerInteractive, ...props });\n\n  return (\n    <TooltipContext.Provider value={context}>\n      <TooltipAnchor\n        isTriggerInteractive={isTriggerInteractive}\n        nonInteractiveTriggerTabIndex={nonInteractiveTriggerTabIndex}\n      >\n        {children}\n      </TooltipAnchor>\n      <TooltipContent>\n        <span id={context.labelId}>\n          {hasLabel(props) ? props.label : props.description}\n        </span>\n        <Caption />\n      </TooltipContent>\n    </TooltipContext.Provider>\n  );\n}\n\nfunction Caption() {\n  const { caption, captionId } = useTooltipContext();\n  if (!caption) return null;\n\n  const isCaptionString = typeof caption === \"string\";\n  const Container = isCaptionString ? \"span\" : \"div\";\n\n  /**\n   * Forcing dark theme, so that we have the correct contrast when\n   * using the text color secondary on a solid dark background.\n   * This is temporary and should only remain until we figure out\n   * the approach to on-solid tokens\n   **/\n  return (\n    <Container\n      id={captionId}\n      className={classNames(styles.caption, \"cpd-theme-dark\")}\n    >\n      {caption}\n    </Container>\n  );\n}\n\n/**\n * The content of the tooltip\n * @param children\n */\nfunction TooltipContent({\n  children,\n}: Readonly<PropsWithChildren>): JSX.Element | null {\n  const {\n    context: floatingContext,\n    open,\n    arrowRef,\n    purpose,\n    ...rest\n  } = useTooltipContext();\n\n  // Label tooltips are kept in the DOM even when not visually open\n  if (!open && purpose !== \"label\") return null;\n\n  return (\n    <FloatingPortal>\n      <div\n        ref={rest.refs.setFloating}\n        style={rest.floatingStyles}\n        {...rest.tooltipProps}\n        {...rest.getFloatingProps()}\n        className={classNames(styles.tooltip, {\n          [styles.invisible]: purpose === \"label\" && !open,\n        })}\n      >\n        <FloatingArrow\n          ref={arrowRef}\n          context={floatingContext}\n          // design absolute value\n          width={10}\n          height={6}\n          className={styles.arrow}\n        />\n        {children}\n      </div>\n    </FloatingPortal>\n  );\n}\n\ninterface TooltipAnchorProps {\n  children: ReactNode;\n  isTriggerInteractive: boolean;\n  nonInteractiveTriggerTabIndex?: number;\n}\n\n/**\n * The anchor of the tooltip\n * @param children\n */\nconst TooltipAnchor: FC<TooltipAnchorProps> = ({\n  children,\n  isTriggerInteractive,\n  nonInteractiveTriggerTabIndex,\n}) => {\n  const context = useTooltipContext();\n\n  // The children can have a ref and we don't want to discard it\n  // Doing a dirty cast to get the optional ref\n  const childrenRef = (children as unknown as { ref?: Ref<HTMLElement> })?.ref;\n  const ref = useMergeRefs([context.refs.setReference, childrenRef]);\n\n  const element = useMemo(() => {\n    if (!isValidElement(children)) return;\n\n    if (isTriggerInteractive) {\n      const props = context.getReferenceProps({\n        // To support React 18, we need to explicitly pass the children's props. See  https://github.com/element-hq/compound/issues/333\n        // In React 19, this is not necessary. `getReferenceProps` is able to get the props directly from the ref.\n        ...(typeof children.props === \"object\" ? children.props : {}),\n        ref,\n      });\n      return cloneElement(children, props);\n    } else {\n      // For a non-interactive trigger, we want most of the props to go on the\n      // span element that we provide, since that's what receives focus, but it\n      // should still be the trigger that receives the label/description. It\n      // would be wrong to label the span element, as it lacks a role.\n      const props = context.getReferenceProps({\n        ref,\n        tabIndex: nonInteractiveTriggerTabIndex,\n      });\n      const {\n        \"aria-labelledby\": labelId,\n        \"aria-describedby\": descriptionId,\n        ...spanProps\n      } = props;\n      return (\n        <span tabIndex={nonInteractiveTriggerTabIndex} {...spanProps}>\n          {cloneElement(children as ReactElement<Record<string, unknown>>, {\n            \"aria-labelledby\": labelId,\n            \"aria-describedby\": descriptionId,\n          })}\n        </span>\n      );\n    }\n  }, [context, ref, children]);\n\n  if (!element) {\n    throw new Error(\"Tooltip anchor must be a single valid React element\");\n  }\n\n  return element;\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Tooltip.js","names":[],"sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["/*\nCopyright 2023, 2024 New Vector Ltd.\n\nSPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial\nPlease see LICENSE files in the repository root for full details.\n*/\n\nimport { TooltipContext, useTooltipContext } from \"./TooltipContext\";\nimport {\n  FloatingArrow,\n  FloatingPortal,\n  useMergeRefs,\n} from \"@floating-ui/react\";\nimport React, {\n  type PropsWithChildren,\n  type Ref,\n  type JSX,\n  isValidElement,\n  cloneElement,\n  useMemo,\n  type ReactNode,\n  type FC,\n  type ReactElement,\n} from \"react\";\n\nimport classNames from \"classnames\";\nimport styles from \"./Tooltip.module.css\";\nimport {\n  type CommonUseTooltipProps,\n  type TooltipDescription,\n  type TooltipLabel,\n  useTooltip,\n} from \"./useTooltip\";\n\n// Unfortunately Omit doesn't distribute nicely over sum types, so we have to\n// piece together the useTooltip options type by hand\ntype TooltipProps = Omit<CommonUseTooltipProps, \"isTriggerInteractive\"> &\n  (TooltipLabel | TooltipDescription) & {\n    /**\n     * Whether the trigger element is interactive.\n     * When trigger is interactive:\n     *      - tooltip will be shown after a 300ms delay.\n     * When trigger is not interactive:\n     *      - tooltip will be shown instantly when pointer enters trigger.\n     *      - trigger will be wrapped in a span with a tab index from prop nonInteractiveTriggerTabIndex\n     * @default true\n     */\n    isTriggerInteractive?: boolean;\n    /**\n     * The tab index for the non interactive trigger.\n     * @default 0\n     */\n    nonInteractiveTriggerTabIndex?: number;\n  };\n\nconst hasLabel = (\n  props: TooltipLabel | TooltipDescription,\n): props is TooltipLabel => \"label\" in props && !!props.label;\n\n/**\n * A tooltip component\n */\nexport function Tooltip({\n  children,\n  isTriggerInteractive = true,\n  nonInteractiveTriggerTabIndex = 0,\n  ...props\n}: PropsWithChildren<TooltipProps>): JSX.Element {\n  const context = useTooltip({ isTriggerInteractive, ...props });\n\n  return (\n    <TooltipContext.Provider value={context}>\n      <TooltipAnchor\n        isTriggerInteractive={isTriggerInteractive}\n        nonInteractiveTriggerTabIndex={nonInteractiveTriggerTabIndex}\n      >\n        {children}\n      </TooltipAnchor>\n      <TooltipContent>\n        <span id={context.labelId}>\n          {hasLabel(props) ? props.label : props.description}\n        </span>\n        <Caption />\n      </TooltipContent>\n    </TooltipContext.Provider>\n  );\n}\n\nfunction Caption() {\n  const { caption, captionId } = useTooltipContext();\n  if (!caption) return null;\n\n  const isCaptionString = typeof caption === \"string\";\n  const Container = isCaptionString ? \"span\" : \"div\";\n\n  /**\n   * Forcing dark theme, so that we have the correct contrast when\n   * using the text color secondary on a solid dark background.\n   * This is temporary and should only remain until we figure out\n   * the approach to on-solid tokens\n   **/\n  return (\n    <Container\n      id={captionId}\n      className={classNames(styles.caption, \"cpd-theme-dark\")}\n    >\n      {caption}\n    </Container>\n  );\n}\n\n/**\n * The content of the tooltip\n * @param children\n */\nfunction TooltipContent({\n  children,\n}: Readonly<PropsWithChildren>): JSX.Element | null {\n  const {\n    context: floatingContext,\n    open,\n    arrowRef,\n    purpose,\n    ...rest\n  } = useTooltipContext();\n\n  // Label tooltips are kept in the DOM even when not visually open\n  if (!open && purpose !== \"label\") return null;\n\n  return (\n    <FloatingPortal>\n      <div\n        ref={rest.refs.setFloating}\n        style={rest.floatingStyles}\n        {...rest.tooltipProps}\n        {...rest.getFloatingProps()}\n        className={classNames(styles.tooltip, {\n          [styles.invisible]: purpose === \"label\" && !open,\n        })}\n      >\n        <FloatingArrow\n          ref={arrowRef}\n          context={floatingContext}\n          // design absolute value\n          width={10}\n          height={6}\n          className={styles.arrow}\n        />\n        {children}\n      </div>\n    </FloatingPortal>\n  );\n}\n\ninterface TooltipAnchorProps {\n  children: ReactNode;\n  isTriggerInteractive: boolean;\n  nonInteractiveTriggerTabIndex?: number;\n}\n\n/**\n * The anchor of the tooltip\n * @param children\n */\nconst TooltipAnchor: FC<TooltipAnchorProps> = ({\n  children,\n  isTriggerInteractive,\n  nonInteractiveTriggerTabIndex,\n}) => {\n  const context = useTooltipContext();\n\n  // The children can have a ref and we don't want to discard it\n  // Doing a dirty cast to get the optional ref\n  const childrenRef = (children as unknown as { ref?: Ref<HTMLElement> })?.ref;\n  const ref = useMergeRefs([context.refs.setReference, childrenRef]);\n\n  const element = useMemo(() => {\n    if (!isValidElement(children)) return;\n\n    if (isTriggerInteractive) {\n      const props = context.getReferenceProps({\n        // To support React 18, we need to explicitly pass the children's props. See  https://github.com/element-hq/compound/issues/333\n        // In React 19, this is not necessary. `getReferenceProps` is able to get the props directly from the ref.\n        ...(typeof children.props === \"object\" ? children.props : {}),\n        ref,\n      });\n      return cloneElement(children, props);\n    } else {\n      // For a non-interactive trigger, we want most of the props to go on the\n      // span element that we provide, since that's what receives focus, but it\n      // should still be the trigger that receives the label/description. It\n      // would be wrong to label the span element, as it lacks a role.\n      const props = context.getReferenceProps({\n        ref,\n        tabIndex: nonInteractiveTriggerTabIndex,\n      });\n      const {\n        \"aria-labelledby\": labelId,\n        \"aria-describedby\": descriptionId,\n        ...spanProps\n      } = props;\n      return (\n        <span tabIndex={nonInteractiveTriggerTabIndex} {...spanProps}>\n          {cloneElement(children as ReactElement<Record<string, unknown>>, {\n            \"aria-labelledby\": labelId,\n            \"aria-describedby\": descriptionId,\n          })}\n        </span>\n      );\n    }\n  }, [context, ref, children]);\n\n  if (!element) {\n    throw new Error(\"Tooltip anchor must be a single valid React element\");\n  }\n\n  return element;\n};\n"],"mappings":";;;;;;;;AAuDA,IAAM,YACJ,UAC0B,WAAW,SAAS,CAAC,CAAC,MAAM;;;;AAKxD,SAAgB,QAAQ,EACtB,UACA,uBAAuB,MACvB,gCAAgC,GAChC,GAAG,SAC4C;CAC/C,MAAM,UAAU,WAAW;EAAE;EAAsB,GAAG;EAAO,CAAC;AAE9D,QACE,qBAAC,eAAe,UAAhB;EAAyB,OAAO;YAAhC,CACE,oBAAC,eAAD;GACwB;GACS;GAE9B;GACa,CAAA,EAChB,qBAAC,gBAAD,EAAA,UAAA,CACE,oBAAC,QAAD;GAAM,IAAI,QAAQ;aACf,SAAS,MAAM,GAAG,MAAM,QAAQ,MAAM;GAClC,CAAA,EACP,oBAAC,SAAD,EAAW,CAAA,CACI,EAAA,CAAA,CACO;;;AAI9B,SAAS,UAAU;CACjB,MAAM,EAAE,SAAS,cAAc,mBAAmB;AAClD,KAAI,CAAC,QAAS,QAAO;;;;;;;AAWrB,QACE,oBAVsB,OAAO,YAAY,WACP,SAAS,OAS3C;EACE,IAAI;EACJ,WAAW,WAAW,uBAAO,SAAS,iBAAiB;YAEtD;EACS,CAAA;;;;;;AAQhB,SAAS,eAAe,EACtB,YACkD;CAClD,MAAM,EACJ,SAAS,iBACT,MACA,UACA,SACA,GAAG,SACD,mBAAmB;AAGvB,KAAI,CAAC,QAAQ,YAAY,QAAS,QAAO;AAEzC,QACE,oBAAC,gBAAD,EAAA,UACE,qBAAC,OAAD;EACE,KAAK,KAAK,KAAK;EACf,OAAO,KAAK;EACZ,GAAI,KAAK;EACT,GAAI,KAAK,kBAAkB;EAC3B,WAAW,WAAW,uBAAO,SAAS,GACnC,uBAAO,YAAY,YAAY,WAAW,CAAC,MAC7C,CAAC;YAPJ,CASE,oBAAC,eAAD;GACE,KAAK;GACL,SAAS;GAET,OAAO;GACP,QAAQ;GACR,WAAW,uBAAO;GAClB,CAAA,EACD,SACG;KACS,CAAA;;;;;;AAcrB,IAAM,iBAAyC,EAC7C,UACA,sBACA,oCACI;CACJ,MAAM,UAAU,mBAAmB;CAInC,MAAM,cAAe,UAAoD;CACzE,MAAM,MAAM,aAAa,CAAC,QAAQ,KAAK,cAAc,YAAY,CAAC;CAElE,MAAM,UAAU,cAAc;AAC5B,MAAI,CAAC,eAAe,SAAS,CAAE;AAE/B,MAAI,qBAOF,QAAO,aAAa,UANN,QAAQ,kBAAkB;GAGtC,GAAI,OAAO,SAAS,UAAU,WAAW,SAAS,QAAQ,EAAE;GAC5D;GACD,CAAC,CACkC;OAC/B;GASL,MAAM,EACJ,mBAAmB,SACnB,oBAAoB,eACpB,GAAG,cAPS,QAAQ,kBAAkB;IACtC;IACA,UAAU;IACX,CAAC;AAMF,UACE,oBAAC,QAAD;IAAM,UAAU;IAA+B,GAAI;cAChD,aAAa,UAAmD;KAC/D,mBAAmB;KACnB,oBAAoB;KACrB,CAAC;IACG,CAAA;;IAGV;EAAC;EAAS;EAAK;EAAS,CAAC;AAE5B,KAAI,CAAC,QACH,OAAM,IAAI,MAAM,sDAAsD;AAGxE,QAAO"}

package/dist/components/Tooltip/Tooltip.module.cjs

@@ -0,0 +1,10 @@
+var Tooltip_module_default = {
+	tooltip: "_tooltip_1nqnq_8",
+	invisible: "_invisible_1nqnq_21",
+	caption: "_caption_1nqnq_28",
+	arrow: "_arrow_1nqnq_33"
+};
+//#endregion
+exports.default = Tooltip_module_default;
+
+//# sourceMappingURL=Tooltip.module.cjs.map

package/dist/components/Tooltip/Tooltip.module.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.module.cjs","names":[],"sources":["../../../src/components/Tooltip/Tooltip.module.css"],"sourcesContent":["/*\nCopyright 2023, 2024 New Vector Ltd.\n\nSPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial\nPlease see LICENSE files in the repository root for full details.\n*/\n\n.tooltip {\n  font: var(--cpd-font-body-xs-medium);\n  padding: var(--cpd-space-1-5x) var(--cpd-space-3x);\n  background: var(--cpd-color-alpha-gray-1400);\n  color: var(--cpd-color-text-on-solid-primary);\n  border-radius: 4px;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  text-align: center;\n  cursor: pointer;\n}\n\n.tooltip.invisible {\n  /* Hide the tooltip in a way that allows it to act as an accessible label,\n  even when invisible */\n  clip-path: inset(50%);\n  pointer-events: none;\n}\n\n.caption {\n  font-weight: var(--cpd-font-weight-regular);\n  color: var(--cpd-color-text-secondary);\n}\n\n.arrow {\n  /* same color as the tooltip background */\n  fill: var(--cpd-color-alpha-gray-1400);\n}\n\n@media (forced-colors: active) {\n  .tooltip:not(.invisible) {\n    outline: 1px solid transparent;\n  }\n}\n"],"mappings":""}

package/dist/components/Tooltip/Tooltip.module.js

@@ -0,0 +1,10 @@
+var Tooltip_module_default = {
+	tooltip: "_tooltip_1nqnq_8",
+	invisible: "_invisible_1nqnq_21",
+	caption: "_caption_1nqnq_28",
+	arrow: "_arrow_1nqnq_33"
+};
+//#endregion
+export { Tooltip_module_default as default };
+
+//# sourceMappingURL=Tooltip.module.js.map

package/dist/components/Tooltip/Tooltip.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.module.js","names":[],"sources":["../../../src/components/Tooltip/Tooltip.module.css"],"sourcesContent":["/*\nCopyright 2023, 2024 New Vector Ltd.\n\nSPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial\nPlease see LICENSE files in the repository root for full details.\n*/\n\n.tooltip {\n  font: var(--cpd-font-body-xs-medium);\n  padding: var(--cpd-space-1-5x) var(--cpd-space-3x);\n  background: var(--cpd-color-alpha-gray-1400);\n  color: var(--cpd-color-text-on-solid-primary);\n  border-radius: 4px;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  text-align: center;\n  cursor: pointer;\n}\n\n.tooltip.invisible {\n  /* Hide the tooltip in a way that allows it to act as an accessible label,\n  even when invisible */\n  clip-path: inset(50%);\n  pointer-events: none;\n}\n\n.caption {\n  font-weight: var(--cpd-font-weight-regular);\n  color: var(--cpd-color-text-secondary);\n}\n\n.arrow {\n  /* same color as the tooltip background */\n  fill: var(--cpd-color-alpha-gray-1400);\n}\n\n@media (forced-colors: active) {\n  .tooltip:not(.invisible) {\n    outline: 1px solid transparent;\n  }\n}\n"],"mappings":""}

package/dist/components/Tooltip/TooltipContext.cjs

@@ -1,14 +1,20 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const React = require("react");
-const TooltipContext = React.createContext(null);
+require("../../_virtual/_rolldown/runtime.cjs");
+let react = require("react");
+//#region src/components/Tooltip/TooltipContext.ts
+/**
+* The context for the Tooltip components.
+*/
+var TooltipContext = (0, react.createContext)(null);
+/**
+* Provides the context for the Tooltip components.
+*/
 function useTooltipContext() {
-  const context = React.useContext(TooltipContext);
-  if (context == null) {
-    throw new Error("Tooltip components must be wrapped in <Tooltip />");
-  }
-  return context;
+	const context = (0, react.useContext)(TooltipContext);
+	if (context == null) throw new Error("Tooltip components must be wrapped in <Tooltip />");
+	return context;
 }
+//#endregion
 exports.TooltipContext = TooltipContext;
 exports.useTooltipContext = useTooltipContext;
-//# sourceMappingURL=TooltipContext.cjs.map
+
+//# sourceMappingURL=TooltipContext.cjs.map

package/dist/components/Tooltip/TooltipContext.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TooltipContext.cjs","sources":["../../../src/components/Tooltip/TooltipContext.ts"],"sourcesContent":["/*\n * Copyright 2024 New Vector Ltd.\n *\n * SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial\n * Please see LICENSE files in the repository root for full details.\n */\n\nimport { createContext, useContext } from \"react\";\nimport { useTooltip } from \"./useTooltip\";\n\ntype ContextType = ReturnType<typeof useTooltip> | null;\n/**\n * The context for the Tooltip components.\n */\nexport const TooltipContext = createContext<ContextType>(null);\n\n/**\n * Provides the context for the Tooltip components.\n */\nexport function useTooltipContext() {\n  const context = useContext(TooltipContext);\n\n  if (context == null) {\n    throw new Error(\"Tooltip components must be wrapped in <Tooltip />\");\n  }\n\n  return context;\n}\n"],"names":["createContext","useContext"],"mappings":";;;AAcO,MAAM,iBAAiBA,MAAAA,cAA2B,IAAI;AAKtD,SAAS,oBAAoB;AAClC,QAAM,UAAUC,MAAAA,WAAW,cAAc;AAEzC,MAAI,WAAW,MAAM;AACnB,UAAM,IAAI,MAAM,mDAAmD;AAAA,EACrE;AAEA,SAAO;AACT;;;"}
+{"version":3,"file":"TooltipContext.cjs","names":[],"sources":["../../../src/components/Tooltip/TooltipContext.ts"],"sourcesContent":["/*\n * Copyright 2024 New Vector Ltd.\n *\n * SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial\n * Please see LICENSE files in the repository root for full details.\n */\n\nimport { createContext, useContext } from \"react\";\nimport { useTooltip } from \"./useTooltip\";\n\ntype ContextType = ReturnType<typeof useTooltip> | null;\n/**\n * The context for the Tooltip components.\n */\nexport const TooltipContext = createContext<ContextType>(null);\n\n/**\n * Provides the context for the Tooltip components.\n */\nexport function useTooltipContext() {\n  const context = useContext(TooltipContext);\n\n  if (context == null) {\n    throw new Error(\"Tooltip components must be wrapped in <Tooltip />\");\n  }\n\n  return context;\n}\n"],"mappings":";;;;;;AAcA,IAAa,kBAAA,GAAA,MAAA,eAA4C,KAAK;;;;AAK9D,SAAgB,oBAAoB;CAClC,MAAM,WAAA,GAAA,MAAA,YAAqB,eAAe;AAE1C,KAAI,WAAW,KACb,OAAM,IAAI,MAAM,oDAAoD;AAGtE,QAAO"}

package/dist/components/Tooltip/TooltipContext.js

@@ -1,14 +1,18 @@
 import { createContext, useContext } from "react";
-const TooltipContext = createContext(null);
+//#region src/components/Tooltip/TooltipContext.ts
+/**
+* The context for the Tooltip components.
+*/
+var TooltipContext = createContext(null);
+/**
+* Provides the context for the Tooltip components.
+*/
 function useTooltipContext() {
-  const context = useContext(TooltipContext);
-  if (context == null) {
-    throw new Error("Tooltip components must be wrapped in <Tooltip />");
-  }
-  return context;
+	const context = useContext(TooltipContext);
+	if (context == null) throw new Error("Tooltip components must be wrapped in <Tooltip />");
+	return context;
 }
-export {
-  TooltipContext,
-  useTooltipContext
-};
-//# sourceMappingURL=TooltipContext.js.map
+//#endregion
+export { TooltipContext, useTooltipContext };
+
+//# sourceMappingURL=TooltipContext.js.map

package/dist/components/Tooltip/TooltipContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"TooltipContext.js","sources":["../../../src/components/Tooltip/TooltipContext.ts"],"sourcesContent":["/*\n * Copyright 2024 New Vector Ltd.\n *\n * SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial\n * Please see LICENSE files in the repository root for full details.\n */\n\nimport { createContext, useContext } from \"react\";\nimport { useTooltip } from \"./useTooltip\";\n\ntype ContextType = ReturnType<typeof useTooltip> | null;\n/**\n * The context for the Tooltip components.\n */\nexport const TooltipContext = createContext<ContextType>(null);\n\n/**\n * Provides the context for the Tooltip components.\n */\nexport function useTooltipContext() {\n  const context = useContext(TooltipContext);\n\n  if (context == null) {\n    throw new Error(\"Tooltip components must be wrapped in <Tooltip />\");\n  }\n\n  return context;\n}\n"],"names":[],"mappings":";AAcO,MAAM,iBAAiB,cAA2B,IAAI;AAKtD,SAAS,oBAAoB;AAClC,QAAM,UAAU,WAAW,cAAc;AAEzC,MAAI,WAAW,MAAM;AACnB,UAAM,IAAI,MAAM,mDAAmD;AAAA,EACrE;AAEA,SAAO;AACT;"}
+{"version":3,"file":"TooltipContext.js","names":[],"sources":["../../../src/components/Tooltip/TooltipContext.ts"],"sourcesContent":["/*\n * Copyright 2024 New Vector Ltd.\n *\n * SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial\n * Please see LICENSE files in the repository root for full details.\n */\n\nimport { createContext, useContext } from \"react\";\nimport { useTooltip } from \"./useTooltip\";\n\ntype ContextType = ReturnType<typeof useTooltip> | null;\n/**\n * The context for the Tooltip components.\n */\nexport const TooltipContext = createContext<ContextType>(null);\n\n/**\n * Provides the context for the Tooltip components.\n */\nexport function useTooltipContext() {\n  const context = useContext(TooltipContext);\n\n  if (context == null) {\n    throw new Error(\"Tooltip components must be wrapped in <Tooltip />\");\n  }\n\n  return context;\n}\n"],"mappings":";;;;;AAcA,IAAa,iBAAiB,cAA2B,KAAK;;;;AAK9D,SAAgB,oBAAoB;CAClC,MAAM,UAAU,WAAW,eAAe;AAE1C,KAAI,WAAW,KACb,OAAM,IAAI,MAAM,oDAAoD;AAGtE,QAAO"}

package/dist/components/Tooltip/TooltipProvider.cjs

@@ -1,10 +1,25 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("react/jsx-runtime");
-const react = require("@floating-ui/react");
-const hoverDelay = { open: 300, close: 0 };
-const TooltipProvider = ({ children }) => /* @__PURE__ */ jsxRuntime.jsx(react.FloatingDelayGroup, { delay: hoverDelay, timeoutMs: 300, children });
+const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
+let react = require("react");
+react = require_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+let _floating_ui_react = require("@floating-ui/react");
+//#region src/components/Tooltip/TooltipProvider.tsx
+var hoverDelay = {
+	open: 300,
+	close: 0
+};
+/**
+* Enables tooltips to share a global "warm-up" period for their hover delay.
+* You must wrap your application in this component for tooltips to function.
+*/
+var TooltipProvider = ({ children }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_floating_ui_react.FloatingDelayGroup, {
+	delay: hoverDelay,
+	timeoutMs: 300,
+	children
+});
 TooltipProvider.displayName = "TooltipProvider";
+//#endregion
 exports.TooltipProvider = TooltipProvider;
 exports.hoverDelay = hoverDelay;
-//# sourceMappingURL=TooltipProvider.cjs.map
+
+//# sourceMappingURL=TooltipProvider.cjs.map

package/dist/components/Tooltip/TooltipProvider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TooltipProvider.cjs","sources":["../../../src/components/Tooltip/TooltipProvider.tsx"],"sourcesContent":["import { FloatingDelayGroup } from \"@floating-ui/react\";\nimport React, { type FC } from \"react\";\n\nexport const hoverDelay = { open: 300, close: 0 };\n\ninterface Props {\n  children: React.ReactNode;\n}\n\n/**\n * Enables tooltips to share a global \"warm-up\" period for their hover delay.\n * You must wrap your application in this component for tooltips to function.\n */\nexport const TooltipProvider: FC<Props> = ({ children }) => (\n  <FloatingDelayGroup delay={hoverDelay} timeoutMs={300}>\n    {children}\n  </FloatingDelayGroup>\n);\n\nTooltipProvider.displayName = \"TooltipProvider\";\n"],"names":["jsx","FloatingDelayGroup"],"mappings":";;;;AAGO,MAAM,aAAa,EAAE,MAAM,KAAK,OAAO,EAAA;AAUvC,MAAM,kBAA6B,CAAC,EAAE,SAAA,MAC3CA,+BAACC,MAAAA,oBAAA,EAAmB,OAAO,YAAY,WAAW,KAC/C,SAAA,CACH;AAGF,gBAAgB,cAAc;;;"}
+{"version":3,"file":"TooltipProvider.cjs","names":[],"sources":["../../../src/components/Tooltip/TooltipProvider.tsx"],"sourcesContent":["import { FloatingDelayGroup } from \"@floating-ui/react\";\nimport React, { type FC } from \"react\";\n\nexport const hoverDelay = { open: 300, close: 0 };\n\ninterface Props {\n  children: React.ReactNode;\n}\n\n/**\n * Enables tooltips to share a global \"warm-up\" period for their hover delay.\n * You must wrap your application in this component for tooltips to function.\n */\nexport const TooltipProvider: FC<Props> = ({ children }) => (\n  <FloatingDelayGroup delay={hoverDelay} timeoutMs={300}>\n    {children}\n  </FloatingDelayGroup>\n);\n\nTooltipProvider.displayName = \"TooltipProvider\";\n"],"mappings":";;;;;;AAGA,IAAa,aAAa;CAAE,MAAM;CAAK,OAAO;CAAG;;;;;AAUjD,IAAa,mBAA8B,EAAE,eAC3C,iBAAA,GAAA,kBAAA,KAAC,mBAAA,oBAAD;CAAoB,OAAO;CAAY,WAAW;CAC/C;CACkB,CAAA;AAGvB,gBAAgB,cAAc"}

package/dist/components/Tooltip/TooltipProvider.js

@@ -1,10 +1,22 @@
+import "react";
 import { jsx } from "react/jsx-runtime";
 import { FloatingDelayGroup } from "@floating-ui/react";
-const hoverDelay = { open: 300, close: 0 };
-const TooltipProvider = ({ children }) => /* @__PURE__ */ jsx(FloatingDelayGroup, { delay: hoverDelay, timeoutMs: 300, children });
-TooltipProvider.displayName = "TooltipProvider";
-export {
-  TooltipProvider,
-  hoverDelay
+//#region src/components/Tooltip/TooltipProvider.tsx
+var hoverDelay = {
+	open: 300,
+	close: 0
 };
-//# sourceMappingURL=TooltipProvider.js.map
+/**
+* Enables tooltips to share a global "warm-up" period for their hover delay.
+* You must wrap your application in this component for tooltips to function.
+*/
+var TooltipProvider = ({ children }) => /* @__PURE__ */ jsx(FloatingDelayGroup, {
+	delay: hoverDelay,
+	timeoutMs: 300,
+	children
+});
+TooltipProvider.displayName = "TooltipProvider";
+//#endregion
+export { TooltipProvider, hoverDelay };
+
+//# sourceMappingURL=TooltipProvider.js.map

package/dist/components/Tooltip/TooltipProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"TooltipProvider.js","sources":["../../../src/components/Tooltip/TooltipProvider.tsx"],"sourcesContent":["import { FloatingDelayGroup } from \"@floating-ui/react\";\nimport React, { type FC } from \"react\";\n\nexport const hoverDelay = { open: 300, close: 0 };\n\ninterface Props {\n  children: React.ReactNode;\n}\n\n/**\n * Enables tooltips to share a global \"warm-up\" period for their hover delay.\n * You must wrap your application in this component for tooltips to function.\n */\nexport const TooltipProvider: FC<Props> = ({ children }) => (\n  <FloatingDelayGroup delay={hoverDelay} timeoutMs={300}>\n    {children}\n  </FloatingDelayGroup>\n);\n\nTooltipProvider.displayName = \"TooltipProvider\";\n"],"names":[],"mappings":";;AAGO,MAAM,aAAa,EAAE,MAAM,KAAK,OAAO,EAAA;AAUvC,MAAM,kBAA6B,CAAC,EAAE,SAAA,MAC3C,oBAAC,oBAAA,EAAmB,OAAO,YAAY,WAAW,KAC/C,SAAA,CACH;AAGF,gBAAgB,cAAc;"}
+{"version":3,"file":"TooltipProvider.js","names":[],"sources":["../../../src/components/Tooltip/TooltipProvider.tsx"],"sourcesContent":["import { FloatingDelayGroup } from \"@floating-ui/react\";\nimport React, { type FC } from \"react\";\n\nexport const hoverDelay = { open: 300, close: 0 };\n\ninterface Props {\n  children: React.ReactNode;\n}\n\n/**\n * Enables tooltips to share a global \"warm-up\" period for their hover delay.\n * You must wrap your application in this component for tooltips to function.\n */\nexport const TooltipProvider: FC<Props> = ({ children }) => (\n  <FloatingDelayGroup delay={hoverDelay} timeoutMs={300}>\n    {children}\n  </FloatingDelayGroup>\n);\n\nTooltipProvider.displayName = \"TooltipProvider\";\n"],"mappings":";;;;AAGA,IAAa,aAAa;CAAE,MAAM;CAAK,OAAO;CAAG;;;;;AAUjD,IAAa,mBAA8B,EAAE,eAC3C,oBAAC,oBAAD;CAAoB,OAAO;CAAY,WAAW;CAC/C;CACkB,CAAA;AAGvB,gBAAgB,cAAc"}

package/dist/components/Tooltip/useTooltip.cjs

@@ -1,141 +1,114 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const react = require("@floating-ui/react");
-const React = require("react");
-const TooltipProvider = require("./TooltipProvider.cjs");
-function useTooltip({
-  open: controlledOpen,
-  disabled = false,
-  onOpenChange,
-  placement = "bottom",
-  isTriggerInteractive,
-  caption,
-  "aria-atomic": ariaAtomic,
-  "aria-live": ariaLive,
-  ...props
-}) {
-  const labelId = react.useId();
-  const captionId = react.useId();
-  const arrowRef = React.useRef(null);
-  const [uncontrolledOpen, setUncontrolledOpen] = React.useState(false);
-  const open = disabled ? false : controlledOpen ?? uncontrolledOpen;
-  const setOpen = (open2, event, reason) => {
-    onOpenChange?.(open2, event, reason);
-    if (controlledOpen === void 0) setUncontrolledOpen(open2);
-  };
-  const data = react.useFloating({
-    placement,
-    open,
-    onOpenChange: setOpen,
-    whileElementsMounted: react.autoUpdate,
-    middleware: [
-      // arrow height 6px
-      react.offset(6),
-      react.flip({
-        crossAxis: placement.includes("-"),
-        fallbackAxisSideDirection: "start",
-        padding: 5
-      }),
-      react.shift({ padding: 5 }),
-      // add the little arrow along with the floating content
-      react.arrow({
-        element: arrowRef
-      })
-    ]
-  });
-  const context = data.context;
-  const { delay, initialDelay } = react.useDelayGroup(context);
-  if (initialDelay !== TooltipProvider.hoverDelay)
-    throw new Error("Tooltips must be wrapped in a global <TooltipProvider>");
-  const hover = react.useHover(context, {
-    move: false,
-    enabled: controlledOpen === void 0,
-    // Show tooltip after a delay when trigger is interactive
-    delay: isTriggerInteractive ? delay : {},
-    mouseOnly: true
-  });
-  const focus = react.useFocus(context, {
-    enabled: controlledOpen === void 0
-  });
-  const pressTimer = React.useRef(void 0);
-  React.useEffect(() => () => window.clearTimeout(pressTimer.current), []);
-  const press = React.useMemo(() => {
-    const onTouchEnd = () => {
-      if (pressTimer.current === void 0)
-        pressTimer.current = window.setTimeout(() => {
-          setOpen(false);
-          pressTimer.current = void 0;
-        }, 1500);
-      else window.clearTimeout(pressTimer.current);
-    };
-    return {
-      // Set these props on the anchor element
-      reference: {
-        onTouchStart: () => {
-          if (pressTimer.current !== void 0)
-            window.clearTimeout(pressTimer.current);
-          pressTimer.current = window.setTimeout(() => {
-            setOpen(true);
-            pressTimer.current = void 0;
-          }, 500);
-        },
-        onTouchEnd,
-        onTouchCancel: onTouchEnd
-      }
-    };
-  }, []);
-  const dismiss = react.useDismiss(context);
-  const purpose = "label" in props ? "label" : "description";
-  const role = react.useRole(context, {
-    enabled: purpose === "description",
-    role: "tooltip"
-  });
-  const label = React.useMemo(
-    () => purpose === "label" ? {
-      // Set these props on the anchor element
-      reference: {
-        "aria-labelledby": labelId,
-        "aria-describedby": caption ? captionId : void 0
-      }
-    } : {},
-    [purpose, labelId, captionId]
-  );
-  const interactions = react.useInteractions([
-    hover,
-    focus,
-    press,
-    dismiss,
-    role,
-    label
-  ]);
-  return React.useMemo(
-    () => ({
-      labelId,
-      captionId: caption ? captionId : void 0,
-      caption,
-      purpose,
-      open,
-      setOpen,
-      tooltipProps: {
-        "aria-atomic": ariaAtomic,
-        "aria-live": ariaLive
-      },
-      ...interactions,
-      ...data,
-      arrowRef
-    }),
-    [
-      labelId,
-      captionId,
-      caption,
-      role,
-      open,
-      setOpen,
-      interactions,
-      data,
-      arrowRef
-    ]
-  );
+require("../../_virtual/_rolldown/runtime.cjs");
+const require_TooltipProvider = require("./TooltipProvider.cjs");
+let react = require("react");
+let _floating_ui_react = require("@floating-ui/react");
+//#region src/components/Tooltip/useTooltip.ts
+function useTooltip({ open: controlledOpen, disabled = false, onOpenChange, placement = "bottom", isTriggerInteractive, caption, "aria-atomic": ariaAtomic, "aria-live": ariaLive, ...props }) {
+	const labelId = (0, _floating_ui_react.useId)();
+	const captionId = (0, _floating_ui_react.useId)();
+	const arrowRef = (0, react.useRef)(null);
+	const [uncontrolledOpen, setUncontrolledOpen] = (0, react.useState)(false);
+	const open = disabled ? false : controlledOpen ?? uncontrolledOpen;
+	const setOpen = (open, event, reason) => {
+		onOpenChange?.(open, event, reason);
+		if (controlledOpen === void 0) setUncontrolledOpen(open);
+	};
+	const data = (0, _floating_ui_react.useFloating)({
+		placement,
+		open,
+		onOpenChange: setOpen,
+		whileElementsMounted: _floating_ui_react.autoUpdate,
+		middleware: [
+			(0, _floating_ui_react.offset)(6),
+			(0, _floating_ui_react.flip)({
+				crossAxis: placement.includes("-"),
+				fallbackAxisSideDirection: "start",
+				padding: 5
+			}),
+			(0, _floating_ui_react.shift)({ padding: 5 }),
+			(0, _floating_ui_react.arrow)({ element: arrowRef })
+		]
+	});
+	const context = data.context;
+	const { delay, initialDelay } = (0, _floating_ui_react.useDelayGroup)(context);
+	if (initialDelay !== require_TooltipProvider.hoverDelay) throw new Error("Tooltips must be wrapped in a global <TooltipProvider>");
+	const hover = (0, _floating_ui_react.useHover)(context, {
+		move: false,
+		enabled: controlledOpen === void 0,
+		delay: isTriggerInteractive ? delay : {},
+		mouseOnly: true
+	});
+	const focus = (0, _floating_ui_react.useFocus)(context, { enabled: controlledOpen === void 0 });
+	const pressTimer = (0, react.useRef)(void 0);
+	(0, react.useEffect)(() => () => window.clearTimeout(pressTimer.current), []);
+	const press = (0, react.useMemo)(() => {
+		const onTouchEnd = () => {
+			if (pressTimer.current === void 0) pressTimer.current = window.setTimeout(() => {
+				setOpen(false);
+				pressTimer.current = void 0;
+			}, 1500);
+			else window.clearTimeout(pressTimer.current);
+		};
+		return { reference: {
+			onTouchStart: () => {
+				if (pressTimer.current !== void 0) window.clearTimeout(pressTimer.current);
+				pressTimer.current = window.setTimeout(() => {
+					setOpen(true);
+					pressTimer.current = void 0;
+				}, 500);
+			},
+			onTouchEnd,
+			onTouchCancel: onTouchEnd
+		} };
+	}, []);
+	const dismiss = (0, _floating_ui_react.useDismiss)(context);
+	const purpose = "label" in props ? "label" : "description";
+	const role = (0, _floating_ui_react.useRole)(context, {
+		enabled: purpose === "description",
+		role: "tooltip"
+	});
+	const interactions = (0, _floating_ui_react.useInteractions)([
+		hover,
+		focus,
+		press,
+		dismiss,
+		role,
+		(0, react.useMemo)(() => purpose === "label" ? { reference: {
+			"aria-labelledby": labelId,
+			"aria-describedby": caption ? captionId : void 0
+		} } : {}, [
+			purpose,
+			labelId,
+			captionId
+		])
+	]);
+	return (0, react.useMemo)(() => ({
+		labelId,
+		captionId: caption ? captionId : void 0,
+		caption,
+		purpose,
+		open,
+		setOpen,
+		tooltipProps: {
+			"aria-atomic": ariaAtomic,
+			"aria-live": ariaLive
+		},
+		...interactions,
+		...data,
+		arrowRef
+	}), [
+		labelId,
+		captionId,
+		caption,
+		role,
+		open,
+		setOpen,
+		interactions,
+		data,
+		arrowRef
+	]);
 }
+//#endregion
 exports.useTooltip = useTooltip;
-//# sourceMappingURL=useTooltip.cjs.map
+
+//# sourceMappingURL=useTooltip.cjs.map

package/dist/components/Tooltip/useTooltip.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useTooltip.cjs","sources":["../../../src/components/Tooltip/useTooltip.ts"],"sourcesContent":["/*\n * Copyright 2024 New Vector Ltd.\n *\n * SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial\n * Please see LICENSE files in the repository root for full details.\n */\n\nimport {\n  arrow,\n  autoUpdate,\n  flip,\n  offset,\n  type OpenChangeReason,\n  type Placement,\n  shift,\n  useDelayGroup,\n  useDismiss,\n  useFloating,\n  useFocus,\n  useHover,\n  useId,\n  useInteractions,\n  useRole,\n} from \"@floating-ui/react\";\nimport {\n  useMemo,\n  useRef,\n  useState,\n  type JSX,\n  type AriaAttributes,\n  useEffect,\n} from \"react\";\nimport { hoverDelay } from \"./TooltipProvider\";\n\nexport interface CommonUseTooltipProps {\n  /**\n   * The controlled open state of the tooltip.\n   * If provided, the tooltip will be in controlled mode.\n   * When true, the tooltip is always open. When false, the tooltip is always hidden.\n   * When undefined, the tooltip will manage its own open state.\n   * You will mostly want to omit this property. Will be used the vast majority\n   * of the time during development.\n   * @default undefined\n   */\n  open?: boolean;\n  /**\n   * Whether the tooltip should be forced to be in a closed state.\n   */\n  // TODO: Deprecate this? It seems redundant to open: false.\n  disabled?: boolean;\n  /**\n   * The caption of the tooltip.\n   * JSX.Element can be used to provide accessibility content like kbd element.\n   * Keep in mind, the caption should not be used for interactive content.\n   */\n  caption?: string | JSX.Element;\n  /**\n   * The event handler for the open change.\n   */\n  onOpenChange?: (\n    open: boolean,\n    event?: Event | undefined,\n    reason?: OpenChangeReason | undefined,\n  ) => void;\n  /**\n   * The placement of the tooltip.\n   * @default \"bottom\"\n   */\n  placement?: Placement;\n  /**\n   * Whether the trigger element is interactive.\n   * When trigger is interactive:\n   *      - tooltip will be shown after a 300ms delay.\n   * When trigger is not interactive:\n   *      - tooltip will be shown instantly when pointer enters trigger.\n   *      - trigger will be wrapped in a span with a tab index from prop nonInteractiveTriggerTabIndex\n   */\n  isTriggerInteractive: boolean;\n\n  /**\n   * Additional aria-* attributes to pass through to the floating tooltip for\n   * edge cases which require more user awareness like errors & alerts.\n   */\n  \"aria-atomic\"?: AriaAttributes[\"aria-atomic\"];\n  \"aria-live\"?: AriaAttributes[\"aria-live\"];\n}\n\nexport interface TooltipLabel {\n  /**\n   * A label for the target element.\n   */\n  label: string;\n}\n\nexport interface TooltipDescription {\n  /**\n   * A description for the target element.\n   */\n  description: string;\n}\n\ntype UseTooltipProps = CommonUseTooltipProps &\n  (TooltipLabel | TooltipDescription);\n\nexport function useTooltip({\n  open: controlledOpen,\n  disabled = false,\n  onOpenChange,\n  placement = \"bottom\",\n  isTriggerInteractive,\n  caption,\n  \"aria-atomic\": ariaAtomic,\n  \"aria-live\": ariaLive,\n  ...props\n}: UseTooltipProps) {\n  const labelId = useId();\n  const captionId = useId();\n  const arrowRef = useRef(null);\n\n  const [uncontrolledOpen, setUncontrolledOpen] = useState(false);\n\n  // Use controlledOpen if it is provided, otherwise use uncontrolledOpen\n  const open = disabled ? false : (controlledOpen ?? uncontrolledOpen);\n  const setOpen = (\n    open: boolean,\n    event?: Event | undefined,\n    reason?: OpenChangeReason | undefined,\n  ) => {\n    onOpenChange?.(open, event, reason);\n    // we are in uncontrolled mode\n    if (controlledOpen === undefined) setUncontrolledOpen(open);\n  };\n\n  const data = useFloating({\n    placement,\n    open,\n    onOpenChange: setOpen,\n    whileElementsMounted: autoUpdate,\n    middleware: [\n      // arrow height 6px\n      offset(6),\n      flip({\n        crossAxis: placement.includes(\"-\"),\n        fallbackAxisSideDirection: \"start\",\n        padding: 5,\n      }),\n      shift({ padding: 5 }),\n      // add the little arrow along with the floating content\n      arrow({\n        element: arrowRef,\n      }),\n    ],\n  });\n\n  const context = data.context;\n  const { delay, initialDelay } = useDelayGroup(context);\n  // We can tell if no delay group has been provided, because the delay will\n  // default to zero\n  if (initialDelay !== hoverDelay)\n    throw new Error(\"Tooltips must be wrapped in a global <TooltipProvider>\");\n\n  const hover = useHover(context, {\n    move: false,\n    enabled: controlledOpen === undefined,\n    // Show tooltip after a delay when trigger is interactive\n    delay: isTriggerInteractive ? delay : {},\n    mouseOnly: true,\n  });\n\n  const focus = useFocus(context, {\n    enabled: controlledOpen === undefined,\n  });\n\n  // On touch screens, show the tooltip on a long press\n  const pressTimer = useRef<number | undefined>(undefined);\n  useEffect(() => () => window.clearTimeout(pressTimer.current), []);\n  const press = useMemo(() => {\n    const onTouchEnd = () => {\n      if (pressTimer.current === undefined)\n        pressTimer.current = window.setTimeout(() => {\n          setOpen(false);\n          pressTimer.current = undefined;\n        }, 1500);\n      else window.clearTimeout(pressTimer.current);\n    };\n    return {\n      // Set these props on the anchor element\n      reference: {\n        onTouchStart: () => {\n          if (pressTimer.current !== undefined)\n            window.clearTimeout(pressTimer.current);\n          pressTimer.current = window.setTimeout(() => {\n            setOpen(true);\n            pressTimer.current = undefined;\n          }, 500);\n        },\n        onTouchEnd,\n        onTouchCancel: onTouchEnd,\n      },\n    };\n  }, []);\n\n  const dismiss = useDismiss(context);\n\n  const purpose = \"label\" in props ? \"label\" : \"description\";\n  // A descriptive tooltip should set role=\"tooltip\" and aria-describedby\n  const role = useRole(context, {\n    enabled: purpose === \"description\",\n    role: \"tooltip\",\n  });\n\n  // A label tooltip should set aria-labelledby with no role regardless of\n  // whether the tooltip is visible.\n  // (Source: https://zoebijl.github.io/apg-tooltip/#tooltip-main-label)\n  // useRole doesn't support this use case correctly, so we do it manually.\n  const label = useMemo(\n    () =>\n      purpose === \"label\"\n        ? {\n            // Set these props on the anchor element\n            reference: {\n              \"aria-labelledby\": labelId,\n              \"aria-describedby\": caption ? captionId : undefined,\n            },\n          }\n        : {},\n    [purpose, labelId, captionId],\n  );\n\n  const interactions = useInteractions([\n    hover,\n    focus,\n    press,\n    dismiss,\n    role,\n    label,\n  ]);\n\n  return useMemo(\n    () => ({\n      labelId,\n      captionId: caption ? captionId : undefined,\n      caption,\n      purpose: purpose as \"label\" | \"description\",\n      open,\n      setOpen,\n      tooltipProps: {\n        \"aria-atomic\": ariaAtomic,\n        \"aria-live\": ariaLive,\n      },\n      ...interactions,\n      ...data,\n      arrowRef,\n    }),\n    [\n      labelId,\n      captionId,\n      caption,\n      role,\n      open,\n      setOpen,\n      interactions,\n      data,\n      arrowRef,\n    ],\n  );\n}\n"],"names":["useId","useRef","useState","open","useFloating","autoUpdate","offset","flip","shift","arrow","useDelayGroup","hoverDelay","useHover","useFocus","useEffect","useMemo","useDismiss","useRole","useInteractions"],"mappings":"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"}
+{"version":3,"file":"useTooltip.cjs","names":[],"sources":["../../../src/components/Tooltip/useTooltip.ts"],"sourcesContent":["/*\n * Copyright 2024 New Vector Ltd.\n *\n * SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial\n * Please see LICENSE files in the repository root for full details.\n */\n\nimport {\n  arrow,\n  autoUpdate,\n  flip,\n  offset,\n  type OpenChangeReason,\n  type Placement,\n  shift,\n  useDelayGroup,\n  useDismiss,\n  useFloating,\n  useFocus,\n  useHover,\n  useId,\n  useInteractions,\n  useRole,\n} from \"@floating-ui/react\";\nimport {\n  useMemo,\n  useRef,\n  useState,\n  type JSX,\n  type AriaAttributes,\n  useEffect,\n} from \"react\";\nimport { hoverDelay } from \"./TooltipProvider\";\n\nexport interface CommonUseTooltipProps {\n  /**\n   * The controlled open state of the tooltip.\n   * If provided, the tooltip will be in controlled mode.\n   * When true, the tooltip is always open. When false, the tooltip is always hidden.\n   * When undefined, the tooltip will manage its own open state.\n   * You will mostly want to omit this property. Will be used the vast majority\n   * of the time during development.\n   * @default undefined\n   */\n  open?: boolean;\n  /**\n   * Whether the tooltip should be forced to be in a closed state.\n   */\n  // TODO: Deprecate this? It seems redundant to open: false.\n  disabled?: boolean;\n  /**\n   * The caption of the tooltip.\n   * JSX.Element can be used to provide accessibility content like kbd element.\n   * Keep in mind, the caption should not be used for interactive content.\n   */\n  caption?: string | JSX.Element;\n  /**\n   * The event handler for the open change.\n   */\n  onOpenChange?: (\n    open: boolean,\n    event?: Event | undefined,\n    reason?: OpenChangeReason | undefined,\n  ) => void;\n  /**\n   * The placement of the tooltip.\n   * @default \"bottom\"\n   */\n  placement?: Placement;\n  /**\n   * Whether the trigger element is interactive.\n   * When trigger is interactive:\n   *      - tooltip will be shown after a 300ms delay.\n   * When trigger is not interactive:\n   *      - tooltip will be shown instantly when pointer enters trigger.\n   *      - trigger will be wrapped in a span with a tab index from prop nonInteractiveTriggerTabIndex\n   */\n  isTriggerInteractive: boolean;\n\n  /**\n   * Additional aria-* attributes to pass through to the floating tooltip for\n   * edge cases which require more user awareness like errors & alerts.\n   */\n  \"aria-atomic\"?: AriaAttributes[\"aria-atomic\"];\n  \"aria-live\"?: AriaAttributes[\"aria-live\"];\n}\n\nexport interface TooltipLabel {\n  /**\n   * A label for the target element.\n   */\n  label: string;\n}\n\nexport interface TooltipDescription {\n  /**\n   * A description for the target element.\n   */\n  description: string;\n}\n\ntype UseTooltipProps = CommonUseTooltipProps &\n  (TooltipLabel | TooltipDescription);\n\nexport function useTooltip({\n  open: controlledOpen,\n  disabled = false,\n  onOpenChange,\n  placement = \"bottom\",\n  isTriggerInteractive,\n  caption,\n  \"aria-atomic\": ariaAtomic,\n  \"aria-live\": ariaLive,\n  ...props\n}: UseTooltipProps) {\n  const labelId = useId();\n  const captionId = useId();\n  const arrowRef = useRef(null);\n\n  const [uncontrolledOpen, setUncontrolledOpen] = useState(false);\n\n  // Use controlledOpen if it is provided, otherwise use uncontrolledOpen\n  const open = disabled ? false : (controlledOpen ?? uncontrolledOpen);\n  const setOpen = (\n    open: boolean,\n    event?: Event | undefined,\n    reason?: OpenChangeReason | undefined,\n  ) => {\n    onOpenChange?.(open, event, reason);\n    // we are in uncontrolled mode\n    if (controlledOpen === undefined) setUncontrolledOpen(open);\n  };\n\n  const data = useFloating({\n    placement,\n    open,\n    onOpenChange: setOpen,\n    whileElementsMounted: autoUpdate,\n    middleware: [\n      // arrow height 6px\n      offset(6),\n      flip({\n        crossAxis: placement.includes(\"-\"),\n        fallbackAxisSideDirection: \"start\",\n        padding: 5,\n      }),\n      shift({ padding: 5 }),\n      // add the little arrow along with the floating content\n      arrow({\n        element: arrowRef,\n      }),\n    ],\n  });\n\n  const context = data.context;\n  const { delay, initialDelay } = useDelayGroup(context);\n  // We can tell if no delay group has been provided, because the delay will\n  // default to zero\n  if (initialDelay !== hoverDelay)\n    throw new Error(\"Tooltips must be wrapped in a global <TooltipProvider>\");\n\n  const hover = useHover(context, {\n    move: false,\n    enabled: controlledOpen === undefined,\n    // Show tooltip after a delay when trigger is interactive\n    delay: isTriggerInteractive ? delay : {},\n    mouseOnly: true,\n  });\n\n  const focus = useFocus(context, {\n    enabled: controlledOpen === undefined,\n  });\n\n  // On touch screens, show the tooltip on a long press\n  const pressTimer = useRef<number | undefined>(undefined);\n  useEffect(() => () => window.clearTimeout(pressTimer.current), []);\n  const press = useMemo(() => {\n    const onTouchEnd = () => {\n      if (pressTimer.current === undefined)\n        pressTimer.current = window.setTimeout(() => {\n          setOpen(false);\n          pressTimer.current = undefined;\n        }, 1500);\n      else window.clearTimeout(pressTimer.current);\n    };\n    return {\n      // Set these props on the anchor element\n      reference: {\n        onTouchStart: () => {\n          if (pressTimer.current !== undefined)\n            window.clearTimeout(pressTimer.current);\n          pressTimer.current = window.setTimeout(() => {\n            setOpen(true);\n            pressTimer.current = undefined;\n          }, 500);\n        },\n        onTouchEnd,\n        onTouchCancel: onTouchEnd,\n      },\n    };\n  }, []);\n\n  const dismiss = useDismiss(context);\n\n  const purpose = \"label\" in props ? \"label\" : \"description\";\n  // A descriptive tooltip should set role=\"tooltip\" and aria-describedby\n  const role = useRole(context, {\n    enabled: purpose === \"description\",\n    role: \"tooltip\",\n  });\n\n  // A label tooltip should set aria-labelledby with no role regardless of\n  // whether the tooltip is visible.\n  // (Source: https://zoebijl.github.io/apg-tooltip/#tooltip-main-label)\n  // useRole doesn't support this use case correctly, so we do it manually.\n  const label = useMemo(\n    () =>\n      purpose === \"label\"\n        ? {\n            // Set these props on the anchor element\n            reference: {\n              \"aria-labelledby\": labelId,\n              \"aria-describedby\": caption ? captionId : undefined,\n            },\n          }\n        : {},\n    [purpose, labelId, captionId],\n  );\n\n  const interactions = useInteractions([\n    hover,\n    focus,\n    press,\n    dismiss,\n    role,\n    label,\n  ]);\n\n  return useMemo(\n    () => ({\n      labelId,\n      captionId: caption ? captionId : undefined,\n      caption,\n      purpose: purpose as \"label\" | \"description\",\n      open,\n      setOpen,\n      tooltipProps: {\n        \"aria-atomic\": ariaAtomic,\n        \"aria-live\": ariaLive,\n      },\n      ...interactions,\n      ...data,\n      arrowRef,\n    }),\n    [\n      labelId,\n      captionId,\n      caption,\n      role,\n      open,\n      setOpen,\n      interactions,\n      data,\n      arrowRef,\n    ],\n  );\n}\n"],"mappings":";;;;;AAwGA,SAAgB,WAAW,EACzB,MAAM,gBACN,WAAW,OACX,cACA,YAAY,UACZ,sBACA,SACA,eAAe,YACf,aAAa,UACb,GAAG,SACe;CAClB,MAAM,WAAA,GAAA,mBAAA,QAAiB;CACvB,MAAM,aAAA,GAAA,mBAAA,QAAmB;CACzB,MAAM,YAAA,GAAA,MAAA,QAAkB,KAAK;CAE7B,MAAM,CAAC,kBAAkB,wBAAA,GAAA,MAAA,UAAgC,MAAM;CAG/D,MAAM,OAAO,WAAW,QAAS,kBAAkB;CACnD,MAAM,WACJ,MACA,OACA,WACG;AACH,iBAAe,MAAM,OAAO,OAAO;AAEnC,MAAI,mBAAmB,KAAA,EAAW,qBAAoB,KAAK;;CAG7D,MAAM,QAAA,GAAA,mBAAA,aAAmB;EACvB;EACA;EACA,cAAc;EACd,sBAAsB,mBAAA;EACtB,YAAY;kCAEH,EAAE;gCACJ;IACH,WAAW,UAAU,SAAS,IAAI;IAClC,2BAA2B;IAC3B,SAAS;IACV,CAAC;iCACI,EAAE,SAAS,GAAG,CAAC;iCAEf,EACJ,SAAS,UACV,CAAC;GACH;EACF,CAAC;CAEF,MAAM,UAAU,KAAK;CACrB,MAAM,EAAE,OAAO,kBAAA,GAAA,mBAAA,eAA+B,QAAQ;AAGtD,KAAI,iBAAiB,wBAAA,WACnB,OAAM,IAAI,MAAM,yDAAyD;CAE3E,MAAM,SAAA,GAAA,mBAAA,UAAiB,SAAS;EAC9B,MAAM;EACN,SAAS,mBAAmB,KAAA;EAE5B,OAAO,uBAAuB,QAAQ,EAAE;EACxC,WAAW;EACZ,CAAC;CAEF,MAAM,SAAA,GAAA,mBAAA,UAAiB,SAAS,EAC9B,SAAS,mBAAmB,KAAA,GAC7B,CAAC;CAGF,MAAM,cAAA,GAAA,MAAA,QAAwC,KAAA,EAAU;AACxD,EAAA,GAAA,MAAA,uBAAsB,OAAO,aAAa,WAAW,QAAQ,EAAE,EAAE,CAAC;CAClE,MAAM,SAAA,GAAA,MAAA,eAAsB;EAC1B,MAAM,mBAAmB;AACvB,OAAI,WAAW,YAAY,KAAA,EACzB,YAAW,UAAU,OAAO,iBAAiB;AAC3C,YAAQ,MAAM;AACd,eAAW,UAAU,KAAA;MACpB,KAAK;OACL,QAAO,aAAa,WAAW,QAAQ;;AAE9C,SAAO,EAEL,WAAW;GACT,oBAAoB;AAClB,QAAI,WAAW,YAAY,KAAA,EACzB,QAAO,aAAa,WAAW,QAAQ;AACzC,eAAW,UAAU,OAAO,iBAAiB;AAC3C,aAAQ,KAAK;AACb,gBAAW,UAAU,KAAA;OACpB,IAAI;;GAET;GACA,eAAe;GAChB,EACF;IACA,EAAE,CAAC;CAEN,MAAM,WAAA,GAAA,mBAAA,YAAqB,QAAQ;CAEnC,MAAM,UAAU,WAAW,QAAQ,UAAU;CAE7C,MAAM,QAAA,GAAA,mBAAA,SAAe,SAAS;EAC5B,SAAS,YAAY;EACrB,MAAM;EACP,CAAC;CAoBF,MAAM,gBAAA,GAAA,mBAAA,iBAA+B;EACnC;EACA;EACA;EACA;EACA;2BAjBE,YAAY,UACR,EAEE,WAAW;GACT,mBAAmB;GACnB,oBAAoB,UAAU,YAAY,KAAA;GAC3C,EACF,GACD,EAAE,EACR;GAAC;GAAS;GAAS;GAAU,CAC9B;EASA,CAAC;AAEF,SAAA,GAAA,MAAA,gBACS;EACL;EACA,WAAW,UAAU,YAAY,KAAA;EACjC;EACS;EACT;EACA;EACA,cAAc;GACZ,eAAe;GACf,aAAa;GACd;EACD,GAAG;EACH,GAAG;EACH;EACD,GACD;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF"}