@12-apps/ui 6.11.1 → 6.12.0

package/dist/chunk-A43SJQYE.js

@@ -0,0 +1,208 @@
+import {
+  DashboardAction,
+  DashboardExport,
+  DashboardFilterToggle,
+  DashboardInfo,
+  DashboardSettings,
+  DashboardSpacer
+} from "./chunk-FLSSV4TH.js";
+import {
+  DashboardContext,
+  useDashboardContext
+} from "./chunk-CUMSPE6B.js";
+
+// src/components/layout/Dashboard/Dashboard.tsx
+import ExpandLessIcon from "@mui/icons-material/ExpandLess";
+import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
+import FilterIcon from "@mui/icons-material/FilterListRounded";
+import NavigateNextIcon from "@mui/icons-material/NavigateNext";
+import Box from "@mui/material/Box/index.js";
+import MuiBreadcrumbs from "@mui/material/Breadcrumbs/index.js";
+import Button from "@mui/material/Button/index.js";
+import Collapse from "@mui/material/Collapse/index.js";
+import MuiLink from "@mui/material/Link/index.js";
+import Typography from "@mui/material/Typography/index.js";
+import { styled } from "@mui/material/styles/index.js";
+import React, { useMemo, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var SLOT_ORDER = ["breadcrumb", "header", "filters", "body"];
+function markDashboardSlot(component, slot) {
+  component.dashboardSlot = slot;
+  return component;
+}
+var Root = styled(Box)(({ theme }) => ({
+  display: "flex",
+  flexDirection: "column",
+  gap: theme.spacing(2),
+  width: "100%"
+}));
+function slotRank(node) {
+  if (React.isValidElement(node)) {
+    const slot = node.type.dashboardSlot;
+    if (slot) {
+      const rank = SLOT_ORDER.indexOf(slot);
+      if (rank >= 0) {
+        return rank;
+      }
+    }
+  }
+  return SLOT_ORDER.length;
+}
+var Dashboard = ({
+  children,
+  defaultFiltersVisible = true,
+  activeFilterCount = 0,
+  testIdPrefix = "dashboard",
+  className
+}) => {
+  const [filtersVisible, setFiltersVisible] = useState(defaultFiltersVisible);
+  const [moreFiltersOpen, setMoreFiltersOpen] = useState(false);
+  const value = useMemo(
+    () => ({
+      filtersVisible,
+      toggleFilters: () => setFiltersVisible((v) => !v),
+      moreFiltersOpen,
+      toggleMoreFilters: () => setMoreFiltersOpen((v) => !v),
+      activeFilterCount,
+      testIdPrefix
+    }),
+    [filtersVisible, moreFiltersOpen, activeFilterCount, testIdPrefix]
+  );
+  const ordered = useMemo(() => {
+    const arr = React.Children.toArray(children);
+    return arr.map((node, index) => ({ node, index, rank: slotRank(node) })).sort((a, b) => a.rank === b.rank ? a.index - b.index : a.rank - b.rank).map((entry) => entry.node);
+  }, [children]);
+  return /* @__PURE__ */ jsx(DashboardContext.Provider, { value, children: /* @__PURE__ */ jsx(Root, { className, "data-testid": testIdPrefix, children: ordered }) });
+};
+Dashboard.displayName = "Dashboard";
+var DashboardBreadcrumb = ({
+  items,
+  renderLink,
+  className
+}) => {
+  const { testIdPrefix } = useDashboardContext();
+  return /* @__PURE__ */ jsx(
+    MuiBreadcrumbs,
+    {
+      separator: /* @__PURE__ */ jsx(NavigateNextIcon, { fontSize: "small" }),
+      className,
+      "aria-label": "breadcrumb",
+      "data-testid": `${testIdPrefix}-breadcrumb`,
+      sx: { fontSize: "0.875rem", color: "text.secondary" },
+      children: items.map((item, index) => {
+        const isLast = index === items.length - 1;
+        if (isLast || !item.href) {
+          return /* @__PURE__ */ jsx(
+            Typography,
+            {
+              component: "span",
+              sx: { fontSize: "0.875rem", color: isLast ? "text.primary" : "text.secondary" },
+              "aria-current": isLast ? "page" : void 0,
+              children: item.label
+            },
+            `${item.label}-${index}`
+          );
+        }
+        const linkContent = item.label;
+        if (renderLink) {
+          return /* @__PURE__ */ jsx(React.Fragment, { children: renderLink(item, linkContent) }, `${item.label}-${index}`);
+        }
+        return /* @__PURE__ */ jsx(
+          MuiLink,
+          {
+            href: item.href,
+            underline: "hover",
+            color: "inherit",
+            sx: { fontSize: "0.875rem" },
+            children: linkContent
+          },
+          `${item.label}-${index}`
+        );
+      })
+    }
+  );
+};
+DashboardBreadcrumb.displayName = "Dashboard.Breadcrumb";
+DashboardBreadcrumb.dashboardSlot = "breadcrumb";
+var DashboardHeader = ({ title, children, className }) => {
+  const { testIdPrefix } = useDashboardContext();
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      className,
+      "data-testid": `${testIdPrefix}-header`,
+      sx: { display: "flex", alignItems: "center", gap: 1, flexWrap: "wrap", minHeight: 40 },
+      children: [
+        /* @__PURE__ */ jsx(Typography, { variant: "h5", component: "h1", sx: { fontWeight: 600, mr: 0.5 }, children: title }),
+        children
+      ]
+    }
+  );
+};
+DashboardHeader.displayName = "Dashboard.Header";
+DashboardHeader.dashboardSlot = "header";
+var DashboardFilters = ({ children, className }) => {
+  const { filtersVisible, testIdPrefix } = useDashboardContext();
+  return /* @__PURE__ */ jsx(Collapse, { in: filtersVisible, unmountOnExit: true, "data-testid": `${testIdPrefix}-filters`, children: /* @__PURE__ */ jsx(
+    Box,
+    {
+      className,
+      sx: {
+        display: "flex",
+        flexDirection: "column",
+        gap: 1.5,
+        p: 2,
+        borderRadius: 1,
+        border: 1,
+        borderColor: "divider",
+        bgcolor: "action.hover"
+      },
+      children
+    }
+  ) });
+};
+DashboardFilters.displayName = "Dashboard.Filters";
+DashboardFilters.dashboardSlot = "filters";
+var DashboardMoreFilters = ({ children, label = "More filters" }) => {
+  const { moreFiltersOpen, toggleMoreFilters, testIdPrefix } = useDashboardContext();
+  return /* @__PURE__ */ jsxs(Box, { children: [
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "text",
+        size: "small",
+        startIcon: /* @__PURE__ */ jsx(FilterIcon, { fontSize: "small" }),
+        endIcon: moreFiltersOpen ? /* @__PURE__ */ jsx(ExpandLessIcon, { fontSize: "small" }) : /* @__PURE__ */ jsx(ExpandMoreIcon, { fontSize: "small" }),
+        onClick: toggleMoreFilters,
+        "aria-expanded": moreFiltersOpen,
+        "data-testid": `${testIdPrefix}-more-filters-toggle`,
+        children: label
+      }
+    ),
+    /* @__PURE__ */ jsx(Collapse, { in: moreFiltersOpen, unmountOnExit: true, "data-testid": `${testIdPrefix}-more-filters-panel`, children: /* @__PURE__ */ jsx(Box, { sx: { mt: 1.5, p: 2, borderRadius: 1, border: 1, borderColor: "divider", bgcolor: "background.paper" }, children }) })
+  ] });
+};
+DashboardMoreFilters.displayName = "Dashboard.MoreFilters";
+var DashboardBody = ({ children, className }) => {
+  const { testIdPrefix } = useDashboardContext();
+  return /* @__PURE__ */ jsx(Box, { className, "data-testid": `${testIdPrefix}-body`, children });
+};
+DashboardBody.displayName = "Dashboard.Body";
+DashboardBody.dashboardSlot = "body";
+Dashboard.Breadcrumb = DashboardBreadcrumb;
+Dashboard.Header = DashboardHeader;
+Dashboard.Spacer = DashboardSpacer;
+Dashboard.Info = DashboardInfo;
+Dashboard.FilterToggle = DashboardFilterToggle;
+Dashboard.Settings = DashboardSettings;
+Dashboard.Export = DashboardExport;
+Dashboard.Action = DashboardAction;
+Dashboard.Filters = DashboardFilters;
+Dashboard.MoreFilters = DashboardMoreFilters;
+Dashboard.Body = DashboardBody;
+
+export {
+  markDashboardSlot,
+  Dashboard
+};
+//# sourceMappingURL=chunk-A43SJQYE.js.map

