@12-apps/ui 6.11.0 → 6.12.0

package/dist/chunk-HQBXB5QB.js

@@ -0,0 +1,101 @@
+import {
+  buildCategoryGroups,
+  filterCategoryGroups,
+  flattenRows,
+  toggleCategoryLeaves,
+  toggleLeaf
+} from "./chunk-DVTCZR3K.js";
+
+// src/components/form/CategorySelect/useCategorySelect.ts
+import { useCallback, useMemo, useRef, useState } from "react";
+function useExpandedCategories(allGroups, searching) {
+  const [expanded, setExpanded] = useState(() => /* @__PURE__ */ new Set());
+  const isExpanded = useCallback(
+    (categoryId) => searching || expanded.has(categoryId),
+    [searching, expanded]
+  );
+  const toggleExpanded = useCallback((categoryId) => {
+    setExpanded((current) => {
+      const next = new Set(current);
+      if (!next.delete(categoryId)) next.add(categoryId);
+      return next;
+    });
+  }, []);
+  const setAllExpanded = useCallback(
+    (shouldExpand) => {
+      setExpanded(shouldExpand ? new Set(allGroups.map((g) => g.category.id)) : /* @__PURE__ */ new Set());
+    },
+    [allGroups]
+  );
+  const expandAll = useCallback((groups) => {
+    setExpanded(new Set(groups.map((group) => group.category.id)));
+  }, []);
+  return { isExpanded, toggleExpanded, setAllExpanded, expandAll };
+}
+function useDraftSelection(initial) {
+  const [draft, setDraftState] = useState(() => new Set(initial));
+  const toggleCategory = useCallback((group) => {
+    setDraftState((current) => toggleCategoryLeaves(group, current));
+  }, []);
+  const toggleSubcategory = useCallback((id) => {
+    setDraftState((current) => toggleLeaf(id, current));
+  }, []);
+  const setDraft = useCallback((next) => setDraftState(next), []);
+  return { draft, setDraft, toggleCategory, toggleSubcategory };
+}
+function useCategorySelect({
+  options,
+  selected
+}) {
+  const [open, setOpen] = useState(false);
+  const [query, setQueryState] = useState("");
+  const [activeIndex, setActiveIndex] = useState(-1);
+  const triggerRef = useRef(null);
+  const allGroups = useMemo(() => buildCategoryGroups(options), [options]);
+  const visibleGroups = useMemo(
+    () => filterCategoryGroups(allGroups, query),
+    [allGroups, query]
+  );
+  const expansion = useExpandedCategories(allGroups, query.trim().length > 0);
+  const selection = useDraftSelection(selected);
+  const rows = useMemo(
+    () => flattenRows(visibleGroups, expansion.isExpanded),
+    [visibleGroups, expansion.isExpanded]
+  );
+  const openPanel = useCallback(() => {
+    selection.setDraft(new Set(selected));
+    expansion.expandAll(allGroups);
+    setQueryState("");
+    setActiveIndex(-1);
+    setOpen(true);
+  }, [selected, allGroups, selection, expansion]);
+  const closePanel = useCallback(() => {
+    setOpen(false);
+    setQueryState("");
+    setActiveIndex(-1);
+  }, []);
+  const setQuery = useCallback((next) => {
+    setQueryState(next);
+    setActiveIndex(-1);
+  }, []);
+  return {
+    ...expansion,
+    ...selection,
+    open,
+    query,
+    visibleGroups,
+    allGroups,
+    rows,
+    activeIndex,
+    setQuery,
+    setActiveIndex,
+    openPanel,
+    closePanel,
+    triggerRef
+  };
+}
+
+export {
+  useCategorySelect
+};
+//# sourceMappingURL=chunk-HQBXB5QB.js.map

package/dist/chunk-HQBXB5QB.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/CategorySelect/useCategorySelect.ts"],"sourcesContent":["import { useCallback, useMemo, useRef, useState } from 'react';\n\nimport {\n  buildCategoryGroups,\n  filterCategoryGroups,\n  flattenRows,\n  toggleCategoryLeaves,\n  toggleLeaf,\n  type CategoryRowRef,\n} from './category-tree';\nimport type { CategoryGroup, CategorySelectOption } from './CategorySelect.types';\n\n/** Which categories are unfolded, and the ways that set changes. */\ninterface ExpansionState {\n  isExpanded: (categoryId: string) => boolean;\n  toggleExpanded: (categoryId: string) => void;\n  setAllExpanded: (expanded: boolean) => void;\n  expandAll: (groups: CategoryGroup[]) => void;\n}\n\n/**\n * The expanded set.\n *\n * `searching` short-circuits the lookup instead of mutating the set: a query must\n * reveal every hit, but clearing it has to restore whatever the admin had folded,\n * which an overwrite would have destroyed.\n */\nfunction useExpandedCategories(\n  allGroups: CategoryGroup[],\n  searching: boolean,\n): ExpansionState {\n  const [expanded, setExpanded] = useState<ReadonlySet<string>>(() => new Set());\n\n  const isExpanded = useCallback(\n    (categoryId: string) => searching || expanded.has(categoryId),\n    [searching, expanded],\n  );\n\n  const toggleExpanded = useCallback((categoryId: string) => {\n    setExpanded((current) => {\n      const next = new Set(current);\n      if (!next.delete(categoryId)) next.add(categoryId);\n      return next;\n    });\n  }, []);\n\n  const setAllExpanded = useCallback(\n    (shouldExpand: boolean) => {\n      setExpanded(shouldExpand ? new Set(allGroups.map((g) => g.category.id)) : new Set());\n    },\n    [allGroups],\n  );\n\n  const expandAll = useCallback((groups: CategoryGroup[]) => {\n    setExpanded(new Set(groups.map((group) => group.category.id)));\n  }, []);\n\n  return { isExpanded, toggleExpanded, setAllExpanded, expandAll };\n}\n\n/** The pending selection and the two ways a row changes it. */\ninterface DraftState {\n  draft: ReadonlySet<string>;\n  setDraft: (next: ReadonlySet<string>) => void;\n  toggleCategory: (group: CategoryGroup) => void;\n  toggleSubcategory: (id: string) => void;\n}\n\nfunction useDraftSelection(initial: readonly string[]): DraftState {\n  const [draft, setDraftState] = useState<ReadonlySet<string>>(() => new Set(initial));\n\n  const toggleCategory = useCallback((group: CategoryGroup) => {\n    setDraftState((current) => toggleCategoryLeaves(group, current));\n  }, []);\n\n  const toggleSubcategory = useCallback((id: string) => {\n    setDraftState((current) => toggleLeaf(id, current));\n  }, []);\n\n  const setDraft = useCallback((next: ReadonlySet<string>) => setDraftState(next), []);\n\n  return { draft, setDraft, toggleCategory, toggleSubcategory };\n}\n\n/** Everything the panel and trigger need to render and drive one select. */\nexport interface CategorySelectState extends ExpansionState, DraftState {\n  open: boolean;\n  query: string;\n  /** Groups after the search filter — what is actually on screen. */\n  visibleGroups: CategoryGroup[];\n  /** All groups, unfiltered — the basis for chips and \"select all\". */\n  allGroups: CategoryGroup[];\n  rows: CategoryRowRef[];\n  activeIndex: number;\n  setQuery: (next: string) => void;\n  setActiveIndex: (next: number) => void;\n  openPanel: () => void;\n  closePanel: () => void;\n  triggerRef: React.RefObject<HTMLButtonElement | null>;\n}\n\ninterface UseCategorySelectArgs {\n  options: CategorySelectOption[];\n  /** The applied selection to seed the draft from each time the panel opens. */\n  selected: readonly string[];\n}\n\n/**\n * Panel state for one CategorySelect.\n *\n * The DRAFT is the load-bearing idea. Ticks land here, not on the caller's\n * `value`, so the list behind the panel does not refetch on every click; Apply\n * publishes, dismissing discards. Opening re-seeds the draft from the applied\n * value, which is what makes \"cancel\" mean cancel.\n */\nexport function useCategorySelect({\n  options,\n  selected,\n}: UseCategorySelectArgs): CategorySelectState {\n  const [open, setOpen] = useState(false);\n  const [query, setQueryState] = useState('');\n  const [activeIndex, setActiveIndex] = useState(-1);\n  const triggerRef = useRef<HTMLButtonElement | null>(null);\n\n  const allGroups = useMemo(() => buildCategoryGroups(options), [options]);\n  const visibleGroups = useMemo(\n    () => filterCategoryGroups(allGroups, query),\n    [allGroups, query],\n  );\n\n  const expansion = useExpandedCategories(allGroups, query.trim().length > 0);\n  const selection = useDraftSelection(selected);\n  const rows = useMemo(\n    () => flattenRows(visibleGroups, expansion.isExpanded),\n    [visibleGroups, expansion.isExpanded],\n  );\n\n  const openPanel = useCallback(() => {\n    selection.setDraft(new Set(selected));\n    expansion.expandAll(allGroups);\n    setQueryState('');\n    setActiveIndex(-1);\n    setOpen(true);\n  }, [selected, allGroups, selection, expansion]);\n\n  const closePanel = useCallback(() => {\n    setOpen(false);\n    setQueryState('');\n    setActiveIndex(-1);\n  }, []);\n\n  const setQuery = useCallback((next: string) => {\n    setQueryState(next);\n    setActiveIndex(-1);\n  }, []);\n\n  return {\n    ...expansion,\n    ...selection,\n    open,\n    query,\n    visibleGroups,\n    allGroups,\n    rows,\n    activeIndex,\n    setQuery,\n    setActiveIndex,\n    openPanel,\n    closePanel,\n    triggerRef,\n  };\n}\n"],"mappings":"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","names":[]}

