@12-apps/ui 6.33.1 → 6.34.0

package/dist/chunk-7FWXG2KF.js

@@ -1,165 +0,0 @@
-import {
-  useDataViewsCopy
-} from "./chunk-KHG57NAE.js";
-import {
-  DropdownMenu
-} from "./chunk-IDHZHOZW.js";
-import {
-  default as default2
-} from "./chunk-6DPAWXZ3.js";
-import {
-  Button
-} from "./chunk-6MDBMCFK.js";
-
-// src/components/data-display/DataViews/data-views-grid-helpers.tsx
-import { jsx, jsxs } from "react/jsx-runtime";
-function isActionsColumn(col) {
-  return col.type === "actions" || col.id === "actions";
-}
-function buildGridColumns(columns, visibleColumns, onRowClick) {
-  return columns.map((col) => {
-    const hidden = col.hideable !== false && !visibleColumns.includes(col.id);
-    if (!onRowClick || isActionsColumn(col)) return { ...col, hidden };
-    return {
-      ...col,
-      hidden,
-      cell: (ctx) => {
-        const content = col.cell ? col.cell(ctx) : ctx.value == null ? "" : String(ctx.value);
-        return /* @__PURE__ */ jsx(
-          default2,
-          {
-            onClick: () => onRowClick(ctx.row),
-            sx: { cursor: "pointer", width: "100%", height: "100%", display: "flex", alignItems: "center" },
-            children: content
-          }
-        );
-      }
-    };
-  });
-}
-function buildRowActionsColumn(config) {
-  const { rowActions, leading, testIdPrefix, getRowId, renderRowMenu } = config;
-  const kebabActions = rowActions.filter((action) => action.row !== false);
-  return {
-    id: "actions",
-    header: "",
-    type: "actions",
-    enableSort: false,
-    hideable: false,
-    // Narrow: the column only holds the "⋮" kebab (plus an optional leading icon),
-    // so it needs room for just one or two icons.
-    width: leading ? 72 : 44,
-    cell: ({ row }) => /* @__PURE__ */ jsxs("span", { style: { display: "inline-flex", alignItems: "center", gap: 2, justifyContent: "flex-end" }, children: [
-      leading?.(row),
-      renderRowMenu ? renderRowMenu(row) : renderAutoKebab(kebabActions, row, testIdPrefix, getRowId)
-    ] })
-  };
-}
-function renderAutoKebab(kebabActions, row, testIdPrefix, getRowId) {
-  const copy = useDataViewsCopy();
-  const items = kebabActions.filter((action) => action.isVisible?.(row) ?? true).map((action) => ({
-    id: action.id,
-    label: action.rowLabel ? action.rowLabel(row) : action.label,
-    color: action.color,
-    onClick: () => void action.onSelect([row])
-  }));
-  if (items.length === 0) return null;
-  return /* @__PURE__ */ jsx(
-    DropdownMenu,
-    {
-      size: "sm",
-      items,
-      trigger: /* @__PURE__ */ jsx(Button, { variant: "text", size: "sm", dataTestId: `${testIdPrefix}-actions-${getRowId(row)}`, "aria-label": copy.grid.rowActions, children: "\u22EE" })
-    }
-  );
-}
-function defaultSortFields(columns) {
-  return columns.filter(
-    (col) => col.enableSort !== false && col.type !== "actions" && col.id !== "actions" && typeof col.header === "string" && col.header !== ""
-  ).map((col) => ({
-    value: col.id,
-    label: col.header,
-    orderOptions: [
-      { value: "asc", label: "Crescente" },
-      { value: "desc", label: "Decrescente" }
-    ]
-  }));
-}
-function computeActiveFilterCount(state, fields, rangeFields) {
-  const ranges = state.ranges ?? {};
-  const pillCount = fields.reduce((n, field) => n + ((state.pills[field.id]?.length ?? 0) > 0 ? 1 : 0), 0);
-  const rangeCount = rangeFields.reduce((n, field) => {
-    const range = ranges[field.id];
-    return n + (range && (range.min != null || range.max != null) ? 1 : 0);
-  }, 0);
-  return (state.search.trim() ? 1 : 0) + pillCount + rangeCount;
-}
-function bulkMenuItems(rowActions, selectedRows, clearSelection) {
-  return rowActions.filter((action) => action.bulk !== false).map((action) => {
-    const targets = action.isVisible ? selectedRows.filter(action.isVisible) : selectedRows;
-    return { action, targets };
-  }).filter(({ targets }) => targets.length > 0).map(({ action, targets }) => ({
-    id: action.id,
-    label: action.label,
-    color: action.color,
-    onClick: () => {
-      const result = action.onSelect(targets);
-      if (result instanceof Promise) {
-        void result.then(
-          () => clearSelection(),
-          () => {
-          }
-        );
-      } else {
-        clearSelection();
-      }
-    }
-  }));
-}
-function renderBulkActions({
-  rowActions,
-  bulkActions,
-  selectedRows,
-  clearSelection,
-  testIdPrefix
-}) {
-  const copy = useDataViewsCopy();
-  if (selectedRows.length === 0) return void 0;
-  if (rowActions) {
-    const items = bulkMenuItems(rowActions, selectedRows, clearSelection);
-    if (items.length === 0) return void 0;
-    return /* @__PURE__ */ jsx(
-      DropdownMenu,
-      {
-        size: "sm",
-        items,
-        trigger: /* @__PURE__ */ jsx(Button, { variant: "outline", size: "sm", dataTestId: `${testIdPrefix}-bulk-actions`, children: copy.grid.bulkActions(selectedRows.length) })
-      }
-    );
-  }
-  return bulkActions ? bulkActions(selectedRows, clearSelection) : void 0;
-}
-function togglePillValues(current, value, checked) {
-  const list = current ?? [];
-  return checked ? [...list, value] : list.filter((v) => v !== value);
-}
-function cardGridTracks(targetWidth) {
-  return {
-    gridTemplateColumns: {
-      xs: "1fr",
-      sm: `repeat(auto-fill, minmax(${targetWidth}px, 1fr))`
-    }
-  };
-}
-
-export {
-  isActionsColumn,
-  buildGridColumns,
-  buildRowActionsColumn,
-  defaultSortFields,
-  computeActiveFilterCount,
-  renderBulkActions,
-  togglePillValues,
-  cardGridTracks
-};
-//# sourceMappingURL=chunk-7FWXG2KF.js.map

