@12-apps/ui 6.39.2 → 6.39.3

package/dist/_internal/components/index.js

@@ -767,8 +767,8 @@ import "../../chunk-LKMMJKXU.js";
 import "../../chunk-CMMPGAMJ.js";
 import {
   Separator
-} from "../../chunk-IG23YZZR.js";
-import "../../chunk-D46SLMCX.js";
+} from "../../chunk-XSSCSRUX.js";
+import "../../chunk-SYNB3IIB.js";
 import {
   Avatar,
   AvatarGroup

package/dist/_internal/components/layout/Separator/Separator.js

@@ -1,7 +1,7 @@
 import {
   Separator
-} from "../../../../chunk-IG23YZZR.js";
-import "../../../../chunk-D46SLMCX.js";
+} from "../../../../chunk-XSSCSRUX.js";
+import "../../../../chunk-SYNB3IIB.js";
 import "../../../../chunk-PZBK3F52.js";
 import "../../../../chunk-YKCAJ2TN.js";
 import "../../../../chunk-PZ5AY32C.js";

package/dist/_internal/components/layout/Separator/Separator.styles.js

@@ -1,12 +1,14 @@
 import {
+  labelledSeparatorLayout,
   separatorBlockMargin,
   separatorMargin,
   separatorStyles
-} from "../../../../chunk-D46SLMCX.js";
+} from "../../../../chunk-SYNB3IIB.js";
 import "../../../../chunk-PZBK3F52.js";
 import "../../../../chunk-YKCAJ2TN.js";
 import "../../../../chunk-PZ5AY32C.js";
 export {
+  labelledSeparatorLayout,
   separatorBlockMargin,
   separatorMargin,
   separatorStyles

package/dist/_internal/components/layout/index.js

@@ -103,8 +103,8 @@ import "../../../chunk-7WDPC46N.js";
 import "../../../chunk-CMMPGAMJ.js";
 import {
   Separator
-} from "../../../chunk-IG23YZZR.js";
-import "../../../chunk-D46SLMCX.js";
+} from "../../../chunk-XSSCSRUX.js";
+import "../../../chunk-SYNB3IIB.js";
 import "../../../chunk-2GSIEDGN.js";
 import {
   Card,

package/dist/_internal/social-login-button/social-login-button.js

@@ -5,15 +5,15 @@ import {
   GoogleIcon,
   SocialLoginButton,
   SocialLoginContainer
-} from "../../chunk-3FNXOCBD.js";
+} from "../../chunk-5CQ5HYJW.js";
 import "../../chunk-INGPH3YQ.js";
 import "../../chunk-6GP2DOOO.js";
 import "../../chunk-IJFAF3A7.js";
 import "../../chunk-5JSRM7WC.js";
 import "../../chunk-LKMMJKXU.js";
 import "../../chunk-CMMPGAMJ.js";
-import "../../chunk-IG23YZZR.js";
-import "../../chunk-D46SLMCX.js";
+import "../../chunk-XSSCSRUX.js";
+import "../../chunk-SYNB3IIB.js";
 import "../../chunk-VUHLNYAE.js";
 import "../../chunk-2GSIEDGN.js";
 import "../../chunk-WN5PNP6F.js";

