@12-apps/ui 6.11.1 → 6.12.0

package/dist/chunk-USBTXEBG.js

@@ -0,0 +1,264 @@
+import {
+  ColumnsTab
+} from "./chunk-2PPWKCMW.js";
+import {
+  DisplayTab,
+  SortTab
+} from "./chunk-F6FT2LIR.js";
+import {
+  ViewActions,
+  ViewFooter,
+  ViewHeader,
+  ViewsList
+} from "./chunk-QTPKACVO.js";
+import {
+  useDataViewsCopy
+} from "./chunk-KHG57NAE.js";
+import {
+  default as default2
+} from "./chunk-6DPAWXZ3.js";
+import {
+  Button
+} from "./chunk-6HLRXICF.js";
+
+// src/components/data-display/DataViews/data-views-display-panel.tsx
+import KeyboardArrowDownRoundedIcon from "@mui/icons-material/KeyboardArrowDownRounded";
+import DisplaySettingsRoundedIcon from "@mui/icons-material/DisplaySettingsRounded";
+import Popover from "@mui/material/Popover/index.js";
+import { useState } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function displayTabs(copy) {
+  return [
+    { key: "sort", label: copy.display.sortTab },
+    { key: "columns", label: copy.display.columnsTab },
+    { key: "display", label: copy.display.panelTab }
+  ];
+}
+function PanelTabs({
+  tab,
+  onChange,
+  muted,
+  testIdPrefix
+}) {
+  const copy = useDataViewsCopy();
+  return /* @__PURE__ */ jsx(default2, { sx: { display: "flex", gap: 0.5, p: 0.75, bgcolor: "action.hover", borderBottom: 1, borderColor: "divider" }, children: displayTabs(copy).map((entry) => {
+    const active = tab === entry.key && !muted;
+    return /* @__PURE__ */ jsx(
+      default2,
+      {
+        component: "button",
+        type: "button",
+        onClick: () => onChange(entry.key),
+        "data-testid": `${testIdPrefix}-display-tab-${entry.key}`,
+        "aria-current": active,
+        sx: {
+          flex: 1,
+          px: 1,
+          py: 0.75,
+          border: 0,
+          borderRadius: 1,
+          cursor: "pointer",
+          font: "inherit",
+          fontSize: "0.8125rem",
+          bgcolor: active ? "background.paper" : "transparent",
+          boxShadow: active ? 1 : 0,
+          fontWeight: active ? 600 : 400,
+          color: active ? "text.primary" : "text.secondary"
+        },
+        children: entry.label
+      },
+      entry.key
+    );
+  }) });
+}
+function PanelBody({
+  tab,
+  c,
+  sortKinds,
+  testIdPrefix
+}) {
+  if (tab === "sort") {
+    return /* @__PURE__ */ jsx(
+      SortTab,
+      {
+        fields: c.resolvedSortFields,
+        activeField: c.activeSortField,
+        activeOrder: c.activeSortOrder,
+        onChange: (field, order) => c.patch({ sortBy: [{ id: field, dir: order }] }),
+        sortKinds,
+        testIdPrefix
+      }
+    );
+  }
+  if (tab === "columns") {
+    return /* @__PURE__ */ jsx(
+      ColumnsTab,
+      {
+        columns: c.hideableColumns,
+        order: c.columnOrder,
+        visibleColumns: c.state.visibleColumns,
+        onToggle: c.toggleColumn,
+        onReorder: (order) => c.patch({ order }),
+        onShowAll: () => c.patch({ visibleColumns: c.columnOrder }),
+        onReset: () => c.patch({ visibleColumns: c.columnOrder, order: void 0 }),
+        testIdPrefix
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(DisplayTab, { testIdPrefix });
+}
+function PanelSurface({
+  c,
+  view,
+  nav,
+  tab,
+  onTab,
+  viewsOpen,
+  onToggleViews,
+  actionsFor,
+  onOpenActions,
+  onBack,
+  sortKinds,
+  onDone,
+  testIdPrefix
+}) {
+  return /* @__PURE__ */ jsxs(default2, { "data-testid": `${testIdPrefix}-display-panel`, children: [
+    view && /* @__PURE__ */ jsx(
+      ViewHeader,
+      {
+        view,
+        open: viewsOpen,
+        onToggle: onToggleViews,
+        testIdPrefix
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      PanelTabs,
+      {
+        tab,
+        onChange: onTab,
+        muted: Boolean(nav),
+        testIdPrefix
+      }
+    ),
+    /* @__PURE__ */ jsx(default2, { sx: { maxHeight: 320, minHeight: 220, overflowY: "auto" }, children: nav ? /* @__PURE__ */ jsx(
+      ViewsBody,
+      {
+        nav,
+        actionsFor,
+        onOpenActions,
+        onBack,
+        testIdPrefix
+      }
+    ) : /* @__PURE__ */ jsx(PanelBody, { tab, c, sortKinds, testIdPrefix }) }),
+    view && /* @__PURE__ */ jsx(ViewFooter, { view, onDone, testIdPrefix })
+  ] });
+}
+function ViewsBody({
+  nav,
+  actionsFor,
+  onOpenActions,
+  onBack,
+  testIdPrefix
+}) {
+  const live = actionsFor ? nav.views.find((view) => view.id === actionsFor.id) : void 0;
+  if (live) {
+    return /* @__PURE__ */ jsx(ViewActions, { view: live, handlers: nav, onBack, testIdPrefix });
+  }
+  return /* @__PURE__ */ jsx(ViewsList, { handlers: nav, onOpenActions, testIdPrefix });
+}
+function DisplayTrigger({
+  dirty,
+  compact,
+  onOpen,
+  testIdPrefix
+}) {
+  const copy = useDataViewsCopy();
+  return /* @__PURE__ */ jsx(
+    Button,
+    {
+      variant: "outline",
+      size: "sm",
+      color: "neutral",
+      onClick: (event) => onOpen(event.currentTarget),
+      dataTestId: `${testIdPrefix}-display-trigger`,
+      "aria-label": copy.display.trigger,
+      title: compact ? copy.display.trigger : void 0,
+      children: /* @__PURE__ */ jsxs(default2, { component: "span", sx: { display: "inline-flex", alignItems: "center", gap: 0.5 }, children: [
+        /* @__PURE__ */ jsx(DisplaySettingsRoundedIcon, { fontSize: "small" }),
+        !compact && /* @__PURE__ */ jsx(default2, { component: "span", sx: { display: { xs: "none", sm: "inline" } }, children: copy.display.trigger }),
+        dirty && /* @__PURE__ */ jsx(default2, { component: "span", sx: { height: 6, width: 6, borderRadius: "50%", bgcolor: "primary.main" } }),
+        !compact && /* @__PURE__ */ jsx(KeyboardArrowDownRoundedIcon, { fontSize: "small" })
+      ] })
+    }
+  );
+}
+function DataViewsDisplayPanel({
+  c,
+  testIdPrefix,
+  sortKinds,
+  view,
+  compact
+}) {
+  const [anchor, setAnchor] = useState(null);
+  const [tab, setTab] = useState("columns");
+  const [viewsOpen, setViewsOpen] = useState(false);
+  const [actionsFor, setActionsFor] = useState(null);
+  const nav = viewsOpen ? view?.nav : void 0;
+  const close = () => setAnchor(null);
+  const leaveViews = () => {
+    setViewsOpen(false);
+    setActionsFor(null);
+  };
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      DisplayTrigger,
+      {
+        dirty: Boolean(view?.dirty),
+        compact: Boolean(compact),
+        onOpen: setAnchor,
+        testIdPrefix
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Popover,
+      {
+        open: Boolean(anchor),
+        anchorEl: anchor,
+        onClose: close,
+        anchorOrigin: { vertical: "bottom", horizontal: "right" },
+        transformOrigin: { vertical: "top", horizontal: "right" },
+        slotProps: { paper: { sx: { width: 320, maxWidth: "calc(100vw - 32px)" } } },
+        children: /* @__PURE__ */ jsx(
+          PanelSurface,
+          {
+            c,
+            view,
+            nav,
+            tab,
+            onTab: (next) => {
+              setTab(next);
+              leaveViews();
+            },
+            viewsOpen,
+            onToggleViews: () => {
+              setViewsOpen((prev) => !prev);
+              setActionsFor(null);
+            },
+            actionsFor,
+            onOpenActions: setActionsFor,
+            onBack: () => setActionsFor(null),
+            sortKinds,
+            onDone: close,
+            testIdPrefix
+          }
+        )
+      }
+    )
+  ] });
+}
+
+export {
+  DataViewsDisplayPanel
+};
+//# sourceMappingURL=chunk-USBTXEBG.js.map

package/dist/chunk-USBTXEBG.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/DataViews/data-views-display-panel.tsx"],"sourcesContent":["\"use client\";\n\nimport type { DataViewsCopy } from \"./data-views-copy\";\nimport KeyboardArrowDownRoundedIcon from \"@mui/icons-material/KeyboardArrowDownRounded\";\n// Says \"display settings\" rather than the generic tune sliders it used to\n// share with the \"Mais\" FILTER trigger — see the note there.\nimport DisplaySettingsRoundedIcon from \"@mui/icons-material/DisplaySettingsRounded\";\nimport Popover from \"@mui/material/Popover/index.js\";\nimport { useState } from \"react\";\n\nimport { useDataViewsCopy } from \"./data-views-copy-context\";\nimport { Button } from \"../../form/Button\";\nimport { Box } from \"../../../mui/Box\";\n\nimport { ColumnsTab } from \"./data-views-columns-tab\";\nimport {\n  ViewActions,\n  ViewFooter,\n  ViewHeader,\n  ViewsList,\n  type ViewNavHandlers,\n} from \"./data-views-view-nav\";\nimport type { SavedViewSummary } from \"./data-views-types\";\nimport { DisplayTab, SortTab } from \"./data-views-display-tabs\";\nimport type { DataViewsController } from \"./use-data-views-state\";\n\n/**\n * \"EXIBIR\" — one panel for every question about how the list is READ.\n *\n * Sort, columns and format used to be three separate toolbar dropdowns, which\n * asked the operator to already know which one held what. They are one decision\n * (\"how do I want to read this?\") so they are one control with three tabs.\n *\n * A view BRACKETS the panel: its name pinned at the top, the save actions\n * pinned at the bottom, both visible on every tab — so a change made in Colunas\n * is one glance away from the button that saves it. A separate \"Visão\" button\n * in the toolbar would be the same concept twice, in two places, disagreeing\n * about whether there are unsaved changes.\n */\n\n/** Which tab is showing. `columns` first: it is what an operator opens this for. */\ntype DisplayTabKey = \"sort\" | \"columns\" | \"display\";\n\nfunction displayTabs(copy: DataViewsCopy): { key: DisplayTabKey; label: string }[] {\n  return [\n    { key: \"sort\", label: copy.display.sortTab },\n    { key: \"columns\", label: copy.display.columnsTab },\n    { key: \"display\", label: copy.display.panelTab },\n  ];\n}\n\n/** The saved-view chrome the panel brackets its tabs with, when a host supplies it. */\nexport interface DisplayPanelView {\n  /** The applied view's name, or undefined for the built-in \"Visão principal\". */\n  activeViewName?: string;\n  /** True when the live state differs from the applied view (or from pristine). */\n  dirty: boolean;\n  /** Restore the applied view (or the pristine default) — discards local changes. */\n  onReset: () => void;\n  /** Persist the live state over the applied view. Absent ⇒ no update affordance. */\n  onUpdate?: () => void;\n  /** Persist the live state as a NEW view. */\n  onSaveAs: () => void;\n  /**\n   * The saved views themselves, rendered INLINE in this panel's body when the\n   * VISÃO header is opened — not as a dropdown of their own. The panel stays\n   * data-free: the host owns the views and every mutation, this only decides\n   * where they appear.\n   */\n  nav?: ViewNavHandlers;\n}\n\ninterface DisplayPanelProps<T extends Record<string, unknown>> {\n  c: DataViewsController<T>;\n  testIdPrefix: string;\n  /** Per-sort-field value kind, so directions read in the column's own terms. */\n  sortKinds?: Record<string, string>;\n  view?: DisplayPanelView;\n  /** Icon only — step 2 of the toolbar's measured degradation ladder. */\n  compact?: boolean;\n}\n\n/** The tab strip inside the panel. */\nfunction PanelTabs({\n  tab,\n  onChange,\n  muted,\n  testIdPrefix,\n}: {\n  tab: DisplayTabKey;\n  onChange: (tab: DisplayTabKey) => void;\n  /** The views own the body — no tab is showing, so none reads as selected. */\n  muted?: boolean;\n  testIdPrefix: string;\n}): React.JSX.Element {\n  const copy = useDataViewsCopy();\n  return (\n    <Box sx={{ display: \"flex\", gap: 0.5, p: 0.75, bgcolor: \"action.hover\", borderBottom: 1, borderColor: \"divider\" }}>\n      {displayTabs(copy).map((entry) => {\n        const active = tab === entry.key && !muted;\n        return (\n        <Box\n          key={entry.key}\n          component=\"button\"\n          type=\"button\"\n          onClick={() => onChange(entry.key)}\n          data-testid={`${testIdPrefix}-display-tab-${entry.key}`}\n          aria-current={active}\n          sx={{\n            flex: 1,\n            px: 1,\n            py: 0.75,\n            border: 0,\n            borderRadius: 1,\n            cursor: \"pointer\",\n            font: \"inherit\",\n            fontSize: \"0.8125rem\",\n            bgcolor: active ? \"background.paper\" : \"transparent\",\n            boxShadow: active ? 1 : 0,\n            fontWeight: active ? 600 : 400,\n            color: active ? \"text.primary\" : \"text.secondary\",\n          }}\n        >\n          {entry.label}\n        </Box>\n        );\n      })}\n    </Box>\n  );\n}\n\n/** The active tab's body. */\nfunction PanelBody<T extends Record<string, unknown>>({\n  tab,\n  c,\n  sortKinds,\n  testIdPrefix,\n}: {\n  tab: DisplayTabKey;\n  c: DataViewsController<T>;\n  sortKinds?: Record<string, string>;\n  testIdPrefix: string;\n}): React.JSX.Element {\n  if (tab === \"sort\") {\n    return (\n      <SortTab\n        fields={c.resolvedSortFields}\n        activeField={c.activeSortField}\n        activeOrder={c.activeSortOrder}\n        onChange={(field, order) => c.patch({ sortBy: [{ id: field, dir: order }] })}\n        sortKinds={sortKinds}\n        testIdPrefix={testIdPrefix}\n      />\n    );\n  }\n  if (tab === \"columns\") {\n    return (\n      <ColumnsTab\n        columns={c.hideableColumns}\n        order={c.columnOrder}\n        visibleColumns={c.state.visibleColumns}\n        onToggle={c.toggleColumn}\n        onReorder={(order) => c.patch({ order })}\n        onShowAll={() => c.patch({ visibleColumns: c.columnOrder })}\n        // \"Padrão\" restores BOTH: the declared order and every column visible.\n        onReset={() => c.patch({ visibleColumns: c.columnOrder, order: undefined })}\n        testIdPrefix={testIdPrefix}\n      />\n    );\n  }\n  return <DisplayTab testIdPrefix={testIdPrefix} />;\n}\n\n/** Everything inside the popover: VISÃO header, tabs, body, save footer. */\nfunction PanelSurface<T extends Record<string, unknown>>({\n  c, view, nav, tab, onTab, viewsOpen, onToggleViews, actionsFor, onOpenActions,\n  onBack, sortKinds, onDone, testIdPrefix,\n}: {\n  c: DataViewsController<T>;\n  view?: DisplayPanelView;\n  nav?: ViewNavHandlers;\n  tab: DisplayTabKey;\n  onTab: (tab: DisplayTabKey) => void;\n  viewsOpen: boolean;\n  onToggleViews: () => void;\n  actionsFor: SavedViewSummary | null;\n  onOpenActions: (view: SavedViewSummary) => void;\n  onBack: () => void;\n  sortKinds?: Record<string, string>;\n  onDone: () => void;\n  testIdPrefix: string;\n}): React.JSX.Element {\n  return (\n    <Box data-testid={`${testIdPrefix}-display-panel`}>\n          {view && (\n            <ViewHeader\n              view={view}\n              open={viewsOpen}\n              onToggle={onToggleViews}\n              testIdPrefix={testIdPrefix}\n            />\n          )}\n          <PanelTabs\n            tab={tab}\n            onChange={onTab}\n            muted={Boolean(nav)}\n            testIdPrefix={testIdPrefix}\n          />\n          {/* Constrained + scrolled: the columns list is unbounded, and a panel\n              taller than the viewport puts its own save button off screen. */}\n          <Box sx={{ maxHeight: 320, minHeight: 220, overflowY: \"auto\" }}>\n            {nav ? (\n              <ViewsBody\n                nav={nav}\n                actionsFor={actionsFor}\n                onOpenActions={onOpenActions}\n                onBack={onBack}\n                testIdPrefix={testIdPrefix}\n              />\n            ) : (\n              <PanelBody tab={tab} c={c} sortKinds={sortKinds} testIdPrefix={testIdPrefix} />\n            )}\n          </Box>\n          {view && <ViewFooter view={view} onDone={onDone} testIdPrefix={testIdPrefix} />}\n    </Box>\n  );\n}\n\n\n/** The views as the panel's body: the list, or one view's actions. */\nfunction ViewsBody({\n  nav,\n  actionsFor,\n  onOpenActions,\n  onBack,\n  testIdPrefix,\n}: {\n  nav: ViewNavHandlers;\n  actionsFor: SavedViewSummary | null;\n  onOpenActions: (view: SavedViewSummary) => void;\n  onBack: () => void;\n  testIdPrefix: string;\n}): React.JSX.Element {\n  // Resolve against the LIVE list, not the object captured when the kebab was\n  // clicked: toggling \"Fixar\" or \"Compartilhar\" replaces the view in `views`,\n  // and a held snapshot would keep showing the state from before the click.\n  const live = actionsFor ? nav.views.find((view) => view.id === actionsFor.id) : undefined;\n  if (live) {\n    return <ViewActions view={live} handlers={nav} onBack={onBack} testIdPrefix={testIdPrefix} />;\n  }\n  return <ViewsList handlers={nav} onOpenActions={onOpenActions} testIdPrefix={testIdPrefix} />;\n}\n\n/** The \"Exibir\" button, with the dot that says the view has unsaved changes. */\nfunction DisplayTrigger({\n  dirty,\n  compact,\n  onOpen,\n  testIdPrefix,\n}: {\n  dirty: boolean;\n  compact: boolean;\n  onOpen: (anchor: HTMLElement) => void;\n  testIdPrefix: string;\n}): React.JSX.Element {\n  const copy = useDataViewsCopy();\n  return (\n    <Button\n      variant=\"outline\"\n      size=\"sm\"\n      color=\"neutral\"\n      onClick={(event) => onOpen(event.currentTarget as HTMLElement)}\n      dataTestId={`${testIdPrefix}-display-trigger`}\n      aria-label={copy.display.trigger}\n      title={compact ? copy.display.trigger : undefined}\n    >\n      <Box component=\"span\" sx={{ display: \"inline-flex\", alignItems: \"center\", gap: 0.5 }}>\n        <DisplaySettingsRoundedIcon fontSize=\"small\" />\n        {!compact && (\n          <Box component=\"span\" sx={{ display: { xs: \"none\", sm: \"inline\" } }}>\n            {copy.display.trigger}\n          </Box>\n        )}\n        {dirty && (\n          <Box component=\"span\" sx={{ height: 6, width: 6, borderRadius: \"50%\", bgcolor: \"primary.main\" }} />\n        )}\n        {/* The chevron goes with the label. Once the control is a bare icon it\n            is already unmistakably a button, and on the rung where that happens\n            the ~24px it costs is the difference between a row that fits and one\n            that scrolls. */}\n        {!compact && <KeyboardArrowDownRoundedIcon fontSize=\"small\" />}\n      </Box>\n    </Button>\n  );\n}\n\n/**\n * The toolbar's \"Exibir\" control: one button, one popover, three tabs, and the\n * view bracketing all of it.\n */\nexport function DataViewsDisplayPanel<T extends Record<string, unknown>>({\n  c,\n  testIdPrefix,\n  sortKinds,\n  view,\n  compact,\n}: DisplayPanelProps<T>): React.JSX.Element {\n  const [anchor, setAnchor] = useState<HTMLElement | null>(null);\n  const [tab, setTab] = useState<DisplayTabKey>(\"columns\");\n  // The views REPLACE the tab body rather than opening over it — see\n  // `data-views-view-nav`. `actionsFor` is the second level of that drill-down.\n  const [viewsOpen, setViewsOpen] = useState(false);\n  const [actionsFor, setActionsFor] = useState<SavedViewSummary | null>(null);\n  // Non-null only while the views are the body — the one place that decides\n  // whether this panel is showing tabs or views.\n  const nav = viewsOpen ? view?.nav : undefined;\n  const close = (): void => setAnchor(null);\n  const leaveViews = (): void => {\n    setViewsOpen(false);\n    setActionsFor(null);\n  };\n  return (\n    <>\n      <DisplayTrigger\n        dirty={Boolean(view?.dirty)}\n        compact={Boolean(compact)}\n        onOpen={setAnchor}\n        testIdPrefix={testIdPrefix}\n      />\n      <Popover\n        open={Boolean(anchor)}\n        anchorEl={anchor}\n        onClose={close}\n        anchorOrigin={{ vertical: \"bottom\", horizontal: \"right\" }}\n        transformOrigin={{ vertical: \"top\", horizontal: \"right\" }}\n        slotProps={{ paper: { sx: { width: 320, maxWidth: \"calc(100vw - 32px)\" } } }}\n      >\n        <PanelSurface\n          c={c}\n          view={view}\n          nav={nav}\n          tab={tab}\n          onTab={(next) => {\n            setTab(next);\n            leaveViews();\n          }}\n          viewsOpen={viewsOpen}\n          onToggleViews={() => {\n            setViewsOpen((prev) => !prev);\n            setActionsFor(null);\n          }}\n          actionsFor={actionsFor}\n          onOpenActions={setActionsFor}\n          onBack={() => setActionsFor(null)}\n          sortKinds={sortKinds}\n          onDone={close}\n          testIdPrefix={testIdPrefix}\n        />\n      </Popover>\n    </>\n  );\n}\n"],"mappings":"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","names":["default"]}

