@12-apps/ui 6.34.0 → 6.36.0

package/dist/chunk-CY6HHLYM.js

@@ -1,184 +0,0 @@
-import {
-  STACK_BREAK
-} from "./chunk-EYPRDTWI.js";
-import {
-  CARD_RADIUS,
-  cardSurfaceStyles,
-  isActionable,
-  isSelectable,
-  slotTestIds
-} from "./chunk-NXX3ZQKO.js";
-import {
-  useDragItem
-} from "./chunk-JCJGJX7V.js";
-import {
-  RAIL_COUNT,
-  RAIL_GAP,
-  railsTemplateFor,
-  useListRails
-} from "./chunk-TAB6AIPN.js";
-import {
-  DENSITY_ROW_PADDING
-} from "./chunk-2XGGHYEA.js";
-
-// src/components/data-display/DataViews/base-list-card-geometry.tsx
-import { useTheme } from "@mui/material/styles/index.js";
-function isTextSelection() {
-  return (globalThis.getSelection?.()?.toString().length ?? 0) > 0;
-}
-function clickKeys(onClick) {
-  return (event) => {
-    if (event.key !== "Enter" && event.key !== " ") return;
-    event.preventDefault();
-    onClick();
-  };
-}
-function rowSx(opts) {
-  const { inGroup, railCount, cellTemplate, gutters, metaColumns, pad, padY, scale, divider, interactive, draggable } = opts;
-  return {
-    position: "relative",
-    borderRadius: CARD_RADIUS,
-    display: "grid",
-    zoom: scale,
-    // SUBGRID AND `container-type` CANNOT COEXIST on one element: containment
-    // makes the box size independently of its parent, so the browser drops the
-    // subgrid and every slot stacks into one column. (Observed exactly that —
-    // computed `grid-template-columns: 1222px` on a card asking for subgrid.)
-    //
-    // So inside a group the GROUP is the query container and the row is the
-    // subgrid; standalone, the row is both the container and its own grid.
-    ...inGroup ? { gridColumn: `span ${railCount}`, gridTemplateColumns: "subgrid" } : {
-      containerType: "inline-size",
-      gridTemplateColumns: cellTemplate ?? railsTemplateFor(gutters, metaColumns)
-    },
-    alignItems: "center",
-    // Wide enough that the meta cluster, the value and the status read as three
-    // columns rather than one run of text — the complaint that started all this
-    // was `MÉTODO PIX R$ 13,90` scanning as a single phrase.
-    columnGap: RAIL_GAP,
-    width: "100%",
-    px: pad,
-    py: padY,
-    cursor: draggable ? "grab" : interactive ? "pointer" : void 0,
-    ...draggable ? { touchAction: "none", "&:active": { cursor: "grabbing" } } : {},
-    ...interactive ? { "&:hover": { backgroundColor: "action.hover" } } : {},
-    // A real focus ring, which a clickable <div> never had.
-    "&:focus-visible": { outline: 2, outlineStyle: "solid", outlineColor: "primary.main", outlineOffset: 2 },
-    // TWO-LINE, below the point where the shared rails stop helping.
-    //
-    // The standard mobile transaction row: what the record IS and what it COST
-    // on the first line, the supporting detail on the second. Better than
-    // truncating four columns into ellipses, and the reason each slot carries a
-    // `data-slot` — the placement is explicit rather than whatever order the
-    // children happen to be in.
-    //
-    //   [ select ][ leading ][ title …………… ][   menu ]
-    //                        [ (cells) …………… ][  value ]
-    //
-    // The MENU stays in the top-right corner at every width. It is the row's
-    // one fixed landmark — an overflow that moves to the second line on a phone
-    // is an overflow nobody finds twice.
-    [`@container (max-width: ${STACK_BREAK}px)`]: {
-      gridTemplateColumns: "auto auto minmax(0, 1fr) max-content",
-      ...inGroup ? { gridColumn: `span ${RAIL_COUNT}` } : {},
-      rowGap: 0.75,
-      columnGap: 1,
-      '& > [data-slot="drag"]': { display: "none" },
-      '& > [data-slot="select"]': { gridArea: "1 / 1" },
-      '& > [data-slot="leading"]': { gridArea: "1 / 2" },
-      '& > [data-slot="caption"]': { gridArea: "1 / 3" },
-      '& > [data-slot="actions"]': { gridArea: "1 / 4", justifyContent: "flex-end" },
-      '& > [data-slot="meta"]': { display: "none" },
-      // Second line, starting under the title rather than under the checkbox.
-      '& > [data-slot="value"]': { gridArea: "2 / 4", textAlign: "right" }
-    },
-    ...divider ? { borderRadius: 0, borderWidth: 0, borderBottomWidth: 1, borderStyle: "solid" } : {}
-  };
-}
-function dragIdFor(props, actionable) {
-  return props.draggable === false || !actionable ? void 0 : props.dragId;
-}
-function metaShape(props) {
-  const columns = props.meta?.length ?? 0;
-  return { columns, present: columns > 0 || props.metaSlot != null };
-}
-function useRowShell(props) {
-  const actionable = isActionable(props.state);
-  const group = useListRails();
-  const scale = props.scale ?? 1;
-  return {
-    group,
-    actionable,
-    scale,
-    theme: useTheme(),
-    selectable: isSelectable(props),
-    slot: slotTestIds(props.testId),
-    drag: useDragItem(dragIdFor(props, actionable)),
-    // Standalone holds no gutter open: there is no list beside it to line up
-    // with, so a reserved-but-empty rail is pure inset.
-    reserve: group?.reserveGutters ?? false,
-    // 1, not 1.5. The row's contents still have to line up with the toolbar
-    // above them, but 12px of card padding stacked on the checkbox's own 9px
-    // and an empty drag gutter's 24px read as a row indented for no reason.
-    //
-    // Not multiplied by `scale` — the row's `zoom` already scales it, and doing
-    // both would square the factor on padding alone.
-    pad: 1,
-    padY: DENSITY_ROW_PADDING[group?.density ?? props.density ?? "cozy"],
-    // A card that navigates does so with a real anchor, so it takes no click
-    // handler of its own — the stretched link IS the target.
-    acts: props.onClick != null && props.href == null && actionable
-  };
-}
-function actionProps(onClick) {
-  return {
-    role: "button",
-    tabIndex: 0,
-    onClick: () => {
-      if (isTextSelection()) return;
-      onClick?.();
-    },
-    onKeyDown: clickKeys(() => onClick?.())
-  };
-}
-function rowSurface(props, shell) {
-  const { theme, selectable, drag } = shell;
-  const surface = cardSurfaceStyles(
-    { ...props, selectable, shape: "row", state: drag.dragging ? "disabled" : props.state },
-    theme
-  );
-  if (props.divider !== true || surface.borderColor != null) return surface;
-  return { ...surface, borderBottomColor: theme.palette.divider };
-}
-function rowStyles(props, shell, cellTemplate) {
-  const { group, selectable, drag, reserve, pad, padY, scale, acts } = shell;
-  return {
-    ...rowSurface(props, shell),
-    ...rowSx({
-      inGroup: group !== null,
-      railCount: group?.railCount ?? RAIL_COUNT,
-      cellTemplate,
-      gutters: {
-        disclose: reserve || props.children != null,
-        drag: reserve || drag.draggable,
-        select: reserve || selectable
-      },
-      metaColumns: metaShape(props).columns,
-      pad,
-      padY,
-      scale,
-      divider: props.divider ?? false,
-      interactive: acts || props.href != null,
-      draggable: drag.draggable && drag.handleProps === void 0
-    })
-  };
-}
-
-export {
-  rowSx,
-  metaShape,
-  useRowShell,
-  actionProps,
-  rowStyles
-};
-//# sourceMappingURL=chunk-CY6HHLYM.js.map

