flikkui 0.1.0-beta.9 → 0.2.0-beta.2

package/dist/components/feedback/Alert/Alert.theme.d.ts

@@ -1,2 +0,0 @@
-import { AlertTheme } from './Alert.types';
-export declare const alertTheme: AlertTheme;

package/dist/components/feedback/Alert/Alert.theme.js

@@ -1,17 +0,0 @@
-var alertTheme = {
-    baseStyle: 'relative flex items-start gap-3 rounded-lg border px-4 py-3',
-    variants: {
-        info: 'bg-[var(--color-primary-50)] border-[var(--color-primary-200)] text-[var(--color-primary-900)]',
-        success: 'bg-[var(--color-success-50)] border-[var(--color-success-200)] text-[var(--color-success-900)]',
-        warning: 'bg-[var(--color-warning-50)] border-[var(--color-warning-200)] text-[var(--color-warning-900)]',
-        error: 'bg-[var(--color-danger-50)] border-[var(--color-danger-200)] text-[var(--color-danger-900)]',
-    },
-    iconStyle: 'flex-shrink-0 w-5 h-5 mt-0.5',
-    contentStyle: 'flex-1 min-w-0',
-    titleStyle: 'font-medium text-sm',
-    descriptionStyle: 'text-sm mt-1 opacity-90',
-    childrenStyle: 'mt-1',
-    closeButtonStyle: 'absolute top-3 right-3 flex-shrink-0 w-5 h-5 opacity-70 hover:opacity-100 transition-opacity cursor-pointer',
-};
-
-export { alertTheme };

package/dist/components/feedback/Alert/Alert.types.d.ts

@@ -1,44 +0,0 @@
-import { HTMLAttributes, ReactNode } from 'react';
-export type AlertVariant = 'info' | 'success' | 'warning' | 'error';
-export interface AlertTheme {
-    baseStyle: string;
-    variants: Record<AlertVariant, string>;
-    iconStyle: string;
-    contentStyle: string;
-    titleStyle: string;
-    descriptionStyle: string;
-    childrenStyle: string;
-    closeButtonStyle: string;
-}
-export interface AlertThemeOverrides {
-    baseStyle?: string;
-    variants?: Partial<Record<AlertVariant, string>>;
-    iconStyle?: string;
-    contentStyle?: string;
-    titleStyle?: string;
-    descriptionStyle?: string;
-    childrenStyle?: string;
-    closeButtonStyle?: string;
-}
-export interface AlertProps extends HTMLAttributes<HTMLDivElement> {
-    /** The visual style variant of the alert */
-    variant?: AlertVariant;
-    /** The main title/message of the alert */
-    title?: string;
-    /** Additional description text */
-    description?: string;
-    /** Whether the alert can be dismissed */
-    dismissible?: boolean;
-    /** Custom icon for the alert */
-    icon?: ReactNode;
-    /** Whether to show the default icon for the variant */
-    showIcon?: boolean;
-    /** Callback when the alert is dismissed */
-    onDismiss?: () => void;
-    /** Custom class name */
-    className?: string;
-    /** Theme overrides */
-    theme?: AlertThemeOverrides;
-    /** Children content */
-    children?: ReactNode;
-}

package/dist/components/feedback/ChatMessage/ChatMessage.d.ts

@@ -1,3 +0,0 @@
-import React from 'react';
-import { ChatMessageProps } from './ChatMessage.types';
-export declare const ChatMessage: React.ForwardRefExoticComponent<ChatMessageProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/feedback/ChatMessage/ChatMessage.js