package/dist/chunk-V44U7H4M.js

@@ -0,0 +1,38 @@
+import {
+  useAddressAutocomplete
+} from "./chunk-ZOUWHGV3.js";
+import {
+  AddressFallbackField
+} from "./chunk-7SZ3PFZW.js";
+import {
+  AddressAutocompleteField
+} from "./chunk-75KRWRJA.js";
+import {
+  resolveAddressProps
+} from "./chunk-MTGEJRE4.js";
+
+// src/components/form/AddressAutocomplete/AddressAutocomplete.tsx
+import LocationIcon from "@mui/icons-material/LocationOn";
+import { jsx } from "react/jsx-runtime";
+var AddressAutocomplete = (componentProps) => {
+  const resolved = resolveAddressProps(componentProps);
+  const { defaultValue, googleMapsApiKey, restrictions, onSelect, icon = /* @__PURE__ */ jsx(LocationIcon, {}) } = resolved;
+  const fieldProps = { ...resolved, icon };
+  const state = useAddressAutocomplete({
+    defaultValue,
+    googleMapsApiKey,
+    restrictions,
+    onSelect
+  });
+  if (!state.isLoaded || state.mapsError) {
+    return /* @__PURE__ */ jsx(AddressFallbackField, { ...fieldProps, mapsError: state.mapsError });
+  }
+  return /* @__PURE__ */ jsx(AddressAutocompleteField, { ...fieldProps, ...state });
+};
+var AddressAutocomplete_default = AddressAutocomplete;
+
+export {
+  AddressAutocomplete,
+  AddressAutocomplete_default
+};
+//# sourceMappingURL=chunk-V44U7H4M.js.map

