@12-apps/ui 6.54.0 → 6.55.0

package/dist/chunk-RYC6ZXEF.js

@@ -0,0 +1,252 @@
+import {
+  resolveScrollAreaProps
+} from "./chunk-QUWK7SYN.js";
+import {
+  ScrollViewport
+} from "./chunk-YMWJ7Z5I.js";
+import {
+  sizeCss
+} from "./chunk-EMGNK2KG.js";
+import {
+  ScrollAreaContent
+} from "./chunk-4VMFS3VJ.js";
+import {
+  rem,
+  remPx,
+  sxRem
+} from "./chunk-YKCAJ2TN.js";
+
+// src/components/layout/ScrollArea/ScrollArea.tsx
+import KeyboardArrowUp from "@mui/icons-material/KeyboardArrowUp";
+import Box from "@mui/material/Box/index.js";
+import CircularProgress from "@mui/material/CircularProgress/index.js";
+import Fab from "@mui/material/Fab/index.js";
+import Zoom from "@mui/material/Zoom/index.js";
+import { alpha, useTheme } from "@mui/material/styles/index.js";
+import { useCallback, useEffect, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var useObservedScrollRef = ({
+  externalScrollRef,
+  onResize
+}) => {
+  const internalScrollRef = useRef(null);
+  const [containerDimensions, setContainerDimensions] = useState({ width: 0, height: 0 });
+  useEffect(() => {
+    if (!internalScrollRef.current) return;
+    const resizeObserver = new ResizeObserver((entries) => {
+      const entry = entries[0];
+      if (entry) {
+        const { width, height } = entry.contentRect;
+        setContainerDimensions({ width, height });
+        onResize?.({ width, height });
+      }
+    });
+    resizeObserver.observe(internalScrollRef.current);
+    return () => resizeObserver.disconnect();
+  }, [onResize]);
+  const setScrollRef = useCallback(
+    (node) => {
+      internalScrollRef.current = node;
+      if (externalScrollRef) {
+        externalScrollRef.current = node;
+      }
+    },
+    [externalScrollRef]
+  );
+  return { scrollRef: internalScrollRef, setScrollRef, containerDimensions };
+};
+var useAutoHide = ({
+  autoHide,
+  alwaysShowScrollbar,
+  autoHideDelay
+}) => {
+  const [isScrolling, setIsScrolling] = useState(false);
+  const timeoutRef = useRef(void 0);
+  const noteScroll = useCallback(() => {
+    if (!autoHide || alwaysShowScrollbar) return;
+    setIsScrolling(true);
+    window.clearTimeout(timeoutRef.current);
+    timeoutRef.current = window.setTimeout(() => setIsScrolling(false), autoHideDelay);
+  }, [autoHide, alwaysShowScrollbar, autoHideDelay]);
+  useEffect(() => () => window.clearTimeout(timeoutRef.current), []);
+  return { isScrolling, noteScroll };
+};
+var useScrollArea = (props) => {
+  const {
+    disabled,
+    onScroll,
+    onResize,
+    externalScrollRef,
+    autoHide,
+    autoHideDelay,
+    alwaysShowScrollbar,
+    scrollToTopButton,
+    scrollToTopThreshold,
+    smoothScroll
+  } = props;
+  const theme = useTheme();
+  const { scrollRef, setScrollRef, containerDimensions } = useObservedScrollRef({
+    externalScrollRef,
+    onResize
+  });
+  const [showScrollToTop, setShowScrollToTop] = useState(false);
+  const { isScrolling, noteScroll } = useAutoHide({
+    autoHide,
+    alwaysShowScrollbar,
+    autoHideDelay
+  });
+  const handleScroll = useCallback(
+    (event) => {
+      if (disabled) return;
+      noteScroll();
+      if (scrollToTopButton && scrollRef.current) {
+        setShowScrollToTop(scrollRef.current.scrollTop > remPx(theme, scrollToTopThreshold ?? 100));
+      }
+      onScroll?.(event);
+    },
+    [disabled, noteScroll, scrollToTopButton, scrollToTopThreshold, onScroll, scrollRef, theme]
+  );
+  const scrollToTop = useCallback(() => {
+    scrollRef.current?.scrollTo({ top: 0, behavior: smoothScroll ? "smooth" : "auto" });
+  }, [smoothScroll, scrollRef]);
+  return {
+    scrollRef,
+    setScrollRef,
+    isScrolling,
+    showScrollToTop,
+    containerDimensions,
+    handleScroll,
+    scrollToTop
+  };
+};
+var LoadingOverlay = () => /* @__PURE__ */ jsx(
+  Box,
+  {
+    sx: {
+      position: "absolute",
+      top: "50%",
+      left: "50%",
+      transform: "translate(-50%, -50%)",
+      zIndex: 10
+    },
+    children: /* @__PURE__ */ jsx(CircularProgress, {})
+  }
+);
+var ScrollToTopFab = ({
+  visible,
+  glass,
+  scrollToTopLabel,
+  onClick
+}) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsx(Zoom, { in: visible, children: /* @__PURE__ */ jsx(
+    Fab,
+    {
+      size: "small",
+      "aria-label": scrollToTopLabel,
+      onClick,
+      sx: {
+        position: "absolute",
+        bottom: sxRem(16),
+        right: sxRem(16),
+        zIndex: 1,
+        backgroundColor: glass ? alpha(theme.palette.primary.main, 0.2) : theme.palette.primary.main,
+        backdropFilter: glass ? `blur(${rem(theme, 10)})` : "none",
+        "&:hover": {
+          backgroundColor: glass ? alpha(theme.palette.primary.main, 0.3) : theme.palette.primary.dark
+        }
+      },
+      children: /* @__PURE__ */ jsx(KeyboardArrowUp, {})
+    }
+  ) });
+};
+function outerBoxSx(theme, size, sx) {
+  return {
+    position: "relative",
+    width: sizeCss(theme, size.width),
+    height: sizeCss(theme, size.height),
+    maxHeight: sizeCss(theme, size.maxHeight),
+    maxWidth: sizeCss(theme, size.maxWidth),
+    ...sx
+  };
+}
+var ScrollArea = (componentProps) => {
+  const theme = useTheme();
+  const resolved = resolveScrollAreaProps(componentProps);
+  const {
+    regionLabel,
+    scrollToTopLabel,
+    children,
+    width: _width,
+    height: _height,
+    maxHeight: _maxHeight,
+    maxWidth: _maxWidth,
+    orientation: _orientation,
+    scrollbarSize: _scrollbarSize,
+    autoHide,
+    autoHideDelay: _autoHideDelay,
+    smoothScroll: _smoothScroll,
+    variant,
+    onScroll: _onScroll,
+    scrollToTopButton,
+    scrollToTopThreshold: _scrollToTopThreshold,
+    scrollbarColor: _scrollbarColor,
+    scrollbarTrackColor: _scrollbarTrackColor,
+    contentPadding: _contentPadding,
+    alwaysShowScrollbar,
+    disabled,
+    loading,
+    emptyContent,
+    testId,
+    scrollRef: externalScrollRef,
+    onResize: _onResize,
+    sx,
+    ...props
+  } = resolved;
+  const { scrollRef, setScrollRef, isScrolling, showScrollToTop, containerDimensions, handleScroll, scrollToTop } = useScrollArea({ ...resolved, externalScrollRef });
+  const shouldShowScrollbar = alwaysShowScrollbar || !autoHide || isScrolling;
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      "data-testid": testId,
+      sx: outerBoxSx(theme, resolved, sx),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(
+          ScrollViewport,
+          {
+            ...resolved,
+            regionLabel,
+            shouldShowScrollbar,
+            setScrollRef,
+            onScroll: handleScroll,
+            children: /* @__PURE__ */ jsx(
+              ScrollAreaContent,
+              {
+                emptyContent,
+                scrollRef,
+                containerWidth: containerDimensions.width,
+                children
+              }
+            )
+          }
+        ),
+        loading && /* @__PURE__ */ jsx(LoadingOverlay, {}),
+        scrollToTopButton && scrollToTopLabel && !disabled && !loading && /* @__PURE__ */ jsx(
+          ScrollToTopFab,
+          {
+            scrollToTopLabel,
+            visible: showScrollToTop,
+            glass: variant === "glass",
+            onClick: scrollToTop
+          }
+        )
+      ]
+    }
+  );
+};
+
+export {
+  ScrollArea
+};
+//# sourceMappingURL=chunk-RYC6ZXEF.js.map