package/dist/{chunk-3FNXOCBD.js → chunk-5CQ5HYJW.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-IJFAF3A7.js";
 import {
   Separator
-} from "./chunk-IG23YZZR.js";
+} from "./chunk-XSSCSRUX.js";
 import {
   Card,
   CardContent
@@ -217,4 +217,4 @@ export {
   SocialLoginButton,
   SocialLoginContainer
 };
-//# sourceMappingURL=chunk-3FNXOCBD.js.map
+//# sourceMappingURL=chunk-5CQ5HYJW.js.map

package/dist/{chunk-D46SLMCX.js → chunk-SYNB3IIB.js}

@@ -70,6 +70,16 @@ var ruleLength = (theme, length) => {
   if (typeof length === "string") return length;
   return length <= 1 ? `${length * 100}%` : rem(theme, length);
 };
+var labelledSeparatorLayout = (theme, isHorizontal, length) => {
+  if (isHorizontal) return { rule: {}, group: {} };
+  if (length) return { rule: { flex: "none" }, group: {} };
+  return {
+    // A design 16px, as long as the gap beside the label at the default
+    // spacing, so a short or unsized row still shows two rules and not a word.
+    rule: { flex: "1 1 0", minHeight: rem(theme, 16) },
+    group: { alignSelf: "stretch" }
+  };
+};
 var separatorStyles = (theme, { variant, orientation, size, color, blockMargin, length }) => {
   const isHorizontal = orientation === "horizontal";
   const thicknessPx = separatorThickness(size);
@@ -100,6 +110,7 @@ var separatorStyles = (theme, { variant, orientation, size, color, blockMargin,
 export {
   separatorMargin,
   separatorBlockMargin,
+  labelledSeparatorLayout,
   separatorStyles
 };
-//# sourceMappingURL=chunk-D46SLMCX.js.map
+//# sourceMappingURL=chunk-SYNB3IIB.js.map

package/dist/chunk-SYNB3IIB.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/Separator/Separator.styles.ts"],"sourcesContent":["import type { CSSObject, Theme } from '@mui/material/styles/index.js';\n\nimport type {\n  SeparatorOrientation,\n  SeparatorProps,\n  SeparatorSize,\n  SeparatorVariant,\n} from './Separator.types';\nimport { FIELD_BORDER_WIDTH } from '../../../tokens/field-height.core';\nimport { rem } from '../../../tokens/relative';\n\nconst THICKNESS_PX: Record<SeparatorSize, number> = {\n  xs: 1,\n  sm: 2,\n  md: 3,\n  lg: 4,\n  xl: 6,\n};\n\nconst MARGIN_PX: Record<SeparatorSize, number> = {\n  xs: 4,\n  sm: 8,\n  md: 16,\n  lg: 24,\n  xl: 32,\n};\n\nconst separatorThickness = (size: SeparatorSize): number =>\n  THICKNESS_PX[size] ?? THICKNESS_PX.md;\n\n/** An explicit `margin` wins; otherwise the size picks one. */\nexport const separatorMargin = (\n  size: SeparatorSize,\n  margin?: number | string,\n): number | string => margin ?? MARGIN_PX[size] ?? MARGIN_PX.md;\n\n// `gradient` paints a background rather than a border, so it draws its line as a\n// solid border of zero visual consequence.\nconst borderStyleFor = (variant: SeparatorVariant): 'dashed' | 'dotted' | 'solid' => {\n  switch (variant) {\n    case 'dashed':\n      return 'dashed';\n    case 'dotted':\n      return 'dotted';\n    default:\n      return 'solid';\n  }\n};\n\nconst gradientBackground = (\n  variant: SeparatorVariant,\n  orientation: SeparatorOrientation,\n  color: string,\n): string | undefined => {\n  if (variant !== 'gradient') return undefined;\n  const angle = orientation === 'horizontal' ? '90deg' : '180deg';\n  return `linear-gradient(${angle}, transparent 0%, ${color} 50%, transparent 100%)`;\n};\n\n// Only the leading edge carries the rule; the other three are zeroed explicitly so\n// a parent's border shorthand cannot leak through.\nconst borderEdges = (\n  isHorizontal: boolean,\n  thickness: string,\n  style: 'dashed' | 'dotted' | 'solid',\n  color: string,\n): CSSObject => {\n  const leading = isHorizontal ? 'Top' : 'Left';\n  const blank: CSSObject = {\n    borderTopWidth: 0,\n    borderBottomWidth: 0,\n    borderLeftWidth: 0,\n    borderRightWidth: 0,\n    borderTopStyle: 'none',\n    borderBottomStyle: 'none',\n    borderLeftStyle: 'none',\n    borderRightStyle: 'none',\n    borderTopColor: 'transparent',\n    borderBottomColor: 'transparent',\n    borderLeftColor: 'transparent',\n    borderRightColor: 'transparent',\n  };\n\n  return {\n    ...blank,\n    [`border${leading}Width`]: thickness,\n    [`border${leading}Style`]: style,\n    [`border${leading}Color`]: color,\n  };\n};\n\ntype SeparatorStyleArgs = Required<\n  Pick<SeparatorProps, 'variant' | 'orientation' | 'size'>\n> &\n  Pick<SeparatorProps, 'color' | 'length'> & {\n    /** From {@link separatorBlockMargin}, which both the plain and the labelled separator read. */\n    blockMargin: string;\n  };\n\n/**\n * The separator's margin, on the axis it separates along only: above and below\n * a horizontal rule, either side of a vertical one. A margin given as a string\n * carries its own units; a number is design px, through the type scale.\n *\n * The LABELLED separator uses this too. It used to hand the number straight to\n * `sx.margin`, where a number is SPACING UNITS — `md`'s 16 drew 128px on all\n * four sides, against 16px above and below for the unlabelled one.\n */\nexport const separatorBlockMargin = (\n  theme: Theme,\n  size: SeparatorSize,\n  margin: number | string | undefined,\n  isHorizontal: boolean,\n): string => {\n  const value = separatorMargin(size, margin);\n  const length = typeof value === 'string' ? value : rem(theme, value);\n  return isHorizontal ? `${length} 0` : `0 ${length}`;\n};\n\n/**\n * The rule's extent along its axis. It lands in `sx`, which reads a number of 1\n * or less as a fraction of the parent, and that stays so; any other number is\n * design px, through the type scale. Unset (or `0`/`''`) is the full run.\n */\nconst ruleLength = (theme: Theme, length: SeparatorProps['length']): string => {\n  if (!length) return '100%';\n  if (typeof length === 'string') return length;\n  return length <= 1 ? `${length * 100}%` : rem(theme, length);\n};\n\n/**\n * What a labelled separator's rules add to {@link separatorStyles}, and whether\n * the group stretches to its parent (FUT-2617).\n *\n * A labelled VERTICAL separator is a flex COLUMN — rule, label, rule — and with\n * no `length` each rule is `height: 100%` of a column whose height is its own\n * content: both resolved to 0px and only the label showed. So the column\n * stretches to the row it sits in and the two rules split what the label\n * leaves, equally (`flex: 1 1 0`), never shorter than a visible minimum. With a\n * `length` the rule is exactly that long: no grow, no shrink, no basis, and the\n * column keeps its content height, centred as before.\n *\n * Only the labelled branch reads this. The plain separator keeps\n * `separatorStyles` as is, since `flex: 1 1 0` there would widen a vertical\n * separator sitting in a row. The horizontal rules already shrink around the\n * label in their row, so they are left alone.\n */\nexport const labelledSeparatorLayout = (\n  theme: Theme,\n  isHorizontal: boolean,\n  length: SeparatorProps['length'],\n): { rule: CSSObject; group: CSSObject } => {\n  if (isHorizontal) return { rule: {}, group: {} };\n  if (length) return { rule: { flex: 'none' }, group: {} };\n  return {\n    // A design 16px, as long as the gap beside the label at the default\n    // spacing, so a short or unsized row still shows two rules and not a word.\n    rule: { flex: '1 1 0', minHeight: rem(theme, 16) },\n    group: { alignSelf: 'stretch' },\n  };\n};\n\nexport const separatorStyles = (\n  theme: Theme,\n  { variant, orientation, size, color, blockMargin, length }: SeparatorStyleArgs,\n): CSSObject => {\n  const isHorizontal = orientation === 'horizontal';\n  // `xs` is the 1px hairline: it stays one device-independent pixel at every\n  // root size, like every other hairline in the package; heavier rules scale.\n  const thicknessPx = separatorThickness(size);\n  const thickness = thicknessPx === FIELD_BORDER_WIDTH ? `${FIELD_BORDER_WIDTH}px` : rem(theme, thicknessPx);\n  const along = ruleLength(theme, length);\n  const resolvedColor = color || theme.palette.divider;\n\n  const baseStyles: CSSObject = {\n    display: 'flex',\n    alignItems: 'center',\n    margin: blockMargin,\n    width: isHorizontal ? along : thickness,\n    height: isHorizontal ? thickness : along,\n    boxSizing: 'border-box',\n  };\n\n  if (variant === 'gradient') {\n    return {\n      ...baseStyles,\n      background: gradientBackground(variant, orientation, resolvedColor),\n    };\n  }\n\n  return {\n    ...baseStyles,\n    backgroundColor: 'transparent',\n    ...borderEdges(isHorizontal, thickness, borderStyleFor(variant), resolvedColor),\n  };\n};\n"],"mappings":"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","names":[]}

package/dist/{chunk-IG23YZZR.js → chunk-XSSCSRUX.js}

@@ -1,7 +1,8 @@
 import {
+  labelledSeparatorLayout,
   separatorBlockMargin,
   separatorStyles
-} from "./chunk-D46SLMCX.js";
+} from "./chunk-SYNB3IIB.js";
 
 // src/components/layout/Separator/Separator.tsx
 import Box from "@mui/material/Box/index.js";
@@ -24,7 +25,8 @@ var Separator = ({
   const blockMargin = separatorBlockMargin(theme, size, margin, isHorizontal);
   const styles = separatorStyles(theme, { variant, orientation, size, color, blockMargin, length });
   if (children) {
-    const ruleStyles = { ...styles, margin: 0 };
+    const layout = labelledSeparatorLayout(theme, isHorizontal, length);
+    const ruleStyles = { ...styles, margin: 0, ...layout.rule };
     return /* @__PURE__ */ jsxs(
       Box,
       {
@@ -35,7 +37,8 @@ var Separator = ({
           alignItems: "center",
           margin: blockMargin,
           flexDirection: isHorizontal ? "row" : "column",
-          gap: theme.spacing(2)
+          gap: theme.spacing(2),
+          ...layout.group
         },
         children: [
           /* @__PURE__ */ jsx(Box, { sx: ruleStyles }),
@@ -68,4 +71,4 @@ var Separator = ({
 export {
   Separator
 };
-//# sourceMappingURL=chunk-IG23YZZR.js.map
+//# sourceMappingURL=chunk-XSSCSRUX.js.map

package/dist/chunk-XSSCSRUX.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/Separator/Separator.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { useTheme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport { labelledSeparatorLayout, separatorBlockMargin, separatorStyles } from './Separator.styles';\nimport type { SeparatorProps } from './Separator.types';\n\nexport const Separator: React.FC<SeparatorProps> = ({\n  variant = 'solid',\n  orientation = 'horizontal',\n  size = 'md',\n  color,\n  margin,\n  length,\n  children,\n  className,\n  'data-testid': dataTestId,\n}) => {\n  const theme = useTheme();\n  const isHorizontal = orientation === 'horizontal';\n  const blockMargin = separatorBlockMargin(theme, size, margin, isHorizontal);\n  const styles = separatorStyles(theme, { variant, orientation, size, color, blockMargin, length });\n\n  if (children) {\n    // The rules either side of the label sit INSIDE the row, which carries the\n    // margin; their own would add it a second time.\n    const layout = labelledSeparatorLayout(theme, isHorizontal, length);\n    const ruleStyles = { ...styles, margin: 0, ...layout.rule };\n\n    return (\n      <Box\n        className={className}\n        // The plain branch below has always carried the caller's hook; this one\n        // silently dropped it, so a LABELLED separator was the one variant no\n        // test could address except through its own words.\n        data-testid={dataTestId}\n        sx={{\n          display: 'flex',\n          alignItems: 'center',\n          margin: blockMargin,\n          flexDirection: isHorizontal ? 'row' : 'column',\n          gap: theme.spacing(2),\n          ...layout.group,\n        }}\n      >\n        <Box sx={ruleStyles} />\n        {/*\n          No background behind the label. The two rules and the words are a FLEX\n          ROW — the rules stop where the label starts — so there is nothing for a\n          background to mask, and painting one made the label a coloured pill on\n          every surface that is not `background.default`. On a white card it read\n          as a highlight nobody had asked for.\n        */}\n        <Typography\n          variant=\"body2\"\n          color=\"text.secondary\"\n          sx={{ flexShrink: 0, padding: theme.spacing(0, 1) }}\n        >\n          {children}\n        </Typography>\n        <Box sx={ruleStyles} />\n      </Box>\n    );\n  }\n\n  return (\n    <Box\n      className={className}\n      sx={styles}\n      role=\"separator\"\n      aria-orientation={orientation}\n      data-testid={dataTestId}\n    />\n  );\n};\n"],"mappings":";;;;;;;AAAA,OAAO,SAAS;AAChB,OAAO,gBAAgB;AACvB,SAAS,gBAAgB;AA6BnB,SAeE,KAfF;AAvBC,IAAM,YAAsC,CAAC;AAAA,EAClD,UAAU;AAAA,EACV,cAAc;AAAA,EACd,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AACjB,MAAM;AACJ,QAAM,QAAQ,SAAS;AACvB,QAAM,eAAe,gBAAgB;AACrC,QAAM,cAAc,qBAAqB,OAAO,MAAM,QAAQ,YAAY;AAC1E,QAAM,SAAS,gBAAgB,OAAO,EAAE,SAAS,aAAa,MAAM,OAAO,aAAa,OAAO,CAAC;AAEhG,MAAI,UAAU;AAGZ,UAAM,SAAS,wBAAwB,OAAO,cAAc,MAAM;AAClE,UAAM,aAAa,EAAE,GAAG,QAAQ,QAAQ,GAAG,GAAG,OAAO,KAAK;AAE1D,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QAIA,eAAa;AAAA,QACb,IAAI;AAAA,UACF,SAAS;AAAA,UACT,YAAY;AAAA,UACZ,QAAQ;AAAA,UACR,eAAe,eAAe,QAAQ;AAAA,UACtC,KAAK,MAAM,QAAQ,CAAC;AAAA,UACpB,GAAG,OAAO;AAAA,QACZ;AAAA,QAEA;AAAA,8BAAC,OAAI,IAAI,YAAY;AAAA,UAQrB;AAAA,YAAC;AAAA;AAAA,cACC,SAAQ;AAAA,cACR,OAAM;AAAA,cACN,IAAI,EAAE,YAAY,GAAG,SAAS,MAAM,QAAQ,GAAG,CAAC,EAAE;AAAA,cAEjD;AAAA;AAAA,UACH;AAAA,UACA,oBAAC,OAAI,IAAI,YAAY;AAAA;AAAA;AAAA,IACvB;AAAA,EAEJ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,IAAI;AAAA,MACJ,MAAK;AAAA,MACL,oBAAkB;AAAA,MAClB,eAAa;AAAA;AAAA,EACf;AAEJ;","names":[]}

package/dist/layout/Separator.js

@@ -1,8 +1,8 @@
 import "../chunk-CMMPGAMJ.js";
 import {
   Separator
-} from "../chunk-IG23YZZR.js";
-import "../chunk-D46SLMCX.js";
+} from "../chunk-XSSCSRUX.js";
+import "../chunk-SYNB3IIB.js";
 import "../chunk-PZBK3F52.js";
 import "../chunk-YKCAJ2TN.js";
 import "../chunk-PZ5AY32C.js";

package/dist/social-login-button.js

@@ -4,15 +4,15 @@ import {
   GoogleIcon,
   SocialLoginButton,
   SocialLoginContainer
-} from "./chunk-3FNXOCBD.js";
+} from "./chunk-5CQ5HYJW.js";
 import "./chunk-INGPH3YQ.js";
 import "./chunk-6GP2DOOO.js";
 import "./chunk-IJFAF3A7.js";
 import "./chunk-5JSRM7WC.js";
 import "./chunk-LKMMJKXU.js";
 import "./chunk-CMMPGAMJ.js";
-import "./chunk-IG23YZZR.js";
-import "./chunk-D46SLMCX.js";
+import "./chunk-XSSCSRUX.js";
+import "./chunk-SYNB3IIB.js";
 import "./chunk-VUHLNYAE.js";
 import "./chunk-2GSIEDGN.js";
 import "./chunk-WN5PNP6F.js";

package/dist/types/components/layout/Separator/Separator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Separator.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/Separator/Separator.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAExD,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAiE9C,CAAC"}
+{"version":3,"file":"Separator.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/Separator/Separator.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAExD,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAmE9C,CAAC"}

package/dist/types/components/layout/Separator/Separator.styles.d.ts

@@ -16,6 +16,27 @@ type SeparatorStyleArgs = Required<Pick<SeparatorProps, 'variant' | 'orientation
  * four sides, against 16px above and below for the unlabelled one.
  */
 export declare const separatorBlockMargin: (theme: Theme, size: SeparatorSize, margin: number | string | undefined, isHorizontal: boolean) => string;
+/**
+ * What a labelled separator's rules add to {@link separatorStyles}, and whether
+ * the group stretches to its parent (FUT-2617).
+ *
+ * A labelled VERTICAL separator is a flex COLUMN — rule, label, rule — and with
+ * no `length` each rule is `height: 100%` of a column whose height is its own
+ * content: both resolved to 0px and only the label showed. So the column
+ * stretches to the row it sits in and the two rules split what the label
+ * leaves, equally (`flex: 1 1 0`), never shorter than a visible minimum. With a
+ * `length` the rule is exactly that long: no grow, no shrink, no basis, and the
+ * column keeps its content height, centred as before.
+ *
+ * Only the labelled branch reads this. The plain separator keeps
+ * `separatorStyles` as is, since `flex: 1 1 0` there would widen a vertical
+ * separator sitting in a row. The horizontal rules already shrink around the
+ * label in their row, so they are left alone.
+ */
+export declare const labelledSeparatorLayout: (theme: Theme, isHorizontal: boolean, length: SeparatorProps["length"]) => {
+    rule: CSSObject;
+    group: CSSObject;
+};
 export declare const separatorStyles: (theme: Theme, { variant, orientation, size, color, blockMargin, length }: SeparatorStyleArgs) => CSSObject;
 export {};
 //# sourceMappingURL=Separator.styles.d.ts.map

package/dist/types/components/layout/Separator/Separator.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Separator.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/Separator/Separator.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC;AAEtE,OAAO,KAAK,EAEV,cAAc,EACd,aAAa,EAEd,MAAM,mBAAmB,CAAC;AAuB3B,+DAA+D;AAC/D,eAAO,MAAM,eAAe,GAC1B,MAAM,aAAa,EACnB,SAAS,MAAM,GAAG,MAAM,KACvB,MAAM,GAAG,MAAmD,CAAC;AAyDhE,KAAK,kBAAkB,GAAG,QAAQ,CAChC,IAAI,CAAC,cAAc,EAAE,SAAS,GAAG,aAAa,GAAG,MAAM,CAAC,CACzD,GACC,IAAI,CAAC,cAAc,EAAE,OAAO,GAAG,QAAQ,CAAC,GAAG;IACzC,+FAA+F;IAC/F,WAAW,EAAE,MAAM,CAAC;CACrB,CAAC;AAEJ;;;;;;;;GAQG;AACH,eAAO,MAAM,oBAAoB,GAC/B,OAAO,KAAK,EACZ,MAAM,aAAa,EACnB,QAAQ,MAAM,GAAG,MAAM,GAAG,SAAS,EACnC,cAAc,OAAO,KACpB,MAIF,CAAC;AAaF,eAAO,MAAM,eAAe,GAC1B,OAAO,KAAK,EACZ,4DAA4D,kBAAkB,KAC7E,SA8BF,CAAC"}
+{"version":3,"file":"Separator.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/Separator/Separator.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC;AAEtE,OAAO,KAAK,EAEV,cAAc,EACd,aAAa,EAEd,MAAM,mBAAmB,CAAC;AAuB3B,+DAA+D;AAC/D,eAAO,MAAM,eAAe,GAC1B,MAAM,aAAa,EACnB,SAAS,MAAM,GAAG,MAAM,KACvB,MAAM,GAAG,MAAmD,CAAC;AAyDhE,KAAK,kBAAkB,GAAG,QAAQ,CAChC,IAAI,CAAC,cAAc,EAAE,SAAS,GAAG,aAAa,GAAG,MAAM,CAAC,CACzD,GACC,IAAI,CAAC,cAAc,EAAE,OAAO,GAAG,QAAQ,CAAC,GAAG;IACzC,+FAA+F;IAC/F,WAAW,EAAE,MAAM,CAAC;CACrB,CAAC;AAEJ;;;;;;;;GAQG;AACH,eAAO,MAAM,oBAAoB,GAC/B,OAAO,KAAK,EACZ,MAAM,aAAa,EACnB,QAAQ,MAAM,GAAG,MAAM,GAAG,SAAS,EACnC,cAAc,OAAO,KACpB,MAIF,CAAC;AAaF;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,uBAAuB,GAClC,OAAO,KAAK,EACZ,cAAc,OAAO,EACrB,QAAQ,cAAc,CAAC,QAAQ,CAAC,KAC/B;IAAE,IAAI,EAAE,SAAS,CAAC;IAAC,KAAK,EAAE,SAAS,CAAA;CASrC,CAAC;AAEF,eAAO,MAAM,eAAe,GAC1B,OAAO,KAAK,EACZ,4DAA4D,kBAAkB,KAC7E,SA8BF,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@12-apps/ui",
-  "version": "6.39.2",
+  "version": "6.39.3",
   "license": "MIT",
   "packageManager": "pnpm@10.34.5",
   "type": "module",

package/src/components/layout/Separator/Separator.styles.ts

@@ -128,6 +128,38 @@ const ruleLength = (theme: Theme, length: SeparatorProps['length']): string => {
   return length <= 1 ? `${length * 100}%` : rem(theme, length);
 };
 
+/**
+ * What a labelled separator's rules add to {@link separatorStyles}, and whether
+ * the group stretches to its parent (FUT-2617).
+ *
+ * A labelled VERTICAL separator is a flex COLUMN — rule, label, rule — and with
+ * no `length` each rule is `height: 100%` of a column whose height is its own
+ * content: both resolved to 0px and only the label showed. So the column
+ * stretches to the row it sits in and the two rules split what the label
+ * leaves, equally (`flex: 1 1 0`), never shorter than a visible minimum. With a
+ * `length` the rule is exactly that long: no grow, no shrink, no basis, and the
+ * column keeps its content height, centred as before.
+ *
+ * Only the labelled branch reads this. The plain separator keeps
+ * `separatorStyles` as is, since `flex: 1 1 0` there would widen a vertical
+ * separator sitting in a row. The horizontal rules already shrink around the
+ * label in their row, so they are left alone.
+ */
+export const labelledSeparatorLayout = (
+  theme: Theme,
+  isHorizontal: boolean,
+  length: SeparatorProps['length'],
+): { rule: CSSObject; group: CSSObject } => {
+  if (isHorizontal) return { rule: {}, group: {} };
+  if (length) return { rule: { flex: 'none' }, group: {} };
+  return {
+    // A design 16px, as long as the gap beside the label at the default
+    // spacing, so a short or unsized row still shows two rules and not a word.
+    rule: { flex: '1 1 0', minHeight: rem(theme, 16) },
+    group: { alignSelf: 'stretch' },
+  };
+};
+
 export const separatorStyles = (
   theme: Theme,
   { variant, orientation, size, color, blockMargin, length }: SeparatorStyleArgs,

package/src/components/layout/Separator/Separator.tsx

@@ -3,7 +3,7 @@ import Typography from '@mui/material/Typography/index.js';
 import { useTheme } from '@mui/material/styles/index.js';
 import React from 'react';
 
-import { separatorBlockMargin, separatorStyles } from './Separator.styles';
+import { labelledSeparatorLayout, separatorBlockMargin, separatorStyles } from './Separator.styles';
 import type { SeparatorProps } from './Separator.types';
 
 export const Separator: React.FC<SeparatorProps> = ({
@@ -25,7 +25,8 @@ export const Separator: React.FC<SeparatorProps> = ({
   if (children) {
     // The rules either side of the label sit INSIDE the row, which carries the
     // margin; their own would add it a second time.
-    const ruleStyles = { ...styles, margin: 0 };
+    const layout = labelledSeparatorLayout(theme, isHorizontal, length);
+    const ruleStyles = { ...styles, margin: 0, ...layout.rule };
 
     return (
       <Box
@@ -40,6 +41,7 @@ export const Separator: React.FC<SeparatorProps> = ({
           margin: blockMargin,
           flexDirection: isHorizontal ? 'row' : 'column',
           gap: theme.spacing(2),
+          ...layout.group,
         }}
       >
         <Box sx={ruleStyles} />

package/dist/chunk-D46SLMCX.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/layout/Separator/Separator.styles.ts"],"sourcesContent":["import type { CSSObject, Theme } from '@mui/material/styles/index.js';\n\nimport type {\n  SeparatorOrientation,\n  SeparatorProps,\n  SeparatorSize,\n  SeparatorVariant,\n} from './Separator.types';\nimport { FIELD_BORDER_WIDTH } from '../../../tokens/field-height.core';\nimport { rem } from '../../../tokens/relative';\n\nconst THICKNESS_PX: Record<SeparatorSize, number> = {\n  xs: 1,\n  sm: 2,\n  md: 3,\n  lg: 4,\n  xl: 6,\n};\n\nconst MARGIN_PX: Record<SeparatorSize, number> = {\n  xs: 4,\n  sm: 8,\n  md: 16,\n  lg: 24,\n  xl: 32,\n};\n\nconst separatorThickness = (size: SeparatorSize): number =>\n  THICKNESS_PX[size] ?? THICKNESS_PX.md;\n\n/** An explicit `margin` wins; otherwise the size picks one. */\nexport const separatorMargin = (\n  size: SeparatorSize,\n  margin?: number | string,\n): number | string => margin ?? MARGIN_PX[size] ?? MARGIN_PX.md;\n\n// `gradient` paints a background rather than a border, so it draws its line as a\n// solid border of zero visual consequence.\nconst borderStyleFor = (variant: SeparatorVariant): 'dashed' | 'dotted' | 'solid' => {\n  switch (variant) {\n    case 'dashed':\n      return 'dashed';\n    case 'dotted':\n      return 'dotted';\n    default:\n      return 'solid';\n  }\n};\n\nconst gradientBackground = (\n  variant: SeparatorVariant,\n  orientation: SeparatorOrientation,\n  color: string,\n): string | undefined => {\n  if (variant !== 'gradient') return undefined;\n  const angle = orientation === 'horizontal' ? '90deg' : '180deg';\n  return `linear-gradient(${angle}, transparent 0%, ${color} 50%, transparent 100%)`;\n};\n\n// Only the leading edge carries the rule; the other three are zeroed explicitly so\n// a parent's border shorthand cannot leak through.\nconst borderEdges = (\n  isHorizontal: boolean,\n  thickness: string,\n  style: 'dashed' | 'dotted' | 'solid',\n  color: string,\n): CSSObject => {\n  const leading = isHorizontal ? 'Top' : 'Left';\n  const blank: CSSObject = {\n    borderTopWidth: 0,\n    borderBottomWidth: 0,\n    borderLeftWidth: 0,\n    borderRightWidth: 0,\n    borderTopStyle: 'none',\n    borderBottomStyle: 'none',\n    borderLeftStyle: 'none',\n    borderRightStyle: 'none',\n    borderTopColor: 'transparent',\n    borderBottomColor: 'transparent',\n    borderLeftColor: 'transparent',\n    borderRightColor: 'transparent',\n  };\n\n  return {\n    ...blank,\n    [`border${leading}Width`]: thickness,\n    [`border${leading}Style`]: style,\n    [`border${leading}Color`]: color,\n  };\n};\n\ntype SeparatorStyleArgs = Required<\n  Pick<SeparatorProps, 'variant' | 'orientation' | 'size'>\n> &\n  Pick<SeparatorProps, 'color' | 'length'> & {\n    /** From {@link separatorBlockMargin}, which both the plain and the labelled separator read. */\n    blockMargin: string;\n  };\n\n/**\n * The separator's margin, on the axis it separates along only: above and below\n * a horizontal rule, either side of a vertical one. A margin given as a string\n * carries its own units; a number is design px, through the type scale.\n *\n * The LABELLED separator uses this too. It used to hand the number straight to\n * `sx.margin`, where a number is SPACING UNITS — `md`'s 16 drew 128px on all\n * four sides, against 16px above and below for the unlabelled one.\n */\nexport const separatorBlockMargin = (\n  theme: Theme,\n  size: SeparatorSize,\n  margin: number | string | undefined,\n  isHorizontal: boolean,\n): string => {\n  const value = separatorMargin(size, margin);\n  const length = typeof value === 'string' ? value : rem(theme, value);\n  return isHorizontal ? `${length} 0` : `0 ${length}`;\n};\n\n/**\n * The rule's extent along its axis. It lands in `sx`, which reads a number of 1\n * or less as a fraction of the parent, and that stays so; any other number is\n * design px, through the type scale. Unset (or `0`/`''`) is the full run.\n */\nconst ruleLength = (theme: Theme, length: SeparatorProps['length']): string => {\n  if (!length) return '100%';\n  if (typeof length === 'string') return length;\n  return length <= 1 ? `${length * 100}%` : rem(theme, length);\n};\n\nexport const separatorStyles = (\n  theme: Theme,\n  { variant, orientation, size, color, blockMargin, length }: SeparatorStyleArgs,\n): CSSObject => {\n  const isHorizontal = orientation === 'horizontal';\n  // `xs` is the 1px hairline: it stays one device-independent pixel at every\n  // root size, like every other hairline in the package; heavier rules scale.\n  const thicknessPx = separatorThickness(size);\n  const thickness = thicknessPx === FIELD_BORDER_WIDTH ? `${FIELD_BORDER_WIDTH}px` : rem(theme, thicknessPx);\n  const along = ruleLength(theme, length);\n  const resolvedColor = color || theme.palette.divider;\n\n  const baseStyles: CSSObject = {\n    display: 'flex',\n    alignItems: 'center',\n    margin: blockMargin,\n    width: isHorizontal ? along : thickness,\n    height: isHorizontal ? thickness : along,\n    boxSizing: 'border-box',\n  };\n\n  if (variant === 'gradient') {\n    return {\n      ...baseStyles,\n      background: gradientBackground(variant, orientation, resolvedColor),\n    };\n  }\n\n  return {\n    ...baseStyles,\n    backgroundColor: 'transparent',\n    ...borderEdges(isHorizontal, thickness, borderStyleFor(variant), resolvedColor),\n  };\n};\n"],"mappings":";;;;;;;;AAWA,IAAM,eAA8C;AAAA,EAClD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,IAAM,YAA2C;AAAA,EAC/C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,IAAM,qBAAqB,CAAC,SAC1B,aAAa,IAAI,KAAK,aAAa;AAG9B,IAAM,kBAAkB,CAC7B,MACA,WACoB,UAAU,UAAU,IAAI,KAAK,UAAU;AAI7D,IAAM,iBAAiB,CAAC,YAA6D;AACnF,UAAQ,SAAS;AAAA,IACf,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT;AACE,aAAO;AAAA,EACX;AACF;AAEA,IAAM,qBAAqB,CACzB,SACA,aACA,UACuB;AACvB,MAAI,YAAY,WAAY,QAAO;AACnC,QAAM,QAAQ,gBAAgB,eAAe,UAAU;AACvD,SAAO,mBAAmB,KAAK,qBAAqB,KAAK;AAC3D;AAIA,IAAM,cAAc,CAClB,cACA,WACA,OACA,UACc;AACd,QAAM,UAAU,eAAe,QAAQ;AACvC,QAAM,QAAmB;AAAA,IACvB,gBAAgB;AAAA,IAChB,mBAAmB;AAAA,IACnB,iBAAiB;AAAA,IACjB,kBAAkB;AAAA,IAClB,gBAAgB;AAAA,IAChB,mBAAmB;AAAA,IACnB,iBAAiB;AAAA,IACjB,kBAAkB;AAAA,IAClB,gBAAgB;AAAA,IAChB,mBAAmB;AAAA,IACnB,iBAAiB;AAAA,IACjB,kBAAkB;AAAA,EACpB;AAEA,SAAO;AAAA,IACL,GAAG;AAAA,IACH,CAAC,SAAS,OAAO,OAAO,GAAG;AAAA,IAC3B,CAAC,SAAS,OAAO,OAAO,GAAG;AAAA,IAC3B,CAAC,SAAS,OAAO,OAAO,GAAG;AAAA,EAC7B;AACF;AAmBO,IAAM,uBAAuB,CAClC,OACA,MACA,QACA,iBACW;AACX,QAAM,QAAQ,gBAAgB,MAAM,MAAM;AAC1C,QAAM,SAAS,OAAO,UAAU,WAAW,QAAQ,IAAI,OAAO,KAAK;AACnE,SAAO,eAAe,GAAG,MAAM,OAAO,KAAK,MAAM;AACnD;AAOA,IAAM,aAAa,CAAC,OAAc,WAA6C;AAC7E,MAAI,CAAC,OAAQ,QAAO;AACpB,MAAI,OAAO,WAAW,SAAU,QAAO;AACvC,SAAO,UAAU,IAAI,GAAG,SAAS,GAAG,MAAM,IAAI,OAAO,MAAM;AAC7D;AAEO,IAAM,kBAAkB,CAC7B,OACA,EAAE,SAAS,aAAa,MAAM,OAAO,aAAa,OAAO,MAC3C;AACd,QAAM,eAAe,gBAAgB;AAGrC,QAAM,cAAc,mBAAmB,IAAI;AAC3C,QAAM,YAAY,gBAAgB,qBAAqB,GAAG,kBAAkB,OAAO,IAAI,OAAO,WAAW;AACzG,QAAM,QAAQ,WAAW,OAAO,MAAM;AACtC,QAAM,gBAAgB,SAAS,MAAM,QAAQ;AAE7C,QAAM,aAAwB;AAAA,IAC5B,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR,OAAO,eAAe,QAAQ;AAAA,IAC9B,QAAQ,eAAe,YAAY;AAAA,IACnC,WAAW;AAAA,EACb;AAEA,MAAI,YAAY,YAAY;AAC1B,WAAO;AAAA,MACL,GAAG;AAAA,MACH,YAAY,mBAAmB,SAAS,aAAa,aAAa;AAAA,IACpE;AAAA,EACF;AAEA,SAAO;AAAA,IACL,GAAG;AAAA,IACH,iBAAiB;AAAA,IACjB,GAAG,YAAY,cAAc,WAAW,eAAe,OAAO,GAAG,aAAa;AAAA,EAChF;AACF;","names":[]}

package/dist/chunk-IG23YZZR.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/layout/Separator/Separator.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { useTheme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport { separatorBlockMargin, separatorStyles } from './Separator.styles';\nimport type { SeparatorProps } from './Separator.types';\n\nexport const Separator: React.FC<SeparatorProps> = ({\n  variant = 'solid',\n  orientation = 'horizontal',\n  size = 'md',\n  color,\n  margin,\n  length,\n  children,\n  className,\n  'data-testid': dataTestId,\n}) => {\n  const theme = useTheme();\n  const isHorizontal = orientation === 'horizontal';\n  const blockMargin = separatorBlockMargin(theme, size, margin, isHorizontal);\n  const styles = separatorStyles(theme, { variant, orientation, size, color, blockMargin, length });\n\n  if (children) {\n    // The rules either side of the label sit INSIDE the row, which carries the\n    // margin; their own would add it a second time.\n    const ruleStyles = { ...styles, margin: 0 };\n\n    return (\n      <Box\n        className={className}\n        // The plain branch below has always carried the caller's hook; this one\n        // silently dropped it, so a LABELLED separator was the one variant no\n        // test could address except through its own words.\n        data-testid={dataTestId}\n        sx={{\n          display: 'flex',\n          alignItems: 'center',\n          margin: blockMargin,\n          flexDirection: isHorizontal ? 'row' : 'column',\n          gap: theme.spacing(2),\n        }}\n      >\n        <Box sx={ruleStyles} />\n        {/*\n          No background behind the label. The two rules and the words are a FLEX\n          ROW — the rules stop where the label starts — so there is nothing for a\n          background to mask, and painting one made the label a coloured pill on\n          every surface that is not `background.default`. On a white card it read\n          as a highlight nobody had asked for.\n        */}\n        <Typography\n          variant=\"body2\"\n          color=\"text.secondary\"\n          sx={{ flexShrink: 0, padding: theme.spacing(0, 1) }}\n        >\n          {children}\n        </Typography>\n        <Box sx={ruleStyles} />\n      </Box>\n    );\n  }\n\n  return (\n    <Box\n      className={className}\n      sx={styles}\n      role=\"separator\"\n      aria-orientation={orientation}\n      data-testid={dataTestId}\n    />\n  );\n};\n"],"mappings":";;;;;;AAAA,OAAO,SAAS;AAChB,OAAO,gBAAgB;AACvB,SAAS,gBAAgB;AA4BnB,SAcE,KAdF;AAtBC,IAAM,YAAsC,CAAC;AAAA,EAClD,UAAU;AAAA,EACV,cAAc;AAAA,EACd,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AACjB,MAAM;AACJ,QAAM,QAAQ,SAAS;AACvB,QAAM,eAAe,gBAAgB;AACrC,QAAM,cAAc,qBAAqB,OAAO,MAAM,QAAQ,YAAY;AAC1E,QAAM,SAAS,gBAAgB,OAAO,EAAE,SAAS,aAAa,MAAM,OAAO,aAAa,OAAO,CAAC;AAEhG,MAAI,UAAU;AAGZ,UAAM,aAAa,EAAE,GAAG,QAAQ,QAAQ,EAAE;AAE1C,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QAIA,eAAa;AAAA,QACb,IAAI;AAAA,UACF,SAAS;AAAA,UACT,YAAY;AAAA,UACZ,QAAQ;AAAA,UACR,eAAe,eAAe,QAAQ;AAAA,UACtC,KAAK,MAAM,QAAQ,CAAC;AAAA,QACtB;AAAA,QAEA;AAAA,8BAAC,OAAI,IAAI,YAAY;AAAA,UAQrB;AAAA,YAAC;AAAA;AAAA,cACC,SAAQ;AAAA,cACR,OAAM;AAAA,cACN,IAAI,EAAE,YAAY,GAAG,SAAS,MAAM,QAAQ,GAAG,CAAC,EAAE;AAAA,cAEjD;AAAA;AAAA,UACH;AAAA,UACA,oBAAC,OAAI,IAAI,YAAY;AAAA;AAAA;AAAA,IACvB;AAAA,EAEJ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,IAAI;AAAA,MACJ,MAAK;AAAA,MACL,oBAAkB;AAAA,MAClB,eAAa;AAAA;AAAA,EACf;AAEJ;","names":[]}