package/dist/chunk-CY6HHLYM.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/data-display/DataViews/base-list-card-geometry.tsx"],"sourcesContent":["\"use client\";\n\nimport { useTheme } from \"@mui/material/styles/index.js\";\n\nimport {\n  CARD_RADIUS,\n  cardSurfaceStyles,\n  isActionable,\n  isSelectable,\n  slotTestIds,\n} from \"./card-surface\";\nimport { useDragItem } from \"./data-views-drag\";\nimport { DENSITY_ROW_PADDING } from \"./data-views-layout-context\";\nimport { RAIL_COUNT, RAIL_GAP, railsTemplateFor, useListRails } from \"./list-card-rails\";\nimport { STACK_BREAK } from \"./base-list-card-slots\";\nimport type { BaseListCardProps } from \"./base-list-card\";\n\n/**\n * THE ROW'S GEOMETRY AND SURFACE, split from the component at the size gate.\n *\n * Everything here answers \"what shape is this row, and where do its slots land\"\n * — the rails, the density padding, the two-line collapse, the drag and\n * selection plumbing. None of it renders anything, which is why the two halves\n * can live apart without either becoming harder to follow.\n */\n/**\n * Whether a click was really a click, or the tail of a text selection.\n *\n * Without this, selecting an order id to copy it navigates away instead — the\n * single most annoying thing a clickable row does.\n */\nfunction isTextSelection(): boolean {\n  return (globalThis.getSelection?.()?.toString().length ?? 0) > 0;\n}\n\n/** Keyboard equivalence for a card that acts but does not navigate. */\nfunction clickKeys(onClick: () => void) {\n  return (event: React.KeyboardEvent): void => {\n    if (event.key !== \"Enter\" && event.key !== \" \") return;\n    event.preventDefault();\n    onClick();\n  };\n}\n\n/**\n * Geometry: the rails, the density padding, the two-line collapse.\n *\n * SCALE IS `zoom`, NOT A SET OF MULTIPLIED FONT SIZES.\n *\n * It used to be the latter, on exactly three values — title, value, row padding\n * — so the slider left the subtitle, the meta labels, the rules, the checkbox,\n * the grip, the chip and the menu at their fixed sizes, and the row came apart\n * as you dragged it. Multiplying the rest is not a fix: the checkbox and the\n * chip are MUI internals sized in their own px, and no prop we pass reaches\n * them.\n *\n * `zoom` scales the used value of every length in the subtree — ours and theirs\n * — and unlike `transform: scale` it REFLOWS, so the row still occupies the\n * space it draws and the rails still resolve. Verified against the group: at\n * 1.4 all four rows keep identical rail edges, because subgrid tracks and the\n * zoom that reads them are the same for every row.\n */\n/**\n * DIVIDER COMPOSES WITH THE VARIANT — it changes the row's SHAPE, not its\n * surface.\n *\n * It used to set `border: 0` and hard-code its own rule colour, which discarded\n * whatever the variant had drawn: `outline`, `text` and `ghost` all collapsed\n * to one identical flush row, and the variant control silently stopped meaning\n * anything the moment `divider` was on.\n *\n * Now only the GEOMETRY changes here — the box's sides go, one edge stays — and\n * no `borderColor` is written, so the colour set by `cardSurfaceStyles` survives.\n * A variant that draws no border of its own gets the neutral rule from\n * {@link rowStyles}.\n */\nexport function rowSx(opts: {\n  inGroup: boolean;\n  railCount: number;\n  cellTemplate: string | null;\n  gutters: { disclose: boolean; drag: boolean; select: boolean };\n  metaColumns: number;\n  pad: number;\n  padY: number;\n  scale: number;\n  divider: boolean;\n  interactive: boolean;\n  draggable: boolean;\n}): Record<string, unknown> {\n  const { inGroup, railCount, cellTemplate, gutters, metaColumns, pad, padY, scale, divider, interactive, draggable } = opts;\n  return {\n    position: \"relative\",\n    borderRadius: CARD_RADIUS,\n    display: \"grid\",\n    zoom: scale,\n    // SUBGRID AND `container-type` CANNOT COEXIST on one element: containment\n    // makes the box size independently of its parent, so the browser drops the\n    // subgrid and every slot stacks into one column. (Observed exactly that —\n    // computed `grid-template-columns: 1222px` on a card asking for subgrid.)\n    //\n    // So inside a group the GROUP is the query container and the row is the\n    // subgrid; standalone, the row is both the container and its own grid.\n    ...(inGroup\n      ? { gridColumn: `span ${railCount}`, gridTemplateColumns: \"subgrid\" }\n      : {\n          containerType: \"inline-size\",\n          gridTemplateColumns: cellTemplate ?? railsTemplateFor(gutters, metaColumns),\n        }),\n    alignItems: \"center\",\n    // Wide enough that the meta cluster, the value and the status read as three\n    // columns rather than one run of text — the complaint that started all this\n    // was `MÉTODO PIX R$ 13,90` scanning as a single phrase.\n    columnGap: RAIL_GAP,\n    width: \"100%\",\n    px: pad,\n    py: padY,\n    cursor: draggable ? \"grab\" : interactive ? \"pointer\" : undefined,\n    ...(draggable ? { touchAction: \"none\", \"&:active\": { cursor: \"grabbing\" } } : {}),\n    ...(interactive ? { \"&:hover\": { backgroundColor: \"action.hover\" } } : {}),\n    // A real focus ring, which a clickable <div> never had.\n    \"&:focus-visible\": { outline: 2, outlineStyle: \"solid\", outlineColor: \"primary.main\", outlineOffset: 2 },\n    // TWO-LINE, below the point where the shared rails stop helping.\n    //\n    // The standard mobile transaction row: what the record IS and what it COST\n    // on the first line, the supporting detail on the second. Better than\n    // truncating four columns into ellipses, and the reason each slot carries a\n    // `data-slot` — the placement is explicit rather than whatever order the\n    // children happen to be in.\n    //\n    //   [ select ][ leading ][ title …………… ][   menu ]\n    //                        [ (cells) …………… ][  value ]\n    //\n    // The MENU stays in the top-right corner at every width. It is the row's\n    // one fixed landmark — an overflow that moves to the second line on a phone\n    // is an overflow nobody finds twice.\n    [`@container (max-width: ${STACK_BREAK}px)`]: {\n      gridTemplateColumns: \"auto auto minmax(0, 1fr) max-content\",\n      ...(inGroup ? { gridColumn: `span ${RAIL_COUNT}` } : {}),\n      rowGap: 0.75,\n      columnGap: 1,\n      '& > [data-slot=\"drag\"]': { display: \"none\" },\n      '& > [data-slot=\"select\"]': { gridArea: \"1 / 1\" },\n      '& > [data-slot=\"leading\"]': { gridArea: \"1 / 2\" },\n      '& > [data-slot=\"caption\"]': { gridArea: \"1 / 3\" },\n      '& > [data-slot=\"actions\"]': { gridArea: \"1 / 4\", justifyContent: \"flex-end\" },\n      '& > [data-slot=\"meta\"]': { display: \"none\" },\n      // Second line, starting under the title rather than under the checkbox.\n      '& > [data-slot=\"value\"]': { gridArea: \"2 / 4\", textAlign: \"right\" },\n    },\n    ...(divider\n      ? { borderRadius: 0, borderWidth: 0, borderBottomWidth: 1, borderStyle: \"solid\" }\n      : {}),\n  };\n}\n\n/**\n * A selectable full-width row: a marker, a title over a subtitle, labelled\n * middle columns, a value, a status, actions and a menu.\n *\n * A SHELL, like {@link BaseCard}. Domain rows live in the app and compose it.\n */\n/**\n * The id this row drags under, or nothing.\n *\n * `undefined` is the inert answer: `useDragItem` treats a missing id as \"no\n * drag\", which is how the card's own veto (`draggable={false}`) and an\n * unactionable record both switch dragging off without the card knowing\n * anything about the container above it.\n */\nfunction dragIdFor(\n  props: BaseListCardProps,\n  actionable: boolean,\n): string | number | undefined {\n  return props.draggable === false || !actionable ? undefined : props.dragId;\n}\n\n/**\n * What the meta cluster amounts to — asked once, used three times: to size the\n * rail, to close the cluster with a rule, and to decide whether the value has\n * anything to be divided FROM.\n */\nexport function metaShape(props: BaseListCardProps): { columns: number; present: boolean } {\n  const columns = props.meta?.length ?? 0;\n  return { columns, present: columns > 0 || props.metaSlot != null };\n}\n\n/**\n * Everything the row derives before it can render — extracted so the component\n * stays inside the size budget.\n */\nexport function useRowShell(props: BaseListCardProps) {\n  const actionable = isActionable(props.state);\n  const group = useListRails();\n  const scale = props.scale ?? 1;\n  return {\n    group,\n    actionable,\n    scale,\n    theme: useTheme(),\n    selectable: isSelectable(props),\n    slot: slotTestIds(props.testId),\n    drag: useDragItem(dragIdFor(props, actionable)),\n    // Standalone holds no gutter open: there is no list beside it to line up\n    // with, so a reserved-but-empty rail is pure inset.\n    reserve: group?.reserveGutters ?? false,\n    // 1, not 1.5. The row's contents still have to line up with the toolbar\n    // above them, but 12px of card padding stacked on the checkbox's own 9px\n    // and an empty drag gutter's 24px read as a row indented for no reason.\n    //\n    // Not multiplied by `scale` — the row's `zoom` already scales it, and doing\n    // both would square the factor on padding alone.\n    pad: 1,\n    padY: DENSITY_ROW_PADDING[group?.density ?? props.density ?? \"cozy\"],\n    // A card that navigates does so with a real anchor, so it takes no click\n    // handler of its own — the stretched link IS the target.\n    acts: props.onClick != null && props.href == null && actionable,\n  };\n}\n\n/** The click/keyboard props a row that acts (but does not navigate) needs. */\nexport function actionProps(onClick: (() => void) | undefined) {\n  return {\n    role: \"button\",\n    tabIndex: 0,\n    onClick: () => {\n      if (isTextSelection()) return;\n      onClick?.();\n    },\n    onKeyDown: clickKeys(() => onClick?.()),\n  };\n}\n\n/** The surface and the geometry, merged — the row's whole `sx` in one place. */\n\n/**\n * The row's painted surface, plus the divider's colour fallback.\n *\n * A variant with no border of its own (`text`, `ghost`) would draw its rule in\n * the inherited colour — the TEXT colour, i.e. a black bar across the row. The\n * neutral divider token is supplied only in that case; a variant that has a\n * border keeps it, which is the whole point of composing the two.\n */\nfunction rowSurface(\n  props: BaseListCardProps,\n  shell: ReturnType<typeof useRowShell>,\n): Record<string, unknown> {\n  const { theme, selectable, drag } = shell;\n  const surface = cardSurfaceStyles(\n    { ...props, selectable, shape: \"row\", state: drag.dragging ? \"disabled\" : props.state },\n    theme,\n  );\n  if (props.divider !== true || surface.borderColor != null) return surface;\n  return { ...surface, borderBottomColor: theme.palette.divider };\n}\n\nexport function rowStyles(\n  props: BaseListCardProps,\n  shell: ReturnType<typeof useRowShell>,\n  cellTemplate: string | null,\n): Record<string, unknown> {\n  const { group, selectable, drag, reserve, pad, padY, scale, acts } = shell;\n  return {\n    ...rowSurface(props, shell),\n    ...rowSx({\n      inGroup: group !== null,\n      railCount: group?.railCount ?? RAIL_COUNT,\n      cellTemplate,\n      gutters: {\n        disclose: reserve || props.children != null,\n        drag: reserve || drag.draggable,\n        select: reserve || selectable,\n      },\n      metaColumns: metaShape(props).columns,\n      pad,\n      padY,\n      scale,\n      divider: props.divider ?? false,\n      interactive: acts || props.href != null,\n      draggable: drag.draggable && drag.handleProps === undefined,\n    }),\n  };\n}\n"],"mappings":"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","names":[]}