package/dist/chunk-S4TMDAB4.js

@@ -0,0 +1,161 @@
+import {
+  SearchGlyph
+} from "./chunk-DMNZD3Q7.js";
+import {
+  chipSx,
+  chipWrapSx,
+  panelHeadSx,
+  pinnedLabelSx,
+  pinnedSx
+} from "./chunk-RCQYCDV6.js";
+import {
+  fieldBorder,
+  fieldHeight
+} from "./chunk-RGVNXES5.js";
+import {
+  fieldRadiusPx
+} from "./chunk-GDN2LUTZ.js";
+import {
+  rem,
+  rems,
+  sxRem
+} from "./chunk-YKCAJ2TN.js";
+
+// src/components/form/CategorySelect/CategoryPanelHead.tsx
+import Box from "@mui/material/Box/index.js";
+import InputBase from "@mui/material/InputBase/index.js";
+import { alpha, useTheme } from "@mui/material/styles/index.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+var searchFieldSx = {
+  position: "relative",
+  display: "flex",
+  alignItems: "center",
+  "& input": {
+    width: "100%",
+    height: fieldHeight,
+    padding: (theme) => rems(theme, 0, 30, 0, 32),
+    fontSize: sxRem(13),
+    border: fieldBorder,
+    borderRadius: fieldRadiusPx,
+    background: "background.paper",
+    color: "text.primary",
+    "&:focus": {
+      outline: "none",
+      borderColor: "primary.main",
+      // 0x26 of 0xFF: the ring's old hex-alpha suffix, kept exact.
+      boxShadow: (theme) => `0 0 0 ${rem(theme, 3)} ${alpha(theme.palette.primary.main, 38 / 255)}`
+    }
+  }
+};
+var clearButtonSx = {
+  position: "absolute",
+  right: sxRem(7),
+  width: sxRem(20),
+  height: sxRem(20),
+  border: 0,
+  background: "action.selected",
+  color: "text.secondary",
+  borderRadius: "50%",
+  display: "grid",
+  placeItems: "center",
+  cursor: "pointer",
+  fontSize: sxRem(12),
+  padding: 0,
+  lineHeight: 1
+};
+function CategoryPanelHead({
+  query,
+  placeholder,
+  sheet,
+  quickActions,
+  onQueryChange,
+  searchInputRef,
+  dataTestId,
+  copy
+}) {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsxs(Box, { sx: (theme2) => panelHeadSx(theme2, sheet), children: [
+    /* @__PURE__ */ jsxs(Box, { sx: searchFieldSx, children: [
+      /* @__PURE__ */ jsx(
+        SearchGlyph,
+        {
+          style: {
+            position: "absolute",
+            left: rem(theme, 10),
+            width: rem(theme, 15),
+            height: rem(theme, 15),
+            opacity: 0.55,
+            pointerEvents: "none"
+          }
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        InputBase,
+        {
+          inputRef: searchInputRef,
+          value: query,
+          placeholder,
+          autoComplete: "off",
+          inputProps: { "aria-label": placeholder, "data-testid": `${dataTestId}-search` },
+          onChange: (event) => onQueryChange(event.target.value),
+          sx: { width: "100%" }
+        }
+      ),
+      query.length > 0 && /* @__PURE__ */ jsx(
+        Box,
+        {
+          component: "button",
+          type: "button",
+          "aria-label": copy.search.clear,
+          "data-testid": `${dataTestId}-search-clear`,
+          sx: clearButtonSx,
+          onClick: () => onQueryChange(""),
+          children: "\xD7"
+        }
+      )
+    ] }),
+    quickActions && /* @__PURE__ */ jsx(
+      Box,
+      {
+        sx: {
+          display: "flex",
+          alignItems: "center",
+          gap: sxRem(10),
+          marginTop: sxRem(8),
+          fontSize: sxRem(12)
+        },
+        children: quickActions
+      }
+    )
+  ] });
+}
+function CategoryPinnedTray({
+  chips,
+  onRemove,
+  dataTestId,
+  copy
+}) {
+  if (chips.length === 0) return null;
+  return /* @__PURE__ */ jsxs(Box, { sx: pinnedSx, "data-testid": `${dataTestId}-pinned`, children: [
+    /* @__PURE__ */ jsx(Box, { sx: pinnedLabelSx, children: copy.search.pinnedLabel(chips.length) }),
+    /* @__PURE__ */ jsx(Box, { sx: chipWrapSx, children: chips.map((chip) => /* @__PURE__ */ jsxs(Box, { component: "span", sx: chipSx, children: [
+      chip.label,
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          "aria-label": copy.search.removeChip(chip.label),
+          "data-testid": `${dataTestId}-unpin-${chip.id}`,
+          onClick: () => onRemove(chip.id),
+          children: "\xD7"
+        }
+      )
+    ] }, chip.id)) })
+  ] });
+}
+
+export {
+  CategoryPanelHead,
+  CategoryPinnedTray
+};
+//# sourceMappingURL=chunk-S4TMDAB4.js.map

