@aspprev/versi-ds 0.1.0

package/dist/chunk-CWIPMGCA.js

@@ -0,0 +1,314 @@
+import {
+  __spreadProps,
+  __spreadValues
+} from "./chunk-2NMEKWO5.js";
+
+// src/hooks/useBreakpoint.tsx
+import { useState, useEffect } from "react";
+var breakpoints = {
+  mobile: 640,
+  tablet: 1024,
+  desktop: 1440,
+  tv: 1920
+};
+var useBreakpoint = () => {
+  const getBreakpoint = (width) => {
+    const entries = Object.entries(breakpoints);
+    return entries.reduce(
+      (prev, [key, minWidth]) => width >= minWidth ? key : prev,
+      "mobile"
+    );
+  };
+  const [currentBreakpoint, setCurrentBreakpoint] = useState("mobile");
+  useEffect(() => {
+    const handleResize = () => {
+      const newBreakpoint = getBreakpoint(window.innerWidth);
+      setCurrentBreakpoint(newBreakpoint);
+    };
+    handleResize();
+    window.addEventListener("resize", handleResize);
+    return () => {
+      window.removeEventListener("resize", handleResize);
+    };
+  }, []);
+  return currentBreakpoint;
+};
+
+// src/components/tooltip/Tooltip.tsx
+import {
+  useCallback,
+  useEffect as useEffect3,
+  useId,
+  useLayoutEffect,
+  useRef,
+  useState as useState2
+} from "react";
+import ReactDOM from "react-dom";
+
+// src/components/tooltip/calculate-tooltip-position.ts
+var OPPOSITE_POSITION = {
+  top: "bottom",
+  bottom: "top",
+  left: "right",
+  right: "left"
+};
+function coordinatesFor(target, tooltip, position, gap) {
+  if (position === "top") {
+    return {
+      top: target.top - tooltip.height - gap,
+      left: target.left + target.width / 2 - tooltip.width / 2
+    };
+  }
+  if (position === "bottom") {
+    return {
+      top: target.bottom + gap,
+      left: target.left + target.width / 2 - tooltip.width / 2
+    };
+  }
+  if (position === "left") {
+    return {
+      top: target.top + target.height / 2 - tooltip.height / 2,
+      left: target.left - tooltip.width - gap
+    };
+  }
+  return {
+    top: target.top + target.height / 2 - tooltip.height / 2,
+    left: target.right + gap
+  };
+}
+function fitsViewport(coordinates, tooltip, viewportWidth, viewportHeight, margin) {
+  return coordinates.top >= margin && coordinates.left >= margin && coordinates.top + tooltip.height <= viewportHeight - margin && coordinates.left + tooltip.width <= viewportWidth - margin;
+}
+function clamp(value, minimum, maximum) {
+  return Math.min(Math.max(value, minimum), Math.max(minimum, maximum));
+}
+function calculateTooltipPosition({
+  target,
+  tooltip,
+  preferred,
+  viewportWidth,
+  viewportHeight,
+  gap = 8,
+  margin = 8
+}) {
+  const positions = [
+    preferred,
+    OPPOSITE_POSITION[preferred],
+    "bottom",
+    "top",
+    "right",
+    "left"
+  ].filter(
+    (position, index, values) => values.indexOf(position) === index
+  );
+  for (const position of positions) {
+    const coordinates = coordinatesFor(target, tooltip, position, gap);
+    if (fitsViewport(
+      coordinates,
+      tooltip,
+      viewportWidth,
+      viewportHeight,
+      margin
+    )) {
+      return __spreadProps(__spreadValues({}, coordinates), { position });
+    }
+  }
+  const fallback = coordinatesFor(target, tooltip, preferred, gap);
+  return {
+    top: clamp(fallback.top, margin, viewportHeight - tooltip.height - margin),
+    left: clamp(fallback.left, margin, viewportWidth - tooltip.width - margin),
+    position: preferred
+  };
+}
+
+// src/components/tooltip/use-tooltip-relationship.ts
+import { useEffect as useEffect2 } from "react";
+
+// src/utils/accessibility.ts
+function mergeAriaDescribedBy(...values) {
+  const identifiers = values.flatMap((value) => {
+    var _a;
+    return (_a = value == null ? void 0 : value.trim().split(/\s+/)) != null ? _a : [];
+  }).filter(Boolean);
+  return identifiers.length > 0 ? Array.from(new Set(identifiers)).join(" ") : void 0;
+}
+
+// src/components/tooltip/use-tooltip-relationship.ts
+function useTooltipRelationship(targetRef, tooltipId, visible) {
+  useEffect2(() => {
+    var _a;
+    const target = targetRef == null ? void 0 : targetRef.current;
+    if (!target || !visible) return;
+    const previousDescription = target.getAttribute("aria-describedby");
+    target.setAttribute(
+      "aria-describedby",
+      (_a = mergeAriaDescribedBy(previousDescription, tooltipId)) != null ? _a : tooltipId
+    );
+    return () => {
+      if (previousDescription) {
+        target.setAttribute("aria-describedby", previousDescription);
+      } else {
+        target.removeAttribute("aria-describedby");
+      }
+    };
+  }, [targetRef, tooltipId, visible]);
+}
+
+// src/utils/floating-layer.ts
+function getFloatingLayerClass(trigger, layer) {
+  if (trigger == null ? void 0 : trigger.closest('[role="dialog"][aria-modal="true"]')) {
+    return "z-modal-overlay";
+  }
+  return layer === "popover" ? "z-popover" : "z-tooltip";
+}
+
+// src/components/tooltip/Tooltip.tsx
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var Tooltip = ({
+  targetRef,
+  content,
+  visible,
+  preferredPosition = "bottom"
+}) => {
+  const tooltipRef = useRef(null);
+  const arrowRef = useRef(null);
+  const tooltipId = useId();
+  const [coords, setCoords] = useState2({ top: 0, left: 0 });
+  const [finalPosition, setFinalPosition] = useState2(preferredPosition);
+  const breakpoint = useBreakpoint();
+  const isMobile = breakpoint === "mobile";
+  useTooltipRelationship(targetRef, tooltipId, visible);
+  const updatePosition = useCallback(() => {
+    if (!targetRef.current || !tooltipRef.current) return;
+    const target = targetRef.current.getBoundingClientRect();
+    const tooltip = tooltipRef.current.getBoundingClientRect();
+    if (isMobile) {
+      setCoords({
+        top: Math.max(8, (window.innerHeight - tooltip.height) / 2),
+        left: Math.max(8, (window.innerWidth - tooltip.width) / 2)
+      });
+      setFinalPosition("bottom");
+      return;
+    }
+    const nextPosition = calculateTooltipPosition({
+      target,
+      tooltip,
+      preferred: preferredPosition,
+      viewportWidth: window.innerWidth,
+      viewportHeight: window.innerHeight
+    });
+    setCoords({ top: nextPosition.top, left: nextPosition.left });
+    setFinalPosition(nextPosition.position);
+  }, [isMobile, preferredPosition, targetRef]);
+  useLayoutEffect(() => {
+    if (!visible) return;
+    updatePosition();
+    window.addEventListener("resize", updatePosition);
+    window.addEventListener("scroll", updatePosition, true);
+    return () => {
+      window.removeEventListener("resize", updatePosition);
+      window.removeEventListener("scroll", updatePosition, true);
+    };
+  }, [content, updatePosition, visible]);
+  useLayoutEffect(() => {
+    if (!arrowRef.current || isMobile || !targetRef.current || !tooltipRef.current) {
+      return;
+    }
+    const arrow = arrowRef.current;
+    const tooltip = tooltipRef.current;
+    const rect = targetRef.current.getBoundingClientRect();
+    const horizontalCenter = Math.min(
+      Math.max(rect.left + rect.width / 2 - coords.left - 6, 8),
+      Math.max(8, tooltip.offsetWidth - 20)
+    );
+    const verticalCenter = Math.min(
+      Math.max(rect.top + rect.height / 2 - coords.top - 6, 8),
+      Math.max(8, tooltip.offsetHeight - 20)
+    );
+    arrow.style.top = "";
+    arrow.style.bottom = "";
+    arrow.style.left = "";
+    arrow.style.right = "";
+    if (finalPosition === "bottom") {
+      arrow.style.top = "-6px";
+      arrow.style.left = `${horizontalCenter}px`;
+      return;
+    }
+    if (finalPosition === "top") {
+      arrow.style.bottom = "-6px";
+      arrow.style.left = `${horizontalCenter}px`;
+      return;
+    }
+    if (finalPosition === "right") {
+      arrow.style.left = "-6px";
+      arrow.style.top = `${verticalCenter}px`;
+      return;
+    }
+    arrow.style.right = "-6px";
+    arrow.style.top = `${verticalCenter}px`;
+  }, [coords, finalPosition, isMobile, targetRef, visible]);
+  useEffect3(() => {
+    var _a;
+    if (!visible) return;
+    (_a = tooltipRef.current) == null ? void 0 : _a.animate([{ opacity: 0 }, { opacity: 1 }], {
+      duration: 150,
+      easing: "ease-out"
+    });
+  }, [visible]);
+  if (typeof window === "undefined") return null;
+  return ReactDOM.createPortal(
+    visible ? /* @__PURE__ */ jsxs(
+      "div",
+      {
+        id: tooltipId,
+        ref: tooltipRef,
+        role: "tooltip",
+        style: { top: coords.top, left: coords.left },
+        className: `fixed ${getFloatingLayerClass(targetRef.current, "tooltip")} max-h-[calc(100dvh-1rem)] overflow-y-auto overscroll-contain break-words whitespace-normal rounded-sm bg-surface-tooltip px-3 py-2 text-sm text-content-inverse shadow-lg ${isMobile ? "w-[90vw] max-w-[90vw]" : "w-max max-w-sm"}`,
+        children: [
+          content,
+          !isMobile && /* @__PURE__ */ jsxs(Fragment, { children: [
+            finalPosition === "bottom" && /* @__PURE__ */ jsx(
+              "div",
+              {
+                ref: arrowRef,
+                className: "absolute h-0 w-0 border-b-[6px] border-l-[6px] border-r-[6px] border-b-surface-tooltip border-l-transparent border-r-transparent"
+              }
+            ),
+            finalPosition === "top" && /* @__PURE__ */ jsx(
+              "div",
+              {
+                ref: arrowRef,
+                className: "absolute h-0 w-0 border-l-[6px] border-r-[6px] border-t-[6px] border-l-transparent border-r-transparent border-t-surface-tooltip"
+              }
+            ),
+            finalPosition === "right" && /* @__PURE__ */ jsx(
+              "div",
+              {
+                ref: arrowRef,
+                className: "absolute h-0 w-0 border-b-[6px] border-r-[6px] border-t-[6px] border-b-transparent border-r-surface-tooltip border-t-transparent"
+              }
+            ),
+            finalPosition === "left" && /* @__PURE__ */ jsx(
+              "div",
+              {
+                ref: arrowRef,
+                className: "absolute h-0 w-0 border-b-[6px] border-l-[6px] border-t-[6px] border-b-transparent border-l-surface-tooltip border-t-transparent"
+              }
+            )
+          ] })
+        ]
+      }
+    ) : null,
+    document.body
+  );
+};
+var Tooltip_default = Tooltip;
+
+export {
+  useBreakpoint,
+  mergeAriaDescribedBy,
+  getFloatingLayerClass,
+  Tooltip_default
+};
+//# sourceMappingURL=chunk-CWIPMGCA.js.map

