@12-apps/ui 6.11.0 → 6.12.0

package/dist/chunk-4ETQRBZC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/MapPreview/MapPreview.hooks.ts"],"sourcesContent":["import type React from 'react';\nimport { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { geocode } from './mapProjection';\nimport {\n  CITY_ZOOM,\n  CLICK_JITTER_DEGREES,\n  DRAG_DEGREES_PER_PIXEL,\n  MAP_TYPES,\n  MAX_ZOOM,\n  MIN_ZOOM,\n} from './MapPreview.constants';\nimport type { LatLng, MapType } from './MapPreview.types';\n\nconst ORIGIN = { x: 0, y: 0 };\n\nexport const useMapView = ({\n  coordinates,\n  initialZoom,\n  initialMapType,\n}: {\n  coordinates: LatLng;\n  initialZoom: number;\n  initialMapType: MapType;\n}) => {\n  const [zoom, setZoom] = useState(initialZoom);\n  const [mapType, setMapType] = useState<MapType>(initialMapType);\n  const [markerPosition, setMarkerPosition] = useState(coordinates);\n  const [panOffset, setPanOffset] = useState(ORIGIN);\n\n  useEffect(() => {\n    setMarkerPosition(coordinates);\n  }, [coordinates]);\n\n  // Panning is relative to the tile grid, so a zoom change invalidates it.\n  const zoomTo = useCallback((next: number) => {\n    setZoom(next);\n    setPanOffset(ORIGIN);\n  }, []);\n\n  return {\n    zoom,\n    zoomTo,\n    mapType,\n    setMapType,\n    markerPosition,\n    setMarkerPosition,\n    panOffset,\n    setPanOffset,\n  };\n};\n\nexport const useMapControls = ({\n  coordinates,\n  zoom,\n  mapType,\n  zoomTo,\n  setMapType,\n  setMarkerPosition,\n  setPanOffset,\n  containerRef,\n}: {\n  coordinates: LatLng;\n  zoom: number;\n  mapType: MapType;\n  zoomTo: (zoom: number) => void;\n  setMapType: (type: MapType) => void;\n  setMarkerPosition: (position: LatLng) => void;\n  setPanOffset: (offset: { x: number; y: number }) => void;\n  containerRef: React.RefObject<HTMLDivElement | null>;\n}) => {\n  const [isFullscreen, setIsFullscreen] = useState(false);\n\n  const handleZoomIn = useCallback(() => zoomTo(Math.min(zoom + 1, MAX_ZOOM)), [zoom, zoomTo]);\n  const handleZoomOut = useCallback(() => zoomTo(Math.max(zoom - 1, MIN_ZOOM)), [zoom, zoomTo]);\n\n  const handleCenter = useCallback(() => {\n    setMarkerPosition({ ...coordinates });\n    setPanOffset(ORIGIN);\n  }, [coordinates, setMarkerPosition, setPanOffset]);\n\n  const handleToggleMapType = useCallback(() => {\n    const nextIndex = (MAP_TYPES.indexOf(mapType) + 1) % MAP_TYPES.length;\n    setMapType(MAP_TYPES[nextIndex] as MapType);\n  }, [mapType, setMapType]);\n\n  const handleToggleFullscreen = useCallback(() => {\n    if (!isFullscreen && containerRef.current) {\n      containerRef.current.requestFullscreen?.();\n    } else if (document.fullscreenElement) {\n      document.exitFullscreen?.();\n    }\n    setIsFullscreen((prev) => !prev);\n  }, [isFullscreen, containerRef]);\n\n  return {\n    isFullscreen,\n    handleZoomIn,\n    handleZoomOut,\n    handleCenter,\n    handleToggleMapType,\n    handleToggleFullscreen,\n  };\n};\n\ninterface DragStart {\n  x: number;\n  y: number;\n  lat: number;\n  lng: number;\n}\n\ninterface PanStart {\n  x: number;\n  y: number;\n  offsetX: number;\n  offsetY: number;\n}\n\nconst isOnMapSurface = (target: HTMLElement): boolean =>\n  target.dataset.testid === 'static-map-view' ||\n  Boolean(target.closest('[data-testid=\"static-map-view\"]'));\n\nconst panTo = (event: React.MouseEvent, start: PanStart) => ({\n  x: start.offsetX + (event.clientX - start.x),\n  y: start.offsetY + (event.clientY - start.y),\n});\n\nconst dragTo = (event: React.MouseEvent, start: DragStart): LatLng => ({\n  lat: start.lat + (event.clientY - start.y) * DRAG_DEGREES_PER_PIXEL,\n  lng: start.lng + (event.clientX - start.x) * DRAG_DEGREES_PER_PIXEL,\n});\n\n// Shift-drag pans the surface; a plain drag moves the marker.\nexport const useMapPointer = ({\n  interactive,\n  markerPosition,\n  panOffset,\n  onMarkerDrag,\n  setMarkerPosition,\n  setPanOffset,\n}: {\n  interactive: boolean;\n  markerPosition: LatLng;\n  panOffset: { x: number; y: number };\n  onMarkerDrag?: (coords: LatLng) => void;\n  setMarkerPosition: (position: LatLng) => void;\n  setPanOffset: (offset: { x: number; y: number }) => void;\n}) => {\n  const [isDragging, setIsDragging] = useState(false);\n  const [isPanning, setIsPanning] = useState(false);\n  const dragStartRef = useRef<DragStart | null>(null);\n  const panStartRef = useRef<PanStart | null>(null);\n\n  const handleMouseDown = useCallback(\n    (event: React.MouseEvent<HTMLDivElement>) => {\n      if (!interactive) return;\n      const { clientX: x, clientY: y } = event;\n\n      if (isOnMapSurface(event.target as HTMLElement) && event.shiftKey) {\n        setIsPanning(true);\n        panStartRef.current = { x, y, offsetX: panOffset.x, offsetY: panOffset.y };\n        return;\n      }\n\n      setIsDragging(true);\n      dragStartRef.current = { x, y, lat: markerPosition.lat, lng: markerPosition.lng };\n    },\n    [interactive, markerPosition, panOffset],\n  );\n\n  const handleMouseMove = useCallback(\n    (event: React.MouseEvent<HTMLDivElement>) => {\n      const panStart = panStartRef.current;\n      if (isPanning && panStart) {\n        setPanOffset(panTo(event, panStart));\n        return;\n      }\n\n      const dragStart = dragStartRef.current;\n      if (!isDragging || !dragStart) return;\n\n      const position = dragTo(event, dragStart);\n      setMarkerPosition(position);\n      onMarkerDrag?.(position);\n    },\n    [isDragging, isPanning, onMarkerDrag, setMarkerPosition, setPanOffset],\n  );\n\n  const handleMouseUp = useCallback(() => {\n    setIsDragging(false);\n    setIsPanning(false);\n    dragStartRef.current = null;\n    panStartRef.current = null;\n  }, []);\n\n  return { isDragging, isPanning, handleMouseDown, handleMouseMove, handleMouseUp };\n};\n\nexport const useMapSearch = ({\n  zoomTo,\n  setMarkerPosition,\n}: {\n  zoomTo: (zoom: number) => void;\n  setMarkerPosition: (position: LatLng) => void;\n}) => {\n  const [searchValue, setSearchValue] = useState('');\n  const [isSearching, setIsSearching] = useState(false);\n\n  const handleSearch = useCallback(\n    async (event: React.KeyboardEvent<HTMLInputElement>) => {\n      if (event.key !== 'Enter' || !searchValue) return;\n\n      setIsSearching(true);\n      try {\n        const result = await geocode(searchValue);\n        // An unknown place leaves the map where it is; a production build would\n        // surface an error here.\n        if (!result) return;\n\n        setMarkerPosition({ ...result });\n        zoomTo(CITY_ZOOM);\n      } finally {\n        setIsSearching(false);\n      }\n    },\n    [searchValue, zoomTo, setMarkerPosition],\n  );\n\n  return { searchValue, setSearchValue, isSearching, handleSearch };\n};\n\nexport const useMapClick = ({\n  coordinates,\n  interactive,\n  isPanning,\n  onMapClick,\n  onMarkerDrag,\n  setMarkerPosition,\n}: {\n  coordinates: LatLng;\n  interactive: boolean;\n  isPanning: boolean;\n  onMapClick?: (lat: number, lng: number) => void;\n  onMarkerDrag?: (coords: LatLng) => void;\n  setMarkerPosition: (position: LatLng) => void;\n}) =>\n  useCallback(() => {\n    // A pan ends with a click event; that should not also drop a marker.\n    if (isPanning) return;\n\n    // Without a real projection there is nothing to convert a click position\n    // into, so the mock jitters around the centre instead.\n    const coords = {\n      lat: coordinates.lat + (Math.random() - 0.5) * CLICK_JITTER_DEGREES,\n      lng: coordinates.lng + (Math.random() - 0.5) * CLICK_JITTER_DEGREES,\n    };\n\n    onMapClick?.(coords.lat, coords.lng);\n\n    if (interactive && onMarkerDrag) {\n      setMarkerPosition(coords);\n      onMarkerDrag(coords);\n    }\n  }, [coordinates, interactive, isPanning, onMapClick, onMarkerDrag, setMarkerPosition]);\n"],"mappings":"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","names":[]}

package/dist/chunk-4M6CEQVK.js

@@ -0,0 +1,121 @@
+import {
+  TOUCH_TARGET,
+  displayAcrossRail
+} from "./chunk-LIG7TKIB.js";
+
+// src/components/layout/SettingsLayout/SettingsSectionHeader.tsx
+import ChevronLeftIcon from "@mui/icons-material/ChevronLeft";
+import Box from "@mui/material/Box/index.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+var CLIP = {
+  overflow: "hidden",
+  textOverflow: "ellipsis",
+  whiteSpace: "nowrap"
+};
+function HeaderText({
+  title,
+  description
+}) {
+  return /* @__PURE__ */ jsxs(Box, { sx: { minWidth: 0 }, children: [
+    /* @__PURE__ */ jsx(
+      Box,
+      {
+        component: "h2",
+        sx: { m: 0, font: "inherit", fontSize: "1rem", fontWeight: 600, lineHeight: 1.3, ...CLIP },
+        children: title
+      }
+    ),
+    description !== void 0 && description !== "" && /* @__PURE__ */ jsx(
+      Box,
+      {
+        component: "p",
+        sx: {
+          m: 0,
+          font: "inherit",
+          fontSize: "0.8125rem",
+          color: "text.secondary",
+          lineHeight: 1.35,
+          ...CLIP
+        },
+        children: description
+      }
+    )
+  ] });
+}
+function SettingsSectionHeader({
+  href,
+  backLabel,
+  title,
+  description,
+  breakpoint,
+  linkComponent,
+  testIdPrefix
+}) {
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      "data-testid": `${testIdPrefix}-section-header`,
+      sx: (theme) => ({
+        ...displayAcrossRail(theme, breakpoint, "flex", "none"),
+        alignItems: "center",
+        gap: 1.5,
+        minWidth: 0,
+        // ITS OWN SURFACE, not the panel's.
+        //
+        // The header, the chip strip and the first card were all the same
+        // white, so nothing said where "you are here" ended and the screen
+        // began — the eye had only the type sizes to go on. A tint plus the
+        // rule below turns three stacked runs of text into two blocks.
+        //
+        // `paper` against a `default` panel rather than a hand-picked grey, so
+        // it tracks the host's theme (and its dark mode) instead of being a
+        // light-mode constant that goes wrong the moment the palette does.
+        bgcolor: "background.paper",
+        px: 1.5,
+        pt: 1.5,
+        pb: 1.5,
+        mb: 1,
+        borderRadius: 1,
+        // A rule under the header, because what follows it is the sibling strip
+        // — a row of other sections. Without a line the section's own name and
+        // the chip naming a DIFFERENT section sit in one undifferentiated
+        // block, which reads as one navigation rather than as "you are here"
+        // above "go elsewhere".
+        borderBottom: 1,
+        borderColor: "divider"
+      }),
+      children: [
+        /* @__PURE__ */ jsx(
+          Box,
+          {
+            component: linkComponent,
+            href,
+            "aria-label": backLabel,
+            "data-testid": `${testIdPrefix}-back`,
+            sx: (theme) => ({
+              flex: "0 0 auto",
+              display: "inline-flex",
+              alignItems: "center",
+              justifyContent: "center",
+              width: TOUCH_TARGET,
+              height: TOUCH_TARGET,
+              border: 1,
+              borderColor: "divider",
+              borderRadius: 2,
+              color: "text.primary",
+              textDecoration: "none",
+              "&:hover": { backgroundColor: theme.palette.action.hover }
+            }),
+            children: /* @__PURE__ */ jsx(ChevronLeftIcon, { fontSize: "small" })
+          }
+        ),
+        /* @__PURE__ */ jsx(HeaderText, { title, description })
+      ]
+    }
+  );
+}
+
+export {
+  SettingsSectionHeader
+};
+//# sourceMappingURL=chunk-4M6CEQVK.js.map