@@ -1,26 +0,0 @@
-import { __rest, __assign } from '../../../node_modules/tslib/tslib.es6.js';
-import React__default from 'react';
-import { cn } from '../../../utils/cn.js';
-import { formatTimestamp } from '../../../utils/dateUtils.js';
-import { chatMessageTheme } from './ChatMessage.theme.js';
-import { Avatar } from '../../core/Avatar/Avatar.js';
-
-var ChatMessage = React__default.forwardRef(function (_a, ref) {
-    var _b = _a.variant, variant = _b === void 0 ? 'receiver' : _b, message = _a.message, timestamp = _a.timestamp, avatar = _a.avatar, _c = _a.showTimestamp, showTimestamp = _c === void 0 ? true : _c, className = _a.className, _d = _a.theme, customTheme = _d === void 0 ? {} : _d, props = __rest(_a, ["variant", "message", "timestamp", "avatar", "showTimestamp", "className", "theme"]);
-    var isReceiver = variant === 'receiver';
-    var containerStyle = isReceiver ? chatMessageTheme.receiverContainerStyle : chatMessageTheme.senderContainerStyle;
-    var bubbleVariantStyle = isReceiver ? chatMessageTheme.receiverBubbleStyle : chatMessageTheme.senderBubbleStyle;
-    var timestampStyle = isReceiver ? chatMessageTheme.receiverTimestampStyle : chatMessageTheme.senderTimestampStyle;
-    return (React__default.createElement("div", __assign({ ref: ref, className: cn(chatMessageTheme.baseStyle, customTheme.baseStyle, className) }, props),
-        React__default.createElement("div", { className: cn(containerStyle, isReceiver ? customTheme.receiverContainerStyle : customTheme.senderContainerStyle) },
-            avatar && (React__default.createElement("div", { className: cn(chatMessageTheme.avatarContainerStyle, customTheme.avatarContainerStyle) },
-                React__default.createElement(Avatar, { src: avatar.src, alt: avatar.alt, fallback: avatar.fallback, size: "sm" }))),
-            React__default.createElement("div", { className: cn(chatMessageTheme.messageContainerStyle, customTheme.messageContainerStyle) },
-                React__default.createElement("div", { className: cn(chatMessageTheme.bubbleBaseStyle, bubbleVariantStyle, customTheme.bubbleBaseStyle, isReceiver ? customTheme.receiverBubbleStyle : customTheme.senderBubbleStyle) },
-                    React__default.createElement("p", { className: cn(chatMessageTheme.messageTextStyle, customTheme.messageTextStyle) }, message)),
-                showTimestamp && (React__default.createElement("div", { className: cn(timestampStyle, isReceiver ? customTheme.receiverTimestampStyle : customTheme.senderTimestampStyle) },
-                    React__default.createElement("time", { dateTime: typeof timestamp === 'string' ? timestamp : timestamp.toISOString(), className: cn(chatMessageTheme.timeStyle, customTheme.timeStyle) }, formatTimestamp(timestamp))))))));
-});
-ChatMessage.displayName = 'ChatMessage';
-
-export { ChatMessage };

package/dist/components/feedback/ChatMessage/ChatMessage.theme.d.ts

@@ -1,2 +0,0 @@
-import { ChatMessageTheme } from './ChatMessage.types';
-export declare const chatMessageTheme: ChatMessageTheme;

package/dist/components/feedback/ChatMessage/ChatMessage.theme.js

@@ -1,16 +0,0 @@
-var chatMessageTheme = {
-    baseStyle: 'w-full max-w-full',
-    avatarContainerStyle: 'flex-shrink-0',
-    messageContainerStyle: 'flex flex-col min-w-0 flex-1',
-    bubbleBaseStyle: 'max-w-[80%] sm:max-w-[70%] rounded-3xl px-5 py-4 w-fit border-t-[0.5px] ring-1',
-    messageTextStyle: 'break-words text-base',
-    timeStyle: 'select-none',
-    senderContainerStyle: 'flex flex-row-reverse items-end gap-4',
-    senderBubbleStyle: 'bg-gradient-to-br from-primary-600 to-primary-700 text-white rounded-br-xs ml-auto ring-[var(--color-primary)] border-white/30',
-    senderTimestampStyle: 'text-xs text-gray-500 mt-1 text-right pr-1',
-    receiverContainerStyle: 'flex items-end gap-4',
-    receiverBubbleStyle: 'bg-gray-100 text-text-primary rounded-bl-xs shadow-black/10 ring-gray-100 border-white',
-    receiverTimestampStyle: 'text-xs text-text-placeholder mt-1 text-left pl-1',
-};
-
-export { chatMessageTheme };

package/dist/components/feedback/ChatMessage/ChatMessage.types.d.ts

