@12-apps/ui 6.37.0 → 6.39.0

package/dist/chunk-NOKN4HRK.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/navigation/Tabs/Tabs.tsx"],"sourcesContent":["import Close from '@mui/icons-material/Close';\nimport Badge from '@mui/material/Badge/index.js';\nimport Box from '@mui/material/Box/index.js';\nimport Divider from '@mui/material/Divider/index.js';\nimport MuiTab from '@mui/material/Tab/index.js';\nimport MuiTabs from '@mui/material/Tabs/index.js';\nimport { alpha, styled } from '@mui/material/styles/index.js';\nimport type { Theme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport { CustomTabPanel } from './TabsPanel';\nimport { tabsRootStyles } from './Tabs.styles';\nimport type { TabItem, TabsProps } from './Tabs.types';\nimport { rem, sxRem } from '../../../tokens/relative';\n\nconst StyledTabs = styled(MuiTabs, {\n  shouldForwardProp: (prop) => !['customVariant', 'size', 'showDividers'].includes(prop as string) })<{ customVariant?: string; size?: string; showDividers?: boolean }>(\n  ({ theme, customVariant, size, showDividers }) => ({\n    ...tabsRootStyles({ theme, customVariant, size, showDividers }) }),\n);\n\nconst CloseButton = styled(Box)(({ theme }) => ({\n  marginLeft: theme.spacing(0.5),\n  padding: theme.spacing(0.25),\n  width: rem(theme, 20),\n  height: rem(theme, 20),\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  cursor: 'pointer',\n  borderRadius: '50%',\n  color: theme.palette.action.active,\n  '&:hover': {\n    backgroundColor: alpha(theme.palette.error.main, 0.1),\n    color: theme.palette.error.main } }));\n\nconst BadgeWrapper = styled(Badge)(({ theme }) => ({\n  '& .MuiBadge-badge': {\n    right: rem(theme, -6),\n    top: rem(theme, 4),\n    fontSize: rem(theme, 12),\n    minWidth: rem(theme, 16),\n    height: rem(theme, 16),\n    padding: 0 } }));\n\nconst TABS_DEFAULTS: Partial<TabsProps> = {\n  variant: 'default',\n  size: 'md',\n  color: 'primary',\n  fullWidth: false,\n  orientation: 'horizontal',\n  showDividers: false,\n  centered: false,\n  scrollable: false,\n  scrollButtons: 'auto',\n  sticky: false,\n  stickyOffset: 0,\n  animateContent: false,\n  animationDuration: 300,\n  persistContent: false,\n  disabled: false,\n  loading: false };\n\n/**\n * The props this component OWNS and MUI's `Tabs` does not understand (12-86).\n *\n * `rest` below is spread onto the DOM node, so anything left in it that React\n * cannot place on an element is reported — five `does not recognize the … prop`\n * warnings and three `Received false for a non-boolean attribute`, on every\n * render, in the browser console and in every host's jsdom output.\n *\n * An explicit list rather than `Object.keys(TABS_DEFAULTS)`, because the two\n * sets differ in both directions: `items`, `closeTabLabel`, `tabPanelProps` and\n * `loadingComponent` have no default and still must not reach the DOM, while\n * `orientation`, `centered` and `indicatorColor` are real MUI props that must.\n * An omission rather than more destructuring, so a prop added to `TabsProps`\n * costs a line here instead of an unused `_name` binding.\n *\n * Deliberately NOT here: `onFocus` and `onBlur`. They are ordinary DOM handlers\n * that reach the element through `rest` and nowhere else, so listing them would\n * silently stop them working.\n */\nconst OWN_PROPS = new Set<string>([\n  'items',\n  'closeTabLabel',\n  'color',\n  'size',\n  'fullWidth',\n  'scrollable',\n  'scrollButtons',\n  'sticky',\n  'stickyOffset',\n  'animateContent',\n  'animationDuration',\n  'persistContent',\n  'tabPanelProps',\n  'loading',\n  'loadingComponent',\n]);\n\n/** `props` with every {@link OWN_PROPS} key dropped — what is left is passthrough. */\nconst domPassthrough = (props: Record<string, unknown>): Record<string, unknown> =>\n  Object.fromEntries(Object.entries(props).filter(([key]) => !OWN_PROPS.has(key)));\n\n// Strips explicitly-undefined props before the merge, so `prop={undefined}`\n// still falls back to the default as a destructuring default would.\nconst definedProps = (props: TabsProps): Partial<TabsProps> =>\n  Object.fromEntries(\n    Object.entries(props).filter(([, value]) => value !== undefined),\n  ) as Partial<TabsProps>;\n\n// Once the row is scrollable every accepted scrollButtons value ends up as\n// MUI's 'auto'. That is exactly what the previous nested ternary did — it mapped\n// 'on'/'off'/'desktop' to 'auto', and its remaining branch could only ever be\n// 'auto' anyway — so the behaviour is preserved here rather than quietly\n// changed. Worth knowing that scrollButtons=\"off\" therefore still shows buttons.\nconst resolveScrollButtons = (scrollable?: boolean): 'auto' | false =>\n  scrollable ? 'auto' : false;\n\nconst buildTabsSx = ({\n  fullWidth,\n  sticky,\n  stickyOffset,\n  indicatorColor,\n  disabled }: {\n  fullWidth?: boolean;\n  sticky?: boolean;\n  /** The pinned list's `top`, already through the theme (the prop is design px). */\n  stickyOffset: (theme: Theme) => string;\n  indicatorColor?: string;\n  disabled?: boolean;\n}) => ({\n  ...(fullWidth && { width: '100%' }),\n  // Pin the tab list while panels scroll beneath it. Opaque background + bottom\n  // divider so scrolled content does not show through.\n  ...(sticky && {\n    position: 'sticky',\n    top: stickyOffset,\n    zIndex: 2,\n    backgroundColor: 'background.default',\n    borderBottom: 1,\n    borderColor: 'divider' }),\n  ...(indicatorColor && {\n    '& .MuiTabs-indicator': { backgroundColor: indicatorColor } }),\n  ...(disabled && { opacity: 0.6, pointerEvents: 'none' }) });\n\n// A tab's label: icon, text, optional close affordance, optionally badged.\nconst TabLabel: React.FC<{\n  item: TabItem;\n  closeTabLabel: string;\n  onClose: (event: React.MouseEvent | React.KeyboardEvent, tabId: string) => void;\n}> = ({ item, closeTabLabel, onClose }) => {\n  const content = (\n    <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>\n      {item.icon}\n      <span>{item.label}</span>\n      {item.closable && (\n        <CloseButton\n          onClick={(e) => onClose(e, item.id)}\n          role=\"button\"\n          tabIndex={0}\n          aria-label={closeTabLabel}\n          onKeyDown={(e) => {\n            if (e.key !== 'Enter' && e.key !== ' ') return;\n            onClose(e, item.id);\n          }}\n        >\n          <Close fontSize=\"inherit\" />\n        </CloseButton>\n      )}\n    </Box>\n  );\n\n  if (item.badge === undefined) return content;\n\n  return (\n    <BadgeWrapper badgeContent={item.badge} color=\"error\">\n      {content}\n    </BadgeWrapper>\n  );\n};\n\ntype ResolvedTabs = TabsProps;\n\n// The tab strip. Kept in this file because StyledTabs cannot cross a module\n// boundary (TS2742).\nconst TabsBar: React.FC<\n  ResolvedTabs & {\n    rest: Record<string, unknown>;\n    onChange: (event: React.SyntheticEvent, newValue: string) => void;\n    onCloseTab: (event: React.MouseEvent | React.KeyboardEvent, tabId: string) => void;\n  }\n> = ({ rest, items, value, onChange, onCloseTab, dataTestId, ...p }) => (\n  <StyledTabs\n    {...rest}\n    value={value}\n    onChange={onChange}\n    customVariant={p.variant}\n    size={p.size}\n    showDividers={p.showDividers}\n    orientation={p.orientation}\n    centered={p.centered}\n    // MUI only scrolls when its own `variant` is `scrollable`; map our\n    // `scrollable` flag onto it so overflowing tab rows actually scroll.\n    variant={p.scrollable ? 'scrollable' : 'standard'}\n    data-testid={dataTestId ? `${dataTestId}-list` : 'tabs-list'}\n    scrollButtons={resolveScrollButtons(p.scrollable)}\n    allowScrollButtonsMobile={p.scrollable}\n    textColor={p.color}\n    indicatorColor={p.color}\n    sx={buildTabsSx({\n      fullWidth: p.fullWidth,\n      sticky: p.sticky,\n      stickyOffset: sxRem(p.stickyOffset ?? 0),\n      indicatorColor: p.indicatorColor,\n      disabled: p.disabled })}\n  >\n    {items.map((item, index) => (\n      <MuiTab\n        key={item.id}\n        value={item.id}\n        label={<TabLabel closeTabLabel={p.closeTabLabel} item={item} onClose={onCloseTab} />}\n        disabled={item.disabled || p.disabled}\n        className={item.className}\n        id={`tab-${item.id}`}\n        aria-controls={`tabpanel-${item.id}`}\n        aria-disabled={item.disabled || p.disabled}\n        data-testid={dataTestId ? `${dataTestId}-tab-${index}` : `tabs-tab-${index}`}\n      />\n    ))}\n  </StyledTabs>\n);\n\nconst TabsPanels: React.FC<ResolvedTabs> = ({\n  items,\n  value,\n  variant,\n  animateContent,\n  animationDuration,\n  persistContent,\n  loading,\n  loadingComponent,\n  tabPanelProps,\n  dataTestId }) => (\n  <Box sx={{ mt: variant === 'enclosed' ? 0 : 2 }}>\n    {items.map((item, index) => (\n      <CustomTabPanel\n        key={item.id}\n        id={item.id}\n        value={value}\n        animate={animateContent}\n        animationDuration={animationDuration}\n        persist={persistContent}\n        loading={loading}\n        loadingComponent={loadingComponent}\n        className={tabPanelProps?.className}\n        dataTestId={dataTestId}\n        index={index}\n      >\n        {item.content}\n      </CustomTabPanel>\n    ))}\n  </Box>\n);\n\nexport const Tabs = React.forwardRef<HTMLDivElement, TabsProps>(\n  (tabsProps, ref) => {\n    const resolved = { ...TABS_DEFAULTS, ...definedProps(tabsProps) } as TabsProps;\n    const {\n      // Destructured only to keep it OUT of `rest`, which is spread onto the\n      // DOM node — `{...resolved}` below is what actually carries it to\n      // `TabsBar`. Same reason as `value` on the next line.\n      closeTabLabel: _closeTabLabel,\n      value: _value,\n      onChange,\n      onTabClose,\n      className,\n      disabled,\n      showDividers,\n      variant,\n      dataTestId,\n      ...rest\n    } = resolved;\n\n    const handleChange = (event: React.SyntheticEvent, newValue: string) => {\n      if (!disabled) onChange(event, newValue);\n    };\n\n    const handleTabClose = (event: React.MouseEvent | React.KeyboardEvent, tabId: string) => {\n      event.stopPropagation();\n      onTabClose?.(tabId);\n    };\n\n    return (\n      <Box className={className} ref={ref} data-testid={dataTestId || 'tabs'}>\n        <TabsBar\n          {...resolved}\n          // The destructuring above drops the props this component USES;\n          // `domPassthrough` drops the ones it merely OWNS. Both have to go:\n          // `rest` is spread onto the DOM node, and the second group is where\n          // 12-86's warnings came from.\n          rest={domPassthrough(rest as unknown as Record<string, unknown>)}\n          onChange={handleChange}\n          onCloseTab={handleTabClose}\n        />\n\n        {showDividers && variant !== 'enclosed' && <Divider />}\n\n        <TabsPanels {...resolved} />\n      </Box>\n    );\n  },\n);\n\nTabs.displayName = 'Tabs';\n"],"mappings":";;;;;;;;;;;;AAAA,OAAO,WAAW;AAClB,OAAO,WAAW;AAClB,OAAO,SAAS;AAChB,OAAO,aAAa;AACpB,OAAO,YAAY;AACnB,OAAO,aAAa;AACpB,SAAS,OAAO,cAAc;AAE9B,OAAO,WAAW;AAiJd,SAEE,KAFF;AA1IJ,IAAM,aAAa,OAAO,SAAS;AAAA,EACjC,mBAAmB,CAAC,SAAS,CAAC,CAAC,iBAAiB,QAAQ,cAAc,EAAE,SAAS,IAAc;AAAE,CAAC;AAAA,EAClG,CAAC,EAAE,OAAO,eAAe,MAAM,aAAa,OAAO;AAAA,IACjD,GAAG,eAAe,EAAE,OAAO,eAAe,MAAM,aAAa,CAAC;AAAA,EAAE;AACpE;AAEA,IAAM,cAAc,OAAO,GAAG,EAAE,CAAC,EAAE,MAAM,OAAO;AAAA,EAC9C,YAAY,MAAM,QAAQ,GAAG;AAAA,EAC7B,SAAS,MAAM,QAAQ,IAAI;AAAA,EAC3B,OAAO,IAAI,OAAO,EAAE;AAAA,EACpB,QAAQ,IAAI,OAAO,EAAE;AAAA,EACrB,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,OAAO,MAAM,QAAQ,OAAO;AAAA,EAC5B,WAAW;AAAA,IACT,iBAAiB,MAAM,MAAM,QAAQ,MAAM,MAAM,GAAG;AAAA,IACpD,OAAO,MAAM,QAAQ,MAAM;AAAA,EAAK;AAAE,EAAE;AAExC,IAAM,eAAe,OAAO,KAAK,EAAE,CAAC,EAAE,MAAM,OAAO;AAAA,EACjD,qBAAqB;AAAA,IACnB,OAAO,IAAI,OAAO,EAAE;AAAA,IACpB,KAAK,IAAI,OAAO,CAAC;AAAA,IACjB,UAAU,IAAI,OAAO,EAAE;AAAA,IACvB,UAAU,IAAI,OAAO,EAAE;AAAA,IACvB,QAAQ,IAAI,OAAO,EAAE;AAAA,IACrB,SAAS;AAAA,EAAE;AAAE,EAAE;AAEnB,IAAM,gBAAoC;AAAA,EACxC,SAAS;AAAA,EACT,MAAM;AAAA,EACN,OAAO;AAAA,EACP,WAAW;AAAA,EACX,aAAa;AAAA,EACb,cAAc;AAAA,EACd,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,gBAAgB;AAAA,EAChB,mBAAmB;AAAA,EACnB,gBAAgB;AAAA,EAChB,UAAU;AAAA,EACV,SAAS;AAAM;AAqBjB,IAAM,YAAY,oBAAI,IAAY;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC;AAGD,IAAM,iBAAiB,CAAC,UACtB,OAAO,YAAY,OAAO,QAAQ,KAAK,EAAE,OAAO,CAAC,CAAC,GAAG,MAAM,CAAC,UAAU,IAAI,GAAG,CAAC,CAAC;AAIjF,IAAM,eAAe,CAAC,UACpB,OAAO;AAAA,EACL,OAAO,QAAQ,KAAK,EAAE,OAAO,CAAC,CAAC,EAAE,KAAK,MAAM,UAAU,MAAS;AACjE;AAOF,IAAM,uBAAuB,CAAC,eAC5B,aAAa,SAAS;AAExB,IAAM,cAAc,CAAC;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAS,OAOJ;AAAA,EACL,GAAI,aAAa,EAAE,OAAO,OAAO;AAAA;AAAA;AAAA,EAGjC,GAAI,UAAU;AAAA,IACZ,UAAU;AAAA,IACV,KAAK;AAAA,IACL,QAAQ;AAAA,IACR,iBAAiB;AAAA,IACjB,cAAc;AAAA,IACd,aAAa;AAAA,EAAU;AAAA,EACzB,GAAI,kBAAkB;AAAA,IACpB,wBAAwB,EAAE,iBAAiB,eAAe;AAAA,EAAE;AAAA,EAC9D,GAAI,YAAY,EAAE,SAAS,KAAK,eAAe,OAAO;AAAG;AAG3D,IAAM,WAID,CAAC,EAAE,MAAM,eAAe,QAAQ,MAAM;AACzC,QAAM,UACJ,qBAAC,OAAI,IAAI,EAAE,SAAS,QAAQ,YAAY,UAAU,KAAK,EAAE,GACtD;AAAA,SAAK;AAAA,IACN,oBAAC,UAAM,eAAK,OAAM;AAAA,IACjB,KAAK,YACJ;AAAA,MAAC;AAAA;AAAA,QACC,SAAS,CAAC,MAAM,QAAQ,GAAG,KAAK,EAAE;AAAA,QAClC,MAAK;AAAA,QACL,UAAU;AAAA,QACV,cAAY;AAAA,QACZ,WAAW,CAAC,MAAM;AAChB,cAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,IAAK;AACxC,kBAAQ,GAAG,KAAK,EAAE;AAAA,QACpB;AAAA,QAEA,8BAAC,SAAM,UAAS,WAAU;AAAA;AAAA,IAC5B;AAAA,KAEJ;AAGF,MAAI,KAAK,UAAU,OAAW,QAAO;AAErC,SACE,oBAAC,gBAAa,cAAc,KAAK,OAAO,OAAM,SAC3C,mBACH;AAEJ;AAMA,IAAM,UAMF,CAAC,EAAE,MAAM,OAAO,OAAO,UAAU,YAAY,YAAY,GAAG,EAAE,MAChE;AAAA,EAAC;AAAA;AAAA,IACE,GAAG;AAAA,IACJ;AAAA,IACA;AAAA,IACA,eAAe,EAAE;AAAA,IACjB,MAAM,EAAE;AAAA,IACR,cAAc,EAAE;AAAA,IAChB,aAAa,EAAE;AAAA,IACf,UAAU,EAAE;AAAA,IAGZ,SAAS,EAAE,aAAa,eAAe;AAAA,IACvC,eAAa,aAAa,GAAG,UAAU,UAAU;AAAA,IACjD,eAAe,qBAAqB,EAAE,UAAU;AAAA,IAChD,0BAA0B,EAAE;AAAA,IAC5B,WAAW,EAAE;AAAA,IACb,gBAAgB,EAAE;AAAA,IAClB,IAAI,YAAY;AAAA,MACd,WAAW,EAAE;AAAA,MACb,QAAQ,EAAE;AAAA,MACV,cAAc,MAAM,EAAE,gBAAgB,CAAC;AAAA,MACvC,gBAAgB,EAAE;AAAA,MAClB,UAAU,EAAE;AAAA,IAAS,CAAC;AAAA,IAEvB,gBAAM,IAAI,CAAC,MAAM,UAChB;AAAA,MAAC;AAAA;AAAA,QAEC,OAAO,KAAK;AAAA,QACZ,OAAO,oBAAC,YAAS,eAAe,EAAE,eAAe,MAAY,SAAS,YAAY;AAAA,QAClF,UAAU,KAAK,YAAY,EAAE;AAAA,QAC7B,WAAW,KAAK;AAAA,QAChB,IAAI,OAAO,KAAK,EAAE;AAAA,QAClB,iBAAe,YAAY,KAAK,EAAE;AAAA,QAClC,iBAAe,KAAK,YAAY,EAAE;AAAA,QAClC,eAAa,aAAa,GAAG,UAAU,QAAQ,KAAK,KAAK,YAAY,KAAK;AAAA;AAAA,MARrE,KAAK;AAAA,IASZ,CACD;AAAA;AACH;AAGF,IAAM,aAAqC,CAAC;AAAA,EAC1C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAW,MACX,oBAAC,OAAI,IAAI,EAAE,IAAI,YAAY,aAAa,IAAI,EAAE,GAC3C,gBAAM,IAAI,CAAC,MAAM,UAChB;AAAA,EAAC;AAAA;AAAA,IAEC,IAAI,KAAK;AAAA,IACT;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA,WAAW,eAAe;AAAA,IAC1B;AAAA,IACA;AAAA,IAEC,eAAK;AAAA;AAAA,EAZD,KAAK;AAaZ,CACD,GACH;AAGK,IAAM,OAAO,MAAM;AAAA,EACxB,CAAC,WAAW,QAAQ;AAClB,UAAM,WAAW,EAAE,GAAG,eAAe,GAAG,aAAa,SAAS,EAAE;AAChE,UAAM;AAAA;AAAA;AAAA;AAAA,MAIJ,eAAe;AAAA,MACf,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,IAAI;AAEJ,UAAM,eAAe,CAAC,OAA6B,aAAqB;AACtE,UAAI,CAAC,SAAU,UAAS,OAAO,QAAQ;AAAA,IACzC;AAEA,UAAM,iBAAiB,CAAC,OAA+C,UAAkB;AACvF,YAAM,gBAAgB;AACtB,mBAAa,KAAK;AAAA,IACpB;AAEA,WACE,qBAAC,OAAI,WAAsB,KAAU,eAAa,cAAc,QAC9D;AAAA;AAAA,QAAC;AAAA;AAAA,UACE,GAAG;AAAA,UAKJ,MAAM,eAAe,IAA0C;AAAA,UAC/D,UAAU;AAAA,UACV,YAAY;AAAA;AAAA,MACd;AAAA,MAEC,gBAAgB,YAAY,cAAc,oBAAC,WAAQ;AAAA,MAEpD,oBAAC,cAAY,GAAG,UAAU;AAAA,OAC5B;AAAA,EAEJ;AACF;AAEA,KAAK,cAAc;","names":[]}

package/dist/{chunk-LIG7TKIB.js → chunk-NYFNF7I5.js}

@@ -1,11 +1,16 @@
+import {
+  rem,
+  sxRem
+} from "./chunk-YKCAJ2TN.js";
+
 // src/components/layout/SettingsLayout/SettingsLayout.styles.ts
-var RAIL_WIDTH = 300;
+var railWidth = (theme) => rem(theme, 300);
 var SR_ONLY_SX = {
   position: "absolute",
-  width: "1px",
-  height: "1px",
+  width: sxRem(1),
+  height: sxRem(1),
   padding: 0,
-  margin: "-1px",
+  margin: sxRem(-1),
   overflow: "hidden",
   clip: "rect(0, 0, 0, 0)",
   whiteSpace: "nowrap",
@@ -25,11 +30,11 @@ var STATUS_COLOR = {
 };
 
 export {
-  RAIL_WIDTH,
+  railWidth,
   SR_ONLY_SX,
   atLeastRail,
   displayAcrossRail,
   TOUCH_TARGET,
   STATUS_COLOR
 };
-//# sourceMappingURL=chunk-LIG7TKIB.js.map
+//# sourceMappingURL=chunk-NYFNF7I5.js.map

package/dist/chunk-NYFNF7I5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/SettingsLayout/SettingsLayout.styles.ts"],"sourcesContent":["import type { CSSObject, SxProps, Theme } from '@mui/material/styles/index.js';\n\nimport { rem, sxRem } from '../../../tokens/relative';\n\nimport type { SettingsNavStatus, SettingsRailBreakpoint } from './SettingsLayout.types';\n\n/** Fixed width of the left navigation rail once it has its own column (300 design px). */\nexport const railWidth = (theme: Theme): string => rem(theme, 300);\n\n/** Visually hidden, still read aloud — for text a marker's colour cannot carry. */\nexport const SR_ONLY_SX: SxProps<Theme> = {\n  position: 'absolute',\n  width: sxRem(1),\n  height: sxRem(1),\n  padding: 0,\n  margin: sxRem(-1),\n  overflow: 'hidden',\n  clip: 'rect(0, 0, 0, 0)',\n  whiteSpace: 'nowrap',\n  border: 0,\n};\n\n/**\n * The media query for \"the rail has its own column\".\n *\n * `theme.breakpoints.up` takes a NUMBER as happily as a name, which is why\n * `railBreakpoint` accepts one: a settings area whose structural switch is at\n * 1024px has no MUI breakpoint to name (the default `lg` is 1200), and rounding\n * the design to the nearest named breakpoint moves 176px of behaviour to keep a\n * string tidy.\n */\nexport function atLeastRail(theme: Theme, breakpoint: SettingsRailBreakpoint): string {\n  return theme.breakpoints.up(breakpoint);\n}\n\n/**\n * A `display` pair across that query: `narrow` below it, `wide` at and above.\n *\n * Everything that changes shape between the two navigation modes goes through\n * this, so \"which width am I?\" is answered once, in CSS, for every part at\n * once — rather than by each part asking a media query in JavaScript and\n * answering slightly differently.\n */\nexport function displayAcrossRail(\n  theme: Theme,\n  breakpoint: SettingsRailBreakpoint,\n  narrow: string,\n  wide: string,\n): CSSObject {\n  return { display: narrow, [atLeastRail(theme, breakpoint)]: { display: wide } };\n}\n\n/** Minimum touch target, in px. Held down to 320px-wide phones, deliberately. */\nexport const TOUCH_TARGET = 44;\n\n/**\n * Palette role per situation.\n *\n * Returned as theme keys rather than hex so a marker follows the host's theme —\n * and so light and dark do not need two copies of this table.\n */\nexport const STATUS_COLOR: Record<Exclude<SettingsNavStatus, 'locked'>, string> = {\n  ok: 'success.main',\n  off: 'text.disabled',\n  new: 'error.main',\n};\n"],"mappings":";;;;;;AAOO,IAAM,YAAY,CAAC,UAAyB,IAAI,OAAO,GAAG;AAG1D,IAAM,aAA6B;AAAA,EACxC,UAAU;AAAA,EACV,OAAO,MAAM,CAAC;AAAA,EACd,QAAQ,MAAM,CAAC;AAAA,EACf,SAAS;AAAA,EACT,QAAQ,MAAM,EAAE;AAAA,EAChB,UAAU;AAAA,EACV,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,QAAQ;AACV;AAWO,SAAS,YAAY,OAAc,YAA4C;AACpF,SAAO,MAAM,YAAY,GAAG,UAAU;AACxC;AAUO,SAAS,kBACd,OACA,YACA,QACA,MACW;AACX,SAAO,EAAE,SAAS,QAAQ,CAAC,YAAY,OAAO,UAAU,CAAC,GAAG,EAAE,SAAS,KAAK,EAAE;AAChF;AAGO,IAAM,eAAe;AAQrB,IAAM,eAAqE;AAAA,EAChF,IAAI;AAAA,EACJ,KAAK;AAAA,EACL,KAAK;AACP;","names":[]}

package/dist/{chunk-KK57AHWS.js → chunk-OAEYCKBN.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-6DPAWXZ3.js";
 import {
   Text
-} from "./chunk-WTOYEWW6.js";
+} from "./chunk-YBH4SPMM.js";
 
 // src/components/data-display/DataViews/data-views-header-row.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -36,4 +36,4 @@ function GridHeaderRow({
 export {
   GridHeaderRow
 };
-//# sourceMappingURL=chunk-KK57AHWS.js.map
+//# sourceMappingURL=chunk-OAEYCKBN.js.map

package/dist/{chunk-JGRE56GQ.js → chunk-OB56SZGL.js}

@@ -9,7 +9,7 @@ import {
 } from "./chunk-WEBEOBN5.js";
 import {
   Text
-} from "./chunk-WTOYEWW6.js";
+} from "./chunk-YBH4SPMM.js";
 import {
   sxRem
 } from "./chunk-YKCAJ2TN.js";
@@ -54,4 +54,4 @@ function PreviewBox({ preview, testIdPrefix }) {
 export {
   PreviewBox
 };
-//# sourceMappingURL=chunk-JGRE56GQ.js.map
+//# sourceMappingURL=chunk-OB56SZGL.js.map

package/dist/{chunk-TQ6FPOPD.js → chunk-ODW2D5PN.js}

@@ -1,18 +1,22 @@
 import {
-  GAP,
   RESERVED,
   estimateWidth,
   furnitureCost,
   isRangeSet,
   pillText,
+  pricesFor,
   rightClusterCost
-} from "./chunk-IAGOUTI6.js";
+} from "./chunk-DNT5PZLF.js";
 import {
   splitToFit,
   useMeasuredWidth
 } from "./chunk-Y4KKS6WL.js";
+import {
+  remPx
+} from "./chunk-YKCAJ2TN.js";
 
 // src/components/data-display/DataViews/data-views-overflow.ts
+import { useTheme } from "@mui/material/styles/index.js";
 import { useRef } from "react";
 function toOverflowFields(fields, rangeFields) {
   return [
@@ -23,27 +27,29 @@ function toOverflowFields(fields, rangeFields) {
 function isActiveField(field, pills, ranges) {
   return field.group === "pill" ? (pills[field.id]?.length ?? 0) > 0 : isRangeSet(ranges[field.id]);
 }
-function fieldWidth(field, pills, ranges) {
-  if (field.group === "pill") return estimateWidth(pillText(field, pills[field.id] ?? []), 0);
-  return estimateWidth(field.label, isRangeSet(ranges[field.id]) ? 100 : 0);
+function fieldWidth(theme, field, pills, ranges) {
+  if (field.group === "pill") return estimateWidth(theme, pillText(field, pills[field.id] ?? []), 0);
+  return estimateWidth(theme, field.label, isRangeSet(ranges[field.id]) ? 100 : 0);
 }
-function splitFilters(all, pills, ranges, width, furniture, compact) {
+function splitFilters(all, pills, ranges, width, furniture, compact, theme) {
   const active = all.filter((field) => isActiveField(field, pills, ranges));
   const idle = all.filter((field) => !isActiveField(field, pills, ranges));
-  const clearCost = active.length > 0 ? RESERVED.clearAll + GAP : 0;
+  const price = pricesFor(theme);
+  const gap = remPx(theme, RESERVED.betweenControls);
+  const clearCost = active.length > 0 ? price.clearAll + gap : 0;
   const split = splitToFit(all, {
-    widthOf: (field) => fieldWidth(field, pills, ranges),
+    widthOf: (field) => fieldWidth(theme, field, pills, ranges),
     keyOf: (field) => field.id,
-    gap: GAP,
+    gap,
     available: width - furniture - clearCost,
     // The overflow button at the width it will actually have, which on a phone
     // is the icon-and-badge one.
-    overflowCost: compact ? RESERVED.overflowButtonCompact : RESERVED.overflowButton,
+    overflowCost: compact ? price.overflowButtonCompact : price.overflowButton,
     priority: [...active, ...idle]
   });
   return { ...split, used: split.used + clearCost };
 }
-function computeSplit(all, pills, ranges, width, hasExport) {
+function computeSplit(all, pills, ranges, width, hasExport, theme) {
   if (width === 0) {
     return {
       inline: all,
@@ -55,45 +61,48 @@ function computeSplit(all, pills, ranges, width, hasExport) {
       searchTakeover: false
     };
   }
-  let split = splitFilters(all, pills, ranges, width, furnitureCost(UNCOLLAPSED, hasExport), false);
-  let flags = ladderFlags(split, width, hasExport);
-  let budget = furnitureCost(UNCOLLAPSED, hasExport);
+  const price = pricesFor(theme);
+  let budget = furnitureCost(price, UNCOLLAPSED, hasExport);
+  let split = splitFilters(all, pills, ranges, width, budget, false, theme);
+  let flags = ladderFlags(split, width, hasExport, price);
   for (let pass = 0; pass < 3; pass += 1) {
-    const freed = furnitureCost(flags, hasExport);
+    const freed = furnitureCost(price, flags, hasExport);
     if (freed >= budget) break;
     budget = freed;
-    split = splitFilters(all, pills, ranges, width, budget, flags.compactControls);
-    flags = ladderFlags(split, width, hasExport);
+    split = splitFilters(all, pills, ranges, width, budget, flags.compactControls, theme);
+    flags = ladderFlags(split, width, hasExport, price);
   }
   return { inline: split.inline, overflow: split.overflow, ...flags };
 }
 var UNCOLLAPSED = { searchCollapsed: false, counterHidden: false, compactControls: false };
-function ladderFlags(split, width, hasExport) {
+function ladderFlags(split, width, hasExport, price) {
   const { overflow, used } = split;
-  const base = width - used - RESERVED.chrome;
-  const compactControls = base - RESERVED.counter - rightClusterCost(hasExport, false) < RESERVED.search;
-  const rightCost = rightClusterCost(hasExport, compactControls);
-  const searchCollapsed = base - RESERVED.counter - rightCost < RESERVED.search;
-  const counterHidden = searchCollapsed && base - RESERVED.counter - rightCost < RESERVED.searchIcon;
+  const base = width - used - price.chrome;
+  const compactControls = base - price.counter - rightClusterCost(price, hasExport, false) < price.search;
+  const rightCost = rightClusterCost(price, hasExport, compactControls);
+  const searchCollapsed = base - price.counter - rightCost < price.search;
+  const counterHidden = searchCollapsed && base - price.counter - rightCost < price.searchIcon;
   const clearAllHidden = counterHidden && overflow.length > 0;
-  const overflowButton = compactControls ? RESERVED.overflowButtonCompact : RESERVED.overflowButton;
-  const shedRoom = width - RESERVED.chrome - (overflow.length > 0 ? overflowButton : 0);
-  const searchBoxRoom = shedRoom - (counterHidden ? 0 : RESERVED.counter) - rightCost;
-  const searchTakeover = searchCollapsed && searchBoxRoom < RESERVED.usableSearch;
+  const overflowButton = compactControls ? price.overflowButtonCompact : price.overflowButton;
+  const shedRoom = width - price.chrome - (overflow.length > 0 ? overflowButton : 0);
+  const searchBoxRoom = shedRoom - (counterHidden ? 0 : price.counter) - rightCost;
+  const searchTakeover = searchCollapsed && searchBoxRoom < price.usableSearch;
   return { compactControls, counterHidden, searchCollapsed, clearAllHidden, searchTakeover };
 }
 function useFilterOverflow(all, pills, ranges, frozen = false, hasExport = true) {
   const { ref: barRef, width } = useMeasuredWidth();
+  const theme = useTheme();
   const signature = JSON.stringify({
     ids: all.map((field) => field.id),
     pills,
     ranges,
     width,
-    hasExport
+    hasExport,
+    scale: remPx(theme, 1)
   });
   const cache = useRef(null);
   if (cache.current === null || !frozen && cache.current.signature !== signature) {
-    cache.current = { signature, split: computeSplit(all, pills, ranges, width, hasExport) };
+    cache.current = { signature, split: computeSplit(all, pills, ranges, width, hasExport, theme) };
   }
   return { ...cache.current.split, barRef };
 }
@@ -102,4 +111,4 @@ export {
   toOverflowFields,
   useFilterOverflow
 };
-//# sourceMappingURL=chunk-TQ6FPOPD.js.map
+//# sourceMappingURL=chunk-ODW2D5PN.js.map

package/dist/chunk-ODW2D5PN.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/DataViews/data-views-overflow.ts"],"sourcesContent":["\"use client\";\n\nimport { useTheme, type Theme } from \"@mui/material/styles/index.js\";\nimport { useRef } from \"react\";\n\nimport { remPx } from \"../../../tokens/relative\";\nimport { splitToFit, useMeasuredWidth } from \"../../utility/Overflow\";\nimport {\n  estimateWidth,\n  furnitureCost,\n  isRangeSet,\n  pillText,\n  pricesFor,\n  RESERVED,\n  rightClusterCost,\n  type Prices,\n} from \"./data-views-overflow-costs\";\nimport type { FilterFieldConfig, RangeFieldConfig, RangeValue } from \"./data-views-types\";\n\n/**\n * PROGRESSIVE COLLAPSE — which filter controls fit on the toolbar, measured.\n *\n * Two rules, and both come from watching the all-or-nothing version fail:\n *\n * 1. Controls shed ONE AT A TIME into an overflow, never all at once. With four\n *    filters and room for three, hiding all four throws away the room that was\n *    there.\n * 2. An APPLIED filter is ranked first, not exempt. Applied controls take the\n *    visible slots ahead of idle ones, and go into \"Mais\" like anything else\n *    when even those slots run out. Exempting them outright — the earlier rule\n *    — meant four applied filters on a phone claimed more width than the row\n *    had, and the bar painted past its own edge: the pills were reachable only\n *    by scrolling the toolbar sideways. Hiding one is safe because \"Mais\" says\n *    how many applied filters are behind it; scrolling one off-screen says\n *    nothing at all.\n *\n * It MEASURES rather than picking a breakpoint, which is what\n * `FILTERS-CONTRACT.md` asks for: pages declare different numbers of filters\n * with different label lengths, and the same page collapses at a different\n * width in another language. A shared breakpoint is wrong for at least one\n * table by construction.\n *\n * Collapsing is presentation only — nothing here emits a query, drops a filter\n * or changes a rendered row.\n */\n\n/** A filter control on the bar: a multi-select pill or a min/max range. */\nexport interface OverflowField<T extends Record<string, unknown>> {\n  id: string;\n  label: string;\n  /** Which control it is — the caller renders the right one. */\n  group: \"pill\" | \"range\";\n  pill?: FilterFieldConfig<T>;\n  range?: RangeFieldConfig<T>;\n}\n\n/** What the caller renders inline, and what goes behind \"Mais\". */\nexport interface OverflowSplit<T extends Record<string, unknown>> {\n  inline: OverflowField<T>[];\n  overflow: OverflowField<T>[];\n  /**\n   * Step 2 — Exibir/Exportar drop their text labels and become icons.\n   * Cheap: both keep their icon, their tooltip and their position.\n   */\n  compactControls: boolean;\n  /**\n   * Step 5, and the LAST resort — the \"N de N\" counter is dropped.\n   *\n   * Only once every control has already collapsed and the row STILL does not\n   * fit, which on a six-filter table is below about 400px. The counter goes\n   * last because it is the only thing left that reports rather than does: an\n   * operator can act without knowing the total, but not without the search.\n   */\n  counterHidden: boolean;\n  /**\n   * Step 4 — the search collapses to a magnifier that expands on click.\n   * The most expensive step, so it is taken last: the search is the one\n   * control on the bar that cannot be guessed from an icon's position.\n   */\n  searchCollapsed: boolean;\n  /**\n   * Step 6, below even the counter — \"Limpar\" leaves the bar.\n   *\n   * The one control here with a second home: the overflow panel's footer\n   * carries \"Limpar todos os filtros\". So it goes before the search icon or\n   * \"Mais\", neither of which has anywhere else to be.\n   */\n  clearAllHidden: boolean;\n  /**\n   * Expanding the magnifier must take the whole cluster, filters and all.\n   *\n   * Only on the rungs where what is left over would be too narrow to read —\n   * on a large phone the box simply shrinks and the filters stay, which is why\n   * this is its own answer rather than `searchCollapsed` reused.\n   */\n  searchTakeover: boolean;\n  /** Attach to the toolbar row being measured. */\n  barRef: React.RefObject<HTMLDivElement | null>;\n}\n\n/** Every declared control, pills first, in the order the bar renders them. */\nexport function toOverflowFields<T extends Record<string, unknown>>(\n  fields: FilterFieldConfig<T>[],\n  rangeFields: RangeFieldConfig<T>[],\n): OverflowField<T>[] {\n  return [\n    ...fields.map((pill) => ({ id: pill.id, label: pill.label, group: \"pill\" as const, pill })),\n    ...rangeFields.map((range) => ({ id: range.id, label: range.label, group: \"range\" as const, range })),\n  ];\n}\n\n\n/** Is this control carrying a value the operator set? */\nfunction isActiveField<T extends Record<string, unknown>>(\n  field: OverflowField<T>,\n  pills: Record<string, string[]>,\n  ranges: Record<string, RangeValue>,\n): boolean {\n  return field.group === \"pill\"\n    ? (pills[field.id]?.length ?? 0) > 0\n    : isRangeSet(ranges[field.id]);\n}\n\n/** Estimated rendered width of one control at its CURRENT value, in px at `theme`'s scale. */\nfunction fieldWidth<T extends Record<string, unknown>>(\n  theme: Theme,\n  field: OverflowField<T>,\n  pills: Record<string, string[]>,\n  ranges: Record<string, RangeValue>,\n): number {\n  if (field.group === \"pill\") return estimateWidth(theme, pillText(field, pills[field.id] ?? []), 0);\n  // A bounded range renders two number inputs (100 design px) beside its label.\n  return estimateWidth(theme, field.label, isRangeSet(ranges[field.id]) ? 100 : 0);\n}\n\n/** What one split costs on the bar, so the ladder below can price the next step. */\ntype Split<T extends Record<string, unknown>> = {\n  inline: OverflowField<T>[];\n  overflow: OverflowField<T>[];\n  /** Width the surviving inline controls occupy, incl. the \"Mais\" button. */\n  used: number;\n};\n\n/** Step 1 — shed filter controls into the overflow. Pure. */\nfunction splitFilters<T extends Record<string, unknown>>(\n  all: OverflowField<T>[],\n  pills: Record<string, string[]>,\n  ranges: Record<string, RangeValue>,\n  width: number,\n  /** Search + counter + right cluster + chrome, at the rung being considered. */\n  furniture: number,\n  /** Is the bar already down to icons? \"Mais\" shrinks with everything else. */\n  compact: boolean,\n  /** Whose type scale every price is read at — the bar's own. */\n  theme: Theme,\n): Split<T> {\n  const active = all.filter((field) => isActiveField(field, pills, ranges));\n  const idle = all.filter((field) => !isActiveField(field, pills, ranges));\n  const price = pricesFor(theme);\n  const gap = remPx(theme, RESERVED.betweenControls);\n\n  // \"Limpar\" rides the end of the cluster whenever anything is applied.\n  const clearCost = active.length > 0 ? price.clearAll + gap : 0;\n  // APPLIED FIRST, BUT NOT EXEMPT.\n  //\n  // Applied controls take the visible slots ahead of idle ones — that part was\n  // always right. Exempting them from the overflow entirely was not: applying\n  // a value LENGTHENS a control (\"Pagamento (1)\"), so on a phone four applied\n  // filters claimed more width than the row had and the bar simply painted\n  // past its own edge, leaving pills reachable only by scrolling sideways.\n  //\n  // An applied filter hidden in \"Mais\" is not lost the way it would be if it\n  // vanished silently: the trigger goes to the applied tone and says how many\n  // are in there (see `MoreTrigger`), which is the same signal the pill itself\n  // was carrying. A control you scroll off-screen carries no signal at all.\n  //\n  // The keep-what-fits loop itself is `splitToFit` (`utility/Overflow`) — the\n  // one part of this that is not filter-shaped, and the part a second cluster\n  // in the design system would otherwise have had to reimplement.\n  const split = splitToFit(all, {\n    widthOf: (field) => fieldWidth(theme, field, pills, ranges),\n    keyOf: (field) => field.id,\n    gap,\n    available: width - furniture - clearCost,\n    // The overflow button at the width it will actually have, which on a phone\n    // is the icon-and-badge one.\n    overflowCost: compact ? price.overflowButtonCompact : price.overflowButton,\n    priority: [...active, ...idle],\n  });\n  return { ...split, used: split.used + clearCost };\n}\n\n/**\n * THE DEGRADATION LADDER — cheapest loss first, and each rung taken only if\n * the one before it did not free enough:\n *\n *   1. filter controls move into the \"Mais\" overflow   (`splitFilters`)\n *   2. Exibir / Exportar drop their text labels        (`compactControls`)\n *   3. the search shrinks toward its minimum           (CSS: it is `flex: 1`)\n *   4. the search itself collapses to an icon          (`searchCollapsed`)\n *\n * Step 3 needs no flag — the search is a flex child, so it gives up width on\n * its own until it hits `RESERVED.search`. The flags mark the two steps that\n * change what is RENDERED rather than how wide it is.\n *\n * Measured against what is CURRENTLY on the bar, never a breakpoint: a\n * two-filter page and a five-filter page would otherwise collapse at the same\n * width, and only one of them would be right.\n */\nfunction computeSplit<T extends Record<string, unknown>>(\n  all: OverflowField<T>[],\n  pills: Record<string, string[]>,\n  ranges: Record<string, RangeValue>,\n  width: number,\n  /** Does the host render \"Exportar\" beside \"Exibir\"? Half the cluster if not. */\n  hasExport: boolean,\n  theme: Theme,\n): Omit<OverflowSplit<T>, \"barRef\"> {\n  // Unmeasured (SSR, or jsdom without a ResizeObserver) ⇒ degrade nothing.\n  if (width === 0) {\n    return {\n      inline: all,\n      overflow: [],\n      compactControls: false,\n      counterHidden: false,\n      searchCollapsed: false,\n      clearAllHidden: false,\n      searchTakeover: false,\n    };\n  }\n  const price = pricesFor(theme);\n  // Pass 1 prices the furniture at its widest — no rung has been taken yet.\n  let budget = furnitureCost(price, UNCOLLAPSED, hasExport);\n  let split = splitFilters(all, pills, ranges, width, budget, false, theme);\n  let flags = ladderFlags(split, width, hasExport, price);\n  // RE-SPEND WHAT THE LATER RUNGS FREED.\n  //\n  // Rungs 2/4/5 turn 200 + 96 + 216 of furniture into 44 + 0 + 140, and until\n  // this loop existed nobody handed those ~330px back to the filters: the\n  // split was decided once, against the uncollapsed row, so a phone shed every\n  // control and then sat with a band of empty bar beside \"Mais 5\".\n  //\n  // Settles rather than oscillates, and cannot overfill: a cheaper furniture\n  // can only give the filters MORE room, more filter width can only push the\n  // ladder FURTHER down, and a further rung can only make the furniture\n  // cheaper again — so the budget decreases monotonically and the loop exits\n  // the moment it stops moving. The bound is a backstop, not the exit.\n  for (let pass = 0; pass < 3; pass += 1) {\n    const freed = furnitureCost(price, flags, hasExport);\n    if (freed >= budget) break;\n    budget = freed;\n    split = splitFilters(all, pills, ranges, width, budget, flags.compactControls, theme);\n    flags = ladderFlags(split, width, hasExport, price);\n  }\n  return { inline: split.inline, overflow: split.overflow, ...flags };\n}\n\n/** The widest the furniture ever is — every rung still untaken. */\nconst UNCOLLAPSED = { searchCollapsed: false, counterHidden: false, compactControls: false };\n\n/** Rungs 2 and 4-6, priced against what the filters actually took. */\nfunction ladderFlags<T extends Record<string, unknown>>(\n  split: Split<T>,\n  width: number,\n  hasExport: boolean,\n  price: Prices,\n): Omit<OverflowSplit<T>, \"barRef\" | \"inline\" | \"overflow\"> {\n  const { overflow, used } = split;\n  const base = width - used - price.chrome;\n\n  // Would the search still make its minimum with the labels on?\n  const compactControls = base - price.counter - rightClusterCost(price, hasExport, false) < price.search;\n  const rightCost = rightClusterCost(price, hasExport, compactControls);\n  // …and with them off?\n  const searchCollapsed = base - price.counter - rightCost < price.search;\n  // Everything has collapsed and the row STILL overflows. The controls cannot\n  // shrink further — they are `flexShrink: 0` precisely so an over-packed row\n  // sheds rather than squeezes — so without this last rung they simply paint\n  // outside the toolbar, which is what a narrow phone was doing.\n  const counterHidden =\n    searchCollapsed && base - price.counter - rightCost < price.searchIcon;\n  // Step 6 — below even that, \"Limpar\" leaves the bar. It is the ONLY control\n  // here with a second home: the overflow panel's footer carries \"Limpar todos\n  // os filtros\", so nothing is lost, which is exactly why it goes before the\n  // search icon or \"Mais\" (neither of which has anywhere else to be). Guarded\n  // on there BEING an overflow, because with no panel the footer does not\n  // exist and dropping this would strand the operator.\n  const clearAllHidden = counterHidden && overflow.length > 0;\n  // What the keyword box would get if the operator expanded the magnifier.\n  // `searchCollapsed` is a different question — it asks whether the box fits at\n  // its PREFERRED 200px, and is deliberately pessimistic — so reusing it to\n  // decide the takeover evicted the filters on screens where the box had plenty\n  // of room to simply shrink.\n  //\n  // Asked with the inline filters SHED, because shedding them is exactly what\n  // expanding the box does: the row re-splits and they go behind \"Mais\".\n  // Measuring against the resting row instead made a filter argue for its own\n  // eviction — now that a large phone keeps one, its width came out of `base`,\n  // pushed the box under `usableSearch`, and tipped a row that had ample space\n  // to share into a full takeover.\n  const overflowButton = compactControls\n    ? price.overflowButtonCompact\n    : price.overflowButton;\n  const shedRoom = width - price.chrome - (overflow.length > 0 ? overflowButton : 0);\n  const searchBoxRoom = shedRoom - (counterHidden ? 0 : price.counter) - rightCost;\n  // Below this a box is too narrow to read what you typed into it, and shrinking\n  // further buys nothing; that is the only point at which taking the whole\n  // cluster is worth losing the filters.\n  const searchTakeover = searchCollapsed && searchBoxRoom < price.usableSearch;\n\n  return { compactControls, counterHidden, searchCollapsed, clearAllHidden, searchTakeover };\n}\n\n/**\n * Split the declared filter controls into what fits and what goes behind\n * \"Mais\", measured against the live toolbar width.\n *\n * Cached on a SIGNATURE rather than by `useMemo` over the inputs: hosts declare\n * their fields inline, so `all` is a fresh array on every render while the\n * configuration is unchanged, and a reference-keyed memo would never hit.\n */\nexport function useFilterOverflow<T extends Record<string, unknown>>(\n  all: OverflowField<T>[],\n  pills: Record<string, string[]>,\n  ranges: Record<string, RangeValue>,\n  /**\n   * A filter control is open — hold the current answer until it closes.\n   *\n   * Applying a filter changes that control's LABEL (\"Valor\" becomes \"Valor: ≥\n   * R$ 1\"), which changes its measured width, which re-runs the whole split\n   * while its popover is open on top of it. Measured: setting a minimum moved\n   * the trigger 192px left, took the popover with it, and pushed two other\n   * controls into a newly-appeared \"Mais 2\" — so reaching for the second bound\n   * meant chasing the control across the row. Nobody sets a range that way.\n   *\n   * Frozen only for the duration: closing re-measures against the new labels,\n   * so the row still ends up correct, it just does not rearrange under a hand\n   * that is mid-edit.\n   */\n  frozen = false,\n  /** Whether \"Exportar\" is on the bar — see `rightClusterCost`. */\n  hasExport = true,\n): OverflowSplit<T> {\n  // The measurement is `useMeasuredWidth` (`utility/Overflow`): the same\n  // ResizeObserver every collapsing cluster in the design system reads, so\n  // there is one loop to get right rather than one per bar. `0` until the\n  // first measurement lands (and forever under SSR or jsdom), which\n  // `computeSplit` reads as \"degrade nothing\".\n  const { ref: barRef, width } = useMeasuredWidth<HTMLDivElement>();\n  // The prices follow the theme's type scale, so the answer does too.\n  const theme = useTheme();\n  const signature = JSON.stringify({\n    ids: all.map((field) => field.id),\n    pills,\n    ranges,\n    width,\n    hasExport,\n    scale: remPx(theme, 1),\n  });\n  const cache = useRef<{ signature: string; split: ReturnType<typeof computeSplit<T>> } | null>(null);\n  if (cache.current === null || (!frozen && cache.current.signature !== signature)) {\n    cache.current = { signature, split: computeSplit(all, pills, ranges, width, hasExport, theme) };\n  }\n  return { ...cache.current.split, barRef };\n}\n"],"mappings":"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","names":[]}

package/dist/{chunk-VRDNUY4H.js → chunk-OHC3F7GJ.js}

@@ -1,16 +1,16 @@
 import {
   SettingsPanel
-} from "./chunk-2E2WOBID.js";
+} from "./chunk-QGFBIUOK.js";
 import {
   SettingsRail
-} from "./chunk-3CVTQZQJ.js";
+} from "./chunk-TNYKM4UU.js";
 import {
   activeItemLabel,
   filterGroups
 } from "./chunk-BXC6GRLE.js";
 import {
   atLeastRail
-} from "./chunk-LIG7TKIB.js";
+} from "./chunk-NYFNF7I5.js";
 import {
   withDefaults
 } from "./chunk-HPK33ACY.js";
@@ -135,4 +135,4 @@ SettingsLayout.displayName = "SettingsLayout";
 export {
   SettingsLayout
 };
-//# sourceMappingURL=chunk-VRDNUY4H.js.map
+//# sourceMappingURL=chunk-OHC3F7GJ.js.map

package/dist/chunk-OHC3F7GJ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/SettingsLayout/SettingsLayout.tsx"],"sourcesContent":["'use client';\n\nimport Box from '@mui/material/Box/index.js';\nimport type { SxProps, Theme } from '@mui/material/styles/index.js';\nimport React, { useMemo, useState } from 'react';\n\nimport { withDefaults } from '../../../utils/withDefaults';\nimport { activeItemLabel, filterGroups } from './SettingsLayout.filters';\nimport { SettingsRail } from './SettingsLayout.rail';\nimport { atLeastRail } from './SettingsLayout.styles';\nimport { SettingsPanel } from './SettingsPanel';\nimport type { SettingsLayoutProps } from './SettingsLayout.types';\n\n/**\n * The props with every default already applied.\n *\n * A table through `withDefaults` rather than a `= default` per destructured\n * prop: each of those is a branch, and seven of them put the component over the\n * complexity bar before it renders anything. The single cast is what buys the\n * body non-optional values — without it every use site would restate the\n * default as a `??`, which is the same default written twice and free to drift.\n */\ntype ResolvedProps = SettingsLayoutProps &\n  Required<\n    Pick<\n      SettingsLayoutProps,\n      | 'searchPlaceholder'\n      | 'defaultQuery'\n      | 'emptySearchLabel'\n      | 'testIdPrefix'\n      | 'railBreakpoint'\n      | 'navVariant'\n      | 'atIndex'\n      | 'backLabel'\n    >\n  >;\n\nconst DEFAULTS = {\n  searchPlaceholder: 'Search settings',\n  defaultQuery: '',\n  emptySearchLabel: 'No settings match your search.',\n  testIdPrefix: 'settings',\n  railBreakpoint: 'md',\n  navVariant: 'switcher',\n  atIndex: false,\n  backLabel: 'Back',\n} satisfies Partial<SettingsLayoutProps>;\n\n/** Stacked below the rail's breakpoint, two columns at and above it. */\nfunction shellSx(breakpoint: SettingsLayoutProps['railBreakpoint'], fillHeight: boolean): SxProps<Theme> {\n  return (theme: Theme) => ({\n    display: 'flex',\n    flexDirection: 'column' as const,\n    alignItems: 'stretch',\n    gap: 1.5,\n    width: '100%',\n    minWidth: 0,\n    // Only ever at the wide shape. Narrow, the rail is a disclosure or the page\n    // itself, and two independent scrollbars on a phone is a trap rather than a\n    // convenience.\n    [atLeastRail(theme, breakpoint ?? 'md')]: {\n      flexDirection: 'row',\n      gap: 3,\n      ...(fillHeight ? { height: '100%', minHeight: 0 } : {}),\n    },\n  });\n}\n\n/**\n * A reusable, agnostic Facebook-style settings shell: a searchable left rail of\n * grouped categories/subcategories and a central panel that renders the selected\n * configuration screen (`children`). Navigation is data-driven via `groups`; the\n * host owns routing (pass `linkComponent` + item `href`, or handle `onSelectItem`).\n *\n * ## Two narrow-width shapes\n *\n * `navVariant=\"switcher\"` (the default) folds the rail into a disclosure above\n * the panel. `navVariant=\"drilldown\"` gives the phone shape instead: at the\n * area's index the LIST is the page, and inside a section the panel is the page\n * with a back link and a scrollable strip of sibling sections above it.\n *\n * ## Why the width decision is CSS and not JavaScript\n *\n * Every part that changes between the two shapes does it through a `display`\n * pair keyed on `railBreakpoint`. Nothing here asks a media query in JS and\n * renders one branch.\n *\n * That is not a performance preference. A layout that RENDERS one navigation and\n * not the other can offer the narrow width less than the wide one, and no test\n * or review catches it — the missing control simply is not in the tree to be\n * asserted about. With both forms always mounted, \"the narrow width reaches\n * everything the wide one does\" holds by construction, and an audit that counts\n * controls per width gets the same answer at both.\n */\nexport const SettingsLayout: React.FC<SettingsLayoutProps> = (props) => {\n  const {\n    title,\n    groups,\n    activeItemId,\n    onSelectItem,\n    searchPlaceholder,\n    defaultQuery,\n    emptySearchLabel,\n    emptySearchAction,\n    linkComponent,\n    children,\n    testIdPrefix,\n    railBreakpoint,\n    fillHeight = false,\n    navVariant,\n    atIndex,\n    indexHref,\n    backLabel,\n    sectionChips,\n  } = withDefaults(props, DEFAULTS) as ResolvedProps;\n  const [query, setQuery] = useState(defaultQuery);\n  const [navOpen, setNavOpen] = useState(false);\n  const filteredGroups = useMemo(() => filterGroups(groups, query), [groups, query]);\n  const activeLabel = useMemo(() => activeItemLabel(groups, activeItemId), [groups, activeItemId]);\n\n  const drilldown = navVariant === 'drilldown';\n  const ariaLabel = typeof title === 'string' ? title : 'Settings';\n\n  return (\n    <Box\n      data-testid={testIdPrefix}\n      data-nav-variant={navVariant}\n      data-at-index={atIndex ? 'true' : 'false'}\n      sx={shellSx(railBreakpoint, fillHeight)}\n    >\n      <SettingsRail\n        title={title}\n        activeLabel={activeLabel}\n        navOpen={navOpen}\n        onToggleNav={() => setNavOpen((open) => !open)}\n        query={query}\n        onQueryChange={setQuery}\n        searchPlaceholder={searchPlaceholder}\n        emptySearchLabel={emptySearchLabel}\n        emptySearchAction={emptySearchAction}\n        filteredGroups={filteredGroups}\n        activeItemId={activeItemId}\n        linkComponent={linkComponent}\n        onSelectItem={onSelectItem}\n        onNavigate={() => setNavOpen(false)}\n        testIdPrefix={testIdPrefix}\n        variant={navVariant}\n        breakpoint={railBreakpoint}\n        atIndex={atIndex}\n        fillHeight={fillHeight}\n      />\n\n      <SettingsPanel\n        inSection={drilldown && !atIndex}\n        hideOnNarrow={drilldown && atIndex}\n        breakpoint={railBreakpoint}\n        indexHref={indexHref}\n        sectionTitle={props.sectionTitle}\n        sectionDescription={props.sectionDescription}\n        backLabel={backLabel}\n        ariaLabel={ariaLabel}\n        sectionChips={sectionChips}\n        activeItemId={activeItemId}\n        linkComponent={linkComponent}\n        onSelectItem={onSelectItem}\n        testIdPrefix={testIdPrefix}\n        fillHeight={fillHeight}\n      >\n        {children}\n      </SettingsPanel>\n    </Box>\n  );\n};\n\nSettingsLayout.displayName = 'SettingsLayout';\n"],"mappings":";;;;;;;;;;;;;;;;;;AAEA,OAAO,SAAS;AAEhB,SAAgB,SAAS,gBAAgB;AAwHrC,SAME,KANF;AAvFJ,IAAM,WAAW;AAAA,EACf,mBAAmB;AAAA,EACnB,cAAc;AAAA,EACd,kBAAkB;AAAA,EAClB,cAAc;AAAA,EACd,gBAAgB;AAAA,EAChB,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,WAAW;AACb;AAGA,SAAS,QAAQ,YAAmD,YAAqC;AACvG,SAAO,CAAC,WAAkB;AAAA,IACxB,SAAS;AAAA,IACT,eAAe;AAAA,IACf,YAAY;AAAA,IACZ,KAAK;AAAA,IACL,OAAO;AAAA,IACP,UAAU;AAAA;AAAA;AAAA;AAAA,IAIV,CAAC,YAAY,OAAO,cAAc,IAAI,CAAC,GAAG;AAAA,MACxC,eAAe;AAAA,MACf,KAAK;AAAA,MACL,GAAI,aAAa,EAAE,QAAQ,QAAQ,WAAW,EAAE,IAAI,CAAC;AAAA,IACvD;AAAA,EACF;AACF;AA4BO,IAAM,iBAAgD,CAAC,UAAU;AACtE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,aAAa;AAAA,IACb;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,aAAa,OAAO,QAAQ;AAChC,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,YAAY;AAC/C,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAC5C,QAAM,iBAAiB,QAAQ,MAAM,aAAa,QAAQ,KAAK,GAAG,CAAC,QAAQ,KAAK,CAAC;AACjF,QAAM,cAAc,QAAQ,MAAM,gBAAgB,QAAQ,YAAY,GAAG,CAAC,QAAQ,YAAY,CAAC;AAE/F,QAAM,YAAY,eAAe;AACjC,QAAM,YAAY,OAAO,UAAU,WAAW,QAAQ;AAEtD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa;AAAA,MACb,oBAAkB;AAAA,MAClB,iBAAe,UAAU,SAAS;AAAA,MAClC,IAAI,QAAQ,gBAAgB,UAAU;AAAA,MAEtC;AAAA;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA,aAAa,MAAM,WAAW,CAAC,SAAS,CAAC,IAAI;AAAA,YAC7C;AAAA,YACA,eAAe;AAAA,YACf;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,YAAY,MAAM,WAAW,KAAK;AAAA,YAClC;AAAA,YACA,SAAS;AAAA,YACT,YAAY;AAAA,YACZ;AAAA,YACA;AAAA;AAAA,QACF;AAAA,QAEA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,aAAa,CAAC;AAAA,YACzB,cAAc,aAAa;AAAA,YAC3B,YAAY;AAAA,YACZ;AAAA,YACA,cAAc,MAAM;AAAA,YACpB,oBAAoB,MAAM;AAAA,YAC1B;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YAEC;AAAA;AAAA,QACH;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,eAAe,cAAc;","names":[]}

package/dist/{chunk-E4TNDTWV.js → chunk-OL2BEJZR.js}

@@ -17,7 +17,7 @@ import {
 } from "./chunk-YSTHOE66.js";
 import {
   Skeleton
-} from "./chunk-7F7TTOYN.js";
+} from "./chunk-BEGTLELZ.js";
 import {
   resolveTestId
 } from "./chunk-TYJR4GOF.js";
@@ -142,4 +142,4 @@ export {
   LoadingState,
   LoadingState_default
 };
-//# sourceMappingURL=chunk-E4TNDTWV.js.map
+//# sourceMappingURL=chunk-OL2BEJZR.js.map

package/dist/{chunk-ZTYUKEN3.js → chunk-OVXSQQDK.js}

@@ -1,18 +1,23 @@
 import {
   shadowInk
 } from "./chunk-FQ6UW7IY.js";
+import {
+  rem,
+  rems
+} from "./chunk-YKCAJ2TN.js";
 
 // src/components/layout/Sidebar/Sidebar.tsx
 import Box from "@mui/material/Box/index.js";
 import { alpha, useTheme } from "@mui/material/styles/index.js";
 import { jsx } from "react/jsx-runtime";
+var widthCss = (theme, value) => value <= 1 && value !== 0 ? `${value * 100}%` : rem(theme, value);
 var Sidebar = ({
   children,
   variant = "fixed",
   open = true,
   onToggle: _onToggle,
-  width = 280,
-  collapsedWidth = 64,
+  width,
+  collapsedWidth,
   position = "left",
   className,
   dataTestId = "sidebar",
@@ -21,7 +26,7 @@ var Sidebar = ({
   void _onToggle;
   const theme = useTheme();
   const isCollapsed = variant === "collapsible" && !open;
-  const currentWidth = isCollapsed ? collapsedWidth : width;
+  const currentWidth = isCollapsed ? collapsedWidth ?? 64 : width ?? 280;
   const getVariantStyles = () => {
     switch (variant) {
       case "floating":
@@ -37,9 +42,9 @@ var Sidebar = ({
       case "glass":
         return {
           backgroundColor: alpha(theme.palette.background.paper, 0.1),
-          backdropFilter: "blur(20px)",
+          backdropFilter: `blur(${rem(theme, 20)})`,
           border: `1px solid ${alpha(theme.palette.primary.main, 0.2)}`,
-          boxShadow: `0 8px 32px ${shadowInk(theme, 0.1)}`
+          boxShadow: `${rems(theme, 0, 8, 32)} ${shadowInk(theme, 0.1)}`
         };
       case "collapsible":
         return {
@@ -62,7 +67,7 @@ var Sidebar = ({
       "data-testid": dataTestId,
       ...rest,
       sx: {
-        width: currentWidth,
+        width: widthCss(theme, currentWidth),
         height: "100vh",
         display: "flex",
         flexDirection: "column",
@@ -125,4 +130,4 @@ export {
   SidebarContent,
   SidebarFooter
 };
-//# sourceMappingURL=chunk-ZTYUKEN3.js.map
+//# sourceMappingURL=chunk-OVXSQQDK.js.map

package/dist/chunk-OVXSQQDK.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/Sidebar/Sidebar.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport { alpha, useTheme } from '@mui/material/styles/index.js';\nimport type { Theme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport type {\n  SidebarContentProps,\n  SidebarFooterProps,\n  SidebarHeaderProps,\n  SidebarProps,\n} from './Sidebar.types';\nimport { shadowInk } from '../../../tokens/ink';\nimport { rem, rems } from '../../../tokens/relative';\n\n/**\n * A width prop as CSS. `sx` reads a number of 1 or less as a fraction of the\n * parent, and that stays so; any other number is design px, through the type scale.\n */\nconst widthCss = (theme: Theme, value: number): string =>\n  value <= 1 && value !== 0 ? `${value * 100}%` : rem(theme, value);\n\nexport const Sidebar: React.FC<SidebarProps> = ({\n  children,\n  variant = 'fixed',\n  open = true,\n  onToggle: _onToggle,\n  width,\n  collapsedWidth,\n  position = 'left',\n  className,\n  dataTestId = 'sidebar',\n  ...rest\n}) => {\n  // Prevent unused variable warning for onToggle\n  void _onToggle;\n  const theme = useTheme();\n\n  const isCollapsed = variant === 'collapsible' && !open;\n  // Design px: 280 open, 64 collapsed, unless the caller says otherwise.\n  const currentWidth = isCollapsed ? (collapsedWidth ?? 64) : (width ?? 280);\n\n  const getVariantStyles = () => {\n    switch (variant) {\n      case 'floating':\n        return {\n          position: 'fixed' as const,\n          top: theme.spacing(2),\n          bottom: theme.spacing(2),\n          [position]: theme.spacing(2),\n          borderRadius: theme.spacing(2),\n          boxShadow: theme.shadows[8],\n          zIndex: theme.zIndex.drawer,\n        };\n      case 'glass':\n        return {\n          backgroundColor: alpha(theme.palette.background.paper, 0.1),\n          backdropFilter: `blur(${rem(theme, 20)})`,\n          border: `1px solid ${alpha(theme.palette.primary.main, 0.2)}`,\n          boxShadow: `${rems(theme, 0, 8, 32)} ${shadowInk(theme, 0.1)}`,\n        };\n      case 'collapsible':\n        return {\n          transition: theme.transitions.create('width', {\n            easing: theme.transitions.easing.sharp,\n            duration: theme.transitions.duration.leavingScreen,\n          }),\n        };\n      default:\n        return {\n          backgroundColor: theme.palette.background.paper,\n          borderRight: `1px solid ${theme.palette.divider}`,\n        };\n    }\n  };\n\n  return (\n    <Box\n      className={className}\n      data-testid={dataTestId}\n      {...rest}\n      sx={{\n        width: widthCss(theme, currentWidth),\n        height: '100vh',\n        display: 'flex',\n        flexDirection: 'column',\n        overflow: 'hidden',\n        ...getVariantStyles(),\n      }}\n    >\n      {children}\n    </Box>\n  );\n};\n\nexport const SidebarHeader: React.FC<SidebarHeaderProps> = ({ children, dataTestId = 'sidebar-header', ...rest }) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      data-testid={dataTestId}\n      {...rest}\n      sx={{\n        padding: theme.spacing(2),\n        borderBottom: `1px solid ${theme.palette.divider}`,\n        flexShrink: 0,\n        overflow: 'hidden',\n      }}\n    >\n      {children}\n    </Box>\n  );\n};\n\nexport const SidebarContent: React.FC<SidebarContentProps> = ({ children, dataTestId = 'sidebar-content', ...rest }) => (\n    <Box\n      data-testid={dataTestId}\n      {...rest}\n      sx={{\n        flex: 1,\n        overflow: 'auto',\n      }}\n    >\n      {children}\n    </Box>\n  );\n\nexport const SidebarFooter: React.FC<SidebarFooterProps> = ({ children, dataTestId = 'sidebar-footer', ...rest }) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      data-testid={dataTestId}\n      {...rest}\n      sx={{\n        padding: theme.spacing(2),\n        borderTop: `1px solid ${theme.palette.divider}`,\n        flexShrink: 0,\n      }}\n    >\n      {children}\n    </Box>\n  );\n};\n"],"mappings":"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","names":[]}

package/dist/{chunk-ZQL5RXVE.js → chunk-PA3AA55Q.js}

@@ -84,7 +84,7 @@ function ColumnsMenu({
         onClose: close,
         anchorOrigin: { vertical: "bottom", horizontal: "right" },
         transformOrigin: { vertical: "top", horizontal: "right" },
-        slotProps: { paper: { sx: { minWidth: 200 } } },
+        slotProps: { paper: { sx: { minWidth: sxRem(200) } } },
         children: [
           /* @__PURE__ */ jsx(ListSubheader, { sx: { px: 1.5, py: 0.75, fontSize: sxRem(12), fontWeight: 600, color: "text.primary", lineHeight: 1.5 }, children: title }),
           columns.map((option) => /* @__PURE__ */ jsx(
@@ -105,4 +105,4 @@ function ColumnsMenu({
 export {
   ColumnsMenu
 };
-//# sourceMappingURL=chunk-ZQL5RXVE.js.map
+//# sourceMappingURL=chunk-PA3AA55Q.js.map

package/dist/{chunk-ZQL5RXVE.js.map → chunk-PA3AA55Q.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/layout/ContentToolbar/ColumnsMenu.tsx"],"sourcesContent":["'use client';\n\nimport ColumnsIcon from '@mui/icons-material/ViewColumnRounded';\nimport Box from '@mui/material/Box/index.js';\nimport Checkbox from '@mui/material/Checkbox/index.js';\nimport IconButton from '@mui/material/IconButton/index.js';\nimport ListSubheader from '@mui/material/ListSubheader/index.js';\nimport Menu from '@mui/material/Menu/index.js';\nimport MenuItem from '@mui/material/MenuItem/index.js';\nimport React, { useState } from 'react';\n\nimport type { ColumnVisibilityOption, ColumnsMenuProps } from './ContentToolbar.types';\nimport { fieldRadiusPx } from '../../../tokens/field-radius';\nimport { fieldHeight } from '../../../tokens/field-height';\nimport { sxRem } from '../../../tokens/relative';\n\n/** One column checkbox row; toggling never closes the menu. */\nfunction ColumnRow({\n  option,\n  onToggle,\n  testId,\n}: {\n  option: ColumnVisibilityOption;\n  onToggle: (id: string, visible: boolean) => void;\n  testId?: string;\n}): React.JSX.Element {\n  return (\n    <MenuItem\n      data-testid={testId}\n      onClick={() => onToggle(option.id, !option.visible)}\n      disabled={option.locked}\n      sx={{ gap: 1 }}\n    >\n      <Checkbox\n        checked={option.visible}\n        size=\"small\"\n        disableRipple\n        sx={{ p: 0, pointerEvents: 'none' }}\n        tabIndex={-1}\n      />\n      <Box component=\"span\" sx={{ flex: 1, minWidth: 0, textAlign: 'left' }}>\n        {option.label}\n      </Box>\n    </MenuItem>\n  );\n}\n\n/**\n * Stateless column-visibility selector: a neutral icon button (matching\n * {@link FilterTrigger}/{@link SortByDropdown}) opening a checkbox list of the\n * hideable columns. Purely presentational — the caller owns the visibility state\n * and is notified via `onToggle`. The menu stays open while toggling so several\n * columns can be flipped at once.\n */\nexport function ColumnsMenu({\n  columns,\n  onToggle,\n  title = 'Columns',\n  ariaLabel = 'Toggle columns',\n  'data-testid': testId,\n}: ColumnsMenuProps): React.JSX.Element {\n  const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null);\n  const open = Boolean(anchorEl);\n  const close = (): void => setAnchorEl(null);\n\n  return (\n    <>\n      <IconButton\n        size=\"small\"\n        data-testid={testId}\n        aria-label={ariaLabel}\n        aria-haspopup=\"menu\"\n        aria-expanded={open}\n        onClick={(event) => setAnchorEl(event.currentTarget)}\n        sx={{\n          width: fieldHeight,\n          height: fieldHeight,\n          borderRadius: fieldRadiusPx,\n          color: 'text.secondary',\n          bgcolor: open ? 'action.selected' : 'transparent',\n        }}\n      >\n        <ColumnsIcon sx={{ fontSize: sxRem(16) }} />\n      </IconButton>\n      <Menu\n        anchorEl={anchorEl}\n        open={open}\n        onClose={close}\n        anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n        transformOrigin={{ vertical: 'top', horizontal: 'right' }}\n        slotProps={{ paper: { sx: { minWidth: 200 } } }}\n      >\n        <ListSubheader sx={{ px: 1.5, py: 0.75, fontSize: sxRem(12), fontWeight: 600, color: 'text.primary', lineHeight: 1.5 }}>\n          {title}\n        </ListSubheader>\n        {columns.map((option) => (\n          <ColumnRow\n            key={option.id}\n            option={option}\n            onToggle={onToggle}\n            testId={testId ? `${testId}-${option.id}` : undefined}\n          />\n        ))}\n      </Menu>\n    </>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAEA,OAAO,iBAAiB;AACxB,OAAO,SAAS;AAChB,OAAO,cAAc;AACrB,OAAO,gBAAgB;AACvB,OAAO,mBAAmB;AAC1B,OAAO,UAAU;AACjB,OAAO,cAAc;AACrB,SAAgB,gBAAgB;AAkB5B,SAuCA,UAjCE,KANF;AAVJ,SAAS,UAAU;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AACF,GAIsB;AACpB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa;AAAA,MACb,SAAS,MAAM,SAAS,OAAO,IAAI,CAAC,OAAO,OAAO;AAAA,MAClD,UAAU,OAAO;AAAA,MACjB,IAAI,EAAE,KAAK,EAAE;AAAA,MAEb;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,SAAS,OAAO;AAAA,YAChB,MAAK;AAAA,YACL,eAAa;AAAA,YACb,IAAI,EAAE,GAAG,GAAG,eAAe,OAAO;AAAA,YAClC,UAAU;AAAA;AAAA,QACZ;AAAA,QACA,oBAAC,OAAI,WAAU,QAAO,IAAI,EAAE,MAAM,GAAG,UAAU,GAAG,WAAW,OAAO,GACjE,iBAAO,OACV;AAAA;AAAA;AAAA,EACF;AAEJ;AASO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,eAAe;AACjB,GAAwC;AACtC,QAAM,CAAC,UAAU,WAAW,IAAI,SAA6B,IAAI;AACjE,QAAM,OAAO,QAAQ,QAAQ;AAC7B,QAAM,QAAQ,MAAY,YAAY,IAAI;AAE1C,SACE,iCACE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,eAAa;AAAA,QACb,cAAY;AAAA,QACZ,iBAAc;AAAA,QACd,iBAAe;AAAA,QACf,SAAS,CAAC,UAAU,YAAY,MAAM,aAAa;AAAA,QACnD,IAAI;AAAA,UACF,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,cAAc;AAAA,UACd,OAAO;AAAA,UACP,SAAS,OAAO,oBAAoB;AAAA,QACtC;AAAA,QAEA,8BAAC,eAAY,IAAI,EAAE,UAAU,MAAM,EAAE,EAAE,GAAG;AAAA;AAAA,IAC5C;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,SAAS;AAAA,QACT,cAAc,EAAE,UAAU,UAAU,YAAY,QAAQ;AAAA,QACxD,iBAAiB,EAAE,UAAU,OAAO,YAAY,QAAQ;AAAA,QACxD,WAAW,EAAE,OAAO,EAAE,IAAI,EAAE,UAAU,IAAI,EAAE,EAAE;AAAA,QAE9C;AAAA,8BAAC,iBAAc,IAAI,EAAE,IAAI,KAAK,IAAI,MAAM,UAAU,MAAM,EAAE,GAAG,YAAY,KAAK,OAAO,gBAAgB,YAAY,IAAI,GAClH,iBACH;AAAA,UACC,QAAQ,IAAI,CAAC,WACZ;AAAA,YAAC;AAAA;AAAA,cAEC;AAAA,cACA;AAAA,cACA,QAAQ,SAAS,GAAG,MAAM,IAAI,OAAO,EAAE,KAAK;AAAA;AAAA,YAHvC,OAAO;AAAA,UAId,CACD;AAAA;AAAA;AAAA,IACH;AAAA,KACF;AAEJ;","names":[]}
+{"version":3,"sources":["../src/components/layout/ContentToolbar/ColumnsMenu.tsx"],"sourcesContent":["'use client';\n\nimport ColumnsIcon from '@mui/icons-material/ViewColumnRounded';\nimport Box from '@mui/material/Box/index.js';\nimport Checkbox from '@mui/material/Checkbox/index.js';\nimport IconButton from '@mui/material/IconButton/index.js';\nimport ListSubheader from '@mui/material/ListSubheader/index.js';\nimport Menu from '@mui/material/Menu/index.js';\nimport MenuItem from '@mui/material/MenuItem/index.js';\nimport React, { useState } from 'react';\n\nimport type { ColumnVisibilityOption, ColumnsMenuProps } from './ContentToolbar.types';\nimport { fieldRadiusPx } from '../../../tokens/field-radius';\nimport { fieldHeight } from '../../../tokens/field-height';\nimport { sxRem } from '../../../tokens/relative';\n\n/** One column checkbox row; toggling never closes the menu. */\nfunction ColumnRow({\n  option,\n  onToggle,\n  testId,\n}: {\n  option: ColumnVisibilityOption;\n  onToggle: (id: string, visible: boolean) => void;\n  testId?: string;\n}): React.JSX.Element {\n  return (\n    <MenuItem\n      data-testid={testId}\n      onClick={() => onToggle(option.id, !option.visible)}\n      disabled={option.locked}\n      sx={{ gap: 1 }}\n    >\n      <Checkbox\n        checked={option.visible}\n        size=\"small\"\n        disableRipple\n        sx={{ p: 0, pointerEvents: 'none' }}\n        tabIndex={-1}\n      />\n      <Box component=\"span\" sx={{ flex: 1, minWidth: 0, textAlign: 'left' }}>\n        {option.label}\n      </Box>\n    </MenuItem>\n  );\n}\n\n/**\n * Stateless column-visibility selector: a neutral icon button (matching\n * {@link FilterTrigger}/{@link SortByDropdown}) opening a checkbox list of the\n * hideable columns. Purely presentational — the caller owns the visibility state\n * and is notified via `onToggle`. The menu stays open while toggling so several\n * columns can be flipped at once.\n */\nexport function ColumnsMenu({\n  columns,\n  onToggle,\n  title = 'Columns',\n  ariaLabel = 'Toggle columns',\n  'data-testid': testId,\n}: ColumnsMenuProps): React.JSX.Element {\n  const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null);\n  const open = Boolean(anchorEl);\n  const close = (): void => setAnchorEl(null);\n\n  return (\n    <>\n      <IconButton\n        size=\"small\"\n        data-testid={testId}\n        aria-label={ariaLabel}\n        aria-haspopup=\"menu\"\n        aria-expanded={open}\n        onClick={(event) => setAnchorEl(event.currentTarget)}\n        sx={{\n          width: fieldHeight,\n          height: fieldHeight,\n          borderRadius: fieldRadiusPx,\n          color: 'text.secondary',\n          bgcolor: open ? 'action.selected' : 'transparent',\n        }}\n      >\n        <ColumnsIcon sx={{ fontSize: sxRem(16) }} />\n      </IconButton>\n      <Menu\n        anchorEl={anchorEl}\n        open={open}\n        onClose={close}\n        anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n        transformOrigin={{ vertical: 'top', horizontal: 'right' }}\n        slotProps={{ paper: { sx: { minWidth: sxRem(200) } } }}\n      >\n        <ListSubheader sx={{ px: 1.5, py: 0.75, fontSize: sxRem(12), fontWeight: 600, color: 'text.primary', lineHeight: 1.5 }}>\n          {title}\n        </ListSubheader>\n        {columns.map((option) => (\n          <ColumnRow\n            key={option.id}\n            option={option}\n            onToggle={onToggle}\n            testId={testId ? `${testId}-${option.id}` : undefined}\n          />\n        ))}\n      </Menu>\n    </>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAEA,OAAO,iBAAiB;AACxB,OAAO,SAAS;AAChB,OAAO,cAAc;AACrB,OAAO,gBAAgB;AACvB,OAAO,mBAAmB;AAC1B,OAAO,UAAU;AACjB,OAAO,cAAc;AACrB,SAAgB,gBAAgB;AAkB5B,SAuCA,UAjCE,KANF;AAVJ,SAAS,UAAU;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AACF,GAIsB;AACpB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa;AAAA,MACb,SAAS,MAAM,SAAS,OAAO,IAAI,CAAC,OAAO,OAAO;AAAA,MAClD,UAAU,OAAO;AAAA,MACjB,IAAI,EAAE,KAAK,EAAE;AAAA,MAEb;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,SAAS,OAAO;AAAA,YAChB,MAAK;AAAA,YACL,eAAa;AAAA,YACb,IAAI,EAAE,GAAG,GAAG,eAAe,OAAO;AAAA,YAClC,UAAU;AAAA;AAAA,QACZ;AAAA,QACA,oBAAC,OAAI,WAAU,QAAO,IAAI,EAAE,MAAM,GAAG,UAAU,GAAG,WAAW,OAAO,GACjE,iBAAO,OACV;AAAA;AAAA;AAAA,EACF;AAEJ;AASO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,eAAe;AACjB,GAAwC;AACtC,QAAM,CAAC,UAAU,WAAW,IAAI,SAA6B,IAAI;AACjE,QAAM,OAAO,QAAQ,QAAQ;AAC7B,QAAM,QAAQ,MAAY,YAAY,IAAI;AAE1C,SACE,iCACE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,eAAa;AAAA,QACb,cAAY;AAAA,QACZ,iBAAc;AAAA,QACd,iBAAe;AAAA,QACf,SAAS,CAAC,UAAU,YAAY,MAAM,aAAa;AAAA,QACnD,IAAI;AAAA,UACF,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,cAAc;AAAA,UACd,OAAO;AAAA,UACP,SAAS,OAAO,oBAAoB;AAAA,QACtC;AAAA,QAEA,8BAAC,eAAY,IAAI,EAAE,UAAU,MAAM,EAAE,EAAE,GAAG;AAAA;AAAA,IAC5C;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,SAAS;AAAA,QACT,cAAc,EAAE,UAAU,UAAU,YAAY,QAAQ;AAAA,QACxD,iBAAiB,EAAE,UAAU,OAAO,YAAY,QAAQ;AAAA,QACxD,WAAW,EAAE,OAAO,EAAE,IAAI,EAAE,UAAU,MAAM,GAAG,EAAE,EAAE,EAAE;AAAA,QAErD;AAAA,8BAAC,iBAAc,IAAI,EAAE,IAAI,KAAK,IAAI,MAAM,UAAU,MAAM,EAAE,GAAG,YAAY,KAAK,OAAO,gBAAgB,YAAY,IAAI,GAClH,iBACH;AAAA,UACC,QAAQ,IAAI,CAAC,WACZ;AAAA,YAAC;AAAA;AAAA,cAEC;AAAA,cACA;AAAA,cACA,QAAQ,SAAS,GAAG,MAAM,IAAI,OAAO,EAAE,KAAK;AAAA;AAAA,YAHvC,OAAO;AAAA,UAId,CACD;AAAA;AAAA;AAAA,IACH;AAAA,KACF;AAEJ;","names":[]}

package/dist/{chunk-IKLOIONQ.js → chunk-PCBZYORN.js}

@@ -1,7 +1,7 @@
 import {
   useColumnsWithActions,
   useRenderedColumns
-} from "./chunk-FFOQZRFC.js";
+} from "./chunk-D4FZ3ANG.js";
 import {
   filterRows
 } from "./chunk-YGQX7BNI.js";
@@ -18,7 +18,7 @@ import {
 import {
   computeActiveFilterCount,
   defaultSortFields
-} from "./chunk-75LOTMSN.js";
+} from "./chunk-BWHOCNGW.js";
 import {
   serverDerived,
   useServerQuery
@@ -172,4 +172,4 @@ function useDataViewsState({
 export {
   useDataViewsState
 };
-//# sourceMappingURL=chunk-IKLOIONQ.js.map
+//# sourceMappingURL=chunk-PCBZYORN.js.map

package/dist/{chunk-CQLPDY2J.js → chunk-PRIBOWX4.js}

@@ -1,9 +1,9 @@
 import {
   GridShell
-} from "./chunk-QEG3P5D4.js";
+} from "./chunk-GLHNMTP6.js";
 import {
   useDataViewsState
-} from "./chunk-IKLOIONQ.js";
+} from "./chunk-PCBZYORN.js";
 
 // src/components/data-display/DataViews/DataViewsGrid.tsx
 import { useEffect, useRef } from "react";
@@ -27,4 +27,4 @@ function DataViewsGrid(props) {
 export {
   DataViewsGrid
 };
-//# sourceMappingURL=chunk-CQLPDY2J.js.map
+//# sourceMappingURL=chunk-PRIBOWX4.js.map