package/dist/chunk-4M6CEQVK.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/SettingsLayout/SettingsSectionHeader.tsx"],"sourcesContent":["'use client';\n\nimport ChevronLeftIcon from '@mui/icons-material/ChevronLeft';\nimport Box from '@mui/material/Box/index.js';\nimport React from 'react';\n\nimport { displayAcrossRail, TOUCH_TARGET } from './SettingsLayout.styles';\nimport type { SettingsLayoutProps, SettingsRailBreakpoint } from './SettingsLayout.types';\n\n/** One line that must not wrap, whatever the section is called. */\nconst CLIP = {\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  whiteSpace: 'nowrap',\n} as const;\n\n/**\n * The name of where you are, and optionally what it holds.\n *\n * `minWidth: 0` on the wrapper is what lets the clipping work at all: without\n * it a flex item refuses to shrink below its content, so a long section name\n * pushes the back button off the row instead of ellipsising.\n */\nfunction HeaderText({\n  title,\n  description,\n}: {\n  title: string;\n  description?: string;\n}): React.JSX.Element {\n  return (\n    <Box sx={{ minWidth: 0 }}>\n      <Box\n        component=\"h2\"\n        sx={{ m: 0, font: 'inherit', fontSize: '1rem', fontWeight: 600, lineHeight: 1.3, ...CLIP }}\n      >\n        {title}\n      </Box>\n      {description !== undefined && description !== '' && (\n        <Box\n          component=\"p\"\n          sx={{\n            m: 0,\n            font: 'inherit',\n            fontSize: '0.8125rem',\n            color: 'text.secondary',\n            lineHeight: 1.35,\n            ...CLIP,\n          }}\n        >\n          {description}\n        </Box>\n      )}\n    </Box>\n  );\n}\n\n/**\n * The narrow-width panel header: a back control, and the name of where you are.\n *\n * ## Why this replaced a \"‹ Voltar\" link\n *\n * The bare link spent a whole row saying only that a back existed. Under it came\n * the sibling chips and under those the section's own Salvar, so three stacked\n * rows went by before the first field — on the width with the least room for\n * them. Worse, none of the three said WHICH section was open: the chips mark the\n * active one, but a chip strip scrolls, so the answer could be off-screen.\n *\n * Folding the control into a square button beside the title buys back a row and\n * makes the header say where you are, which is what a header is for.\n *\n * ## Narrow only, and mounted at every width\n *\n * `displayAcrossRail` hides this above the breakpoint rather than unmounting it,\n * for the reason the whole component works that way: navigation that exists at\n * one width and not the other is navigation nothing can assert about. Above the\n * breakpoint the rail is on screen with the open row marked, so a back control\n * would point at a list already visible.\n *\n * The button is `TOUCH_TARGET` square because this is the phone shape, and it\n * keeps the accessible name — the visible text is the section, not the verb, so\n * a screen reader still hears \"Voltar\" rather than being handed an icon.\n */\nexport function SettingsSectionHeader({\n  href,\n  backLabel,\n  title,\n  description,\n  breakpoint,\n  linkComponent,\n  testIdPrefix,\n}: {\n  href: string;\n  backLabel: string;\n  title: string;\n  description?: string;\n  breakpoint: SettingsRailBreakpoint;\n  linkComponent: NonNullable<SettingsLayoutProps['linkComponent']>;\n  testIdPrefix: string;\n}): React.JSX.Element {\n  return (\n    <Box\n      data-testid={`${testIdPrefix}-section-header`}\n      sx={(theme) => ({\n        ...displayAcrossRail(theme, breakpoint, 'flex', 'none'),\n        alignItems: 'center',\n        gap: 1.5,\n        minWidth: 0,\n        // ITS OWN SURFACE, not the panel's.\n        //\n        // The header, the chip strip and the first card were all the same\n        // white, so nothing said where \"you are here\" ended and the screen\n        // began — the eye had only the type sizes to go on. A tint plus the\n        // rule below turns three stacked runs of text into two blocks.\n        //\n        // `paper` against a `default` panel rather than a hand-picked grey, so\n        // it tracks the host's theme (and its dark mode) instead of being a\n        // light-mode constant that goes wrong the moment the palette does.\n        bgcolor: 'background.paper',\n        px: 1.5,\n        pt: 1.5,\n        pb: 1.5,\n        mb: 1,\n        borderRadius: 1,\n        // A rule under the header, because what follows it is the sibling strip\n        // — a row of other sections. Without a line the section's own name and\n        // the chip naming a DIFFERENT section sit in one undifferentiated\n        // block, which reads as one navigation rather than as \"you are here\"\n        // above \"go elsewhere\".\n        borderBottom: 1,\n        borderColor: 'divider',\n      })}\n    >\n      <Box\n        component={linkComponent}\n        href={href}\n        aria-label={backLabel}\n        data-testid={`${testIdPrefix}-back`}\n        sx={(theme) => ({\n          flex: '0 0 auto',\n          display: 'inline-flex',\n          alignItems: 'center',\n          justifyContent: 'center',\n          width: TOUCH_TARGET,\n          height: TOUCH_TARGET,\n          border: 1,\n          borderColor: 'divider',\n          borderRadius: 2,\n          color: 'text.primary',\n          textDecoration: 'none',\n          '&:hover': { backgroundColor: theme.palette.action.hover },\n        })}\n      >\n        <ChevronLeftIcon fontSize=\"small\" />\n      </Box>\n\n      <HeaderText title={title} description={description} />\n    </Box>\n  );\n}\n"],"mappings":";;;;;;AAEA,OAAO,qBAAqB;AAC5B,OAAO,SAAS;AA4BZ,SACE,KADF;AArBJ,IAAM,OAAO;AAAA,EACX,UAAU;AAAA,EACV,cAAc;AAAA,EACd,YAAY;AACd;AASA,SAAS,WAAW;AAAA,EAClB;AAAA,EACA;AACF,GAGsB;AACpB,SACE,qBAAC,OAAI,IAAI,EAAE,UAAU,EAAE,GACrB;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,IAAI,EAAE,GAAG,GAAG,MAAM,WAAW,UAAU,QAAQ,YAAY,KAAK,YAAY,KAAK,GAAG,KAAK;AAAA,QAExF;AAAA;AAAA,IACH;AAAA,IACC,gBAAgB,UAAa,gBAAgB,MAC5C;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,IAAI;AAAA,UACF,GAAG;AAAA,UACH,MAAM;AAAA,UACN,UAAU;AAAA,UACV,OAAO;AAAA,UACP,YAAY;AAAA,UACZ,GAAG;AAAA,QACL;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,KAEJ;AAEJ;AA4BO,SAAS,sBAAsB;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAQsB;AACpB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa,GAAG,YAAY;AAAA,MAC5B,IAAI,CAAC,WAAW;AAAA,QACd,GAAG,kBAAkB,OAAO,YAAY,QAAQ,MAAM;AAAA,QACtD,YAAY;AAAA,QACZ,KAAK;AAAA,QACL,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAWV,SAAS;AAAA,QACT,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAMd,cAAc;AAAA,QACd,aAAa;AAAA,MACf;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW;AAAA,YACX;AAAA,YACA,cAAY;AAAA,YACZ,eAAa,GAAG,YAAY;AAAA,YAC5B,IAAI,CAAC,WAAW;AAAA,cACd,MAAM;AAAA,cACN,SAAS;AAAA,cACT,YAAY;AAAA,cACZ,gBAAgB;AAAA,cAChB,OAAO;AAAA,cACP,QAAQ;AAAA,cACR,QAAQ;AAAA,cACR,aAAa;AAAA,cACb,cAAc;AAAA,cACd,OAAO;AAAA,cACP,gBAAgB;AAAA,cAChB,WAAW,EAAE,iBAAiB,MAAM,QAAQ,OAAO,MAAM;AAAA,YAC3D;AAAA,YAEA,8BAAC,mBAAgB,UAAS,SAAQ;AAAA;AAAA,QACpC;AAAA,QAEA,oBAAC,cAAW,OAAc,aAA0B;AAAA;AAAA;AAAA,EACtD;AAEJ;","names":[]}

