@imfusion/web-ui 0.10.1-dev.59.gdb86c93c → 0.10.1-dev.60.g7891a716

package/CHANGELOG.md

@@ -65,6 +65,7 @@ never changes the character width, so columns stay aligned. CoFo Sans Mono still
 - `imf-web-ui-update` proposes and `imf-web-ui-audit` reports aligning the core runtime packages (React, Base UI, Vite+) with the versions Web UI builds with. — Nikolaus Brunner <brunner@imfusion.com>
 - `localWebUILink()` and a `paths` block in `tsconfig.json` let an app run against a symlinked web-ui checkout with one React and one set of types. `imf-web-ui-setup` proposes both and `imf-web-ui-audit` reports a missing one. — Nikolaus Brunner <brunner@imfusion.com>
 - The shell's navigation toggle sets `aria-controls` from the navbar, and reads the `id` the navbar generates. A consumer `id` on the Navbar is what it points at. — Nikolaus Brunner <brunner@imfusion.com>
+- `Separator` takes `tone="minor"` for a neutral line, a quiet break inside a page; the default stays primary. — Nikolaus Brunner <brunner@imfusion.com>
 - `Select.ItemDescription` sets a muted second line under an item's text, such as what a role allows; the trigger shows only the item text, and the list keeps the trigger's width so descriptions wrap. — Nikolaus Brunner <brunner@imfusion.com>
 - `Table.Root` takes `density` (`compact`, `comfortable`, `spacious`) for the cell padding. — Nikolaus Brunner <brunner@imfusion.com>
 - `Table.HeaderCell` and `Table.Cell` take `action` for a column of buttons: it shrinks to its content, so the data columns keep the width. — Nikolaus Brunner <brunner@imfusion.com>

package/dist/components/separator/separator.d.ts

@@ -2,14 +2,16 @@ import { Separator as SeparatorPrimitive } from '@base-ui/react/separator';
 import { VariantProps } from 'class-variance-authority';
 declare const separator: (props?: ({
     variant?: "solid" | "dashed" | "dotted" | null | undefined;
+    tone?: "minor" | "primary" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 interface Props extends React.ComponentProps<typeof SeparatorPrimitive>, VariantProps<typeof separator> {
 }
 /**
- * Separator — visual divider between content sections.
+ * Separator — visual divider between content sections. `tone="minor"` draws a neutral line for a quiet break inside a
+ * page; the default primary line marks a stronger division.
  *
  * @see https://base-ui.com/react/components/separator
  * @llm https://base-ui.com/react/components/separator.md
  */
-export declare function Separator({ orientation, variant, ...props }: Props): import("react/jsx-runtime").JSX.Element;
+export declare function Separator({ orientation, variant, tone, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/index.js

@@ -5,7 +5,7 @@ import { _ as le, c as ue, f as de, g as fe, h as pe, l as me, m as he, p as ge,
 import { a as ve, o as ye, r as be, t as xe } from "./code-NTcddiYk.js";
 import { c as Se } from "./slider-Bf274cMe.js";
 import { a as Ce, c as we, i as Te, n as Ee, o as De, r as Oe, s as ke, t as Ae } from "./scroll-area-z9Lf9uIk.js";
-import { t as je } from "./separator-lzz4A3x_.js";
+import { t as je } from "./separator-BV2TR8U0.js";
 import { Button as Me } from "@base-ui/react/button";
 import { cva as Ne, cva as g, cx as Pe, cx as _ } from "class-variance-authority";
 import { Fragment as v, jsx as y, jsxs as b } from "react/jsx-runtime";

package/dist/integrations/frame-selection.js

@@ -1,6 +1,6 @@
 import { t as e } from "../meta-V_KyLeGn.js";
 import { a as t, i as n, o as r, t as i } from "../slider-Bf274cMe.js";
-import { t as a } from "../separator-lzz4A3x_.js";
+import { t as a } from "../separator-BV2TR8U0.js";
 import { cva as o } from "class-variance-authority";
 import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
 import { useEffect as u, useMemo as d, useState as f } from "react";

package/dist/{separator-lzz4A3x_.js → separator-BV2TR8U0.js}

@@ -3,22 +3,30 @@ import { jsx as t } from "react/jsx-runtime";
 import { Separator as n } from "@base-ui/react/separator";
 var r = {
 	root: "imf-ui-separator-module-root",
+	toneMinor: "imf-ui-separator-module-toneMinor",
 	variantDashed: "imf-ui-separator-module-variantDashed",
 	variantDotted: "imf-ui-separator-module-variantDotted",
 	variantSolid: "imf-ui-separator-module-variantSolid"
-}, i = e(r.root, { variants: { variant: {
-	solid: r.variantSolid,
-	dashed: r.variantDashed,
-	dotted: r.variantDotted
-} } });
-function a({ orientation: e = "horizontal", variant: r = "solid", ...a }) {
+}, i = e(r.root, { variants: {
+	variant: {
+		solid: r.variantSolid,
+		dashed: r.variantDashed,
+		dotted: r.variantDotted
+	},
+	tone: {
+		primary: null,
+		minor: r.toneMinor
+	}
+} });
+function a({ orientation: e = "horizontal", variant: r = "solid", tone: a = "primary", ...o }) {
 	return /* @__PURE__ */ t(n, {
-		...a,
+		...o,
 		orientation: e,
 		"data-imf-ui-component": "Separator",
 		className: i({
 			variant: r,
-			className: a.className
+			tone: a,
+			className: o.className
 		})
 	});
 }