@12-apps/ui 6.35.0 → 6.37.0

package/dist/chunk-XREYLKUX.js

@@ -1,270 +0,0 @@
-import {
-  CARD_RADIUS,
-  cardSurfaceStyles,
-  isActionable,
-  isSelectable,
-  slotTestIds
-} from "./chunk-NXX3ZQKO.js";
-import {
-  DragHandle,
-  useDragItem
-} from "./chunk-JCJGJX7V.js";
-import {
-  CARD_ASPECT_RATIOS
-} from "./chunk-LHHAYZ55.js";
-import {
-  useDataViewsCopy
-} from "./chunk-KHG57NAE.js";
-import {
-  Checkbox
-} from "./chunk-XLYFOBBT.js";
-import {
-  default as default2
-} from "./chunk-6DPAWXZ3.js";
-import {
-  Card
-} from "./chunk-N6CSXHFJ.js";
-import {
-  Text
-} from "./chunk-WTOYEWW6.js";
-import {
-  rem
-} from "./chunk-YKCAJ2TN.js";
-
-// src/components/data-display/DataViews/base-card.tsx
-import { useTheme } from "@mui/material/styles/index.js";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-function cardSx(opts) {
-  const { aspectRatio, pad, scale, interactive, draggable } = opts;
-  return {
-    position: "relative",
-    zoom: scale,
-    aspectRatio: String(CARD_ASPECT_RATIOS[aspectRatio]),
-    display: "flex",
-    flexDirection: "column",
-    overflow: "hidden",
-    p: pad,
-    cursor: draggable ? "grab" : interactive ? "pointer" : void 0,
-    ...draggable ? { touchAction: "none", "&:active": { cursor: "grabbing" } } : {}
-  };
-}
-var OVERLAY_BAND_PX = 42;
-function contentGaps(opts) {
-  const { hasMedia, hasBody, overlays, pad } = opts;
-  const gap = pad * 0.5;
-  const clear = !hasMedia && overlays ? Math.max(0, OVERLAY_BAND_PX / 8 - pad) : 0;
-  return { body: hasMedia ? gap : clear, caption: hasMedia || hasBody ? gap : clear };
-}
-function CardOverlays({
-  selected,
-  onToggleSelect,
-  checkboxTestId,
-  menu
-}) {
-  const copy = useDataViewsCopy();
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    onToggleSelect && /* @__PURE__ */ jsx(default2, { sx: { position: "absolute", top: 4, left: 4, zIndex: 2 }, children: /* @__PURE__ */ jsx(
-      Checkbox,
-      {
-        checked: selected,
-        onChange: () => onToggleSelect(),
-        onClick: (event) => event.stopPropagation(),
-        size: "small",
-        "data-testid": checkboxTestId,
-        "aria-label": copy.selection.selectRow
-      }
-    ) }),
-    menu && /* @__PURE__ */ jsx(
-      default2,
-      {
-        sx: { position: "absolute", top: 4, right: 4, zIndex: 2 },
-        onClick: (event) => event.stopPropagation(),
-        children: menu
-      }
-    )
-  ] });
-}
-function CardMedia({ image, imageFallback }) {
-  return /* @__PURE__ */ jsx(
-    default2,
-    {
-      sx: {
-        flex: 1,
-        minHeight: 0,
-        display: "flex",
-        alignItems: "center",
-        justifyContent: "center",
-        overflow: "hidden",
-        borderRadius: 1,
-        "& img": { width: "100%", height: "100%", objectFit: "cover" }
-      },
-      children: image ?? imageFallback
-    }
-  );
-}
-function CardBodyContent({
-  children,
-  fill,
-  topGap
-}) {
-  return /* @__PURE__ */ jsx(
-    default2,
-    {
-      sx: {
-        flex: fill ? 1 : "none",
-        minHeight: 0,
-        display: "flex",
-        flexDirection: "column",
-        alignItems: "center",
-        justifyContent: "center",
-        gap: 0.75,
-        mt: topGap,
-        overflow: "hidden"
-      },
-      children
-    }
-  );
-}
-function CardCaption({
-  title,
-  subtitle,
-  topGap
-}) {
-  const theme = useTheme();
-  return /* @__PURE__ */ jsxs(default2, { sx: { mt: topGap, minWidth: 0 }, children: [
-    title != null && /* @__PURE__ */ jsx(
-      Text,
-      {
-        variant: "heading",
-        size: "sm",
-        weight: "bold",
-        as: "p",
-        style: {
-          lineHeight: 1.15,
-          fontSize: rem(theme, 15.2),
-          overflow: "hidden",
-          textOverflow: "ellipsis",
-          whiteSpace: "nowrap"
-        },
-        children: title
-      }
-    ),
-    subtitle != null && /* @__PURE__ */ jsx(Text, { variant: "caption", size: "xs", color: "secondary", as: "p", children: subtitle })
-  ] });
-}
-function CardContents({
-  children,
-  image,
-  imageFallback,
-  title,
-  subtitle,
-  overlays,
-  pad
-}) {
-  const hasMedia = image != null || imageFallback != null;
-  const hasBody = children != null;
-  const hasCaption = title != null || subtitle != null;
-  const top = contentGaps({ hasMedia, hasBody, overlays, pad });
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    hasMedia && /* @__PURE__ */ jsx(CardMedia, { image, imageFallback }),
-    hasBody && /* @__PURE__ */ jsx(CardBodyContent, { fill: !hasMedia, topGap: top.body, children }),
-    hasCaption && /* @__PURE__ */ jsx(CardCaption, { title, subtitle, topGap: top.caption })
-  ] });
-}
-function useCardShell(props) {
-  const actionable = isActionable(props.state);
-  return {
-    selectable: isSelectable(props),
-    actionable,
-    theme: useTheme(),
-    slot: slotTestIds(props.testId),
-    scale: props.scale ?? 1,
-    // The card's own veto over the container's decision — see `CardSurfaceProps`.
-    drag: useDragItem(props.draggable === false || !actionable ? void 0 : props.dragId)
-  };
-}
-function BaseCard(props) {
-  const { aspectRatio = "4:3", selected = false } = props;
-  const { menu, onToggleSelect, onClick } = props;
-  const { selectable, actionable, theme, slot, scale, drag } = useCardShell(props);
-  const dataTestId = props.testId;
-  const checkboxTestId = slot("checkbox");
-  const pad = 1.5;
-  return /* @__PURE__ */ jsxs(
-    Card,
-    {
-      variant: "outlined",
-      onClick,
-      dataTestId,
-      className: props.className,
-      "aria-label": props["aria-label"],
-      "aria-disabled": actionable ? void 0 : true,
-      ...drag.itemProps,
-      sx: {
-        // The same corner the row uses: a Grade and a Lista of the same records
-        // sit beside each other, and a tile that rounds harder than the row
-        // reads as a different component.
-        borderRadius: CARD_RADIUS,
-        // The shared half — variant, colour, selection, effects — identical to
-        // the one BaseListCard uses, so a Grade and a Lista of the same records
-        // are dressed by one set of rules.
-        ...cardSurfaceStyles(
-          {
-            ...props,
-            selectable,
-            shape: "tile",
-            // A card mid-drag is a ghost of itself; the drop target is what the
-            // eye should be on.
-            state: drag.dragging ? "disabled" : props.state
-          },
-          theme
-        ),
-        // …and the tile's own geometry on top.
-        ...cardSx({
-          aspectRatio,
-          pad,
-          scale,
-          interactive: onClick != null,
-          draggable: drag.draggable && drag.handleProps === void 0
-        })
-      },
-      children: [
-        drag.draggable && /* @__PURE__ */ jsx(default2, { sx: { position: "absolute", bottom: 4, left: 4, zIndex: 2 }, children: /* @__PURE__ */ jsx(
-          DragHandle,
-          {
-            handleProps: drag.handleProps,
-            gated: drag.handleProps !== void 0,
-            testId: slot("drag")
-          }
-        ) }),
-        /* @__PURE__ */ jsx(
-          CardOverlays,
-          {
-            selected,
-            onToggleSelect: selectable ? onToggleSelect ?? (() => {
-            }) : void 0,
-            checkboxTestId,
-            menu
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          CardContents,
-          {
-            image: props.image,
-            imageFallback: props.imageFallback,
-            title: props.title,
-            subtitle: props.subtitle,
-            overlays: selectable || menu != null,
-            pad,
-            children: props.children
-          }
-        )
-      ]
-    }
-  );
-}
-
-export {
-  BaseCard
-};
-//# sourceMappingURL=chunk-XREYLKUX.js.map

package/dist/chunk-XREYLKUX.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/data-display/DataViews/base-card.tsx"],"sourcesContent":["\"use client\";\n\nimport { type ReactNode } from \"react\";\n\nimport { useTheme, type CSSObject } from \"@mui/material/styles/index.js\";\n\n/** See the note on `CardSx` in `card-surface` — these fragments get merged. */\ntype CardSx = CSSObject | Record<string, unknown>;\n\nimport { Checkbox } from \"../../form/Checkbox\";\nimport { Card } from \"../../layout/Card\";\nimport { Box } from \"../../../mui/Box\";\nimport { Text } from \"../../typography/Text\";\n\nimport { DragHandle, useDragItem } from \"./data-views-drag\";\nimport {\n  CARD_RADIUS,\n  cardSurfaceStyles,\n  isActionable,\n  isSelectable,\n  slotTestIds,\n  type CardSurfaceProps,\n} from \"./card-surface\";\nimport { CARD_ASPECT_RATIOS, type CardAspectRatio } from \"./data-views-types\";\nimport { useDataViewsCopy } from \"./data-views-copy-context\";\nimport { rem } from \"../../../tokens/relative\";\n\nexport interface BaseCardProps extends CardSurfaceProps {\n  /** Extra body content below the caption (chips, meta). Optional. */\n  children?: ReactNode;\n  /** Tile proportion. Defaults to \"4:3\". */\n  aspectRatio?: CardAspectRatio;\n  /**\n   * Size multiplier from the zoom slider (1 = base).\n   *\n   * Applied as `zoom`, so the whole card grows together — padding, typography,\n   * the checkbox, the menu and the media alike — in step with its width, which\n   * the grid sizes to base × scale. A card at scale 2 renders at ~twice the\n   * size, its proportion preserved by `aspectRatio`. Default 1.\n   */\n  scale?: number;\n  /** Display-image node (e.g. an `<img>` / thumbnail) filling the media region. */\n  image?: ReactNode;\n  /** Shown centered in the media region when there is no `image` (icon/initial). */\n  imageFallback?: ReactNode;\n  /** First-class title, rendered in the caption. */\n  title?: ReactNode;\n  /** Secondary caption line under the title. */\n  subtitle?: ReactNode;\n  /** The 3-dots menu (or any action node) pinned to the top-right corner. */\n  menu?: ReactNode;\n  /** Toggle this card's selection. Omit to hide the checkbox (non-selectable). */\n  onToggleSelect?: () => void;\n  /**\n   * This card's id for drag purposes.\n   *\n   * Draggable ONLY inside a {@link DragContainerProvider} — see\n   * `data-views-drag`. On the board that is how a card moves between columns;\n   * in a grade it is how the operator reorders. Outside a container this is\n   * inert and no grip appears.\n   */\n  dragId?: string | number;\n  checkboxTestId?: string;\n}\n\n/**\n * The outlined-tile style: fixed ratio, scaled padding, selected/dimmed states.\n *\n * See the note on the row: `zoom` scales EVERY length in the subtree, including\n * the MUI internals (checkbox, chip, icon button) that no prop of ours reaches.\n * The grid still sizes the track to BASE_CARD_WIDTH x scale, so the tile fills\n * its track physically and lays its contents out in the unscaled box behind it\n * — which is what \"the whole card grows together\" was always meant to mean.\n */\nfunction cardSx(opts: {\n  aspectRatio: CardAspectRatio;\n  pad: number;\n  scale: number;\n  interactive: boolean;\n  draggable: boolean;\n}): CardSx {\n  const { aspectRatio, pad, scale, interactive, draggable } = opts;\n  return {\n    position: \"relative\",\n    zoom: scale,\n    aspectRatio: String(CARD_ASPECT_RATIOS[aspectRatio]),\n    display: \"flex\",\n    flexDirection: \"column\",\n    overflow: \"hidden\",\n    p: pad,\n    cursor: draggable ? \"grab\" : interactive ? \"pointer\" : undefined,\n    ...(draggable ? { touchAction: \"none\", \"&:active\": { cursor: \"grabbing\" } } : {}),\n  };\n}\n\n/**\n * How far the first block in flow must start below the tile's top edge to clear\n * the absolute overlays: their 4px inset plus the checkbox's 38px hit area (20px\n * glyph in MUI's 9px padding), which is the taller of the two corners.\n */\nconst OVERLAY_BAND_PX = 42;\n\n/**\n * The top margin each stacked slot needs, in MUI spacing units.\n *\n * The overlays are absolute, so they cost the flow nothing — over MEDIA that is\n * the whole point (a checkbox on a thumbnail reads as a checkbox on a\n * thumbnail). Over TEXT it is a collision: a title-only tile started its first\n * line at the padding edge, directly under the checkbox, and rendered\n * `Selecionada` with the box sitting on the `Se`. So when nothing pictorial is\n * there to absorb them, whichever block comes first clears the band instead.\n */\nfunction contentGaps(opts: {\n  hasMedia: boolean;\n  hasBody: boolean;\n  overlays: boolean;\n  pad: number;\n}): { body: number; caption: number } {\n  const { hasMedia, hasBody, overlays, pad } = opts;\n  const gap = pad * 0.5;\n  const clear = !hasMedia && overlays ? Math.max(0, OVERLAY_BAND_PX / 8 - pad) : 0;\n  return { body: hasMedia ? gap : clear, caption: hasMedia || hasBody ? gap : clear };\n}\n\n/** The top-corner overlays: the select checkbox (left) and the menu slot (right). */\nfunction CardOverlays({\n  selected,\n  onToggleSelect,\n  checkboxTestId,\n  menu,\n}: Pick<BaseCardProps, \"selected\" | \"onToggleSelect\" | \"checkboxTestId\" | \"menu\">): React.JSX.Element {\n  const copy = useDataViewsCopy();\n  return (\n    <>\n      {onToggleSelect && (\n        <Box sx={{ position: \"absolute\", top: 4, left: 4, zIndex: 2 }}>\n          <Checkbox\n            checked={selected}\n            onChange={() => onToggleSelect()}\n            // Selecting must never trigger the card's own click (open/edit).\n            onClick={(event) => event.stopPropagation()}\n            size=\"small\"\n            data-testid={checkboxTestId}\n            aria-label={copy.selection.selectRow}\n          />\n        </Box>\n      )}\n      {menu && (\n        <Box\n          sx={{ position: \"absolute\", top: 4, right: 4, zIndex: 2 }}\n          // Acting on the menu must never trigger the card's own click.\n          onClick={(event) => event.stopPropagation()}\n        >\n          {menu}\n        </Box>\n      )}\n    </>\n  );\n}\n\n/**\n * Media region: fills the tile above the caption; centers `imageFallback` when\n * there is no image so title-only entities still fill the ratio box and mixed\n * grids stay aligned.\n */\nfunction CardMedia({ image, imageFallback }: Pick<BaseCardProps, \"image\" | \"imageFallback\">): React.JSX.Element {\n  return (\n    <Box\n      sx={{\n        flex: 1,\n        minHeight: 0,\n        display: \"flex\",\n        alignItems: \"center\",\n        justifyContent: \"center\",\n        overflow: \"hidden\",\n        borderRadius: 1,\n        \"& img\": { width: \"100%\", height: \"100%\", objectFit: \"cover\" },\n      }}\n    >\n      {image ?? imageFallback}\n    </Box>\n  );\n}\n\n/** The body slot (chips/meta); fills remaining space when there is no media. */\nfunction CardBodyContent({\n  children,\n  fill,\n  topGap,\n}: {\n  children: ReactNode;\n  fill: boolean;\n  topGap: number;\n}): React.JSX.Element {\n  return (\n    <Box\n      sx={{\n        flex: fill ? 1 : \"none\",\n        minHeight: 0,\n        display: \"flex\",\n        flexDirection: \"column\",\n        alignItems: \"center\",\n        justifyContent: \"center\",\n        gap: 0.75,\n        mt: topGap,\n        overflow: \"hidden\",\n      }}\n    >\n      {children}\n    </Box>\n  );\n}\n\n/** The title/subtitle caption. */\nfunction CardCaption({\n  title,\n  subtitle,\n  topGap,\n}: {\n  title?: ReactNode;\n  subtitle?: ReactNode;\n  topGap: number;\n}): React.JSX.Element {\n  const theme = useTheme();\n  return (\n    <Box sx={{ mt: topGap, minWidth: 0 }}>\n      {title != null && (\n        <Text\n          variant=\"heading\"\n          size=\"sm\"\n          weight=\"bold\"\n          as=\"p\"\n          style={{\n            lineHeight: 1.15,\n            fontSize: rem(theme, 15.2),\n            overflow: \"hidden\",\n            textOverflow: \"ellipsis\",\n            whiteSpace: \"nowrap\",\n          }}\n        >\n          {title}\n        </Text>\n      )}\n      {subtitle != null && (\n        <Text variant=\"caption\" size=\"xs\" color=\"secondary\" as=\"p\">\n          {subtitle}\n        </Text>\n      )}\n    </Box>\n  );\n}\n\n/** The stacked media / body / caption slots inside the tile (below the overlays). */\nfunction CardContents({\n  children,\n  image,\n  imageFallback,\n  title,\n  subtitle,\n  overlays,\n  pad,\n}: Pick<BaseCardProps, \"children\" | \"image\" | \"imageFallback\" | \"title\" | \"subtitle\"> & {\n  overlays: boolean;\n  pad: number;\n}): React.JSX.Element {\n  const hasMedia = image != null || imageFallback != null;\n  const hasBody = children != null;\n  const hasCaption = title != null || subtitle != null;\n  const top = contentGaps({ hasMedia, hasBody, overlays, pad });\n  return (\n    <>\n      {hasMedia && <CardMedia image={image} imageFallback={imageFallback} />}\n      {hasBody && (\n        <CardBodyContent fill={!hasMedia} topGap={top.body}>\n          {children}\n        </CardBodyContent>\n      )}\n      {hasCaption && <CardCaption title={title} subtitle={subtitle} topGap={top.caption} />}\n    </>\n  );\n}\n\n/**\n * Reusable selectable card shell for the DataViews \"Grade\" (cards) layout, and\n * the ONLY card component that lives in `@12-apps/ui` — every domain \"kind card\"\n * (product, mesa, role, …) lives in the app and composes this envelope. See the\n * per-slot helpers above; this shell just assembles them within a fixed-ratio\n * tile. Reads no context, so it renders standalone as well as inside the grid.\n */\n/**\n * Everything the tile derives from its props before it can render — pulled out\n * so `BaseCard` itself stays inside the complexity budget.\n */\nfunction useCardShell(props: BaseCardProps) {\n  const actionable = isActionable(props.state);\n  return {\n    selectable: isSelectable(props),\n    actionable,\n    theme: useTheme(),\n    slot: slotTestIds(props.testId),\n    scale: props.scale ?? 1,\n    // The card's own veto over the container's decision — see `CardSurfaceProps`.\n    drag: useDragItem(props.draggable === false || !actionable ? undefined : props.dragId),\n  };\n}\n\nexport function BaseCard(props: BaseCardProps): React.JSX.Element {\n  const { aspectRatio = \"4:3\", selected = false } = props;\n  const { menu, onToggleSelect, onClick } = props;\n  const { selectable, actionable, theme, slot, scale, drag } = useCardShell(props);\n  const dataTestId = props.testId;\n  const checkboxTestId = slot(\"checkbox\");\n  const pad = 1.5;\n\n  return (\n    <Card\n      variant=\"outlined\"\n      onClick={onClick}\n      dataTestId={dataTestId}\n      className={props.className}\n      aria-label={props[\"aria-label\"]}\n      aria-disabled={actionable ? undefined : true}\n      {...drag.itemProps}\n      // A PLAIN OBJECT, not a function. `Card` merges by spreading\n      // (`sx={{ ...defaults, ...sx }}`), and spreading a function yields\n      // nothing at all — the styles vanish silently, which is exactly how the\n      // first version of this shipped with no variants and no effects.\n      sx={{\n        // The same corner the row uses: a Grade and a Lista of the same records\n        // sit beside each other, and a tile that rounds harder than the row\n        // reads as a different component.\n        borderRadius: CARD_RADIUS,\n        // The shared half — variant, colour, selection, effects — identical to\n        // the one BaseListCard uses, so a Grade and a Lista of the same records\n        // are dressed by one set of rules.\n        ...cardSurfaceStyles(\n          {\n            ...props,\n            selectable,\n            shape: \"tile\",\n            // A card mid-drag is a ghost of itself; the drop target is what the\n            // eye should be on.\n            state: drag.dragging ? \"disabled\" : props.state,\n          },\n          theme,\n        ),\n        // …and the tile's own geometry on top.\n        ...cardSx({\n          aspectRatio, pad, scale,\n          interactive: onClick != null,\n          draggable: drag.draggable && drag.handleProps === undefined,\n        }),\n      }}\n    >\n      {/* Bottom-left, opposite the menu and clear of the checkbox — a grip in\n          the same corner as a control that toggles selection means every drag\n          starts with a near-miss on it. */}\n      {drag.draggable && (\n        <Box sx={{ position: \"absolute\", bottom: 4, left: 4, zIndex: 2 }}>\n          <DragHandle\n            handleProps={drag.handleProps}\n            gated={drag.handleProps !== undefined}\n            testId={slot(\"drag\")}\n          />\n        </Box>\n      )}\n      <CardOverlays\n        selected={selected}\n        onToggleSelect={selectable ? onToggleSelect ?? (() => {}) : undefined}\n        checkboxTestId={checkboxTestId}\n        menu={menu}\n      />\n      <CardContents\n        image={props.image}\n        imageFallback={props.imageFallback}\n        title={props.title}\n        subtitle={props.subtitle}\n        overlays={selectable || menu != null}\n        pad={pad}\n      >\n        {props.children}\n      </CardContents>\n    </Card>\n  );\n}\n"],"mappings":"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","names":["default"]}

