@12-apps/ui 6.34.0 → 6.36.0

package/dist/chunk-3TVUW7QE.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/CodeEditor/CodeEditorToolbar.tsx"],"sourcesContent":["import CodeIcon from '@mui/icons-material/Code';\nimport CopyIcon from '@mui/icons-material/ContentCopy';\nimport ExitFullscreenIcon from '@mui/icons-material/FullscreenExit';\nimport FullscreenIcon from '@mui/icons-material/Fullscreen';\nimport WrapIcon from '@mui/icons-material/WrapText';\nimport Box from '@mui/material/Box/index.js';\nimport IconButton from '@mui/material/IconButton/index.js';\nimport Stack from '@mui/material/Stack/index.js';\nimport Tooltip from '@mui/material/Tooltip/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { alpha, styled } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport type { CodeEditorCopy } from '../../../copy';\nimport { rem, sxRem } from '../../../tokens/relative';\n\n// Each button repeated the same conditional test id; this is that ternary once.\nconst makeTestId =\n  (dataTestId?: string) =>\n  (suffix: string): string =>\n    dataTestId ? `${dataTestId}-${suffix}` : `code-editor-${suffix}`;\n\nconst Toolbar = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  justifyContent: 'space-between',\n  alignItems: 'center',\n  padding: theme.spacing(1, 2),\n  borderBottom: `1px solid ${alpha(theme.palette.divider, 0.12)}`,\n  background: alpha(theme.palette.background.default, 0.4),\n}));\n\nconst LanguageBadge = styled(Box)(({ theme }) => ({\n  display: 'inline-flex',\n  alignItems: 'center',\n  gap: theme.spacing(0.5),\n  padding: theme.spacing(0.5, 1),\n  borderRadius: theme.shape.borderRadius,\n  background: alpha(theme.palette.primary.main, 0.1),\n  color: theme.palette.primary.main,\n  fontSize: rem(theme, 12),\n  fontWeight: 600,\n  textTransform: 'uppercase',\n  letterSpacing: '0.05em',\n}));\n\nconst EditorActions: React.FC<{\n  copy: CodeEditorCopy;\n  readOnly: boolean;\n  isWrapped: boolean;\n  isCopied: boolean;\n  isFullscreen: boolean;\n  dataTestId?: string;\n  onFormat: () => void;\n  onCopy: () => void;\n  onWrapToggle: () => void;\n  onFullscreenToggle: () => void;\n}> = ({\n  copy,\n  readOnly,\n  isWrapped,\n  isCopied,\n  isFullscreen,\n  dataTestId,\n  onFormat,\n  onCopy,\n  onWrapToggle,\n  onFullscreenToggle,\n}) => {\n  const testId = makeTestId(dataTestId);\n\n  return (\n    <Stack direction=\"row\" spacing={1}>\n    {!readOnly && (\n      <Tooltip title={copy.formatCode}>\n        <IconButton\n          size=\"small\"\n          onClick={onFormat}\n          data-testid={testId('format-btn')}\n        >\n          <CodeIcon fontSize=\"small\" />\n        </IconButton>\n      </Tooltip>\n    )}\n\n    <Tooltip title={isWrapped ? copy.disableWrap : copy.enableWrap}>\n      <IconButton\n        size=\"small\"\n        onClick={onWrapToggle}\n        color={isWrapped ? 'primary' : 'default'}\n        data-testid={testId('wrap-btn')}\n      >\n        <WrapIcon fontSize=\"small\" />\n      </IconButton>\n    </Tooltip>\n\n    <Tooltip title={isCopied ? copy.copied : copy.copyToClipboard}>\n      <IconButton\n        size=\"small\"\n        onClick={onCopy}\n        color={isCopied ? 'success' : 'default'}\n        data-testid={testId('copy-btn')}\n      >\n        <CopyIcon fontSize=\"small\" />\n      </IconButton>\n    </Tooltip>\n\n    <Tooltip title={isFullscreen ? copy.exitFullscreen : copy.enterFullscreen}>\n      <IconButton\n        size=\"small\"\n        onClick={onFullscreenToggle}\n        data-testid={testId('fullscreen-btn')}\n      >\n        {isFullscreen ? (\n          <ExitFullscreenIcon fontSize=\"small\" />\n        ) : (\n          <FullscreenIcon fontSize=\"small\" />\n        )}\n      </IconButton>\n      </Tooltip>\n    </Stack>\n  );\n};\n\n// Language badge, read-only marker and the four action buttons.\nexport const EditorToolbar: React.FC<{\n  copy: CodeEditorCopy;\n  language: string;\n  readOnly: boolean;\n  isWrapped: boolean;\n  isCopied: boolean;\n  isFullscreen: boolean;\n  dataTestId?: string;\n  onFormat: () => void;\n  onCopy: () => void;\n  onWrapToggle: () => void;\n  onFullscreenToggle: () => void;\n}> = ({\n  copy,\n  language,\n  readOnly,\n  isWrapped,\n  isCopied,\n  isFullscreen,\n  dataTestId,\n  onFormat,\n  onCopy,\n  onWrapToggle,\n  onFullscreenToggle,\n}) => {\n  const testId = makeTestId(dataTestId);\n\n  return (\n  <Toolbar data-testid={testId('toolbar')}>\n    <Stack direction=\"row\" spacing={2} alignItems=\"center\">\n      <LanguageBadge data-testid={testId('language-badge')}>\n        <CodeIcon sx={{ fontSize: sxRem(14) }} />\n        {language}\n      </LanguageBadge>\n      {readOnly && (\n        <Typography variant=\"caption\" color=\"text.secondary\">\n          {copy.readOnly}\n        </Typography>\n      )}\n    </Stack>\n\n    <EditorActions\n      copy={copy}\n      readOnly={readOnly}\n      isWrapped={isWrapped}\n      isCopied={isCopied}\n      isFullscreen={isFullscreen}\n      dataTestId={dataTestId}\n      onFormat={onFormat}\n      onCopy={onCopy}\n      onWrapToggle={onWrapToggle}\n      onFullscreenToggle={onFullscreenToggle}\n    />\n  </Toolbar>\n  );\n};\n"],"mappings":";;;;;;AAAA,OAAO,cAAc;AACrB,OAAO,cAAc;AACrB,OAAO,wBAAwB;AAC/B,OAAO,oBAAoB;AAC3B,OAAO,cAAc;AACrB,OAAO,SAAS;AAChB,OAAO,gBAAgB;AACvB,OAAO,WAAW;AAClB,OAAO,aAAa;AACpB,OAAO,gBAAgB;AACvB,SAAS,OAAO,cAAc;AA6D1B,SAQM,KARN;AAtDJ,IAAM,aACJ,CAAC,eACD,CAAC,WACC,aAAa,GAAG,UAAU,IAAI,MAAM,KAAK,eAAe,MAAM;AAElE,IAAM,UAAU,OAAO,GAAG,EAAE,CAAC,EAAE,MAAM,OAAO;AAAA,EAC1C,SAAS;AAAA,EACT,gBAAgB;AAAA,EAChB,YAAY;AAAA,EACZ,SAAS,MAAM,QAAQ,GAAG,CAAC;AAAA,EAC3B,cAAc,aAAa,MAAM,MAAM,QAAQ,SAAS,IAAI,CAAC;AAAA,EAC7D,YAAY,MAAM,MAAM,QAAQ,WAAW,SAAS,GAAG;AACzD,EAAE;AAEF,IAAM,gBAAgB,OAAO,GAAG,EAAE,CAAC,EAAE,MAAM,OAAO;AAAA,EAChD,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,KAAK,MAAM,QAAQ,GAAG;AAAA,EACtB,SAAS,MAAM,QAAQ,KAAK,CAAC;AAAA,EAC7B,cAAc,MAAM,MAAM;AAAA,EAC1B,YAAY,MAAM,MAAM,QAAQ,QAAQ,MAAM,GAAG;AAAA,EACjD,OAAO,MAAM,QAAQ,QAAQ;AAAA,EAC7B,UAAU,IAAI,OAAO,EAAE;AAAA,EACvB,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,eAAe;AACjB,EAAE;AAEF,IAAM,gBAWD,CAAC;AAAA,EACJ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,SAAS,WAAW,UAAU;AAEpC,SACE,qBAAC,SAAM,WAAU,OAAM,SAAS,GAC/B;AAAA,KAAC,YACA,oBAAC,WAAQ,OAAO,KAAK,YACnB;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAS;AAAA,QACT,eAAa,OAAO,YAAY;AAAA,QAEhC,8BAAC,YAAS,UAAS,SAAQ;AAAA;AAAA,IAC7B,GACF;AAAA,IAGF,oBAAC,WAAQ,OAAO,YAAY,KAAK,cAAc,KAAK,YAClD;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAS;AAAA,QACT,OAAO,YAAY,YAAY;AAAA,QAC/B,eAAa,OAAO,UAAU;AAAA,QAE9B,8BAAC,YAAS,UAAS,SAAQ;AAAA;AAAA,IAC7B,GACF;AAAA,IAEA,oBAAC,WAAQ,OAAO,WAAW,KAAK,SAAS,KAAK,iBAC5C;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAS;AAAA,QACT,OAAO,WAAW,YAAY;AAAA,QAC9B,eAAa,OAAO,UAAU;AAAA,QAE9B,8BAAC,YAAS,UAAS,SAAQ;AAAA;AAAA,IAC7B,GACF;AAAA,IAEA,oBAAC,WAAQ,OAAO,eAAe,KAAK,iBAAiB,KAAK,iBACxD;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAS;AAAA,QACT,eAAa,OAAO,gBAAgB;AAAA,QAEnC,yBACC,oBAAC,sBAAmB,UAAS,SAAQ,IAErC,oBAAC,kBAAe,UAAS,SAAQ;AAAA;AAAA,IAErC,GACA;AAAA,KACF;AAEJ;AAGO,IAAM,gBAYR,CAAC;AAAA,EACJ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,SAAS,WAAW,UAAU;AAEpC,SACA,qBAAC,WAAQ,eAAa,OAAO,SAAS,GACpC;AAAA,yBAAC,SAAM,WAAU,OAAM,SAAS,GAAG,YAAW,UAC5C;AAAA,2BAAC,iBAAc,eAAa,OAAO,gBAAgB,GACjD;AAAA,4BAAC,YAAS,IAAI,EAAE,UAAU,MAAM,EAAE,EAAE,GAAG;AAAA,QACtC;AAAA,SACH;AAAA,MACC,YACC,oBAAC,cAAW,SAAQ,WAAU,OAAM,kBACjC,eAAK,UACR;AAAA,OAEJ;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACF;AAAA,KACF;AAEF;","names":[]}