package/dist/chunk-CZBONNPA.js

@@ -1,137 +0,0 @@
-// src/components/navigation/Pagination/Pagination.styles.ts
-import { alpha } from "@mui/material/styles/index.js";
-var ITEM_SIZE_STYLES = {
-  sm: (theme) => ({
-    fontSize: "0.875rem",
-    minWidth: 28,
-    height: 28,
-    padding: theme.spacing(0.25, 0.5)
-  }),
-  lg: (theme) => ({
-    fontSize: "1.125rem",
-    minWidth: 44,
-    height: 44,
-    padding: theme.spacing(1, 1.5)
-  })
-};
-var ITEM_VARIANTS = {
-  default: (theme, _customSize) => ({
-    borderRadius: theme.spacing(1),
-    "&:hover": {
-      backgroundColor: alpha(theme.palette.primary.main, 0.08),
-      transform: "translateY(-1px)",
-      boxShadow: `0 2px 8px ${alpha(theme.palette.primary.main, 0.15)}`
-    },
-    "&.Mui-selected": {
-      backgroundColor: theme.palette.primary.main,
-      color: theme.palette.primary.contrastText,
-      boxShadow: `0 4px 12px ${alpha(theme.palette.primary.main, 0.3)}`,
-      "&:hover": {
-        backgroundColor: theme.palette.primary.dark,
-        transform: "translateY(-2px)"
-      }
-    }
-  }),
-  rounded: (theme, customSize) => ({
-    borderRadius: "50%",
-    minWidth: customSize === "sm" ? 28 : customSize === "lg" ? 44 : 36,
-    width: customSize === "sm" ? 28 : customSize === "lg" ? 44 : 36,
-    "&:hover": {
-      backgroundColor: alpha(theme.palette.primary.main, 0.08),
-      transform: "scale(1.1)",
-      boxShadow: `0 4px 16px ${alpha(theme.palette.primary.main, 0.2)}`
-    },
-    "&.Mui-selected": {
-      backgroundColor: theme.palette.primary.main,
-      color: theme.palette.primary.contrastText,
-      transform: "scale(1.05)",
-      boxShadow: `0 6px 20px ${alpha(theme.palette.primary.main, 0.3)}`,
-      "&:hover": {
-        backgroundColor: theme.palette.primary.dark,
-        transform: "scale(1.15)"
-      }
-    }
-  }),
-  dots: (theme, customSize) => ({
-    borderRadius: "50%",
-    minWidth: customSize === "sm" ? 8 : customSize === "lg" ? 12 : 10,
-    width: customSize === "sm" ? 8 : customSize === "lg" ? 12 : 10,
-    height: customSize === "sm" ? 8 : customSize === "lg" ? 12 : 10,
-    fontSize: 0,
-    backgroundColor: alpha(theme.palette.text.secondary, 0.3),
-    "&:hover": {
-      backgroundColor: alpha(theme.palette.primary.main, 0.5),
-      transform: "scale(1.3)"
-    },
-    "&.Mui-selected": {
-      backgroundColor: theme.palette.primary.main,
-      transform: "scale(1.2)",
-      "&:hover": {
-        backgroundColor: theme.palette.primary.dark,
-        transform: "scale(1.4)"
-      }
-    },
-    "&.MuiPaginationItem-previousNext, &.MuiPaginationItem-firstLast": {
-      display: "none"
-    }
-  }),
-  minimal: (theme, _customSize) => ({
-    borderRadius: theme.spacing(0.5),
-    backgroundColor: "transparent",
-    color: theme.palette.text.secondary,
-    padding: theme.spacing(0.5, 1),
-    "&:hover": {
-      backgroundColor: alpha(theme.palette.primary.main, 0.04),
-      color: theme.palette.primary.main
-    },
-    "&.Mui-selected": {
-      backgroundColor: "transparent",
-      color: theme.palette.primary.main,
-      fontWeight: 600,
-      position: "relative",
-      "&::after": {
-        content: '""',
-        position: "absolute",
-        bottom: 0,
-        left: "50%",
-        transform: "translateX(-50%)",
-        width: "60%",
-        height: 2,
-        backgroundColor: theme.palette.primary.main,
-        borderRadius: 1
-      }
-    }
-  })
-};
-var itemSizeStyles = (theme, customSize) => customSize ? ITEM_SIZE_STYLES[customSize]?.(theme) ?? {} : {};
-var itemVariantStyles = (theme, customVariant, customSize) => customVariant ? ITEM_VARIANTS[customVariant]?.(theme, customSize) ?? {} : {};
-var paginationStyles = ({
-  theme,
-  customVariant,
-  customSize
-}) => ({
-  "& .MuiPagination-ul": {
-    gap: customVariant === "minimal" ? theme.spacing(0.5) : theme.spacing(1)
-  },
-  "& .MuiPaginationItem-root": {
-    ...itemSizeStyles(theme, customSize),
-    ...itemVariantStyles(theme, customVariant, customSize),
-    transition: "all 0.2s ease",
-    fontWeight: 500
-    // Default variant (flat design)
-    // Rounded variant
-    // Dots variant (minimal circular dots)
-    // Minimal variant (text-only)
-  },
-  // Hide ellipsis for dots variant
-  ...customVariant === "dots" && {
-    "& .MuiPaginationItem-ellipsis": {
-      display: "none"
-    }
-  }
-});
-
-export {
-  paginationStyles
-};
-//# sourceMappingURL=chunk-CZBONNPA.js.map

