@imfusion/web-ui 0.6.1-dev.16.g616c20b4 → 0.6.1-dev.20.g3845eed7

package/dist/components/toast/toast.d.ts

@@ -13,6 +13,7 @@ type UpstreamPositioner = React.ComponentProps<typeof ToastPrimitive.Positioner>
 type UpstreamArrow = React.ComponentProps<typeof ToastPrimitive.Arrow>;
 declare const toastViewport: (props?: ({
     position?: "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right" | null | undefined;
+    width?: "content" | "default" | "compact" | "wide" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 declare const toastRoot: (props?: ({
     variant?: "warning" | "info" | "neutral" | "success" | "error" | null | undefined;
@@ -62,6 +63,8 @@ export declare namespace Portal {
 type ViewportProps = Omit<React.HTMLAttributes<HTMLDivElement>, "className"> & {
     /** Which edge or corner of the screen the stack anchors to. */
     position?: VariantProps<typeof toastViewport>["position"];
+    /** Width treatment for the toast stack. */
+    width?: VariantProps<typeof toastViewport>["width"];
     className?: UpstreamViewport["className"];
     render?: UpstreamViewport["render"];
 };
@@ -70,7 +73,7 @@ type ViewportProps = Omit<React.HTMLAttributes<HTMLDivElement>, "className"> & {
  * expands the collapsed toasts; it ignores pointer events except on the toasts
  * themselves so the app underneath stays clickable.
  */
-export declare function Viewport({ className, position, ...props }: ViewportProps): import("react/jsx-runtime").JSX.Element;
+export declare function Viewport({ className, position, width, ...props }: ViewportProps): import("react/jsx-runtime").JSX.Element;
 export declare namespace Viewport {
     var displayName: string;
 }

package/dist/index.js

@@ -2308,7 +2308,11 @@ var ja = {
 	variantInfo: "imf-ui-toast-module-variantInfo",
 	variantSuccess: "imf-ui-toast-module-variantSuccess",
 	variantWarning: "imf-ui-toast-module-variantWarning",
-	viewport: "imf-ui-toast-module-viewport"
+	viewport: "imf-ui-toast-module-viewport",
+	widthCompact: "imf-ui-toast-module-widthCompact",
+	widthContent: "imf-ui-toast-module-widthContent",
+	widthDefault: "imf-ui-toast-module-widthDefault",
+	widthWide: "imf-ui-toast-module-widthWide"
 }, Na = /* @__PURE__ */ e({
 	Action: () => eo,
 	Arrow: () => no,
@@ -2324,15 +2328,26 @@ var ja = {
 	createToastManager: () => Ga,
 	useToastManager: () => Wa
 }), Pa = h(Y.portal), Fa = h(Y.viewport, {
-	variants: { position: {
-		"top-left": Y.positionTopLeft,
-		"top-center": Y.positionTopCenter,
-		"top-right": Y.positionTopRight,
-		"bottom-left": Y.positionBottomLeft,
-		"bottom-center": Y.positionBottomCenter,
-		"bottom-right": Y.positionBottomRight
-	} },
-	defaultVariants: { position: "bottom-center" }
+	variants: {
+		position: {
+			"top-left": Y.positionTopLeft,
+			"top-center": Y.positionTopCenter,
+			"top-right": Y.positionTopRight,
+			"bottom-left": Y.positionBottomLeft,
+			"bottom-center": Y.positionBottomCenter,
+			"bottom-right": Y.positionBottomRight
+		},
+		width: {
+			compact: Y.widthCompact,
+			default: Y.widthDefault,
+			wide: Y.widthWide,
+			content: Y.widthContent
+		}
+	},
+	defaultVariants: {
+		position: "bottom-center",
+		width: "default"
+	}
 }), Ia = h(Y.root, {
 	variants: { variant: {
 		neutral: null,
@@ -2359,13 +2374,14 @@ function qa({ className: e, ...t }) {
 	});
 }
 qa.displayName = "Toast.Portal";
-function Ja({ className: e, position: t = "bottom-center", ...n }) {
+function Ja({ className: e, position: t = "bottom-center", width: n = "default", ...r }) {
 	return /* @__PURE__ */ _(T.Viewport, {
-		...n,
+		...r,
 		"data-imf-ui-component": "Toast.Viewport",
-		className: (n) => Fa({
+		className: (r) => Fa({
 			position: t,
-			className: typeof e == "function" ? e(n) : e
+			width: n,
+			className: typeof e == "function" ? e(r) : e
 		})
 	});
 }