package/dist/chunk-A43SJQYE.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/Dashboard/Dashboard.tsx"],"sourcesContent":["'use client';\n\nimport ExpandLessIcon from '@mui/icons-material/ExpandLess';\nimport ExpandMoreIcon from '@mui/icons-material/ExpandMore';\nimport FilterIcon from '@mui/icons-material/FilterListRounded';\nimport NavigateNextIcon from '@mui/icons-material/NavigateNext';\nimport Box from '@mui/material/Box/index.js';\nimport MuiBreadcrumbs from '@mui/material/Breadcrumbs/index.js';\nimport Button from '@mui/material/Button/index.js';\nimport Collapse from '@mui/material/Collapse/index.js';\nimport MuiLink from '@mui/material/Link/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { styled } from '@mui/material/styles/index.js';\nimport React, { useMemo, useState } from 'react';\n\nimport { DashboardContext, useDashboardContext } from './DashboardContext';\nimport {\n  DashboardAction,\n  DashboardExport,\n  DashboardFilterToggle,\n  DashboardInfo,\n  DashboardSettings,\n  DashboardSpacer,\n} from './DashboardParts';\nimport type {\n  DashboardBodyProps,\n  DashboardBreadcrumbProps,\n  DashboardFiltersProps,\n  DashboardHeaderProps,\n  DashboardMoreFiltersProps,\n  DashboardProps,\n} from './Dashboard.types';\n\n/**\n * Ordered slot keys. The root reorders composed children into this sequence so\n * authoring order in JSX never matters — a `<Dashboard.Filters>` placed above\n * a `<Dashboard.Header>` still renders below it.\n */\nconst SLOT_ORDER = ['breadcrumb', 'header', 'filters', 'body'] as const;\n/** A slot a component can occupy in the canonical Dashboard order. */\nexport type DashboardSlot = (typeof SLOT_ORDER)[number];\n\n/** Marker attached to each sub-component so the root can rank it by slot. */\ntype SlottedComponent = { dashboardSlot?: DashboardSlot };\n\n/**\n * Tag a component with the Dashboard slot it occupies so the root ranks it in\n * canonical order. The root inspects only its DIRECT children's `type`, so a\n * page that wraps a `<Dashboard.Header>` (or any part) in its own component MUST\n * mark that wrapper — otherwise it counts as an unrecognised child and sinks\n * below the body. Returns the component for convenient inline use.\n *\n * @example\n * ```tsx\n * function ProductsHeader(props) {\n *   return <Dashboard.Header title=\"Products\">{/* … *\\/}</Dashboard.Header>;\n * }\n * markDashboardSlot(ProductsHeader, 'header');\n * ```\n */\nexport function markDashboardSlot<T>(component: T, slot: DashboardSlot): T {\n  (component as SlottedComponent).dashboardSlot = slot;\n  return component;\n}\n\nconst Root = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(2),\n  width: '100%',\n}));\n\nfunction slotRank(node: React.ReactNode): number {\n  if (React.isValidElement(node)) {\n    const slot = (node.type as SlottedComponent).dashboardSlot;\n    if (slot) {\n      const rank = SLOT_ORDER.indexOf(slot);\n      if (rank >= 0) {\n        return rank;\n      }\n    }\n  }\n  // Unknown / arbitrary children keep their relative position after the\n  // recognised slots.\n  return SLOT_ORDER.length;\n}\n\n/**\n * Composable page shell. `<Dashboard>` provides shared state through context\n * and renders whichever sub-components you compose — nothing is implied. Drop\n * in only the parts you need; omit `<Dashboard.Filters>` and there is simply no\n * filter UI.\n *\n * @example\n * ```tsx\n * <Dashboard activeFilterCount={2}>\n *   <Dashboard.Breadcrumb items={[{ label: 'Admin', href: '/admin' }, { label: 'Products' }]} />\n *   <Dashboard.Header title=\"Products\">\n *     <Dashboard.Info>What this page does…</Dashboard.Info>\n *     <Dashboard.FilterToggle />\n *     <Dashboard.Settings>In development</Dashboard.Settings>\n *     <Dashboard.Spacer />\n *     <Dashboard.Export onExport={handleExport} />\n *     <Dashboard.Action><Button variant=\"contained\">New product</Button></Dashboard.Action>\n *   </Dashboard.Header>\n *   <Dashboard.Filters>{/* search + pills *\\/}</Dashboard.Filters>\n *   <Dashboard.Body>{table}</Dashboard.Body>\n * </Dashboard>\n * ```\n */\nexport const Dashboard = ({\n  children,\n  defaultFiltersVisible = true,\n  activeFilterCount = 0,\n  testIdPrefix = 'dashboard',\n  className,\n}: DashboardProps): React.JSX.Element => {\n  const [filtersVisible, setFiltersVisible] = useState(defaultFiltersVisible);\n  const [moreFiltersOpen, setMoreFiltersOpen] = useState(false);\n\n  const value = useMemo(\n    () => ({\n      filtersVisible,\n      toggleFilters: () => setFiltersVisible((v) => !v),\n      moreFiltersOpen,\n      toggleMoreFilters: () => setMoreFiltersOpen((v) => !v),\n      activeFilterCount,\n      testIdPrefix,\n    }),\n    [filtersVisible, moreFiltersOpen, activeFilterCount, testIdPrefix],\n  );\n\n  // Stable sort recognised slots into canonical order, preserving the original\n  // order of anything unrecognised.\n  const ordered = useMemo(() => {\n    const arr = React.Children.toArray(children);\n    return arr\n      .map((node, index) => ({ node, index, rank: slotRank(node) }))\n      .sort((a, b) => (a.rank === b.rank ? a.index - b.index : a.rank - b.rank))\n      .map((entry) => entry.node);\n  }, [children]);\n\n  return (\n    <DashboardContext.Provider value={value}>\n      <Root className={className} data-testid={testIdPrefix}>\n        {ordered}\n      </Root>\n    </DashboardContext.Provider>\n  );\n};\n\nDashboard.displayName = 'Dashboard';\n\n/* -------------------------------------------------------------------------- */\n/* Breadcrumb                                                                 */\n/* -------------------------------------------------------------------------- */\n\nconst DashboardBreadcrumb = ({\n  items,\n  renderLink,\n  className,\n}: DashboardBreadcrumbProps): React.JSX.Element => {\n  const { testIdPrefix } = useDashboardContext();\n  return (\n    <MuiBreadcrumbs\n      separator={<NavigateNextIcon fontSize=\"small\" />}\n      className={className}\n      aria-label=\"breadcrumb\"\n      data-testid={`${testIdPrefix}-breadcrumb`}\n      sx={{ fontSize: '0.875rem', color: 'text.secondary' }}\n    >\n      {items.map((item, index) => {\n        const isLast = index === items.length - 1;\n        if (isLast || !item.href) {\n          return (\n            <Typography\n              key={`${item.label}-${index}`}\n              component=\"span\"\n              sx={{ fontSize: '0.875rem', color: isLast ? 'text.primary' : 'text.secondary' }}\n              aria-current={isLast ? 'page' : undefined}\n            >\n              {item.label}\n            </Typography>\n          );\n        }\n        const linkContent = item.label;\n        if (renderLink) {\n          return <React.Fragment key={`${item.label}-${index}`}>{renderLink(item, linkContent)}</React.Fragment>;\n        }\n        return (\n          <MuiLink\n            key={`${item.label}-${index}`}\n            href={item.href}\n            underline=\"hover\"\n            color=\"inherit\"\n            sx={{ fontSize: '0.875rem' }}\n          >\n            {linkContent}\n          </MuiLink>\n        );\n      })}\n    </MuiBreadcrumbs>\n  );\n};\nDashboardBreadcrumb.displayName = 'Dashboard.Breadcrumb';\n(DashboardBreadcrumb as SlottedComponent).dashboardSlot = 'breadcrumb';\n\n/* -------------------------------------------------------------------------- */\n/* Header + action parts                                                      */\n/* -------------------------------------------------------------------------- */\n\nconst DashboardHeader = ({ title, children, className }: DashboardHeaderProps): React.JSX.Element => {\n  const { testIdPrefix } = useDashboardContext();\n  return (\n    <Box\n      className={className}\n      data-testid={`${testIdPrefix}-header`}\n      sx={{ display: 'flex', alignItems: 'center', gap: 1, flexWrap: 'wrap', minHeight: 40 }}\n    >\n      <Typography variant=\"h5\" component=\"h1\" sx={{ fontWeight: 600, mr: 0.5 }}>\n        {title}\n      </Typography>\n      {children}\n    </Box>\n  );\n};\nDashboardHeader.displayName = 'Dashboard.Header';\n(DashboardHeader as SlottedComponent).dashboardSlot = 'header';\n\n/** Flexible spacer — everything composed after it is pushed to the right. */\n/* -------------------------------------------------------------------------- */\n/* Filters                                                                    */\n/* -------------------------------------------------------------------------- */\n\nconst DashboardFilters = ({ children, className }: DashboardFiltersProps): React.JSX.Element => {\n  const { filtersVisible, testIdPrefix } = useDashboardContext();\n  return (\n    <Collapse in={filtersVisible} unmountOnExit data-testid={`${testIdPrefix}-filters`}>\n      <Box\n        className={className}\n        sx={{\n          display: 'flex',\n          flexDirection: 'column',\n          gap: 1.5,\n          p: 2,\n          borderRadius: 1,\n          border: 1,\n          borderColor: 'divider',\n          bgcolor: 'action.hover',\n        }}\n      >\n        {children}\n      </Box>\n    </Collapse>\n  );\n};\nDashboardFilters.displayName = 'Dashboard.Filters';\n(DashboardFilters as SlottedComponent).dashboardSlot = 'filters';\n\nconst DashboardMoreFilters = ({ children, label = 'More filters' }: DashboardMoreFiltersProps): React.JSX.Element => {\n  const { moreFiltersOpen, toggleMoreFilters, testIdPrefix } = useDashboardContext();\n  return (\n    <Box>\n      <Button\n        variant=\"text\"\n        size=\"small\"\n        startIcon={<FilterIcon fontSize=\"small\" />}\n        endIcon={moreFiltersOpen ? <ExpandLessIcon fontSize=\"small\" /> : <ExpandMoreIcon fontSize=\"small\" />}\n        onClick={toggleMoreFilters}\n        aria-expanded={moreFiltersOpen}\n        data-testid={`${testIdPrefix}-more-filters-toggle`}\n      >\n        {label}\n      </Button>\n      <Collapse in={moreFiltersOpen} unmountOnExit data-testid={`${testIdPrefix}-more-filters-panel`}>\n        <Box sx={{ mt: 1.5, p: 2, borderRadius: 1, border: 1, borderColor: 'divider', bgcolor: 'background.paper' }}>\n          {children}\n        </Box>\n      </Collapse>\n    </Box>\n  );\n};\nDashboardMoreFilters.displayName = 'Dashboard.MoreFilters';\n\n/* -------------------------------------------------------------------------- */\n/* Body                                                                       */\n/* -------------------------------------------------------------------------- */\n\nconst DashboardBody = ({ children, className }: DashboardBodyProps): React.JSX.Element => {\n  const { testIdPrefix } = useDashboardContext();\n  return (\n    <Box className={className} data-testid={`${testIdPrefix}-body`}>\n      {children}\n    </Box>\n  );\n};\nDashboardBody.displayName = 'Dashboard.Body';\n(DashboardBody as SlottedComponent).dashboardSlot = 'body';\n\n/* -------------------------------------------------------------------------- */\n/* Attach sub-components as dot-notation parts                                */\n/* -------------------------------------------------------------------------- */\n\nDashboard.Breadcrumb = DashboardBreadcrumb;\nDashboard.Header = DashboardHeader;\nDashboard.Spacer = DashboardSpacer;\nDashboard.Info = DashboardInfo;\nDashboard.FilterToggle = DashboardFilterToggle;\nDashboard.Settings = DashboardSettings;\nDashboard.Export = DashboardExport;\nDashboard.Action = DashboardAction;\nDashboard.Filters = DashboardFilters;\nDashboard.MoreFilters = DashboardMoreFilters;\nDashboard.Body = DashboardBody;\n"],"mappings":"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","names":[]}

package/dist/chunk-A7LG3AXV.js

@@ -0,0 +1,116 @@
+// src/components/form/ToggleGroup/ToggleGroup.tsx
+import Box from "@mui/material/Box/index.js";
+import ToggleButton from "@mui/material/ToggleButton/index.js";
+import ToggleButtonGroup from "@mui/material/ToggleButtonGroup/index.js";
+import { alpha, useTheme, styled } from "@mui/material/styles/index.js";
+import { forwardRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var getColorFromTheme = (theme, color) => {
+  if (color === "neutral") {
+    return {
+      main: theme.palette.grey[700],
+      dark: theme.palette.grey[800],
+      light: theme.palette.grey[500],
+      contrastText: theme.palette.getContrastText(theme.palette.grey[700])
+    };
+  }
+  const colorMap = {
+    primary: theme.palette.primary,
+    secondary: theme.palette.secondary,
+    success: theme.palette.success,
+    warning: theme.palette.warning,
+    info: theme.palette.info,
+    danger: theme.palette.error
+  };
+  const palette = colorMap[color] || theme.palette.primary;
+  return {
+    main: palette.main,
+    dark: palette.dark || palette.main,
+    light: palette.light || palette.main,
+    contrastText: palette.contrastText || theme.palette.getContrastText(palette.main)
+  };
+};
+var StyledToggleGroup = styled(ToggleButtonGroup, {
+  shouldForwardProp: (prop) => !["customColor", "customSize", "glass"].includes(prop)
+})(({ theme, glass }) => ({
+  backgroundColor: glass ? alpha(theme.palette.background.paper, 0.1) : "transparent",
+  backdropFilter: glass ? "blur(20px)" : "none",
+  borderRadius: theme.spacing(1),
+  padding: glass ? 4 : 0,
+  border: glass ? `1px solid ${alpha(theme.palette.divider, 0.2)}` : "none",
+  "& .MuiToggleButtonGroup-grouped": {
+    margin: theme.spacing(0.5),
+    border: 0,
+    borderRadius: `${theme.shape.borderRadius}px !important`
+  }
+}));
+var ToggleGroup = forwardRef(
+  ({
+    variant = "single",
+    color = "primary",
+    size = "md",
+    options,
+    glass = false,
+    gradient = false,
+    value,
+    onChange,
+    dataTestId = "toggle-group",
+    ...props
+  }, ref) => {
+    const theme = useTheme();
+    const colorPalette = getColorFromTheme(theme, color);
+    const sizeMap = {
+      xs: { padding: "4px 8px", fontSize: "0.75rem" },
+      sm: { padding: "6px 12px", fontSize: "0.875rem" },
+      md: { padding: "8px 16px", fontSize: "1rem" },
+      lg: { padding: "10px 20px", fontSize: "1.125rem" },
+      xl: { padding: "12px 24px", fontSize: "1.25rem" }
+    };
+    return /* @__PURE__ */ jsx(
+      StyledToggleGroup,
+      {
+        ref,
+        customColor: color,
+        customSize: size,
+        glass,
+        value,
+        onChange,
+        exclusive: variant === "exclusive" || variant === "single",
+        "data-testid": dataTestId,
+        ...props,
+        children: options.map((option) => /* @__PURE__ */ jsx(
+          ToggleButton,
+          {
+            value: option.value,
+            disabled: option.disabled,
+            "data-testid": `${dataTestId}-item-${option.value}`,
+            sx: {
+              textTransform: "none",
+              fontWeight: 500,
+              transition: "all 0.3s ease",
+              ...sizeMap[size],
+              "&.Mui-selected": {
+                backgroundColor: colorPalette.main,
+                color: colorPalette.contrastText,
+                ...gradient && {
+                  background: `linear-gradient(135deg, ${colorPalette.main}, ${colorPalette.dark})`
+                }
+              }
+            },
+            children: /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
+              option.icon,
+              option.label
+            ] })
+          },
+          option.value
+        ))
+      }
+    );
+  }
+);
+ToggleGroup.displayName = "ToggleGroup";
+
+export {
+  ToggleGroup
+};
+//# sourceMappingURL=chunk-A7LG3AXV.js.map