package/dist/chunk-3U3H3BZM.js

@@ -0,0 +1,97 @@
+import {
+  SheetContent,
+  SheetFooter,
+  SheetHeader
+} from "./chunk-FPVYD7BO.js";
+import {
+  muiColor
+} from "./chunk-7ZPUN7TV.js";
+import {
+  sxRem
+} from "./chunk-YKCAJ2TN.js";
+
+// src/components/data-display/Sheet/Sheet.body.tsx
+import Box from "@mui/material/Box/index.js";
+import CircularProgress from "@mui/material/CircularProgress/index.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+var needsHeader = (props) => Boolean(
+  props.showHandle || props.title || props.description || props.showCloseButton || props.header
+);
+var SheetLoading = ({ color }) => /* @__PURE__ */ jsx(
+  Box,
+  {
+    sx: {
+      display: "flex",
+      justifyContent: "center",
+      alignItems: "center",
+      minHeight: sxRem(200)
+    },
+    children: /* @__PURE__ */ jsx(CircularProgress, { color: color === void 0 ? void 0 : muiColor(color, "inherit") })
+  }
+);
+var SheetBody = (props) => {
+  const {
+    title,
+    description,
+    showCloseButton,
+    showHandle,
+    header,
+    footer,
+    loading,
+    color,
+    children,
+    onClick,
+    onFocus,
+    onBlur,
+    testId,
+    isDragging,
+    isVerticalSheet,
+    isDraggableVariant,
+    onClose,
+    onDragStart
+  } = props;
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      onClick,
+      onFocus,
+      onBlur,
+      "data-testid": testId,
+      sx: {
+        // A vertical sheet's panel is a column whose height is its CONTENT, up
+        // to the `size` ceiling — so this fills what the panel has rather than
+        // asking for a percentage of it, and `minHeight: 0` is what lets it
+        // shrink past its content so `SheetContent` scrolls instead of the
+        // panel overflowing. A side sheet's panel is full-height already.
+        ...isVerticalSheet ? { flex: "1 1 auto", minHeight: 0 } : { height: "100%" },
+        display: "flex",
+        flexDirection: "column",
+        position: "relative",
+        userSelect: isDragging ? "none" : "auto"
+      },
+      children: [
+        needsHeader(props) && /* @__PURE__ */ jsx(
+          SheetHeader,
+          {
+            title,
+            description,
+            showCloseButton,
+            onClose,
+            showHandle: showHandle && isVerticalSheet,
+            isDraggable: isDraggableVariant && isVerticalSheet,
+            onDragStart,
+            dataTestId: `${testId}-header`,
+            children: header
+          }
+        ),
+        /* @__PURE__ */ jsx(SheetContent, { padded: true, dataTestId: `${testId}-content`, children: loading ? /* @__PURE__ */ jsx(SheetLoading, { color }) : children }),
+        footer && /* @__PURE__ */ jsx(SheetFooter, { sticky: true, divider: true, dataTestId: `${testId}-footer`, children: footer })
+      ]
+    }
+  );
+};
+
+export {
+  SheetBody
+};
+//# sourceMappingURL=chunk-3U3H3BZM.js.map