package/dist/chunk-S5OOYOEJ.js

@@ -0,0 +1,152 @@
+import {
+  absoluteInk,
+  neutralTones
+} from "./chunk-SSX5ITPM.js";
+import {
+  rem,
+  rems,
+  sxRem
+} from "./chunk-YKCAJ2TN.js";
+
+// src/components/data-display/Tooltip/Tooltip.tsx
+import MuiTooltip from "@mui/material/Tooltip/index.js";
+import { alpha, keyframes } from "@mui/material/styles/index.js";
+import React from "react";
+import { jsx } from "react/jsx-runtime";
+var pulseAnimation = keyframes`
+  0% {
+    transform: scale(1);
+    opacity: 1;
+  }
+  70% {
+    transform: scale(1.05);
+    opacity: 0.8;
+  }
+  100% {
+    transform: scale(1);
+    opacity: 1;
+  }
+`;
+var SIZE_MAP = {
+  sm: { fontSize: sxRem(12), padding: (theme) => rems(theme, 4, 8) },
+  md: { fontSize: sxRem(14), padding: (theme) => rems(theme, 6, 12) },
+  lg: { fontSize: sxRem(16), padding: (theme) => rems(theme, 8, 16) }
+};
+var getSizeStyles = (size) => SIZE_MAP[size] || SIZE_MAP.md;
+var variantStyles = (theme, variant) => {
+  switch (variant) {
+    case "default":
+      return {
+        backgroundColor: neutralTones(theme).inverseSurface,
+        color: absoluteInk(theme).white
+      };
+    case "dark":
+      return {
+        backgroundColor: neutralTones(theme).inverseSurface,
+        color: absoluteInk(theme).white
+      };
+    case "light":
+      return {
+        backgroundColor: absoluteInk(theme).white,
+        color: theme.palette.text.primary,
+        border: `1px solid ${alpha(theme.palette.divider, 0.2)}`,
+        boxShadow: theme.shadows[4]
+      };
+    case "glass":
+      return {
+        backgroundColor: alpha(theme.palette.background.paper, 0.1),
+        backdropFilter: `blur(${rem(theme, 20)})`,
+        border: `1px solid ${alpha(theme.palette.divider, 0.2)}`,
+        color: theme.palette.text.primary
+      };
+    default:
+      return {};
+  }
+};
+var emphasisStyles = (theme, glow, pulse) => ({
+  ...glow && {
+    boxShadow: `${rems(theme, 0, 0, 15, 3)} ${alpha(theme.palette.primary.main, 0.4)} !important`,
+    filter: "brightness(1.05)"
+  },
+  ...pulse && {
+    animation: `${pulseAnimation} 2s infinite`
+  }
+});
+var arrowColor = (theme, variant) => {
+  switch (variant) {
+    case "light":
+      return absoluteInk(theme).white;
+    case "glass":
+      return alpha(theme.palette.background.paper, 0.1);
+    case "dark":
+      return neutralTones(theme).inverseSurface;
+    default:
+      return neutralTones(theme).inverseSurface;
+  }
+};
+var bubbleSx = (variant, size, glow, pulse, maxWidth) => (theme) => {
+  const sizeStyles = getSizeStyles(size);
+  return {
+    borderRadius: theme.spacing(1),
+    fontSize: sizeStyles.fontSize(theme),
+    padding: sizeStyles.padding(theme),
+    fontWeight: 500,
+    transition: "all 0.3s ease",
+    position: "relative",
+    maxWidth: tooltipCap(maxWidth)(theme),
+    ...variantStyles(theme, variant),
+    ...emphasisStyles(theme, glow, pulse)
+  };
+};
+var tooltipCap = (maxWidth) => (theme) => {
+  const cap = maxWidth ?? 300;
+  return cap <= 1 && cap !== 0 ? `${cap * 100}%` : rem(theme, cap);
+};
+var Tooltip = React.forwardRef(
+  ({
+    variant = "default",
+    size = "md",
+    glow = false,
+    pulse = false,
+    maxWidth,
+    dataTestId,
+    children,
+    ...props
+  }, ref) => {
+    const childWithTestId = dataTestId ? React.cloneElement(
+      children,
+      {
+        "data-testid": `${dataTestId}-trigger`
+      }
+    ) : children;
+    return /* @__PURE__ */ jsx(
+      MuiTooltip,
+      {
+        ref,
+        enterDelay: 0,
+        leaveDelay: 0,
+        disableHoverListener: false,
+        disableFocusListener: false,
+        disableTouchListener: false,
+        slotProps: {
+          tooltip: {
+            sx: bubbleSx(variant, size, glow, pulse, maxWidth),
+            role: "tooltip",
+            ...dataTestId && { "data-testid": `${dataTestId}-content` }
+          },
+          arrow: {
+            sx: (theme) => ({ color: arrowColor(theme, variant) })
+          }
+        },
+        ...props,
+        children: childWithTestId
+      }
+    );
+  }
+);
+Tooltip.displayName = "Tooltip";
+
+export {
+  Tooltip
+};
+//# sourceMappingURL=chunk-S5OOYOEJ.js.map