package/dist/chunk-4N244WVL.js

@@ -0,0 +1 @@
+//# sourceMappingURL=chunk-4N244WVL.js.map

package/dist/chunk-4N244WVL.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/chunk-4NS4PJJH.js

@@ -0,0 +1 @@
+//# sourceMappingURL=chunk-4NS4PJJH.js.map

package/dist/chunk-4NS4PJJH.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/chunk-4OEKIFBC.js

@@ -0,0 +1,50 @@
+// src/components/layout/ScrollArea/ScrollAreaContent.tsx
+import Box from "@mui/material/Box/index.js";
+import { useTheme } from "@mui/material/styles/index.js";
+import React from "react";
+import { Fragment, jsx } from "react/jsx-runtime";
+var EMPTY_MIN_HEIGHT = 200;
+var EmptyState = ({ children }) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      sx: {
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        height: "100%",
+        minHeight: EMPTY_MIN_HEIGHT,
+        color: theme.palette.text.secondary
+      },
+      children
+    }
+  );
+};
+var wantsScrollContainer = (props) => "disableInternalScroll" in props || props.scrollContainerRef !== void 0;
+var ScrollAreaContent = ({
+  children,
+  emptyContent,
+  scrollRef,
+  containerWidth
+}) => {
+  if (!children && emptyContent) return /* @__PURE__ */ jsx(EmptyState, { children: emptyContent });
+  return /* @__PURE__ */ jsx(Fragment, { children: React.Children.map(children, (child) => {
+    if (!React.isValidElement(child)) return child;
+    const childProps = child.props;
+    if (!wantsScrollContainer(childProps)) return child;
+    const enhanced = {
+      scrollContainerRef: scrollRef,
+      disableInternalScroll: true
+    };
+    if (containerWidth > 0 && childProps.width === "100%") {
+      enhanced.width = containerWidth;
+    }
+    return React.cloneElement(child, enhanced);
+  }) });
+};
+
+export {
+  ScrollAreaContent
+};
+//# sourceMappingURL=chunk-4OEKIFBC.js.map