package/dist/chunk-CZBONNPA.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/navigation/Pagination/Pagination.styles.ts"],"sourcesContent":["import { alpha } from '@mui/material/styles/index.js';\nimport type { CSSObject, Theme } from '@mui/material/styles/index.js';\n\nconst ITEM_SIZE_STYLES: Record<string, (theme: Theme) => CSSObject> = {\n  sm: (theme) => ({\n      fontSize: '0.875rem',\n      minWidth: 28,\n      height: 28,\n      padding: theme.spacing(0.25, 0.5) }),\n  lg: (theme) => ({\n      fontSize: '1.125rem',\n      minWidth: 44,\n      height: 44,\n      padding: theme.spacing(1, 1.5) }) };\n\n// One variant applies at a time, so a lookup replaces the mutually exclusive\n// spreads.\nconst ITEM_VARIANTS: Record<string, (theme: Theme, customSize?: string) => CSSObject> = {\n  default: (theme, _customSize) => ({\n      borderRadius: theme.spacing(1),\n      '&:hover': {\n        backgroundColor: alpha(theme.palette.primary.main, 0.08),\n        transform: 'translateY(-1px)',\n        boxShadow: `0 2px 8px ${alpha(theme.palette.primary.main, 0.15)}` },\n      '&.Mui-selected': {\n        backgroundColor: theme.palette.primary.main,\n        color: theme.palette.primary.contrastText,\n        boxShadow: `0 4px 12px ${alpha(theme.palette.primary.main, 0.3)}`,\n        '&:hover': {\n          backgroundColor: theme.palette.primary.dark,\n          transform: 'translateY(-2px)' } } }),\n  rounded: (theme, customSize) => ({\n      borderRadius: '50%',\n      minWidth: customSize === 'sm' ? 28 : customSize === 'lg' ? 44 : 36,\n      width: customSize === 'sm' ? 28 : customSize === 'lg' ? 44 : 36,\n      '&:hover': {\n        backgroundColor: alpha(theme.palette.primary.main, 0.08),\n        transform: 'scale(1.1)',\n        boxShadow: `0 4px 16px ${alpha(theme.palette.primary.main, 0.2)}` },\n      '&.Mui-selected': {\n        backgroundColor: theme.palette.primary.main,\n        color: theme.palette.primary.contrastText,\n        transform: 'scale(1.05)',\n        boxShadow: `0 6px 20px ${alpha(theme.palette.primary.main, 0.3)}`,\n        '&:hover': {\n          backgroundColor: theme.palette.primary.dark,\n          transform: 'scale(1.15)' } } }),\n  dots: (theme, customSize) => ({\n      borderRadius: '50%',\n      minWidth: customSize === 'sm' ? 8 : customSize === 'lg' ? 12 : 10,\n      width: customSize === 'sm' ? 8 : customSize === 'lg' ? 12 : 10,\n      height: customSize === 'sm' ? 8 : customSize === 'lg' ? 12 : 10,\n      fontSize: 0,\n      backgroundColor: alpha(theme.palette.text.secondary, 0.3),\n      '&:hover': {\n        backgroundColor: alpha(theme.palette.primary.main, 0.5),\n        transform: 'scale(1.3)' },\n      '&.Mui-selected': {\n        backgroundColor: theme.palette.primary.main,\n        transform: 'scale(1.2)',\n        '&:hover': {\n          backgroundColor: theme.palette.primary.dark,\n          transform: 'scale(1.4)' } },\n      '&.MuiPaginationItem-previousNext, &.MuiPaginationItem-firstLast': {\n        display: 'none' } }),\n  minimal: (theme, _customSize) => ({\n      borderRadius: theme.spacing(0.5),\n      backgroundColor: 'transparent',\n      color: theme.palette.text.secondary,\n      padding: theme.spacing(0.5, 1),\n      '&:hover': {\n        backgroundColor: alpha(theme.palette.primary.main, 0.04),\n        color: theme.palette.primary.main },\n      '&.Mui-selected': {\n        backgroundColor: 'transparent',\n        color: theme.palette.primary.main,\n        fontWeight: 600,\n        position: 'relative',\n        '&::after': {\n          content: '\"\"',\n          position: 'absolute',\n          bottom: 0,\n          left: '50%',\n          transform: 'translateX(-50%)',\n          width: '60%',\n          height: 2,\n          backgroundColor: theme.palette.primary.main,\n          borderRadius: 1 } } }) };\n\nconst itemSizeStyles = (theme: Theme, customSize?: string): CSSObject =>\n  customSize ? (ITEM_SIZE_STYLES[customSize]?.(theme) ?? {}) : {};\n\nconst itemVariantStyles = (theme: Theme, customVariant?: string, customSize?: string): CSSObject =>\n  customVariant ? (ITEM_VARIANTS[customVariant]?.(theme, customSize) ?? {}) : {};\n\n// The pagination list's own styling, lifted out so the styled() callback is a\n// single spread.\nexport const paginationStyles = ({\n  theme,\n  customVariant,\n  customSize }: {\n  theme: Theme;\n  customVariant?: string;\n  customSize?: string;\n}): CSSObject => ({\n  '& .MuiPagination-ul': {\n    gap: customVariant === 'minimal' ? theme.spacing(0.5) : theme.spacing(1) },\n\n  '& .MuiPaginationItem-root': {\n    ...itemSizeStyles(theme, customSize),\n    ...itemVariantStyles(theme, customVariant, customSize),\n    transition: 'all 0.2s ease',\n    fontWeight: 500,\n\n\n\n\n\n    // Default variant (flat design)\n\n\n    // Rounded variant\n\n\n    // Dots variant (minimal circular dots)\n\n\n    // Minimal variant (text-only)\n\n  },\n\n  // Hide ellipsis for dots variant\n  ...(customVariant === 'dots' && {\n    '& .MuiPaginationItem-ellipsis': {\n      display: 'none' } }) });\n"],"mappings":"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","names":[]}