package/dist/chunk-A7LG3AXV.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/ToggleGroup/ToggleGroup.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport ToggleButton from '@mui/material/ToggleButton/index.js';\nimport ToggleButtonGroup from '@mui/material/ToggleButtonGroup/index.js';\nimport { alpha, useTheme, styled } from '@mui/material/styles/index.js';\nimport type { Theme } from '@mui/material/styles/index.js';\nimport React, { forwardRef } from 'react';\n\nimport type { ToggleGroupProps } from './ToggleGroup.types';\n\nconst getColorFromTheme = (theme: Theme, color: string) => {\n  if (color === 'neutral') {\n    return {\n      main: theme.palette.grey[700],\n      dark: theme.palette.grey[800],\n      light: theme.palette.grey[500],\n      contrastText: theme.palette.getContrastText(theme.palette.grey[700]),\n    };\n  }\n\n  const colorMap = {\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: theme.palette.error,\n  };\n\n  const palette = colorMap[color as keyof typeof colorMap] || theme.palette.primary;\n\n  // Ensure palette has required properties\n  return {\n    main: palette.main,\n    dark: palette.dark || palette.main,\n    light: palette.light || palette.main,\n    contrastText: palette.contrastText || theme.palette.getContrastText(palette.main),\n  };\n};\n\nconst StyledToggleGroup = styled(ToggleButtonGroup, {\n  shouldForwardProp: (prop) => !['customColor', 'customSize', 'glass'].includes(prop as string),\n})<{\n  customColor?: string;\n  customSize?: string;\n  glass?: boolean;\n}>(({ theme, glass }) => ({\n  backgroundColor: glass ? alpha(theme.palette.background.paper, 0.1) : 'transparent',\n  backdropFilter: glass ? 'blur(20px)' : 'none',\n  borderRadius: theme.spacing(1),\n  padding: glass ? 4 : 0,\n  border: glass ? `1px solid ${alpha(theme.palette.divider, 0.2)}` : 'none',\n\n  '& .MuiToggleButtonGroup-grouped': {\n    margin: theme.spacing(0.5),\n    border: 0,\n    borderRadius: `${theme.shape.borderRadius}px !important`,\n  },\n}));\n\nexport const ToggleGroup = forwardRef<HTMLDivElement, ToggleGroupProps>(\n  (\n    {\n      variant = 'single',\n      color = 'primary',\n      size = 'md',\n      options,\n      glass = false,\n      gradient = false,\n      value,\n      onChange,\n      dataTestId = 'toggle-group',\n      ...props\n    },\n    ref,\n  ) => {\n    const theme = useTheme();\n    const colorPalette = getColorFromTheme(theme, color);\n\n    const sizeMap = {\n      xs: { padding: '4px 8px', fontSize: '0.75rem' },\n      sm: { padding: '6px 12px', fontSize: '0.875rem' },\n      md: { padding: '8px 16px', fontSize: '1rem' },\n      lg: { padding: '10px 20px', fontSize: '1.125rem' },\n      xl: { padding: '12px 24px', fontSize: '1.25rem' },\n    };\n\n    return (\n      <StyledToggleGroup\n        ref={ref}\n        customColor={color}\n        customSize={size}\n        glass={glass}\n        value={value}\n        onChange={onChange}\n        exclusive={variant === 'exclusive' || variant === 'single'}\n        data-testid={dataTestId}\n        {...props}\n      >\n        {options.map((option) => (\n          <ToggleButton\n            key={option.value}\n            value={option.value}\n            disabled={option.disabled}\n            data-testid={`${dataTestId}-item-${option.value}`}\n            sx={{\n              textTransform: 'none',\n              fontWeight: 500,\n              transition: 'all 0.3s ease',\n              ...sizeMap[size as keyof typeof sizeMap],\n\n              '&.Mui-selected': {\n                backgroundColor: colorPalette.main,\n                color: colorPalette.contrastText,\n\n                ...(gradient && {\n                  background: `linear-gradient(135deg, ${colorPalette.main}, ${colorPalette.dark})`,\n                }),\n              },\n            }}\n          >\n            <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>\n              {option.icon}\n              {option.label}\n            </Box>\n          </ToggleButton>\n        ))}\n      </StyledToggleGroup>\n    );\n  },\n);\n\nToggleGroup.displayName = 'ToggleGroup';\n"],"mappings":"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","names":[]}

package/dist/chunk-A7Q5AQVD.js

@@ -0,0 +1,126 @@
+import {
+  useDataViewsCopy
+} from "./chunk-KHG57NAE.js";
+import {
+  default as default2
+} from "./chunk-6DPAWXZ3.js";
+
+// src/components/data-display/DataViews/data-views-search.tsx
+import CloseIcon from "@mui/icons-material/Close";
+import SearchIcon from "@mui/icons-material/Search";
+import IconButton from "@mui/material/IconButton/index.js";
+import InputAdornment from "@mui/material/InputAdornment/index.js";
+import TextField from "@mui/material/TextField/index.js";
+import { useEffect, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var SEARCH_DEBOUNCE_MS = 350;
+function boxWidth(fill) {
+  return { flex: 1, minWidth: fill ? 0 : 200, maxWidth: fill ? "none" : 384 };
+}
+function InlineKeyword({
+  value,
+  onChange,
+  testId,
+  autoFocus,
+  onEscape,
+  fill = false
+}) {
+  const copy = useDataViewsCopy();
+  const [draft, setDraft] = useState(value);
+  const prev = useRef(value);
+  if (prev.current !== value) {
+    prev.current = value;
+    if (draft !== value) setDraft(value);
+  }
+  useEffect(() => {
+    if (draft === value) return void 0;
+    const timer = setTimeout(() => onChange(draft), SEARCH_DEBOUNCE_MS);
+    return () => clearTimeout(timer);
+  }, [draft, value, onChange]);
+  return /* @__PURE__ */ jsx(
+    TextField,
+    {
+      size: "small",
+      value: draft,
+      autoFocus,
+      onChange: (event) => setDraft(event.target.value),
+      onKeyDown: (event) => {
+        if (event.key === "Escape") {
+          event.preventDefault();
+          if (draft === "") onEscape?.();
+          setDraft("");
+          return;
+        }
+        if (event.key !== "Enter") return;
+        event.preventDefault();
+        if (draft !== value) onChange(draft);
+      },
+      placeholder: copy.search.placeholder,
+      inputProps: { "aria-label": copy.search.allColumnsLabel, "data-testid": testId },
+      InputProps: {
+        startAdornment: /* @__PURE__ */ jsx(InputAdornment, { position: "start", children: /* @__PURE__ */ jsx(SearchIcon, { sx: { fontSize: 16, color: "text.secondary" } }) }),
+        endAdornment: draft ? /* @__PURE__ */ jsx(InputAdornment, { position: "end", children: /* @__PURE__ */ jsx(
+          IconButton,
+          {
+            size: "small",
+            "aria-label": copy.search.clear,
+            "data-testid": testId ? `${testId}-clear` : void 0,
+            onClick: () => setDraft(""),
+            sx: { p: 0.25 },
+            children: /* @__PURE__ */ jsx(CloseIcon, { sx: { fontSize: 14 } })
+          }
+        ) }) : void 0
+      },
+      sx: boxWidth(fill)
+    }
+  );
+}
+function CollapsedSearch({
+  active,
+  onOpen,
+  testId
+}) {
+  const copy = useDataViewsCopy();
+  return /* @__PURE__ */ jsxs(
+    IconButton,
+    {
+      size: "small",
+      onClick: onOpen,
+      "aria-label": copy.search.open,
+      "aria-expanded": false,
+      "data-testid": testId ? `${testId}-collapsed` : void 0,
+      sx: {
+        position: "relative",
+        border: 1,
+        borderRadius: 1,
+        borderColor: active ? "primary.main" : "divider",
+        color: active ? "primary.main" : "text.secondary",
+        bgcolor: active ? "action.selected" : "background.paper"
+      },
+      children: [
+        /* @__PURE__ */ jsx(SearchIcon, { sx: { fontSize: 18 } }),
+        active && /* @__PURE__ */ jsx(
+          default2,
+          {
+            component: "span",
+            sx: {
+              position: "absolute",
+              top: 2,
+              right: 2,
+              width: 6,
+              height: 6,
+              borderRadius: "50%",
+              bgcolor: "primary.main"
+            }
+          }
+        )
+      ]
+    }
+  );
+}
+
+export {
+  InlineKeyword,
+  CollapsedSearch
+};
+//# sourceMappingURL=chunk-A7Q5AQVD.js.map

package/dist/chunk-A7Q5AQVD.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/DataViews/data-views-search.tsx"],"sourcesContent":["\"use client\";\n\n/**\n * THE INLINE BAR'S SEARCH — the one control on the toolbar that cannot be\n * guessed from an icon's position, which is why it is the LAST thing the\n * degradation ladder takes away. See `data-views-overflow.ts`.\n */\nimport CloseIcon from \"@mui/icons-material/Close\";\nimport SearchIcon from \"@mui/icons-material/Search\";\nimport IconButton from \"@mui/material/IconButton/index.js\";\nimport InputAdornment from \"@mui/material/InputAdornment/index.js\";\nimport TextField from \"@mui/material/TextField/index.js\";\nimport { useEffect, useRef, useState } from \"react\";\n\nimport { Box } from \"../../../mui/Box\";\nimport { useDataViewsCopy } from \"./data-views-copy-context\";\n\n/** How long the box waits after the last keystroke before it queries. */\nconst SEARCH_DEBOUNCE_MS = 350;\n\n/**\n * How wide the keyword box is allowed to be.\n *\n * The 200px floor is right while the box shares the row: a search you cannot\n * read six characters in is not a search. It is WRONG once the box has been\n * expanded out of its collapsed state on a narrow screen, where the cluster was\n * sized for a magnifier — the floor cannot be met there, so the row scrolled\n * sideways instead (154px of overhang at 320px). In that mode the box shrinks,\n * and if what is left would still be unreadable the bar hands it the whole\n * cluster instead (`searchTakeover`).\n */\nfunction boxWidth(fill: boolean): { flex: number; minWidth: number; maxWidth: number | \"none\" } {\n  return { flex: 1, minWidth: fill ? 0 : 200, maxWidth: fill ? \"none\" : 384 };\n}\n\n/**\n * The bar's keyword box.\n *\n * DEBOUNCED rather than committed on Enter/blur. In server mode every commit is\n * a round trip, and a box that only fires on blur makes the operator press a\n * key they were not told about to see any result at all — they type, nothing\n * happens, and the list looks broken. 350ms is long enough that a word costs\n * one query, short enough to feel like live search.\n *\n * `Escape` clears; the X clears without leaving the box. Both exist because\n * clearing by selecting-and-deleting is three gestures for the most common\n * thing anyone does to a search box.\n */\nexport function InlineKeyword({\n  value,\n  onChange,\n  testId,\n  autoFocus,\n  onEscape,\n  fill = false,\n}: {\n  value: string;\n  onChange: (value: string) => void;\n  testId?: string;\n  autoFocus?: boolean;\n  /** Called on Escape with the box already empty — the collapsed bar closes it. */\n  onEscape?: () => void;\n  /** Take whatever width there is, with no minimum — see {@link boxWidth}. */\n  fill?: boolean;\n}): React.JSX.Element {\n  const copy = useDataViewsCopy();\n  const [draft, setDraft] = useState(value);\n  const prev = useRef(value);\n  // An external change (a saved view, the URL, \"Limpar\") wins over the draft.\n  if (prev.current !== value) {\n    prev.current = value;\n    if (draft !== value) setDraft(value);\n  }\n  useEffect(() => {\n    if (draft === value) return undefined;\n    const timer = setTimeout(() => onChange(draft), SEARCH_DEBOUNCE_MS);\n    return () => clearTimeout(timer);\n  }, [draft, value, onChange]);\n\n  return (\n    <TextField\n      size=\"small\"\n      value={draft}\n      autoFocus={autoFocus}\n      onChange={(event) => setDraft(event.target.value)}\n      onKeyDown={(event) => {\n        if (event.key === \"Escape\") {\n          event.preventDefault();\n          if (draft === \"\") onEscape?.();\n          setDraft(\"\");\n          return;\n        }\n        // Enter still commits IMMEDIATELY, ahead of the debounce — someone who\n        // presses it has decided, and waiting out the timer reads as a stall.\n        if (event.key !== \"Enter\") return;\n        event.preventDefault();\n        if (draft !== value) onChange(draft);\n      }}\n      placeholder={copy.search.placeholder}\n      inputProps={{ \"aria-label\": copy.search.allColumnsLabel, \"data-testid\": testId }}\n      InputProps={{\n        startAdornment: (\n          <InputAdornment position=\"start\">\n            <SearchIcon sx={{ fontSize: 16, color: \"text.secondary\" }} />\n          </InputAdornment>\n        ),\n        endAdornment: draft ? (\n          <InputAdornment position=\"end\">\n            <IconButton\n              size=\"small\"\n              aria-label={copy.search.clear}\n              data-testid={testId ? `${testId}-clear` : undefined}\n              onClick={() => setDraft(\"\")}\n              sx={{ p: 0.25 }}\n            >\n              <CloseIcon sx={{ fontSize: 14 }} />\n            </IconButton>\n          </InputAdornment>\n        ) : undefined,\n      }}\n      // Takes the free space and gives it up first — step 3 of the ladder,\n      // which needs no flag because flex does it (see `computeSplit`).\n      sx={boxWidth(fill)}\n    />\n  );\n}\n\n/**\n * Step 4 of the ladder: the search as a magnifier.\n *\n * Carries a dot when a search is APPLIED. Collapsing a control that is\n * currently filtering the list, with nothing saying so, is how an operator ends\n * up staring at 3 rows of 214 and reading it as missing data.\n */\nexport function CollapsedSearch({\n  active,\n  onOpen,\n  testId,\n}: {\n  active: boolean;\n  onOpen: () => void;\n  testId?: string;\n}): React.JSX.Element {\n  const copy = useDataViewsCopy();\n  return (\n    <IconButton\n      size=\"small\"\n      onClick={onOpen}\n      aria-label={copy.search.open}\n      aria-expanded={false}\n      data-testid={testId ? `${testId}-collapsed` : undefined}\n      sx={{\n        position: \"relative\",\n        border: 1,\n        borderRadius: 1,\n        borderColor: active ? \"primary.main\" : \"divider\",\n        color: active ? \"primary.main\" : \"text.secondary\",\n        bgcolor: active ? \"action.selected\" : \"background.paper\",\n      }}\n    >\n      <SearchIcon sx={{ fontSize: 18 }} />\n      {active && (\n        <Box\n          component=\"span\"\n          sx={{\n            position: \"absolute\",\n            top: 2,\n            right: 2,\n            width: 6,\n            height: 6,\n            borderRadius: \"50%\",\n            bgcolor: \"primary.main\",\n          }}\n        />\n      )}\n    </IconButton>\n  );\n}\n\n"],"mappings":"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","names":["default"]}