package/dist/chunk-4OEKIFBC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/ScrollArea/ScrollAreaContent.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport { useTheme } from '@mui/material/styles/index.js';\nimport type { FC, ReactNode } from 'react';\nimport React from 'react';\n\nconst EMPTY_MIN_HEIGHT = 200;\n\nconst EmptyState: FC<{ children: ReactNode }> = ({ children }) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        height: '100%',\n        minHeight: EMPTY_MIN_HEIGHT,\n        color: theme.palette.text.secondary,\n      }}\n    >\n      {children}\n    </Box>\n  );\n};\n\n// VirtualList and VirtualGrid scroll themselves by default. When one is nested\n// here that would mean two scrollers, so they are handed this container instead\n// and told to stop scrolling internally. They are recognised by the props they\n// accept rather than by identity, so a wrapper around one still works.\nconst wantsScrollContainer = (props: Record<string, unknown>): boolean =>\n  'disableInternalScroll' in props || props.scrollContainerRef !== undefined;\n\nexport interface ScrollAreaContentProps {\n  children: ReactNode;\n  emptyContent?: ReactNode;\n  scrollRef: React.RefObject<HTMLDivElement | null> | ((node: HTMLDivElement | null) => void);\n  containerWidth: number;\n}\n\nexport const ScrollAreaContent: FC<ScrollAreaContentProps> = ({\n  children,\n  emptyContent,\n  scrollRef,\n  containerWidth,\n}) => {\n  if (!children && emptyContent) return <EmptyState>{emptyContent}</EmptyState>;\n\n  return (\n    <>\n      {React.Children.map(children, (child) => {\n        if (!React.isValidElement(child)) return child;\n\n        const childProps = child.props as Record<string, unknown>;\n        if (!wantsScrollContainer(childProps)) return child;\n\n        const enhanced: Record<string, unknown> = {\n          scrollContainerRef: scrollRef,\n          disableInternalScroll: true,\n        };\n\n        // Only fill in a measured width where the child is still at its default.\n        if (containerWidth > 0 && childProps.width === '100%') {\n          enhanced.width = containerWidth;\n        }\n\n        return React.cloneElement(child, enhanced);\n      })}\n    </>\n  );\n};\n"],"mappings":";AAAA,OAAO,SAAS;AAChB,SAAS,gBAAgB;AAEzB,OAAO,WAAW;AAQd,SAsCA,UAtCA;AANJ,IAAM,mBAAmB;AAEzB,IAAM,aAA0C,CAAC,EAAE,SAAS,MAAM;AAChE,QAAM,QAAQ,SAAS;AAEvB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,IAAI;AAAA,QACF,SAAS;AAAA,QACT,YAAY;AAAA,QACZ,gBAAgB;AAAA,QAChB,QAAQ;AAAA,QACR,WAAW;AAAA,QACX,OAAO,MAAM,QAAQ,KAAK;AAAA,MAC5B;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;AAMA,IAAM,uBAAuB,CAAC,UAC5B,2BAA2B,SAAS,MAAM,uBAAuB;AAS5D,IAAM,oBAAgD,CAAC;AAAA,EAC5D;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,MAAI,CAAC,YAAY,aAAc,QAAO,oBAAC,cAAY,wBAAa;AAEhE,SACE,gCACG,gBAAM,SAAS,IAAI,UAAU,CAAC,UAAU;AACvC,QAAI,CAAC,MAAM,eAAe,KAAK,EAAG,QAAO;AAEzC,UAAM,aAAa,MAAM;AACzB,QAAI,CAAC,qBAAqB,UAAU,EAAG,QAAO;AAE9C,UAAM,WAAoC;AAAA,MACxC,oBAAoB;AAAA,MACpB,uBAAuB;AAAA,IACzB;AAGA,QAAI,iBAAiB,KAAK,WAAW,UAAU,QAAQ;AACrD,eAAS,QAAQ;AAAA,IACnB;AAEA,WAAO,MAAM,aAAa,OAAO,QAAQ;AAAA,EAC3C,CAAC,GACH;AAEJ;","names":[]}

package/dist/chunk-4PJ52YBO.js

@@ -0,0 +1 @@
+//# sourceMappingURL=chunk-4PJ52YBO.js.map

package/dist/chunk-4PJ52YBO.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/chunk-4Q7HWRR2.js