package/dist/chunk-XRMZMBE3.js

@@ -1,50 +0,0 @@
-// src/components/data-display/Avatar/Avatar.animations.ts
-import { keyframes } from "@mui/material/styles/index.js";
-var pulseAnimation = keyframes`
-  0% {
-    box-shadow: 0 0 0 0 currentColor;
-    opacity: 1;
-  }
-  70% {
-    box-shadow: 0 0 0 10px currentColor;
-    opacity: 0;
-  }
-  100% {
-    box-shadow: 0 0 0 0 currentColor;
-    opacity: 0;
-  }
-`;
-var shimmerAnimation = keyframes`
-  0% {
-    background-position: -200% 0;
-  }
-  100% {
-    background-position: 200% 0;
-  }
-`;
-var scaleInAnimation = keyframes`
-  0% {
-    transform: scale(0);
-    opacity: 0;
-  }
-  100% {
-    transform: scale(1);
-    opacity: 1;
-  }
-`;
-var rotateAnimation = keyframes`
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-`;
-
-export {
-  pulseAnimation,
-  shimmerAnimation,
-  scaleInAnimation,
-  rotateAnimation
-};
-//# sourceMappingURL=chunk-XRMZMBE3.js.map

package/dist/chunk-XRMZMBE3.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/data-display/Avatar/Avatar.animations.ts"],"sourcesContent":["import { keyframes } from '@mui/material/styles/index.js';\n\nexport const pulseAnimation = keyframes`\n  0% {\n    box-shadow: 0 0 0 0 currentColor;\n    opacity: 1;\n  }\n  70% {\n    box-shadow: 0 0 0 10px currentColor;\n    opacity: 0;\n  }\n  100% {\n    box-shadow: 0 0 0 0 currentColor;\n    opacity: 0;\n  }\n`;\n\nexport const shimmerAnimation = keyframes`\n  0% {\n    background-position: -200% 0;\n  }\n  100% {\n    background-position: 200% 0;\n  }\n`;\n\nexport const scaleInAnimation = keyframes`\n  0% {\n    transform: scale(0);\n    opacity: 0;\n  }\n  100% {\n    transform: scale(1);\n    opacity: 1;\n  }\n`;\n\nexport const rotateAnimation = keyframes`\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n`;\n"],"mappings":";AAAA,SAAS,iBAAiB;AAEnB,IAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAevB,IAAM,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASzB,IAAM,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWzB,IAAM,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;","names":[]}

