@rovula/ui 0.0.40 → 0.0.41

package/dist/cjs/types/components/Toast/Toaster.d.ts

@@ -1 +1,10 @@
-export declare function Toaster(): import("react/jsx-runtime").JSX.Element;
+type ToasterProps = {
+    viewportClassName?: string;
+    titleClassName?: string;
+    descriptionClassName?: string;
+    contentClassName?: string;
+    iconWrapperClassName?: string;
+    actionWrapperClassName?: string;
+};
+export declare function Toaster({ viewportClassName, titleClassName, descriptionClassName, contentClassName, iconWrapperClassName, actionWrapperClassName, }: ToasterProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Toast/Toast.styles.js

@@ -18,7 +18,7 @@ export const toastVariants = cva([
         variant: "success",
     },
 });
-export const toastViewportVariants = cva(["fixed z-[100] flex w-full md:w-auto flex-col-reverse px-4"], {
+export const toastViewportVariants = cva(["fixed z-[100] flex w-auto flex-col-reverse px-4"], {
     variants: {
         position: {
             "top-center": "top-[40px] left-0 right-0 justify-self-center",

package/dist/components/Toast/Toaster.js

@@ -15,10 +15,11 @@ import { Toast, ToastClose, ToastDescription, ToastProvider, ToastTitle, ToastVi
 import { useToast } from "./useToast";
 import Icon from "../Icon/Icon";
 import { toastContentVariants, toastIconVariants } from "./Toast.styles";
-export function Toaster() {
+import { cn } from "@/utils/cn";
+export function Toaster({ viewportClassName, titleClassName, descriptionClassName, contentClassName, iconWrapperClassName, actionWrapperClassName, }) {
     const { toasts, position } = useToast();
     return (_jsxs(ToastProvider, { children: [toasts.map(function (_a) {
-                var { id, title, description, action, contentMode } = _a, props = __rest(_a, ["id", "title", "description", "action", "contentMode"]);
-                return (_jsxs(Toast, Object.assign({}, props, { children: [_jsx("div", { className: toastIconVariants({ variant: props.variant }), children: _jsx(Icon, { type: "heroicons", name: "check-circle", className: "size-6" }) }), _jsxs("div", { className: toastContentVariants({ contentMode }), children: [title && _jsx(ToastTitle, { children: title }), description && (_jsx(ToastDescription, { children: description }))] }), _jsx("div", { className: "self-center ml-[var(--spacing-spacing-xl)]", children: action }), _jsx(ToastClose, {})] }), id));
-            }), _jsx(ToastViewport, { position: position })] }));
+                var { id, title, description, action, contentMode = "horizontal" } = _a, props = __rest(_a, ["id", "title", "description", "action", "contentMode"]);
+                return (_jsxs(Toast, Object.assign({}, props, { children: [_jsx("div", { className: cn(toastIconVariants({ variant: props.variant }), iconWrapperClassName), children: _jsx(Icon, { type: "heroicons", name: "check-circle", className: "size-6" }) }), _jsxs("div", { className: cn(toastContentVariants({ contentMode }), contentClassName), children: [title && (_jsx(ToastTitle, { className: titleClassName, children: title })), description && (_jsx(ToastDescription, { className: descriptionClassName, children: description }))] }), _jsx("div", { className: cn("self-center ml-[var(--spacing-spacing-xl)]", actionWrapperClassName), children: action }), _jsx(ToastClose, {})] }), id));
+            }), _jsx(ToastViewport, { position: position, className: viewportClassName })] }));
 }

package/dist/esm/bundle.css

@@ -5561,10 +5561,6 @@ body {
   .md\:right-\[40px\]{
     right: 40px;
   }
-
-  .md\:w-auto{
-    width: auto;
-  }
 }
 .\[\&\:has\(\[role\=checkbox\]\)\]\:w-4:has([role=checkbox]){
   width: 1rem;