package/dist/chunk-3U3H3BZM.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Sheet/Sheet.body.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport CircularProgress from '@mui/material/CircularProgress/index.js';\nimport React from 'react';\n\nimport { SheetContent, SheetFooter, SheetHeader } from './Sheet.parts';\nimport type { SheetProps } from './Sheet.types';\nimport { sxRem } from '../../../tokens/relative';\nimport { muiColor } from '../../../tokens/scales';\n\nexport interface SheetBodyProps extends Pick<\n  SheetProps,\n  | 'title'\n  | 'description'\n  | 'showCloseButton'\n  | 'showHandle'\n  | 'header'\n  | 'footer'\n  | 'loading'\n  | 'color'\n  | 'children'\n  | 'onClick'\n  | 'onFocus'\n  | 'onBlur'\n> {\n  testId: string;\n  isDragging: boolean;\n  isVerticalSheet: boolean;\n  isDraggableVariant: boolean;\n  onClose: () => void;\n  onDragStart: (e: React.MouseEvent | React.TouchEvent) => void;\n}\n\n/**\n * The header earns its place if it would show anything at all — a grab handle,\n * either piece of text, the close button, or caller-supplied content.\n */\nconst needsHeader = (props: SheetBodyProps) =>\n  Boolean(\n    props.showHandle ||\n    props.title ||\n    props.description ||\n    props.showCloseButton ||\n    props.header,\n  );\n\n/** The centred spinner shown in place of the children while `loading`. */\nconst SheetLoading: React.FC<Pick<SheetBodyProps, 'color'>> = ({ color }) => (\n  <Box\n    sx={{\n      display: 'flex',\n      justifyContent: 'center',\n      alignItems: 'center',\n      minHeight: sxRem(200),\n    }}\n  >\n    <CircularProgress color={color === undefined ? undefined : muiColor(color, 'inherit')} />\n  </Box>\n);\n\n/**\n * What the sheet contains, independent of which drawer is carrying it. The\n * swipeable and plain branches render exactly this — they differ only in the\n * MUI component and its swipe props, so the contents are built once.\n */\nexport const SheetBody: React.FC<SheetBodyProps> = (props) => {\n  const {\n    title,\n    description,\n    showCloseButton,\n    showHandle,\n    header,\n    footer,\n    loading,\n    color,\n    children,\n    onClick,\n    onFocus,\n    onBlur,\n    testId,\n    isDragging,\n    isVerticalSheet,\n    isDraggableVariant,\n    onClose,\n    onDragStart,\n  } = props;\n\n  return (\n    <Box\n      onClick={onClick}\n      onFocus={onFocus}\n      onBlur={onBlur}\n      data-testid={testId}\n      sx={{\n        // A vertical sheet's panel is a column whose height is its CONTENT, up\n        // to the `size` ceiling — so this fills what the panel has rather than\n        // asking for a percentage of it, and `minHeight: 0` is what lets it\n        // shrink past its content so `SheetContent` scrolls instead of the\n        // panel overflowing. A side sheet's panel is full-height already.\n        ...(isVerticalSheet ? { flex: '1 1 auto', minHeight: 0 } : { height: '100%' }),\n        display: 'flex',\n        flexDirection: 'column',\n        position: 'relative',\n        userSelect: isDragging ? 'none' : 'auto',\n      }}\n    >\n      {needsHeader(props) && (\n        <SheetHeader\n          title={title}\n          description={description}\n          showCloseButton={showCloseButton}\n          onClose={onClose}\n          showHandle={showHandle && isVerticalSheet}\n          isDraggable={isDraggableVariant && isVerticalSheet}\n          onDragStart={onDragStart}\n          dataTestId={`${testId}-header`}\n        >\n          {header}\n        </SheetHeader>\n      )}\n\n      <SheetContent padded dataTestId={`${testId}-content`}>\n        {loading ? <SheetLoading color={color} /> : children}\n      </SheetContent>\n\n      {footer && (\n        <SheetFooter sticky divider dataTestId={`${testId}-footer`}>\n          {footer}\n        </SheetFooter>\n      )}\n    </Box>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;AAAA,OAAO,SAAS;AAChB,OAAO,sBAAsB;AAsDzB,cAgCA,YAhCA;AAnBJ,IAAM,cAAc,CAAC,UACnB;AAAA,EACE,MAAM,cACN,MAAM,SACN,MAAM,eACN,MAAM,mBACN,MAAM;AACR;AAGF,IAAM,eAAwD,CAAC,EAAE,MAAM,MACrE;AAAA,EAAC;AAAA;AAAA,IACC,IAAI;AAAA,MACF,SAAS;AAAA,MACT,gBAAgB;AAAA,MAChB,YAAY;AAAA,MACZ,WAAW,MAAM,GAAG;AAAA,IACtB;AAAA,IAEA,8BAAC,oBAAiB,OAAO,UAAU,SAAY,SAAY,SAAS,OAAO,SAAS,GAAG;AAAA;AACzF;AAQK,IAAM,YAAsC,CAAC,UAAU;AAC5D,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,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAa;AAAA,MACb,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAMF,GAAI,kBAAkB,EAAE,MAAM,YAAY,WAAW,EAAE,IAAI,EAAE,QAAQ,OAAO;AAAA,QAC5E,SAAS;AAAA,QACT,eAAe;AAAA,QACf,UAAU;AAAA,QACV,YAAY,aAAa,SAAS;AAAA,MACpC;AAAA,MAEC;AAAA,oBAAY,KAAK,KAChB;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,YAAY,cAAc;AAAA,YAC1B,aAAa,sBAAsB;AAAA,YACnC;AAAA,YACA,YAAY,GAAG,MAAM;AAAA,YAEpB;AAAA;AAAA,QACH;AAAA,QAGF,oBAAC,gBAAa,QAAM,MAAC,YAAY,GAAG,MAAM,YACvC,oBAAU,oBAAC,gBAAa,OAAc,IAAK,UAC9C;AAAA,QAEC,UACC,oBAAC,eAAY,QAAM,MAAC,SAAO,MAAC,YAAY,GAAG,MAAM,WAC9C,kBACH;AAAA;AAAA;AAAA,EAEJ;AAEJ;","names":[]}

package/dist/chunk-3UIDKLML.js

@@ -0,0 +1,79 @@
+import {
+  BOUNCE,
+  FADE_IN_SCALE,
+  GLOW_PULSE,
+  PULSE
+} from "./chunk-PYC4CWCQ.js";
+import {
+  rem,
+  rems
+} from "./chunk-YKCAJ2TN.js";
+
+// src/components/data-display/Badge/Badge.animations.ts
+import { keyframes } from "@mui/material/styles/index.js";
+var pulseAnimation = keyframes`
+  0% {
+    transform: scale(1);
+    opacity: 1;
+  }
+  70% {
+    transform: scale(${PULSE.scale});
+    opacity: ${PULSE.opacity};
+  }
+  100% {
+    transform: scale(1);
+    opacity: 1;
+  }
+`;
+var bounceAnimation = (theme) => keyframes`
+  0%, 20%, 50%, 80%, 100% {
+    transform: translateY(0) scale(1);
+  }
+  40% {
+    transform: translateY(${rem(theme, -BOUNCE.lift)}) scale(${BOUNCE.scale});
+  }
+  60% {
+    transform: translateY(${rem(theme, -BOUNCE.secondLift)}) scale(${BOUNCE.secondScale});
+  }
+`;
+var shimmerAnimation = (theme) => keyframes`
+  0% {
+    background-position: ${rem(theme, -1e3)} 0;
+  }
+  100% {
+    background-position: ${rem(theme, 1e3)} 0;
+  }
+`;
+var fadeInScaleAnimation = keyframes`
+  0% {
+    opacity: 0;
+    transform: scale(${FADE_IN_SCALE.from});
+  }
+  50% {
+    transform: scale(${FADE_IN_SCALE.overshoot});
+  }
+  100% {
+    opacity: 1;
+    transform: scale(1);
+  }
+`;
+var glowPulseAnimation = (theme) => keyframes`
+  0% {
+    box-shadow: 0 0 ${rems(theme, GLOW_PULSE.fromBlur, GLOW_PULSE.fromSpread)} rgba(var(--glow-color), ${GLOW_PULSE.fromAlpha});
+  }
+  50% {
+    box-shadow: 0 0 ${rems(theme, GLOW_PULSE.toBlur, GLOW_PULSE.toSpread)} rgba(var(--glow-color), ${GLOW_PULSE.toAlpha});
+  }
+  100% {
+    box-shadow: 0 0 ${rems(theme, GLOW_PULSE.fromBlur, GLOW_PULSE.fromSpread)} rgba(var(--glow-color), ${GLOW_PULSE.fromAlpha});
+  }
+`;
+
+export {
+  pulseAnimation,
+  bounceAnimation,
+  shimmerAnimation,
+  fadeInScaleAnimation,
+  glowPulseAnimation
+};
+//# sourceMappingURL=chunk-3UIDKLML.js.map

package/dist/chunk-3UIDKLML.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Badge/Badge.animations.ts"],"sourcesContent":["import { keyframes } from '@mui/material/styles/index.js';\nimport type { Theme } from '@mui/material/styles/index.js';\n\nimport { rem, rems } from '../../../tokens/relative';\n\nimport { BOUNCE, FADE_IN_SCALE, GLOW_PULSE, PULSE } from './Badge.metrics';\n\nexport const pulseAnimation = keyframes`\n  0% {\n    transform: scale(1);\n    opacity: 1;\n  }\n  70% {\n    transform: scale(${PULSE.scale});\n    opacity: ${PULSE.opacity};\n  }\n  100% {\n    transform: scale(1);\n    opacity: 1;\n  }\n`;\n\n// Define bounce animation\nexport const bounceAnimation = (theme: Theme) => keyframes`\n  0%, 20%, 50%, 80%, 100% {\n    transform: translateY(0) scale(1);\n  }\n  40% {\n    transform: translateY(${rem(theme, -BOUNCE.lift)}) scale(${BOUNCE.scale});\n  }\n  60% {\n    transform: translateY(${rem(theme, -BOUNCE.secondLift)}) scale(${BOUNCE.secondScale});\n  }\n`;\n\n// Define shimmer animation\nexport const shimmerAnimation = (theme: Theme) => keyframes`\n  0% {\n    background-position: ${rem(theme, -1000)} 0;\n  }\n  100% {\n    background-position: ${rem(theme, 1000)} 0;\n  }\n`;\n\n// Define fade in animation with scale\nexport const fadeInScaleAnimation = keyframes`\n  0% {\n    opacity: 0;\n    transform: scale(${FADE_IN_SCALE.from});\n  }\n  50% {\n    transform: scale(${FADE_IN_SCALE.overshoot});\n  }\n  100% {\n    opacity: 1;\n    transform: scale(1);\n  }\n`;\n\n// Define glow pulse animation\nexport const glowPulseAnimation = (theme: Theme) => keyframes`\n  0% {\n    box-shadow: 0 0 ${rems(theme, GLOW_PULSE.fromBlur, GLOW_PULSE.fromSpread)} rgba(var(--glow-color), ${GLOW_PULSE.fromAlpha});\n  }\n  50% {\n    box-shadow: 0 0 ${rems(theme, GLOW_PULSE.toBlur, GLOW_PULSE.toSpread)} rgba(var(--glow-color), ${GLOW_PULSE.toAlpha});\n  }\n  100% {\n    box-shadow: 0 0 ${rems(theme, GLOW_PULSE.fromBlur, GLOW_PULSE.fromSpread)} rgba(var(--glow-color), ${GLOW_PULSE.fromAlpha});\n  }\n`;\n"],"mappings":";;;;;;;;;;;;AAAA,SAAS,iBAAiB;AAOnB,IAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAMP,MAAM,KAAK;AAAA,eACnB,MAAM,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASrB,IAAM,kBAAkB,CAAC,UAAiB;AAAA;AAAA;AAAA;AAAA;AAAA,4BAKrB,IAAI,OAAO,CAAC,OAAO,IAAI,CAAC,WAAW,OAAO,KAAK;AAAA;AAAA;AAAA,4BAG/C,IAAI,OAAO,CAAC,OAAO,UAAU,CAAC,WAAW,OAAO,WAAW;AAAA;AAAA;AAKhF,IAAM,mBAAmB,CAAC,UAAiB;AAAA;AAAA,2BAEvB,IAAI,OAAO,IAAK,CAAC;AAAA;AAAA;AAAA,2BAGjB,IAAI,OAAO,GAAI,CAAC;AAAA;AAAA;AAKpC,IAAM,uBAAuB;AAAA;AAAA;AAAA,uBAGb,cAAc,IAAI;AAAA;AAAA;AAAA,uBAGlB,cAAc,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASvC,IAAM,qBAAqB,CAAC,UAAiB;AAAA;AAAA,sBAE9B,KAAK,OAAO,WAAW,UAAU,WAAW,UAAU,CAAC,4BAA4B,WAAW,SAAS;AAAA;AAAA;AAAA,sBAGvG,KAAK,OAAO,WAAW,QAAQ,WAAW,QAAQ,CAAC,4BAA4B,WAAW,OAAO;AAAA;AAAA;AAAA,sBAGjG,KAAK,OAAO,WAAW,UAAU,WAAW,UAAU,CAAC,4BAA4B,WAAW,SAAS;AAAA;AAAA;","names":[]}

package/dist/chunk-3VMGE7CU.js

@@ -0,0 +1,276 @@
+import {
+  fieldRadiusPx
+} from "./chunk-GDN2LUTZ.js";
+import {
+  sxRem
+} from "./chunk-YKCAJ2TN.js";
+
+// src/components/layout/ContentToolbar/ContentToolbar.tsx
+import Box from "@mui/material/Box/index.js";
+import Button from "@mui/material/Button/index.js";
+import Checkbox from "@mui/material/Checkbox/index.js";
+import Divider from "@mui/material/Divider/index.js";
+import Typography from "@mui/material/Typography/index.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var selectionButtonSx = {
+  minWidth: 0,
+  height: "auto",
+  borderRadius: fieldRadiusPx,
+  fontWeight: 600,
+  py: 0.5,
+  px: 1.5,
+  fontSize: sxRem(12),
+  textTransform: "none",
+  color: "text.primary"
+};
+function SelectionCluster({
+  hasSelection,
+  selectedCount,
+  selectAll,
+  clearSelection,
+  actions,
+  selectionExtra,
+  selectAllTestId,
+  clearAllTestId,
+  edgeAlign = false,
+  selectAllLabel,
+  selectAllText,
+  clearAllText
+}) {
+  const actionsSlot = actions !== void 0 && /* @__PURE__ */ jsx(Box, { sx: { ml: 0.5, display: "flex", flexShrink: 0, alignItems: "center" }, children: actions });
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      sx: {
+        display: "flex",
+        minWidth: 0,
+        // Browsing (mobile): don't grow, so the controls sit on the SAME line as
+        // the checkbox (no orphaned selection row). Desktop: grow to push
+        // controls right.
+        //
+        // SELECTING (mobile) it must be able to shrink instead. Its children are
+        // all `flex-shrink: 0`, so a cluster pinned at content width cannot wrap
+        // and the row painted past the toolbar's own edge — on Produtos at 390px
+        // that took "Ações" off-screen behind a sideways scroll, which is the
+        // one control the selection exists to reach.
+        flex: { xs: hasSelection ? "1 1 auto" : "0 0 auto", md: 1 },
+        alignItems: "center",
+        // Wrapping is the phone's answer, and only the phone's: below `md` the
+        // cluster carries the count, the scope control and "Ações" at once, and
+        // no combination of those fits 320px on one line. From `md` up it stays
+        // a single line, where it always fitted.
+        flexWrap: { xs: "wrap", md: "nowrap" },
+        columnGap: 1.5,
+        rowGap: 1,
+        ml: edgeAlign ? -1.5 : 0
+      },
+      children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "text",
+            size: "small",
+            color: "inherit",
+            onClick: selectAll,
+            "data-testid": selectAllTestId,
+            sx: { ...selectionButtonSx, display: { xs: "none", md: "inline-flex" } },
+            children: selectAllText
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Checkbox,
+          {
+            size: "small",
+            checked: hasSelection,
+            onChange: (event) => event.target.checked ? selectAll() : clearSelection(),
+            "data-testid": `${selectAllTestId}-checkbox`,
+            inputProps: { "aria-label": selectAllLabel },
+            sx: { p: 0.5, display: { xs: "inline-flex", md: "none" } }
+          }
+        ),
+        hasSelection ? /* @__PURE__ */ jsx(
+          SelectionState,
+          {
+            selectedCount,
+            clearSelection,
+            clearAllTestId,
+            clearAllText,
+            selectionExtra
+          }
+        ) : null,
+        actionsSlot
+      ]
+    }
+  );
+}
+function SelectionState({
+  selectedCount,
+  clearSelection,
+  clearAllTestId,
+  clearAllText,
+  selectionExtra
+}) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "text",
+        size: "small",
+        color: "inherit",
+        onClick: clearSelection,
+        "data-testid": clearAllTestId,
+        sx: selectionButtonSx,
+        children: clearAllText
+      }
+    ),
+    /* @__PURE__ */ jsx(Divider, { orientation: "vertical", flexItem: true, sx: { height: 16, alignSelf: "center" } }),
+    /* @__PURE__ */ jsxs(
+      Typography,
+      {
+        component: "span",
+        "data-testid": "selected-count-indicator",
+        sx: { fontSize: sxRem(14), color: "text.secondary", whiteSpace: "nowrap", flexShrink: 0 },
+        children: [
+          selectedCount,
+          " ",
+          selectedCount === 1 ? "item" : "items",
+          " selected"
+        ]
+      }
+    ),
+    selectionExtra !== void 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        Box,
+        {
+          "aria-hidden": true,
+          sx: { flexBasis: "100%", height: 0, display: { xs: "block", md: "none" } }
+        }
+      ),
+      selectionExtra
+    ] })
+  ] });
+}
+function BrowsingClusters({
+  leadingControls,
+  rightControls,
+  hasSelection,
+  edgeAlign
+}) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    leadingControls !== void 0 && /* @__PURE__ */ jsx(
+      Box,
+      {
+        sx: {
+          display: "flex",
+          alignItems: "center",
+          flexGrow: 1,
+          minWidth: 0,
+          // The collapse ladder has a FLOOR — below roughly 400px even the
+          // fully-collapsed row does not fit, and its controls cannot shrink
+          // (they are flexShrink:0 so an over-packed row sheds instead of
+          // squeezing). Past that point this scrolls rather than letting them
+          // paint outside the toolbar, which is what a narrow phone did.
+          overflowX: "auto",
+          // No scrollbar gutter stealing height on the common case.
+          scrollbarWidth: "thin"
+        },
+        children: leadingControls
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Box,
+      {
+        sx: {
+          display: "flex",
+          alignItems: "center",
+          // Same single-line rule as the row itself: this cluster wrapping
+          // INTERNALLY buys a second line just as surely as the row wrapping
+          // does. It bit at exactly 900px, the `md` breakpoint where the "N de
+          // N" counter appears and pushes Exibir/Exportar over the edge.
+          flexWrap: leadingControls === void 0 ? "wrap" : "nowrap",
+          // Tight (5px) when browsing so the controls fit one line beside the
+          // checkbox; roomier (14px) in selection mode where they get their own row.
+          gap: hasSelection ? "14px" : "5px",
+          ml: "auto",
+          mr: edgeAlign ? -1.5 : 0,
+          "& > *": { flexShrink: 0 }
+        },
+        children: rightControls
+      }
+    )
+  ] });
+}
+function ContentToolbar({
+  hasSelection,
+  selectedCount,
+  selectAll,
+  clearSelection,
+  rightControls,
+  leadingControls,
+  actions,
+  selectionExtra,
+  selectAllTestId,
+  clearAllTestId,
+  edgeAlign = false,
+  exclusiveSelection = false,
+  selectAllLabel,
+  selectAllText,
+  clearAllText
+}) {
+  const showSelection = !exclusiveSelection || hasSelection;
+  const showControls = !exclusiveSelection || !hasSelection;
+  return (
+    // Two clusters on one line. They may wrap onto separate rows ONLY for a
+    // toolbar without `leadingControls` — one carrying search + filters is
+    // driven by a measured collapse ladder (see `useFilterOverflow`), and a
+    // wrap there is the ladder having failed: it would silently buy a second
+    // row instead of shedding a control into "Mais", which is the one outcome
+    // the ladder exists to prevent.
+    /* @__PURE__ */ jsxs(
+      Box,
+      {
+        sx: {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "space-between",
+          gap: 2,
+          flexWrap: leadingControls === void 0 ? "wrap" : "nowrap",
+          rowGap: 1
+        },
+        children: [
+          showSelection && /* @__PURE__ */ jsx(
+            SelectionCluster,
+            {
+              selectAllText,
+              clearAllText,
+              hasSelection,
+              selectedCount,
+              selectAll,
+              clearSelection,
+              actions,
+              selectionExtra,
+              selectAllTestId,
+              clearAllTestId,
+              selectAllLabel,
+              edgeAlign
+            }
+          ),
+          showControls && /* @__PURE__ */ jsx(
+            BrowsingClusters,
+            {
+              leadingControls,
+              rightControls,
+              hasSelection,
+              edgeAlign
+            }
+          )
+        ]
+      }
+    )
+  );
+}
+
+export {
+  ContentToolbar
+};
+//# sourceMappingURL=chunk-3VMGE7CU.js.map

