@12-apps/ui 6.54.1 → 6.56.0

package/dist/chunk-Y2HCYT5W.js

@@ -0,0 +1,131 @@
+import {
+  useDataViewsCopy
+} from "./chunk-KHG57NAE.js";
+import {
+  createConfirmButton
+} from "./chunk-L4HUZCKV.js";
+import {
+  Dialog,
+  DialogContent
+} from "./chunk-AL3Z24VG.js";
+import {
+  default as default2
+} from "./chunk-6DPAWXZ3.js";
+import {
+  default as default3
+} from "./chunk-WEBEOBN5.js";
+import {
+  Button
+} from "./chunk-JE6FNSQV.js";
+import {
+  Text
+} from "./chunk-AJBRO76D.js";
+
+// src/components/data-display/DataViews/ManageViewsDialog.tsx
+import { useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function tags(view) {
+  const copy = useDataViewsCopy();
+  const list = [];
+  if (view.isDefault) list.push(copy.manageViews.defaultTag);
+  if (view.pinned) list.push("Fixada");
+  if (view.shared) list.push("Compartilhada");
+  if (!view.isOwner) list.push(copy.manageViews.otherUserTag);
+  return list;
+}
+function ManageViewRow({
+  view,
+  onEdit,
+  onDelete,
+  testIdPrefix,
+  confirmCopy
+}) {
+  const ConfirmButton = useMemo(
+    () => createConfirmButton(confirmCopy, confirmCopy.defaultError),
+    [confirmCopy]
+  );
+  const copy = useDataViewsCopy();
+  return /* @__PURE__ */ jsxs(
+    default3,
+    {
+      direction: "row",
+      spacing: 1,
+      sx: { alignItems: "center", justifyContent: "space-between" },
+      "data-testid": `${testIdPrefix}-manage-row-${view.id}`,
+      children: [
+        /* @__PURE__ */ jsxs(default2, { sx: { minWidth: 0 }, children: [
+          /* @__PURE__ */ jsx(Text, { variant: "body", size: "sm", as: "span", weight: "semibold", children: view.name }),
+          view.description && /* @__PURE__ */ jsx(Text, { variant: "caption", as: "p", color: "secondary", children: view.description }),
+          tags(view).length > 0 && /* @__PURE__ */ jsx(Text, { variant: "caption", as: "p", color: "secondary", children: tags(view).join(" \xB7 ") })
+        ] }),
+        view.isOwner && /* @__PURE__ */ jsxs(default3, { direction: "row", spacing: 1, sx: { flex: "0 0 auto" }, children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "text",
+              size: "sm",
+              onClick: () => onEdit(view),
+              dataTestId: `${testIdPrefix}-manage-edit-${view.id}`,
+              children: copy.manageViews.edit
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            ConfirmButton,
+            {
+              variant: "text",
+              size: "sm",
+              color: "danger",
+              onClick: () => onDelete(view),
+              confirm: {
+                title: copy.manageViews.deleteTitle,
+                entityName: view.name,
+                description: copy.manageViews.deleteBody,
+                confirmText: copy.manageViews.deleteConfirm
+              },
+              dataTestId: `${testIdPrefix}-manage-delete-${view.id}`,
+              children: copy.manageViews.deleteConfirm
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+function ManageViewsDialog({
+  open,
+  onClose,
+  views,
+  onEdit,
+  onDelete,
+  testIdPrefix = "views",
+  confirmCopy
+}) {
+  const copy = useDataViewsCopy();
+  return /* @__PURE__ */ jsx(
+    Dialog,
+    {
+      open,
+      onClose,
+      title: copy.manageViews.title,
+      size: "md",
+      showCloseButton: true,
+      dataTestId: `${testIdPrefix}-manage-dialog`,
+      children: /* @__PURE__ */ jsx(DialogContent, { children: /* @__PURE__ */ jsx(default3, { spacing: 1.5, "data-testid": `${testIdPrefix}-manage-list`, children: views.length === 0 ? /* @__PURE__ */ jsx(Text, { variant: "body", as: "p", children: copy.manageViews.empty }) : views.map((view) => /* @__PURE__ */ jsx(
+        ManageViewRow,
+        {
+          confirmCopy,
+          view,
+          onEdit,
+          onDelete,
+          testIdPrefix
+        },
+        view.id
+      )) }) })
+    }
+  );
+}
+
+export {
+  ManageViewsDialog
+};
+//# sourceMappingURL=chunk-Y2HCYT5W.js.map

package/dist/chunk-Y4T33THY.js

@@ -0,0 +1,222 @@
+import {
+  PaletteResults
+} from "./chunk-2ARVNCVU.js";
+import {
+  ShortcutChip
+} from "./chunk-Z6MCTGIK.js";
+import {
+  useCommandPalette
+} from "./chunk-SUZXPDUQ.js";
+import {
+  scrim
+} from "./chunk-SSX5ITPM.js";
+import {
+  rem,
+  sxRem
+} from "./chunk-YKCAJ2TN.js";
+
+// src/components/navigation/CommandPalette/CommandPalette.tsx
+import CloseIcon from "@mui/icons-material/Close";
+import EnterIcon from "@mui/icons-material/KeyboardReturn";
+import SearchIcon from "@mui/icons-material/Search";
+import Box from "@mui/material/Box/index.js";
+import Dialog from "@mui/material/Dialog/index.js";
+import DialogContent from "@mui/material/DialogContent/index.js";
+import IconButton from "@mui/material/IconButton/index.js";
+import InputBase from "@mui/material/InputBase/index.js";
+import Paper from "@mui/material/Paper/index.js";
+import Slide from "@mui/material/Slide/index.js";
+import Typography from "@mui/material/Typography/index.js";
+import { alpha, styled, useTheme } from "@mui/material/styles/index.js";
+import React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var StyledDialog = styled(Dialog)(({ theme }) => ({
+  "& .MuiBackdrop-root": {
+    backgroundColor: scrim(theme, 0.6),
+    backdropFilter: `blur(${rem(theme, 4)})`
+  },
+  "& .MuiDialog-paper": {
+    position: "fixed",
+    top: "20%",
+    margin: 0,
+    maxHeight: "none",
+    background: "transparent",
+    boxShadow: "none",
+    overflow: "visible"
+  }
+}));
+var PaletteContainer = styled(Paper)(({ theme }) => ({
+  width: "100%",
+  maxWidth: rem(theme, 640),
+  background: `linear-gradient(135deg, ${alpha(theme.palette.background.paper, 0.98)} 0%, ${alpha(theme.palette.background.paper, 0.95)} 100%)`,
+  backdropFilter: `blur(${rem(theme, 20)})`,
+  WebkitBackdropFilter: `blur(${rem(theme, 20)})`,
+  border: `1px solid ${alpha(theme.palette.divider, 0.18)}`,
+  borderRadius: theme.shape.borderRadius * 2,
+  overflow: "hidden",
+  boxShadow: theme.shadows[24]
+}));
+var SearchContainer = styled(Box)(({ theme }) => ({
+  display: "flex",
+  alignItems: "center",
+  padding: theme.spacing(2),
+  borderBottom: `1px solid ${alpha(theme.palette.divider, 0.12)}`,
+  background: alpha(theme.palette.background.default, 0.4)
+}));
+var SearchInput = styled(InputBase)(({ theme }) => ({
+  flex: 1,
+  fontSize: rem(theme, 18),
+  fontWeight: 400,
+  "& input": {
+    padding: theme.spacing(0, 1),
+    "&::placeholder": {
+      color: theme.palette.text.secondary,
+      opacity: 0.8
+    }
+  }
+}));
+var Transition = React.forwardRef(
+  function Transition2(props, ref) {
+    return /* @__PURE__ */ jsx(Slide, { direction: "down", ref, ...props });
+  }
+);
+var PaletteSearch = ({ inputRef, placeholder, value, dataTestId, onChange, onClose }) => /* @__PURE__ */ jsxs(SearchContainer, { children: [
+  /* @__PURE__ */ jsx(SearchIcon, { sx: { color: "text.secondary", mr: 1 } }),
+  /* @__PURE__ */ jsx(
+    SearchInput,
+    {
+      ref: inputRef,
+      placeholder,
+      value,
+      onChange,
+      autoComplete: "off",
+      autoCorrect: "off",
+      autoCapitalize: "off",
+      spellCheck: "false",
+      inputProps: { "data-testid": `${dataTestId}-input` }
+    }
+  ),
+  /* @__PURE__ */ jsx(IconButton, { size: "small", onClick: onClose, sx: { ml: 1 }, children: /* @__PURE__ */ jsx(CloseIcon, { fontSize: "small" }) })
+] });
+var PaletteFooter = ({
+  commandCount,
+  copy
+}) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      sx: {
+        display: "flex",
+        justifyContent: "space-between",
+        alignItems: "center",
+        padding: 1,
+        borderTop: `1px solid ${alpha(theme.palette.divider, 0.12)}`,
+        background: alpha(theme.palette.background.default, 0.4)
+      },
+      children: [
+        /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", gap: 1 }, children: [
+          /* @__PURE__ */ jsx(
+            ShortcutChip,
+            {
+              icon: /* @__PURE__ */ jsx(EnterIcon, { sx: { fontSize: sxRem(12) } }),
+              label: copy.execute,
+              size: "small"
+            }
+          ),
+          /* @__PURE__ */ jsx(ShortcutChip, { label: copy.navigate, size: "small" }),
+          /* @__PURE__ */ jsx(ShortcutChip, { label: copy.close, size: "small" })
+        ] }),
+        /* @__PURE__ */ jsxs(Typography, { variant: "caption", color: "text.secondary", children: [
+          commandCount,
+          " commands"
+        ] })
+      ]
+    }
+  );
+};
+var CommandPalette = ({
+  copy,
+  open,
+  onClose,
+  commands,
+  placeholder = "Type a command or search...",
+  width,
+  maxHeight,
+  showRecent = true,
+  recentCommands = [],
+  onCommandExecute,
+  dataTestId = "command-palette"
+}) => {
+  const {
+    searchQuery,
+    setSearchQuery,
+    selectedIndex,
+    setSelectedIndex,
+    searchInputRef,
+    listRef,
+    filteredCommands,
+    groupedCommands,
+    executeCommand,
+    recentCommandIds
+  } = useCommandPalette({
+    open,
+    commands,
+    showRecent,
+    recentCommands,
+    onCommandExecute,
+    onClose
+  });
+  const handleSearchChange = (event) => {
+    setSearchQuery(event.target.value);
+  };
+  return /* @__PURE__ */ jsx(
+    StyledDialog,
+    {
+      open,
+      onClose,
+      TransitionComponent: Transition,
+      maxWidth: false,
+      fullWidth: true,
+      "data-testid": dataTestId,
+      children: /* @__PURE__ */ jsx(DialogContent, { sx: { overflow: "visible", p: 0 }, children: /* @__PURE__ */ jsxs(PaletteContainer, { elevation: 24, sx: { width: width ?? sxRem(640), maxHeight: maxHeight ?? sxRem(400) }, children: [
+        /* @__PURE__ */ jsx(
+          PaletteSearch,
+          {
+            inputRef: searchInputRef,
+            placeholder,
+            value: searchQuery,
+            dataTestId,
+            onChange: handleSearchChange,
+            onClose
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          PaletteResults,
+          {
+            copy,
+            listRef,
+            dataTestId,
+            searchQuery,
+            showRecent,
+            commands,
+            recentCommandIds,
+            filteredCommands,
+            groupedCommands,
+            selectedIndex,
+            onSelect: setSelectedIndex,
+            onExecute: executeCommand
+          }
+        ),
+        /* @__PURE__ */ jsx(PaletteFooter, { copy, commandCount: filteredCommands.length })
+      ] }) })
+    }
+  );
+};
+var CommandPalette_default = CommandPalette;
+
+export {
+  CommandPalette,
+  CommandPalette_default
+};
+//# sourceMappingURL=chunk-Y4T33THY.js.map

package/dist/chunk-YBFDLR3C.js

@@ -0,0 +1,53 @@
+import {
+  useCardActions
+} from "./chunk-UZANFXCK.js";
+import {
+  ConfirmActionDialog
+} from "./chunk-2FGWKMW2.js";
+import {
+  useConfirmAction
+} from "./chunk-EMYESBIT.js";
+
+// src/components/data-display/CardKit/use-remove-confirm.tsx
+import { jsx } from "react/jsx-runtime";
+function useRemoveConfirm({
+  write,
+  title,
+  entityName,
+  description,
+  confirmText,
+  fallbackError,
+  dataTestId,
+  copy
+}) {
+  const { onRefresh, notifyError } = useCardActions();
+  const state = useConfirmAction(async () => {
+    const result = await write();
+    if (!result.ok) {
+      const message = result.error ?? fallbackError;
+      notifyError(message);
+      throw new Error(message);
+    }
+    onRefresh();
+  }, fallbackError);
+  return {
+    request: state.request,
+    dialog: /* @__PURE__ */ jsx(
+      ConfirmActionDialog,
+      {
+        state,
+        copy,
+        title,
+        entityName,
+        description,
+        confirmText,
+        dataTestId
+      }
+    )
+  };
+}
+
+export {
+  useRemoveConfirm
+};
+//# sourceMappingURL=chunk-YBFDLR3C.js.map

package/dist/chunk-YCYGUTQX.js

@@ -0,0 +1,111 @@
+import {
+  glassStyles,
+  resolveMapPreviewProps
+} from "./chunk-4NQXHPQR.js";
+import {
+  MapCoordinates,
+  MapMarkers
+} from "./chunk-ZS5KKRTJ.js";
+import {
+  MapLayers
+} from "./chunk-WSUHTLOA.js";
+import {
+  useMapPreview
+} from "./chunk-QSRZOXQI.js";
+import {
+  StaticMapView
+} from "./chunk-QPNKYNH2.js";
+import {
+  rem
+} from "./chunk-YKCAJ2TN.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 ?? rem(theme, 400);
+  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-YCYGUTQX.js.map

package/dist/chunk-YMWJ7Z5I.js

@@ -0,0 +1,78 @@
+import {
+  getOverflowStyle,
+  getVariantStyles,
+  sizeCss
+} from "./chunk-EMGNK2KG.js";
+import {
+  rem
+} from "./chunk-YKCAJ2TN.js";
+
+// src/components/layout/ScrollArea/ScrollViewport.tsx
+import Box from "@mui/material/Box/index.js";
+import { useTheme } from "@mui/material/styles/index.js";
+import { jsx } from "react/jsx-runtime";
+var ScrollViewport = ({
+  regionLabel,
+  children,
+  height,
+  maxHeight,
+  orientation,
+  scrollbarSize,
+  scrollbarColor,
+  scrollbarTrackColor,
+  contentPadding,
+  variant,
+  disabled,
+  loading,
+  smoothScroll,
+  shouldShowScrollbar,
+  setScrollRef,
+  onScroll
+}) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      ref: setScrollRef,
+      onScroll,
+      role: "region",
+      "aria-label": regionLabel,
+      "aria-busy": loading,
+      tabIndex: disabled ? -1 : 0,
+      sx: {
+        width: "100%",
+        height: "100%",
+        // Use an explicit maxHeight when height is 'auto', else inherit.
+        maxHeight: height === "auto" && maxHeight ? sizeCss(theme, maxHeight) : "100%",
+        padding: contentPadding,
+        opacity: loading ? 0.5 : 1,
+        pointerEvents: disabled || loading ? "none" : "auto",
+        transition: "opacity 0.3s ease",
+        "&:focus": {
+          outline: "none",
+          "&:focus-visible": {
+            outline: `${rem(theme, 2)} solid ${theme.palette.primary.main}`,
+            outlineOffset: rem(theme, -2)
+          }
+        },
+        ...getOverflowStyle({ disabled, orientation }),
+        ...getVariantStyles({
+          theme,
+          variant,
+          orientation,
+          scrollbarSize,
+          scrollbarColor,
+          scrollbarTrackColor,
+          shouldShowScrollbar
+        })
+      },
+      style: { scrollBehavior: smoothScroll ? "smooth" : "auto" },
+      children
+    }
+  );
+};
+
+export {
+  ScrollViewport
+};
+//# sourceMappingURL=chunk-YMWJ7Z5I.js.map