package/dist/chunk-V5P5Q6HM.js

@@ -0,0 +1,108 @@
+import {
+  MapCoordinates,
+  MapMarkers
+} from "./chunk-FRW4SYZD.js";
+import {
+  MapLayers
+} from "./chunk-SHDIZSN5.js";
+import {
+  StaticMapView
+} from "./chunk-WBKWIFXA.js";
+import {
+  glassStyles,
+  resolveMapPreviewProps
+} from "./chunk-ACZH2NUW.js";
+import {
+  useMapPreview
+} from "./chunk-AGYGNNOM.js";
+
+// src/components/data-display/MapPreview/MapPreview.tsx
+import Box from "@mui/material/Box/index.js";
+import Paper from "@mui/material/Paper/index.js";
+import { alpha, styled, useTheme } from "@mui/material/styles/index.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+var MapContainer = styled(Paper)(({ theme }) => ({
+  position: "relative",
+  width: "100%",
+  borderRadius: theme.shape.borderRadius * 2,
+  overflow: "hidden",
+  background: `linear-gradient(135deg, ${alpha(theme.palette.background.paper, 0.9)} 0%, ${alpha(theme.palette.background.paper, 0.8)} 100%)`,
+  border: `1px solid ${alpha(theme.palette.divider, 0.18)}`
+}));
+var MapWrapper = styled(Box)(({ height }) => ({
+  width: "100%",
+  height,
+  position: "relative"
+}));
+var cursorFor = (grabbing, interactive) => {
+  if (grabbing) return "grabbing";
+  return interactive ? "grab" : "default";
+};
+var MapPreview = (componentProps) => {
+  const props = resolveMapPreviewProps(componentProps);
+  const theme = useTheme();
+  const { containerRef, view, controls, pointer, search, handleMapClick } = useMapPreview(props);
+  const height = controls.isFullscreen ? "100vh" : props.height;
+  const grabbing = pointer.isDragging || pointer.isPanning;
+  return /* @__PURE__ */ jsx(
+    MapContainer,
+    {
+      ref: containerRef,
+      elevation: props.variant === "glass" ? 0 : 2,
+      "data-testid": "map-preview-container",
+      role: "img",
+      "aria-label": `Map preview centered at ${view.markerPosition.lat.toFixed(4)}, ${view.markerPosition.lng.toFixed(4)} with zoom level ${view.zoom}`,
+      tabIndex: 0,
+      "aria-live": "polite",
+      "aria-atomic": "true",
+      sx: glassStyles(props.variant, theme),
+      children: /* @__PURE__ */ jsxs(
+        MapWrapper,
+        {
+          height,
+          onClick: handleMapClick,
+          onMouseDown: pointer.handleMouseDown,
+          onMouseMove: pointer.handleMouseMove,
+          onMouseUp: pointer.handleMouseUp,
+          onMouseLeave: pointer.handleMouseUp,
+          style: {
+            cursor: cursorFor(grabbing, props.interactive),
+            transition: props.animated ? "all 0.3s ease" : "none"
+          },
+          children: [
+            /* @__PURE__ */ jsx(
+              StaticMapView,
+              {
+                height,
+                zoom: view.zoom,
+                mapType: view.mapType,
+                marker: props.marker && props.markers.length === 0,
+                markerPosition: view.markerPosition,
+                panOffset: view.panOffset
+              }
+            ),
+            /* @__PURE__ */ jsx(MapMarkers, { markers: props.markers, centre: view.markerPosition, animated: props.animated }),
+            /* @__PURE__ */ jsx(
+              MapLayers,
+              {
+                settings: props,
+                zoom: view.zoom,
+                mapType: view.mapType,
+                search,
+                controls
+              }
+            ),
+            /* @__PURE__ */ jsx(MapCoordinates, { position: view.markerPosition, zoom: view.zoom })
+          ]
+        }
+      )
+    }
+  );
+};
+var MapPreview_default = MapPreview;
+
+export {
+  MapPreview,
+  MapPreview_default
+};
+//# sourceMappingURL=chunk-V5P5Q6HM.js.map