package/dist/chunk-ACZH2NUW.js

@@ -0,0 +1,38 @@
+import {
+  DEFAULT_ZOOM
+} from "./chunk-H2J2MTRE.js";
+
+// src/components/data-display/MapPreview/MapPreview.helpers.ts
+import { alpha } from "@mui/material/styles/index.js";
+var MAP_PREVIEW_DEFAULTS = {
+  markers: [],
+  marker: true,
+  height: "400px",
+  interactive: false,
+  zoom: DEFAULT_ZOOM,
+  mapType: "roadmap",
+  variant: "default",
+  showControls: true,
+  showSearch: false,
+  searchPlaceholder: "Search location...",
+  showRoute: false,
+  heatmapData: [],
+  showHeatmap: false,
+  animated: true
+};
+var definedProps = (props) => Object.fromEntries(
+  Object.entries(props).filter(([, value]) => value !== void 0)
+);
+var resolveMapPreviewProps = (props) => ({ ...MAP_PREVIEW_DEFAULTS, ...definedProps(props) });
+var glassStyles = (variant, theme) => variant === "glass" ? {
+  background: alpha(theme.palette.background.paper, 0.7),
+  backdropFilter: "blur(20px)",
+  WebkitBackdropFilter: "blur(20px)",
+  border: `1px solid ${alpha(theme.palette.divider, 0.1)}`
+} : {};
+
+export {
+  resolveMapPreviewProps,
+  glassStyles
+};
+//# sourceMappingURL=chunk-ACZH2NUW.js.map