package/dist/chunk-7N4V3ARN.js

@@ -1,53 +0,0 @@
-import {
-  useCardActions
-} from "./chunk-RGMSTQ2J.js";
-import {
-  ConfirmActionDialog
-} from "./chunk-QQS3GQYS.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-7N4V3ARN.js.map

package/dist/chunk-7TSQNYQO.js

@@ -1,134 +0,0 @@
-import {
-  DragHandle
-} from "./chunk-JCJGJX7V.js";
-import {
-  useDataViewsCopy
-} from "./chunk-KHG57NAE.js";
-import {
-  Checkbox
-} from "./chunk-CR4KC2K5.js";
-import {
-  default as default2
-} from "./chunk-6DPAWXZ3.js";
-
-// src/components/data-display/DataViews/base-list-card-gutters.tsx
-import KeyboardArrowRightIcon from "@mui/icons-material/KeyboardArrowRight";
-import IconButton from "@mui/material/IconButton/index.js";
-import { jsx } from "react/jsx-runtime";
-var CHECKBOX_PAD = "-9px";
-function DragSlot({
-  drag,
-  reserve,
-  testId
-}) {
-  if (!drag.draggable) return reserve ? /* @__PURE__ */ jsx(default2, { "data-slot": "drag" }) : null;
-  return (
-    // display:flex, as on the checkbox below: the grip is an inline-grid, and in
-    // a block parent an inline box sits on the text baseline — the line box adds
-    // descender leading under it (21px glyph in a 31px slot) and drops the grip
-    // 5px below the row's centre. A flex parent has no baseline to sit on.
-    /* @__PURE__ */ jsx(
-      default2,
-      {
-        "data-slot": "drag",
-        sx: { position: "relative", zIndex: 1, display: "flex", alignItems: "center" },
-        children: /* @__PURE__ */ jsx(
-          DragHandle,
-          {
-            handleProps: drag.handleProps,
-            gated: drag.handleProps !== void 0,
-            testId
-          }
-        )
-      }
-    )
-  );
-}
-function SelectSlot({
-  selectable,
-  selected,
-  reserve,
-  onToggleSelect,
-  testId
-}) {
-  const copy = useDataViewsCopy();
-  if (!selectable) return reserve ? /* @__PURE__ */ jsx(default2, { "data-slot": "select" }) : null;
-  return (
-    // z-index 1: above the stretched link, or the anchor swallows the click.
-    /* @__PURE__ */ jsx(
-      default2,
-      {
-        "data-slot": "select",
-        sx: { position: "relative", zIndex: 1, mx: CHECKBOX_PAD, display: "flex" },
-        children: /* @__PURE__ */ jsx(
-          Checkbox,
-          {
-            checked: selected,
-            onChange: () => onToggleSelect?.(),
-            onClick: (event) => {
-              event.stopPropagation();
-              onToggleSelect?.(event);
-            },
-            size: "small",
-            "data-testid": testId,
-            "aria-label": copy.selection.selectRow
-          }
-        )
-      }
-    )
-  );
-}
-function DiscloseSlot({
-  expandable,
-  expanded,
-  reserve,
-  onToggle,
-  controls,
-  testId
-}) {
-  const copy = useDataViewsCopy();
-  if (!expandable) return reserve ? /* @__PURE__ */ jsx(default2, { "data-slot": "disclose" }) : null;
-  return (
-    // z-index 1 and flex for the same reasons the other two gutters use them:
-    // above a stretched link that would otherwise swallow the click, and out of
-    // a baseline that would drop the glyph below the row's centre.
-    /* @__PURE__ */ jsx(
-      default2,
-      {
-        "data-slot": "disclose",
-        sx: { position: "relative", zIndex: 1, display: "flex", alignItems: "center" },
-        children: /* @__PURE__ */ jsx(
-          IconButton,
-          {
-            size: "small",
-            "aria-expanded": expanded,
-            "aria-controls": expanded ? controls : void 0,
-            "aria-label": expanded ? copy.selection.collapseRow : copy.selection.expandRow,
-            "data-testid": testId,
-            onClick: (event) => {
-              event.stopPropagation();
-              onToggle();
-            },
-            onKeyDown: (event) => event.stopPropagation(),
-            sx: {
-              p: 0.25,
-              transform: expanded ? "rotate(90deg)" : "rotate(0deg)",
-              transition: "transform 150ms ease",
-              // Honour a reduced-motion preference: the state is carried by the
-              // angle, not by the animation, so dropping the tween loses nothing.
-              "@media (prefers-reduced-motion: reduce)": { transition: "none" }
-            },
-            children: /* @__PURE__ */ jsx(KeyboardArrowRightIcon, { fontSize: "small" })
-          }
-        )
-      }
-    )
-  );
-}
-
-export {
-  DragSlot,
-  SelectSlot,
-  DiscloseSlot
-};
-//# sourceMappingURL=chunk-7TSQNYQO.js.map