@@ -0,0 +1,220 @@
+import {
+  badgeVariantStyles
+} from "./chunk-3HWL4AW4.js";
+import {
+  bounceAnimation,
+  fadeInScaleAnimation,
+  glowPulseAnimation,
+  pulseAnimation,
+  shimmerAnimation
+} from "./chunk-HKFMPEXJ.js";
+
+// src/components/data-display/Badge/Badge.styles.ts
+import { alpha } from "@mui/material/styles/index.js";
+var getColorFromTheme = (theme, color) => {
+  const colorMap = {
+    primary: theme.palette.primary,
+    secondary: theme.palette.secondary,
+    success: theme.palette.success,
+    warning: theme.palette.warning,
+    info: theme.palette.info,
+    // `danger`, the house word the prop actually takes. Keyed on MUI's `error`
+    // it matched nothing and fell through to the default.
+    danger: theme.palette.error,
+    neutral: {
+      main: theme.palette.grey[600],
+      light: theme.palette.grey[400],
+      dark: theme.palette.grey[800],
+      contrastText: theme.palette.getContrastText(theme.palette.grey[600])
+    }
+  };
+  return colorMap[color] || theme.palette.primary;
+};
+var getSizeStyles = (size) => {
+  const sizeMap = {
+    xs: {
+      minWidth: 14,
+      height: 14,
+      fontSize: "0.5rem",
+      padding: "0 3px",
+      dotSize: 6,
+      iconSize: "0.625rem"
+    },
+    sm: {
+      minWidth: 16,
+      height: 16,
+      fontSize: "0.625rem",
+      padding: "0 4px",
+      dotSize: 8,
+      iconSize: "0.75rem"
+    },
+    md: {
+      minWidth: 20,
+      height: 20,
+      fontSize: "0.75rem",
+      padding: "0 6px",
+      dotSize: 10,
+      iconSize: "0.875rem"
+    },
+    lg: {
+      minWidth: 24,
+      height: 24,
+      fontSize: "0.875rem",
+      padding: "0 8px",
+      dotSize: 12,
+      iconSize: "1rem"
+    },
+    xl: {
+      minWidth: 28,
+      height: 28,
+      fontSize: "1rem",
+      padding: "0 10px",
+      dotSize: 14,
+      iconSize: "1.125rem"
+    }
+  };
+  return sizeMap[size] || sizeMap.md;
+};
+var getAnchorOrigin = (position) => {
+  const positionMap = {
+    "top-right": { vertical: "top", horizontal: "right" },
+    "top-left": { vertical: "top", horizontal: "left" },
+    "bottom-right": { vertical: "bottom", horizontal: "right" },
+    "bottom-left": { vertical: "bottom", horizontal: "left" }
+  };
+  return positionMap[position] || positionMap["top-right"];
+};
+var rgbValuesOf = (color) => {
+  if (color.startsWith("#")) {
+    const hex = color.slice(1);
+    const [r, g, b] = [0, 2, 4].map((offset) => parseInt(hex.slice(offset, offset + 2), 16));
+    return `${r}, ${g}, ${b}`;
+  }
+  const match = color.match(/\d+/g);
+  if (match) return `${match[0]}, ${match[1]}, ${match[2]}`;
+  return "255, 255, 255";
+};
+var badgeLightingStyles = ({
+  glow,
+  pulse,
+  colorPalette
+}) => ({
+  // Glow effect
+  ...glow && !pulse && {
+    boxShadow: `0 0 15px 3px ${alpha(colorPalette.main, 0.5)}`,
+    filter: "brightness(1.1)",
+    "&:hover": {
+      boxShadow: `0 0 20px 4px ${alpha(colorPalette.main, 0.6)}`
+    }
+  },
+  // Pulse animation
+  ...pulse && !glow && {
+    animation: `${pulseAnimation} 2s ease-in-out infinite`
+  },
+  // Both glow and pulse
+  ...glow && pulse && {
+    animation: `${glowPulseAnimation} 2s ease-in-out infinite, ${pulseAnimation} 2s ease-in-out infinite`,
+    filter: "brightness(1.1)"
+  }
+});
+var badgeAnimationStyles = ({
+  animate,
+  bounce,
+  shimmer,
+  glow: _glow,
+  pulse: _pulse,
+  customVariant,
+  colorPalette,
+  theme
+}) => ({
+  ...animate && !bounce && {
+    animation: `${fadeInScaleAnimation} 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55)`
+  },
+  // Bounce animation
+  ...bounce && {
+    animation: `${bounceAnimation} 1s ease-in-out`
+  },
+  // Shimmer effect
+  ...shimmer && {
+    background: customVariant === "gradient" ? `linear-gradient(135deg, ${colorPalette.main} 0%, ${colorPalette.dark || colorPalette.main} 100%)` : colorPalette.main,
+    backgroundSize: shimmer ? "1000px 100%" : "auto",
+    position: "relative",
+    overflow: "hidden",
+    "&::after": {
+      content: '""',
+      position: "absolute",
+      top: 0,
+      left: 0,
+      width: "100%",
+      height: "100%",
+      background: `linear-gradient(
+            90deg,
+            transparent,
+            ${alpha(theme.palette.common.white, 0.4)},
+            transparent
+          )`,
+      animation: `${shimmerAnimation} 3s infinite`
+    }
+  }
+});
+var badgeStyles = ({
+  theme,
+  customVariant,
+  customSize = "md",
+  customColor = "primary",
+  glow,
+  pulse,
+  animate,
+  shimmer,
+  bounce,
+  hasIcon
+}) => {
+  const colorPalette = getColorFromTheme(theme, customColor);
+  const sizeStyles = getSizeStyles(customSize);
+  return {
+    "--glow-color": rgbValuesOf(colorPalette.main),
+    "& .MuiBadge-badge": {
+      transition: "all 0.3s cubic-bezier(0.4, 0, 0.2, 1)",
+      fontWeight: 600,
+      border: `2px solid ${theme.palette.background.paper}`,
+      letterSpacing: "0.025em",
+      textTransform: customVariant === "gradient" || customVariant === "glass" ? "uppercase" : "none",
+      willChange: "transform, opacity",
+      backfaceVisibility: "hidden",
+      // Outline variant
+      // Destructive variant
+      // Warning variant
+      // Adjust padding when icon is present
+      ...badgeVariantStyles(theme, colorPalette, sizeStyles, customVariant),
+      ...hasIcon && {
+        paddingLeft: sizeStyles.padding.split(" ")[1],
+        display: "inline-flex",
+        alignItems: "center",
+        gap: "2px"
+      },
+      // Animation on mount
+      ...badgeAnimationStyles({
+        animate,
+        bounce,
+        shimmer,
+        glow,
+        pulse,
+        customVariant,
+        colorPalette,
+        theme
+      }),
+      ...badgeLightingStyles({ glow, pulse, colorPalette }),
+      "&:not(.MuiBadge-dot):hover": {
+        transform: "scale(1.1)",
+        zIndex: 1
+      }
+    }
+  };
+};
+
+export {
+  getSizeStyles,
+  getAnchorOrigin,
+  badgeStyles
+};
+//# sourceMappingURL=chunk-4Q7HWRR2.js.map