package/dist/chunk-ACZH2NUW.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/MapPreview/MapPreview.helpers.ts"],"sourcesContent":["import type { Theme } from '@mui/material/styles/index.js';\nimport { alpha } from '@mui/material/styles/index.js';\n\nimport { DEFAULT_ZOOM } from './MapPreview.constants';\nimport type { MapPreviewProps } from './MapPreview.types';\n\ntype MapDefaultedKeys =\n  | 'markers'\n  | 'marker'\n  | 'height'\n  | 'interactive'\n  | 'zoom'\n  | 'mapType'\n  | 'variant'\n  | 'showControls'\n  | 'showSearch'\n  | 'searchPlaceholder'\n  | 'showRoute'\n  | 'heatmapData'\n  | 'showHeatmap'\n  | 'animated';\n\nexport type ResolvedMapPreviewProps = MapPreviewProps &\n  Required<Pick<MapPreviewProps, MapDefaultedKeys>>;\n\nconst MAP_PREVIEW_DEFAULTS: Pick<MapPreviewProps, MapDefaultedKeys> = {\n  markers: [],\n  marker: true,\n  height: '400px',\n  interactive: false,\n  zoom: DEFAULT_ZOOM,\n  mapType: 'roadmap',\n  variant: 'default',\n  showControls: true,\n  showSearch: false,\n  searchPlaceholder: 'Search location...',\n  showRoute: false,\n  heatmapData: [],\n  showHeatmap: false,\n  animated: true,\n};\n\n// Strips explicitly-undefined props before the merge, so `prop={undefined}` still\n// falls back to the default exactly as a destructuring default would.\nconst definedProps = (props: MapPreviewProps): Partial<MapPreviewProps> =>\n  Object.fromEntries(\n    Object.entries(props).filter(([, value]) => value !== undefined),\n  ) as Partial<MapPreviewProps>;\n\n// Applied as a merge rather than destructuring defaults, which would otherwise\n// put fourteen branches into the component's own complexity budget.\nexport const resolveMapPreviewProps = (props: MapPreviewProps): ResolvedMapPreviewProps =>\n  ({ ...MAP_PREVIEW_DEFAULTS, ...definedProps(props) }) as ResolvedMapPreviewProps;\n\nexport const glassStyles = (variant: MapPreviewProps['variant'], theme: Theme) =>\n  variant === 'glass'\n    ? {\n        background: alpha(theme.palette.background.paper, 0.7),\n        backdropFilter: 'blur(20px)',\n        WebkitBackdropFilter: 'blur(20px)',\n        border: `1px solid ${alpha(theme.palette.divider, 0.1)}`,\n      }\n    : {};\n"],"mappings":";;;;;AACA,SAAS,aAAa;AAwBtB,IAAM,uBAAgE;AAAA,EACpE,SAAS,CAAC;AAAA,EACV,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,aAAa;AAAA,EACb,MAAM;AAAA,EACN,SAAS;AAAA,EACT,SAAS;AAAA,EACT,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,mBAAmB;AAAA,EACnB,WAAW;AAAA,EACX,aAAa,CAAC;AAAA,EACd,aAAa;AAAA,EACb,UAAU;AACZ;AAIA,IAAM,eAAe,CAAC,UACpB,OAAO;AAAA,EACL,OAAO,QAAQ,KAAK,EAAE,OAAO,CAAC,CAAC,EAAE,KAAK,MAAM,UAAU,MAAS;AACjE;AAIK,IAAM,yBAAyB,CAAC,WACpC,EAAE,GAAG,sBAAsB,GAAG,aAAa,KAAK,EAAE;AAE9C,IAAM,cAAc,CAAC,SAAqC,UAC/D,YAAY,UACR;AAAA,EACE,YAAY,MAAM,MAAM,QAAQ,WAAW,OAAO,GAAG;AAAA,EACrD,gBAAgB;AAAA,EAChB,sBAAsB;AAAA,EACtB,QAAQ,aAAa,MAAM,MAAM,QAAQ,SAAS,GAAG,CAAC;AACxD,IACA,CAAC;","names":[]}