package/dist/chunk-7VN7LFBA.js

@@ -1,80 +0,0 @@
-import {
-  resolveSkeletonProps,
-  skeletonInstanceTestId
-} from "./chunk-7WDPC46N.js";
-import {
-  defaultDimensions,
-  muiAnimationFor,
-  muiVariantFor,
-  skeletonStyles
-} from "./chunk-ZOW2CCMO.js";
-import {
-  resolveTestId,
-  withoutTestIdProps
-} from "./chunk-TYJR4GOF.js";
-
-// src/components/layout/Skeleton/Skeleton.tsx
-import Box from "@mui/material/Box/index.js";
-import MuiSkeleton from "@mui/material/Skeleton/index.js";
-import Stack from "@mui/material/Stack/index.js";
-import { useTheme } from "@mui/material/styles/index.js";
-import React from "react";
-import { jsx } from "react/jsx-runtime";
-var Skeleton = React.memo((rawProps) => {
-  const {
-    variant,
-    animation,
-    width,
-    height,
-    count,
-    spacing,
-    borderRadius,
-    className,
-    intensity,
-    glassmorphism,
-    shimmer,
-    style,
-    ...others
-  } = resolveSkeletonProps(rawProps);
-  const dataTestId = resolveTestId(others);
-  const props = withoutTestIdProps(others);
-  const theme = useTheme();
-  const defaults = defaultDimensions(variant);
-  const finalWidth = width ?? defaults.width;
-  const finalHeight = height ?? defaults.height;
-  if (count === 0) {
-    return null;
-  }
-  const singleSkeleton = /* @__PURE__ */ jsx(
-    MuiSkeleton,
-    {
-      variant: muiVariantFor(variant),
-      animation: muiAnimationFor(variant, animation),
-      width: finalWidth,
-      height: finalHeight,
-      sx: skeletonStyles(theme, {
-        intensity,
-        borderRadius,
-        glassmorphism,
-        shimmer,
-        style
-      }),
-      className,
-      "data-testid": dataTestId,
-      "aria-hidden": "true",
-      ...props
-    }
-  );
-  if (count === 1) {
-    return singleSkeleton;
-  }
-  return /* @__PURE__ */ jsx(Stack, { spacing, children: Array.from({ length: count }).map((_, index) => /* @__PURE__ */ jsx(Box, { children: React.cloneElement(singleSkeleton, {
-    "data-testid": skeletonInstanceTestId(dataTestId, index)
-  }) }, `skeleton-${index}`)) });
-});
-Skeleton.displayName = "Skeleton";
-
-export {
-  Skeleton
-};
-//# sourceMappingURL=chunk-7VN7LFBA.js.map