package/dist/chunk-HQJ75HHI.js

@@ -0,0 +1,51 @@
+import {
+  headingSx
+} from "./chunk-QCIWROKG.js";
+
+// src/components/typography/Heading/Heading.tsx
+import { styled } from "@mui/material/styles/index.js";
+import React from "react";
+import { jsx } from "react/jsx-runtime";
+var styledHeading = () => styled("h1", {
+  shouldForwardProp: (prop) => !["customSize", "customColor", "customWeight", "gradient"].includes(prop)
+})(({ theme, ...flags }) => ({ ...headingSx(theme, flags) }));
+var STYLED_BY_TAG = {
+  h1: styledHeading().withComponent("h1"),
+  h2: styledHeading().withComponent("h2"),
+  h3: styledHeading().withComponent("h3"),
+  h4: styledHeading().withComponent("h4"),
+  h5: styledHeading().withComponent("h5"),
+  h6: styledHeading().withComponent("h6")
+};
+var TAG_FOR_LEVEL = {
+  display: "h1",
+  h1: "h1",
+  h2: "h2",
+  h3: "h3",
+  h4: "h4",
+  h5: "h5",
+  h6: "h6"
+};
+var Heading = React.forwardRef(
+  ({ level = "h2", size, color = "neutral", weight = "bold", gradient = false, children, ...props }, ref) => {
+    const Styled = STYLED_BY_TAG[TAG_FOR_LEVEL[level] ?? "h2"];
+    return /* @__PURE__ */ jsx(
+      Styled,
+      {
+        ref,
+        customSize: size ?? level,
+        customColor: color,
+        customWeight: weight,
+        gradient,
+        ...props,
+        children
+      }
+    );
+  }
+);
+Heading.displayName = "Heading";
+
+export {
+  Heading
+};
+//# sourceMappingURL=chunk-HQJ75HHI.js.map

package/dist/chunk-HQJ75HHI.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/typography/Heading/Heading.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport { headingSx } from './Heading.styles';\nimport type { HeadingFlags } from './Heading.styles';\nimport type { HeadingProps } from './Heading.types';\n\nconst styledHeading = () =>\n  styled('h1', {\n    shouldForwardProp: (prop) =>\n      !['customSize', 'customColor', 'customWeight', 'gradient'].includes(prop as string),\n  })<HeadingFlags>(({ theme, ...flags }) => ({ ...headingSx(theme, flags) }));\n\n/**\n * One styled component per tag. They share a style function but must be\n * separate components, since `withComponent` fixes the element at definition\n * time — a single component switching tags per render would remount the text.\n */\nconst STYLED_BY_TAG = {\n  h1: styledHeading().withComponent('h1'),\n  h2: styledHeading().withComponent('h2'),\n  h3: styledHeading().withComponent('h3'),\n  h4: styledHeading().withComponent('h4'),\n  h5: styledHeading().withComponent('h5'),\n  h6: styledHeading().withComponent('h6'),\n} as const;\n\n/**\n * Which tag each level renders. `display` is a size, not a rank, so it uses the\n * h1 element — the document still gets one level-one heading rather than an\n * unnamed tag outside the outline.\n */\nconst TAG_FOR_LEVEL: Record<string, keyof typeof STYLED_BY_TAG> = {\n  display: 'h1',\n  h1: 'h1',\n  h2: 'h2',\n  h3: 'h3',\n  h4: 'h4',\n  h5: 'h5',\n  h6: 'h6',\n};\n\n/**\n * The rank and the size were ALREADY independent in here — `TAG_FOR_LEVEL[level]`\n * and `customLevel={level}` are two separate derivations from one prop. The\n * component just never let a caller set them apart, so anyone who needed an\n * `h1` at a smaller size had to reach around the component and restyle it.\n * `size` is that seam, exposed: it defaults to `level`, so nothing that exists\n * renders differently.\n */\nexport const Heading = React.forwardRef<globalThis.HTMLHeadingElement, HeadingProps>(\n  (\n    { level = 'h2', size, color = 'neutral', weight = 'bold', gradient = false, children, ...props },\n    ref,\n  ) => {\n    const Styled = STYLED_BY_TAG[TAG_FOR_LEVEL[level] ?? 'h2'];\n\n    return (\n      <Styled\n        ref={ref}\n        customSize={size ?? level}\n        customColor={color}\n        customWeight={weight}\n        gradient={gradient}\n        {...props}\n      >\n        {children}\n      </Styled>\n    );\n  },\n);\n\nHeading.displayName = 'Heading';\n"],"mappings":";;;;;AAAA,SAAS,cAAc;AACvB,OAAO,WAAW;AAyDZ;AAnDN,IAAM,gBAAgB,MACpB,OAAO,MAAM;AAAA,EACX,mBAAmB,CAAC,SAClB,CAAC,CAAC,cAAc,eAAe,gBAAgB,UAAU,EAAE,SAAS,IAAc;AACtF,CAAC,EAAgB,CAAC,EAAE,OAAO,GAAG,MAAM,OAAO,EAAE,GAAG,UAAU,OAAO,KAAK,EAAE,EAAE;AAO5E,IAAM,gBAAgB;AAAA,EACpB,IAAI,cAAc,EAAE,cAAc,IAAI;AAAA,EACtC,IAAI,cAAc,EAAE,cAAc,IAAI;AAAA,EACtC,IAAI,cAAc,EAAE,cAAc,IAAI;AAAA,EACtC,IAAI,cAAc,EAAE,cAAc,IAAI;AAAA,EACtC,IAAI,cAAc,EAAE,cAAc,IAAI;AAAA,EACtC,IAAI,cAAc,EAAE,cAAc,IAAI;AACxC;AAOA,IAAM,gBAA4D;AAAA,EAChE,SAAS;AAAA,EACT,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAUO,IAAM,UAAU,MAAM;AAAA,EAC3B,CACE,EAAE,QAAQ,MAAM,MAAM,QAAQ,WAAW,SAAS,QAAQ,WAAW,OAAO,UAAU,GAAG,MAAM,GAC/F,QACG;AACH,UAAM,SAAS,cAAc,cAAc,KAAK,KAAK,IAAI;AAEzD,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,YAAY,QAAQ;AAAA,QACpB,aAAa;AAAA,QACb,cAAc;AAAA,QACd;AAAA,QACC,GAAG;AAAA,QAEH;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAEA,QAAQ,cAAc;","names":[]}

package/dist/chunk-HVIB6WMD.js

