@12-apps/ui 6.34.0 → 6.36.0

package/dist/chunk-PL2AB5HJ.js

@@ -0,0 +1,211 @@
+import {
+  useDataViewsCopy
+} from "./chunk-KHG57NAE.js";
+import {
+  default as default2
+} from "./chunk-6DPAWXZ3.js";
+import {
+  rem,
+  sxRem
+} from "./chunk-YKCAJ2TN.js";
+
+// src/components/data-display/DataViews/data-views-scopes.tsx
+import { useEffect, useMemo, useRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function resolveScope(scopes, stored) {
+  if (scopes.length === 0) return void 0;
+  const declared = stored !== void 0 && scopes.some((scope) => scope.id === stored);
+  return declared ? stored : scopes[0]?.id;
+}
+function isDevelopment() {
+  return typeof process !== "undefined" && process.env?.NODE_ENV !== "production";
+}
+function assertNoScopePillOverlap(scopes, fieldIds, scopeFieldId) {
+  if (scopes.length === 0 || !isDevelopment()) return;
+  const clash = scopeFieldId !== void 0 && fieldIds.includes(scopeFieldId) ? scopeFieldId : void 0;
+  if (clash === void 0) return;
+  throw new Error(
+    `DataViews: the field "${clash}" is both the scope partition (scopes: ${scopes.map((scope) => scope.id).join(", ")}) and a filter field (fields: ${fieldIds.join(", ")}). A field may drive the scope tabs or a filter pill, not both \u2014 drop one of the two declarations.`
+  );
+}
+function warnScopesNeedServer(scopes, hasServer) {
+  if (scopes.length === 0 || hasServer || !isDevelopment()) return;
+  console.warn(
+    "DataViews: `scopes` require server mode. The scope is tracked and would be emitted, but with no `server` there is nothing to emit it to and rows are NOT filtered in the browser. Supply `server` (see DataViewServer) or drop the scopes."
+  );
+}
+function useScopeConfigChecks(scopes, fieldIds, scopeFieldId, hasServer) {
+  useMemo(() => {
+    assertNoScopePillOverlap(scopes, fieldIds, scopeFieldId);
+    warnScopesNeedServer(scopes, hasServer);
+  }, [scopes, fieldIds.join(","), scopeFieldId, hasServer]);
+}
+function tabLabel(label, count) {
+  return count === void 0 ? label : `${label}, ${count}`;
+}
+function arrowTarget(key, index, total) {
+  if (key === "ArrowRight") return (index + 1) % total;
+  if (key === "ArrowLeft") return (index - 1 + total) % total;
+  if (key === "Home") return 0;
+  if (key === "End") return total - 1;
+  return null;
+}
+function useScrollActiveIntoView(value) {
+  const stripRef = useRef(null);
+  useEffect(() => {
+    const strip = stripRef.current;
+    if (!strip || value === void 0) return;
+    const active = strip.querySelector('[role="tab"][aria-selected="true"]');
+    active?.scrollIntoView?.({ block: "nearest", inline: "nearest" });
+  }, [value]);
+  return stripRef;
+}
+var scopeTabSx = (active) => {
+  return {
+    // A 44px min target: the strip is the first thing a thumb reaches on a phone.
+    minHeight: sxRem(44),
+    px: 1.5,
+    py: 1,
+    border: 0,
+    borderBottom: (theme) => `${rem(theme, 2)} solid`,
+    borderStyle: "solid",
+    borderColor: active ? "primary.main" : "transparent",
+    background: "none",
+    cursor: "pointer",
+    whiteSpace: "nowrap",
+    font: "inherit",
+    fontSize: sxRem(13),
+    fontWeight: active ? 600 : 400,
+    color: active ? "primary.main" : "text.secondary",
+    "&:hover": { color: active ? "primary.main" : "text.primary" },
+    "&:focus-visible": {
+      outline: (theme) => `${rem(theme, 2)} solid`,
+      outlineColor: "primary.main",
+      outlineOffset: sxRem(-2)
+    }
+  };
+};
+function ScopeCount({
+  count,
+  active,
+  testId
+}) {
+  return /* @__PURE__ */ jsx(
+    default2,
+    {
+      component: "span",
+      "aria-hidden": "true",
+      "data-testid": testId,
+      sx: {
+        ml: 0.75,
+        px: 0.75,
+        borderRadius: 5,
+        fontSize: sxRem(11),
+        fontWeight: 600,
+        bgcolor: active ? "primary.main" : "action.selected",
+        color: active ? "primary.contrastText" : "text.secondary"
+      },
+      children: count
+    }
+  );
+}
+function ScopeTab({
+  scope,
+  index,
+  total,
+  active,
+  count,
+  onChange,
+  moveTo,
+  testIdPrefix
+}) {
+  return /* @__PURE__ */ jsxs(
+    default2,
+    {
+      component: "button",
+      type: "button",
+      role: "tab",
+      id: `${testIdPrefix}-scope-tab-${scope.id}`,
+      "aria-selected": active,
+      tabIndex: active ? 0 : -1,
+      "aria-label": tabLabel(scope.label, count),
+      "data-testid": `${testIdPrefix}-scope-${scope.id}`,
+      onClick: () => onChange(scope.id),
+      onKeyDown: (event) => {
+        const target = arrowTarget(event.key, index, total);
+        if (target === null) return;
+        event.preventDefault();
+        moveTo(target);
+      },
+      sx: scopeTabSx(active),
+      children: [
+        scope.label,
+        count !== void 0 && /* @__PURE__ */ jsx(
+          ScopeCount,
+          {
+            count,
+            active,
+            testId: `${testIdPrefix}-scope-count-${scope.id}`
+          }
+        )
+      ]
+    }
+  );
+}
+var STRIP_SX = {
+  display: "flex",
+  alignItems: "stretch",
+  gap: 0.5,
+  // One row that scrolls — never wraps, never collapses into a select.
+  flexWrap: "nowrap",
+  overflowX: "auto",
+  overflowY: "hidden",
+  scrollbarWidth: "thin",
+  borderBottom: 1,
+  borderColor: "divider",
+  mx: { xs: -2, md: -3 },
+  px: { xs: 2, md: 3 }
+};
+function DataViewsScopeTabs({
+  scopes,
+  value,
+  onChange,
+  counts,
+  testIdPrefix
+}) {
+  const copy = useDataViewsCopy();
+  const stripRef = useScrollActiveIntoView(value);
+  const moveTo = (index) => {
+    stripRef.current?.querySelectorAll('[role="tab"]')?.[index]?.focus();
+    const next = scopes[index];
+    if (next) onChange(next.id);
+  };
+  if (scopes.length === 0) return null;
+  const activeIndex = Math.max(
+    0,
+    scopes.findIndex((scope) => scope.id === value)
+  );
+  return /* @__PURE__ */ jsx(default2, { ref: stripRef, role: "tablist", "aria-label": copy.filters.scopesLabel, "data-testid": `${testIdPrefix}-scopes`, sx: STRIP_SX, children: scopes.map((scope, index) => /* @__PURE__ */ jsx(
+    ScopeTab,
+    {
+      scope,
+      index,
+      total: scopes.length,
+      active: index === activeIndex,
+      count: counts?.[scope.id],
+      onChange,
+      moveTo,
+      testIdPrefix
+    },
+    scope.id
+  )) });
+}
+
+export {
+  resolveScope,
+  assertNoScopePillOverlap,
+  warnScopesNeedServer,
+  useScopeConfigChecks,
+  DataViewsScopeTabs
+};
+//# sourceMappingURL=chunk-PL2AB5HJ.js.map

package/dist/chunk-PL2AB5HJ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/DataViews/data-views-scopes.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useMemo, useRef } from \"react\";\n\nimport { useDataViewsCopy } from \"./data-views-copy-context\";\nimport { Box } from \"../../../mui/Box\";\nimport type { Theme } from \"@mui/material/styles/index.js\";\n\nimport { rem, sxRem } from \"../../../tokens/relative\";\n\n/**\n * SCOPES — a page-level partition rendered as a strip of tabs under the toolbar.\n *\n * A scope is not a filter. Filters NARROW within the current partition and are\n * multi-select by design; a scope PARTITIONS and is exclusive. The distinction\n * is load-bearing for three reasons, and each is why `FilterFieldConfig` could\n * not express these tabs:\n *\n *   1. They are mutually exclusive, and a pill is not.\n *   2. They carry counts of the WHOLE query, which no client can compute under\n *      pagination — the count has to come off the response\n *      ({@link DataViewServer.scopeCounts}).\n *   3. They compose with the filters instead of competing with them: the scope\n *      picks the bucket, the pills narrow inside it.\n *\n * The `predicate` is deliberately opaque to this package. Only the host knows\n * what \"recusados\" selects; the component's whole job is to say WHICH scope is\n * active and let the server answer.\n */\nexport interface ScopeConfig {\n  /** Stable id — travels in `DataViewQuery.scope` and in a saved view's state. */\n  id: string;\n  label: string;\n  /**\n   * Opaque payload the SERVER interprets. Omitted on the \"all\" scope. Never read\n   * by this package: a scope is applied at the backend, never in the browser.\n   */\n  predicate?: unknown;\n}\n\n/**\n * The active scope id, resolved against what the table currently declares.\n *\n * Resolution happens at READ time, on purpose. A saved view is written once and\n * read many times, and the declared scopes change underneath it — a scope\n * removed after a view was saved must fall back at render rather than break the\n * view or, worse, emit a scope the backend rejects. Resolving on write would\n * bake the mistake in.\n *\n * Returns `undefined` when the table declares no scopes, which is what keeps\n * `scope` out of the emitted query entirely for every table that never opted in.\n */\nexport function resolveScope(scopes: ScopeConfig[], stored: string | undefined): string | undefined {\n  if (scopes.length === 0) return undefined;\n  const declared = stored !== undefined && scopes.some((scope) => scope.id === stored);\n  return declared ? stored : scopes[0]?.id;\n}\n\n/** Are we running outside production? Config mistakes fail loudly only here. */\nfunction isDevelopment(): boolean {\n  return typeof process !== \"undefined\" && process.env?.NODE_ENV !== \"production\";\n}\n\n/**\n * Reject a table that partitions by a field AND declares a filter pill over the\n * same field. Two controls over one field is how a tab and a pill end up\n * contradicting each other — the pill says \"estado ∈ {pago, recusado}\" while the\n * tab says \"estado = recusado\", and nothing in either control can show the user\n * which one the server honoured.\n *\n * Throws in DEVELOPMENT ONLY. A thrown config error in production is strictly\n * worse than a duplicated control: the duplicate is confusing, the throw is a\n * blank page. Fail where it is seen and fixed.\n *\n * `scopeFieldId` is the field the scopes partition by, when the host knows it.\n * Absent, the scope IDS are checked against the field ids — which catches the\n * common shape where the scope ids ARE the field's values (`pago`, `recusado`)\n * declared a second time as a pill.\n */\nexport function assertNoScopePillOverlap(\n  scopes: ScopeConfig[],\n  fieldIds: string[],\n  scopeFieldId?: string,\n): void {\n  if (scopes.length === 0 || !isDevelopment()) return;\n  const clash = scopeFieldId !== undefined && fieldIds.includes(scopeFieldId) ? scopeFieldId : undefined;\n  if (clash === undefined) return;\n  throw new Error(\n    `DataViews: the field \"${clash}\" is both the scope partition (scopes: ` +\n      `${scopes.map((scope) => scope.id).join(\", \")}) and a filter field (fields: ` +\n      `${fieldIds.join(\", \")}). A field may drive the scope tabs or a filter pill, not both — ` +\n      `drop one of the two declarations.`,\n  );\n}\n\n/**\n * A development-only warning that scopes need server wiring. Scopes are resolved\n * and emitted, never applied in the browser: filtering locally would make the\n * counts, the \"N de N\" counter and the rendered rows disagree the moment a\n * second page exists.\n */\nexport function warnScopesNeedServer(scopes: ScopeConfig[], hasServer: boolean): void {\n  if (scopes.length === 0 || hasServer || !isDevelopment()) return;\n  // eslint-disable-next-line no-console -- a config warning has no other channel.\n  console.warn(\n    \"DataViews: `scopes` require server mode. The scope is tracked and would be emitted, \" +\n      \"but with no `server` there is nothing to emit it to and rows are NOT filtered in the browser. \" +\n      \"Supply `server` (see DataViewServer) or drop the scopes.\",\n  );\n}\n\n/**\n * The scope configuration's setup-time checks, run once per configuration rather\n * than per render: reject a field that is both a scope partition and a filter\n * pill (development only — see `assertNoScopePillOverlap`), and warn about\n * scopes declared with no server to apply them.\n *\n * In a `useMemo` so a mistake surfaces during the FIRST render, where the stack\n * still points at the table that made it.\n */\nexport function useScopeConfigChecks(\n  scopes: ScopeConfig[],\n  fieldIds: string[],\n  scopeFieldId: string | undefined,\n  hasServer: boolean,\n): void {\n  useMemo(() => {\n    assertNoScopePillOverlap(scopes, fieldIds, scopeFieldId);\n    warnScopesNeedServer(scopes, hasServer);\n    // Keyed on the ids rather than the arrays: hosts pass inline literals, so the\n    // array identity changes every render while the configuration does not.\n  }, [scopes, fieldIds.join(\",\"), scopeFieldId, hasServer]);\n}\n\n/** Everything the tab strip needs; `counts` is absent when the server omits it. */\ninterface DataViewsScopeTabsProps {\n  scopes: ScopeConfig[];\n  /** The RESOLVED active scope id (see {@link resolveScope}). */\n  value: string | undefined;\n  onChange: (id: string) => void;\n  /** Server-supplied per-scope totals. Absent ⇒ tabs render WITHOUT numbers. */\n  counts?: Record<string, number>;\n  testIdPrefix: string;\n}\n\n/** The accessible name of one tab: its label, plus its count when there is one. */\nfunction tabLabel(label: string, count: number | undefined): string {\n  return count === undefined ? label : `${label}, ${count}`;\n}\n\n/**\n * Move focus + selection between tabs with the arrow keys, wrapping at both\n * ends. Selection FOLLOWS focus here (an \"automatic activation\" tab list): each\n * arrow press is one scope change, which is one query — the same cost as a\n * click, and it keeps the strip's behaviour identical whichever input the\n * operator uses.\n */\nfunction arrowTarget(key: string, index: number, total: number): number | null {\n  if (key === \"ArrowRight\") return (index + 1) % total;\n  if (key === \"ArrowLeft\") return (index - 1 + total) % total;\n  if (key === \"Home\") return 0;\n  if (key === \"End\") return total - 1;\n  return null;\n}\n\n/** The active tab's own scroll-into-view, so a deep link to a late scope lands visible. */\nfunction useScrollActiveIntoView(value: string | undefined): React.RefObject<HTMLDivElement | null> {\n  const stripRef = useRef<HTMLDivElement | null>(null);\n  useEffect(() => {\n    const strip = stripRef.current;\n    if (!strip || value === undefined) return;\n    const active = strip.querySelector<HTMLElement>('[role=\"tab\"][aria-selected=\"true\"]');\n    // jsdom implements neither, so guard rather than assume the DOM is a browser's.\n    active?.scrollIntoView?.({ block: \"nearest\", inline: \"nearest\" });\n  }, [value]);\n  return stripRef;\n}\n\n/** One tab's visual + a11y state, kept out of the strip's map for readability. */\nconst scopeTabSx = (active: boolean): Record<string, unknown> => {\n  return {\n    // A 44px min target: the strip is the first thing a thumb reaches on a phone.\n    minHeight: sxRem(44),\n    px: 1.5,\n    py: 1,\n    border: 0,\n    borderBottom: (theme: Theme) => `${rem(theme, 2)} solid`,\n    borderStyle: \"solid\",\n    borderColor: active ? \"primary.main\" : \"transparent\",\n    background: \"none\",\n    cursor: \"pointer\",\n    whiteSpace: \"nowrap\",\n    font: \"inherit\",\n    fontSize: sxRem(13),\n    fontWeight: active ? 600 : 400,\n    color: active ? \"primary.main\" : \"text.secondary\",\n    \"&:hover\": { color: active ? \"primary.main\" : \"text.primary\" },\n    \"&:focus-visible\": {\n      outline: (theme: Theme) => `${rem(theme, 2)} solid`,\n      outlineColor: \"primary.main\",\n      outlineOffset: sxRem(-2),\n    },\n  };\n};\n\n/** The count badge. Rendered only when the server actually supplied a number. */\nfunction ScopeCount({\n  count,\n  active,\n  testId,\n}: {\n  count: number;\n  active: boolean;\n  testId: string;\n}): React.JSX.Element {\n  return (\n    <Box\n      component=\"span\"\n      // The number is already in the tab's `aria-label`; announcing it twice\n      // would read \"Recusados 2, 2\".\n      aria-hidden=\"true\"\n      data-testid={testId}\n      sx={{\n        ml: 0.75,\n        px: 0.75,\n        borderRadius: 5,\n        fontSize: sxRem(11),\n        fontWeight: 600,\n        bgcolor: active ? \"primary.main\" : \"action.selected\",\n        color: active ? \"primary.contrastText\" : \"text.secondary\",\n      }}\n    >\n      {count}\n    </Box>\n  );\n}\n\ninterface ScopeTabProps {\n  scope: ScopeConfig;\n  index: number;\n  total: number;\n  active: boolean;\n  count: number | undefined;\n  onChange: (id: string) => void;\n  /**\n   * Move to the tab at `index`: focus it AND select it. Only the strip knows\n   * the other scopes and owns the DOM, so the move belongs to it.\n   */\n  moveTo: (index: number) => void;\n  testIdPrefix: string;\n}\n\n/** One tab: a real `<button role=\"tab\">` with a roving tabindex and arrow keys. */\nfunction ScopeTab({\n  scope,\n  index,\n  total,\n  active,\n  count,\n  onChange,\n  moveTo,\n  testIdPrefix,\n}: ScopeTabProps): React.JSX.Element {\n  return (\n    <Box\n      component=\"button\"\n      type=\"button\"\n      role=\"tab\"\n      id={`${testIdPrefix}-scope-tab-${scope.id}`}\n      aria-selected={active}\n      // Roving tabindex: one tab stop for the whole strip, arrows move within it.\n      tabIndex={active ? 0 : -1}\n      aria-label={tabLabel(scope.label, count)}\n      data-testid={`${testIdPrefix}-scope-${scope.id}`}\n      onClick={() => onChange(scope.id)}\n      onKeyDown={(event: React.KeyboardEvent<HTMLButtonElement>) => {\n        const target = arrowTarget(event.key, index, total);\n        if (target === null) return;\n        event.preventDefault();\n        moveTo(target);\n      }}\n      sx={scopeTabSx(active)}\n    >\n      {scope.label}\n      {count !== undefined && (\n        <ScopeCount\n          count={count}\n          active={active}\n          testId={`${testIdPrefix}-scope-count-${scope.id}`}\n        />\n      )}\n    </Box>\n  );\n}\n\n/** The strip's own layout: one non-wrapping row that scrolls horizontally. */\nconst STRIP_SX = {\n  display: \"flex\",\n  alignItems: \"stretch\",\n  gap: 0.5,\n  // One row that scrolls — never wraps, never collapses into a select.\n  flexWrap: \"nowrap\",\n  overflowX: \"auto\",\n  overflowY: \"hidden\",\n  scrollbarWidth: \"thin\",\n  borderBottom: 1,\n  borderColor: \"divider\",\n  mx: { xs: -2, md: -3 },\n  px: { xs: 2, md: 3 },\n} as const;\n\n/**\n * The scope strip: a horizontally scrolling tab list under the toolbar.\n *\n * It SCROLLS rather than collapsing into a select on a narrow screen, which is\n * the opposite of what the filter pills do — and deliberately. The counts are\n * the reason the tabs exist at all; burying them behind a menu costs a tap per\n * glance, exactly on the device where glancing is the point.\n *\n * Counts render verbatim from `counts` — never derived from the loaded page, and\n * never invented when the key is missing. A missing count means \"the server did\n * not say\", which reads honestly as no badge at all.\n */\nexport function DataViewsScopeTabs({\n  scopes,\n  value,\n  onChange,\n  counts,\n  testIdPrefix,\n}: DataViewsScopeTabsProps): React.JSX.Element | null {\n  const copy = useDataViewsCopy();\n  const stripRef = useScrollActiveIntoView(value);\n  const moveTo = (index: number): void => {\n    // Focus FIRST, then select: the roving tabindex follows the selection, so\n    // focusing afterwards would land on a tab that has given up its tab stop.\n    stripRef.current?.querySelectorAll<HTMLElement>('[role=\"tab\"]')?.[index]?.focus();\n    const next = scopes[index];\n    if (next) onChange(next.id);\n  };\n  // Reserve NO vertical space when there is nothing to show: a page that\n  // declares no scopes must not gain an empty row.\n  if (scopes.length === 0) return null;\n  const activeIndex = Math.max(\n    0,\n    scopes.findIndex((scope) => scope.id === value),\n  );\n\n  return (\n    <Box ref={stripRef} role=\"tablist\" aria-label={copy.filters.scopesLabel} data-testid={`${testIdPrefix}-scopes`} sx={STRIP_SX}>\n      {scopes.map((scope, index) => (\n        <ScopeTab\n          key={scope.id}\n          scope={scope}\n          index={index}\n          total={scopes.length}\n          active={index === activeIndex}\n          count={counts?.[scope.id]}\n          onChange={onChange}\n          moveTo={moveTo}\n          testIdPrefix={testIdPrefix}\n        />\n      ))}\n    </Box>\n  );\n}\n"],"mappings":"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","names":["default"]}