package/dist/chunk-7WP2HRTW.js

@@ -1,220 +0,0 @@
-// src/components/feedback/TutorialOverlay/TutorialStepBody.tsx
-import CompleteIcon from "@mui/icons-material/CheckCircle";
-import CloseIcon from "@mui/icons-material/Close";
-import PrevIcon from "@mui/icons-material/NavigateBefore";
-import NextIcon from "@mui/icons-material/NavigateNext";
-import RestartIcon from "@mui/icons-material/Refresh";
-import Box from "@mui/material/Box/index.js";
-import Button from "@mui/material/Button/index.js";
-import IconButton from "@mui/material/IconButton/index.js";
-import Stack from "@mui/material/Stack/index.js";
-import Typography from "@mui/material/Typography/index.js";
-import { alpha, styled } from "@mui/material/styles/index.js";
-import { jsx, jsxs } from "react/jsx-runtime";
-var StepIndicator = styled(Box)(({ theme }) => ({
-  display: "flex",
-  gap: theme.spacing(1),
-  marginTop: theme.spacing(2),
-  marginBottom: theme.spacing(2)
-}));
-var StepDot = styled(Box, {
-  shouldForwardProp: (prop) => prop !== "active" && prop !== "completed"
-})(({ theme, active, completed }) => ({
-  width: 8,
-  height: 8,
-  borderRadius: "50%",
-  background: completed ? theme.palette.success.main : active ? theme.palette.primary.main : alpha(theme.palette.text.primary, 0.3),
-  transition: "all 0.3s ease",
-  ...active && {
-    transform: "scale(1.5)"
-  }
-}));
-var TutorialStepNav = ({
-  copy,
-  currentStep,
-  stepCount,
-  isLastStep,
-  allowSkip,
-  requiresActionBeforeNext,
-  onNext,
-  onPrev,
-  onSkip,
-  onRestart
-}) => /* @__PURE__ */ jsxs(
-  Stack,
-  {
-    direction: "row",
-    spacing: 1,
-    justifyContent: "space-between",
-    "data-testid": "tutorial-navigation",
-    children: [
-      /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, children: [
-        allowSkip && /* @__PURE__ */ jsx(Button, { size: "small", onClick: onSkip, variant: "text", children: copy.skip }),
-        stepCount > 1 && /* @__PURE__ */ jsx(
-          IconButton,
-          {
-            size: "small",
-            onClick: onRestart,
-            disabled: currentStep === 0,
-            title: copy.restart,
-            children: /* @__PURE__ */ jsx(RestartIcon, { fontSize: "small" })
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, children: [
-        stepCount > 1 && currentStep > 0 && /* @__PURE__ */ jsx(
-          Button,
-          {
-            size: "small",
-            startIcon: /* @__PURE__ */ jsx(PrevIcon, {}),
-            onClick: onPrev,
-            disabled: currentStep === 0,
-            "data-testid": "tutorial-prev-button",
-            children: copy.previous
-          }
-        ),
-        !isLastStep ? /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "contained",
-            size: "small",
-            endIcon: /* @__PURE__ */ jsx(NextIcon, {}),
-            onClick: onNext,
-            disabled: requiresActionBeforeNext,
-            title: requiresActionBeforeNext ? "Complete the required action first" : "",
-            "data-testid": "tutorial-next-button",
-            children: copy.next
-          }
-        ) : /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "contained",
-            size: "small",
-            endIcon: /* @__PURE__ */ jsx(CompleteIcon, {}),
-            onClick: onNext,
-            sx: {
-              background: "linear-gradient(135deg, #84fab0 0%, #8fd3f4 100%)"
-            },
-            "data-testid": "tutorial-finish-button",
-            children: stepCount === 1 ? "Complete" : "Finish"
-          }
-        )
-      ] })
-    ]
-  }
-);
-var StepDots = ({
-  currentStep,
-  stepCount
-}) => /* @__PURE__ */ jsx(StepIndicator, { "data-testid": "tutorial-step-indicators", children: Array.from({ length: stepCount }).map((_, index) => /* @__PURE__ */ jsx(
-  StepDot,
-  {
-    active: index === currentStep,
-    completed: index < currentStep,
-    "data-testid": `tutorial-indicator-${index}`
-  },
-  index
-)) });
-var TutorialStepHeader = ({ title, currentStep, allowSkip, onSkip }) => /* @__PURE__ */ jsxs(
-  Box,
-  {
-    sx: { display: "flex", justifyContent: "space-between", alignItems: "flex-start" },
-    children: [
-      /* @__PURE__ */ jsx(
-        Typography,
-        {
-          id: `tutorial-title-${currentStep}`,
-          variant: "h6",
-          fontWeight: "bold",
-          sx: { flex: 1 },
-          "data-testid": "tutorial-step-title",
-          children: title
-        }
-      ),
-      allowSkip && /* @__PURE__ */ jsx(
-        IconButton,
-        {
-          size: "small",
-          onClick: onSkip,
-          sx: { ml: 1, mt: -1, mr: -1 },
-          "data-testid": "tutorial-close-button",
-          children: /* @__PURE__ */ jsx(CloseIcon, { fontSize: "small" })
-        }
-      )
-    ]
-  }
-);
-var TutorialStepBody = ({
-  copy,
-  step,
-  currentStep,
-  stepCount,
-  progress: _progress,
-  isLastStep,
-  allowSkip,
-  showProgress,
-  requiresActionBeforeNext,
-  onNext,
-  onPrev,
-  onSkip,
-  onRestart
-}) => /* @__PURE__ */ jsxs(Stack, { spacing: 2, children: [
-  /* @__PURE__ */ jsx(
-    TutorialStepHeader,
-    {
-      title: step.title,
-      currentStep,
-      allowSkip,
-      onSkip
-    }
-  ),
-  /* @__PURE__ */ jsx(
-    Typography,
-    {
-      id: `tutorial-content-${currentStep}`,
-      variant: "body2",
-      color: "text.secondary",
-      "data-testid": "tutorial-step-content",
-      children: step.content
-    }
-  ),
-  showProgress && /* @__PURE__ */ jsxs(Typography, { variant: "caption", color: "text.secondary", align: "center", children: [
-    currentStep + 1,
-    " of ",
-    stepCount
-  ] }),
-  step.action && /* @__PURE__ */ jsx(
-    Button,
-    {
-      variant: "contained",
-      size: "small",
-      onClick: step.action.onClick,
-      sx: {
-        background: "linear-gradient(135deg, #667eea 0%, #764ba2 100%)",
-        color: "white"
-      },
-      children: step.action.label
-    }
-  ),
-  /* @__PURE__ */ jsx(StepDots, { currentStep, stepCount }),
-  /* @__PURE__ */ jsx(
-    TutorialStepNav,
-    {
-      copy,
-      currentStep,
-      stepCount,
-      isLastStep,
-      allowSkip,
-      requiresActionBeforeNext,
-      onNext,
-      onPrev,
-      onSkip,
-      onRestart
-    }
-  )
-] });
-
-export {
-  TutorialStepBody
-};
-//# sourceMappingURL=chunk-7WP2HRTW.js.map