@@ -0,0 +1,187 @@
+import {
+  DATA_VIEWS_LAYOUTS
+} from "./chunk-C6ATAHBX.js";
+import {
+  useDataViewsCopy
+} from "./chunk-KHG57NAE.js";
+import {
+  Slider
+} from "./chunk-FA3TYWX2.js";
+import {
+  default as default2
+} from "./chunk-6DPAWXZ3.js";
+
+// src/components/data-display/DataViews/data-views-layout-context.tsx
+import { createContext, useContext, useEffect, useMemo, useState } from "react";
+import GridViewOutlinedIcon from "@mui/icons-material/GridViewOutlined";
+import { jsx, jsxs } from "react/jsx-runtime";
+var DataViewsLayoutContext = createContext(null);
+var DEFAULT_ZOOM = 35;
+var BASE_CARD_WIDTH = 180;
+var CARD_SCALE_RANGE = { min: 0.75, max: 2 };
+var LAYOUT_STORAGE_KEY = "dataviews:layout";
+var DENSITY_STORAGE_KEY = "dataviews:density";
+var DENSITIES = ["compact", "cozy", "comfortable"];
+var DENSITY_ROW_PADDING = {
+  compact: 0.25,
+  cozy: 0.75,
+  comfortable: 1.5
+};
+var DENSITY_CARD_SCALE = {
+  compact: 0.84,
+  cozy: 1.15,
+  comfortable: 1.4
+};
+function cardTargetWidthFor(zoom, density) {
+  return Math.round(cardMinWidthForZoom(zoom) * DENSITY_CARD_SCALE[density]);
+}
+var DENSITY_BOARD_SCALE = {
+  compact: 0.95,
+  cozy: 1,
+  comfortable: 1.25
+};
+function cardScaleForZoom(zoom) {
+  const clamped = Math.max(0, Math.min(100, zoom));
+  return CARD_SCALE_RANGE.min + clamped / 100 * (CARD_SCALE_RANGE.max - CARD_SCALE_RANGE.min);
+}
+function cardMinWidthForZoom(zoom) {
+  return Math.round(BASE_CARD_WIDTH * cardScaleForZoom(zoom));
+}
+function isLayout(value) {
+  return DATA_VIEWS_LAYOUTS.includes(value);
+}
+function isDensity(value) {
+  return DENSITIES.includes(value);
+}
+function readStoredDensity() {
+  try {
+    if (typeof window === "undefined") return void 0;
+    const stored = window.localStorage.getItem(DENSITY_STORAGE_KEY);
+    return isDensity(stored) ? stored : void 0;
+  } catch {
+    return void 0;
+  }
+}
+function pinLayout(layout, available) {
+  if (layout === "cards") return available.canUseCards ? "cards" : "table";
+  if (layout === "list") return available.canUseList ? "list" : "table";
+  if (layout === "board") return available.canUseBoard ? "board" : "table";
+  return "table";
+}
+function readStoredLayout() {
+  try {
+    if (typeof window === "undefined") return void 0;
+    const stored = window.localStorage.getItem(LAYOUT_STORAGE_KEY);
+    return isLayout(stored) ? stored : void 0;
+  } catch {
+    return void 0;
+  }
+}
+function writeStored(key, value) {
+  try {
+    if (typeof window === "undefined") return;
+    window.localStorage.setItem(key, value);
+  } catch {
+  }
+}
+function DataViewsLayoutProvider({
+  canUseCards = false,
+  canUseList = false,
+  canUseBoard = false,
+  defaultLayout = "table",
+  viewLayout,
+  ignoreStoredLayout = false,
+  children
+}) {
+  const availability = { canUseCards, canUseList, canUseBoard };
+  const [layout, setLayoutState] = useState(
+    () => pinLayout(
+      viewLayout ?? (ignoreStoredLayout ? void 0 : readStoredLayout()) ?? defaultLayout,
+      availability
+    )
+  );
+  const [density, setDensityState] = useState(
+    () => (ignoreStoredLayout ? void 0 : readStoredDensity()) ?? "cozy"
+  );
+  const [zoom, setZoom] = useState(DEFAULT_ZOOM);
+  useEffect(() => {
+    if (viewLayout) setLayoutState(pinLayout(viewLayout, availability));
+  }, [viewLayout]);
+  const effective = pinLayout(layout, availability);
+  const value = useMemo(
+    () => ({
+      layout: effective,
+      setLayout: (next) => {
+        const pinned = pinLayout(next, availability);
+        setLayoutState(pinned);
+        if (!ignoreStoredLayout) writeStored(LAYOUT_STORAGE_KEY, pinned);
+      },
+      density,
+      setDensity: (next) => {
+        setDensityState(next);
+        if (!ignoreStoredLayout) writeStored(DENSITY_STORAGE_KEY, next);
+      },
+      canUseCards,
+      canUseList,
+      canUseBoard,
+      zoom,
+      setZoom
+    }),
+    [effective, density, canUseCards, canUseList, canUseBoard, zoom]
+  );
+  return /* @__PURE__ */ jsx(DataViewsLayoutContext.Provider, { value, children });
+}
+function useDataViewsLayout() {
+  const ctx = useContext(DataViewsLayoutContext);
+  if (!ctx) {
+    throw new Error("useDataViewsLayout must be used within a DataViewsLayoutProvider");
+  }
+  return ctx;
+}
+function DataViewsZoomSlider({ testIdPrefix }) {
+  const { layout, zoom, setZoom } = useDataViewsLayout();
+  const copy = useDataViewsCopy();
+  if (layout !== "cards" && layout !== "board") return null;
+  return /* @__PURE__ */ jsxs(
+    default2,
+    {
+      sx: {
+        display: { xs: "none", sm: "flex" },
+        alignItems: "center",
+        gap: 1,
+        color: "text.secondary"
+      },
+      children: [
+        /* @__PURE__ */ jsx(GridViewOutlinedIcon, { sx: { fontSize: 14 } }),
+        /* @__PURE__ */ jsx(default2, { sx: { width: 88, display: "flex", alignItems: "center" }, children: /* @__PURE__ */ jsx(
+          Slider,
+          {
+            size: "sm",
+            showValue: false,
+            value: zoom,
+            min: 0,
+            max: 100,
+            step: 5,
+            onChange: (_event, next) => setZoom(Array.isArray(next) ? next[0] ?? 0 : next),
+            "aria-label": copy.display.cardZoom,
+            "data-testid": `${testIdPrefix}-card-zoom`
+          }
+        ) }),
+        /* @__PURE__ */ jsx(GridViewOutlinedIcon, { sx: { fontSize: 20 } })
+      ]
+    }
+  );
+}
+
+export {
+  DENSITY_ROW_PADDING,
+  DENSITY_CARD_SCALE,
+  cardTargetWidthFor,
+  DENSITY_BOARD_SCALE,
+  cardScaleForZoom,
+  cardMinWidthForZoom,
+  DataViewsLayoutProvider,
+  useDataViewsLayout,
+  DataViewsZoomSlider
+};
+//# sourceMappingURL=chunk-HVIB6WMD.js.map

