@neasg/design-system 0.4.29 → 0.4.30

package/dist/alert-stack.d.ts

@@ -0,0 +1,6 @@
+import * as React from "react";
+export interface AlertStackProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+}
+declare const AlertStack: React.ForwardRefExoticComponent<AlertStackProps & React.RefAttributes<HTMLDivElement>>;
+export { AlertStack };

package/dist/alert-stack.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { AnimatePresence, MotionConfig, motion } from "motion/react";
+import { cn } from "./lib/utils";
+const MAX_VISIBLE_ALERTS = 3;
+const stackItemClasses = [
+    "z-50",
+    "pointer-events-none z-40 mx-1",
+    "pointer-events-none z-30 mx-2",
+];
+const stackPaddingClasses = ["", "", "pb-2", "pb-4"];
+const AlertStack = React.forwardRef(({ children, className, ...props }, ref) => {
+    const alerts = React.Children.toArray(children);
+    const visibleAlerts = alerts.slice(0, MAX_VISIBLE_ALERTS);
+    return (_jsx(MotionConfig, { reducedMotion: "user", children: _jsx("div", { ref: ref, "data-slot": "alert-stack", className: cn("grid", stackPaddingClasses[visibleAlerts.length], className), ...props, children: _jsx(AnimatePresence, { initial: true, children: visibleAlerts.map((alert, index) => {
+                    const isFront = index === 0;
+                    return (_jsx(motion.div, { "data-slot": "alert-stack-item", "data-position": isFront ? "front" : "back", "data-depth": index, className: cn("col-start-1 row-start-1 origin-top overflow-hidden rounded-surface", stackItemClasses[index], isFront
+                            ? "cursor-pointer"
+                            : "border border-border/80 bg-muted shadow-sm"), initial: { scale: 0.98, y: -12 }, animate: {
+                            opacity: 1,
+                            scale: 1,
+                            y: index * 8,
+                        }, whileHover: isFront ? { y: -2 } : undefined, exit: { opacity: 0, scale: 0.98, y: -16, zIndex: 60 }, transition: isFront
+                            ? { duration: 0.2, ease: "easeOut" }
+                            : { type: "spring", stiffness: 420, damping: 34 }, "aria-hidden": isFront ? undefined : true, ...(isFront ? {} : { inert: "" }), children: _jsx("div", { className: cn("h-full", !isFront && "invisible"), children: alert }) }, React.isValidElement(alert) && alert.key !== null
+                        ? alert.key
+                        : index));
+                }) }) }) }));
+});
+AlertStack.displayName = "AlertStack";
+export { AlertStack };

package/dist/index.d.ts

@@ -3,8 +3,10 @@ export type { AvatarProps, AvatarSize, AvatarProfileProps, AvatarRootProps, } fr
 export { AvatarProfilePopover, AvatarProfilePopoverContent, AvatarProfilePopoverHeader, AvatarProfilePopoverSection, AvatarProfilePopoverFooter, AvatarProfilePopoverFooterAction, } from "./avatar-profile-popover";
 export type { AvatarProfilePopoverProps, AvatarProfilePopoverContentProps, AvatarProfilePopoverHeaderProps, AvatarProfilePopoverSectionProps, AvatarProfilePopoverFooterProps, AvatarProfilePopoverFooterActionProps, } from "./avatar-profile-popover";
 export * from "./animated-icons";
-export { Alert, AlertAction, AlertConsent, alertVariants } from "./alert";
-export type { AlertActionProps, AlertConsentProps, AlertProps } from "./alert";
+export { Alert, AlertAction, AlertConsent, alertVariants, } from "./alert";
+export type { AlertActionProps, AlertConsentProps, AlertProps, } from "./alert";
+export { AlertStack } from "./alert-stack";
+export type { AlertStackProps } from "./alert-stack";
 export { Badge, badgeVariants } from "./badge";
 export { Card, CardGrid, CardSplitGrid, CardList, CardListItem, } from "./card";
 export type { CardGridProps, CardListItemProps, CardListProps, CardProps, CardSplitGridProps, } from "./card";

package/dist/index.js

@@ -1,7 +1,8 @@
 export { Avatar, AvatarProfile, AvatarRoot, AvatarImage, } from "./avatar";
 export { AvatarProfilePopover, AvatarProfilePopoverContent, AvatarProfilePopoverHeader, AvatarProfilePopoverSection, AvatarProfilePopoverFooter, AvatarProfilePopoverFooterAction, } from "./avatar-profile-popover";
 export * from "./animated-icons";
-export { Alert, AlertAction, AlertConsent, alertVariants } from "./alert";
+export { Alert, AlertAction, AlertConsent, alertVariants, } from "./alert";
+export { AlertStack } from "./alert-stack";
 export { Badge, badgeVariants } from "./badge";
 export { Card, CardGrid, CardSplitGrid, CardList, CardListItem, } from "./card";
 export { MessageAttachmentRow, MessageItem, MessageNewDivider, MessageThread, formatMessageDate, } from "./message-item";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@neasg/design-system",
-  "version": "0.4.29",
+  "version": "0.4.30",
   "description": "NEA shared design system primitives, theme tokens, and Storybook docs.",
   "license": "UNLICENSED",
   "type": "module",