@12-apps/ui 6.37.0 → 6.39.0

package/dist/_internal/social-login-button/social-login-button.js

@@ -5,28 +5,27 @@ import {
   GoogleIcon,
   SocialLoginButton,
   SocialLoginContainer
-} from "../../chunk-Q73PTVNO.js";
+} from "../../chunk-3FNXOCBD.js";
 import "../../chunk-INGPH3YQ.js";
 import "../../chunk-6GP2DOOO.js";
 import "../../chunk-IJFAF3A7.js";
 import "../../chunk-5JSRM7WC.js";
 import "../../chunk-LKMMJKXU.js";
 import "../../chunk-CMMPGAMJ.js";
-import "../../chunk-Q4CAZ2TP.js";
-import "../../chunk-CAHWCSRE.js";
+import "../../chunk-IG23YZZR.js";
+import "../../chunk-D46SLMCX.js";
 import "../../chunk-VUHLNYAE.js";
 import "../../chunk-2GSIEDGN.js";
-import "../../chunk-N6CSXHFJ.js";
+import "../../chunk-WN5PNP6F.js";
 import "../../chunk-FKUYRQSP.js";
-import "../../chunk-LVEG6XQL.js";
+import "../../chunk-76X6JRVI.js";
 import "../../chunk-JH7EEJEQ.js";
 import "../../chunk-BA4RHQ3B.js";
-import "../../chunk-73BEVJCS.js";
 import "../../chunk-2EAAWOZ2.js";
 import "../../chunk-4WNFOBTH.js";
 import "../../chunk-LN46DSMF.js";
 import "../../chunk-TAMIZE4Q.js";
-import "../../chunk-WTOYEWW6.js";
+import "../../chunk-YBH4SPMM.js";
 import "../../chunk-U3PPLAFB.js";
 import "../../chunk-TYJR4GOF.js";
 import "../../chunk-PT6TCWIW.js";

package/dist/_internal/tokens/shadow.js

@@ -1,12 +1,23 @@
-import {
-  BLACK,
-  WHITE,
-  drop,
-  halo,
-  shadowCss,
-  shadowListCss
-} from "../../chunk-73BEVJCS.js";
 import "../../chunk-PZ5AY32C.js";
+
+// src/tokens/shadow.ts
+var len = (value) => value === 0 ? "0" : `${value}px`;
+var shadowCss = (shadow) => [
+  len(shadow.offsetX),
+  len(shadow.offsetY),
+  len(shadow.blurRadius),
+  ...shadow.spreadDistance === 0 ? [] : [len(shadow.spreadDistance)],
+  shadow.color
+].join(" ");
+var shadowListCss = (shadows) => shadows.map(shadowCss).join(", ");
+var BLACK = "#000";
+var WHITE = "#fff";
+var halo = (blurRadius, color) => [
+  { offsetX: 0, offsetY: 0, blurRadius, spreadDistance: 0, color }
+];
+var drop = (offsetY, blurRadius, color) => [
+  { offsetX: 0, offsetY, blurRadius, spreadDistance: 0, color }
+];
 export {
   BLACK,
   WHITE,

package/dist/_internal/tokens/shadow.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
+{"version":3,"sources":["../../../src/tokens/shadow.ts"],"sourcesContent":["/**\n * ONE SHADOW, IN THE SHAPE BOTH RENDERERS READ.\n *\n * A drop shadow is one of the few decorations the two sides express in the same\n * numbers and different syntax: CSS wants `0 8px 32px rgba(…)`, React Native\n * wants `{ offsetX, offsetY, blurRadius, spreadDistance, color }` (its\n * `BoxShadowValue`, which `boxShadow` takes an array of). So the numbers live in\n * a component's `*.metrics.ts` as this object, native passes it straight\n * through, and the web renders it with {@link shadowCss}.\n *\n * {@link shadowCss} reproduces the text the web components already wrote by\n * hand: a bare `0` for a zero length, and no spread at all when the spread is\n * zero. That is what makes moving a shadow into a metrics table a refactor\n * rather than a restyle.\n */\nexport interface UiShadow {\n  offsetX: number;\n  offsetY: number;\n  blurRadius: number;\n  spreadDistance: number;\n  color: string;\n}\n\n/** A length the way the web writes it: a bare `0`, otherwise px. */\nconst len = (value: number): string => (value === 0 ? '0' : `${value}px`);\n\n/** One shadow as CSS. A zero spread is omitted, as the web has always written it. */\nexport const shadowCss = (shadow: UiShadow): string =>\n  [\n    len(shadow.offsetX),\n    len(shadow.offsetY),\n    len(shadow.blurRadius),\n    ...(shadow.spreadDistance === 0 ? [] : [len(shadow.spreadDistance)]),\n    shadow.color,\n  ].join(' ');\n\n/** Several shadows as one CSS declaration. */\nexport const shadowListCss = (shadows: readonly UiShadow[]): string =>\n  shadows.map(shadowCss).join(', ');\n\n/**\n * MUI's `palette.common`, which `UiTheme` has no slot for.\n *\n * Here rather than beside each caller because the neumorphic, glass and scrim\n * arithmetic in more than one component mixes from exactly these two, and a\n * per-component copy is a per-component chance to write `#000000`.\n */\nexport const BLACK = '#000';\nexport const WHITE = '#fff';\n\n/** A shadow with no offset — a halo all round, which is how `glow` reads. */\nexport const halo = (blurRadius: number, color: string): UiShadow[] => [\n  { offsetX: 0, offsetY: 0, blurRadius, spreadDistance: 0, color },\n];\n\n/** A dropped shadow straight down, which is how a lifted surface sits. */\nexport const drop = (offsetY: number, blurRadius: number, color: string): UiShadow[] => [\n  { offsetX: 0, offsetY, blurRadius, spreadDistance: 0, color },\n];\n"],"mappings":";;;AAwBA,IAAM,MAAM,CAAC,UAA2B,UAAU,IAAI,MAAM,GAAG,KAAK;AAG7D,IAAM,YAAY,CAAC,WACxB;AAAA,EACE,IAAI,OAAO,OAAO;AAAA,EAClB,IAAI,OAAO,OAAO;AAAA,EAClB,IAAI,OAAO,UAAU;AAAA,EACrB,GAAI,OAAO,mBAAmB,IAAI,CAAC,IAAI,CAAC,IAAI,OAAO,cAAc,CAAC;AAAA,EAClE,OAAO;AACT,EAAE,KAAK,GAAG;AAGL,IAAM,gBAAgB,CAAC,YAC5B,QAAQ,IAAI,SAAS,EAAE,KAAK,IAAI;AAS3B,IAAM,QAAQ;AACd,IAAM,QAAQ;AAGd,IAAM,OAAO,CAAC,YAAoB,UAA8B;AAAA,EACrE,EAAE,SAAS,GAAG,SAAS,GAAG,YAAY,gBAAgB,GAAG,MAAM;AACjE;AAGO,IAAM,OAAO,CAAC,SAAiB,YAAoB,UAA8B;AAAA,EACtF,EAAE,SAAS,GAAG,SAAS,YAAY,gBAAgB,GAAG,MAAM;AAC9D;","names":[]}

package/dist/_internal/user-avatar/user-avatar.js

@@ -2,7 +2,7 @@
 import {
   UserAvatar,
   UserMenu
-} from "../../chunk-NCPWLHZT.js";
+} from "../../chunk-SKT2V2OX.js";
 import "../../chunk-UDQSIRAP.js";
 import "../../chunk-PGPPN63I.js";
 import "../../chunk-TNQDSTIA.js";