package/dist/chunk-PMP6WJJS.js

@@ -0,0 +1,141 @@
+import {
+  rem
+} from "./chunk-YKCAJ2TN.js";
+
+// src/components/navigation/Pagination/Pagination.styles.ts
+import { alpha } from "@mui/material/styles/index.js";
+var ITEM_SIZE_STYLES = {
+  sm: (theme) => ({
+    fontSize: rem(theme, 14),
+    minWidth: 28,
+    height: 28,
+    padding: theme.spacing(0.25, 0.5)
+  }),
+  lg: (theme) => ({
+    fontSize: rem(theme, 18),
+    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-PMP6WJJS.js.map

package/dist/chunk-PMP6WJJS.js.map

@@ -0,0 +1 @@
+{"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';\nimport { rem } from '../../../tokens/relative';\n\nconst ITEM_SIZE_STYLES: Record<string, (theme: Theme) => CSSObject> = {\n  sm: (theme) => ({\n      fontSize: rem(theme, 14),\n      minWidth: 28,\n      height: 28,\n      padding: theme.spacing(0.25, 0.5) }),\n  lg: (theme) => ({\n      fontSize: rem(theme, 18),\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-PNLM35GU.js

@@ -0,0 +1,159 @@
+import {
+  CategoryQuickActions
+} from "./chunk-PGGYZU7Q.js";
+import {
+  CategoryPanelList
+} from "./chunk-TOXTJ7MU.js";
+import {
+  CategoryPanelHead,
+  CategoryPinnedTray
+} from "./chunk-EFV5QJNM.js";
+import {
+  CategoryMultiFoot,
+  CategorySingleFoot
+} from "./chunk-OWA7GPWR.js";
+import {
+  removeChip
+} from "./chunk-PN4HVM43.js";
+import {
+  panelSx,
+  sheetSx
+} from "./chunk-BXAL7OIS.js";
+
+// src/components/form/CategorySelect/CategoryPanel.tsx
+import Box from "@mui/material/Box/index.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+function CategoryPanel({
+  state,
+  chips,
+  rowIds,
+  changed,
+  single,
+  sheet,
+  loading,
+  showCounts,
+  allowParentSelection,
+  ariaLabel,
+  onKeyDown,
+  onActivateCategory,
+  onActivateSubcategory,
+  onApply,
+  onCancel,
+  onCreateCategory,
+  searchInputRef,
+  listRef,
+  dataTestId,
+  copy
+}) {
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      onKeyDown,
+      role: "dialog",
+      "aria-label": ariaLabel,
+      "data-testid": `${dataTestId}-panel`,
+      sx: (theme) => ({ ...panelSx(theme), ...sheet ? sheetSx(theme) : {} }),
+      children: [
+        /* @__PURE__ */ jsx(
+          CategoryPanelHead,
+          {
+            copy,
+            query: state.query,
+            placeholder: single ? copy.search.placeholderSingle : copy.search.placeholderMulti,
+            sheet,
+            quickActions: single ? void 0 : /* @__PURE__ */ jsx(CategoryQuickActions, { state, dataTestId, copy }),
+            onQueryChange: state.setQuery,
+            searchInputRef,
+            dataTestId
+          }
+        ),
+        !single && !loading && /* @__PURE__ */ jsx(PinnedTray, { state, chips, dataTestId, copy }),
+        /* @__PURE__ */ jsx(
+          CategoryPanelList,
+          {
+            copy,
+            groups: state.visibleGroups,
+            query: state.query,
+            draft: state.draft,
+            rowIds,
+            activeIndex: state.activeIndex,
+            sheet,
+            single,
+            loading,
+            showCounts,
+            allowParentSelection,
+            deepTree: state.deepTree,
+            isExpanded: state.isExpanded,
+            onToggleExpanded: state.toggleExpanded,
+            onActivateCategory,
+            onActivateSubcategory,
+            onClearQuery: () => state.setQuery(""),
+            onCreateCategory,
+            listRef,
+            dataTestId
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          PanelFooter,
+          {
+            state,
+            changed,
+            single,
+            sheet,
+            copy,
+            onApply,
+            onCancel,
+            dataTestId
+          }
+        )
+      ]
+    }
+  );
+}
+function PinnedTray({
+  state,
+  chips,
+  dataTestId,
+  copy
+}) {
+  return /* @__PURE__ */ jsx(
+    CategoryPinnedTray,
+    {
+      copy,
+      chips,
+      onRemove: (chipId) => state.setDraft(removeChip(state.allGroups, chipId, state.draft)),
+      dataTestId
+    }
+  );
+}
+function PanelFooter({
+  state,
+  changed,
+  single,
+  sheet,
+  onApply,
+  onCancel,
+  dataTestId,
+  copy
+}) {
+  if (single) {
+    return /* @__PURE__ */ jsx(CategorySingleFoot, { sheet, onCancel, dataTestId, copy });
+  }
+  return /* @__PURE__ */ jsx(
+    CategoryMultiFoot,
+    {
+      count: state.draft.size,
+      changed,
+      sheet,
+      copy,
+      onClear: () => state.setDraft(/* @__PURE__ */ new Set()),
+      onApply,
+      dataTestId
+    }
+  );
+}
+
+export {
+  CategoryPanel
+};
+//# sourceMappingURL=chunk-PNLM35GU.js.map