package/dist/chunk-AGKQBS4C.js

@@ -0,0 +1,30 @@
+import {
+  GridShell
+} from "./chunk-TDSRBCBG.js";
+import {
+  useDataViewsState
+} from "./chunk-TY6CTYCF.js";
+
+// src/components/data-display/DataViews/DataViewsGrid.tsx
+import { useEffect, useRef } from "react";
+import { jsx } from "react/jsx-runtime";
+function useVisibleRowsNotifier(matched, onVisibleRowsChange) {
+  const visibleSignature = JSON.stringify(matched);
+  const lastSignature = useRef(null);
+  useEffect(() => {
+    if (lastSignature.current === visibleSignature) return;
+    lastSignature.current = visibleSignature;
+    onVisibleRowsChange?.(matched);
+  }, [visibleSignature, matched, onVisibleRowsChange]);
+}
+function DataViewsGrid(props) {
+  const { rangeFields = [], testIdPrefix = "table" } = props;
+  const controller = useDataViewsState({ ...props, rangeFields, testIdPrefix });
+  useVisibleRowsNotifier(controller.matched, props.onVisibleRowsChange);
+  return /* @__PURE__ */ jsx(GridShell, { ...props, c: controller, rangeFields, testIdPrefix });
+}
+
+export {
+  DataViewsGrid
+};
+//# sourceMappingURL=chunk-AGKQBS4C.js.map