package/dist/chunk-7WP2HRTW.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/feedback/TutorialOverlay/TutorialStepBody.tsx"],"sourcesContent":["import CompleteIcon from '@mui/icons-material/CheckCircle';\nimport CloseIcon from '@mui/icons-material/Close';\nimport PrevIcon from '@mui/icons-material/NavigateBefore';\nimport NextIcon from '@mui/icons-material/NavigateNext';\nimport RestartIcon from '@mui/icons-material/Refresh';\nimport Box from '@mui/material/Box/index.js';\nimport Button from '@mui/material/Button/index.js';\nimport IconButton from '@mui/material/IconButton/index.js';\nimport Stack from '@mui/material/Stack/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { alpha, styled } from '@mui/material/styles/index.js';\nimport React, {  } from 'react';\n\nimport type { TutorialOverlayProps } from './TutorialOverlay.types';\nimport type { TutorialCopy } from '../../../copy';\n\n// Animation keyframes\n\nconst StepIndicator = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  gap: theme.spacing(1),\n  marginTop: theme.spacing(2),\n  marginBottom: theme.spacing(2) }));\n\n\nconst StepDot = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'active' && prop !== 'completed' })<{ active?: boolean; completed?: boolean }>(({ theme, active, completed }) => ({\n  width: 8,\n  height: 8,\n  borderRadius: '50%',\n  background: completed\n    ? theme.palette.success.main\n    : active\n      ? theme.palette.primary.main\n      : alpha(theme.palette.text.primary, 0.3),\n  transition: 'all 0.3s ease',\n  ...(active && {\n    transform: 'scale(1.5)' }) }));\n\n// Title, body copy, the step dots and the navigation row.\n\n// The step's controls: skip/restart on the left, previous/next on the right.\nconst TutorialStepNav: React.FC<{\n  copy: TutorialCopy;\n  currentStep: number;\n  stepCount: number;\n  isLastStep: boolean;\n  allowSkip: boolean;\n  requiresActionBeforeNext?: boolean;\n  onNext: () => void;\n  onPrev: () => void;\n  onSkip: () => void;\n  onRestart: () => void;\n}> = ({\n  copy,\n  currentStep,\n  stepCount,\n  isLastStep,\n  allowSkip,\n  requiresActionBeforeNext,\n  onNext,\n  onPrev,\n  onSkip,\n  onRestart }) => (\n        <Stack\n          direction=\"row\"\n          spacing={1}\n          justifyContent=\"space-between\"\n          data-testid=\"tutorial-navigation\"\n        >\n          <Stack direction=\"row\" spacing={1}>\n            {allowSkip && (\n              <Button size=\"small\" onClick={onSkip} variant=\"text\">\n                {copy.skip}\n              </Button>\n            )}\n            {stepCount > 1 && (\n              <IconButton\n                size=\"small\"\n                onClick={onRestart}\n                disabled={currentStep === 0}\n                title={copy.restart}\n              >\n                <RestartIcon fontSize=\"small\" />\n              </IconButton>\n            )}\n          </Stack>\n\n          <Stack direction=\"row\" spacing={1}>\n            {stepCount > 1 && currentStep > 0 && (\n              <Button\n                size=\"small\"\n                startIcon={<PrevIcon />}\n                onClick={onPrev}\n                disabled={currentStep === 0}\n                data-testid=\"tutorial-prev-button\"\n              >\n                {copy.previous}\n              </Button>\n            )}\n\n            {!isLastStep ? (\n              <Button\n                variant=\"contained\"\n                size=\"small\"\n                endIcon={<NextIcon />}\n                onClick={onNext}\n                disabled={requiresActionBeforeNext}\n                title={requiresActionBeforeNext ? 'Complete the required action first' : ''}\n                data-testid=\"tutorial-next-button\"\n              >\n                {copy.next}\n              </Button>\n            ) : (\n              <Button\n                variant=\"contained\"\n                size=\"small\"\n                endIcon={<CompleteIcon />}\n                onClick={onNext}\n                sx={{\n                  background: 'linear-gradient(135deg, #84fab0 0%, #8fd3f4 100%)' }}\n                data-testid=\"tutorial-finish-button\"\n              >\n                {stepCount === 1 ? 'Complete' : 'Finish'}\n              </Button>\n            )}\n          </Stack>\n        </Stack>\n);\n\nconst StepDots: React.FC<{ currentStep: number; stepCount: number }> = ({\n  currentStep,\n  stepCount }) => (\n  <StepIndicator data-testid=\"tutorial-step-indicators\">\n    {Array.from({ length: stepCount }).map((_, index) => (\n      <StepDot\n        key={index}\n        active={index === currentStep}\n        completed={index < currentStep}\n        data-testid={`tutorial-indicator-${index}`}\n      />\n    ))}\n  </StepIndicator>\n);\n\n// Title, and the close button when skipping is allowed.\nconst TutorialStepHeader: React.FC<{\n  title: React.ReactNode;\n  currentStep: number;\n  allowSkip: boolean;\n  onSkip: () => void;\n}> = ({ title, currentStep, allowSkip, onSkip }) => (\n        <Box\n          sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-start' }}\n        >\n          <Typography\n            id={`tutorial-title-${currentStep}`}\n            variant=\"h6\"\n            fontWeight=\"bold\"\n            sx={{ flex: 1 }}\n            data-testid=\"tutorial-step-title\"\n          >\n            {title}\n          </Typography>\n          {allowSkip && (\n            <IconButton\n              size=\"small\"\n              onClick={onSkip}\n              sx={{ ml: 1, mt: -1, mr: -1 }}\n              data-testid=\"tutorial-close-button\"\n            >\n              <CloseIcon fontSize=\"small\" />\n            </IconButton>\n          )}\n        </Box>\n);\n\nexport const TutorialStepBody: React.FC<{\n  copy: TutorialCopy;\n  step: TutorialOverlayProps['steps'][number];\n  currentStep: number;\n  stepCount: number;\n  progress: number;\n  isLastStep: boolean;\n  allowSkip: boolean;\n  showProgress: boolean;\n  requiresActionBeforeNext?: boolean;\n  onNext: () => void;\n  onPrev: () => void;\n  onSkip: () => void;\n  onRestart: () => void;\n}> = ({\n  copy,\n  step,\n  currentStep,\n  stepCount,\n  progress: _progress,\n  isLastStep,\n  allowSkip,\n  showProgress,\n  requiresActionBeforeNext,\n  onNext,\n  onPrev,\n  onSkip,\n  onRestart }) => (\n      <Stack spacing={2}>\n        <TutorialStepHeader\n          title={step.title}\n          currentStep={currentStep}\n          allowSkip={allowSkip}\n          onSkip={onSkip}\n        />\n\n        <Typography\n          id={`tutorial-content-${currentStep}`}\n          variant=\"body2\"\n          color=\"text.secondary\"\n          data-testid=\"tutorial-step-content\"\n        >\n          {step.content}\n        </Typography>\n\n        {showProgress && (\n          <Typography variant=\"caption\" color=\"text.secondary\" align=\"center\">\n            {currentStep + 1} of {stepCount}\n          </Typography>\n        )}\n\n        {step.action && (\n          <Button\n            variant=\"contained\"\n            size=\"small\"\n            onClick={step.action.onClick}\n            sx={{\n              background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)',\n              color: 'white' }}\n          >\n            {step.action.label}\n          </Button>\n        )}\n\n        <StepDots currentStep={currentStep} stepCount={stepCount} />\n\n        <TutorialStepNav\n          copy={copy}\n          currentStep={currentStep}\n          stepCount={stepCount}\n          isLastStep={isLastStep}\n          allowSkip={allowSkip}\n          requiresActionBeforeNext={requiresActionBeforeNext}\n          onNext={onNext}\n          onPrev={onPrev}\n          onSkip={onSkip}\n          onRestart={onRestart}\n        />\n      </Stack>\n);\n\n// Main component\n"],"mappings":"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","names":[]}