package/dist/chunk-HVIB6WMD.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/DataViews/data-views-layout-context.tsx"],"sourcesContent":["\"use client\";\n\nimport { createContext, useContext, useEffect, useMemo, useState, type ReactNode } from \"react\";\n\nimport GridViewOutlinedIcon from \"@mui/icons-material/GridViewOutlined\";\n\nimport { Slider } from \"../../form/Slider\";\nimport { Box } from \"../../../mui/Box\";\n\nimport { useDataViewsCopy } from \"./data-views-copy-context\";\nimport { DATA_VIEWS_LAYOUTS, type DataViewsLayout } from \"./data-views-types\";\n\n/**\n * The DataViews layout (view type): the dense \"Tabela\" grid, the \"Grade\" of\n * cards, the \"Lista\" of full-width rows, or the \"Quadro\" board of state columns.\n * Shared across the toolbar (the toggle) and the body (the selector) via context\n * so a single source of truth drives what renders — each layout only appears\n * when the table opts into it (`renderCard` for the grade, `renderListRow` for\n * the lista, `board` + `renderCard` for the quadro).\n */\nexport type { DataViewsLayout };\n\ninterface DataViewsLayoutValue {\n  layout: DataViewsLayout;\n  setLayout: (layout: DataViewsLayout) => void;\n  /** How much air each record gets — see {@link DataViewsDensity}. */\n  density: DataViewsDensity;\n  setDensity: (density: DataViewsDensity) => void;\n  /** Whether the cards layout is available (a `renderCard` was supplied). */\n  canUseCards: boolean;\n  /** Whether the list layout is available (a `renderListRow` was supplied). */\n  canUseList: boolean;\n  /** Whether the board layout is available (a `board` config AND a `renderCard`). */\n  canUseBoard: boolean;\n  /** Card-size zoom (0–100); drives the card grid's min column width. */\n  zoom: number;\n  setZoom: (zoom: number) => void;\n}\n\nconst DataViewsLayoutContext = createContext<DataViewsLayoutValue | null>(null);\n\n/** Default card zoom (0–100). */\nconst DEFAULT_ZOOM = 35;\n/** The card's width in px at scale 1 — the zoom slider multiplies this. */\nconst BASE_CARD_WIDTH = 180;\n/** The size multiplier the zoom slider spans (0.75× to 2×). */\nconst CARD_SCALE_RANGE = { min: 0.75, max: 2 } as const;\n\n/**\n * Where the user's layout preference is remembered. ONE key for every DataViews\n * table in the app, on purpose: picking \"Grade\" on Produtos is a statement about\n * how this operator likes to read lists, not about that one screen. Every other\n * screen that CAN render cards then opens in cards, and one that cannot falls\n * back without forgetting the preference.\n */\nconst LAYOUT_STORAGE_KEY = \"dataviews:layout\";\n\n/**\n * The density preference, remembered app-wide for the same reason as the layout:\n * an operator who wants tight rows wants them on every list, not on one.\n */\nconst DENSITY_STORAGE_KEY = \"dataviews:density\";\n\n/**\n * How much room each record gets. It means different things per layout, and\n * that is the point — one control, phrased in the terms of what is on screen:\n *\n * - table / list → row height (\"Baixa / Média / Alta\")\n * - cards        → how many fit per row (\"Muitos / Médio / Poucos\")\n *\n * The board is unaffected: its cards are already sized by the zoom slider.\n */\nexport type DataViewsDensity = \"compact\" | \"cozy\" | \"comfortable\";\n\n/** Every density this build knows — the guard's single source. */\nconst DENSITIES: readonly DataViewsDensity[] = [\"compact\", \"cozy\", \"comfortable\"];\n\n/** Vertical padding (theme spacing units) per density, for a table or list row. */\nexport const DENSITY_ROW_PADDING: Record<DataViewsDensity, number> = {\n  compact: 0.25,\n  cozy: 0.75,\n  comfortable: 1.5,\n};\n\n/**\n * The card WIDTH each density aims for, as a multiple of the base card width.\n *\n * Density used to cap the column COUNT, with a track floor of\n * `max(baseWidth, 100% / count)`. That base is a constant, so wherever it won\n * the arithmetic every density produced an identical track — \"Muitos\" and\n * \"Medio\" both drew 3 cards of 279px at md — and where the percentage won\n * instead, on a wide screen, the count was pinned and each card grew to a share\n * of the viewport: ~430px of card holding one chip and two lines of text.\n *\n * One width per density fixes both, because the number `auto-fill` divides by\n * now differs per density at every size. The spread is chosen so the three land\n * on DIFFERENT column counts across the range rather than by eye — 4/3/2 at md,\n * 6/4/3 at lg, 7/5/4 at xl, 13/9/8 at 2560.\n */\nexport const DENSITY_CARD_SCALE: Record<DataViewsDensity, number> = {\n  compact: 0.84,\n  cozy: 1.15,\n  comfortable: 1.4,\n};\n\n/** The width a card aims for: the base width, scaled by zoom, then by density. */\nexport function cardTargetWidthFor(zoom: number, density: DataViewsDensity): number {\n  return Math.round(cardMinWidthForZoom(zoom) * DENSITY_CARD_SCALE[density]);\n}\n\n/**\n * The BOARD's column-width multiplier per density.\n *\n * Density means \"how much air a record gets\", and on a board that is the column\n * width — narrow columns fit more etapas on screen, wide ones give each card\n * room to be read. Without this the board was the one layout the Exibição tab\n * offered nothing for: the format tile switched to Quadro and the whole density\n * section vanished, which reads as a control that broke rather than one that\n * does not apply.\n *\n * The spread is deliberately narrower than the card grid's. A board column has\n * a hard floor (`MIN_COLUMN_WIDTH` — a card below it stops being readable), so\n * a multiplier that undershoots it buys nothing and makes \"Estreita\" a tile\n * that does nothing on a phone.\n */\nexport const DENSITY_BOARD_SCALE: Record<DataViewsDensity, number> = {\n  compact: 0.95,\n  cozy: 1,\n  comfortable: 1.25,\n};\n\n/**\n * Map the 0–100 zoom to the card SIZE multiplier. This is the single knob: the\n * card's width is {@link BASE_CARD_WIDTH} × scale and its padding + typography\n * scale by the same factor, so the whole card grows together (scale 2 → twice\n * the size, proportion preserved by the aspect ratio). Passed to a card via\n * `DataViewCardSelection.scale`.\n */\nexport function cardScaleForZoom(zoom: number): number {\n  const clamped = Math.max(0, Math.min(100, zoom));\n  return CARD_SCALE_RANGE.min + (clamped / 100) * (CARD_SCALE_RANGE.max - CARD_SCALE_RANGE.min);\n}\n\n/** The card grid's min column width in px = base width × the zoom size multiplier. */\nexport function cardMinWidthForZoom(zoom: number): number {\n  return Math.round(BASE_CARD_WIDTH * cardScaleForZoom(zoom));\n}\n\n/** Which layouts this table can actually render. */\ninterface LayoutAvailability {\n  canUseCards: boolean;\n  canUseList: boolean;\n  canUseBoard: boolean;\n}\n\n/** Is this a layout string this build knows? Guards whatever is in storage. */\nfunction isLayout(value: unknown): value is DataViewsLayout {\n  return DATA_VIEWS_LAYOUTS.includes(value as DataViewsLayout);\n}\n\n/** Is this a density this build knows? Guards whatever is in storage. */\nfunction isDensity(value: unknown): value is DataViewsDensity {\n  return DENSITIES.includes(value as DataViewsDensity);\n}\n\n/** The remembered density, or undefined (no window, no value, junk). */\nfunction readStoredDensity(): DataViewsDensity | undefined {\n  try {\n    if (typeof window === \"undefined\") return undefined;\n    const stored = window.localStorage.getItem(DENSITY_STORAGE_KEY);\n    return isDensity(stored) ? stored : undefined;\n  } catch {\n    return undefined;\n  }\n}\n\n/**\n * Pin a layout to one this table can render. \"Tabela\" is always available, so it\n * is the floor: a page with no `renderCard` never renders a cards body, one with\n * no `renderListRow` never renders a list, and one with no `board` config never\n * renders a board — whatever is stored, saved in a view, or requested.\n */\nfunction pinLayout(layout: DataViewsLayout, available: LayoutAvailability): DataViewsLayout {\n  if (layout === \"cards\") return available.canUseCards ? \"cards\" : \"table\";\n  if (layout === \"list\") return available.canUseList ? \"list\" : \"table\";\n  if (layout === \"board\") return available.canUseBoard ? \"board\" : \"table\";\n  return \"table\";\n}\n\n/** The stored cross-screen preference, or undefined (no window, no value, junk). */\nfunction readStoredLayout(): DataViewsLayout | undefined {\n  // Guarded rather than assumed: this module is also imported in Node (tests,\n  // any SSR host), and a `localStorage` access can throw outright under a\n  // restrictive privacy setting — a thrown read must not take the grid with it.\n  try {\n    if (typeof window === \"undefined\") return undefined;\n    const stored = window.localStorage.getItem(LAYOUT_STORAGE_KEY);\n    return isLayout(stored) ? stored : undefined;\n  } catch {\n    return undefined;\n  }\n}\n\n/** Remember a preference for every other screen. A failed write is not an error. */\nfunction writeStored(key: string, value: string): void {\n  try {\n    if (typeof window === \"undefined\") return;\n    window.localStorage.setItem(key, value);\n  } catch {\n    // Private mode / quota / disabled storage: the preference simply does not\n    // survive the session. Nothing about the current view depends on it.\n  }\n}\n\ninterface LayoutProviderProps extends Partial<LayoutAvailability> {\n  /** Which layout to show first when the user has expressed no preference. */\n  defaultLayout?: DataViewsLayout;\n  /**\n   * The layout an APPLIED SAVED VIEW pins, when it stored one. It wins over the\n   * remembered preference for as long as that view is applied — the view is a\n   * snapshot someone chose to keep — but it does NOT overwrite the preference:\n   * only the toggle does that, because only the toggle is the user saying so.\n   */\n  viewLayout?: DataViewsLayout;\n  /**\n   * Ignore — and stop writing — the remembered cross-screen preference, making\n   * `defaultLayout` authoritative for this table.\n   *\n   * For a table that exists to SHOW a particular layout rather than to be\n   * browsed: a Storybook story called \"Board\", a docs example, a screenshot\n   * harness. Without it the remembered preference wins, so opening \"Board\"\n   * after having clicked Tabela anywhere renders a table — the demonstration\n   * silently showing the wrong thing, and a shared link doing it for everyone\n   * whose preference differs.\n   *\n   * A real screen leaves this off: remembering how someone likes to read\n   * lists is the point.\n   */\n  ignoreStoredLayout?: boolean;\n  children: ReactNode;\n}\n\n/**\n * Provides the view-type state, seeded from (in order) the applied saved view's\n * layout, the user's remembered cross-screen preference, then `defaultLayout` —\n * each pinned to what this table can actually render.\n */\nexport function DataViewsLayoutProvider({\n  canUseCards = false,\n  canUseList = false,\n  canUseBoard = false,\n  defaultLayout = \"table\",\n  viewLayout,\n  ignoreStoredLayout = false,\n  children,\n}: LayoutProviderProps): React.JSX.Element {\n  const availability = { canUseCards, canUseList, canUseBoard };\n  const [layout, setLayoutState] = useState<DataViewsLayout>(() =>\n    pinLayout(\n      viewLayout ?? (ignoreStoredLayout ? undefined : readStoredLayout()) ?? defaultLayout,\n      availability,\n    ),\n  );\n  const [density, setDensityState] = useState<DataViewsDensity>(\n    () => (ignoreStoredLayout ? undefined : readStoredDensity()) ?? \"cozy\",\n  );\n  const [zoom, setZoom] = useState(DEFAULT_ZOOM);\n  // A newly applied view carrying a layout switches to it (its reference-change\n  // is the signal, exactly as `appliedState` works for the filters).\n  useEffect(() => {\n    if (viewLayout) setLayoutState(pinLayout(viewLayout, availability));\n    // Availability is derived from props that do not change for a mounted table.\n  }, [viewLayout]);\n  // Pin again on read: `canUseCards`/`canUseBoard` can flip for a mounted table\n  // (a page that supplies `renderCard` only once its card data has loaded), and\n  // a stale \"cards\" would otherwise render a cards body with no renderer.\n  const effective = pinLayout(layout, availability);\n\n  const value = useMemo<DataViewsLayoutValue>(\n    () => ({\n      layout: effective,\n      setLayout: (next: DataViewsLayout) => {\n        const pinned = pinLayout(next, availability);\n        setLayoutState(pinned);\n        // Remember the user's own choice across every screen — see LAYOUT_STORAGE_KEY.\n        // A table pinned to a layout does not write: it would teach the\n        // preference a value the operator never chose.\n        if (!ignoreStoredLayout) writeStored(LAYOUT_STORAGE_KEY, pinned);\n      },\n      density,\n      setDensity: (next: DataViewsDensity) => {\n        setDensityState(next);\n        if (!ignoreStoredLayout) writeStored(DENSITY_STORAGE_KEY, next);\n      },\n      canUseCards,\n      canUseList,\n      canUseBoard,\n      zoom,\n      setZoom,\n    }),\n    [effective, density, canUseCards, canUseList, canUseBoard, zoom],\n  );\n  return <DataViewsLayoutContext.Provider value={value}>{children}</DataViewsLayoutContext.Provider>;\n}\n\n/** Read the current DataViews layout. Throws outside a provider. */\nexport function useDataViewsLayout(): DataViewsLayoutValue {\n  const ctx = useContext(DataViewsLayoutContext);\n  if (!ctx) {\n    throw new Error(\"useDataViewsLayout must be used within a DataViewsLayoutProvider\");\n  }\n  return ctx;\n}\n\n/**\n * Card-size slider for the toolbar — shown in the CARD-BASED layouts (\"Grade\"\n * and \"Quadro\"), mirroring the tabwoah view-selector's zoom. The board reuses\n * the same `renderCard`, so the same knob scales both.\n *\n * Deliberately ABSENT in \"Lista\" and \"Tabela\" (FUT-733): a list row is\n * full-width and sized by its content, so a card-size multiplier has nothing to\n * act on — a slider that moved and changed nothing would be worse than none.\n */\nexport function DataViewsZoomSlider({ testIdPrefix }: { testIdPrefix: string }): React.JSX.Element | null {\n  const { layout, zoom, setZoom } = useDataViewsLayout();\n  const copy = useDataViewsCopy();\n  if (layout !== \"cards\" && layout !== \"board\") return null;\n  return (\n    <Box\n      sx={{\n        display: { xs: \"none\", sm: \"flex\" },\n        alignItems: \"center\",\n        gap: 1,\n        color: \"text.secondary\",\n      }}\n    >\n      <GridViewOutlinedIcon sx={{ fontSize: 14 }} />\n      <Box sx={{ width: 88, display: \"flex\", alignItems: \"center\" }}>\n        <Slider\n          size=\"sm\"\n          showValue={false}\n          value={zoom}\n          min={0}\n          max={100}\n          step={5}\n          onChange={(_event, next) => setZoom(Array.isArray(next) ? (next[0] ?? 0) : next)}\n          aria-label={copy.display.cardZoom}\n          data-testid={`${testIdPrefix}-card-zoom`}\n        />\n      </Box>\n      <GridViewOutlinedIcon sx={{ fontSize: 20 }} />\n    </Box>\n  );\n}\n"],"mappings":"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","names":["default"]}