package/dist/chunk-XSMMFCMQ.js

@@ -1,183 +0,0 @@
-import {
-  DEFAULT_QUICK_RANGES
-} from "./chunk-QKLSHNOH.js";
-import {
-  useDateRangePicker
-} from "./chunk-APT5L7V5.js";
-import {
-  DateRangeQuickList
-} from "./chunk-NSJVQ5YJ.js";
-import {
-  DateRangeFields
-} from "./chunk-IDO4EV7T.js";
-import {
-  toLocalDay
-} from "./chunk-FRAVVI4A.js";
-import {
-  Calendar
-} from "./chunk-UN5INW6K.js";
-
-// src/components/form/DateRangePicker/DateRangePicker.tsx
-import Box from "@mui/material/Box/index.js";
-import Paper from "@mui/material/Paper/index.js";
-import useMediaQuery from "@mui/material/useMediaQuery/index.js";
-import { jsx, jsxs } from "react/jsx-runtime";
-var CALENDAR_CLASS = "date-range-picker__calendar";
-var NARROW_QUERY = "(max-width:899.95px)";
-var ROOT_SX = {
-  display: "inline-flex",
-  flexDirection: "column",
-  gap: 2,
-  p: 2,
-  maxWidth: "100%",
-  // `Calendar` renders its own `Paper` with 24px of padding. Nested in this one
-  // that reads as a box inside a box, so the inner frame is flattened here
-  // through the className hook the component exposes for exactly this.
-  [`& .${CALENDAR_CLASS}`]: {
-    p: 0,
-    boxShadow: "none",
-    backgroundColor: "transparent",
-    backgroundImage: "none"
-  }
-};
-var BODY_SX = {
-  display: "flex",
-  // The quick column sits BESIDE the calendar on a wide screen. Narrow, it
-  // moves ABOVE it — `column-reverse`, so the DOM order stays calendar-then-
-  // list (the calendar is the primary control and should be reached first by a
-  // screen reader and by Tab) while the eye meets the quick ranges first, which
-  // is the order the phone mock asks for and the order a thumb wants: nine
-  // one-tap answers before a grid of thirty.
-  //
-  // A side column at 390px would squeeze the day grid to roughly half its width
-  // and make the numbers unreadable. Checked at 390px.
-  flexDirection: { xs: "column-reverse", md: "row" },
-  alignItems: { xs: "stretch", md: "flex-start" },
-  gap: 2,
-  maxWidth: "100%"
-};
-var QUICK_DIVIDER_SX = {
-  borderColor: "divider",
-  borderStyle: "solid",
-  borderWidth: 0,
-  borderLeftWidth: { xs: 0, md: "1px" },
-  borderBottomWidth: { xs: "1px", md: 0 },
-  pl: { xs: 0, md: 2 },
-  pb: { xs: 2, md: 0 },
-  alignSelf: "stretch"
-};
-var FIELDS_DIVIDER_SX = {
-  borderTop: "1px solid",
-  borderColor: "divider",
-  pt: 2
-};
-function useMonthCount(requested) {
-  const narrow = useMediaQuery(NARROW_QUERY);
-  return narrow ? 1 : requested;
-}
-function RangeCalendar({
-  calendarLabel,
-  picker,
-  value,
-  locale,
-  weekStartsOn,
-  months,
-  maxRangeDays
-}) {
-  return /* @__PURE__ */ jsx(
-    Calendar,
-    {
-      ariaLabel: calendarLabel,
-      className: CALENDAR_CLASS,
-      selectionMode: "range",
-      locale,
-      firstDayOfWeek: weekStartsOn,
-      numberOfMonths: months,
-      range: { start: toLocalDay(value.from), end: toLocalDay(value.to) },
-      onIntermediateRangeChange: picker.pickOnCalendar,
-      onRangeChange: picker.pickOnCalendar,
-      maxRangeLength: maxRangeDays
-    },
-    picker.viewNonce
-  );
-}
-function QuickColumn({
-  picker,
-  maxRangeDays,
-  dataTestId
-}) {
-  if (picker.options.length === 0) return null;
-  return /* @__PURE__ */ jsx(Box, { sx: QUICK_DIVIDER_SX, children: /* @__PURE__ */ jsx(
-    DateRangeQuickList,
-    {
-      options: picker.options,
-      activeId: picker.activeId,
-      onPick: picker.pickQuick,
-      reasonFor: (option) => picker.copy.overMax({ maxRangeDays: maxRangeDays ?? option.days, days: option.days }),
-      label: picker.copy.quickRanges,
-      dataTestId
-    }
-  ) });
-}
-function DateRangePicker({
-  value,
-  onChange,
-  timeZone,
-  now,
-  maxRangeDays,
-  weekStartsOn = 0,
-  quickRanges = DEFAULT_QUICK_RANGES,
-  locale = "en-US",
-  numberOfMonths,
-  messages,
-  dataTestId = "date-range-picker",
-  className
-}) {
-  const picker = useDateRangePicker({
-    value,
-    onChange,
-    timeZone,
-    now,
-    maxRangeDays,
-    weekStartsOn,
-    quickRanges,
-    messages
-  });
-  const months = useMonthCount(numberOfMonths);
-  return /* @__PURE__ */ jsxs(Paper, { className, "data-testid": dataTestId, sx: ROOT_SX, children: [
-    /* @__PURE__ */ jsxs(Box, { sx: BODY_SX, children: [
-      /* @__PURE__ */ jsx(
-        RangeCalendar,
-        {
-          calendarLabel: picker.copy.calendarLabel,
-          picker,
-          value,
-          locale,
-          weekStartsOn,
-          months,
-          maxRangeDays
-        }
-      ),
-      /* @__PURE__ */ jsx(QuickColumn, { picker, maxRangeDays, dataTestId })
-    ] }),
-    /* @__PURE__ */ jsx(Box, { sx: FIELDS_DIVIDER_SX, children: /* @__PURE__ */ jsx(
-      DateRangeFields,
-      {
-        value,
-        status: picker.status,
-        messages: picker.copy,
-        maxRangeDays,
-        onEdit: picker.editBound,
-        statusId: picker.statusId,
-        dataTestId
-      }
-    ) })
-  ] });
-}
-var DateRangePicker_default = DateRangePicker;
-
-export {
-  DateRangePicker,
-  DateRangePicker_default
-};
-//# sourceMappingURL=chunk-XSMMFCMQ.js.map