@@ -11,17 +11,16 @@ import "../../chunk-3ZVUNSFF.js";
 import "../../chunk-MTEQEPNY.js";
 import "../../chunk-VUHLNYAE.js";
 import "../../chunk-2GSIEDGN.js";
-import "../../chunk-N6CSXHFJ.js";
+import "../../chunk-WN5PNP6F.js";
 import "../../chunk-FKUYRQSP.js";
-import "../../chunk-LVEG6XQL.js";
+import "../../chunk-76X6JRVI.js";
 import "../../chunk-JH7EEJEQ.js";
 import "../../chunk-BA4RHQ3B.js";
-import "../../chunk-73BEVJCS.js";
 import "../../chunk-2EAAWOZ2.js";
 import "../../chunk-4WNFOBTH.js";
 import "../../chunk-LN46DSMF.js";
 import "../../chunk-TAMIZE4Q.js";
-import "../../chunk-WTOYEWW6.js";
+import "../../chunk-YBH4SPMM.js";
 import "../../chunk-U3PPLAFB.js";
 import "../../chunk-TYJR4GOF.js";
 import "../../chunk-CGO452DC.js";

package/dist/{chunk-J2DAQQQH.js → chunk-222HN7GK.js}

@@ -1,10 +1,12 @@
 import {
   useVirtualGrid,
-  useVirtualList
-} from "./chunk-F42MJOHM.js";
+  useVirtualList,
+  widthCss
+} from "./chunk-PVM7XTLZ.js";
 
 // src/components/utility/VirtualList/VirtualList.tsx
 import Box from "@mui/material/Box/index.js";