@@ -1,72 +0,0 @@
-import { ReactNode } from 'react';
-export type ChatMessageVariant = 'sender' | 'receiver';
-export interface ChatMessageAvatarProps {
-    /**
-     * The source URL for the avatar image
-     */
-    src?: string;
-    /**
-     * Alternative text for the avatar image
-     */
-    alt: string;
-    /**
-     * Fallback content to display when image fails to load
-     */
-    fallback?: ReactNode;
-}
-export interface ChatMessageProps extends React.HTMLAttributes<HTMLDivElement> {
-    /**
-     * The variant of the chat message
-     * @default "receiver"
-     */
-    variant?: ChatMessageVariant;
-    /**
-     * The message content
-     */
-    message: string;
-    /**
-     * The timestamp of the message
-     */
-    timestamp: Date | string;
-    /**
-     * Avatar configuration for the message sender
-     */
-    avatar?: ChatMessageAvatarProps;
-    /**
-     * Whether to show the timestamp
-     * @default true
-     */
-    showTimestamp?: boolean;
-    /**
-     * Custom theme overrides
-     */
-    theme?: ChatMessageThemeOverrides;
-}
-export interface ChatMessageTheme {
-    baseStyle: string;
-    avatarContainerStyle: string;
-    messageContainerStyle: string;
-    bubbleBaseStyle: string;
-    messageTextStyle: string;
-    timeStyle: string;
-    senderContainerStyle: string;
-    senderBubbleStyle: string;
-    senderTimestampStyle: string;
-    receiverContainerStyle: string;
-    receiverBubbleStyle: string;
-    receiverTimestampStyle: string;
-}
-export interface ChatMessageThemeOverrides {
-    baseStyle?: string;
-    avatarContainerStyle?: string;
-    messageContainerStyle?: string;
-    bubbleBaseStyle?: string;
-    messageTextStyle?: string;
-    timeStyle?: string;
-    senderContainerStyle?: string;
-    senderBubbleStyle?: string;
-    senderTimestampStyle?: string;
-    receiverContainerStyle?: string;
-    receiverBubbleStyle?: string;
-    receiverTimestampStyle?: string;
-}

package/dist/components/feedback/ChatMessage/index.d.ts

@@ -1,2 +0,0 @@
-export { ChatMessage } from './ChatMessage';
-export type { ChatMessageProps, ChatMessageVariant, ChatMessageAvatarProps, ChatMessageTheme, ChatMessageThemeOverrides } from './ChatMessage.types';

package/dist/components/feedback/Empty/Empty.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import { EmptyProps } from "./Empty.types";
-declare const Empty: React.ForwardRefExoticComponent<EmptyProps & React.RefAttributes<HTMLDivElement>>;
-export default Empty;

package/dist/components/feedback/Empty/Empty.js

@@ -1,26 +0,0 @@
-import { __rest, __assign } from '../../../node_modules/tslib/tslib.es6.js';
-import React__default from 'react';
-import { emptyTheme } from './Empty.theme.js';
-import { cn } from '../../../utils/cn.js';
-
-var Empty = React__default.forwardRef(function (_a, ref) {
-    var title = _a.title, description = _a.description, image = _a.image, imageAlt = _a.imageAlt, icon = _a.icon, action = _a.action, className = _a.className, children = _a.children, props = __rest(_a, ["title", "description", "image", "imageAlt", "icon", "action", "className", "children"]);
-    // Fixed image and icon dimensions
-    var imageDimensions = "size-32";
-    var iconDimensions = "size-16";
-    // If children are provided, render them instead of the default layout
-    if (children) {
-        return (React__default.createElement("div", __assign({ ref: ref, className: cn(emptyTheme.baseStyle, className), role: "region", "aria-label": "Empty state" }, props), children));
-    }
-    return (React__default.createElement("div", __assign({ ref: ref, className: cn(emptyTheme.baseStyle, className), role: "region", "aria-label": "Empty state" }, props),
-        image ? (React__default.createElement("div", { className: "flex-shrink-0 mb-6" },
-            React__default.createElement("img", { src: image, alt: imageAlt || "Empty state illustration", className: cn("mx-auto object-cover", imageDimensions), loading: "lazy" }))) : icon ? (React__default.createElement("div", { className: cn("flex-shrink-0 mx-auto text-text-muted mb-6", iconDimensions), "aria-hidden": "true" }, icon)) : null,
-        React__default.createElement("div", { className: "flex flex-col items-center justify-center gap-1" },
-            title && React__default.createElement("div", { className: emptyTheme.titleStyle }, title),
-            description && (React__default.createElement("div", { className: emptyTheme.descriptionStyle }, description))),
-        action && (React__default.createElement("div", { className: "flex flex-col sm:flex-row gap-2 justify-center items-center mt-6" }, action))));
-});
-// Set display name for dev tools and Storybook
-Empty.displayName = "Empty";
-
-export { Empty as default };