package/dist/chunk-3VMGE7CU.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/ContentToolbar/ContentToolbar.tsx"],"sourcesContent":["'use client';\n\nimport Box from '@mui/material/Box/index.js';\nimport Button from '@mui/material/Button/index.js';\nimport Checkbox from '@mui/material/Checkbox/index.js';\nimport Divider from '@mui/material/Divider/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport React from 'react';\n\nimport type { ContentToolbarProps } from './ContentToolbar.types';\nimport { fieldRadiusPx } from '../../../tokens/field-radius';\nimport { sxRem } from '../../../tokens/relative';\n\nconst selectionButtonSx = {\n  minWidth: 0,\n  height: 'auto',\n  borderRadius: fieldRadiusPx,\n  fontWeight: 600,\n  py: 0.5,\n  px: 1.5,\n  fontSize: sxRem(12),\n  textTransform: 'none',\n  color: 'text.primary',\n} as const;\n\ntype SelectionClusterProps = Pick<\n  ContentToolbarProps,\n  | 'hasSelection'\n  | 'selectedCount'\n  | 'selectAll'\n  | 'clearSelection'\n  | 'actions'\n  | 'selectionExtra'\n  | 'selectAllTestId'\n  | 'clearAllTestId'\n  | 'edgeAlign'\n  | 'selectAllLabel'\n  | 'selectAllText'\n  | 'clearAllText'\n>;\n\n/** The left cluster: Select All + (when selecting) Clear All / count / actions. */\nfunction SelectionCluster({\n  hasSelection,\n  selectedCount,\n  selectAll,\n  clearSelection,\n  actions,\n  selectionExtra,\n  selectAllTestId,\n  clearAllTestId,\n  edgeAlign = false,\n  selectAllLabel,\n  selectAllText,\n  clearAllText,\n}: SelectionClusterProps): React.JSX.Element {\n  const actionsSlot = actions !== undefined && (\n    <Box sx={{ ml: 0.5, display: 'flex', flexShrink: 0, alignItems: 'center' }}>{actions}</Box>\n  );\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        minWidth: 0,\n        // Browsing (mobile): don't grow, so the controls sit on the SAME line as\n        // the checkbox (no orphaned selection row). Desktop: grow to push\n        // controls right.\n        //\n        // SELECTING (mobile) it must be able to shrink instead. Its children are\n        // all `flex-shrink: 0`, so a cluster pinned at content width cannot wrap\n        // and the row painted past the toolbar's own edge — on Produtos at 390px\n        // that took \"Ações\" off-screen behind a sideways scroll, which is the\n        // one control the selection exists to reach.\n        flex: { xs: hasSelection ? '1 1 auto' : '0 0 auto', md: 1 },\n        alignItems: 'center',\n        // Wrapping is the phone's answer, and only the phone's: below `md` the\n        // cluster carries the count, the scope control and \"Ações\" at once, and\n        // no combination of those fits 320px on one line. From `md` up it stays\n        // a single line, where it always fitted.\n        flexWrap: { xs: 'wrap', md: 'nowrap' },\n        columnGap: 1.5,\n        rowGap: 1,\n        ml: edgeAlign ? -1.5 : 0,\n      }}\n    >\n      {/* Desktop: a \"Select All\" text button (md+). Mobile: a compact checkbox\n          that toggles select-all/clear — the text would eat the tight row. */}\n      <Button\n        variant=\"text\"\n        size=\"small\"\n        color=\"inherit\"\n        onClick={selectAll}\n        data-testid={selectAllTestId}\n        sx={{ ...selectionButtonSx, display: { xs: 'none', md: 'inline-flex' } }}\n      >\n        {selectAllText}\n      </Button>\n      <Checkbox\n        size=\"small\"\n        checked={hasSelection}\n        onChange={(event) => (event.target.checked ? selectAll() : clearSelection())}\n        data-testid={`${selectAllTestId}-checkbox`}\n        inputProps={{ 'aria-label': selectAllLabel }}\n        sx={{ p: 0.5, display: { xs: 'inline-flex', md: 'none' } }}\n      />\n      {hasSelection ? (\n        <SelectionState\n          selectedCount={selectedCount}\n          clearSelection={clearSelection}\n          clearAllTestId={clearAllTestId}\n          clearAllText={clearAllText}\n          selectionExtra={selectionExtra}\n        />\n      ) : null}\n      {actionsSlot}\n    </Box>\n  );\n}\n\n/**\n * What the cluster shows once something IS ticked: Clear All, the count, and\n * the host's own `selectionExtra`.\n *\n * Its own component only because the cluster around it is at the complexity\n * gate's line ceiling — but the split falls where the meaning does. Everything\n * here exists only while a selection does, and the `actions` slot deliberately\n * stays OUTSIDE it: a toolbar may carry actions while browsing too.\n */\nfunction SelectionState({\n  selectedCount,\n  clearSelection,\n  clearAllTestId,\n  clearAllText,\n  selectionExtra,\n}: Pick<\n  ContentToolbarProps,\n  'selectedCount' | 'clearSelection' | 'clearAllTestId' | 'clearAllText' | 'selectionExtra'\n>): React.JSX.Element {\n  return (\n    <>\n      <Button\n        variant=\"text\"\n        size=\"small\"\n        color=\"inherit\"\n        onClick={clearSelection}\n        data-testid={clearAllTestId}\n        sx={selectionButtonSx}\n      >\n        {clearAllText}\n      </Button>\n      <Divider orientation=\"vertical\" flexItem sx={{ height: 16, alignSelf: 'center' }} />\n      <Typography\n        component=\"span\"\n        data-testid=\"selected-count-indicator\"\n        sx={{ fontSize: sxRem(14), color: 'text.secondary', whiteSpace: 'nowrap', flexShrink: 0 }}\n      >\n        {selectedCount} {selectedCount === 1 ? 'item' : 'items'} selected\n      </Typography>\n      {selectionExtra !== undefined && (\n        <>\n          {/* A DELIBERATE break, not a wrap that happened to land here. What\n              follows — \"Seleção: 48 produtos — todas as páginas\", its \"Limpar\n              seleção\", and \"Ações\" — is a sentence about the selection plus the\n              control that acts on it, and letting the phone break it wherever it\n              ran out of room split that sentence mid-phrase. Zero height so it\n              costs nothing but the row gap, and `display:none` from `md` up,\n              where the line still fits. */}\n          <Box\n            aria-hidden\n            sx={{ flexBasis: '100%', height: 0, display: { xs: 'block', md: 'none' } }}\n          />\n          {selectionExtra}\n        </>\n      )}\n    </>\n  );\n}\n\n/**\n * The BROWSING half of the toolbar: search + filters on the left, the page's\n * own controls on the right. Split out of {@link ContentToolbar} so that\n * function stays inside the complexity gate — it is layout only, and the\n * decision of whether to show it at all is made by the caller.\n */\nfunction BrowsingClusters({\n  leadingControls,\n  rightControls,\n  hasSelection,\n  edgeAlign,\n}: {\n  leadingControls?: React.ReactNode;\n  rightControls: React.ReactNode;\n  hasSelection: boolean;\n  edgeAlign: boolean;\n}): React.JSX.Element {\n  return (\n    <>\n      {/* minWidth:0 lets this cluster be the one that gives up width as the row\n       * tightens, which is what the filter overflow measures against. */}\n      {leadingControls !== undefined && (\n        <Box\n          sx={{\n            display: 'flex',\n            alignItems: 'center',\n            flexGrow: 1,\n            minWidth: 0,\n            // The collapse ladder has a FLOOR — below roughly 400px even the\n            // fully-collapsed row does not fit, and its controls cannot shrink\n            // (they are flexShrink:0 so an over-packed row sheds instead of\n            // squeezing). Past that point this scrolls rather than letting them\n            // paint outside the toolbar, which is what a narrow phone did.\n            overflowX: 'auto',\n            // No scrollbar gutter stealing height on the common case.\n            scrollbarWidth: 'thin',\n          }}\n        >\n          {leadingControls}\n        </Box>\n      )}\n      {/* ml:auto keeps the controls right-aligned even when the cluster wraps to\n       * its own row (where justify-content:space-between would otherwise snap a\n       * lone item to the left); it's a no-op on a shared row. */}\n      <Box\n        sx={{\n          display: 'flex',\n          alignItems: 'center',\n          // Same single-line rule as the row itself: this cluster wrapping\n          // INTERNALLY buys a second line just as surely as the row wrapping\n          // does. It bit at exactly 900px, the `md` breakpoint where the \"N de\n          // N\" counter appears and pushes Exibir/Exportar over the edge.\n          flexWrap: leadingControls === undefined ? 'wrap' : 'nowrap',\n          // Tight (5px) when browsing so the controls fit one line beside the\n          // checkbox; roomier (14px) in selection mode where they get their own row.\n          gap: hasSelection ? '14px' : '5px',\n          ml: 'auto',\n          mr: edgeAlign ? -1.5 : 0,\n          '& > *': { flexShrink: 0 },\n        }}\n      >\n        {rightControls}\n      </Box>\n    </>\n  );\n}\n\n/**\n * Shared toolbar for content pages (Favorites, Personal Space, Recents, …). The\n * left cluster owns selection chrome — **Select All**, and once items are\n * selected, **Clear All** + an \"N items selected\" count + an optional `actions`\n * slot. The right cluster is a free `rightControls` slot for page-specific\n * controls (ViewSelector, SortByDropdown, MultiSelectDropdown, FilterTrigger).\n *\n * Faithful, generic MUI port of the reference `ContentPageToolbar` — the\n * domain-specific default actions are intentionally left to the consumer via\n * the `actions` slot so this stays agnostic and reusable across projects.\n *\n * @example\n * ```tsx\n * <ContentToolbar\n *   hasSelection={selected.size > 0}\n *   selectedCount={selected.size}\n *   selectAll={selectAll}\n *   clearSelection={clear}\n *   rightControls={\n *     <>\n *       <ViewSelector viewMode={view} onViewModeChange={setView} zoom={zoom} onZoomChange={setZoom} />\n *       <SortByDropdown fields={FIELDS} activeField={field} onFieldChange={setField} />\n *       <MultiSelectDropdown label=\"Content Type\" options={types} selected={typeSet} onToggle={toggle} onClear={clear} />\n *       <FilterTrigger open={panelOpen} onOpenChange={setPanelOpen} hasActiveFilters={hasFilters} />\n *     </>\n *   }\n * />\n * ```\n */\nexport function ContentToolbar({\n  hasSelection,\n  selectedCount,\n  selectAll,\n  clearSelection,\n  rightControls,\n  leadingControls,\n  actions,\n  selectionExtra,\n  selectAllTestId,\n  clearAllTestId,\n  edgeAlign = false,\n  exclusiveSelection = false,\n  selectAllLabel,\n  selectAllText,\n  clearAllText,\n}: ContentToolbarProps): React.JSX.Element {\n  // Under `exclusiveSelection` the two states are alternatives, not neighbours:\n  // browsing shows the controls and no checkbox, selecting shows the checkbox\n  // and no controls. Anything else double-books the row.\n  const showSelection = !exclusiveSelection || hasSelection;\n  const showControls = !exclusiveSelection || !hasSelection;\n  return (\n    // Two clusters on one line. They may wrap onto separate rows ONLY for a\n    // toolbar without `leadingControls` — one carrying search + filters is\n    // driven by a measured collapse ladder (see `useFilterOverflow`), and a\n    // wrap there is the ladder having failed: it would silently buy a second\n    // row instead of shedding a control into \"Mais\", which is the one outcome\n    // the ladder exists to prevent.\n    <Box\n      sx={{\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'space-between',\n        gap: 2,\n        flexWrap: leadingControls === undefined ? 'wrap' : 'nowrap',\n        rowGap: 1,\n      }}\n    >\n      {showSelection && (\n        <SelectionCluster\n          selectAllText={selectAllText}\n          clearAllText={clearAllText}\n          hasSelection={hasSelection}\n          selectedCount={selectedCount}\n          selectAll={selectAll}\n          clearSelection={clearSelection}\n          actions={actions}\n          selectionExtra={selectionExtra}\n          selectAllTestId={selectAllTestId}\n          clearAllTestId={clearAllTestId}\n          selectAllLabel={selectAllLabel}\n          edgeAlign={edgeAlign}\n        />\n      )}\n\n      {showControls && (\n        <BrowsingClusters\n          leadingControls={leadingControls}\n          rightControls={rightControls}\n          hasSelection={hasSelection}\n          edgeAlign={edgeAlign}\n        />\n      )}\n    </Box>\n  );\n}\n"],"mappings":"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","names":[]}