package/dist/chunk-CZT3AV7I.js

@@ -1,172 +0,0 @@
-import {
-  onMedia,
-  shadowInk
-} from "./chunk-FQ6UW7IY.js";
-
-// src/components/data-display/Carousel/Carousel.slide.tsx
-import Box from "@mui/material/Box/index.js";
-import Paper from "@mui/material/Paper/index.js";
-import Typography from "@mui/material/Typography/index.js";
-import { useTheme } from "@mui/material/styles/index.js";
-import { jsx, jsxs } from "react/jsx-runtime";
-var SlideCaption = ({
-  title,
-  description,
-  content,
-  image
-}) => /* @__PURE__ */ jsxs(Box, { sx: { position: "relative", zIndex: 1, textAlign: "center", p: 3 }, children: [
-  title && /* @__PURE__ */ jsx(
-    Typography,
-    {
-      variant: "h5",
-      sx: (theme) => ({
-        color: image ? onMedia(theme) : "text.primary",
-        textShadow: image ? `0 2px 4px ${shadowInk(theme, 0.5)}` : "none",
-        mb: 1
-      }),
-      children: title
-    }
-  ),
-  description && /* @__PURE__ */ jsx(
-    Typography,
-    {
-      variant: "body1",
-      sx: (theme) => ({
-        color: image ? onMedia(theme) : "text.secondary",
-        textShadow: image ? `0 1px 2px ${shadowInk(theme, 0.5)}` : "none"
-      }),
-      children: description
-    }
-  ),
-  content
-] });
-var CarouselSlide = ({
-  item,
-  index,
-  isActive,
-  variant,
-  clickable,
-  onSelect
-}) => {
-  const theme = useTheme();
-  const content = /* @__PURE__ */ jsxs(
-    Box,
-    {
-      sx: {
-        width: "100%",
-        height: "100%",
-        display: "flex",
-        flexDirection: "column",
-        justifyContent: "center",
-        alignItems: "center",
-        cursor: clickable ? "pointer" : "default",
-        position: "relative"
-      },
-      onClick: () => onSelect(item, index),
-      children: [
-        item.image && /* @__PURE__ */ jsx(
-          Box,
-          {
-            component: "img",
-            src: item.image,
-            alt: item.alt || item.title,
-            sx: {
-              width: "100%",
-              height: "100%",
-              objectFit: "cover",
-              position: "absolute",
-              top: 0,
-              left: 0
-            }
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          SlideCaption,
-          {
-            title: item.title,
-            description: item.description,
-            content: item.content,
-            image: item.image
-          }
-        )
-      ]
-    }
-  );
-  if (variant === "cards") {
-    return /* @__PURE__ */ jsx(
-      Paper,
-      {
-        elevation: isActive ? 8 : 2,
-        sx: {
-          width: "100%",
-          height: "100%",
-          overflow: "hidden",
-          transform: isActive ? "scale(1)" : "scale(0.9)",
-          transition: theme.transitions.create(["transform", "box-shadow"])
-        },
-        children: content
-      }
-    );
-  }
-  return content;
-};
-var CarouselTrack = ({
-  items,
-  activeIndex,
-  variant,
-  animation,
-  transition: Transition,
-  clickable,
-  onSelect
-}) => /* @__PURE__ */ jsx(
-  Box,
-  {
-    "data-testid": "carousel-track",
-    sx: {
-      width: "100%",
-      height: "100%",
-      position: "relative",
-      display: "flex",
-      alignItems: "center"
-    },
-    children: items.map((item, index) => /* @__PURE__ */ jsx(
-      Transition,
-      {
-        in: index === activeIndex,
-        timeout: 600,
-        ...animation === "flip" && { direction: "left" },
-        children: /* @__PURE__ */ jsx(
-          Box,
-          {
-            "data-testid": `carousel-slide-${index}`,
-            "data-active": index === activeIndex,
-            sx: {
-              position: "absolute",
-              width: "100%",
-              height: "100%",
-              display: index === activeIndex ? "block" : "none"
-            },
-            children: /* @__PURE__ */ jsx(
-              CarouselSlide,
-              {
-                item,
-                index,
-                isActive: index === activeIndex,
-                variant,
-                clickable,
-                onSelect
-              }
-            )
-          }
-        )
-      },
-      item.id
-    ))
-  }
-);
-
-export {
-  CarouselSlide,
-  CarouselTrack
-};
-//# sourceMappingURL=chunk-CZT3AV7I.js.map

package/dist/chunk-CZT3AV7I.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/data-display/Carousel/Carousel.slide.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport Paper from '@mui/material/Paper/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { useTheme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport type { CarouselItem, CarouselProps } from './Carousel.types';\nimport { onMedia, shadowInk } from '../../../tokens/ink';\n\nexport interface CarouselSlideProps {\n  item: CarouselItem;\n  index: number;\n  isActive: boolean;\n  variant: NonNullable<CarouselProps['variant']>;\n  clickable: boolean;\n  onSelect: (item: CarouselItem, index: number) => void;\n}\n\n/**\n * A slide's caption. Over an image it is white with a shadow so it stays legible\n * against whatever the photograph happens to be; on a bare surface it uses the\n * ordinary text colours.\n */\nconst SlideCaption: React.FC<Pick<CarouselItem, 'title' | 'description' | 'content' | 'image'>> = ({\n  title,\n  description,\n  content,\n  image,\n}) => (\n  <Box sx={{ position: 'relative', zIndex: 1, textAlign: 'center', p: 3 }}>\n    {title && (\n      <Typography\n        variant=\"h5\"\n        sx={(theme) => ({\n          color: image ? onMedia(theme) : 'text.primary',\n          textShadow: image ? `0 2px 4px ${shadowInk(theme, 0.5)}` : 'none',\n          mb: 1,\n        })}\n      >\n        {title}\n      </Typography>\n    )}\n\n    {description && (\n      <Typography\n        variant=\"body1\"\n        sx={(theme) => ({\n          color: image ? onMedia(theme) : 'text.secondary',\n          textShadow: image ? `0 1px 2px ${shadowInk(theme, 0.5)}` : 'none',\n        })}\n      >\n        {description}\n      </Typography>\n    )}\n\n    {content}\n  </Box>\n);\n\nexport const CarouselSlide: React.FC<CarouselSlideProps> = ({\n  item,\n  index,\n  isActive,\n  variant,\n  clickable,\n  onSelect,\n}) => {\n  const theme = useTheme();\n\n  const content = (\n    <Box\n      sx={{\n        width: '100%',\n        height: '100%',\n        display: 'flex',\n        flexDirection: 'column',\n        justifyContent: 'center',\n        alignItems: 'center',\n        cursor: clickable ? 'pointer' : 'default',\n        position: 'relative',\n      }}\n      onClick={() => onSelect(item, index)}\n    >\n      {item.image && (\n        <Box\n          component=\"img\"\n          src={item.image}\n          alt={item.alt || item.title}\n          sx={{\n            width: '100%',\n            height: '100%',\n            objectFit: 'cover',\n            position: 'absolute',\n            top: 0,\n            left: 0,\n          }}\n        />\n      )}\n\n      <SlideCaption\n        title={item.title}\n        description={item.description}\n        content={item.content}\n        image={item.image}\n      />\n    </Box>\n  );\n\n  // The cards variant gives each slide its own raised surface, and lifts the\n  // active one further so the stack reads as a deck rather than a strip.\n  if (variant === 'cards') {\n    return (\n      <Paper\n        elevation={isActive ? 8 : 2}\n        sx={{\n          width: '100%',\n          height: '100%',\n          overflow: 'hidden',\n          transform: isActive ? 'scale(1)' : 'scale(0.9)',\n          transition: theme.transitions.create(['transform', 'box-shadow']),\n        }}\n      >\n        {content}\n      </Paper>\n    );\n  }\n\n  return content;\n};\n\nexport interface CarouselTrackProps {\n  items: CarouselItem[];\n  activeIndex: number;\n  variant: NonNullable<CarouselProps['variant']>;\n  animation: NonNullable<CarouselProps['animation']>;\n  transition: React.ElementType;\n  clickable: boolean;\n  onSelect: (item: CarouselItem, index: number) => void;\n}\n\n/**\n * The slides themselves. Every slide stays mounted and absolutely positioned so\n * the transition has both the outgoing and incoming one to work with; `display`\n * is what actually hides the rest.\n */\nexport const CarouselTrack: React.FC<CarouselTrackProps> = ({\n  items,\n  activeIndex,\n  variant,\n  animation,\n  transition: Transition,\n  clickable,\n  onSelect,\n}) => (\n  <Box\n    data-testid=\"carousel-track\"\n    sx={{\n      width: '100%',\n      height: '100%',\n      position: 'relative',\n      display: 'flex',\n      alignItems: 'center',\n    }}\n  >\n    {items.map((item, index) => (\n      <Transition\n        key={item.id}\n        in={index === activeIndex}\n        timeout={600}\n        {...(animation === 'flip' && { direction: 'left' as const })}\n      >\n        <Box\n          data-testid={`carousel-slide-${index}`}\n          data-active={index === activeIndex}\n          sx={{\n            position: 'absolute',\n            width: '100%',\n            height: '100%',\n            display: index === activeIndex ? 'block' : 'none',\n          }}\n        >\n          <CarouselSlide\n            item={item}\n            index={index}\n            isActive={index === activeIndex}\n            variant={variant}\n            clickable={clickable}\n            onSelect={onSelect}\n          />\n        </Box>\n      </Transition>\n    ))}\n  </Box>\n);\n"],"mappings":"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","names":[]}