package/dist/chunk-AGYGNNOM.js

@@ -0,0 +1,56 @@
+import {
+  useMapClick,
+  useMapControls,
+  useMapPointer,
+  useMapSearch,
+  useMapView
+} from "./chunk-4ETQRBZC.js";
+
+// src/components/data-display/MapPreview/useMapPreview.ts
+import { useMemo, useRef } from "react";
+var useMapPreview = (props) => {
+  const { center, coordinates: legacyCoordinates, interactive, onMarkerDrag, onMapClick } = props;
+  const coordinates = useMemo(
+    () => center || legacyCoordinates || { lat: 0, lng: 0 },
+    [center, legacyCoordinates]
+  );
+  const containerRef = useRef(null);
+  const view = useMapView({
+    coordinates,
+    initialZoom: props.zoom,
+    initialMapType: props.mapType
+  });
+  const controls = useMapControls({
+    coordinates,
+    zoom: view.zoom,
+    mapType: view.mapType,
+    zoomTo: view.zoomTo,
+    setMapType: view.setMapType,
+    setMarkerPosition: view.setMarkerPosition,
+    setPanOffset: view.setPanOffset,
+    containerRef
+  });
+  const pointer = useMapPointer({
+    interactive,
+    markerPosition: view.markerPosition,
+    panOffset: view.panOffset,
+    onMarkerDrag,
+    setMarkerPosition: view.setMarkerPosition,
+    setPanOffset: view.setPanOffset
+  });
+  const search = useMapSearch({ zoomTo: view.zoomTo, setMarkerPosition: view.setMarkerPosition });
+  const handleMapClick = useMapClick({
+    coordinates,
+    interactive,
+    isPanning: pointer.isPanning,
+    onMapClick,
+    onMarkerDrag,
+    setMarkerPosition: view.setMarkerPosition
+  });
+  return { containerRef, view, controls, pointer, search, handleMapClick };
+};
+
+export {
+  useMapPreview
+};
+//# sourceMappingURL=chunk-AGYGNNOM.js.map