+import { useTheme } from "@mui/material/styles/index.js";
 import { useRef } from "react";
 import { jsx } from "react/jsx-runtime";
 var VirtualContainer = ({
@@ -41,40 +43,25 @@ var VirtualContainer = ({
     }
   );
 };
-var VirtualList = ({
-  items,
-  variant = "fixed",
-  height,
-  width = "100%",
-  itemHeight = 40,
-  estimatedItemHeight = 40,
-  overscan = 5,
-  renderItem,
-  onScroll,
-  className,
-  style,
-  "data-testid": dataTestId,
-  "aria-label": ariaLabel,
-  scrollContainerRef,
-  disableInternalScroll = false
-}) => {
-  const { totalHeight, visibleItems, handleScroll } = useVirtualList({
-    items,
-    variant,
-    height,
-    itemHeight,
-    estimatedItemHeight,
-    overscan,
-    onScroll,
-    scrollContainerRef
-  });
+var VirtualList = (props) => {
+  const {
+    width = "100%",
+    renderItem,
+    className,
+    style,
+    "data-testid": dataTestId,
+    "aria-label": ariaLabel,
+    disableInternalScroll = false
+  } = props;
+  const theme = useTheme();
+  const { totalHeight, viewportHeight, visibleItems, handleScroll } = useVirtualList(props);
   return /* @__PURE__ */ jsx(
     VirtualContainer,
     {
       role: "list",
       totalHeight,
-      height,
-      width,
+      height: viewportHeight,
+      width: widthCss(theme, width),
       disableInternalScroll,
       onScroll: handleScroll,
       className,
@@ -87,43 +74,25 @@ var VirtualList = ({
     }
   );
 };
-var VirtualGrid = ({
-  items,
-  height,
-  width = "100%",
-  columnCount,
-  rowHeight,
-  columnWidth,
-  gap = 0,
-  overscan = 5,
-  renderItem,
-  onScroll,
-  className,
-  style,
-  "data-testid": dataTestId,
-  "aria-label": ariaLabel,
-  scrollContainerRef,
-  disableInternalScroll = false
-}) => {
-  const { totalHeight, visibleItems, handleScroll } = useVirtualGrid({
-    items,
-    height,
-    width,
-    columnCount,
-    rowHeight,
-    columnWidth,
-    gap,
-    overscan,
-    onScroll,
-    scrollContainerRef
-  });
+var VirtualGrid = (props) => {
+  const {
+    width = "100%",
+    renderItem,
+    className,
+    style,
+    "data-testid": dataTestId,
+    "aria-label": ariaLabel,
+    disableInternalScroll = false
+  } = props;
+  const theme = useTheme();
+  const { totalHeight, viewportHeight, visibleItems, handleScroll } = useVirtualGrid(props);
   return /* @__PURE__ */ jsx(
     VirtualContainer,
     {
       role: "grid",
       totalHeight,
-      height,
-      width,
+      height: viewportHeight,
+      width: widthCss(theme, width),
       disableInternalScroll,
       onScroll: handleScroll,
       className,
@@ -141,4 +110,4 @@ export {
   VirtualList,
   VirtualGrid
 };
-//# sourceMappingURL=chunk-J2DAQQQH.js.map
+//# sourceMappingURL=chunk-222HN7GK.js.map

package/dist/chunk-222HN7GK.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/utility/VirtualList/VirtualList.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport { useTheme } from '@mui/material/styles/index.js';\nimport React, { useRef } from 'react';\n\nimport { useVirtualGrid, useVirtualList, widthCss } from './VirtualList.hooks';\nimport type { VirtualGridProps, VirtualListProps } from './VirtualList.types';\n\ninterface ContainerProps {\n  children: React.ReactNode;\n  role: 'list' | 'grid';\n  /** The scroll content's height, as CSS. */\n  totalHeight: string;\n  /** The viewport's height, as CSS. */\n  height: string;\n  /** The viewport's width, as CSS. */\n  width: string;\n  disableInternalScroll: boolean;\n  onScroll: (event: React.UIEvent<HTMLDivElement>) => void;\n  className?: string;\n  style?: React.CSSProperties;\n  dataTestId?: string;\n  ariaLabel?: string;\n}\n\n/**\n * Two shapes, shared by the list and the grid: when the caller owns the scroll\n * container we render only the full-height content, so their element does the\n * scrolling; otherwise we render our own viewport around it.\n */\nconst VirtualContainer: React.FC<ContainerProps> = ({\n  children,\n  role,\n  totalHeight,\n  height,\n  width,\n  disableInternalScroll,\n  onScroll,\n  className,\n  style,\n  dataTestId,\n  ariaLabel,\n}) => {\n  const internalContainerRef = useRef<HTMLDivElement>(null);\n  const identity = {\n    className,\n    'data-testid': dataTestId,\n    role,\n    'aria-label': ariaLabel,\n  };\n\n  if (disableInternalScroll) {\n    return (\n      <Box {...identity} sx={{ height: totalHeight, width, position: 'relative', ...style }}>\n        {children}\n      </Box>\n    );\n  }\n\n  return (\n    <Box\n      ref={internalContainerRef}\n      {...identity}\n      sx={{ height, width, overflow: 'auto', position: 'relative', ...style }}\n      onScroll={onScroll}\n    >\n      <Box sx={{ height: totalHeight, position: 'relative' }}>{children}</Box>\n    </Box>\n  );\n};\n\nexport const VirtualList: React.FC<VirtualListProps> = (props) => {\n  const {\n    width = '100%',\n    renderItem,\n    className,\n    style,\n    'data-testid': dataTestId,\n    'aria-label': ariaLabel,\n    disableInternalScroll = false,\n  } = props;\n  const theme = useTheme();\n  const { totalHeight, viewportHeight, visibleItems, handleScroll } = useVirtualList(props);\n\n  return (\n    <VirtualContainer\n      role=\"list\"\n      totalHeight={totalHeight}\n      height={viewportHeight}\n      width={widthCss(theme, width)}\n      disableInternalScroll={disableInternalScroll}\n      onScroll={handleScroll}\n      className={className}\n      style={style}\n      dataTestId={dataTestId}\n      ariaLabel={ariaLabel}\n    >\n      {visibleItems.map(({ item, index, style: itemStyle }) =>\n        renderItem({ item, index, style: itemStyle }),\n      )}\n    </VirtualContainer>\n  );\n};\n\nexport const VirtualGrid: React.FC<VirtualGridProps> = (props) => {\n  const {\n    width = '100%',\n    renderItem,\n    className,\n    style,\n    'data-testid': dataTestId,\n    'aria-label': ariaLabel,\n    disableInternalScroll = false,\n  } = props;\n  const theme = useTheme();\n  const { totalHeight, viewportHeight, visibleItems, handleScroll } = useVirtualGrid(props);\n\n  return (\n    <VirtualContainer\n      role=\"grid\"\n      totalHeight={totalHeight}\n      height={viewportHeight}\n      width={widthCss(theme, width)}\n      disableInternalScroll={disableInternalScroll}\n      onScroll={handleScroll}\n      className={className}\n      style={style}\n      dataTestId={dataTestId}\n      ariaLabel={ariaLabel}\n    >\n      {visibleItems.map(({ item, index, columnIndex, rowIndex, style: itemStyle }) =>\n        renderItem({ item, index, columnIndex, rowIndex, style: itemStyle }),\n      )}\n    </VirtualContainer>\n  );\n};\n"],"mappings":";;;;;;;AAAA,OAAO,SAAS;AAChB,SAAS,gBAAgB;AACzB,SAAgB,cAAc;AAkDxB;AAvBN,IAAM,mBAA6C,CAAC;AAAA,EAClD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,uBAAuB,OAAuB,IAAI;AACxD,QAAM,WAAW;AAAA,IACf;AAAA,IACA,eAAe;AAAA,IACf;AAAA,IACA,cAAc;AAAA,EAChB;AAEA,MAAI,uBAAuB;AACzB,WACE,oBAAC,OAAK,GAAG,UAAU,IAAI,EAAE,QAAQ,aAAa,OAAO,UAAU,YAAY,GAAG,MAAM,GACjF,UACH;AAAA,EAEJ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACJ,GAAG;AAAA,MACJ,IAAI,EAAE,QAAQ,OAAO,UAAU,QAAQ,UAAU,YAAY,GAAG,MAAM;AAAA,MACtE;AAAA,MAEA,8BAAC,OAAI,IAAI,EAAE,QAAQ,aAAa,UAAU,WAAW,GAAI,UAAS;AAAA;AAAA,EACpE;AAEJ;AAEO,IAAM,cAA0C,CAAC,UAAU;AAChE,QAAM;AAAA,IACJ,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,cAAc;AAAA,IACd,wBAAwB;AAAA,EAC1B,IAAI;AACJ,QAAM,QAAQ,SAAS;AACvB,QAAM,EAAE,aAAa,gBAAgB,cAAc,aAAa,IAAI,eAAe,KAAK;AAExF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL;AAAA,MACA,QAAQ;AAAA,MACR,OAAO,SAAS,OAAO,KAAK;AAAA,MAC5B;AAAA,MACA,UAAU;AAAA,MACV;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEC,uBAAa;AAAA,QAAI,CAAC,EAAE,MAAM,OAAO,OAAO,UAAU,MACjD,WAAW,EAAE,MAAM,OAAO,OAAO,UAAU,CAAC;AAAA,MAC9C;AAAA;AAAA,EACF;AAEJ;AAEO,IAAM,cAA0C,CAAC,UAAU;AAChE,QAAM;AAAA,IACJ,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,cAAc;AAAA,IACd,wBAAwB;AAAA,EAC1B,IAAI;AACJ,QAAM,QAAQ,SAAS;AACvB,QAAM,EAAE,aAAa,gBAAgB,cAAc,aAAa,IAAI,eAAe,KAAK;AAExF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL;AAAA,MACA,QAAQ;AAAA,MACR,OAAO,SAAS,OAAO,KAAK;AAAA,MAC5B;AAAA,MACA,UAAU;AAAA,MACV;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEC,uBAAa;AAAA,QAAI,CAAC,EAAE,MAAM,OAAO,aAAa,UAAU,OAAO,UAAU,MACxE,WAAW,EAAE,MAAM,OAAO,aAAa,UAAU,OAAO,UAAU,CAAC;AAAA,MACrE;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/dist/{chunk-2BIVCYTO.js → chunk-27LOJVR3.js}

@@ -3,20 +3,20 @@ import {
 } from "./chunk-5M4TYFR3.js";
 import {
   PreviewBox
-} from "./chunk-JGRE56GQ.js";
+} from "./chunk-OB56SZGL.js";
 import {
   useDataViewsCopy
 } from "./chunk-KHG57NAE.js";
 import {
   Switch
-} from "./chunk-VZIB5W5L.js";
+} from "./chunk-ZGCPDA3F.js";
 import {
   Input
 } from "./chunk-VURQZBFH.js";
 import {
   Dialog,
   DialogContent
-} from "./chunk-L4UP5VYS.js";
+} from "./chunk-GVH7C2PT.js";
 import {
   default as default2
 } from "./chunk-6DPAWXZ3.js";
@@ -28,7 +28,7 @@ import {
 } from "./chunk-2EAAWOZ2.js";
 import {
   Text
-} from "./chunk-WTOYEWW6.js";
+} from "./chunk-YBH4SPMM.js";
 import {
   sxRem
 } from "./chunk-YKCAJ2TN.js";
@@ -268,4 +268,4 @@ function SaveViewModal({
 export {
   SaveViewModal
 };
-//# sourceMappingURL=chunk-2BIVCYTO.js.map
+//# sourceMappingURL=chunk-27LOJVR3.js.map

package/dist/{chunk-BLJDCMFU.js → chunk-2ARVNCVU.js}

@@ -1,6 +1,6 @@
 import {
   ShortcutChip
-} from "./chunk-RNEYZTE4.js";
+} from "./chunk-Z6MCTGIK.js";
 import {
   rem,
   sxRem
@@ -18,18 +18,18 @@ import Typography from "@mui/material/Typography/index.js";
 import { alpha, styled } from "@mui/material/styles/index.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 var ResultsList = styled(List)(({ theme }) => ({
-  maxHeight: 400,
+  maxHeight: rem(theme, 400),
   overflowY: "auto",
   padding: theme.spacing(1),
   "&::-webkit-scrollbar": {
-    width: 8
+    width: rem(theme, 8)
   },
   "&::-webkit-scrollbar-track": {
     background: alpha(theme.palette.action.disabled, 0.1)
   },
   "&::-webkit-scrollbar-thumb": {
     background: alpha(theme.palette.primary.main, 0.3),
-    borderRadius: 4,
+    borderRadius: rem(theme, 4),
     "&:hover": {
       background: alpha(theme.palette.primary.main, 0.5)
     }
@@ -42,7 +42,7 @@ var CommandItem = styled(ListItem)(({ theme, selected }) => ({
   cursor: "pointer",
   ...selected && {
     backgroundColor: alpha(theme.palette.primary.main, 0.12),
-    transform: "translateX(4px)",
+    transform: `translateX(${rem(theme, 4)})`,
     "& .MuiListItemIcon-root": {
       color: theme.palette.primary.main
     }
@@ -74,7 +74,7 @@ var CommandRow = ({ command, index, selected, dataTestId, onSelect, onExecute })
     onClick: () => onExecute(command),
     onMouseEnter: () => onSelect(index),
     children: [
-      command.icon && /* @__PURE__ */ jsx(ListItemIcon, { sx: { minWidth: 40 }, children: command.icon }),
+      command.icon && /* @__PURE__ */ jsx(ListItemIcon, { sx: { minWidth: sxRem(40) }, children: command.icon }),
       /* @__PURE__ */ jsx(
         ListItemText,
         {
@@ -151,4 +151,4 @@ var PaletteResults = ({
 export {
   PaletteResults
 };
-//# sourceMappingURL=chunk-BLJDCMFU.js.map
+//# sourceMappingURL=chunk-2ARVNCVU.js.map

package/dist/chunk-2ARVNCVU.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/navigation/CommandPalette/CommandPaletteResults.tsx"],"sourcesContent":["import RecentIcon from '@mui/icons-material/History';\nimport Box from '@mui/material/Box/index.js';\nimport Divider from '@mui/material/Divider/index.js';\nimport List from '@mui/material/List/index.js';\nimport ListItem from '@mui/material/ListItem/index.js';\nimport ListItemIcon from '@mui/material/ListItemIcon/index.js';\nimport ListItemText from '@mui/material/ListItemText/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { alpha, styled } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport { ShortcutChip } from './ShortcutChip';\nimport type { PaletteCommand } from './CommandPalette.types';\nimport type { CommandPaletteCopy } from '../../../copy';\nimport { rem, sxRem } from '../../../tokens/relative';\n\nconst ResultsList = styled(List)(({ theme }) => ({\n  maxHeight: rem(theme, 400),\n  overflowY: 'auto',\n  padding: theme.spacing(1),\n  '&::-webkit-scrollbar': {\n    width: rem(theme, 8),\n  },\n  '&::-webkit-scrollbar-track': {\n    background: alpha(theme.palette.action.disabled, 0.1),\n  },\n  '&::-webkit-scrollbar-thumb': {\n    background: alpha(theme.palette.primary.main, 0.3),\n    borderRadius: rem(theme, 4),\n    '&:hover': {\n      background: alpha(theme.palette.primary.main, 0.5),\n    },\n  },\n}));\n\nconst CommandItem = styled(ListItem)<{ selected?: boolean }>(({ theme, selected }) => ({\n  borderRadius: theme.shape.borderRadius,\n  marginBottom: theme.spacing(0.5),\n  transition: theme.transitions.create(['background-color', 'transform']),\n  cursor: 'pointer',\n  ...(selected && {\n    backgroundColor: alpha(theme.palette.primary.main, 0.12),\n    transform: `translateX(${rem(theme, 4)})`,\n    '& .MuiListItemIcon-root': {\n      color: theme.palette.primary.main,\n    },\n  }),\n  '&:hover': {\n    backgroundColor: alpha(theme.palette.primary.main, 0.08),\n  },\n}));\n\nconst CategoryLabel = styled(Typography)(({ theme }) => ({\n  fontSize: rem(theme, 12),\n  fontWeight: 600,\n  color: theme.palette.text.secondary,\n  textTransform: 'uppercase',\n  letterSpacing: '0.1em',\n  padding: theme.spacing(1, 2, 0.5, 2),\n  marginTop: theme.spacing(1),\n}));\n\nconst NoResults = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(4, 2),\n  textAlign: 'center',\n  color: theme.palette.text.secondary,\n}));\n\nconst CommandRow: React.FC<{\n  command: PaletteCommand;\n  index: number;\n  selected: boolean;\n  dataTestId?: string;\n  onSelect: (index: number) => void;\n  onExecute: (command: PaletteCommand) => void;\n}> = ({ command, index, selected, dataTestId, onSelect, onExecute }) => (\n  <CommandItem\n    data-index={index}\n    data-testid={`${dataTestId}-item-${command.id}`}\n    selected={selected}\n    onClick={() => onExecute(command)}\n    onMouseEnter={() => onSelect(index)}\n  >\n    {command.icon && <ListItemIcon sx={{ minWidth: sxRem(40) }}>{command.icon}</ListItemIcon>}\n    <ListItemText\n      primary={command.label}\n      secondary={command.description}\n      primaryTypographyProps={{ fontSize: sxRem(14.4), fontWeight: selected ? 500 : 400 }}\n      secondaryTypographyProps={{ fontSize: sxRem(12) }}\n    />\n    {command.shortcut && <ShortcutChip label={command.shortcut} size=\"small\" />}\n  </CommandItem>\n);\n\nconst slug = (value: string) => value.toLowerCase().replace(/\\s+/g, '-');\n\n// The list, its recent section and the empty state. The running commandIndex\n// has to stay consistent across both sections, so it is threaded through here\n// rather than mutated from inside the render as it was before.\nexport const PaletteResults: React.FC<{\n  copy: CommandPaletteCopy;\n  listRef: React.Ref<globalThis.HTMLUListElement>;\n  dataTestId?: string;\n  searchQuery: string;\n  showRecent?: boolean;\n  commands: PaletteCommand[];\n  recentCommandIds: string[];\n  filteredCommands: PaletteCommand[];\n  groupedCommands: Record<string, PaletteCommand[]>;\n  selectedIndex: number;\n  onSelect: (index: number) => void;\n  onExecute: (command: PaletteCommand) => void;\n}> = ({\n  copy,\n  listRef,\n  dataTestId,\n  searchQuery,\n  showRecent,\n  commands,\n  recentCommandIds,\n  filteredCommands,\n  groupedCommands,\n  selectedIndex,\n  onSelect,\n  onExecute,\n}) => {\n  if (filteredCommands.length === 0) {\n    return (\n      <NoResults data-testid={`${dataTestId}-no-results`}>\n        <Typography variant=\"body2\" color=\"text.secondary\">\n          No commands found for \"{searchQuery}\"\n        </Typography>\n        <Typography variant=\"caption\" color=\"text.disabled\" sx={{ mt: 1 }}>\n          {copy.tryAnotherTerm}\n        </Typography>\n      </NoResults>\n    );\n  }\n\n  const showRecentSection = !searchQuery && showRecent && recentCommandIds.length > 0;\n  const recent = showRecentSection\n    ? (recentCommandIds\n        .map((id) => commands.find((command) => command.id === id))\n        .filter(Boolean) as PaletteCommand[])\n    : [];\n\n  // One running index across both sections, so keyboard selection lines up with\n  // what is on screen.\n  let commandIndex = 0;\n  const row = (command: PaletteCommand) => {\n    const index = commandIndex++;\n    return (\n      <CommandRow\n        key={command.id}\n        command={command}\n        index={index}\n        selected={index === selectedIndex}\n        dataTestId={dataTestId}\n        onSelect={onSelect}\n        onExecute={onExecute}\n      />\n    );\n  };\n\n  const showCategoryLabels = Object.keys(groupedCommands).length > 1;\n\n  return (\n    <ResultsList ref={listRef} data-testid={`${dataTestId}-list`}>\n      {showRecentSection && (\n        <>\n          <CategoryLabel data-testid={`${dataTestId}-group-recent`}>\n            <RecentIcon sx={{ fontSize: sxRem(14), mr: 0.5, verticalAlign: 'middle' }} />\n            {copy.recent}\n          </CategoryLabel>\n          {recent.map(row)}\n          {filteredCommands.length > recentCommandIds.length && <Divider sx={{ my: 1 }} />}\n        </>\n      )}\n\n      {Object.entries(groupedCommands).map(([category, categoryCommands]) => (\n        <Box key={category} data-testid={`${dataTestId}-group-${slug(category)}`}>\n          {showCategoryLabels && (\n            <CategoryLabel data-testid={`${dataTestId}-group-label-${slug(category)}`}>\n              {category}\n            </CategoryLabel>\n          )}\n          {categoryCommands.map(row)}\n        </Box>\n      ))}\n    </ResultsList>\n  );\n};\n"],"mappings":"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","names":[]}

package/dist/{chunk-CRZXSZ5O.js → chunk-2S752BIJ.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-KHG57NAE.js";
 import {
   Pagination
-} from "./chunk-YVUD3MY4.js";
+} from "./chunk-N23GCN5U.js";
 import {
   default as default2
 } from "./chunk-6DPAWXZ3.js";
@@ -31,4 +31,4 @@ function DataViewsPagination({
 export {
   DataViewsPagination
 };
-//# sourceMappingURL=chunk-CRZXSZ5O.js.map
+//# sourceMappingURL=chunk-2S752BIJ.js.map

package/dist/{chunk-IYTBTK2M.js → chunk-2WU52FLP.js}

@@ -10,9 +10,6 @@ import {
   DIALOG_RADIUS_UNITS,
   DIALOG_WIDTH_PERCENT
 } from "./chunk-GVGJMH77.js";
-import {
-  shadowCss
-} from "./chunk-73BEVJCS.js";
 import {
   dynamicViewportHeight
 } from "./chunk-AKZWDZCZ.js";
@@ -20,16 +17,20 @@ import {
   scrim,
   shadowInk
 } from "./chunk-FQ6UW7IY.js";
+import {
+  rem,
+  rems
+} from "./chunk-YKCAJ2TN.js";
 
 // src/components/feedback/Dialog/Dialog.styles.ts
 import { alpha, keyframes } from "@mui/material/styles/index.js";
-var pulseAnimation = keyframes`
+var pulseAnimation = (theme) => keyframes`
   0% {
     box-shadow: 0 0 0 0 currentColor;
     opacity: 1;
   }
   70% {
-    box-shadow: 0 0 0 ${DIALOG_PULSE.spread}px currentColor;
+    box-shadow: 0 0 0 ${rem(theme, DIALOG_PULSE.spread)} currentColor;
     opacity: 0;
   }
   100% {
@@ -39,15 +40,15 @@ var pulseAnimation = keyframes`
 `;
 function borderRadiusOf(theme, borderRadius) {
   const units = DIALOG_RADIUS_UNITS[borderRadius] ?? DIALOG_RADIUS_UNITS.lg;
-  return units === 0 ? 0 : theme.spacing(units);
+  return units === 0 ? "0" : theme.spacing(units);
 }
-function maxWidthOf(size) {
-  return DIALOG_MAX_WIDTH[size] ?? DIALOG_MAX_WIDTH.md;
+function maxWidthOf(theme, size) {
+  return rem(theme, DIALOG_MAX_WIDTH[size] ?? DIALOG_MAX_WIDTH.md);
 }
 function baseStylesOf(theme, opts) {
   return {
     borderRadius: borderRadiusOf(theme, opts.borderRadius),
-    maxWidth: maxWidthOf(opts.size),
+    maxWidth: maxWidthOf(theme, opts.size),
     width: `${DIALOG_WIDTH_PERCENT}vw`,
     margin: theme.spacing(DIALOG_MARGIN_UNITS),
     transition: theme.transitions.create(
@@ -58,13 +59,7 @@ function baseStylesOf(theme, opts) {
 }
 function glowStylesOf(theme, glow) {
   return glow ? {
-    boxShadow: shadowCss({
-      offsetX: 0,
-      offsetY: 0,
-      blurRadius: DIALOG_GLOW.blurRadius,
-      spreadDistance: 0,
-      color: alpha(theme.palette.primary.main, DIALOG_GLOW.alpha)
-    })
+    boxShadow: `${rems(theme, 0, 0, DIALOG_GLOW.blurRadius)} ${alpha(theme.palette.primary.main, DIALOG_GLOW.alpha)}`
   } : {};
 }
 function pulseStylesOf(theme, pulse) {
@@ -81,7 +76,7 @@ function pulseStylesOf(theme, pulse) {
       borderRadius: "inherit",
       backgroundColor: theme.palette.primary.main,
       opacity: DIALOG_PULSE.alpha,
-      animation: `${pulseAnimation} ${DIALOG_PULSE.durationMs / 1e3}s infinite`,
+      animation: `${pulseAnimation(theme)} ${DIALOG_PULSE.durationMs / 1e3}s infinite`,
       pointerEvents: "none",
       zIndex: DIALOG_PULSE.zIndex
     }
@@ -90,12 +85,12 @@ function pulseStylesOf(theme, pulse) {
 function defaultVariantStyles(theme, opts) {
   const gradientStyles = opts.gradient ? {
     background: `linear-gradient(${DIALOG_GRADIENT.angleDeg}deg, ${alpha(theme.palette.primary.main, DIALOG_GRADIENT.stopAlpha)}, ${alpha(theme.palette.secondary.main, DIALOG_GRADIENT.stopAlpha)})`,
-    backdropFilter: `blur(${DIALOG_GRADIENT.blurPx}px)`
+    backdropFilter: `blur(${rem(theme, DIALOG_GRADIENT.blurPx)})`
   } : {};
   return {
     ...gradientStyles,
     backgroundColor: opts.glass ? alpha(theme.palette.background.paper, DIALOG_GLASS.backgroundAlpha) : theme.palette.background.paper,
-    backdropFilter: opts.glass ? `blur(${DIALOG_GLASS.blurPx}px)` : "none",
+    backdropFilter: opts.glass ? `blur(${rem(theme, DIALOG_GLASS.blurPx)})` : "none",
     border: opts.glass ? `${DIALOG_BORDER_WIDTH}px solid ${alpha(theme.palette.primary.main, DIALOG_GLASS.borderAlpha)}` : "none"
   };
 }
@@ -110,15 +105,9 @@ function variantStylesOf(theme, opts) {
         ...baseStylesOf(theme, opts),
         ...decorations,
         backgroundColor: alpha(theme.palette.background.paper, DIALOG_GLASS.backgroundAlpha),
-        backdropFilter: `blur(${DIALOG_GLASS.blurPx}px)`,
+        backdropFilter: `blur(${rem(theme, DIALOG_GLASS.blurPx)})`,
         border: `${DIALOG_BORDER_WIDTH}px solid ${alpha(theme.palette.primary.main, DIALOG_GLASS.borderAlpha)}`,
-        boxShadow: shadowCss({
-          offsetX: 0,
-          offsetY: DIALOG_GLASS.shadow.offsetY,
-          blurRadius: DIALOG_GLASS.shadow.blurRadius,
-          spreadDistance: 0,
-          color: shadowInk(theme, DIALOG_GLASS.shadow.alpha)
-        })
+        boxShadow: `${rems(theme, 0, DIALOG_GLASS.shadow.offsetY, DIALOG_GLASS.shadow.blurRadius)} ${shadowInk(theme, DIALOG_GLASS.shadow.alpha)}`
       };
     case "fullscreen":
       return {
@@ -139,7 +128,7 @@ function variantStylesOf(theme, opts) {
         // panel's leading corners square.
         borderRadius: `${radius} 0 0 ${radius}`,
         margin: 0,
-        width: maxWidthOf(opts.size),
+        width: maxWidthOf(theme, opts.size),
         // Never wider than the screen: a 600px panel on a 375px phone put its
         // title and the start of every line off the left edge.
         maxWidth: "100%",
@@ -159,7 +148,7 @@ function variantStylesOf(theme, opts) {
 function backdropSxOf(theme, glass) {
   return {
     backgroundColor: scrim(theme, glass ? DIALOG_BACKDROP.alpha.glass : DIALOG_BACKDROP.alpha.plain),
-    backdropFilter: glass ? `blur(${DIALOG_BACKDROP.blurPx}px)` : "none"
+    backdropFilter: glass ? `blur(${rem(theme, DIALOG_BACKDROP.blurPx)})` : "none"
   };
 }
 
@@ -167,4 +156,4 @@ export {
   variantStylesOf,
   backdropSxOf
 };
-//# sourceMappingURL=chunk-IYTBTK2M.js.map
+//# sourceMappingURL=chunk-2WU52FLP.js.map

package/dist/chunk-2WU52FLP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/feedback/Dialog/Dialog.styles.ts"],"sourcesContent":["import type { SxProps, Theme } from '@mui/material/styles/index.js';\nimport { alpha, keyframes } from '@mui/material/styles/index.js';\n\nimport type { DialogBorderRadius, DialogSize, DialogVariant } from './Dialog.base';\nimport {\n  DIALOG_BACKDROP,\n  DIALOG_BORDER_WIDTH,\n  DIALOG_GLASS,\n  DIALOG_GLOW,\n  DIALOG_GRADIENT,\n  DIALOG_MARGIN_UNITS,\n  DIALOG_MAX_WIDTH,\n  DIALOG_PULSE,\n  DIALOG_RADIUS_UNITS,\n  DIALOG_WIDTH_PERCENT,\n} from './Dialog.metrics';\nimport { scrim, shadowInk } from '../../../tokens/ink';\nimport { rem, rems } from '../../../tokens/relative';\nimport { dynamicViewportHeight } from '../../../utils/viewport';\n\n/**\n * Paper/backdrop styling for the Dialog component (FUT-181 gate cleanup):\n * pure helpers so `Dialog.tsx` stays within the size/complexity budget.\n *\n * Every number comes from `Dialog.metrics.ts`, which the native renderer reads\n * too — so a paper cannot be 800px wide on one side and 780 on the other.\n */\n\n// Define pulse animation — a function of the theme so the ring's spread follows the type scale.\nconst pulseAnimation = (theme: Theme) => keyframes`\n  0% {\n    box-shadow: 0 0 0 0 currentColor;\n    opacity: 1;\n  }\n  70% {\n    box-shadow: 0 0 0 ${rem(theme, DIALOG_PULSE.spread)} currentColor;\n    opacity: 0;\n  }\n  100% {\n    box-shadow: 0 0 0 0 currentColor;\n    opacity: 0;\n  }\n`;\n\n/** Style toggles that shape the dialog paper (extracted so each fn stays small). */\ninterface VariantStyleOptions {\n  variant: DialogVariant;\n  size: DialogSize;\n  borderRadius: DialogBorderRadius;\n  glass: boolean;\n  gradient: boolean;\n  glow: boolean;\n  pulse: boolean;\n}\n\nfunction borderRadiusOf(theme: Theme, borderRadius: VariantStyleOptions['borderRadius']) {\n  const units = DIALOG_RADIUS_UNITS[borderRadius] ?? DIALOG_RADIUS_UNITS.lg;\n  // `none` is a bare 0 rather than `spacing(0)`, as this has always written it.\n  return units === 0 ? '0' : theme.spacing(units);\n}\n\nfunction maxWidthOf(theme: Theme, size: VariantStyleOptions['size']): string {\n  return rem(theme, DIALOG_MAX_WIDTH[size] ?? DIALOG_MAX_WIDTH.md);\n}\n\nfunction baseStylesOf(theme: Theme, opts: VariantStyleOptions) {\n  return {\n    borderRadius: borderRadiusOf(theme, opts.borderRadius),\n    maxWidth: maxWidthOf(theme, opts.size),\n    width: `${DIALOG_WIDTH_PERCENT}vw`,\n    margin: theme.spacing(DIALOG_MARGIN_UNITS),\n    transition: theme.transitions.create(\n      ['box-shadow', 'background-color', 'backdrop-filter'],\n      { duration: theme.transitions.duration.standard },\n    ),\n  };\n}\n\nfunction glowStylesOf(theme: Theme, glow: boolean) {\n  return glow\n    ? {\n        boxShadow: `${rems(theme, 0, 0, DIALOG_GLOW.blurRadius)} ${alpha(theme.palette.primary.main, DIALOG_GLOW.alpha)}`,\n      }\n    : {};\n}\n\nfunction pulseStylesOf(theme: Theme, pulse: boolean) {\n  if (!pulse) return {};\n  return {\n    position: 'relative' as const,\n    '&::after': {\n      content: '\"\"',\n      position: 'absolute' as const,\n      top: 0,\n      left: 0,\n      right: 0,\n      bottom: 0,\n      borderRadius: 'inherit',\n      backgroundColor: theme.palette.primary.main,\n      opacity: DIALOG_PULSE.alpha,\n      animation: `${pulseAnimation(theme)} ${DIALOG_PULSE.durationMs / 1000}s infinite`,\n      pointerEvents: 'none' as const,\n      zIndex: DIALOG_PULSE.zIndex,\n    },\n  };\n}\n\n/** The default variant's paper: optional gradient/glass over the base styles. */\nfunction defaultVariantStyles(theme: Theme, opts: VariantStyleOptions) {\n  const gradientStyles = opts.gradient\n    ? {\n        background: `linear-gradient(${DIALOG_GRADIENT.angleDeg}deg, ${alpha(theme.palette.primary.main, DIALOG_GRADIENT.stopAlpha)}, ${alpha(theme.palette.secondary.main, DIALOG_GRADIENT.stopAlpha)})`,\n        backdropFilter: `blur(${rem(theme, DIALOG_GRADIENT.blurPx)})`,\n      }\n    : {};\n  return {\n    ...gradientStyles,\n    backgroundColor: opts.glass\n      ? alpha(theme.palette.background.paper, DIALOG_GLASS.backgroundAlpha)\n      : theme.palette.background.paper,\n    backdropFilter: opts.glass ? `blur(${rem(theme, DIALOG_GLASS.blurPx)})` : 'none',\n    border: opts.glass\n      ? `${DIALOG_BORDER_WIDTH}px solid ${alpha(theme.palette.primary.main, DIALOG_GLASS.borderAlpha)}`\n      : 'none',\n  };\n}\n\nexport function variantStylesOf(theme: Theme, opts: VariantStyleOptions): SxProps<Theme> {\n  const decorations = {\n    ...glowStylesOf(theme, opts.glow),\n    ...pulseStylesOf(theme, opts.pulse),\n  };\n  switch (opts.variant) {\n    case 'glass':\n      return {\n        ...baseStylesOf(theme, opts),\n        ...decorations,\n        backgroundColor: alpha(theme.palette.background.paper, DIALOG_GLASS.backgroundAlpha),\n        backdropFilter: `blur(${rem(theme, DIALOG_GLASS.blurPx)})`,\n        border: `${DIALOG_BORDER_WIDTH}px solid ${alpha(theme.palette.primary.main, DIALOG_GLASS.borderAlpha)}`,\n        boxShadow: `${rems(theme, 0, DIALOG_GLASS.shadow.offsetY, DIALOG_GLASS.shadow.blurRadius)} ${shadowInk(theme, DIALOG_GLASS.shadow.alpha)}`,\n      };\n    case 'fullscreen':\n      return {\n        borderRadius: 0,\n        margin: 0,\n        width: '100vw',\n        // `100dvh`, not `100vh` — see `dynamicViewportHeight`.\n        ...dynamicViewportHeight('height'),\n        maxWidth: 'none',\n        maxHeight: 'none',\n        ...decorations,\n      };\n    case 'drawer': {\n      const radius = borderRadiusOf(theme, opts.borderRadius);\n      return {\n        // `radius` is already a length (`theme.spacing(n)` → '16px', or 0): gluing\n        // another `px` on wrote '16pxpx', which the browser dropped, leaving the\n        // panel's leading corners square.\n        borderRadius: `${radius} 0 0 ${radius}`,\n        margin: 0,\n        width: maxWidthOf(theme, opts.size),\n        // Never wider than the screen: a 600px panel on a 375px phone put its\n        // title and the start of every line off the left edge.\n        maxWidth: '100%',\n        ...dynamicViewportHeight('height'),\n        maxHeight: 'none',\n        ...decorations,\n      };\n    }\n    default:\n      return {\n        ...baseStylesOf(theme, opts),\n        ...decorations,\n        ...defaultVariantStyles(theme, opts),\n      };\n  }\n}\n\nexport function backdropSxOf(theme: Theme, glass: boolean) {\n  return {\n    backgroundColor: scrim(theme, glass ? DIALOG_BACKDROP.alpha.glass : DIALOG_BACKDROP.alpha.plain),\n    backdropFilter: glass ? `blur(${rem(theme, DIALOG_BACKDROP.blurPx)})` : 'none',\n  };\n}\n"],"mappings":"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","names":[]}

package/dist/{chunk-RSQMPCCR.js → chunk-34643ATX.js}

@@ -1,9 +1,13 @@
 import {
   calculateTooltipPosition,
   getElementBounds
-} from "./chunk-NYZO3JNB.js";
+} from "./chunk-RXJQA3FQ.js";
+import {
+  remPx
+} from "./chunk-YKCAJ2TN.js";
 
 // src/components/feedback/TutorialOverlay/TutorialOverlay.hooks.ts
+import { useTheme } from "@mui/material/styles/index.js";
 import { useCallback, useEffect, useRef, useState } from "react";
 var useTargetBounds = ({
   active,
@@ -33,6 +37,7 @@ var useTooltipPlacement = ({
   isVisible,
   preferredPosition
 }) => {
+  const theme = useTheme();
   const tooltipRef = useRef(null);
   const [tooltipPosition, setTooltipPosition] = useState({ top: 0, left: 0 });
   const [actualPlacement, setActualPlacement] = useState("bottom");
@@ -41,11 +46,12 @@ var useTooltipPlacement = ({
     const { position, placement } = calculateTooltipPosition(
       targetBounds,
       tooltipRef.current.getBoundingClientRect(),
-      preferredPosition || "auto"
+      preferredPosition || "auto",
+      remPx(theme, 16)
     );
     setTooltipPosition(position);
     setActualPlacement(placement);
-  }, [targetBounds, isVisible, preferredPosition]);
+  }, [targetBounds, isVisible, preferredPosition, theme]);
   return { tooltipRef, tooltipPosition, actualPlacement };
 };
 var useTutorialKeyboard = ({
@@ -138,4 +144,4 @@ var useTutorialOverlay = ({
 export {
   useTutorialOverlay
 };
-//# sourceMappingURL=chunk-RSQMPCCR.js.map
+//# sourceMappingURL=chunk-34643ATX.js.map

package/dist/chunk-34643ATX.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/feedback/TutorialOverlay/TutorialOverlay.hooks.ts"],"sourcesContent":["import { useTheme } from '@mui/material/styles/index.js';\nimport { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { remPx } from '../../../tokens/relative';\n\nimport { calculateTooltipPosition, getElementBounds } from './TutorialOverlay.geometry';\nimport type { TutorialOverlayProps } from './TutorialOverlay.types';\n\n// Tracks the highlighted element's box, re-measuring on resize and scroll. Scroll\n// is captured (third argument true) so it fires for any scrolling ancestor, not\n// just the window.\nconst useTargetBounds = ({\n  active,\n  target,\n}: {\n  active: boolean;\n  target?: string;\n}) => {\n  const [targetBounds, setTargetBounds] = useState<globalThis.DOMRect | null>(null);\n  const [isVisible, setIsVisible] = useState(false);\n\n  useEffect(() => {\n    if (!active || !target) return;\n\n    const updateBounds = () => {\n      const bounds = getElementBounds(target);\n      setTargetBounds(bounds);\n      setIsVisible(Boolean(bounds));\n    };\n\n    updateBounds();\n\n    window.addEventListener('resize', updateBounds);\n    window.addEventListener('scroll', updateBounds, true);\n\n    return () => {\n      window.removeEventListener('resize', updateBounds);\n      window.removeEventListener('scroll', updateBounds, true);\n    };\n  }, [active, target]);\n\n  return { targetBounds, isVisible };\n};\n\n// Places the tooltip against the measured target once both boxes are known.\nconst useTooltipPlacement = ({\n  targetBounds,\n  isVisible,\n  preferredPosition,\n}: {\n  targetBounds: globalThis.DOMRect | null;\n  isVisible: boolean;\n  preferredPosition?: string;\n}) => {\n  const theme = useTheme();\n  const tooltipRef = useRef<HTMLDivElement>(null);\n  const [tooltipPosition, setTooltipPosition] = useState({ top: 0, left: 0 });\n  const [actualPlacement, setActualPlacement] = useState<string>('bottom');\n\n  useEffect(() => {\n    if (!targetBounds || !tooltipRef.current || !isVisible) return;\n\n    const { position, placement } = calculateTooltipPosition(\n      targetBounds,\n      tooltipRef.current.getBoundingClientRect(),\n      preferredPosition || 'auto',\n      remPx(theme, 16),\n    );\n\n    setTooltipPosition(position);\n    setActualPlacement(placement);\n  }, [targetBounds, isVisible, preferredPosition, theme]);\n\n  return { tooltipRef, tooltipPosition, actualPlacement };\n};\n\n// Arrow keys step through the tour, Escape skips it.\nconst useTutorialKeyboard = ({\n  enabled,\n  onNext,\n  onPrev,\n  onSkip,\n}: {\n  enabled: boolean;\n  onNext: () => void;\n  onPrev: () => void;\n  onSkip: () => void;\n}) => {\n  useEffect(() => {\n    if (!enabled) return;\n\n    const handleKeyPress = (e: globalThis.KeyboardEvent) => {\n      switch (e.key) {\n        case 'ArrowLeft':\n          onPrev();\n          break;\n        case 'ArrowRight':\n          onNext();\n          break;\n        case 'Escape':\n          onSkip();\n          break;\n      }\n    };\n\n    window.addEventListener('keydown', handleKeyPress);\n    return () => window.removeEventListener('keydown', handleKeyPress);\n  }, [enabled, onNext, onPrev, onSkip]);\n};\n\nexport const useTutorialOverlay = ({\n  steps,\n  initialStep,\n  active,\n  allowKeyboardNavigation,\n  onComplete,\n  onSkip,\n  onStepComplete,\n}: {\n  steps: TutorialOverlayProps['steps'];\n  initialStep: number;\n  active: boolean;\n  allowKeyboardNavigation: boolean;\n  onComplete?: () => void;\n  onSkip?: () => void;\n  onStepComplete?: (stepId: string) => void;\n}) => {\n  const [currentStep, setCurrentStep] = useState(initialStep);\n\n  const currentStepData = steps[currentStep];\n  const isLastStep = currentStep === steps.length - 1;\n\n  const { targetBounds, isVisible } = useTargetBounds({\n    active,\n    target: currentStepData?.target,\n  });\n\n  const { tooltipRef, tooltipPosition, actualPlacement } = useTooltipPlacement({\n    targetBounds,\n    isVisible,\n    preferredPosition: currentStepData?.position,\n  });\n\n  const handleNext = useCallback(() => {\n    const currentStepId = steps[currentStep]?.id;\n    if (currentStepId) onStepComplete?.(currentStepId);\n\n    if (currentStep < steps.length - 1) {\n      setCurrentStep(currentStep + 1);\n      return;\n    }\n\n    onComplete?.();\n  }, [currentStep, steps, onComplete, onStepComplete]);\n\n  const handlePrev = useCallback(() => {\n    setCurrentStep((step) => Math.max(step - 1, 0));\n  }, []);\n\n  const handleSkip = useCallback(() => {\n    onSkip?.();\n  }, [onSkip]);\n\n  const handleRestart = useCallback(() => {\n    setCurrentStep(0);\n  }, []);\n\n  useTutorialKeyboard({\n    enabled: allowKeyboardNavigation && active,\n    onNext: handleNext,\n    onPrev: handlePrev,\n    onSkip: handleSkip,\n  });\n\n  return {\n    currentStep,\n    currentStepData,\n    isLastStep,\n    isVisible,\n    targetBounds,\n    tooltipRef,\n    tooltipPosition,\n    actualPlacement,\n    progress: ((currentStep + 1) / steps.length) * 100,\n    handleNext,\n    handlePrev,\n    handleSkip,\n    handleRestart,\n  };\n};\n"],"mappings":"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","names":[]}