@imfusion/web-ui 0.11.1-dev.5.g8a97f4f6 → 0.11.1-dev.53.g43897e72

package/dist/icon-button-roSB497o.js

@@ -0,0 +1,171 @@
+import { _M as e } from "./icons-vc1WZCxX.js";
+import { t } from "./meta-V_KyLeGn.js";
+import { a as n, r } from "./toggle-group-eGr6_hgQ.js";
+import { a as i } from "./utils-J6vbjIt1.js";
+import { Button as a } from "@base-ui/react/button";
+import { cva as o } from "class-variance-authority";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+var l = {
+	chamfer: "imf-ui-button-module-chamfer",
+	contextOncolor: "imf-ui-button-module-contextOncolor",
+	endIcon: "imf-ui-button-module-endIcon",
+	justifySpread: "imf-ui-button-module-justifySpread",
+	label: "imf-ui-button-module-label",
+	radiusLg: "imf-ui-button-module-radiusLg",
+	radiusMd: "imf-ui-button-module-radiusMd",
+	radiusRound: "imf-ui-button-module-radiusRound",
+	radiusSm: "imf-ui-button-module-radiusSm",
+	root: "imf-ui-button-module-root",
+	shortcut: "imf-ui-button-module-shortcut",
+	sizeHero: "imf-ui-button-module-sizeHero",
+	sizeLg: "imf-ui-button-module-sizeLg",
+	sizeMd: "imf-ui-button-module-sizeMd",
+	sizeSm: "imf-ui-button-module-sizeSm",
+	startIcon: "imf-ui-button-module-startIcon",
+	variantGhost: "imf-ui-button-module-variantGhost",
+	variantNegative: "imf-ui-button-module-variantNegative",
+	variantOutline: "imf-ui-button-module-variantOutline",
+	variantPositive: "imf-ui-button-module-variantPositive",
+	variantPrimary: "imf-ui-button-module-variantPrimary",
+	variantSecondary: "imf-ui-button-module-variantSecondary"
+}, u = o(l.root, { variants: {
+	variant: {
+		primary: l.variantPrimary,
+		secondary: l.variantSecondary,
+		positive: l.variantPositive,
+		negative: l.variantNegative,
+		outline: l.variantOutline,
+		ghost: l.variantGhost
+	},
+	size: {
+		sm: l.sizeSm,
+		md: l.sizeMd,
+		lg: l.sizeLg,
+		hero: l.sizeHero
+	},
+	chamfer: {
+		false: null,
+		true: l.chamfer
+	},
+	radius: {
+		none: null,
+		sm: l.radiusSm,
+		md: l.radiusMd,
+		lg: l.radiusLg,
+		round: l.radiusRound
+	},
+	context: {
+		default: null,
+		oncolor: l.contextOncolor
+	},
+	justify: {
+		center: null,
+		spread: l.justifySpread
+	}
+} });
+function d({ variant: e = "primary", size: t = "md", context: o = "default", chamfer: d = t === "hero", radius: f = "none", justify: p = "center", startIcon: m, endIcon: h, shortcut: g, children: _, ...v }) {
+	return /* @__PURE__ */ c(a, {
+		"aria-keyshortcuts": g ? r(g) : void 0,
+		...v,
+		"data-imf-ui-component": "Button",
+		className: (n) => u({
+			variant: e,
+			size: t,
+			chamfer: d,
+			radius: f,
+			context: o,
+			justify: p,
+			className: i(v.className, n)
+		}),
+		children: [
+			m != null && /* @__PURE__ */ s("span", {
+				className: l.startIcon,
+				"aria-hidden": !0,
+				children: m
+			}),
+			/* @__PURE__ */ s("span", {
+				className: l.label,
+				children: _
+			}),
+			h != null && /* @__PURE__ */ s("span", {
+				className: l.endIcon,
+				"aria-hidden": !0,
+				children: h
+			}),
+			g && /* @__PURE__ */ s(n, {
+				variant: "flat",
+				className: l.shortcut,
+				"aria-hidden": !0,
+				children: g
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/button/button.meta.ts
+var f = {
+	name: "Button",
+	category: t.buttons,
+	status: "stable",
+	description: "Triggers an action such as submit, confirm, cancel, navigate, or delete. Also called a CTA or action button; variants and sizes communicate its importance.",
+	origin: "adapted",
+	internalDependencies: ["Kbd"],
+	upstream: {
+		name: "Base UI",
+		websiteLink: "https://base-ui.com/",
+		docLink: "https://base-ui.com/react/components/button",
+		llmDocLink: "https://base-ui.com/react/components/button.md"
+	}
+}, p = {
+	root: "imf-ui-icon-button-module-root",
+	sizeHero: "imf-ui-icon-button-module-sizeHero",
+	sizeLg: "imf-ui-icon-button-module-sizeLg",
+	sizeMd: "imf-ui-icon-button-module-sizeMd",
+	sizeSm: "imf-ui-icon-button-module-sizeSm"
+}, m = o(p.root, { variants: { size: {
+	sm: p.sizeSm,
+	md: p.sizeMd,
+	lg: p.sizeLg,
+	hero: p.sizeHero
+} } }), h = {
+	sm: 15,
+	md: 18,
+	lg: 20,
+	hero: 24
+}, g = {
+	sm: "md",
+	md: "lg",
+	lg: "hero",
+	hero: "hero"
+};
+function _({ glyph: t, label: n, iconProps: r, size: a = "md", ...o }) {
+	let c = a ?? "md", l = o.shortcut ? g[c] : c;
+	return /* @__PURE__ */ s(d, {
+		...o,
+		size: c,
+		"aria-label": n,
+		className: (e) => m({
+			size: l,
+			className: i(o.className, e)
+		}),
+		children: /* @__PURE__ */ s(e, {
+			size: h[c],
+			...r,
+			glyph: t,
+			"aria-hidden": !0
+		})
+	});
+}
+_.displayName = "IconButton";
+//#endregion
+//#region src/components/icon-button/icon-button.meta.ts
+var v = {
+	name: "IconButton",
+	category: t.buttons,
+	status: "experimental",
+	description: "Square button that shows a single icon and no visible text, with its accessible name from `label`. Also called an icon-only or toolbar button. Use Button with `startIcon` or `endIcon` when a text label is visible.",
+	origin: "native",
+	internalDependencies: ["Button", "Icon"]
+};
+//#endregion
+export { d as i, _ as n, f as r, v as t };

package/dist/icons/catalog.gen.d.ts

@@ -6011,6 +6011,27 @@ export declare const ICON_CATALOG: readonly [{
     readonly style: "regular";
     readonly origin: "iconoir";
     readonly file: "regular/laptop-warning.svg";
+}, {
+    readonly name: "LayoutAuto";
+    readonly category: "Layout";
+    readonly tags: readonly ["layout", "auto", "masonry", "viewports", "tiles", "grid"];
+    readonly style: "regular";
+    readonly origin: "imfusion";
+    readonly file: "regular/layout-auto.svg";
+}, {
+    readonly name: "LayoutFocusPlusRows";
+    readonly category: "Layout";
+    readonly tags: readonly ["layout", "focus", "rows", "main viewport", "viewports", "split"];
+    readonly style: "regular";
+    readonly origin: "imfusion";
+    readonly file: "regular/layout-focus-plus-rows.svg";
+}, {
+    readonly name: "LayoutFocusPlusStack";
+    readonly category: "Layout";
+    readonly tags: readonly ["layout", "focus", "stack", "main viewport", "sidebar", "viewports"];
+    readonly style: "regular";
+    readonly origin: "imfusion";
+    readonly file: "regular/layout-focus-plus-stack.svg";
 }, {
     readonly name: "LayoutLeft";
     readonly category: "Layout";
@@ -6025,6 +6046,13 @@ export declare const ICON_CATALOG: readonly [{
     readonly style: "regular";
     readonly origin: "iconoir";
     readonly file: "regular/layout-right.svg";
+}, {
+    readonly name: "LayoutRows";
+    readonly category: "Layout";
+    readonly tags: readonly ["layout", "rows", "viewports", "grid", "2x2", "tiles"];
+    readonly style: "regular";
+    readonly origin: "imfusion";
+    readonly file: "regular/layout-rows.svg";
 }, {
     readonly name: "Leaderboard";
     readonly category: "Activities";

package/dist/icons/icons.gen.d.ts

@@ -857,8 +857,12 @@ export declare const LaptopCharging: import('.').IconComponent;
 export declare const LaptopDevMode: import('.').IconComponent;
 export declare const LaptopFix: import('.').IconComponent;
 export declare const LaptopWarning: import('.').IconComponent;
+export declare const LayoutAuto: import('.').IconComponent;
+export declare const LayoutFocusPlusRows: import('.').IconComponent;
+export declare const LayoutFocusPlusStack: import('.').IconComponent;
 export declare const LayoutLeft: import('.').IconComponent;
 export declare const LayoutRight: import('.').IconComponent;
+export declare const LayoutRows: import('.').IconComponent;
 export declare const Leaderboard: import('.').IconComponent;
 export declare const LeaderboardStar: import('.').IconComponent;
 export declare const Leaf: import('.').IconComponent;