package/dist/chunk-V5P5Q6HM.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/MapPreview/MapPreview.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport Paper from '@mui/material/Paper/index.js';\nimport { alpha, styled, useTheme } from '@mui/material/styles/index.js';\nimport type { FC } from 'react';\nimport React from 'react';\n\nimport { glassStyles, resolveMapPreviewProps } from './MapPreview.helpers';\nimport type { MapPreviewProps } from './MapPreview.types';\nimport { MapLayers } from './MapLayers';\nimport { MapCoordinates, MapMarkers } from './MapMarkers';\nimport { StaticMapView } from './StaticMapView';\nimport { useMapPreview } from './useMapPreview';\n\n// Kept module-local: styled() components cannot be exported across a module\n// boundary here without tripping TS2742.\nconst MapContainer = styled(Paper)(({ theme }) => ({\n  position: 'relative',\n  width: '100%',\n  borderRadius: theme.shape.borderRadius * 2,\n  overflow: 'hidden',\n  background: `linear-gradient(135deg, ${alpha(theme.palette.background.paper, 0.9)} 0%, ${alpha(theme.palette.background.paper, 0.8)} 100%)`,\n  border: `1px solid ${alpha(theme.palette.divider, 0.18)}`,\n}));\n\nconst MapWrapper = styled(Box)<{ height: string }>(({ height }) => ({\n  width: '100%',\n  height,\n  position: 'relative',\n}));\n\nconst cursorFor = (grabbing: boolean, interactive: boolean): string => {\n  if (grabbing) return 'grabbing';\n  return interactive ? 'grab' : 'default';\n};\n\nexport const MapPreview: FC<MapPreviewProps> = (componentProps) => {\n  const props = resolveMapPreviewProps(componentProps);\n  const theme = useTheme();\n  const { containerRef, view, controls, pointer, search, handleMapClick } = useMapPreview(props);\n\n  const height = controls.isFullscreen ? '100vh' : props.height;\n  const grabbing = pointer.isDragging || pointer.isPanning;\n\n  return (\n    <MapContainer\n      ref={containerRef}\n      elevation={props.variant === 'glass' ? 0 : 2}\n      data-testid=\"map-preview-container\"\n      role=\"img\"\n      aria-label={`Map preview centered at ${view.markerPosition.lat.toFixed(4)}, ${view.markerPosition.lng.toFixed(4)} with zoom level ${view.zoom}`}\n      tabIndex={0}\n      aria-live=\"polite\"\n      aria-atomic=\"true\"\n      sx={glassStyles(props.variant, theme)}\n    >\n      <MapWrapper\n        height={height}\n        onClick={handleMapClick}\n        onMouseDown={pointer.handleMouseDown}\n        onMouseMove={pointer.handleMouseMove}\n        onMouseUp={pointer.handleMouseUp}\n        onMouseLeave={pointer.handleMouseUp}\n        style={{\n          cursor: cursorFor(grabbing, props.interactive),\n          transition: props.animated ? 'all 0.3s ease' : 'none',\n        }}\n      >\n        <StaticMapView\n          height={height}\n          zoom={view.zoom}\n          mapType={view.mapType}\n          // The built-in centre marker steps aside for an explicit marker list.\n          marker={props.marker && props.markers.length === 0}\n          markerPosition={view.markerPosition}\n          panOffset={view.panOffset}\n        />\n\n        <MapMarkers markers={props.markers} centre={view.markerPosition} animated={props.animated} />\n\n        <MapLayers\n          settings={props}\n          zoom={view.zoom}\n          mapType={view.mapType}\n          search={search}\n          controls={controls}\n        />\n\n        <MapCoordinates position={view.markerPosition} zoom={view.zoom} />\n      </MapWrapper>\n    </MapContainer>\n  );\n};\n\nexport default MapPreview;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,OAAO,SAAS;AAChB,OAAO,WAAW;AAClB,SAAS,OAAO,QAAQ,gBAAgB;AAqDlC,SAYE,KAZF;AAxCN,IAAM,eAAe,OAAO,KAAK,EAAE,CAAC,EAAE,MAAM,OAAO;AAAA,EACjD,UAAU;AAAA,EACV,OAAO;AAAA,EACP,cAAc,MAAM,MAAM,eAAe;AAAA,EACzC,UAAU;AAAA,EACV,YAAY,2BAA2B,MAAM,MAAM,QAAQ,WAAW,OAAO,GAAG,CAAC,QAAQ,MAAM,MAAM,QAAQ,WAAW,OAAO,GAAG,CAAC;AAAA,EACnI,QAAQ,aAAa,MAAM,MAAM,QAAQ,SAAS,IAAI,CAAC;AACzD,EAAE;AAEF,IAAM,aAAa,OAAO,GAAG,EAAsB,CAAC,EAAE,OAAO,OAAO;AAAA,EAClE,OAAO;AAAA,EACP;AAAA,EACA,UAAU;AACZ,EAAE;AAEF,IAAM,YAAY,CAAC,UAAmB,gBAAiC;AACrE,MAAI,SAAU,QAAO;AACrB,SAAO,cAAc,SAAS;AAChC;AAEO,IAAM,aAAkC,CAAC,mBAAmB;AACjE,QAAM,QAAQ,uBAAuB,cAAc;AACnD,QAAM,QAAQ,SAAS;AACvB,QAAM,EAAE,cAAc,MAAM,UAAU,SAAS,QAAQ,eAAe,IAAI,cAAc,KAAK;AAE7F,QAAM,SAAS,SAAS,eAAe,UAAU,MAAM;AACvD,QAAM,WAAW,QAAQ,cAAc,QAAQ;AAE/C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,WAAW,MAAM,YAAY,UAAU,IAAI;AAAA,MAC3C,eAAY;AAAA,MACZ,MAAK;AAAA,MACL,cAAY,2BAA2B,KAAK,eAAe,IAAI,QAAQ,CAAC,CAAC,KAAK,KAAK,eAAe,IAAI,QAAQ,CAAC,CAAC,oBAAoB,KAAK,IAAI;AAAA,MAC7I,UAAU;AAAA,MACV,aAAU;AAAA,MACV,eAAY;AAAA,MACZ,IAAI,YAAY,MAAM,SAAS,KAAK;AAAA,MAEpC;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,SAAS;AAAA,UACT,aAAa,QAAQ;AAAA,UACrB,aAAa,QAAQ;AAAA,UACrB,WAAW,QAAQ;AAAA,UACnB,cAAc,QAAQ;AAAA,UACtB,OAAO;AAAA,YACL,QAAQ,UAAU,UAAU,MAAM,WAAW;AAAA,YAC7C,YAAY,MAAM,WAAW,kBAAkB;AAAA,UACjD;AAAA,UAEA;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC;AAAA,gBACA,MAAM,KAAK;AAAA,gBACX,SAAS,KAAK;AAAA,gBAEd,QAAQ,MAAM,UAAU,MAAM,QAAQ,WAAW;AAAA,gBACjD,gBAAgB,KAAK;AAAA,gBACrB,WAAW,KAAK;AAAA;AAAA,YAClB;AAAA,YAEA,oBAAC,cAAW,SAAS,MAAM,SAAS,QAAQ,KAAK,gBAAgB,UAAU,MAAM,UAAU;AAAA,YAE3F;AAAA,cAAC;AAAA;AAAA,gBACC,UAAU;AAAA,gBACV,MAAM,KAAK;AAAA,gBACX,SAAS,KAAK;AAAA,gBACd;AAAA,gBACA;AAAA;AAAA,YACF;AAAA,YAEA,oBAAC,kBAAe,UAAU,KAAK,gBAAgB,MAAM,KAAK,MAAM;AAAA;AAAA;AAAA,MAClE;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,qBAAQ;","names":[]}