package/dist/components/feedback/Empty/Empty.theme.js

@@ -1,13 +0,0 @@
-/**
- * Default theme for the Empty component
- */
-var emptyTheme = {
-    // Base container styles - customizable spacing, colors, and layout
-    baseStyle: "flex flex-col items-center justify-center text-center w-full max-w-md mx-auto space-y-4 py-12 px-6 ",
-    // Title text styles - customizable typography and colors
-    titleStyle: "text-base font-semibold text-text-primary",
-    // Description text styles - customizable typography and colors  
-    descriptionStyle: "text-base text-text-secondary/70",
-};
-
-export { emptyTheme };

package/dist/components/feedback/Empty/index.d.ts

@@ -1,3 +0,0 @@
-export { default } from "./Empty";
-export type { EmptyProps } from "./Empty.types";
-export { emptyTheme, type EmptyTheme } from "./Empty.theme";

package/dist/components/feedback/Notification/Notification.js

@@ -1,41 +0,0 @@
-import { __rest, __assign } from '../../../node_modules/tslib/tslib.es6.js';
-import React__default from 'react';
-import { cn } from '../../../utils/cn.js';
-import { notificationTheme } from './Notification.theme.js';
-import ForwardRef from '../../../node_modules/@heroicons/react/24/solid/esm/XMarkIcon.js';
-
-var Notification = React__default.forwardRef(function (_a, ref) {
-    var _b = _a.variant, variant = _b === void 0 ? 'default' : _b, title = _a.title, description = _a.description, avatar = _a.avatar, icon = _a.icon, actions = _a.actions, onDismiss = _a.onDismiss, className = _a.className, children = _a.children, props = __rest(_a, ["variant", "title", "description", "avatar", "icon", "actions", "onDismiss", "className", "children"]);
-    var handleDismiss = function () {
-        onDismiss === null || onDismiss === void 0 ? void 0 : onDismiss();
-    };
-    var variantTheme = notificationTheme.variants[variant];
-    var renderIconOrAvatar = function () {
-        if (avatar) {
-            return (React__default.createElement("div", { className: "flex-shrink-0 w-10 h-10 rounded-full" }, avatar));
-        }
-        // icon={null} means hide icon completely
-        if (icon === null) {
-            return null;
-        }
-        // Use custom icon if provided, otherwise use variant's default icon
-        var IconToRender = icon || variantTheme.defaultIcon;
-        return (React__default.createElement("div", { className: "flex-shrink-0 w-6 h-6 mt-1" }, React__default.isValidElement(IconToRender)
-            ? IconToRender
-            : React__default.createElement(IconToRender, {
-                className: cn("w-6 h-6", variantTheme.iconColor)
-            })));
-    };
-    return (React__default.createElement("div", __assign({ ref: ref, className: cn(notificationTheme.baseStyle, variantTheme.containerStyle, className), role: "alert" }, props),
-        renderIconOrAvatar(),
-        React__default.createElement("div", { className: "flex-1 min-w-0 ".concat(onDismiss ? 'mr-5' : '') },
-            React__default.createElement("div", { className: cn(notificationTheme.titleStyle, variantTheme.titleColor) }, title),
-            description && (React__default.createElement("div", { className: notificationTheme.descriptionStyle }, description)),
-            children && (React__default.createElement("div", { className: "mt-2" }, children)),
-            actions && (React__default.createElement("div", { className: "flex items-center gap-2 mt-6" }, actions))),
-        onDismiss && (React__default.createElement("button", { type: "button", className: "absolute top-3 right-3 flex-shrink-0 size-5 text-text-muted hover:text-text-primary transition-colors cursor-pointer", onClick: handleDismiss, "aria-label": "Dismiss notification" },
-            React__default.createElement(ForwardRef, { className: "size-4" })))));
-});
-Notification.displayName = 'Notification';
-
-export { Notification };

package/dist/components/feedback/Notification/Notification.theme.d.ts