package/dist/chunk-XSMMFCMQ.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/form/DateRangePicker/DateRangePicker.tsx"],"sourcesContent":["'use client';\n\n/**\n * Three views of ONE range: a calendar, a quick-pick column, and two typed\n * dates. Change any and the other two follow.\n *\n * WHY IT EXISTS: a range calendar alone makes \"this quarter\" cost two clicks,\n * a month of paging, and a mental note of which day a quarter starts on; a list\n * of presets alone cannot express \"the 3rd to the 19th\"; and typed fields alone\n * make you spell out a window you can see. Each of the three is the fastest\n * route to a different range, so the control offers all three over one value\n * rather than picking a favourite.\n *\n * WHAT IT DOES NOT KNOW: anything about the data behind the range. No preset\n * list of a product's own, no ceiling of its own, no notion of whose clock\n * \"today\" runs on — `quickRanges`, `maxRangeDays` and `timeZone` are props, and\n * a consumer that needs its own periods passes them rather than teaching this\n * file about its domain. The calendar is `Calendar` in `selectionMode=\"range\"`,\n * not a second implementation of one.\n *\n * The value is a DRAFT (`{ from, to }`, either end possibly null) rather than a\n * finished window, so a half-picked or impossible range has somewhere to live\n * while it is being fixed. Every `onChange` carries the verdict with it.\n */\nimport Box from '@mui/material/Box/index.js';\nimport Paper from '@mui/material/Paper/index.js';\nimport useMediaQuery from '@mui/material/useMediaQuery/index.js';\nimport type { SxProps, Theme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport { Calendar } from '../Calendar';\n\nimport { toLocalDay } from './DateRangePicker.dates';\nimport { useDateRangePicker } from './DateRangePicker.hooks';\nimport { DEFAULT_QUICK_RANGES } from './DateRangePicker.quick';\nimport type { DateRangeDraft, DateRangePickerProps, WeekStart } from './DateRangePicker.types';\nimport { DateRangeFields } from './DateRangePickerFields';\nimport { DateRangeQuickList } from './DateRangePickerQuickList';\n\nconst CALENDAR_CLASS = 'date-range-picker__calendar';\n\n/** Below this the picker is a phone layout. MUI's own `md`, written out. */\nconst NARROW_QUERY = '(max-width:899.95px)';\n\nconst ROOT_SX: SxProps<Theme> = {\n  display: 'inline-flex',\n  flexDirection: 'column',\n  gap: 2,\n  p: 2,\n  maxWidth: '100%',\n  // `Calendar` renders its own `Paper` with 24px of padding. Nested in this one\n  // that reads as a box inside a box, so the inner frame is flattened here\n  // through the className hook the component exposes for exactly this.\n  [`& .${CALENDAR_CLASS}`]: {\n    p: 0,\n    boxShadow: 'none',\n    backgroundColor: 'transparent',\n    backgroundImage: 'none',\n  },\n};\n\nconst BODY_SX: SxProps<Theme> = {\n  display: 'flex',\n  // The quick column sits BESIDE the calendar on a wide screen. Narrow, it\n  // moves ABOVE it — `column-reverse`, so the DOM order stays calendar-then-\n  // list (the calendar is the primary control and should be reached first by a\n  // screen reader and by Tab) while the eye meets the quick ranges first, which\n  // is the order the phone mock asks for and the order a thumb wants: nine\n  // one-tap answers before a grid of thirty.\n  //\n  // A side column at 390px would squeeze the day grid to roughly half its width\n  // and make the numbers unreadable. Checked at 390px.\n  flexDirection: { xs: 'column-reverse', md: 'row' },\n  alignItems: { xs: 'stretch', md: 'flex-start' },\n  gap: 2,\n  maxWidth: '100%',\n};\n\n/**\n * The rule between the calendar and the quick ranges.\n *\n * Two lists of dates side by side with only whitespace between them read as one\n * ragged thing; the rule says which numbers belong to which control. It turns\n * with the layout — a vertical rule when the list is a column beside the\n * calendar, a horizontal one when it has moved above it — because a divider\n * that keeps its axis while the flex direction flips ends up separating nothing.\n */\nconst QUICK_DIVIDER_SX: SxProps<Theme> = {\n  borderColor: 'divider',\n  borderStyle: 'solid',\n  borderWidth: 0,\n  borderLeftWidth: { xs: 0, md: '1px' },\n  borderBottomWidth: { xs: '1px', md: 0 },\n  pl: { xs: 0, md: 2 },\n  pb: { xs: 2, md: 0 },\n  alignSelf: 'stretch',\n};\n\n/** And the rule above the typed pair, which is a third way in, not a caption. */\nconst FIELDS_DIVIDER_SX: SxProps<Theme> = {\n  borderTop: '1px solid',\n  borderColor: 'divider',\n  pt: 2,\n};\n\ntype Picker = ReturnType<typeof useDateRangePicker>;\n\n/**\n * How many months to draw.\n *\n * A month grid has a floor: seven columns that must stay legible, which is\n * about 280px. Two of them need 580, so on a phone the consumer's\n * `numberOfMonths` is not a preference that can be honoured — it is a request\n * for a layout that does not fit. Capped here rather than left to the consumer,\n * because the consumer chooses for its own reason (the reports dialog wants two\n * because a period often crosses a month boundary) and has no way to know the\n * picker is currently 390px wide.\n *\n * A media query rather than an `sx` breakpoint: this decides what to RENDER,\n * and CSS cannot un-render a second month.\n *\n * The query is a LITERAL, not `theme.breakpoints.down('md')`. The callback form\n * reads the theme from context and throws on a null one, so a consumer that\n * mounts this outside a `ThemeProvider` would crash — which the unit tests here\n * do, and which is a fair thing for a consumer to do.\n */\nfunction useMonthCount(requested: number | undefined): number | undefined {\n  const narrow = useMediaQuery(NARROW_QUERY);\n  return narrow ? 1 : requested;\n}\n\n/** The grid, in range mode — `Calendar`, never a second implementation of one. */\nfunction RangeCalendar({\n  calendarLabel,\n  picker,\n  value,\n  locale,\n  weekStartsOn,\n  months,\n  maxRangeDays,\n}: {\n  picker: Picker;\n  value: DateRangeDraft;\n  locale: string;\n  weekStartsOn: WeekStart;\n  months: number | undefined;\n  maxRangeDays: number | undefined;\n  calendarLabel: string;\n}): React.JSX.Element {\n  return (\n    <Calendar\n      key={picker.viewNonce}\n      ariaLabel={calendarLabel}\n      className={CALENDAR_CLASS}\n      selectionMode=\"range\"\n      locale={locale}\n      // One prop drives the grid's first column AND the day \"this week\" starts\n      // on, so a highlighted week can never begin mid-row.\n      firstDayOfWeek={weekStartsOn}\n      numberOfMonths={months}\n      range={{ start: toLocalDay(value.from), end: toLocalDay(value.to) }}\n      // BOTH callbacks, and the intermediate one does the work: the other fires\n      // only on the click that CLOSES a range, so a picker wired to it alone\n      // would not repaint after the first click.\n      onIntermediateRangeChange={picker.pickOnCalendar}\n      onRangeChange={picker.pickOnCalendar}\n      // The same ceiling the quick list is judged against, so the calendar\n      // cannot hand back a window the control has just called too long.\n      maxRangeLength={maxRangeDays}\n    />\n  );\n}\n\n/** The quick ranges, inside the rule that separates them from the grid. */\nfunction QuickColumn({\n  picker,\n  maxRangeDays,\n  dataTestId,\n}: {\n  picker: Picker;\n  maxRangeDays: number | undefined;\n  dataTestId: string;\n}): React.JSX.Element | null {\n  if (picker.options.length === 0) return null;\n  return (\n    <Box sx={QUICK_DIVIDER_SX}>\n      <DateRangeQuickList\n        options={picker.options}\n        activeId={picker.activeId}\n        onPick={picker.pickQuick}\n        reasonFor={(option) =>\n          picker.copy.overMax({ maxRangeDays: maxRangeDays ?? option.days, days: option.days })\n        }\n        label={picker.copy.quickRanges}\n        dataTestId={dataTestId}\n      />\n    </Box>\n  );\n}\n\nexport function DateRangePicker({\n  value,\n  onChange,\n  timeZone,\n  now,\n  maxRangeDays,\n  weekStartsOn = 0,\n  quickRanges = DEFAULT_QUICK_RANGES,\n  locale = 'en-US',\n  numberOfMonths,\n  messages,\n  dataTestId = 'date-range-picker',\n  className,\n}: DateRangePickerProps): React.JSX.Element {\n  const picker = useDateRangePicker({\n    value,\n    onChange,\n    timeZone,\n    now,\n    maxRangeDays,\n    weekStartsOn,\n    quickRanges,\n    messages,\n  });\n  const months = useMonthCount(numberOfMonths);\n\n  return (\n    <Paper className={className} data-testid={dataTestId} sx={ROOT_SX}>\n      <Box sx={BODY_SX}>\n        <RangeCalendar\n          calendarLabel={picker.copy.calendarLabel}\n          picker={picker}\n          value={value}\n          locale={locale}\n          weekStartsOn={weekStartsOn}\n          months={months}\n          maxRangeDays={maxRangeDays}\n        />\n        <QuickColumn picker={picker} maxRangeDays={maxRangeDays} dataTestId={dataTestId} />\n      </Box>\n      <Box sx={FIELDS_DIVIDER_SX}>\n        <DateRangeFields\n          value={value}\n          status={picker.status}\n          messages={picker.copy}\n          maxRangeDays={maxRangeDays}\n          onEdit={picker.editBound}\n          statusId={picker.statusId}\n          dataTestId={dataTestId}\n        />\n      </Box>\n    </Paper>\n  );\n}\n\nexport default DateRangePicker;\n"],"mappings":"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","names":[]}