package/dist/chunk-V7TPSQOH.js

@@ -0,0 +1,96 @@
+import {
+  otpSlotSx
+} from "./chunk-5QQWAIZO.js";
+import {
+  useOtpDigits
+} from "./chunk-UETHX57J.js";
+import {
+  withDefaults
+} from "./chunk-HPK33ACY.js";
+
+// src/components/form/InputOTP/InputOTP.tsx
+import Box from "@mui/material/Box/index.js";
+import TextField from "@mui/material/TextField/index.js";
+import { styled } from "@mui/material/styles/index.js";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+var StyledOTPInput = styled(TextField, {
+  shouldForwardProp: (prop) => !["customColor", "customSize", "glass", "gradient"].includes(prop)
+})(({ theme, ...flags }) => ({ ...otpSlotSx(theme, flags) }));
+var DEFAULTS = {
+  variant: "numeric",
+  color: "primary",
+  size: "md",
+  length: 6,
+  value: "",
+  glass: false,
+  gradient: false,
+  autoFocus: false,
+  error: false,
+  disabled: false
+};
+var InputOTP = forwardRef((props, ref) => {
+  const {
+    variant,
+    color,
+    size,
+    length,
+    value,
+    onChange,
+    onComplete,
+    glass,
+    gradient,
+    autoFocus,
+    error,
+    disabled,
+    dataTestId,
+    ...rest
+  } = withDefaults(props, DEFAULTS);
+  const { digits, inputRefs, handleInputChange, handleKeyDown, handlePaste } = useOtpDigits({
+    variant,
+    length,
+    value,
+    onChange,
+    onComplete
+  });
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      ref,
+      "data-testid": dataTestId,
+      sx: { display: "flex", gap: 1, justifyContent: "center", alignItems: "center" },
+      ...rest,
+      children: digits.map((digit, index) => /* @__PURE__ */ jsx(
+        StyledOTPInput,
+        {
+          ref: (el) => {
+            inputRefs.current[index] = el?.querySelector("input") || null;
+          },
+          customColor: color,
+          customSize: size,
+          glass,
+          gradient,
+          value: variant === "masked" ? digit ? "\u2022" : "" : digit,
+          onChange: (e) => handleInputChange(index, e.target.value),
+          onKeyDown: (e) => handleKeyDown(index, e),
+          onPaste: index === 0 ? handlePaste : void 0,
+          autoFocus: autoFocus && index === 0,
+          error,
+          disabled,
+          inputProps: {
+            maxLength: 1,
+            style: { textAlign: "center" },
+            "data-testid": dataTestId ? `${dataTestId}-slot-${index}` : void 0
+          }
+        },
+        index
+      ))
+    }
+  );
+});
+InputOTP.displayName = "InputOTP";
+
+export {
+  InputOTP
+};
+//# sourceMappingURL=chunk-V7TPSQOH.js.map