@@ -1,17 +0,0 @@
-import { NotificationVariant } from './Notification.types';
-/**
- * Comprehensive variant theme system for the Notification component
- */
-export interface NotificationVariantTheme {
-    containerStyle: string;
-    iconColor: string;
-    titleColor: string;
-    defaultIcon: React.ComponentType<any>;
-}
-export interface NotificationTheme {
-    baseStyle: string;
-    titleStyle: string;
-    descriptionStyle: string;
-    variants: Record<NotificationVariant, NotificationVariantTheme>;
-}
-export declare const notificationTheme: NotificationTheme;

package/dist/components/feedback/Notification/Notification.theme.js

@@ -1,49 +0,0 @@
-import ForwardRef from '../../../node_modules/@heroicons/react/24/solid/esm/XCircleIcon.js';
-import ForwardRef$1 from '../../../node_modules/@heroicons/react/24/solid/esm/ExclamationTriangleIcon.js';
-import ForwardRef$2 from '../../../node_modules/@heroicons/react/24/solid/esm/CheckCircleIcon.js';
-import ForwardRef$3 from '../../../node_modules/@heroicons/react/24/solid/esm/InformationCircleIcon.js';
-import ForwardRef$4 from '../../../node_modules/@heroicons/react/24/solid/esm/BellIcon.js';
-
-var notificationTheme = {
-    // Base container styles - layout and spacing only
-    baseStyle: 'relative flex items-start gap-4 rounded-xl border-t border-white px-6 py-4 shadow-md shadow-[var(--color-neutral-500)]/10 bg-white/80 backdrop-blur-sm ring-[1px] ring-offset-[0.5px] text-sm',
-    // Title typography only (color comes from variant)
-    titleStyle: 'font-semibold',
-    // Description text styles - stays neutral across all variants
-    descriptionStyle: 'text-text-secondary/90 mt-1',
-    // Comprehensive variant definitions
-    variants: {
-        default: {
-            containerStyle: 'bg-[var(--color-neutral-50)] ring-border',
-            iconColor: 'text-[var(--color-primary)]',
-            titleColor: 'text-text-primary',
-            defaultIcon: ForwardRef$4,
-        },
-        info: {
-            containerStyle: 'bg-[var(--color-primary-50)] ring-[var(--color-primary)]/10',
-            iconColor: 'text-[var(--color-primary)]',
-            titleColor: 'text-[var(--color-primary-700)]',
-            defaultIcon: ForwardRef$3,
-        },
-        success: {
-            containerStyle: 'bg-[var(--color-success-50)] ring-[var(--color-success)]/20',
-            iconColor: 'text-[var(--color-success)]',
-            titleColor: 'text-[var(--color-success-700)]',
-            defaultIcon: ForwardRef$2,
-        },
-        warning: {
-            containerStyle: 'bg-[var(--color-warning-50)] ring-[var(--color-warning)]/10',
-            iconColor: 'text-[var(--color-warning)]',
-            titleColor: 'text-[var(--color-warning-700)]',
-            defaultIcon: ForwardRef$1,
-        },
-        error: {
-            containerStyle: 'bg-[var(--color-danger-50)] ring-[var(--color-danger)]/10',
-            iconColor: 'text-[var(--color-danger)]',
-            titleColor: 'text-[var(--color-danger-700)]',
-            defaultIcon: ForwardRef,
-        },
-    },
-};
-
-export { notificationTheme };

package/dist/components/feedback/Notification/Notification.types.d.ts

@@ -1,33 +0,0 @@
-import { HTMLAttributes, ReactNode } from 'react';
-export type NotificationVariant = 'default' | 'info' | 'success' | 'warning' | 'error';
-export interface NotificationProps extends HTMLAttributes<HTMLDivElement> {
-    /** The visual style variant of the notification */
-    variant?: NotificationVariant;
-    /** The main title of the notification */
-    title: string;
-    /** Additional description text */
-    description?: string;
-    /** Avatar to display (takes precedence over icons) */
-    avatar?: ReactNode;
-    /**
-     * Custom icon for the notification
-     * - Provide custom icon: overrides the default variant icon
-     * - Set to null: hides icon completely
-     * - Leave undefined: shows default variant icon
-     */
-    icon?: ReactNode | null;
-    /**
-     * Action buttons as ReactNode - use Button components directly
-     * Example: actions={<><Button>Cancel</Button><Button variant="primary">Save</Button></>}
-     */
-    actions?: ReactNode;
-    /**
-     * Callback when the notification is dismissed
-     * Note: Providing this callback automatically makes the notification dismissible
-     */
-    onDismiss?: () => void;
-    /** Custom class name */
-    className?: string;
-    /** Children content */
-    children?: ReactNode;
-}