package/dist/chunk-4Q7HWRR2.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Badge/Badge.styles.ts"],"sourcesContent":["import { alpha } from '@mui/material/styles/index.js';\nimport type { CSSObject, Theme } from '@mui/material/styles/index.js';\n\nimport {\n  bounceAnimation,\n  fadeInScaleAnimation,\n  glowPulseAnimation,\n  pulseAnimation,\n  shimmerAnimation } from './Badge.animations';\nimport { badgeVariantStyles } from './Badge.variants';\nimport type { BadgeSize, BadgeVariant } from './Badge.types';\n\nexport type BadgePalette = {\n  main: string;\n  light?: string;\n  dark?: string;\n  contrastText?: string;\n};\nexport type BadgeSizeStyles = ReturnType<typeof getSizeStyles>;\n\nconst getColorFromTheme = (theme: Theme, color: string) => {\n  const colorMap: Record<string, ReturnType<typeof theme.palette.augmentColor>> = {\n    primary: theme.palette.primary,\n    secondary: theme.palette.secondary,\n    success: theme.palette.success,\n    warning: theme.palette.warning,\n    info: theme.palette.info,\n    // `danger`, the house word the prop actually takes. Keyed on MUI's `error`\n    // it matched nothing and fell through to the default.\n    danger: theme.palette.error,\n    neutral: {\n      main: theme.palette.grey[600],\n      light: theme.palette.grey[400],\n      dark: theme.palette.grey[800],\n      contrastText: theme.palette.getContrastText(theme.palette.grey[600]) } };\n\n  return colorMap[color] || theme.palette.primary;\n};\n\nexport const getSizeStyles = (size: BadgeSize) => {\n  const sizeMap: Record<\n    BadgeSize,\n    {\n      minWidth: number;\n      height: number;\n      fontSize: string;\n      padding: string;\n      dotSize: number;\n      iconSize: string;\n    }\n  > = {\n    xs: {\n      minWidth: 14,\n      height: 14,\n      fontSize: '0.5rem',\n      padding: '0 3px',\n      dotSize: 6,\n      iconSize: '0.625rem' },\n    sm: {\n      minWidth: 16,\n      height: 16,\n      fontSize: '0.625rem',\n      padding: '0 4px',\n      dotSize: 8,\n      iconSize: '0.75rem' },\n    md: {\n      minWidth: 20,\n      height: 20,\n      fontSize: '0.75rem',\n      padding: '0 6px',\n      dotSize: 10,\n      iconSize: '0.875rem' },\n    lg: {\n      minWidth: 24,\n      height: 24,\n      fontSize: '0.875rem',\n      padding: '0 8px',\n      dotSize: 12,\n      iconSize: '1rem' },\n    xl: {\n      minWidth: 28,\n      height: 28,\n      fontSize: '1rem',\n      padding: '0 10px',\n      dotSize: 14,\n      iconSize: '1.125rem' } };\n\n  return sizeMap[size] || sizeMap.md;\n};\n\nexport const getAnchorOrigin = (position: string) => {\n  const positionMap: Record<string, { vertical: 'top' | 'bottom'; horizontal: 'left' | 'right' }> =\n    {\n      'top-right': { vertical: 'top', horizontal: 'right' },\n      'top-left': { vertical: 'top', horizontal: 'left' },\n      'bottom-right': { vertical: 'bottom', horizontal: 'right' },\n      'bottom-left': { vertical: 'bottom', horizontal: 'left' } };\n\n  return positionMap[position] || positionMap['top-right'];\n};\n\n// Exactly one variant applies, so a lookup replaces ten mutually exclusive\n// spreads inside the style object.\n// The glow effect needs the badge colour as bare RGB components for a CSS\n// variable, and the palette hands them over as hex or rgb().\nconst rgbValuesOf = (color: string): string => {\n  if (color.startsWith('#')) {\n    const hex = color.slice(1);\n    const [r, g, b] = [0, 2, 4].map((offset) => parseInt(hex.slice(offset, offset + 2), 16));\n    return `${r}, ${g}, ${b}`;\n  }\n\n  const match = color.match(/\\d+/g);\n  if (match) return `${match[0]}, ${match[1]}, ${match[2]}`;\n  return '255, 255, 255';\n};\n\n// Glow and pulse combine into a third, distinct treatment rather than stacking.\nconst badgeLightingStyles = ({\n  glow,\n  pulse,\n  colorPalette }: {\n  glow?: boolean;\n  pulse?: boolean;\n  colorPalette: BadgePalette;\n}): CSSObject => ({\n      // Glow effect\n      ...(glow &&\n        !pulse && {\n          boxShadow: `0 0 15px 3px ${alpha(colorPalette.main, 0.5)}`,\n          filter: 'brightness(1.1)',\n          '&:hover': {\n            boxShadow: `0 0 20px 4px ${alpha(colorPalette.main, 0.6)}` } }),\n\n      // Pulse animation\n      ...(pulse &&\n        !glow && {\n          animation: `${pulseAnimation} 2s ease-in-out infinite` }),\n\n      // Both glow and pulse\n      ...(glow &&\n        pulse && {\n          animation: `${glowPulseAnimation} 2s ease-in-out infinite, ${pulseAnimation} 2s ease-in-out infinite`,\n          filter: 'brightness(1.1)',\n        }),\n\n});\n\nconst badgeAnimationStyles = ({\n  animate,\n  bounce,\n  shimmer,\n  glow: _glow,\n  pulse: _pulse,\n  customVariant,\n  colorPalette,\n  theme }: {\n  animate?: boolean;\n  bounce?: boolean;\n  shimmer?: boolean;\n  glow?: boolean;\n  pulse?: boolean;\n  customVariant?: BadgeVariant;\n  colorPalette: BadgePalette;\n  theme: Theme;\n}): CSSObject => ({\n      ...(animate &&\n        !bounce && {\n          animation: `${fadeInScaleAnimation} 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55)` }),\n\n      // Bounce animation\n      ...(bounce && {\n        animation: `${bounceAnimation} 1s ease-in-out` }),\n\n      // Shimmer effect\n      ...(shimmer && {\n        background:\n          customVariant === 'gradient'\n            ? `linear-gradient(135deg, ${colorPalette.main} 0%, ${colorPalette.dark || colorPalette.main} 100%)`\n            : colorPalette.main,\n        backgroundSize: shimmer ? '1000px 100%' : 'auto',\n        position: 'relative',\n        overflow: 'hidden',\n        '&::after': {\n          content: '\"\"',\n          position: 'absolute',\n          top: 0,\n          left: 0,\n          width: '100%',\n          height: '100%',\n          background: `linear-gradient(\n            90deg,\n            transparent,\n            ${alpha(theme.palette.common.white, 0.4)},\n            transparent\n          )`,\n          animation: `${shimmerAnimation} 3s infinite` } }) });\n\n// The badge chip's own styling, lifted out so the styled() callback just\n// forwards its props.\ninterface BadgeStyleArgs {\n  theme: Theme;\n  customVariant?: BadgeVariant;\n  customSize?: BadgeSize;\n  customColor?: string;\n  glow?: boolean;\n  pulse?: boolean;\n  animate?: boolean;\n  shimmer?: boolean;\n  bounce?: boolean;\n  hasIcon?: boolean;\n}\n\nexport const badgeStyles = ({\n  theme,\n  customVariant,\n  customSize = 'md',\n  customColor = 'primary',\n  glow,\n  pulse,\n  animate,\n  shimmer,\n  bounce,\n  hasIcon }: BadgeStyleArgs): CSSObject => {\n  const colorPalette = getColorFromTheme(theme, customColor);\n  const sizeStyles = getSizeStyles(customSize);\n\n  return {\n    '--glow-color': rgbValuesOf(colorPalette.main),\n    '& .MuiBadge-badge': {\n      transition: 'all 0.3s cubic-bezier(0.4, 0, 0.2, 1)',\n      fontWeight: 600,\n      border: `2px solid ${theme.palette.background.paper}`,\n      letterSpacing: '0.025em',\n      textTransform:\n        customVariant === 'gradient' || customVariant === 'glass' ? 'uppercase' : 'none',\n      willChange: 'transform, opacity',\n      backfaceVisibility: 'hidden',\n\n      // Outline variant\n\n      // Destructive variant\n\n      // Warning variant\n\n      // Adjust padding when icon is present\n      ...badgeVariantStyles(theme, colorPalette, sizeStyles, customVariant),\n      ...(hasIcon && {\n        paddingLeft: sizeStyles.padding.split(' ')[1],\n        display: 'inline-flex',\n        alignItems: 'center',\n        gap: '2px',\n      }),\n\n      // Animation on mount\n      ...badgeAnimationStyles({\n        animate,\n        bounce,\n        shimmer,\n        glow,\n        pulse,\n        customVariant,\n        colorPalette,\n        theme }),\n      ...badgeLightingStyles({ glow, pulse, colorPalette }),\n\n      '&:not(.MuiBadge-dot):hover': {\n        transform: 'scale(1.1)',\n        zIndex: 1 } } };\n}\n"],"mappings":"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","names":[]}

package/dist/chunk-4QQVIGRG.js

@@ -0,0 +1,55 @@
+import {
+  buildGridColumns,
+  buildRowActionsColumn,
+  isActionsColumn
+} from "./chunk-5VZPVDUF.js";
+
+// src/components/data-display/DataViews/data-views-columns.ts
+import { useMemo } from "react";
+function computeHideableColumns(columns) {
+  return columns.filter((col) => col.hideable !== false && typeof col.header === "string" && col.header !== "").map((col) => ({ id: col.id, label: col.header }));
+}
+function appendActionsColumn(columns, opts) {
+  const { rowActions, rowActionsLeading, renderRowMenu, testIdPrefix, getRowId } = opts;
+  if (!rowActions && !renderRowMenu || columns.some(isActionsColumn)) return columns;
+  return [
+    ...columns,
+    buildRowActionsColumn({
+      rowActions: rowActions ?? [],
+      leading: rowActionsLeading,
+      testIdPrefix,
+      getRowId,
+      renderRowMenu
+    })
+  ];
+}
+function useColumnsWithActions(columns, opts) {
+  const { rowActions, rowActionsLeading, renderRowMenu, testIdPrefix, getRowId } = opts;
+  const columnsWithActions = useMemo(
+    () => appendActionsColumn(columns, { rowActions, rowActionsLeading, renderRowMenu, testIdPrefix, getRowId }),
+    [columns, rowActions, rowActionsLeading, renderRowMenu, testIdPrefix, getRowId]
+  );
+  const allColumnIds = useMemo(() => columnsWithActions.map((col) => col.id), [columnsWithActions]);
+  return { columnsWithActions, allColumnIds };
+}
+function applyOrder(columns, order) {
+  if (!order || order.length === 0) return columns;
+  const byId = new Map(columns.map((column) => [column.id, column]));
+  const ordered = order.map((id) => byId.get(id)).filter((c) => Boolean(c));
+  const seen = new Set(ordered.map((column) => column.id));
+  return [...ordered, ...columns.filter((column) => !seen.has(column.id))];
+}
+function useRenderedColumns(columnsWithActions, visibleColumns, onRowClick, order) {
+  const gridColumns = useMemo(
+    () => buildGridColumns(applyOrder(columnsWithActions, order), visibleColumns, onRowClick),
+    [columnsWithActions, onRowClick, visibleColumns, order]
+  );
+  const hideableColumns = useMemo(() => computeHideableColumns(columnsWithActions), [columnsWithActions]);
+  return { gridColumns, hideableColumns };
+}
+
+export {
+  useColumnsWithActions,
+  useRenderedColumns
+};
+//# sourceMappingURL=chunk-4QQVIGRG.js.map

package/dist/chunk-4QQVIGRG.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/DataViews/data-views-columns.ts"],"sourcesContent":["\"use client\";\n\nimport { useMemo } from \"react\";\n\nimport { type GridColumn } from \"../DataGrid\";\n\nimport {\n  buildGridColumns,\n  buildRowActionsColumn,\n  isActionsColumn,\n} from \"./data-views-grid-helpers\";\nimport type { DataViewColumn, RowAction } from \"./data-views-types\";\n\n/**\n * Every column derivation the DataViews grid needs, in one place: the auto kebab\n * actions column, the id list that seeds a pristine view state, what the grid\n * actually renders once visibility is applied, and the show/hide menu's list.\n */\n\n/** A column the user may show/hide via the toolbar's ColumnsMenu. */\nexport interface HideableColumn {\n  id: string;\n  label: string;\n}\n\n/**\n * The columns the user may show/hide: explicitly hideable (not `hideable:false`,\n * which marks structural columns like the image thumbnail or actions kebab) and\n * carrying a text header to label the checkbox.\n */\nfunction computeHideableColumns<T extends Record<string, unknown>>(\n  columns: DataViewColumn<T>[],\n): HideableColumn[] {\n  return columns\n    .filter((col) => col.hideable !== false && typeof col.header === \"string\" && col.header !== \"\")\n    .map((col) => ({ id: col.id, label: col.header as string }));\n}\n\n/**\n * Append the auto kebab actions column unless the page already defines one. The\n * column is added when there are `rowActions` OR a bespoke `renderRowMenu` (an\n * entity's self-contained menu that owns its own popups).\n */\nfunction appendActionsColumn<T extends Record<string, unknown>>(\n  columns: DataViewColumn<T>[],\n  opts: {\n    rowActions?: RowAction<T>[];\n    rowActionsLeading?: (row: T) => React.ReactNode;\n    renderRowMenu?: (row: T) => React.ReactNode;\n    testIdPrefix: string;\n    getRowId: (row: T) => string | number;\n  },\n): DataViewColumn<T>[] {\n  const { rowActions, rowActionsLeading, renderRowMenu, testIdPrefix, getRowId } = opts;\n  if ((!rowActions && !renderRowMenu) || columns.some(isActionsColumn)) return columns;\n  return [\n    ...columns,\n    buildRowActionsColumn({\n      rowActions: rowActions ?? [],\n      leading: rowActionsLeading,\n      testIdPrefix,\n      getRowId,\n      renderRowMenu,\n    }),\n  ];\n}\n\n/** Options {@link appendActionsColumn} needs to build the auto kebab column. */\ntype ActionsColumnOpts<T extends Record<string, unknown>> = {\n  rowActions?: RowAction<T>[];\n  rowActionsLeading?: (row: T) => React.ReactNode;\n  renderRowMenu?: (row: T) => React.ReactNode;\n  testIdPrefix: string;\n  getRowId: (row: T) => string | number;\n};\n\n/**\n * The declared columns plus the auto kebab column (unless the page defines its\n * own), and every column id — which is what seeds a pristine view state's\n * `visibleColumns`, so it is derived BEFORE the state exists.\n */\nexport function useColumnsWithActions<T extends Record<string, unknown>>(\n  columns: DataViewColumn<T>[],\n  opts: ActionsColumnOpts<T>,\n): { columnsWithActions: DataViewColumn<T>[]; allColumnIds: string[] } {\n  const { rowActions, rowActionsLeading, renderRowMenu, testIdPrefix, getRowId } = opts;\n  const columnsWithActions = useMemo(\n    () =>\n      appendActionsColumn(columns, { rowActions, rowActionsLeading, renderRowMenu, testIdPrefix, getRowId }),\n    [columns, rowActions, rowActionsLeading, renderRowMenu, testIdPrefix, getRowId],\n  );\n  const allColumnIds = useMemo(() => columnsWithActions.map((col) => col.id), [columnsWithActions]);\n  return { columnsWithActions, allColumnIds };\n}\n\n/**\n * Apply a stored column ORDER, tolerantly.\n *\n * A stored list goes stale in both directions and neither may lose a column: an\n * id the table no longer declares is dropped, and a column the table declares\n * but the list never mentioned (added since the view was saved) falls in AFTER\n * the ordered ones rather than vanishing. Absent order ⇒ declaration order.\n */\nfunction applyOrder<T extends Record<string, unknown>>(\n  columns: DataViewColumn<T>[],\n  order: string[] | undefined,\n): DataViewColumn<T>[] {\n  if (!order || order.length === 0) return columns;\n  const byId = new Map(columns.map((column) => [column.id, column]));\n  const ordered = order.map((id) => byId.get(id)).filter((c): c is DataViewColumn<T> => Boolean(c));\n  const seen = new Set(ordered.map((column) => column.id));\n  return [...ordered, ...columns.filter((column) => !seen.has(column.id))];\n}\n\n/** What the grid actually renders: order + visibility applied, plus the menu's list. */\nexport function useRenderedColumns<T extends Record<string, unknown>>(\n  columnsWithActions: DataViewColumn<T>[],\n  visibleColumns: string[],\n  onRowClick: ((row: T) => void) | undefined,\n  order?: string[],\n): { gridColumns: GridColumn<T>[]; hideableColumns: HideableColumn[] } {\n  const gridColumns = useMemo(\n    () => buildGridColumns(applyOrder(columnsWithActions, order), visibleColumns, onRowClick),\n    [columnsWithActions, onRowClick, visibleColumns, order],\n  );\n  const hideableColumns = useMemo(() => computeHideableColumns(columnsWithActions), [columnsWithActions]);\n  return { gridColumns, hideableColumns };\n}\n\n"],"mappings":";;;;;;;AAEA,SAAS,eAAe;AA4BxB,SAAS,uBACP,SACkB;AAClB,SAAO,QACJ,OAAO,CAAC,QAAQ,IAAI,aAAa,SAAS,OAAO,IAAI,WAAW,YAAY,IAAI,WAAW,EAAE,EAC7F,IAAI,CAAC,SAAS,EAAE,IAAI,IAAI,IAAI,OAAO,IAAI,OAAiB,EAAE;AAC/D;AAOA,SAAS,oBACP,SACA,MAOqB;AACrB,QAAM,EAAE,YAAY,mBAAmB,eAAe,cAAc,SAAS,IAAI;AACjF,MAAK,CAAC,cAAc,CAAC,iBAAkB,QAAQ,KAAK,eAAe,EAAG,QAAO;AAC7E,SAAO;AAAA,IACL,GAAG;AAAA,IACH,sBAAsB;AAAA,MACpB,YAAY,cAAc,CAAC;AAAA,MAC3B,SAAS;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAAA,EACH;AACF;AAgBO,SAAS,sBACd,SACA,MACqE;AACrE,QAAM,EAAE,YAAY,mBAAmB,eAAe,cAAc,SAAS,IAAI;AACjF,QAAM,qBAAqB;AAAA,IACzB,MACE,oBAAoB,SAAS,EAAE,YAAY,mBAAmB,eAAe,cAAc,SAAS,CAAC;AAAA,IACvG,CAAC,SAAS,YAAY,mBAAmB,eAAe,cAAc,QAAQ;AAAA,EAChF;AACA,QAAM,eAAe,QAAQ,MAAM,mBAAmB,IAAI,CAAC,QAAQ,IAAI,EAAE,GAAG,CAAC,kBAAkB,CAAC;AAChG,SAAO,EAAE,oBAAoB,aAAa;AAC5C;AAUA,SAAS,WACP,SACA,OACqB;AACrB,MAAI,CAAC,SAAS,MAAM,WAAW,EAAG,QAAO;AACzC,QAAM,OAAO,IAAI,IAAI,QAAQ,IAAI,CAAC,WAAW,CAAC,OAAO,IAAI,MAAM,CAAC,CAAC;AACjE,QAAM,UAAU,MAAM,IAAI,CAAC,OAAO,KAAK,IAAI,EAAE,CAAC,EAAE,OAAO,CAAC,MAA8B,QAAQ,CAAC,CAAC;AAChG,QAAM,OAAO,IAAI,IAAI,QAAQ,IAAI,CAAC,WAAW,OAAO,EAAE,CAAC;AACvD,SAAO,CAAC,GAAG,SAAS,GAAG,QAAQ,OAAO,CAAC,WAAW,CAAC,KAAK,IAAI,OAAO,EAAE,CAAC,CAAC;AACzE;AAGO,SAAS,mBACd,oBACA,gBACA,YACA,OACqE;AACrE,QAAM,cAAc;AAAA,IAClB,MAAM,iBAAiB,WAAW,oBAAoB,KAAK,GAAG,gBAAgB,UAAU;AAAA,IACxF,CAAC,oBAAoB,YAAY,gBAAgB,KAAK;AAAA,EACxD;AACA,QAAM,kBAAkB,QAAQ,MAAM,uBAAuB,kBAAkB,GAAG,CAAC,kBAAkB,CAAC;AACtG,SAAO,EAAE,aAAa,gBAAgB;AACxC;","names":[]}