package/dist/chunk-V7TPSQOH.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/InputOTP/InputOTP.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport TextField from '@mui/material/TextField/index.js';\nimport { styled } from '@mui/material/styles/index.js';\nimport React, { forwardRef } from 'react';\n\nimport { withDefaults } from '../../../utils/withDefaults';\n\nimport { useOtpDigits } from './InputOTP.hooks';\nimport { otpSlotSx } from './InputOTP.styles';\nimport type { OtpSlotFlags } from './InputOTP.styles';\nimport type { InputOTPProps } from './InputOTP.types';\n\nconst StyledOTPInput = styled(TextField, {\n  shouldForwardProp: (prop) =>\n    !['customColor', 'customSize', 'glass', 'gradient'].includes(prop as string),\n})<OtpSlotFlags>(({ theme, ...flags }) => ({ ...otpSlotSx(theme, flags) }));\n\nconst DEFAULTS = {\n  variant: 'numeric',\n  color: 'primary',\n  size: 'md',\n  length: 6,\n  value: '',\n  glass: false,\n  gradient: false,\n  autoFocus: false,\n  error: false,\n  disabled: false,\n} satisfies Partial<InputOTPProps>;\n\ntype ResolvedProps = InputOTPProps & Required<Pick<InputOTPProps, keyof typeof DEFAULTS>>;\n\nexport const InputOTP = forwardRef<HTMLDivElement, InputOTPProps>((props, ref) => {\n  const {\n    variant, color, size, length, value, onChange, onComplete,\n    glass, gradient, autoFocus, error, disabled, dataTestId,\n    ...rest\n  } = withDefaults(props, DEFAULTS) as ResolvedProps;\n\n  const { digits, inputRefs, handleInputChange, handleKeyDown, handlePaste } = useOtpDigits({\n    variant,\n    length,\n    value,\n    onChange,\n    onComplete,\n  });\n\n  return (\n    <Box\n      ref={ref}\n      data-testid={dataTestId}\n      sx={{ display: 'flex', gap: 1, justifyContent: 'center', alignItems: 'center' }}\n      {...rest}\n    >\n      {digits.map((digit, index) => (\n        <StyledOTPInput\n          key={index}\n          ref={(el: HTMLDivElement | null) => {\n            inputRefs.current[index] = el?.querySelector('input') || null;\n          }}\n          customColor={color}\n          customSize={size}\n          glass={glass}\n          gradient={gradient}\n          // `masked` keeps the digit in state and shows a bullet in its place.\n          value={variant === 'masked' ? (digit ? '•' : '') : digit}\n          onChange={(e) => handleInputChange(index, e.target.value)}\n          onKeyDown={(e) => handleKeyDown(index, e)}\n          // Only the first slot takes a paste; it fills the rest itself.\n          onPaste={index === 0 ? handlePaste : undefined}\n          autoFocus={autoFocus && index === 0}\n          error={error}\n          disabled={disabled}\n          inputProps={{\n            maxLength: 1,\n            style: { textAlign: 'center' },\n            'data-testid': dataTestId ? `${dataTestId}-slot-${index}` : undefined,\n          }}\n        />\n      ))}\n    </Box>\n  );\n});\n\nInputOTP.displayName = 'InputOTP';\n"],"mappings":";;;;;;;;;;;AAAA,OAAO,SAAS;AAChB,OAAO,eAAe;AACtB,SAAS,cAAc;AACvB,SAAgB,kBAAkB;AAoD1B;AA3CR,IAAM,iBAAiB,OAAO,WAAW;AAAA,EACvC,mBAAmB,CAAC,SAClB,CAAC,CAAC,eAAe,cAAc,SAAS,UAAU,EAAE,SAAS,IAAc;AAC/E,CAAC,EAAgB,CAAC,EAAE,OAAO,GAAG,MAAM,OAAO,EAAE,GAAG,UAAU,OAAO,KAAK,EAAE,EAAE;AAE1E,IAAM,WAAW;AAAA,EACf,SAAS;AAAA,EACT,OAAO;AAAA,EACP,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,OAAO;AAAA,EACP,UAAU;AAAA,EACV,WAAW;AAAA,EACX,OAAO;AAAA,EACP,UAAU;AACZ;AAIO,IAAM,WAAW,WAA0C,CAAC,OAAO,QAAQ;AAChF,QAAM;AAAA,IACJ;AAAA,IAAS;AAAA,IAAO;AAAA,IAAM;AAAA,IAAQ;AAAA,IAAO;AAAA,IAAU;AAAA,IAC/C;AAAA,IAAO;AAAA,IAAU;AAAA,IAAW;AAAA,IAAO;AAAA,IAAU;AAAA,IAC7C,GAAG;AAAA,EACL,IAAI,aAAa,OAAO,QAAQ;AAEhC,QAAM,EAAE,QAAQ,WAAW,mBAAmB,eAAe,YAAY,IAAI,aAAa;AAAA,IACxF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,eAAa;AAAA,MACb,IAAI,EAAE,SAAS,QAAQ,KAAK,GAAG,gBAAgB,UAAU,YAAY,SAAS;AAAA,MAC7E,GAAG;AAAA,MAEH,iBAAO,IAAI,CAAC,OAAO,UAClB;AAAA,QAAC;AAAA;AAAA,UAEC,KAAK,CAAC,OAA8B;AAClC,sBAAU,QAAQ,KAAK,IAAI,IAAI,cAAc,OAAO,KAAK;AAAA,UAC3D;AAAA,UACA,aAAa;AAAA,UACb,YAAY;AAAA,UACZ;AAAA,UACA;AAAA,UAEA,OAAO,YAAY,WAAY,QAAQ,WAAM,KAAM;AAAA,UACnD,UAAU,CAAC,MAAM,kBAAkB,OAAO,EAAE,OAAO,KAAK;AAAA,UACxD,WAAW,CAAC,MAAM,cAAc,OAAO,CAAC;AAAA,UAExC,SAAS,UAAU,IAAI,cAAc;AAAA,UACrC,WAAW,aAAa,UAAU;AAAA,UAClC;AAAA,UACA;AAAA,UACA,YAAY;AAAA,YACV,WAAW;AAAA,YACX,OAAO,EAAE,WAAW,SAAS;AAAA,YAC7B,eAAe,aAAa,GAAG,UAAU,SAAS,KAAK,KAAK;AAAA,UAC9D;AAAA;AAAA,QArBK;AAAA,MAsBP,CACD;AAAA;AAAA,EACH;AAEJ,CAAC;AAED,SAAS,cAAc;","names":[]}