package/dist/components/feedback/Spinner/Spinner.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import { SpinnerProps } from './Spinner.types';
-declare const Spinner: React.FC<SpinnerProps>;
-export default Spinner;

package/dist/components/feedback/Spinner/Spinner.js

@@ -1,14 +0,0 @@
-import { __rest, __assign } from '../../../node_modules/tslib/tslib.es6.js';
-import React__default from 'react';
-import { spinnerTheme } from './Spinner.theme.js';
-import { cn } from '../../../utils/cn.js';
-
-var Spinner = function (_a) {
-    var _b = _a.size, size = _b === void 0 ? 'md' : _b, _c = _a.color, color = _c === void 0 ? 'primary' : _c, className = _a.className, theme = _a.theme, props = __rest(_a, ["size", "color", "className", "theme"]);
-    // Merge custom theme with default theme
-    var currentTheme = theme ? __assign(__assign({}, spinnerTheme), theme) : spinnerTheme;
-    return (React__default.createElement("div", __assign({ className: cn(currentTheme.baseStyle, className) }, props),
-        React__default.createElement("div", { className: cn(currentTheme.animation, currentTheme.sizes[size], currentTheme.colors[color]), role: "status", "aria-label": "loading" })));
-};
-
-export { Spinner as default };

package/dist/components/feedback/Spinner/Spinner.theme.js

@@ -1,26 +0,0 @@
-/**
- * Default theme for the Spinner component
- */
-var spinnerTheme = {
-    // Base styles for the spinner container
-    baseStyle: "inline-flex items-center justify-center",
-    // Size variants
-    sizes: {
-        sm: "w-4 h-4 border-3",
-        md: "w-5 h-5 border-3",
-        lg: "w-6 h-6 border-3",
-    },
-    // Color variants
-    colors: {
-        primary: "border-[var(--color-primary-600)] border-t-transparent",
-        secondary: "border-[var(--color-neutral-400)] border-t-transparent",
-        success: "border-green-500 border-t-transparent",
-        warning: "border-yellow-500 border-t-transparent",
-        error: "border-red-500 border-t-transparent",
-        neutral: "border-[var(--color-neutral-500)] border-t-transparent",
-    },
-    // Animation class with drop shadow
-    animation: "animate-[spin_1s_linear_infinite] rounded-full",
-};
-
-export { spinnerTheme };

package/dist/components/feedback/Spinner/Spinner.types.d.ts

@@ -1,31 +0,0 @@
-/**
- * Spinner component props
- */
-export interface SpinnerProps extends React.HTMLAttributes<HTMLDivElement> {
-    /**
-     * The size of the spinner
-     * @default "md"
-     */
-    size?: SpinnerSize;
-    /**
-     * The color of the spinner
-     * @default "primary"
-     */
-    color?: SpinnerColor;
-    /**
-     * Custom CSS class to apply to the spinner
-     */
-    className?: string;
-    /**
-     * Theme overrides for the spinner
-     */
-    theme?: SpinnerThemeOverrides;
-}
-export type SpinnerSize = "sm" | "md" | "lg";
-export type SpinnerColor = "primary" | "secondary" | "success" | "warning" | "error" | "neutral";
-export interface SpinnerThemeOverrides {
-    baseStyle?: string;
-    sizes?: Partial<Record<SpinnerSize, string>>;
-    colors?: Partial<Record<SpinnerColor, string>>;
-    animation?: string;
-}

package/dist/components/feedback/Spinner/index.d.ts

@@ -1,2 +0,0 @@
-export { default } from './Spinner';
-export * from './Spinner.types';

package/dist/components/feedback/Toast/Toast.animations.js