package/dist/chunk-CWIPMGCA.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/hooks/useBreakpoint.tsx","../src/components/tooltip/Tooltip.tsx","../src/components/tooltip/calculate-tooltip-position.ts","../src/components/tooltip/use-tooltip-relationship.ts","../src/utils/accessibility.ts","../src/utils/floating-layer.ts"],"sourcesContent":["\"use client\";\r\n\r\nimport { useState, useEffect } from \"react\";\r\n\r\nexport const breakpoints = {\r\n  mobile: 640,\r\n  tablet: 1024,\r\n  desktop: 1440,\r\n  tv: 1920,\r\n};\r\n\r\ntype Breakpoint = keyof typeof breakpoints;\r\n\r\nexport const useBreakpoint = (): Breakpoint => {\r\n  const getBreakpoint = (width: number): Breakpoint => {\r\n    const entries = Object.entries(breakpoints) as [Breakpoint, number][];\r\n    return entries.reduce<Breakpoint>(\n      (prev, [key, minWidth]) => (width >= minWidth ? key : prev),\n      \"mobile\"\n    );\r\n  };\r\n\r\n  const [currentBreakpoint, setCurrentBreakpoint] =\r\n    useState<Breakpoint>(\"mobile\");\r\n\r\n  useEffect(() => {\r\n    const handleResize = () => {\r\n      const newBreakpoint = getBreakpoint(window.innerWidth);\r\n      setCurrentBreakpoint(newBreakpoint);\r\n    };\r\n\r\n    handleResize();\r\n\r\n    window.addEventListener(\"resize\", handleResize);\r\n    return () => {\r\n      window.removeEventListener(\"resize\", handleResize);\r\n    };\r\n  }, []);\r\n\r\n  return currentBreakpoint;\r\n};\r\n","\"use client\";\r\nimport { useBreakpoint } from \"../../hooks/useBreakpoint\";\r\nimport React, {\r\n  useCallback,\r\n  useEffect,\r\n  useId,\r\n  useLayoutEffect,\r\n  useRef,\r\n  useState,\r\n} from \"react\";\r\nimport ReactDOM from \"react-dom\";\r\nimport {\r\n  calculateTooltipPosition,\r\n  type TooltipPosition,\r\n} from \"./calculate-tooltip-position\";\r\nimport { useTooltipRelationship } from \"./use-tooltip-relationship\";\r\nimport { getFloatingLayerClass } from \"../../utils/floating-layer\";\r\n\r\nexport type TooltipProps = {\n  targetRef: React.RefObject<HTMLElement | null>;\n  content: React.ReactNode;\r\n  visible: boolean;\r\n  preferredPosition?: \"top\" | \"bottom\" | \"left\" | \"right\";\r\n};\r\n\r\nconst Tooltip: React.FC<TooltipProps> = ({\r\n  targetRef,\r\n  content,\r\n  visible,\r\n  preferredPosition = \"bottom\",\r\n}) => {\r\n  const tooltipRef = useRef<HTMLDivElement>(null);\r\n  const arrowRef = useRef<HTMLDivElement>(null);\r\n  const tooltipId = useId();\r\n  const [coords, setCoords] = useState({ top: 0, left: 0 });\r\n  const [finalPosition, setFinalPosition] =\r\n    useState<TooltipPosition>(preferredPosition);\r\n  const breakpoint = useBreakpoint();\r\n  const isMobile = breakpoint === \"mobile\";\r\n\r\n  useTooltipRelationship(targetRef, tooltipId, visible);\r\n\r\n  const updatePosition = useCallback(() => {\r\n    if (!targetRef.current || !tooltipRef.current) return;\r\n\r\n    const target = targetRef.current.getBoundingClientRect();\r\n    const tooltip = tooltipRef.current.getBoundingClientRect();\r\n\r\n    if (isMobile) {\r\n      setCoords({\r\n        top: Math.max(8, (window.innerHeight - tooltip.height) / 2),\r\n        left: Math.max(8, (window.innerWidth - tooltip.width) / 2),\r\n      });\r\n      setFinalPosition(\"bottom\");\r\n      return;\r\n    }\r\n\r\n    const nextPosition = calculateTooltipPosition({\r\n      target,\r\n      tooltip,\r\n      preferred: preferredPosition,\r\n      viewportWidth: window.innerWidth,\r\n      viewportHeight: window.innerHeight,\r\n    });\r\n    setCoords({ top: nextPosition.top, left: nextPosition.left });\r\n    setFinalPosition(nextPosition.position);\r\n  }, [isMobile, preferredPosition, targetRef]);\r\n\r\n  useLayoutEffect(() => {\r\n    if (!visible) return;\r\n    updatePosition();\r\n\r\n    window.addEventListener(\"resize\", updatePosition);\r\n    window.addEventListener(\"scroll\", updatePosition, true);\r\n\r\n    return () => {\r\n      window.removeEventListener(\"resize\", updatePosition);\r\n      window.removeEventListener(\"scroll\", updatePosition, true);\r\n    };\r\n  }, [content, updatePosition, visible]);\r\n\r\n  useLayoutEffect(() => {\r\n    if (\n      !arrowRef.current ||\n      isMobile ||\n      !targetRef.current ||\n      !tooltipRef.current\n    ) {\n      return;\n    }\n\n    const arrow = arrowRef.current;\n    const tooltip = tooltipRef.current;\n    const rect = targetRef.current.getBoundingClientRect();\r\n    const horizontalCenter = Math.min(\r\n      Math.max(rect.left + rect.width / 2 - coords.left - 6, 8),\r\n      Math.max(8, tooltip.offsetWidth - 20),\n    );\r\n    const verticalCenter = Math.min(\r\n      Math.max(rect.top + rect.height / 2 - coords.top - 6, 8),\r\n      Math.max(8, tooltip.offsetHeight - 20),\n    );\r\n\r\n    arrow.style.top = \"\";\r\n    arrow.style.bottom = \"\";\r\n    arrow.style.left = \"\";\r\n    arrow.style.right = \"\";\r\n\r\n    if (finalPosition === \"bottom\") {\r\n      arrow.style.top = \"-6px\";\r\n      arrow.style.left = `${horizontalCenter}px`;\r\n      return;\r\n    }\r\n\r\n    if (finalPosition === \"top\") {\r\n      arrow.style.bottom = \"-6px\";\r\n      arrow.style.left = `${horizontalCenter}px`;\r\n      return;\r\n    }\r\n\r\n    if (finalPosition === \"right\") {\r\n      arrow.style.left = \"-6px\";\r\n      arrow.style.top = `${verticalCenter}px`;\r\n      return;\r\n    }\r\n\r\n    arrow.style.right = \"-6px\";\r\n    arrow.style.top = `${verticalCenter}px`;\r\n  }, [coords, finalPosition, isMobile, targetRef, visible]);\r\n\r\n  useEffect(() => {\r\n    if (!visible) return;\r\n\r\n    tooltipRef.current?.animate([{ opacity: 0 }, { opacity: 1 }], {\r\n      duration: 150,\r\n      easing: \"ease-out\",\r\n    });\r\n  }, [visible]);\r\n\r\n  if (typeof window === \"undefined\") return null;\r\n\r\n  return ReactDOM.createPortal(\r\n    visible ? (\r\n      <div\r\n        id={tooltipId}\r\n        ref={tooltipRef}\r\n        role=\"tooltip\"\r\n        style={{ top: coords.top, left: coords.left }}\r\n        className={`fixed ${getFloatingLayerClass(targetRef.current, \"tooltip\")} max-h-[calc(100dvh-1rem)] overflow-y-auto overscroll-contain break-words whitespace-normal rounded-sm bg-surface-tooltip px-3 py-2 text-sm text-content-inverse shadow-lg ${\r\n          isMobile ? \"w-[90vw] max-w-[90vw]\" : \"w-max max-w-sm\"\r\n        }`}\r\n      >\r\n        {content}\r\n\r\n        {/* Setinha só no desktop */}\n        {!isMobile && (\r\n          <>\r\n            {finalPosition === \"bottom\" && (\r\n              <div\r\n                ref={arrowRef}\r\n                className=\"absolute h-0 w-0 border-b-[6px] border-l-[6px] border-r-[6px] border-b-surface-tooltip border-l-transparent border-r-transparent\"\r\n              />\r\n            )}\r\n            {finalPosition === \"top\" && (\r\n              <div\r\n                ref={arrowRef}\r\n                className=\"absolute h-0 w-0 border-l-[6px] border-r-[6px] border-t-[6px] border-l-transparent border-r-transparent border-t-surface-tooltip\"\r\n              />\r\n            )}\r\n            {finalPosition === \"right\" && (\r\n              <div\r\n                ref={arrowRef}\r\n                className=\"absolute h-0 w-0 border-b-[6px] border-r-[6px] border-t-[6px] border-b-transparent border-r-surface-tooltip border-t-transparent\"\r\n              />\r\n            )}\r\n            {finalPosition === \"left\" && (\r\n              <div\r\n                ref={arrowRef}\r\n                className=\"absolute h-0 w-0 border-b-[6px] border-l-[6px] border-t-[6px] border-b-transparent border-l-surface-tooltip border-t-transparent\"\r\n              />\r\n            )}\r\n          </>\r\n        )}\r\n      </div>\r\n    ) : null,\r\n    document.body,\r\n  );\r\n};\r\n\r\nexport default Tooltip;\r\n\r\n\r\n","export type TooltipPosition = \"top\" | \"bottom\" | \"left\" | \"right\";\r\n\r\ntype Rect = {\r\n  top: number;\r\n  right: number;\r\n  bottom: number;\r\n  left: number;\r\n  width: number;\r\n  height: number;\r\n};\r\n\r\ntype Size = {\r\n  width: number;\r\n  height: number;\r\n};\r\n\r\ntype CalculateTooltipPositionParams = {\r\n  target: Rect;\r\n  tooltip: Size;\r\n  preferred: TooltipPosition;\r\n  viewportWidth: number;\r\n  viewportHeight: number;\r\n  gap?: number;\r\n  margin?: number;\r\n};\r\n\r\ntype TooltipCoordinates = {\r\n  top: number;\r\n  left: number;\r\n  position: TooltipPosition;\r\n};\r\n\r\nconst OPPOSITE_POSITION: Record<TooltipPosition, TooltipPosition> = {\r\n  top: \"bottom\",\r\n  bottom: \"top\",\r\n  left: \"right\",\r\n  right: \"left\",\r\n};\r\n\r\nfunction coordinatesFor(\r\n  target: Rect,\r\n  tooltip: Size,\r\n  position: TooltipPosition,\r\n  gap: number,\r\n) {\r\n  if (position === \"top\") {\r\n    return {\r\n      top: target.top - tooltip.height - gap,\r\n      left: target.left + target.width / 2 - tooltip.width / 2,\r\n    };\r\n  }\r\n  if (position === \"bottom\") {\r\n    return {\r\n      top: target.bottom + gap,\r\n      left: target.left + target.width / 2 - tooltip.width / 2,\r\n    };\r\n  }\r\n  if (position === \"left\") {\r\n    return {\r\n      top: target.top + target.height / 2 - tooltip.height / 2,\r\n      left: target.left - tooltip.width - gap,\r\n    };\r\n  }\r\n  return {\r\n    top: target.top + target.height / 2 - tooltip.height / 2,\r\n    left: target.right + gap,\r\n  };\r\n}\r\n\r\nfunction fitsViewport(\r\n  coordinates: { top: number; left: number },\r\n  tooltip: Size,\r\n  viewportWidth: number,\r\n  viewportHeight: number,\r\n  margin: number,\r\n) {\r\n  return (\r\n    coordinates.top >= margin &&\r\n    coordinates.left >= margin &&\r\n    coordinates.top + tooltip.height <= viewportHeight - margin &&\r\n    coordinates.left + tooltip.width <= viewportWidth - margin\r\n  );\r\n}\r\n\r\nfunction clamp(value: number, minimum: number, maximum: number) {\r\n  return Math.min(Math.max(value, minimum), Math.max(minimum, maximum));\r\n}\r\n\r\nexport function calculateTooltipPosition({\r\n  target,\r\n  tooltip,\r\n  preferred,\r\n  viewportWidth,\r\n  viewportHeight,\r\n  gap = 8,\r\n  margin = 8,\r\n}: CalculateTooltipPositionParams): TooltipCoordinates {\r\n  const positions = [\r\n    preferred,\r\n    OPPOSITE_POSITION[preferred],\r\n    \"bottom\",\r\n    \"top\",\r\n    \"right\",\r\n    \"left\",\r\n  ].filter(\r\n    (position, index, values): position is TooltipPosition =>\r\n      values.indexOf(position) === index,\r\n  );\r\n\r\n  for (const position of positions) {\r\n    const coordinates = coordinatesFor(target, tooltip, position, gap);\r\n    if (\r\n      fitsViewport(\r\n        coordinates,\r\n        tooltip,\r\n        viewportWidth,\r\n        viewportHeight,\r\n        margin,\r\n      )\r\n    ) {\r\n      return { ...coordinates, position };\r\n    }\r\n  }\r\n\r\n  const fallback = coordinatesFor(target, tooltip, preferred, gap);\r\n  return {\r\n    top: clamp(fallback.top, margin, viewportHeight - tooltip.height - margin),\r\n    left: clamp(fallback.left, margin, viewportWidth - tooltip.width - margin),\r\n    position: preferred,\r\n  };\r\n}\r\n\r\n","\"use client\";\r\n\r\nimport { useEffect, type RefObject } from \"react\";\r\nimport { mergeAriaDescribedBy } from \"../../utils/accessibility\";\r\n\r\nexport function useTooltipRelationship(\r\n  targetRef: RefObject<HTMLElement | null> | undefined,\r\n  tooltipId: string,\r\n  visible: boolean,\r\n) {\r\n  useEffect(() => {\r\n    const target = targetRef?.current;\r\n    if (!target || !visible) return;\r\n\r\n    const previousDescription = target.getAttribute(\"aria-describedby\");\r\n    target.setAttribute(\r\n      \"aria-describedby\",\r\n      mergeAriaDescribedBy(previousDescription, tooltipId) ?? tooltipId,\r\n    );\r\n\r\n    return () => {\r\n      if (previousDescription) {\r\n        target.setAttribute(\"aria-describedby\", previousDescription);\r\n      } else {\r\n        target.removeAttribute(\"aria-describedby\");\r\n      }\r\n    };\r\n  }, [targetRef, tooltipId, visible]);\r\n}\r\n\r\n\r\n","export function mergeAriaDescribedBy(\r\n  ...values: Array<string | null | undefined>\r\n) {\r\n  const identifiers = values\r\n    .flatMap((value) => value?.trim().split(/\\s+/) ?? [])\r\n    .filter(Boolean);\r\n\r\n  return identifiers.length > 0\r\n    ? Array.from(new Set(identifiers)).join(\" \")\r\n    : undefined;\r\n}\r\n","export type FloatingLayer = \"popover\" | \"tooltip\";\r\n\r\nexport function getFloatingLayerClass(\r\n  trigger: HTMLElement | null | undefined,\r\n  layer: FloatingLayer,\r\n) {\r\n  if (trigger?.closest('[role=\"dialog\"][aria-modal=\"true\"]')) {\r\n    return \"z-modal-overlay\";\r\n  }\r\n\r\n  return layer === \"popover\" ? \"z-popover\" : \"z-tooltip\";\r\n}\r\n"],"mappings":"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","names":["useEffect","useState","useEffect","useEffect","useState","useEffect"]}