package/dist/chunk-HXYXDQ7U.js

@@ -0,0 +1,19 @@
+// src/components/layout/Skeleton/Skeleton.helpers.ts
+var SKELETON_DEFAULTS = {
+  variant: "text",
+  animation: "pulse",
+  count: 1,
+  spacing: 1,
+  intensity: "medium",
+  glassmorphism: false,
+  shimmer: false
+};
+var definedProps = (props) => Object.fromEntries(
+  Object.entries(props).filter(([, value]) => value !== void 0)
+);
+var resolveSkeletonProps = (props) => ({ ...SKELETON_DEFAULTS, ...definedProps(props) });
+
+export {
+  resolveSkeletonProps
+};
+//# sourceMappingURL=chunk-HXYXDQ7U.js.map

package/dist/chunk-HXYXDQ7U.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/Skeleton/Skeleton.helpers.ts"],"sourcesContent":["import type { SkeletonProps } from './Skeleton.types';\n\ntype SkeletonDefaultedKeys =\n  | 'variant'\n  | 'animation'\n  | 'count'\n  | 'spacing'\n  | 'intensity'\n  | 'glassmorphism'\n  | 'shimmer';\n\ntype ResolvedSkeletonProps = SkeletonProps &\n  Required<Pick<SkeletonProps, SkeletonDefaultedKeys>>;\n\nconst SKELETON_DEFAULTS: Pick<SkeletonProps, SkeletonDefaultedKeys> = {\n  variant: 'text',\n  animation: 'pulse',\n  count: 1,\n  spacing: 1,\n  intensity: 'medium',\n  glassmorphism: false,\n  shimmer: false,\n};\n\n// Strips explicitly-undefined props before the merge, so `count={undefined}` still\n// falls back to the default exactly as a destructuring default would.\nconst definedProps = (props: SkeletonProps): Partial<SkeletonProps> =>\n  Object.fromEntries(\n    Object.entries(props).filter(([, value]) => value !== undefined),\n  ) as Partial<SkeletonProps>;\n\nexport const resolveSkeletonProps = (props: SkeletonProps): ResolvedSkeletonProps =>\n  ({ ...SKELETON_DEFAULTS, ...definedProps(props) }) as ResolvedSkeletonProps;\n"],"mappings":";AAcA,IAAM,oBAAgE;AAAA,EACpE,SAAS;AAAA,EACT,WAAW;AAAA,EACX,OAAO;AAAA,EACP,SAAS;AAAA,EACT,WAAW;AAAA,EACX,eAAe;AAAA,EACf,SAAS;AACX;AAIA,IAAM,eAAe,CAAC,UACpB,OAAO;AAAA,EACL,OAAO,QAAQ,KAAK,EAAE,OAAO,CAAC,CAAC,EAAE,KAAK,MAAM,UAAU,MAAS;AACjE;AAEK,IAAM,uBAAuB,CAAC,WAClC,EAAE,GAAG,mBAAmB,GAAG,aAAa,KAAK,EAAE;","names":[]}

package/dist/chunk-I53WONUS.js

@@ -0,0 +1 @@
+//# sourceMappingURL=chunk-I53WONUS.js.map

package/dist/chunk-I53WONUS.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/chunk-I6PZVHIT.js

@@ -0,0 +1,46 @@
+// src/tokens/scales.ts
+var SIZE_VALUES = ["xs", "sm", "md", "lg", "xl"];
+var COLOR_VALUES = [
+  "primary",
+  "secondary",
+  "success",
+  "warning",
+  "info",
+  "danger",
+  "neutral"
+];
+var muiSize = (size) => {
+  if (size === "xs" || size === "sm") return "small";
+  return size === "md" ? "medium" : "large";
+};
+function muiColor(color, neutralAs) {
+  if (color === "danger") return "error";
+  return color === "neutral" ? neutralAs : color;
+}
+var paletteKey = (color) => color === "danger" ? "error" : color === "neutral" ? "grey" : color;
+function accentFor(theme, color) {
+  if (color === "neutral") {
+    const grey = theme.palette.grey;
+    return {
+      // Explicit fallbacks: the ramp is indexed, and under
+      // `noUncheckedIndexedAccess` every stop is `string | undefined`.
+      main: grey[600] ?? "#757575",
+      light: grey[400] ?? "#bdbdbd",
+      dark: grey[800] ?? "#424242",
+      // Grey 600 carries white text in both themes.
+      contrastText: "#fff"
+    };
+  }
+  const key = color === "danger" ? "error" : color;
+  return theme.palette[key];
+}
+
+export {
+  SIZE_VALUES,
+  COLOR_VALUES,
+  muiSize,
+  muiColor,
+  paletteKey,
+  accentFor
+};
+//# sourceMappingURL=chunk-I6PZVHIT.js.map