@@ -1,58 +0,0 @@
-var toastAnimations = {
-    // Initial state when toast appears
-    initial: {
-        opacity: 0,
-        y: 50,
-        scale: 0.3,
-    },
-    // Exit animation when toast is dismissed
-    exit: {
-        opacity: 0,
-        scale: 0.5,
-        transition: { duration: 0.2 },
-    },
-    // Spring transition configuration
-    transition: {
-        type: "spring",
-        stiffness: 500,
-        damping: 30,
-        mass: 1,
-    },
-};
-// Stacking animation utilities
-var getToastStackingAnimation = function (index, totalToasts, isExpanded) {
-    if (totalToasts === 1)
-        return {};
-    var maxVisible = 3; // Show max 3 toasts in stack
-    var stackIndex = Math.min(index, maxVisible - 1);
-    if (isExpanded) {
-        // Expanded state - show all toasts with sufficient gap to prevent overlap
-        // Use a larger gap to accommodate variable heights
-        return {
-            y: index * 100, // 100px gap between toasts when expanded (increased from 80px)
-            scale: 1,
-            zIndex: totalToasts - index,
-            opacity: 1,
-        };
-    }
-    else {
-        // Stacked state - compress toasts
-        if (index >= maxVisible) {
-            // Show toasts beyond max visible but more compressed
-            return {
-                y: (maxVisible - 1) * 16,
-                scale: 1 - (maxVisible - 1) * 0.08,
-                zIndex: 0,
-                opacity: 0.3,
-            };
-        }
-        return {
-            y: stackIndex * 16, // 16px offset for each toast (increased from 12px)
-            scale: 1 - stackIndex * 0.08,
-            zIndex: totalToasts - index,
-            opacity: 1 - stackIndex * 0.25,
-        };
-    }
-};
-
-export { getToastStackingAnimation, toastAnimations };

package/dist/components/feedback/Toast/Toast.js

@@ -1,67 +0,0 @@
-import { __rest } from '../../../node_modules/tslib/tslib.es6.js';
-import React__default, { useEffect } from 'react';
-import { cn } from '../../../utils/cn.js';
-import { toastTheme } from './Toast.theme.js';
-import { toastAnimations, getToastStackingAnimation } from './Toast.animations.js';
-import ForwardRef from '../../../node_modules/@heroicons/react/24/solid/esm/ArrowPathIcon.js';
-import ForwardRef$1 from '../../../node_modules/@heroicons/react/24/solid/esm/XCircleIcon.js';
-import ForwardRef$2 from '../../../node_modules/@heroicons/react/24/solid/esm/ExclamationTriangleIcon.js';
-import ForwardRef$3 from '../../../node_modules/@heroicons/react/24/solid/esm/CheckCircleIcon.js';
-import ForwardRef$4 from '../../../node_modules/@heroicons/react/24/solid/esm/InformationCircleIcon.js';
-import ForwardRef$5 from '../../../node_modules/@heroicons/react/24/solid/esm/XMarkIcon.js';
-import { motion } from '../../../node_modules/framer-motion/dist/es/render/components/motion/proxy.js';
-
-var variantIcons = {
-    info: ForwardRef$4,
-    success: ForwardRef$3,
-    warning: ForwardRef$2,
-    error: ForwardRef$1,
-    loading: ForwardRef,
-};
-var Toast = React__default.forwardRef(function (_a, ref) {
-    var _b, _c, _d, _e, _f;
-    var toast = _a.toast, className = _a.className; _a.theme; var onDismiss = _a.onDismiss, _h = _a.index, index = _h === void 0 ? 0 : _h, _j = _a.isExpanded, isExpanded = _j === void 0 ? false : _j, _k = _a.totalToasts, totalToasts = _k === void 0 ? 1 : _k, onMouseEnter = _a.onMouseEnter, onMouseLeave = _a.onMouseLeave; __rest(_a, ["toast", "className", "theme", "onDismiss", "index", "isExpanded", "totalToasts", "onMouseEnter", "onMouseLeave"]);
-    var id = toast.id, _l = toast.variant, variant = _l === void 0 ? 'info' : _l, title = toast.title, description = toast.description, icon = toast.icon, action = toast.action, _m = toast.duration, duration = _m === void 0 ? 5000 : _m, _o = toast.dismissible, dismissible = _o === void 0 ? true : _o;
-    var IconComponent = variantIcons[variant];
-    // Auto-dismiss after duration
-    useEffect(function () {
-        if (duration > 0 && dismissible) {
-            var timer_1 = setTimeout(function () {
-                onDismiss === null || onDismiss === void 0 ? void 0 : onDismiss(id);
-            }, duration);
-            return function () { return clearTimeout(timer_1); };
-        }
-    }, [duration, dismissible, id, onDismiss]);
-    var handleDismiss = function () {
-        onDismiss === null || onDismiss === void 0 ? void 0 : onDismiss(id);
-    };
-    var handleActionClick = function () {
-        action === null || action === void 0 ? void 0 : action.onClick();
-        if (dismissible) {
-            handleDismiss();
-        }
-    };
-    var stackingStyle = getToastStackingAnimation(index, totalToasts, isExpanded);
-    return (React__default.createElement(motion.div, { ref: ref, layout: true, initial: toastAnimations.initial, animate: {
-            opacity: (_b = stackingStyle.opacity) !== null && _b !== void 0 ? _b : 1,
-            y: (_c = stackingStyle.y) !== null && _c !== void 0 ? _c : 0,
-            scale: (_d = stackingStyle.scale) !== null && _d !== void 0 ? _d : 1,
-            zIndex: (_e = stackingStyle.zIndex) !== null && _e !== void 0 ? _e : 1
-        }, exit: toastAnimations.exit, transition: toastAnimations.transition, className: cn(toastTheme.baseStyle, toastTheme.variants[variant], 'pointer-events-auto', index > 0 && !isExpanded && 'absolute top-0 left-0', className), style: {
-            zIndex: (_f = stackingStyle.zIndex) !== null && _f !== void 0 ? _f : 1,
-            position: index > 0 ? 'absolute' : 'relative',
-            top: index > 0 ? 0 : undefined,
-            left: index > 0 ? 0 : undefined,
-        }, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, role: "alert", "aria-live": "polite" },
-        React__default.createElement("div", { className: toastTheme.iconStyle }, icon || React__default.createElement(IconComponent, { className: cn("w-5 h-5", variant === 'loading' && "animate-spin") })),
-        React__default.createElement("div", { className: "flex-1 min-w-0" },
-            title && (React__default.createElement("div", { className: toastTheme.titleStyle }, title)),
-            description && (React__default.createElement("div", { className: toastTheme.descriptionStyle }, description)),
-            action && (React__default.createElement("div", { className: "mt-2" },
-                React__default.createElement("button", { type: "button", className: toastTheme.actionStyle, onClick: handleActionClick }, action.label)))),
-        dismissible && (React__default.createElement("button", { type: "button", className: toastTheme.closeButtonStyle, onClick: handleDismiss, "aria-label": "Dismiss notification" },
-            React__default.createElement(ForwardRef$5, { className: "w-4 h-4" })))));
-});
-Toast.displayName = 'Toast';
-
-export { Toast };