package/dist/chunk-S5OOYOEJ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Tooltip/Tooltip.tsx"],"sourcesContent":["import MuiTooltip from \"@mui/material/Tooltip/index.js\";\nimport { alpha, keyframes } from \"@mui/material/styles/index.js\";\nimport type { CSSObject, Theme } from \"@mui/material/styles/index.js\";\nimport React from \"react\";\n\nimport type { TooltipProps } from \"./Tooltip.types\";\nimport { absoluteInk, neutralTones } from \"../../../tokens/ink\";\nimport { rem, rems, sxRem } from \"../../../tokens/relative\";\n\n// Define pulse animation\nconst pulseAnimation = keyframes`\n  0% {\n    transform: scale(1);\n    opacity: 1;\n  }\n  70% {\n    transform: scale(1.05);\n    opacity: 0.8;\n  }\n  100% {\n    transform: scale(1);\n    opacity: 1;\n  }\n`;\n\nconst SIZE_MAP = {\n  sm: { fontSize: sxRem(12), padding: (theme: Theme) => rems(theme, 4, 8) },\n  md: { fontSize: sxRem(14), padding: (theme: Theme) => rems(theme, 6, 12) },\n  lg: { fontSize: sxRem(16), padding: (theme: Theme) => rems(theme, 8, 16) },\n} as const;\n\nconst getSizeStyles = (\n  size?: string,\n): { fontSize: (theme: Theme) => string; padding: (theme: Theme) => string } =>\n  SIZE_MAP[size as keyof typeof SIZE_MAP] || SIZE_MAP.md;\n\nconst variantStyles = (theme: Theme, variant?: string): CSSObject => {\n  switch (variant) {\n    case \"default\":\n      return {\n        backgroundColor: neutralTones(theme).inverseSurface,\n        color: absoluteInk(theme).white,\n      };\n    case \"dark\":\n      return {\n        backgroundColor: neutralTones(theme).inverseSurface,\n        color: absoluteInk(theme).white,\n      };\n    case \"light\":\n      return {\n        backgroundColor: absoluteInk(theme).white,\n        color: theme.palette.text.primary,\n        border: `1px solid ${alpha(theme.palette.divider, 0.2)}`,\n        boxShadow: theme.shadows[4],\n      };\n    case \"glass\":\n      return {\n        backgroundColor: alpha(theme.palette.background.paper, 0.1),\n        backdropFilter: `blur(${rem(theme, 20)})`,\n        border: `1px solid ${alpha(theme.palette.divider, 0.2)}`,\n        color: theme.palette.text.primary,\n      };\n    default:\n      return {};\n  }\n};\n\n// glow and pulse are independent flags. The three combinations used to be spelled\n// out one by one, but each is just the union of whichever flags are set.\nconst emphasisStyles = (\n  theme: Theme,\n  glow?: boolean,\n  pulse?: boolean,\n): CSSObject => ({\n  ...(glow && {\n    boxShadow: `${rems(theme, 0, 0, 15, 3)} ${alpha(theme.palette.primary.main, 0.4)} !important`,\n    filter: \"brightness(1.05)\",\n  }),\n  ...(pulse && {\n    animation: `${pulseAnimation} 2s infinite`,\n  }),\n});\n\nconst arrowColor = (theme: Theme, variant?: string): string => {\n  switch (variant) {\n    case \"light\":\n      return absoluteInk(theme).white;\n    case \"glass\":\n      return alpha(theme.palette.background.paper, 0.1);\n    case \"dark\":\n      return neutralTones(theme).inverseSurface;\n    default:\n      return neutralTones(theme).inverseSurface;\n  }\n};\n\n/**\n * The bubble's own look, applied to the BUBBLE (FUT-3093).\n *\n * It used to sit on a `styled(MuiTooltip)` root as `& .MuiTooltip-tooltip`, but\n * MUI renders the bubble in a portal, outside that root — so none of it ever\n * reached the screen, and every tooltip wore MUI's see-through grey instead of\n * the variant it asked for. `slotProps.tooltip.sx` lands on the bubble itself.\n * No `overflow: hidden`: now that it applies, it would clip an `arrow`.\n */\nconst bubbleSx =\n  (\n    variant: string,\n    size: string,\n    glow: boolean,\n    pulse: boolean,\n    maxWidth: number | undefined,\n  ) =>\n  (theme: Theme): CSSObject => {\n    const sizeStyles = getSizeStyles(size);\n    return {\n      borderRadius: theme.spacing(1),\n      fontSize: sizeStyles.fontSize(theme),\n      padding: sizeStyles.padding(theme),\n      fontWeight: 500,\n      transition: \"all 0.3s ease\",\n      position: \"relative\",\n      maxWidth: tooltipCap(maxWidth)(theme),\n      ...variantStyles(theme, variant),\n      ...emphasisStyles(theme, glow, pulse),\n    };\n  };\n\n/**\n * The tooltip's cap: 300 design px unless the caller says otherwise. `sx` has\n * always read a number of 1 or less as a fraction of the parent, and that stays so.\n */\nconst tooltipCap =\n  (maxWidth: number | undefined) =>\n  (theme: Theme): string => {\n    const cap = maxWidth ?? 300;\n    return cap <= 1 && cap !== 0 ? `${cap * 100}%` : rem(theme, cap);\n  };\n\nexport const Tooltip = React.forwardRef<HTMLDivElement, TooltipProps>(\n  (\n    {\n      variant = \"default\",\n      size = \"md\",\n      glow = false,\n      pulse = false,\n      maxWidth,\n      dataTestId,\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    const childWithTestId = dataTestId\n      ? React.cloneElement(\n          children as React.ReactElement<{ \"data-testid\"?: string }>,\n          {\n            \"data-testid\": `${dataTestId}-trigger`,\n          },\n        )\n      : children;\n\n    return (\n      <MuiTooltip\n        ref={ref}\n        enterDelay={0}\n        leaveDelay={0}\n        disableHoverListener={false}\n        disableFocusListener={false}\n        disableTouchListener={false}\n        slotProps={{\n          tooltip: {\n            sx: bubbleSx(variant, size, glow, pulse, maxWidth),\n            role: \"tooltip\",\n            ...(dataTestId && { \"data-testid\": `${dataTestId}-content` }),\n          },\n          arrow: {\n            sx: (theme: Theme) => ({ color: arrowColor(theme, variant) }),\n          },\n        }}\n        {...props}\n      >\n        {childWithTestId}\n      </MuiTooltip>\n    );\n  },\n);\n\nTooltip.displayName = \"Tooltip\";\n"],"mappings":"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","names":[]}