package/dist/chunk-I6PZVHIT.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/tokens/scales.ts"],"sourcesContent":["import type { Theme } from '@mui/material/styles/index.js';\n\n/**\n * THE TWO VOCABULARIES EVERY COMPONENT SPEAKS.\n *\n * Before this file the package had both halves of every argument at once: 26\n * components sized themselves `xs|sm|md|lg|xl` and four used MUI's\n * `small|medium|large`; 14 coloured themselves `danger|neutral` and 15 used\n * MUI's `error`. Nothing enforced either, because most of these props were\n * spelled out as inline unions and a couple were plain `string`.\n *\n * That is not a tidiness problem. A caller learns the vocabulary from whichever\n * component they used first, and the wrong half is not rejected — it reaches MUI\n * as an unknown value and silently falls back. `Chip` shipped with `color?:\n * string` and MUI's `small|medium`, so `color=\"danger\"` rendered grey and\n * `size=\"sm\"` rendered medium; twelve live call sites were doing exactly that,\n * and every test passed because they all asserted on text.\n *\n * So the vocabulary is declared once, here, and components derive from it.\n *\n * DERIVE, DON'T COPY — AND TAKE THE WHOLE VOCABULARY. Every size prop is\n * `SizeValue` and every colour prop is `ColorValue`, with no `Extract` and no\n * `Exclude`. Handing a component a slice was tried and undone: it is the same\n * fragmentation wearing the canonical type's name, and it leaves a caller having\n * to remember which components accept `xs` and which accept `info`. Where the\n * underlying widget draws fewer steps than five, that is a rendering detail and\n * belongs at the MUI boundary below — not in the prop's type.\n *\n * A component whose size or colour is not this concept at all keeps its own type\n * — `Scrollbar`'s `thin|medium|thick` is a track width, `Sheet`'s `full` is a\n * viewport fraction, `LazyImage`'s size is pixels. Forcing those into the scale\n * would be consistency for its own sake.\n */\n\n/**\n * The house size scale.\n *\n * Abbreviated, because that is what 26 of the 30 components with a real size\n * already used and what every caller has been taught to write.\n *\n * Declared as the array and the type together so the two cannot disagree. The\n * runtime list is what Storybook `argTypes.options` and the demo grids iterate;\n * spelled by hand in each story it drifts, and it had — twelve colour lists\n * omitted `info`, so the control that documents the vocabulary offered a\n * component less than the component accepted.\n */\n/**\n * The type scale is the THIRD vocabulary, and it lives in `./typography.ts`\n * because it is metrics rather than a prop union. Re-exported here so\n * `@12-apps/ui/tokens` stays the one import path for \"what words does this\n * package speak\" — a second entry point is how a vocabulary gets missed.\n */\nexport {\n  HEADING_LEVELS,\n  HEADING_SCALE,\n  headingMetrics,\n  type HeadingLevel,\n  type HeadingMetrics,\n  type HeadingScaleOverrides,\n} from './typography';\n\nexport type SizeValue = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n\nexport const SIZE_VALUES = ['xs', 'sm', 'md', 'lg', 'xl'] as const satisfies readonly SizeValue[];\n\n/**\n * The house colour vocabulary.\n *\n * `danger` and `neutral` are OURS; the rest are MUI's own names already. That\n * sentence started life in `Button.tsx`, which is the component most callers\n * meet first and therefore the one that taught the vocabulary — so it is the one\n * the rest of the package follows.\n *\n * Components that hand these to MUI translate at the boundary (`danger` →\n * `error`, `neutral` → `default` or `inherit` depending on what the underlying\n * component calls its unaccented state). The translation must be a real mapping\n * and never a cast: a cast is precisely what let `danger` through untouched and\n * had MUI fall back to grey.\n *\n * Array and type declared together, for the reason given on {@link SIZE_VALUES}.\n */\nexport type ColorValue =\n  | 'primary'\n  | 'secondary'\n  | 'success'\n  | 'warning'\n  | 'info'\n  | 'danger'\n  | 'neutral';\n\nexport const COLOR_VALUES = [\n  'primary',\n  'secondary',\n  'success',\n  'warning',\n  'info',\n  'danger',\n  'neutral',\n] as const satisfies readonly ColorValue[];\n\n/* ── Array and union, pinned to each other ────────────────────────────────── */\n\n/**\n * The arrays above are written out rather than derived, because deriving the\n * union from the array (`(typeof COLOR_VALUES)[number]`) costs the alias its\n * name: TypeScript resolves the indexed access eagerly, and every error in the\n * package stops saying `not assignable to type 'ColorValue'` and starts dumping\n * seven string literals. In a package whose entire purpose is teaching this\n * vocabulary, the name in the error message is worth keeping.\n *\n * Writing both means they could disagree, so both directions are checked here.\n * `satisfies` above catches an entry that is not a member. These catch the other\n * half — a member missing from the array — which `satisfies` cannot see and\n * which is the direction that actually bit: twelve story control lists offered\n * six colours for a vocabulary of seven, so `info` was undocumented everywhere.\n *\n * A gap makes the assignment below fail, and the error names the missing member.\n */\ntype Missing<Union extends string, Listed extends string> = Exclude<Union, Listed>;\n\nconst _allSizesListed: Missing<SizeValue, (typeof SIZE_VALUES)[number]> extends never\n  ? true\n  : never = true;\n\nconst _allColorsListed: Missing<ColorValue, (typeof COLOR_VALUES)[number]> extends never\n  ? true\n  : never = true;\n\nvoid _allSizesListed;\nvoid _allColorsListed;\n\n/* ── The MUI boundary ─────────────────────────────────────────────────────── */\n\n/** What MUI calls a size. Three entries against our five. */\nexport type MuiSize = 'small' | 'medium' | 'large';\n\n/**\n * The house scale collapsed onto MUI's three.\n *\n * Five onto three loses information, and it loses it at the ends on purpose:\n * `xs`/`sm` both draw small and `lg`/`xl` both draw large, because MUI has no\n * fourth and fifth step to give them. A component that genuinely needs five\n * distinct sizes styles them itself rather than routing through here — this is\n * for the ones that just forward the prop.\n */\nexport const muiSize = (size: SizeValue): MuiSize => {\n  if (size === 'xs' || size === 'sm') return 'small';\n  return size === 'md' ? 'medium' : 'large';\n};\n\n/** What MUI calls a semantic colour on most components. */\nexport type MuiColor = 'primary' | 'secondary' | 'success' | 'warning' | 'info' | 'error';\n\n/**\n * The house vocabulary translated for MUI, with the caller naming its neutral.\n *\n * `neutral` is the awkward one: MUI spells the unaccented state `default` on a\n * chip, `inherit` on a button and an icon button, and `grey` in the palette. So\n * the caller passes the word its own MUI component uses rather than this\n * pretending there is one answer.\n *\n * A MAPPING, NEVER A CAST. The cast is what let `danger` reach MUI untouched and\n * silently fall back to grey.\n */\nexport function muiColor<N extends string>(color: ColorValue, neutralAs: N): MuiColor | N {\n  if (color === 'danger') return 'error';\n  return color === 'neutral' ? neutralAs : color;\n}\n\n/**\n * The house vocabulary as a `theme.palette` key.\n *\n * Separate from {@link muiColor} because the palette has no `default` and no\n * `inherit` — an unaccented colour there is `grey`.\n */\nexport type PaletteKey = MuiColor | 'grey';\n\nexport const paletteKey = (color: ColorValue): PaletteKey =>\n  color === 'danger' ? 'error' : color === 'neutral' ? 'grey' : color;\n\n/**\n * A `ColorValue` resolved to a four-stop accent from the theme.\n *\n * `paletteKey` is not enough on its own for anything that reads `.main`: MUI's\n * palette has no neutral `PaletteColor`, and `palette.grey` is a 50–900 ramp\n * with no `main`, `light`, `dark` or `contrastText` on it at all. So `neutral`\n * is resolved from the ramp here, once, instead of every component discovering\n * the same hole and branching around it.\n *\n * Typed against the theme structurally so this file does not drag in MUI's\n * `Theme` and become a dependency of everything that imports a token.\n */\nexport interface Accent {\n  main: string;\n  light: string;\n  dark: string;\n  contrastText: string;\n}\n\nexport function accentFor(theme: Theme, color: ColorValue): Accent {\n  if (color === 'neutral') {\n    const grey = theme.palette.grey;\n    return {\n      // Explicit fallbacks: the ramp is indexed, and under\n      // `noUncheckedIndexedAccess` every stop is `string | undefined`.\n      main: grey[600] ?? '#757575',\n      light: grey[400] ?? '#bdbdbd',\n      dark: grey[800] ?? '#424242',\n      // Grey 600 carries white text in both themes.\n      contrastText: '#fff',\n    };\n  }\n  // Past the `neutral` return, `paletteKey` can only produce a `MuiColor` — but\n  // its signature still admits `'grey'`, and TS cannot narrow a return type by\n  // the argument. Naming the key here keeps the accent branch honestly typed\n  // instead of casting the hole shut.\n  const key: MuiColor = color === 'danger' ? 'error' : color;\n  return theme.palette[key];\n}\n"],"mappings":";AA+DO,IAAM,cAAc,CAAC,MAAM,MAAM,MAAM,MAAM,IAAI;AA2BjD,IAAM,eAAe;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AA+CO,IAAM,UAAU,CAAC,SAA6B;AACnD,MAAI,SAAS,QAAQ,SAAS,KAAM,QAAO;AAC3C,SAAO,SAAS,OAAO,WAAW;AACpC;AAgBO,SAAS,SAA2B,OAAmB,WAA4B;AACxF,MAAI,UAAU,SAAU,QAAO;AAC/B,SAAO,UAAU,YAAY,YAAY;AAC3C;AAUO,IAAM,aAAa,CAAC,UACzB,UAAU,WAAW,UAAU,UAAU,YAAY,SAAS;AAqBzD,SAAS,UAAU,OAAc,OAA2B;AACjE,MAAI,UAAU,WAAW;AACvB,UAAM,OAAO,MAAM,QAAQ;AAC3B,WAAO;AAAA;AAAA;AAAA,MAGL,MAAM,KAAK,GAAG,KAAK;AAAA,MACnB,OAAO,KAAK,GAAG,KAAK;AAAA,MACpB,MAAM,KAAK,GAAG,KAAK;AAAA;AAAA,MAEnB,cAAc;AAAA,IAChB;AAAA,EACF;AAKA,QAAM,MAAgB,UAAU,WAAW,UAAU;AACrD,SAAO,MAAM,QAAQ,GAAG;AAC1B;","names":[]}

package/dist/chunk-IAGOUTI6.js

@@ -0,0 +1,112 @@
+// src/components/data-display/DataViews/data-views-overflow-costs.ts
+function estimateWidth(text, extra) {
+  return Math.round(text.length * 7.6) + 56 + extra;
+}
+function isRangeSet(range) {
+  return Boolean(range && (range.min !== void 0 || range.max !== void 0));
+}
+function pillText(field, values) {
+  if (values.length === 0) return field.label;
+  if (values.length === 1) {
+    const option = field.pill?.options.find((entry) => entry.value === values[0]);
+    return `${field.label}: ${option?.label ?? values[0]}`;
+  }
+  return `${field.label}: ${values.length}`;
+}
+var RESERVED = {
+  /** The search box never shrinks below this. */
+  search: 200,
+  /**
+   * The "N de N" counter.
+   *
+   * MEASURED at 35px, plus its divider and gap. The old 96 was priced for a
+   * counter reading "1.234 de 5.678"; a phone shows "3 de 3", and charging
+   * nearly triple its rendered width came straight out of the filter budget.
+   */
+  counter: 56,
+  /**
+   * ONE right-hand control (Exibir, or Exportar) WITH its text label.
+   *
+   * Priced per control rather than for the pair, because the pair is not what
+   * every page renders: "Exportar" exists only when the host passes an
+   * `exportConfig`, and several pages (Pedidos among them) put their export in
+   * the PAGE HEADER instead. Charging 216 there billed the filters for a button
+   * that was never on the bar — ~108px of budget spent on nothing, which on a
+   * phone is the difference between one filter pill and none.
+   */
+  displayControl: 108,
+  /**
+   * The same control as an icon only — step 2 of the ladder.
+   *
+   * MEASURED at 133px for the PAIR (66 each: a Button's minimum tap target is
+   * a good deal wider than the 20px glyph inside it); 70 keeps that total's
+   * slack at one control's granularity.
+   */
+  displayControlCompact: 70,
+  /**
+   * What step 4 leaves behind: the search as a bare magnifier.
+   *
+   * MEASURED at 30px on the Pedidos bar (`…-search-all-collapsed`); 38 keeps a
+   * tap target's worth of slack over it.
+   */
+  searchIcon: 38,
+  /**
+   * The narrowest keyword box still worth typing into — below it the operator
+   * cannot read back what they wrote, and the box takes over the cluster
+   * instead of sharing it (see `searchTakeover`).
+   *
+   * 120 rather than 140 because this is compared against the ESTIMATE, which
+   * over-prices on purpose (see `estimateWidth`). At 140 a large phone took the
+   * whole cluster to produce a box barely wider than the one it could have had
+   * while keeping its filters — paying for nothing.
+   */
+  usableSearch: 120,
+  /**
+   * The "Mais" button, only charged when there IS an overflow — and priced by
+   * the state it is actually in, like the right-hand cluster beside it.
+   *
+   * MEASURED: 128px with its label, badge and chevron; 69px once the ladder has
+   * it down to icon + badge. One number for both was wrong in BOTH directions —
+   * it under-priced the wide bar (the row's own failure mode) and over-priced
+   * the narrow one by a whole pill.
+   */
+  overflowButton: 136,
+  overflowButtonCompact: 80,
+  /**
+   * "Limpar", only charged when there IS something to clear.
+   *
+   * It appears exactly when the row is at its widest — every applied filter
+   * has a longer label than the idle one it replaced — so leaving it unpriced
+   * would break the line at the one moment the operator most needs it.
+   * Measured at 64 as an icon; 72 with slack.
+   */
+  clearAll: 72,
+  /**
+   * The row's own padding, plus the gaps BETWEEN the fixed furniture.
+   *
+   * Not the per-control gaps — `splitFilters` already adds a `GAP` for every
+   * filter it keeps, so counting a fourth one here charged one gap twice.
+   * MEASURED: 32px of padding (16 each side) + three 8px gaps between the
+   * search, the counter and the right cluster.
+   */
+  chrome: 56
+};
+var GAP = 8;
+function rightClusterCost(hasExport, compact) {
+  const one = compact ? RESERVED.displayControlCompact : RESERVED.displayControl;
+  return hasExport ? one * 2 : one;
+}
+function furnitureCost(flags, hasExport) {
+  return (flags.searchCollapsed ? RESERVED.searchIcon : RESERVED.search) + (flags.counterHidden ? 0 : RESERVED.counter) + rightClusterCost(hasExport, flags.compactControls) + RESERVED.chrome;
+}
+
+export {
+  estimateWidth,
+  isRangeSet,
+  pillText,
+  RESERVED,
+  GAP,
+  rightClusterCost,
+  furnitureCost
+};
+//# sourceMappingURL=chunk-IAGOUTI6.js.map

package/dist/chunk-IAGOUTI6.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/DataViews/data-views-overflow-costs.ts"],"sourcesContent":["/**\n * WHAT EACH THING ON THE TOOLBAR COSTS, IN PIXELS.\n *\n * The pricing half of the collapse ladder, split from `data-views-overflow` at\n * the file-size gate. Pure arithmetic and constants: no React, no measurement,\n * no decisions. `data-views-overflow` measures the row and spends what this\n * says it has.\n *\n * Every number here is either MEASURED in a browser (and says so) or\n * deliberately generous. Over-pricing sheds one control too early, which the\n * \"Mais\" button absorbs invisibly; under-pricing breaks the line.\n */\nimport type { OverflowField } from \"./data-views-overflow\";\nimport type { RangeValue } from \"./data-views-types\";\n\n/**\n * Rough rendered width of a control, in px.\n *\n * An ESTIMATE from the label text rather than a real measurement, deliberately:\n * measuring the true width needs every control mounted first, and mounting them\n * to decide whether to mount them is the layout thrash this hook exists to\n * avoid. The estimate only has to rank controls and find the cut point — being\n * a few px out moves the cut by at most one control, and the overflow catches it.\n */\nexport function estimateWidth(text: string, extra: number): number {\n  /**\n   * ~7.6px per character at the toolbar's font size, plus 76px of chrome:\n   * horizontal padding, the border, and the dropdown chevron. The chrome used\n   * to be 52, which under-priced every control by roughly a chevron's width —\n   * six of them then \"fitted\" a row they overflowed, and because they are flex\n   * children the row paid for it by squeezing labels to \"D…\" and \"V…\" rather\n   * than by shedding a control into the overflow.\n   *\n   * Deliberately generous: over-pricing sheds one control too early, which the\n   * \"Mais\" button absorbs invisibly. Under-pricing breaks the line.\n   *\n   * The chrome was 76, and generous had turned into wrong. MEASURED on the\n   * Pedidos bar: \"Pagamento\" renders at 123px against an estimate of 144, and\n   * \"Situação\" at 107 against 137 — every pill over-priced by ~22%, which on a\n   * phone is the whole difference between one pill on the bar and none. 56 is\n   * still above the ~50 measured, so the slack the comment above asks for is\n   * intact; it is just slack rather than a second control's worth of budget.\n   */\n  return Math.round(text.length * 7.6) + 56 + extra;\n}\n\n/** Is a range bounded at either end? */\nexport function isRangeSet(range: RangeValue | undefined): boolean {\n  return Boolean(range && (range.min !== undefined || range.max !== undefined));\n}\n\n/** The label a pill actually renders, which is what decides its width. */\nexport function pillText<T extends Record<string, unknown>>(field: OverflowField<T>, values: string[]): string {\n  if (values.length === 0) return field.label;\n  if (values.length === 1) {\n    const option = field.pill?.options.find((entry) => entry.value === values[0]);\n    return `${field.label}: ${option?.label ?? values[0]}`;\n  }\n  return `${field.label}: ${values.length}`;\n}\n\n/** Fixed toolbar furniture the filters have to fit around, in px. */\nexport const RESERVED = {\n  /** The search box never shrinks below this. */\n  search: 200,\n  /**\n   * The \"N de N\" counter.\n   *\n   * MEASURED at 35px, plus its divider and gap. The old 96 was priced for a\n   * counter reading \"1.234 de 5.678\"; a phone shows \"3 de 3\", and charging\n   * nearly triple its rendered width came straight out of the filter budget.\n   */\n  counter: 56,\n  /**\n   * ONE right-hand control (Exibir, or Exportar) WITH its text label.\n   *\n   * Priced per control rather than for the pair, because the pair is not what\n   * every page renders: \"Exportar\" exists only when the host passes an\n   * `exportConfig`, and several pages (Pedidos among them) put their export in\n   * the PAGE HEADER instead. Charging 216 there billed the filters for a button\n   * that was never on the bar — ~108px of budget spent on nothing, which on a\n   * phone is the difference between one filter pill and none.\n   */\n  displayControl: 108,\n  /**\n   * The same control as an icon only — step 2 of the ladder.\n   *\n   * MEASURED at 133px for the PAIR (66 each: a Button's minimum tap target is\n   * a good deal wider than the 20px glyph inside it); 70 keeps that total's\n   * slack at one control's granularity.\n   */\n  displayControlCompact: 70,\n  /**\n   * What step 4 leaves behind: the search as a bare magnifier.\n   *\n   * MEASURED at 30px on the Pedidos bar (`…-search-all-collapsed`); 38 keeps a\n   * tap target's worth of slack over it.\n   */\n  searchIcon: 38,\n  /**\n   * The narrowest keyword box still worth typing into — below it the operator\n   * cannot read back what they wrote, and the box takes over the cluster\n   * instead of sharing it (see `searchTakeover`).\n   *\n   * 120 rather than 140 because this is compared against the ESTIMATE, which\n   * over-prices on purpose (see `estimateWidth`). At 140 a large phone took the\n   * whole cluster to produce a box barely wider than the one it could have had\n   * while keeping its filters — paying for nothing.\n   */\n  usableSearch: 120,\n  /**\n   * The \"Mais\" button, only charged when there IS an overflow — and priced by\n   * the state it is actually in, like the right-hand cluster beside it.\n   *\n   * MEASURED: 128px with its label, badge and chevron; 69px once the ladder has\n   * it down to icon + badge. One number for both was wrong in BOTH directions —\n   * it under-priced the wide bar (the row's own failure mode) and over-priced\n   * the narrow one by a whole pill.\n   */\n  overflowButton: 136,\n  overflowButtonCompact: 80,\n  /**\n   * \"Limpar\", only charged when there IS something to clear.\n   *\n   * It appears exactly when the row is at its widest — every applied filter\n   * has a longer label than the idle one it replaced — so leaving it unpriced\n   * would break the line at the one moment the operator most needs it.\n   * Measured at 64 as an icon; 72 with slack.\n   */\n  clearAll: 72,\n  /**\n   * The row's own padding, plus the gaps BETWEEN the fixed furniture.\n   *\n   * Not the per-control gaps — `splitFilters` already adds a `GAP` for every\n   * filter it keeps, so counting a fourth one here charged one gap twice.\n   * MEASURED: 32px of padding (16 each side) + three 8px gaps between the\n   * search, the counter and the right cluster.\n   */\n  chrome: 56,\n} as const;\n\n/** The gap between two controls. */\nexport const GAP = 8;\n\n/** What the right-hand cluster costs, given what the host actually renders. */\nexport function rightClusterCost(hasExport: boolean, compact: boolean): number {\n  const one = compact ? RESERVED.displayControlCompact : RESERVED.displayControl;\n  return hasExport ? one * 2 : one;\n}\n\n/**\n * What the toolbar furniture costs at a given rung of the ladder — the budget\n * the filter controls have to fit AROUND.\n *\n * This exists because the two halves used to disagree. `splitFilters` priced\n * the furniture at its widest (search 200 + counter 96 + right 216) and shed\n * every filter to make room; the ladder then collapsed those very controls to\n * 44 + 0 + 140 and nobody handed the ~330px back. On a 428px phone that showed\n * as a bar carrying a magnifier, a \"Mais 5\" pill, and a band of nothing.\n */\nexport function furnitureCost(\n  flags: { searchCollapsed: boolean; counterHidden: boolean; compactControls: boolean },\n  hasExport: boolean,\n): number {\n  return (\n    (flags.searchCollapsed ? RESERVED.searchIcon : RESERVED.search) +\n    (flags.counterHidden ? 0 : RESERVED.counter) +\n    rightClusterCost(hasExport, flags.compactControls) +\n    RESERVED.chrome\n  );\n}\n"],"mappings":";AAwBO,SAAS,cAAc,MAAc,OAAuB;AAmBjE,SAAO,KAAK,MAAM,KAAK,SAAS,GAAG,IAAI,KAAK;AAC9C;AAGO,SAAS,WAAW,OAAwC;AACjE,SAAO,QAAQ,UAAU,MAAM,QAAQ,UAAa,MAAM,QAAQ,OAAU;AAC9E;AAGO,SAAS,SAA4C,OAAyB,QAA0B;AAC7G,MAAI,OAAO,WAAW,EAAG,QAAO,MAAM;AACtC,MAAI,OAAO,WAAW,GAAG;AACvB,UAAM,SAAS,MAAM,MAAM,QAAQ,KAAK,CAAC,UAAU,MAAM,UAAU,OAAO,CAAC,CAAC;AAC5E,WAAO,GAAG,MAAM,KAAK,KAAK,QAAQ,SAAS,OAAO,CAAC,CAAC;AAAA,EACtD;AACA,SAAO,GAAG,MAAM,KAAK,KAAK,OAAO,MAAM;AACzC;AAGO,IAAM,WAAW;AAAA;AAAA,EAEtB,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQR,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAWT,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQhB,uBAAuB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOvB,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAWZ,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAUd,gBAAgB;AAAA,EAChB,uBAAuB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASvB,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASV,QAAQ;AACV;AAGO,IAAM,MAAM;AAGZ,SAAS,iBAAiB,WAAoB,SAA0B;AAC7E,QAAM,MAAM,UAAU,SAAS,wBAAwB,SAAS;AAChE,SAAO,YAAY,MAAM,IAAI;AAC/B;AAYO,SAAS,cACd,OACA,WACQ;AACR,UACG,MAAM,kBAAkB,SAAS,aAAa,SAAS,WACvD,MAAM,gBAAgB,IAAI,SAAS,WACpC,iBAAiB,WAAW,MAAM,eAAe,IACjD,SAAS;AAEb;","names":[]}