package/dist/components/feedback/Toast/Toast.theme.js

@@ -1,18 +0,0 @@
-var toastTheme = {
-    baseStyle: 'flex items-start gap-3 rounded-2xl border-[2px] px-4 py-3 shadow-2xl backdrop-blur-sm min-w-80 max-w-md ring-[0.5px] ring-white',
-    variants: {
-        info: 'bg-sky-200/50 border-sky-200/40 text-sky-800 shadow-sky-600/20',
-        success: 'bg-[var(--color-success-100)]/50 border-[var(--color-success-200)]/40 text-[var(--color-success-800)] shadow-[var(--color-success-600)]/20',
-        warning: 'bg-[var(--color-warning-100)]/50 border-[var(--color-warning-200)]/40 text-[var(--color-warning-800)] shadow-[var(--color-warning-600)]/20',
-        error: 'bg-[var(--color-danger-100)]/50 border-[var(--color-danger-200)]/40 text-[var(--color-danger-800)] shadow-[var(--color-danger-600)]/20',
-        loading: 'bg-gray-100/50 border-[var(--color-neutral-200)]/40 text-text-primary',
-    },
-    iconStyle: 'flex-shrink-0 size-5 mt-0.5',
-    titleStyle: 'font-semibold text-sm',
-    descriptionStyle: 'text-sm mt-0.5 opacity-60',
-    actionStyle: 'text-xs font-medium px-2 py-1 rounded border bg-white/80 hover:bg-white transition-colors cursor-pointer',
-    closeButtonStyle: 'absolute top-2 right-2 flex-shrink-0 w-4 h-4 opacity-70 hover:opacity-100 transition-opacity cursor-pointer',
-    containerStyle: 'fixed z-50 pointer-events-none',
-};
-
-export { toastTheme };