@schemavaults/ui 0.56.2 → 0.59.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/ui/agent-chat-messages/agent-chat-messages.d.ts +95 -0
- package/dist/components/ui/agent-chat-messages/agent-chat-messages.js +180 -0
- package/dist/components/ui/agent-chat-messages/agent-chat-messages.js.map +1 -0
- package/dist/components/ui/agent-chat-messages/index.d.ts +2 -0
- package/dist/components/ui/agent-chat-messages/index.js +2 -0
- package/dist/components/ui/agent-chat-messages/index.js.map +1 -0
- package/dist/components/ui/alert/alert.d.ts +1 -1
- package/dist/components/ui/badge/badge.d.ts +1 -1
- package/dist/components/ui/banner/banner.d.ts +1 -1
- package/dist/components/ui/breadcrumb/breadcrumb.d.ts +1 -1
- package/dist/components/ui/button/button.d.ts +1 -1
- package/dist/components/ui/chip/chip.d.ts +1 -1
- package/dist/components/ui/circular-progress/circular-progress.d.ts +1 -1
- package/dist/components/ui/color-swatch/color-swatch.d.ts +1 -1
- package/dist/components/ui/combobox/combobox.d.ts +1 -1
- package/dist/components/ui/copy-button/copy-button.d.ts +1 -1
- package/dist/components/ui/countdown/countdown.d.ts +1 -1
- package/dist/components/ui/empty-state/empty-state.d.ts +2 -2
- package/dist/components/ui/floating-action-button/floating-action-button.d.ts +1 -1
- package/dist/components/ui/gauge/gauge.d.ts +1 -1
- package/dist/components/ui/index.d.ts +6 -0
- package/dist/components/ui/index.js +3 -0
- package/dist/components/ui/index.js.map +1 -1
- package/dist/components/ui/kbd/kbd.d.ts +1 -1
- package/dist/components/ui/notification-bell/index.d.ts +4 -0
- package/dist/components/ui/notification-bell/index.js +3 -0
- package/dist/components/ui/notification-bell/index.js.map +1 -0
- package/dist/components/ui/notification-bell/notification-bell-variants.d.ts +6 -0
- package/dist/components/ui/notification-bell/notification-bell-variants.js +16 -0
- package/dist/components/ui/notification-bell/notification-bell-variants.js.map +1 -0
- package/dist/components/ui/notification-bell/notification-bell.d.ts +48 -0
- package/dist/components/ui/notification-bell/notification-bell.js +85 -0
- package/dist/components/ui/notification-bell/notification-bell.js.map +1 -0
- package/dist/components/ui/number-input/number-input.d.ts +1 -1
- package/dist/components/ui/number-ticker/number-ticker.d.ts +1 -1
- package/dist/components/ui/pagination/pagination.d.ts +1 -1
- package/dist/components/ui/progress-bar/progress-bar.d.ts +1 -1
- package/dist/components/ui/scroll-progress/index.d.ts +3 -0
- package/dist/components/ui/scroll-progress/index.js +3 -0
- package/dist/components/ui/scroll-progress/index.js.map +1 -0
- package/dist/components/ui/scroll-progress/scroll-progress.d.ts +41 -0
- package/dist/components/ui/scroll-progress/scroll-progress.js +80 -0
- package/dist/components/ui/scroll-progress/scroll-progress.js.map +1 -0
- package/dist/components/ui/segmented-control/segmented-control.d.ts +1 -1
- package/dist/components/ui/stat-card/stat-card.d.ts +2 -2
- package/dist/components/ui/timeline/timeline.d.ts +2 -2
- package/dist/components/ui/toggle/toggle.d.ts +1 -1
- package/dist/framer-motion.d.ts +1 -1
- package/dist/framer-motion.js +1 -1
- package/dist/framer-motion.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,95 @@
|
|
|
1
|
+
import { type HTMLAttributes, type ReactElement, type ReactNode, type Ref } from "react";
|
|
2
|
+
import { type VariantProps } from "class-variance-authority";
|
|
3
|
+
/**
|
|
4
|
+
* Native HTML div attributes without the handlers that framer-motion's
|
|
5
|
+
* `m.div` overloads (drag/animation events). Spreading these props onto
|
|
6
|
+
* `m.div` otherwise causes a type conflict.
|
|
7
|
+
*/
|
|
8
|
+
type MotionDivAttributes = Omit<HTMLAttributes<HTMLDivElement>, "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd" | "onAnimationIteration">;
|
|
9
|
+
export declare const agentChatMessagesSpacingIds: readonly ["compact", "default", "relaxed"];
|
|
10
|
+
export type AgentChatMessagesSpacingId = (typeof agentChatMessagesSpacingIds)[number];
|
|
11
|
+
declare const agentChatMessagesStackVariants: (props?: ({
|
|
12
|
+
spacing?: "default" | "compact" | "relaxed" | null | undefined;
|
|
13
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
14
|
+
export interface AgentChatMessagesProps extends Omit<HTMLAttributes<HTMLDivElement>, "children" | "dir">, VariantProps<typeof agentChatMessagesStackVariants> {
|
|
15
|
+
/**
|
|
16
|
+
* Each direct child should have a stable `key`. Animated entrance and exit
|
|
17
|
+
* are driven by `AnimatePresence`, which relies on keys to track items.
|
|
18
|
+
*/
|
|
19
|
+
children?: ReactNode;
|
|
20
|
+
/** Auto-scroll to the latest message when children change. Suppressed when
|
|
21
|
+
* the user has scrolled away from the bottom. Default: true. */
|
|
22
|
+
autoScroll?: boolean;
|
|
23
|
+
/** Pixel threshold for "near bottom" detection. Default: 64. */
|
|
24
|
+
autoScrollThreshold?: number;
|
|
25
|
+
/** Class applied to the inner stack of messages. */
|
|
26
|
+
stackClassName?: string;
|
|
27
|
+
/** Aria label for the live region wrapping the message list. */
|
|
28
|
+
"aria-label"?: string;
|
|
29
|
+
ref?: Ref<HTMLDivElement>;
|
|
30
|
+
}
|
|
31
|
+
declare function AgentChatMessages({ children, className, stackClassName, spacing, autoScroll, autoScrollThreshold, ref, ...props }: AgentChatMessagesProps): ReactElement;
|
|
32
|
+
declare namespace AgentChatMessages {
|
|
33
|
+
var displayName: string;
|
|
34
|
+
}
|
|
35
|
+
export declare const agentChatBubbleFromIds: readonly ["user", "assistant"];
|
|
36
|
+
export type AgentChatBubbleFromId = (typeof agentChatBubbleFromIds)[number];
|
|
37
|
+
export interface AgentChatBubbleProps extends MotionDivAttributes {
|
|
38
|
+
/** Who sent the message. Drives alignment and color. */
|
|
39
|
+
from: AgentChatBubbleFromId;
|
|
40
|
+
/** Optional avatar slot — render `<Avatar />` here. */
|
|
41
|
+
avatar?: ReactNode;
|
|
42
|
+
/** Optional sender name rendered above the bubble. */
|
|
43
|
+
senderName?: ReactNode;
|
|
44
|
+
/** Optional timestamp rendered next to the sender name. */
|
|
45
|
+
timestamp?: ReactNode;
|
|
46
|
+
/** Class applied directly to the colored bubble element. */
|
|
47
|
+
bubbleClassName?: string;
|
|
48
|
+
ref?: Ref<HTMLDivElement>;
|
|
49
|
+
}
|
|
50
|
+
declare function AgentChatBubble({ from, avatar, senderName, timestamp, className, bubbleClassName, children, ref, ...props }: AgentChatBubbleProps): ReactElement;
|
|
51
|
+
declare namespace AgentChatBubble {
|
|
52
|
+
var displayName: string;
|
|
53
|
+
}
|
|
54
|
+
export interface AgentTypingIndicatorProps extends MotionDivAttributes {
|
|
55
|
+
/** Optional avatar slot — render `<Avatar />` here. */
|
|
56
|
+
avatar?: ReactNode;
|
|
57
|
+
/** Accessible label announced by screen readers. */
|
|
58
|
+
label?: string;
|
|
59
|
+
ref?: Ref<HTMLDivElement>;
|
|
60
|
+
}
|
|
61
|
+
declare function AgentTypingIndicator({ avatar, label, className, ref, ...props }: AgentTypingIndicatorProps): ReactElement;
|
|
62
|
+
declare namespace AgentTypingIndicator {
|
|
63
|
+
var displayName: string;
|
|
64
|
+
}
|
|
65
|
+
export declare const agentChatAnnouncementVariantIds: readonly ["default", "info", "warning", "destructive"];
|
|
66
|
+
export type AgentChatAnnouncementVariantId = (typeof agentChatAnnouncementVariantIds)[number];
|
|
67
|
+
declare const agentChatAnnouncementVariants: (props?: ({
|
|
68
|
+
variant?: "default" | "info" | "warning" | "destructive" | null | undefined;
|
|
69
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
70
|
+
export interface AgentChatAnnouncementProps extends MotionDivAttributes, VariantProps<typeof agentChatAnnouncementVariants> {
|
|
71
|
+
/** Override the default icon. Pass `null` to hide the icon. */
|
|
72
|
+
icon?: ReactNode | null;
|
|
73
|
+
ref?: Ref<HTMLDivElement>;
|
|
74
|
+
}
|
|
75
|
+
declare function AgentChatAnnouncement({ className, variant, icon, children, ref, ...props }: AgentChatAnnouncementProps): ReactElement;
|
|
76
|
+
declare namespace AgentChatAnnouncement {
|
|
77
|
+
var displayName: string;
|
|
78
|
+
}
|
|
79
|
+
export declare const agentChatHILMessageToneIds: readonly ["default", "primary", "warning"];
|
|
80
|
+
export type AgentChatHILMessageToneId = (typeof agentChatHILMessageToneIds)[number];
|
|
81
|
+
declare const agentChatHILMessageVariants: (props?: ({
|
|
82
|
+
tone?: "default" | "warning" | "primary" | null | undefined;
|
|
83
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
84
|
+
export interface AgentChatHILMessageProps extends MotionDivAttributes, VariantProps<typeof agentChatHILMessageVariants> {
|
|
85
|
+
/** Small uppercase label rendered at the top of the container. */
|
|
86
|
+
label?: ReactNode;
|
|
87
|
+
/** Icon rendered next to the label. Defaults to a Sparkles glyph when label is set. */
|
|
88
|
+
icon?: ReactNode | null;
|
|
89
|
+
ref?: Ref<HTMLDivElement>;
|
|
90
|
+
}
|
|
91
|
+
declare function AgentChatHILMessage({ className, tone, label, icon, children, ref, ...props }: AgentChatHILMessageProps): ReactElement;
|
|
92
|
+
declare namespace AgentChatHILMessage {
|
|
93
|
+
var displayName: string;
|
|
94
|
+
}
|
|
95
|
+
export { AgentChatMessages, AgentChatBubble, AgentTypingIndicator, AgentChatAnnouncement, AgentChatHILMessage, };
|
|
@@ -0,0 +1,180 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
|
+
import { Children, useCallback, useEffect, useRef, } from "react";
|
|
4
|
+
import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
|
|
5
|
+
import { cva } from "class-variance-authority";
|
|
6
|
+
import { Info, AlertTriangle, AlertOctagon, Sparkles } from "lucide-react";
|
|
7
|
+
import { AnimatePresence, domAnimation, LazyMotion, m, useReducedMotion, } from "../../../framer-motion";
|
|
8
|
+
import { cn } from "../../../lib/utils";
|
|
9
|
+
/* ------------------------------------------------------------------ */
|
|
10
|
+
/* Container */
|
|
11
|
+
/* ------------------------------------------------------------------ */
|
|
12
|
+
export const agentChatMessagesSpacingIds = [
|
|
13
|
+
"compact",
|
|
14
|
+
"default",
|
|
15
|
+
"relaxed",
|
|
16
|
+
];
|
|
17
|
+
const agentChatMessagesStackVariants = cva("flex flex-col px-4 py-4 min-h-full", {
|
|
18
|
+
variants: {
|
|
19
|
+
spacing: {
|
|
20
|
+
compact: "gap-2",
|
|
21
|
+
default: "gap-4",
|
|
22
|
+
relaxed: "gap-6",
|
|
23
|
+
},
|
|
24
|
+
},
|
|
25
|
+
defaultVariants: {
|
|
26
|
+
spacing: "default",
|
|
27
|
+
},
|
|
28
|
+
});
|
|
29
|
+
function AgentChatMessages({ children, className, stackClassName, spacing, autoScroll = true, autoScrollThreshold = 64, ref, ...props }) {
|
|
30
|
+
const viewportRef = useRef(null);
|
|
31
|
+
const sentinelRef = useRef(null);
|
|
32
|
+
const stickToBottomRef = useRef(true);
|
|
33
|
+
const hasMountedRef = useRef(false);
|
|
34
|
+
const prefersReducedMotion = useReducedMotion();
|
|
35
|
+
const childCount = Children.count(children);
|
|
36
|
+
const ariaLabel = props["aria-label"] ?? "Chat transcript";
|
|
37
|
+
const handleScroll = useCallback(() => {
|
|
38
|
+
const viewport = viewportRef.current;
|
|
39
|
+
if (!viewport)
|
|
40
|
+
return;
|
|
41
|
+
const distanceFromBottom = viewport.scrollHeight - viewport.scrollTop - viewport.clientHeight;
|
|
42
|
+
stickToBottomRef.current = distanceFromBottom <= autoScrollThreshold;
|
|
43
|
+
}, [autoScrollThreshold]);
|
|
44
|
+
useEffect(() => {
|
|
45
|
+
if (!autoScroll)
|
|
46
|
+
return;
|
|
47
|
+
const sentinel = sentinelRef.current;
|
|
48
|
+
if (!sentinel)
|
|
49
|
+
return;
|
|
50
|
+
const behavior = !hasMountedRef.current || prefersReducedMotion ? "auto" : "smooth";
|
|
51
|
+
if (!hasMountedRef.current || stickToBottomRef.current) {
|
|
52
|
+
sentinel.scrollIntoView({ block: "end", behavior });
|
|
53
|
+
}
|
|
54
|
+
hasMountedRef.current = true;
|
|
55
|
+
}, [autoScroll, childCount, prefersReducedMotion]);
|
|
56
|
+
return (_jsxs(ScrollAreaPrimitive.Root, { ref: ref, "data-slot": "agent-chat-messages", className: cn("relative h-full w-full overflow-hidden", className), ...props, children: [_jsx(ScrollAreaPrimitive.Viewport, { ref: viewportRef, onScroll: handleScroll, "data-slot": "agent-chat-messages-viewport", className: "h-full w-full focus-visible:outline-none", children: _jsx(LazyMotion, { features: domAnimation, strict: true, children: _jsxs("div", { role: "log", "aria-live": "polite", "aria-relevant": "additions", "aria-atomic": "false", "aria-label": ariaLabel, className: cn(agentChatMessagesStackVariants({ spacing }), stackClassName), children: [_jsx(AnimatePresence, { initial: false, children: children }), _jsx("div", { ref: sentinelRef, "aria-hidden": "true", className: "h-px w-full" })] }) }) }), _jsx(ScrollAreaPrimitive.ScrollAreaScrollbar, { orientation: "vertical", className: "flex h-full w-2.5 touch-none border-l border-l-transparent p-px transition-colors select-none", children: _jsx(ScrollAreaPrimitive.ScrollAreaThumb, { className: "relative flex-1 rounded-full bg-border" }) }), _jsx(ScrollAreaPrimitive.Corner, {})] }));
|
|
57
|
+
}
|
|
58
|
+
AgentChatMessages.displayName = "AgentChatMessages";
|
|
59
|
+
/* ------------------------------------------------------------------ */
|
|
60
|
+
/* Shared motion props */
|
|
61
|
+
/* ------------------------------------------------------------------ */
|
|
62
|
+
const messageMotionProps = {
|
|
63
|
+
initial: { opacity: 0, y: 8 },
|
|
64
|
+
animate: { opacity: 1, y: 0 },
|
|
65
|
+
exit: { opacity: 0, y: -4 },
|
|
66
|
+
transition: { duration: 0.18, ease: "easeOut" },
|
|
67
|
+
};
|
|
68
|
+
const reducedMotionProps = {
|
|
69
|
+
initial: false,
|
|
70
|
+
animate: { opacity: 1 },
|
|
71
|
+
exit: { opacity: 0 },
|
|
72
|
+
transition: { duration: 0 },
|
|
73
|
+
};
|
|
74
|
+
function useMessageMotionProps() {
|
|
75
|
+
const reduced = useReducedMotion();
|
|
76
|
+
return reduced ? reducedMotionProps : messageMotionProps;
|
|
77
|
+
}
|
|
78
|
+
/* ------------------------------------------------------------------ */
|
|
79
|
+
/* Bubble */
|
|
80
|
+
/* ------------------------------------------------------------------ */
|
|
81
|
+
export const agentChatBubbleFromIds = ["user", "assistant"];
|
|
82
|
+
const agentChatBubbleRowVariants = cva("flex w-full items-end gap-2", {
|
|
83
|
+
variants: {
|
|
84
|
+
from: {
|
|
85
|
+
user: "flex-row-reverse",
|
|
86
|
+
assistant: "flex-row",
|
|
87
|
+
},
|
|
88
|
+
},
|
|
89
|
+
defaultVariants: {
|
|
90
|
+
from: "assistant",
|
|
91
|
+
},
|
|
92
|
+
});
|
|
93
|
+
const agentChatBubbleVariants = cva("max-w-[80%] whitespace-pre-wrap break-words rounded-2xl px-4 py-2.5 text-sm shadow-sm", {
|
|
94
|
+
variants: {
|
|
95
|
+
from: {
|
|
96
|
+
user: "bg-primary text-primary-foreground rounded-br-sm",
|
|
97
|
+
assistant: "bg-muted text-foreground rounded-bl-sm",
|
|
98
|
+
},
|
|
99
|
+
},
|
|
100
|
+
defaultVariants: {
|
|
101
|
+
from: "assistant",
|
|
102
|
+
},
|
|
103
|
+
});
|
|
104
|
+
function AgentChatBubble({ from, avatar, senderName, timestamp, className, bubbleClassName, children, ref, ...props }) {
|
|
105
|
+
const motionProps = useMessageMotionProps();
|
|
106
|
+
const hasHeader = senderName !== undefined || timestamp !== undefined;
|
|
107
|
+
return (_jsxs(m.div, { ref: ref, "data-slot": "agent-chat-bubble", "data-from": from, className: cn(agentChatBubbleRowVariants({ from }), className), ...motionProps, ...props, children: [avatar ? (_jsx("div", { className: "shrink-0", "aria-hidden": "true", children: avatar })) : null, _jsxs("div", { className: cn("flex flex-col gap-1", from === "user" ? "items-end" : "items-start"), children: [hasHeader ? (_jsxs("div", { className: cn("flex items-baseline gap-2 px-1 text-xs text-muted-foreground", from === "user" ? "flex-row-reverse" : "flex-row"), children: [senderName ? (_jsx("span", { className: "font-medium text-foreground", children: senderName })) : null, timestamp ? _jsx("span", { children: timestamp }) : null] })) : null, _jsx("div", { className: cn(agentChatBubbleVariants({ from }), bubbleClassName), children: children })] })] }));
|
|
108
|
+
}
|
|
109
|
+
AgentChatBubble.displayName = "AgentChatBubble";
|
|
110
|
+
function AgentTypingIndicator({ avatar, label = "Assistant is typing", className, ref, ...props }) {
|
|
111
|
+
const motionProps = useMessageMotionProps();
|
|
112
|
+
const prefersReducedMotion = useReducedMotion();
|
|
113
|
+
return (_jsxs(m.div, { ref: ref, "data-slot": "agent-typing-indicator", role: "status", "aria-live": "polite", "aria-label": label, className: cn("flex w-full items-end gap-2", className), ...motionProps, ...props, children: [avatar ? (_jsx("div", { className: "shrink-0", "aria-hidden": "true", children: avatar })) : null, _jsx("div", { className: "inline-flex items-center gap-1 rounded-2xl rounded-bl-sm bg-muted px-4 py-3 text-foreground shadow-sm", children: prefersReducedMotion ? (_jsx("span", { "aria-hidden": "true", className: "text-sm leading-none text-muted-foreground", children: "\u2026" })) : (_jsxs(_Fragment, { children: [_jsx("span", { "aria-hidden": "true", className: "h-2 w-2 rounded-full bg-muted-foreground animate-bounce motion-reduce:animate-none" }), _jsx("span", { "aria-hidden": "true", className: "h-2 w-2 rounded-full bg-muted-foreground animate-bounce [animation-delay:150ms] motion-reduce:animate-none" }), _jsx("span", { "aria-hidden": "true", className: "h-2 w-2 rounded-full bg-muted-foreground animate-bounce [animation-delay:300ms] motion-reduce:animate-none" })] })) })] }));
|
|
114
|
+
}
|
|
115
|
+
AgentTypingIndicator.displayName = "AgentTypingIndicator";
|
|
116
|
+
/* ------------------------------------------------------------------ */
|
|
117
|
+
/* Announcement */
|
|
118
|
+
/* ------------------------------------------------------------------ */
|
|
119
|
+
export const agentChatAnnouncementVariantIds = [
|
|
120
|
+
"default",
|
|
121
|
+
"info",
|
|
122
|
+
"warning",
|
|
123
|
+
"destructive",
|
|
124
|
+
];
|
|
125
|
+
const agentChatAnnouncementVariants = cva("mx-auto inline-flex items-center gap-2 rounded-full border px-3 py-1 text-xs font-medium [&>svg]:size-3.5 [&>svg]:shrink-0", {
|
|
126
|
+
variants: {
|
|
127
|
+
variant: {
|
|
128
|
+
default: "border-border bg-muted/60 text-muted-foreground",
|
|
129
|
+
info: "border-primary/20 bg-primary/10 text-primary [&>svg]:text-primary",
|
|
130
|
+
warning: "border-warning/30 bg-warning/10 text-warning [&>svg]:text-warning",
|
|
131
|
+
destructive: "border-destructive/30 bg-destructive/10 text-destructive [&>svg]:text-destructive",
|
|
132
|
+
},
|
|
133
|
+
},
|
|
134
|
+
defaultVariants: {
|
|
135
|
+
variant: "default",
|
|
136
|
+
},
|
|
137
|
+
});
|
|
138
|
+
const announcementDefaultIcons = {
|
|
139
|
+
default: null,
|
|
140
|
+
info: _jsx(Info, {}),
|
|
141
|
+
warning: _jsx(AlertTriangle, {}),
|
|
142
|
+
destructive: _jsx(AlertOctagon, {}),
|
|
143
|
+
};
|
|
144
|
+
function AgentChatAnnouncement({ className, variant = "default", icon, children, ref, ...props }) {
|
|
145
|
+
const motionProps = useMessageMotionProps();
|
|
146
|
+
const resolvedIcon = icon === null
|
|
147
|
+
? null
|
|
148
|
+
: icon ?? announcementDefaultIcons[variant ?? "default"];
|
|
149
|
+
return (_jsx(m.div, { ref: ref, "data-slot": "agent-chat-announcement", role: "status", className: cn("flex w-full justify-center", className), ...motionProps, children: _jsxs("div", { className: cn(agentChatAnnouncementVariants({ variant })), ...props, children: [resolvedIcon, _jsx("span", { children: children })] }) }));
|
|
150
|
+
}
|
|
151
|
+
AgentChatAnnouncement.displayName = "AgentChatAnnouncement";
|
|
152
|
+
/* ------------------------------------------------------------------ */
|
|
153
|
+
/* Human-in-the-loop message */
|
|
154
|
+
/* ------------------------------------------------------------------ */
|
|
155
|
+
export const agentChatHILMessageToneIds = [
|
|
156
|
+
"default",
|
|
157
|
+
"primary",
|
|
158
|
+
"warning",
|
|
159
|
+
];
|
|
160
|
+
const agentChatHILMessageVariants = cva("relative w-full rounded-lg border border-dashed bg-card text-card-foreground p-4 shadow-sm", {
|
|
161
|
+
variants: {
|
|
162
|
+
tone: {
|
|
163
|
+
default: "border-border",
|
|
164
|
+
primary: "border-primary/40 bg-primary/5",
|
|
165
|
+
warning: "border-warning/40 bg-warning/5",
|
|
166
|
+
},
|
|
167
|
+
},
|
|
168
|
+
defaultVariants: {
|
|
169
|
+
tone: "default",
|
|
170
|
+
},
|
|
171
|
+
});
|
|
172
|
+
function AgentChatHILMessage({ className, tone, label, icon, children, ref, ...props }) {
|
|
173
|
+
const motionProps = useMessageMotionProps();
|
|
174
|
+
const resolvedIcon = icon === null ? null : icon ?? (label ? _jsx(Sparkles, { className: "size-3.5" }) : null);
|
|
175
|
+
const ariaLabel = typeof label === "string" ? label : undefined;
|
|
176
|
+
return (_jsxs(m.div, { ref: ref, "data-slot": "agent-chat-hil-message", role: "group", "aria-label": ariaLabel ?? "Human-in-the-loop request", className: cn(agentChatHILMessageVariants({ tone }), className), ...motionProps, ...props, children: [label !== undefined ? (_jsxs("div", { className: "mb-3 flex items-center gap-1.5 text-xs font-semibold uppercase tracking-wide text-muted-foreground", children: [resolvedIcon, _jsx("span", { children: label })] })) : null, _jsx("div", { children: children })] }));
|
|
177
|
+
}
|
|
178
|
+
AgentChatHILMessage.displayName = "AgentChatHILMessage";
|
|
179
|
+
export { AgentChatMessages, AgentChatBubble, AgentTypingIndicator, AgentChatAnnouncement, AgentChatHILMessage, };
|
|
180
|
+
//# sourceMappingURL=agent-chat-messages.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"agent-chat-messages.js","sourceRoot":"","sources":["../../../../src/components/ui/agent-chat-messages/agent-chat-messages.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/ui/agent-chat-messages/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC"}
|
|
@@ -3,7 +3,7 @@ import { HTMLAttributes, ReactElement, Ref } from "react";
|
|
|
3
3
|
export declare const alertVariantIds: ["default", "destructive", "warning"];
|
|
4
4
|
export type AlertVariantId = (typeof alertVariantIds)[number];
|
|
5
5
|
declare const alertVariants: (props?: ({
|
|
6
|
-
variant?: "default" | "
|
|
6
|
+
variant?: "default" | "warning" | "destructive" | null | undefined;
|
|
7
7
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
8
8
|
export interface AlertProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {
|
|
9
9
|
ref?: Ref<HTMLDivElement>;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import type { ComponentProps } from "react";
|
|
2
2
|
import { type VariantProps } from "class-variance-authority";
|
|
3
3
|
declare const badgeVariants: (props?: ({
|
|
4
|
-
variant?: "default" | "destructive" | "
|
|
4
|
+
variant?: "default" | "destructive" | "outline" | "secondary" | null | undefined;
|
|
5
5
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
6
6
|
declare function Badge({ className, variant, asChild, ...props }: ComponentProps<"span"> & VariantProps<typeof badgeVariants> & {
|
|
7
7
|
asChild?: boolean;
|
|
@@ -3,7 +3,7 @@ import { type VariantProps } from "class-variance-authority";
|
|
|
3
3
|
export declare const bannerVariantIds: ["info", "success", "warning", "destructive"];
|
|
4
4
|
export type BannerVariantId = (typeof bannerVariantIds)[number];
|
|
5
5
|
declare const bannerVariants: (props?: ({
|
|
6
|
-
variant?: "
|
|
6
|
+
variant?: "info" | "warning" | "destructive" | "success" | null | undefined;
|
|
7
7
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
8
8
|
export interface BannerProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof bannerVariants> {
|
|
9
9
|
ref?: Ref<HTMLDivElement>;
|
|
@@ -3,7 +3,7 @@ import { type VariantProps } from "class-variance-authority";
|
|
|
3
3
|
import { type BreadcrumbSeparatorVariant, type BreadcrumbSize, type BreadcrumbVariant } from "./breadcrumb-variants";
|
|
4
4
|
declare const breadcrumbListVariants: (props?: ({
|
|
5
5
|
size?: "sm" | "default" | "lg" | null | undefined;
|
|
6
|
-
variant?: "default" | "
|
|
6
|
+
variant?: "default" | "primary" | "ghost" | "muted" | null | undefined;
|
|
7
7
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
8
8
|
export interface BreadcrumbProps extends ComponentPropsWithoutRef<"nav"> {
|
|
9
9
|
separator?: BreadcrumbSeparatorVariant;
|
|
@@ -3,7 +3,7 @@ import type { ReactElement, ButtonHTMLAttributes } from "react";
|
|
|
3
3
|
export declare const buttonVariantIds: ["default", "destructive", "outline", "secondary", "ghost", "link"];
|
|
4
4
|
export type ButtonVariantId = (typeof buttonVariantIds)[number];
|
|
5
5
|
export declare const buttonVariants: (props?: ({
|
|
6
|
-
variant?: "default" | "link" | "
|
|
6
|
+
variant?: "default" | "link" | "destructive" | "outline" | "ghost" | "secondary" | null | undefined;
|
|
7
7
|
size?: "sm" | "default" | "lg" | "icon" | null | undefined;
|
|
8
8
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
9
9
|
export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
|
|
@@ -2,7 +2,7 @@ import { type VariantProps } from "class-variance-authority";
|
|
|
2
2
|
import { type ComponentProps, type MouseEvent, type ReactNode } from "react";
|
|
3
3
|
import { chipSizeIds, chipVariantIds, type ChipSize, type ChipVariant } from "./chip-variants";
|
|
4
4
|
declare const chipVariants: (props?: ({
|
|
5
|
-
variant?: "default" | "
|
|
5
|
+
variant?: "default" | "warning" | "destructive" | "primary" | "outline" | "secondary" | "success" | null | undefined;
|
|
6
6
|
size?: "sm" | "default" | "lg" | null | undefined;
|
|
7
7
|
disabled?: boolean | null | undefined;
|
|
8
8
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -4,7 +4,7 @@ export declare const circularProgressVariants: (props?: ({
|
|
|
4
4
|
size?: "sm" | "default" | "lg" | "xl" | null | undefined;
|
|
5
5
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
6
6
|
export declare const circularProgressIndicatorVariants: (props?: ({
|
|
7
|
-
color?: "default" | "
|
|
7
|
+
color?: "default" | "warning" | "destructive" | "positive" | null | undefined;
|
|
8
8
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
9
9
|
export declare const circularProgressLabelVariants: (props?: ({
|
|
10
10
|
size?: "sm" | "default" | "lg" | "xl" | null | undefined;
|
|
@@ -4,7 +4,7 @@ import { colorSwatchShapeIds, colorSwatchSizeIds, colorSwatchVariantIds, type Co
|
|
|
4
4
|
declare const colorSwatchVariants: (props?: ({
|
|
5
5
|
size?: "xs" | "sm" | "default" | "lg" | "xl" | null | undefined;
|
|
6
6
|
shape?: "circle" | "square" | "rounded" | null | undefined;
|
|
7
|
-
variant?: "default" | "
|
|
7
|
+
variant?: "default" | "outline" | "ghost" | null | undefined;
|
|
8
8
|
interactive?: boolean | null | undefined;
|
|
9
9
|
selected?: boolean | null | undefined;
|
|
10
10
|
disabled?: boolean | null | undefined;
|
|
@@ -5,7 +5,7 @@ export type ComboboxVariantId = (typeof comboboxVariantIds)[number];
|
|
|
5
5
|
export declare const comboboxSizeIds: readonly ["sm", "default", "lg"];
|
|
6
6
|
export type ComboboxSizeId = (typeof comboboxSizeIds)[number];
|
|
7
7
|
export declare const comboboxTriggerVariants: (props?: ({
|
|
8
|
-
variant?: "default" | "
|
|
8
|
+
variant?: "default" | "outline" | "ghost" | null | undefined;
|
|
9
9
|
size?: "sm" | "default" | "lg" | null | undefined;
|
|
10
10
|
fullWidth?: boolean | null | undefined;
|
|
11
11
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -2,7 +2,7 @@ import { type VariantProps } from "class-variance-authority";
|
|
|
2
2
|
import { type ButtonHTMLAttributes, type ReactElement, type ReactNode, type Ref } from "react";
|
|
3
3
|
import { type CopyButtonSize, type CopyButtonVariant, copyButtonSizeIds, copyButtonVariantIds } from "./copy-button-variants";
|
|
4
4
|
declare const copyButtonVariants: (props?: ({
|
|
5
|
-
variant?: "default" | "
|
|
5
|
+
variant?: "default" | "outline" | "ghost" | "subtle" | "brand" | null | undefined;
|
|
6
6
|
size?: "sm" | "lg" | "md" | "icon-sm" | "icon-md" | "icon-lg" | null | undefined;
|
|
7
7
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
8
8
|
export interface CopyButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "children" | "onCopy">, VariantProps<typeof copyButtonVariants> {
|
|
@@ -22,7 +22,7 @@ export declare const countdownSegmentVariants: (props?: ({
|
|
|
22
22
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
23
23
|
export declare const countdownDigitVariants: (props?: ({
|
|
24
24
|
size?: "sm" | "default" | "lg" | null | undefined;
|
|
25
|
-
color?: "default" | "
|
|
25
|
+
color?: "default" | "warning" | "destructive" | "brand" | null | undefined;
|
|
26
26
|
variant?: "compact" | "boxed" | "plain" | null | undefined;
|
|
27
27
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
28
28
|
export declare const countdownLabelVariants: (props?: ({
|
|
@@ -5,7 +5,7 @@ export type EmptyStateVariantId = (typeof emptyStateVariantIds)[number];
|
|
|
5
5
|
export declare const emptyStateSizeIds: ["sm", "md", "lg"];
|
|
6
6
|
export type EmptyStateSizeId = (typeof emptyStateSizeIds)[number];
|
|
7
7
|
declare const emptyStateVariants: (props?: ({
|
|
8
|
-
variant?: "default" | "
|
|
8
|
+
variant?: "default" | "warning" | "destructive" | "muted" | null | undefined;
|
|
9
9
|
size?: "sm" | "lg" | "md" | null | undefined;
|
|
10
10
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
11
11
|
export interface EmptyStateProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof emptyStateVariants> {
|
|
@@ -16,7 +16,7 @@ declare namespace EmptyState {
|
|
|
16
16
|
var displayName: string;
|
|
17
17
|
}
|
|
18
18
|
declare const emptyStateIconVariants: (props?: ({
|
|
19
|
-
variant?: "default" | "
|
|
19
|
+
variant?: "default" | "warning" | "destructive" | "muted" | null | undefined;
|
|
20
20
|
size?: "sm" | "lg" | "md" | null | undefined;
|
|
21
21
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
22
22
|
export interface EmptyStateIconProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof emptyStateIconVariants> {
|
|
@@ -7,7 +7,7 @@ export type FloatingActionButtonSizeId = (typeof floatingActionButtonSizeIds)[nu
|
|
|
7
7
|
export declare const floatingActionButtonPositionIds: ["bottom-right", "bottom-left", "top-right", "top-left", "static"];
|
|
8
8
|
export type FloatingActionButtonPositionId = (typeof floatingActionButtonPositionIds)[number];
|
|
9
9
|
declare const floatingActionButtonVariants: (props?: ({
|
|
10
|
-
variant?: "destructive" | "
|
|
10
|
+
variant?: "destructive" | "primary" | "outline" | "secondary" | "brand" | null | undefined;
|
|
11
11
|
size?: "sm" | "default" | "lg" | null | undefined;
|
|
12
12
|
extended?: boolean | null | undefined;
|
|
13
13
|
position?: "static" | "bottom-right" | "bottom-left" | "top-right" | "top-left" | null | undefined;
|
|
@@ -8,7 +8,7 @@ export declare const gaugeVariants: (props?: ({
|
|
|
8
8
|
size?: "sm" | "default" | "lg" | "xl" | null | undefined;
|
|
9
9
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
10
10
|
export declare const gaugeIndicatorVariants: (props?: ({
|
|
11
|
-
color?: "default" | "
|
|
11
|
+
color?: "default" | "warning" | "destructive" | "positive" | null | undefined;
|
|
12
12
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
13
13
|
export declare const gaugeValueLabelVariants: (props?: ({
|
|
14
14
|
size?: "sm" | "default" | "lg" | "xl" | null | undefined;
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
export * from "./avatar";
|
|
2
2
|
export type * from "./avatar";
|
|
3
|
+
export * from "./agent-chat-messages";
|
|
4
|
+
export type * from "./agent-chat-messages";
|
|
3
5
|
export * from "./accordion";
|
|
4
6
|
export type * from "./accordion";
|
|
5
7
|
export * from "./alert";
|
|
@@ -104,6 +106,8 @@ export * from "./progress-bar";
|
|
|
104
106
|
export type * from "./progress-bar";
|
|
105
107
|
export * from "./circular-progress";
|
|
106
108
|
export type * from "./circular-progress";
|
|
109
|
+
export * from "./scroll-progress";
|
|
110
|
+
export type * from "./scroll-progress";
|
|
107
111
|
export * from "./gauge";
|
|
108
112
|
export type * from "./gauge";
|
|
109
113
|
export * from "./breadcrumb";
|
|
@@ -168,3 +172,5 @@ export * from "./countdown";
|
|
|
168
172
|
export type * from "./countdown";
|
|
169
173
|
export * from "./floating-action-button";
|
|
170
174
|
export type * from "./floating-action-button";
|
|
175
|
+
export * from "./notification-bell";
|
|
176
|
+
export type * from "./notification-bell";
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
export * from "./avatar";
|
|
2
|
+
export * from "./agent-chat-messages";
|
|
2
3
|
export * from "./accordion";
|
|
3
4
|
export * from "./alert";
|
|
4
5
|
export * from "./callout";
|
|
@@ -51,6 +52,7 @@ export * from "./slider";
|
|
|
51
52
|
export * from "./switch";
|
|
52
53
|
export * from "./progress-bar";
|
|
53
54
|
export * from "./circular-progress";
|
|
55
|
+
export * from "./scroll-progress";
|
|
54
56
|
export * from "./gauge";
|
|
55
57
|
export * from "./breadcrumb";
|
|
56
58
|
export * from "./pagination";
|
|
@@ -83,4 +85,5 @@ export * from "./tree-view";
|
|
|
83
85
|
export * from "./carousel";
|
|
84
86
|
export * from "./countdown";
|
|
85
87
|
export * from "./floating-action-button";
|
|
88
|
+
export * from "./notification-bell";
|
|
86
89
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ui/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AAGzB,cAAc,aAAa,CAAC;AAG5B,cAAc,SAAS,CAAC;AAGxB,cAAc,WAAW,CAAC;AAG1B,cAAc,SAAS,CAAC;AAGxB,cAAc,mBAAmB,CAAC;AAGlC,cAAc,0BAA0B,CAAC;AAGzC,cAAc,UAAU,CAAC;AAGzB,cAAc,SAAS,CAAC;AAGxB,cAAc,kBAAkB,CAAC;AAGjC,cAAc,aAAa,CAAC;AAG5B,cAAc,kCAAkC,CAAC;AAGjD,cAAc,cAAc,CAAC;AAG7B,cAAc,SAAS,CAAC;AAGxB,cAAc,SAAS,CAAC;AAExB,cAAc,WAAW,CAAC;AAG1B,cAAc,YAAY,CAAC;AAG3B,cAAc,QAAQ,CAAC;AAGvB,cAAc,QAAQ,CAAC;AAGvB,cAAc,aAAa,CAAC;AAG5B,cAAc,iBAAiB,CAAC;AAGhC,cAAc,WAAW,CAAC;AAG1B,cAAc,mBAAmB,CAAC;AAGlC,cAAc,UAAU,CAAC;AAGzB,cAAc,WAAW,CAAC;AAG1B,cAAc,WAAW,CAAC;AAG1B,cAAc,YAAY,CAAC;AAG3B,cAAc,SAAS,CAAC;AAGxB,cAAc,aAAa,CAAC;AAG5B,cAAc,YAAY,CAAC;AAG3B,cAAc,YAAY,CAAC;AAG3B,cAAc,cAAc,CAAC;AAG7B,cAAc,eAAe,CAAC;AAG9B,cAAc,YAAY,CAAC;AAG3B,cAAc,2BAA2B,CAAC;AAG1C,cAAc,kBAAkB,CAAC;AAGjC,cAAc,gBAAgB,CAAC;AAG/B,cAAc,eAAe,CAAC;AAG9B,cAAc,WAAW,CAAC;AAG1B,cAAc,gBAAgB,CAAC;AAG/B,cAAc,cAAc,CAAC;AAG7B,cAAc,SAAS,CAAC;AAGxB,cAAc,UAAU,CAAC;AAGzB,cAAc,eAAe,CAAC;AAG9B,cAAc,qBAAqB,CAAC;AAGpC,cAAc,oBAAoB,CAAC;AAGnC,cAAc,mBAAmB,CAAC;AAGlC,cAAc,QAAQ,CAAC;AAGvB,cAAc,QAAQ,CAAC;AAGvB,cAAc,UAAU,CAAC;AAGzB,cAAc,UAAU,CAAC;AAGzB,cAAc,gBAAgB,CAAC;AAG/B,cAAc,qBAAqB,CAAC;AAGpC,cAAc,SAAS,CAAC;AAGxB,cAAc,cAAc,CAAC;AAG7B,cAAc,cAAc,CAAC;AAG7B,cAAc,OAAO,CAAC;AAGtB,cAAc,eAAe,CAAC;AAG9B,cAAc,WAAW,CAAC;AAG1B,cAAc,UAAU,CAAC;AAGzB,cAAc,eAAe,CAAC;AAG9B,cAAc,aAAa,CAAC;AAG5B,cAAc,YAAY,CAAC;AAG3B,cAAc,UAAU,CAAC;AAGzB,cAAc,gBAAgB,CAAC;AAG/B,cAAc,cAAc,CAAC;AAG7B,cAAc,eAAe,CAAC;AAG9B,cAAc,qBAAqB,CAAC;AAGpC,cAAc,WAAW,CAAC;AAG1B,cAAc,UAAU,CAAC;AAGzB,cAAc,QAAQ,CAAC;AAGvB,cAAc,cAAc,CAAC;AAG7B,cAAc,iBAAiB,CAAC;AAGhC,cAAc,aAAa,CAAC;AAG5B,cAAc,gBAAgB,CAAC;AAG/B,cAAc,gBAAgB,CAAC;AAG/B,cAAc,oBAAoB,CAAC;AAGnC,cAAc,aAAa,CAAC;AAG5B,cAAc,aAAa,CAAC;AAG5B,cAAc,qBAAqB,CAAC;AAGpC,cAAc,kBAAkB,CAAC;AAGjC,cAAc,aAAa,CAAC;AAG5B,cAAc,YAAY,CAAC;AAG3B,cAAc,aAAa,CAAC;AAG5B,cAAc,0BAA0B,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ui/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AAGzB,cAAc,uBAAuB,CAAC;AAGtC,cAAc,aAAa,CAAC;AAG5B,cAAc,SAAS,CAAC;AAGxB,cAAc,WAAW,CAAC;AAG1B,cAAc,SAAS,CAAC;AAGxB,cAAc,mBAAmB,CAAC;AAGlC,cAAc,0BAA0B,CAAC;AAGzC,cAAc,UAAU,CAAC;AAGzB,cAAc,SAAS,CAAC;AAGxB,cAAc,kBAAkB,CAAC;AAGjC,cAAc,aAAa,CAAC;AAG5B,cAAc,kCAAkC,CAAC;AAGjD,cAAc,cAAc,CAAC;AAG7B,cAAc,SAAS,CAAC;AAGxB,cAAc,SAAS,CAAC;AAExB,cAAc,WAAW,CAAC;AAG1B,cAAc,YAAY,CAAC;AAG3B,cAAc,QAAQ,CAAC;AAGvB,cAAc,QAAQ,CAAC;AAGvB,cAAc,aAAa,CAAC;AAG5B,cAAc,iBAAiB,CAAC;AAGhC,cAAc,WAAW,CAAC;AAG1B,cAAc,mBAAmB,CAAC;AAGlC,cAAc,UAAU,CAAC;AAGzB,cAAc,WAAW,CAAC;AAG1B,cAAc,WAAW,CAAC;AAG1B,cAAc,YAAY,CAAC;AAG3B,cAAc,SAAS,CAAC;AAGxB,cAAc,aAAa,CAAC;AAG5B,cAAc,YAAY,CAAC;AAG3B,cAAc,YAAY,CAAC;AAG3B,cAAc,cAAc,CAAC;AAG7B,cAAc,eAAe,CAAC;AAG9B,cAAc,YAAY,CAAC;AAG3B,cAAc,2BAA2B,CAAC;AAG1C,cAAc,kBAAkB,CAAC;AAGjC,cAAc,gBAAgB,CAAC;AAG/B,cAAc,eAAe,CAAC;AAG9B,cAAc,WAAW,CAAC;AAG1B,cAAc,gBAAgB,CAAC;AAG/B,cAAc,cAAc,CAAC;AAG7B,cAAc,SAAS,CAAC;AAGxB,cAAc,UAAU,CAAC;AAGzB,cAAc,eAAe,CAAC;AAG9B,cAAc,qBAAqB,CAAC;AAGpC,cAAc,oBAAoB,CAAC;AAGnC,cAAc,mBAAmB,CAAC;AAGlC,cAAc,QAAQ,CAAC;AAGvB,cAAc,QAAQ,CAAC;AAGvB,cAAc,UAAU,CAAC;AAGzB,cAAc,UAAU,CAAC;AAGzB,cAAc,gBAAgB,CAAC;AAG/B,cAAc,qBAAqB,CAAC;AAGpC,cAAc,mBAAmB,CAAC;AAGlC,cAAc,SAAS,CAAC;AAGxB,cAAc,cAAc,CAAC;AAG7B,cAAc,cAAc,CAAC;AAG7B,cAAc,OAAO,CAAC;AAGtB,cAAc,eAAe,CAAC;AAG9B,cAAc,WAAW,CAAC;AAG1B,cAAc,UAAU,CAAC;AAGzB,cAAc,eAAe,CAAC;AAG9B,cAAc,aAAa,CAAC;AAG5B,cAAc,YAAY,CAAC;AAG3B,cAAc,UAAU,CAAC;AAGzB,cAAc,gBAAgB,CAAC;AAG/B,cAAc,cAAc,CAAC;AAG7B,cAAc,eAAe,CAAC;AAG9B,cAAc,qBAAqB,CAAC;AAGpC,cAAc,WAAW,CAAC;AAG1B,cAAc,UAAU,CAAC;AAGzB,cAAc,QAAQ,CAAC;AAGvB,cAAc,cAAc,CAAC;AAG7B,cAAc,iBAAiB,CAAC;AAGhC,cAAc,aAAa,CAAC;AAG5B,cAAc,gBAAgB,CAAC;AAG/B,cAAc,gBAAgB,CAAC;AAG/B,cAAc,oBAAoB,CAAC;AAGnC,cAAc,aAAa,CAAC;AAG5B,cAAc,aAAa,CAAC;AAG5B,cAAc,qBAAqB,CAAC;AAGpC,cAAc,kBAAkB,CAAC;AAGjC,cAAc,aAAa,CAAC;AAG5B,cAAc,YAAY,CAAC;AAG3B,cAAc,aAAa,CAAC;AAG5B,cAAc,0BAA0B,CAAC;AAGzC,cAAc,qBAAqB,CAAC"}
|
|
@@ -2,7 +2,7 @@ import { type VariantProps } from "class-variance-authority";
|
|
|
2
2
|
import type { HTMLAttributes, ReactElement, ReactNode, Ref } from "react";
|
|
3
3
|
import { type KbdSize, type KbdVariant, kbdSizeIds, kbdVariantIds } from "./kbd-variants";
|
|
4
4
|
declare const kbdVariants: (props?: ({
|
|
5
|
-
variant?: "default" | "
|
|
5
|
+
variant?: "default" | "outline" | "solid" | "subtle" | null | undefined;
|
|
6
6
|
size?: "sm" | "lg" | "md" | null | undefined;
|
|
7
7
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
8
8
|
export interface KbdProps extends HTMLAttributes<HTMLElement>, VariantProps<typeof kbdVariants> {
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
export { NotificationBell, NotificationBell as default, notificationBellTriggerVariants, } from "./notification-bell";
|
|
2
|
+
export type { NotificationBellProps } from "./notification-bell";
|
|
3
|
+
export { notificationBellVariantIds, notificationBellSizeIds, notificationBellIndicatorVariantIds, } from "./notification-bell-variants";
|
|
4
|
+
export type { NotificationBellVariant, NotificationBellSize, NotificationBellIndicatorVariant, } from "./notification-bell-variants";
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
export { NotificationBell, NotificationBell as default, notificationBellTriggerVariants, } from "./notification-bell";
|
|
2
|
+
export { notificationBellVariantIds, notificationBellSizeIds, notificationBellIndicatorVariantIds, } from "./notification-bell-variants";
|
|
3
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/ui/notification-bell/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,gBAAgB,EAChB,gBAAgB,IAAI,OAAO,EAC3B,+BAA+B,GAChC,MAAM,qBAAqB,CAAC;AAE7B,OAAO,EACL,0BAA0B,EAC1B,uBAAuB,EACvB,mCAAmC,GACpC,MAAM,8BAA8B,CAAC"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
export declare const notificationBellVariantIds: readonly ["default", "outline", "ghost", "subtle", "brand"];
|
|
2
|
+
export type NotificationBellVariant = (typeof notificationBellVariantIds)[number];
|
|
3
|
+
export declare const notificationBellSizeIds: readonly ["sm", "md", "lg"];
|
|
4
|
+
export type NotificationBellSize = (typeof notificationBellSizeIds)[number];
|
|
5
|
+
export declare const notificationBellIndicatorVariantIds: readonly ["destructive", "primary", "success", "warning", "brand"];
|
|
6
|
+
export type NotificationBellIndicatorVariant = (typeof notificationBellIndicatorVariantIds)[number];
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
export const notificationBellVariantIds = [
|
|
2
|
+
"default",
|
|
3
|
+
"outline",
|
|
4
|
+
"ghost",
|
|
5
|
+
"subtle",
|
|
6
|
+
"brand",
|
|
7
|
+
];
|
|
8
|
+
export const notificationBellSizeIds = ["sm", "md", "lg"];
|
|
9
|
+
export const notificationBellIndicatorVariantIds = [
|
|
10
|
+
"destructive",
|
|
11
|
+
"primary",
|
|
12
|
+
"success",
|
|
13
|
+
"warning",
|
|
14
|
+
"brand",
|
|
15
|
+
];
|
|
16
|
+
//# sourceMappingURL=notification-bell-variants.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"notification-bell-variants.js","sourceRoot":"","sources":["../../../../src/components/ui/notification-bell/notification-bell-variants.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,0BAA0B,GAAG;IACxC,SAAS;IACT,SAAS;IACT,OAAO;IACP,QAAQ;IACR,OAAO;CAC6B,CAAC;AAIvC,MAAM,CAAC,MAAM,uBAAuB,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAsC,CAAC;AAG/F,MAAM,CAAC,MAAM,mCAAmC,GAAG;IACjD,aAAa;IACb,SAAS;IACT,SAAS;IACT,SAAS;IACT,OAAO;CAC6B,CAAC"}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import { type VariantProps } from "class-variance-authority";
|
|
2
|
+
import type { ButtonHTMLAttributes, ReactElement, Ref } from "react";
|
|
3
|
+
import { type NotificationBellIndicatorVariant } from "./notification-bell-variants";
|
|
4
|
+
declare const notificationBellTriggerVariants: (props?: ({
|
|
5
|
+
variant?: "default" | "outline" | "ghost" | "subtle" | "brand" | null | undefined;
|
|
6
|
+
size?: "sm" | "lg" | "md" | null | undefined;
|
|
7
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
8
|
+
export interface NotificationBellProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "children">, VariantProps<typeof notificationBellTriggerVariants> {
|
|
9
|
+
/**
|
|
10
|
+
* Number of unread notifications. When `0` (and `dot` is false), no
|
|
11
|
+
* indicator is shown. When greater than `maxCount`, the badge displays
|
|
12
|
+
* `${maxCount}+` instead of the raw value.
|
|
13
|
+
*/
|
|
14
|
+
count?: number;
|
|
15
|
+
/** Maximum count to show numerically. Defaults to `99`. */
|
|
16
|
+
maxCount?: number;
|
|
17
|
+
/**
|
|
18
|
+
* Render a dot indicator instead of a count. Useful when the exact number
|
|
19
|
+
* is not meaningful (e.g. "there is something new"). Takes precedence over
|
|
20
|
+
* `count` for the visual style; the count is still considered for whether
|
|
21
|
+
* to show the indicator at all unless `forceIndicator` is set.
|
|
22
|
+
*/
|
|
23
|
+
dot?: boolean;
|
|
24
|
+
/** Always show the indicator, even when `count` is `0`. */
|
|
25
|
+
forceIndicator?: boolean;
|
|
26
|
+
/** Animate a soft ping around the indicator. */
|
|
27
|
+
ping?: boolean;
|
|
28
|
+
/**
|
|
29
|
+
* Swap the bell glyph for an animated `BellRing` when the indicator is
|
|
30
|
+
* visible.
|
|
31
|
+
*/
|
|
32
|
+
ringWhenActive?: boolean;
|
|
33
|
+
/** Color/style applied to the count badge or dot. */
|
|
34
|
+
indicatorVariant?: NotificationBellIndicatorVariant;
|
|
35
|
+
/**
|
|
36
|
+
* Accessible label for the button. Defaults to `Notifications` (or
|
|
37
|
+
* `Notifications (N unread)` when a positive `count` is provided).
|
|
38
|
+
*/
|
|
39
|
+
"aria-label"?: string;
|
|
40
|
+
/** Forwarded to the underlying `<button>` element. */
|
|
41
|
+
ref?: Ref<HTMLButtonElement>;
|
|
42
|
+
}
|
|
43
|
+
export declare function NotificationBell({ className, variant, size, count, maxCount, dot, forceIndicator, ping, ringWhenActive, indicatorVariant, type, ref, ...props }: NotificationBellProps): ReactElement;
|
|
44
|
+
export declare namespace NotificationBell {
|
|
45
|
+
var displayName: string;
|
|
46
|
+
}
|
|
47
|
+
export { notificationBellTriggerVariants };
|
|
48
|
+
export default NotificationBell;
|
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { Bell, BellRing } from "lucide-react";
|
|
4
|
+
import { cva } from "class-variance-authority";
|
|
5
|
+
import { cn } from "../../../lib/utils";
|
|
6
|
+
const notificationBellTriggerVariants = cva("relative inline-flex items-center justify-center rounded-md ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50", {
|
|
7
|
+
variants: {
|
|
8
|
+
variant: {
|
|
9
|
+
default: "bg-primary text-primary-foreground hover:bg-primary/90",
|
|
10
|
+
outline: "border border-input bg-background text-foreground hover:bg-accent hover:text-accent-foreground",
|
|
11
|
+
ghost: "text-muted-foreground hover:bg-accent hover:text-foreground",
|
|
12
|
+
subtle: "bg-muted text-muted-foreground hover:bg-muted/80 hover:text-foreground",
|
|
13
|
+
brand: "bg-schemavaults-brand-blue text-primary-foreground hover:bg-schemavaults-brand-blue/90",
|
|
14
|
+
},
|
|
15
|
+
size: {
|
|
16
|
+
sm: "h-8 w-8 [&_svg]:size-4",
|
|
17
|
+
md: "h-9 w-9 [&_svg]:size-[18px]",
|
|
18
|
+
lg: "h-10 w-10 [&_svg]:size-5",
|
|
19
|
+
},
|
|
20
|
+
},
|
|
21
|
+
defaultVariants: {
|
|
22
|
+
variant: "ghost",
|
|
23
|
+
size: "md",
|
|
24
|
+
},
|
|
25
|
+
});
|
|
26
|
+
const indicatorVariants = cva("pointer-events-none absolute inline-flex items-center justify-center rounded-full font-medium tabular-nums ring-2 ring-background", {
|
|
27
|
+
variants: {
|
|
28
|
+
indicatorVariant: {
|
|
29
|
+
destructive: "bg-destructive text-white",
|
|
30
|
+
primary: "bg-primary text-primary-foreground",
|
|
31
|
+
success: "bg-green-500 text-white",
|
|
32
|
+
warning: "bg-yellow-500 text-black",
|
|
33
|
+
brand: "bg-schemavaults-brand-blue text-primary-foreground",
|
|
34
|
+
},
|
|
35
|
+
},
|
|
36
|
+
defaultVariants: {
|
|
37
|
+
indicatorVariant: "destructive",
|
|
38
|
+
},
|
|
39
|
+
});
|
|
40
|
+
const indicatorPingVariants = {
|
|
41
|
+
destructive: "bg-destructive",
|
|
42
|
+
primary: "bg-primary",
|
|
43
|
+
success: "bg-green-500",
|
|
44
|
+
warning: "bg-yellow-500",
|
|
45
|
+
brand: "bg-schemavaults-brand-blue",
|
|
46
|
+
};
|
|
47
|
+
const indicatorSizeClasses = {
|
|
48
|
+
sm: {
|
|
49
|
+
dot: "h-2 w-2",
|
|
50
|
+
count: "min-w-[14px] h-[14px] px-[3px] text-[9px] leading-none",
|
|
51
|
+
position: "-top-0.5 -right-0.5",
|
|
52
|
+
ping: "h-2 w-2",
|
|
53
|
+
},
|
|
54
|
+
md: {
|
|
55
|
+
dot: "h-2.5 w-2.5",
|
|
56
|
+
count: "min-w-[16px] h-[16px] px-1 text-[10px] leading-none",
|
|
57
|
+
position: "-top-0.5 -right-0.5",
|
|
58
|
+
ping: "h-2.5 w-2.5",
|
|
59
|
+
},
|
|
60
|
+
lg: {
|
|
61
|
+
dot: "h-3 w-3",
|
|
62
|
+
count: "min-w-[18px] h-[18px] px-1 text-[11px] leading-none",
|
|
63
|
+
position: "-top-1 -right-1",
|
|
64
|
+
ping: "h-3 w-3",
|
|
65
|
+
},
|
|
66
|
+
};
|
|
67
|
+
export function NotificationBell({ className, variant, size, count = 0, maxCount = 99, dot = false, forceIndicator = false, ping = false, ringWhenActive = false, indicatorVariant = "destructive", type = "button", ref, ...props }) {
|
|
68
|
+
const resolvedSize = size ?? "md";
|
|
69
|
+
const safeCount = Number.isFinite(count) && count > 0 ? Math.floor(count) : 0;
|
|
70
|
+
const showIndicator = forceIndicator || dot || safeCount > 0;
|
|
71
|
+
const displayLabel = safeCount > maxCount ? `${maxCount}+` : `${safeCount}`;
|
|
72
|
+
const sizeClasses = indicatorSizeClasses[resolvedSize];
|
|
73
|
+
const ariaLabel = props["aria-label"] ??
|
|
74
|
+
(safeCount > 0
|
|
75
|
+
? `Notifications (${safeCount} unread)`
|
|
76
|
+
: "Notifications");
|
|
77
|
+
const BellIcon = ringWhenActive && showIndicator ? BellRing : Bell;
|
|
78
|
+
return (_jsxs("button", { ref: ref, type: type, "aria-label": ariaLabel, className: cn(notificationBellTriggerVariants({ variant, size: resolvedSize }), className), ...props, children: [_jsx(BellIcon, { "aria-hidden": "true" }), showIndicator && (_jsx("span", { className: cn("absolute", sizeClasses.position), "aria-hidden": "true", children: _jsxs("span", { className: "relative flex items-center justify-center", children: [ping && (_jsx("span", { className: cn("absolute inline-flex rounded-full opacity-75 animate-ping", sizeClasses.ping, indicatorPingVariants[indicatorVariant]) })), _jsx("span", { className: cn(indicatorVariants({ indicatorVariant }), dot || safeCount === 0
|
|
79
|
+
? sizeClasses.dot
|
|
80
|
+
: sizeClasses.count), children: !dot && safeCount > 0 && displayLabel })] }) })), safeCount > 0 && (_jsxs("span", { className: "sr-only", "aria-live": "polite", children: [safeCount, " unread ", safeCount === 1 ? "notification" : "notifications"] }))] }));
|
|
81
|
+
}
|
|
82
|
+
NotificationBell.displayName = "NotificationBell";
|
|
83
|
+
export { notificationBellTriggerVariants };
|
|
84
|
+
export default NotificationBell;
|
|
85
|
+
//# sourceMappingURL=notification-bell.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"notification-bell.js","sourceRoot":"","sources":["../../../../src/components/ui/notification-bell/notification-bell.tsx"],"names":[],"mappings":"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"}
|
|
@@ -2,7 +2,7 @@ import { type VariantProps } from "class-variance-authority";
|
|
|
2
2
|
import { type ChangeEvent, type InputHTMLAttributes, type ReactElement, type ReactNode, type Ref } from "react";
|
|
3
3
|
import { type NumberInputStepperLayout } from "./number-input-variants";
|
|
4
4
|
declare const numberInputContainerVariants: (props?: ({
|
|
5
|
-
variant?: "default" | "
|
|
5
|
+
variant?: "default" | "outline" | "ghost" | null | undefined;
|
|
6
6
|
size?: "sm" | "lg" | "md" | null | undefined;
|
|
7
7
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
8
8
|
export interface NumberInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "value" | "defaultValue" | "onChange" | "size" | "type" | "prefix">, VariantProps<typeof numberInputContainerVariants> {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { type VariantProps } from "class-variance-authority";
|
|
2
2
|
import { type ComponentProps, type ReactElement, type Ref } from "react";
|
|
3
3
|
declare const numberTickerVariants: (props?: ({
|
|
4
|
-
variant?: "default" | "
|
|
4
|
+
variant?: "default" | "warning" | "destructive" | "primary" | "muted" | "success" | null | undefined;
|
|
5
5
|
size?: "sm" | "default" | "lg" | "xl" | "2xl" | "3xl" | null | undefined;
|
|
6
6
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
7
7
|
export type NumberTickerEase = "linear" | "easeIn" | "easeOut" | "easeInOut" | "circIn" | "circOut" | "circInOut" | "backIn" | "backOut" | "backInOut" | "anticipate";
|
|
@@ -27,7 +27,7 @@ declare namespace PaginationItem {
|
|
|
27
27
|
}
|
|
28
28
|
declare const paginationLinkVariants: (props?: ({
|
|
29
29
|
size?: "sm" | "default" | "lg" | null | undefined;
|
|
30
|
-
variant?: "default" | "
|
|
30
|
+
variant?: "default" | "outline" | "ghost" | null | undefined;
|
|
31
31
|
shape?: "square" | "rounded" | "pill" | null | undefined;
|
|
32
32
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
33
33
|
export interface PaginationLinkProps extends ComponentPropsWithoutRef<"a">, VariantProps<typeof paginationLinkVariants> {
|
|
@@ -4,7 +4,7 @@ export declare const progressBarVariants: (props?: ({
|
|
|
4
4
|
size?: "sm" | "default" | "lg" | null | undefined;
|
|
5
5
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
6
6
|
export declare const progressBarIndicatorVariants: (props?: ({
|
|
7
|
-
color?: "default" | "
|
|
7
|
+
color?: "default" | "warning" | "destructive" | "positive" | null | undefined;
|
|
8
8
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
9
9
|
export declare const progressBarSizeIds: readonly ["sm", "default", "lg"];
|
|
10
10
|
export type ProgressBarSizeId = (typeof progressBarSizeIds)[number];
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
export { ScrollProgress, scrollProgressVariants, scrollProgressIndicatorVariants, scrollProgressPositionIds, scrollProgressSizeIds, scrollProgressColorIds, } from "./scroll-progress";
|
|
2
|
+
export type * from "./scroll-progress";
|
|
3
|
+
export { ScrollProgress as default } from "./scroll-progress";
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
export { ScrollProgress, scrollProgressVariants, scrollProgressIndicatorVariants, scrollProgressPositionIds, scrollProgressSizeIds, scrollProgressColorIds, } from "./scroll-progress";
|
|
2
|
+
export { ScrollProgress as default } from "./scroll-progress";
|
|
3
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/ui/scroll-progress/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,cAAc,EACd,sBAAsB,EACtB,+BAA+B,EAC/B,yBAAyB,EACzB,qBAAqB,EACrB,sBAAsB,GACvB,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EAAE,cAAc,IAAI,OAAO,EAAE,MAAM,mBAAmB,CAAC"}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { type VariantProps } from "class-variance-authority";
|
|
2
|
+
import type { HTMLAttributes, ReactElement, RefObject } from "react";
|
|
3
|
+
export declare const scrollProgressPositionIds: ["top", "bottom", "static"];
|
|
4
|
+
export type ScrollProgressPositionId = (typeof scrollProgressPositionIds)[number];
|
|
5
|
+
export declare const scrollProgressSizeIds: ["sm", "default", "lg"];
|
|
6
|
+
export type ScrollProgressSizeId = (typeof scrollProgressSizeIds)[number];
|
|
7
|
+
export declare const scrollProgressColorIds: ["default", "brand", "primary", "positive", "warning", "destructive"];
|
|
8
|
+
export type ScrollProgressColorId = (typeof scrollProgressColorIds)[number];
|
|
9
|
+
export declare const scrollProgressVariants: (props?: ({
|
|
10
|
+
position?: "bottom" | "top" | "static" | null | undefined;
|
|
11
|
+
size?: "sm" | "default" | "lg" | null | undefined;
|
|
12
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
13
|
+
export declare const scrollProgressIndicatorVariants: (props?: ({
|
|
14
|
+
color?: "default" | "warning" | "destructive" | "primary" | "positive" | "brand" | null | undefined;
|
|
15
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
16
|
+
export interface ScrollProgressProps extends Omit<HTMLAttributes<HTMLDivElement>, "color">, VariantProps<typeof scrollProgressVariants>, VariantProps<typeof scrollProgressIndicatorVariants> {
|
|
17
|
+
/**
|
|
18
|
+
* Optional ref to a scroll container to track. When omitted, the component
|
|
19
|
+
* tracks the document/window scroll.
|
|
20
|
+
*/
|
|
21
|
+
containerRef?: RefObject<HTMLElement | null>;
|
|
22
|
+
/** Accessible label describing what the progress represents. */
|
|
23
|
+
label?: string;
|
|
24
|
+
/** Additional classes applied to the filled indicator. */
|
|
25
|
+
indicatorClassName?: string;
|
|
26
|
+
}
|
|
27
|
+
/**
|
|
28
|
+
* A horizontal scroll progress indicator that fills as the user scrolls a
|
|
29
|
+
* page or a scroll container. Useful for long-form content like articles,
|
|
30
|
+
* documentation, and changelogs to give the reader a sense of progress.
|
|
31
|
+
*
|
|
32
|
+
* When `containerRef` is omitted, the component tracks document/window scroll.
|
|
33
|
+
* Otherwise, it tracks the referenced element's vertical scroll progress.
|
|
34
|
+
*
|
|
35
|
+
* Animation uses a spring for a smooth follow, and respects
|
|
36
|
+
* `prefers-reduced-motion` by snapping directly to the scroll value.
|
|
37
|
+
*/
|
|
38
|
+
export declare function ScrollProgress({ position, size, color, containerRef, label, className, indicatorClassName, ...props }: ScrollProgressProps): ReactElement;
|
|
39
|
+
export declare namespace ScrollProgress {
|
|
40
|
+
var displayName: string;
|
|
41
|
+
}
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import { cva } from "class-variance-authority";
|
|
4
|
+
import { m, useScroll, useSpring, useReducedMotion, } from "../../../framer-motion";
|
|
5
|
+
import { cn } from "../../../lib/utils";
|
|
6
|
+
export const scrollProgressPositionIds = [
|
|
7
|
+
"top",
|
|
8
|
+
"bottom",
|
|
9
|
+
"static",
|
|
10
|
+
];
|
|
11
|
+
export const scrollProgressSizeIds = [
|
|
12
|
+
"sm",
|
|
13
|
+
"default",
|
|
14
|
+
"lg",
|
|
15
|
+
];
|
|
16
|
+
export const scrollProgressColorIds = [
|
|
17
|
+
"default",
|
|
18
|
+
"brand",
|
|
19
|
+
"primary",
|
|
20
|
+
"positive",
|
|
21
|
+
"warning",
|
|
22
|
+
"destructive",
|
|
23
|
+
];
|
|
24
|
+
export const scrollProgressVariants = cva("z-50 w-full origin-left bg-secondary/40 backdrop-blur-sm pointer-events-none", {
|
|
25
|
+
variants: {
|
|
26
|
+
position: {
|
|
27
|
+
top: "fixed left-0 right-0 top-0",
|
|
28
|
+
bottom: "fixed left-0 right-0 bottom-0",
|
|
29
|
+
static: "relative",
|
|
30
|
+
},
|
|
31
|
+
size: {
|
|
32
|
+
sm: "h-0.5",
|
|
33
|
+
default: "h-1",
|
|
34
|
+
lg: "h-1.5",
|
|
35
|
+
},
|
|
36
|
+
},
|
|
37
|
+
defaultVariants: {
|
|
38
|
+
position: "top",
|
|
39
|
+
size: "default",
|
|
40
|
+
},
|
|
41
|
+
});
|
|
42
|
+
export const scrollProgressIndicatorVariants = cva("h-full w-full origin-left transition-colors duration-300", {
|
|
43
|
+
variants: {
|
|
44
|
+
color: {
|
|
45
|
+
default: "bg-gradient-to-r from-schemavaults-brand-blue to-schemavaults-brand-red",
|
|
46
|
+
brand: "bg-schemavaults-brand-blue",
|
|
47
|
+
primary: "bg-primary",
|
|
48
|
+
positive: "bg-green-500",
|
|
49
|
+
warning: "bg-yellow-500",
|
|
50
|
+
destructive: "bg-destructive",
|
|
51
|
+
},
|
|
52
|
+
},
|
|
53
|
+
defaultVariants: {
|
|
54
|
+
color: "default",
|
|
55
|
+
},
|
|
56
|
+
});
|
|
57
|
+
/**
|
|
58
|
+
* A horizontal scroll progress indicator that fills as the user scrolls a
|
|
59
|
+
* page or a scroll container. Useful for long-form content like articles,
|
|
60
|
+
* documentation, and changelogs to give the reader a sense of progress.
|
|
61
|
+
*
|
|
62
|
+
* When `containerRef` is omitted, the component tracks document/window scroll.
|
|
63
|
+
* Otherwise, it tracks the referenced element's vertical scroll progress.
|
|
64
|
+
*
|
|
65
|
+
* Animation uses a spring for a smooth follow, and respects
|
|
66
|
+
* `prefers-reduced-motion` by snapping directly to the scroll value.
|
|
67
|
+
*/
|
|
68
|
+
export function ScrollProgress({ position, size, color, containerRef, label = "Page scroll progress", className, indicatorClassName, ...props }) {
|
|
69
|
+
const reduceMotion = useReducedMotion();
|
|
70
|
+
const { scrollYProgress } = useScroll(containerRef ? { container: containerRef } : undefined);
|
|
71
|
+
const smoothProgress = useSpring(scrollYProgress, {
|
|
72
|
+
stiffness: 140,
|
|
73
|
+
damping: 24,
|
|
74
|
+
mass: 0.4,
|
|
75
|
+
restDelta: 0.001,
|
|
76
|
+
});
|
|
77
|
+
return (_jsx("div", { role: "progressbar", "aria-label": label, "aria-valuemin": 0, "aria-valuemax": 100, className: cn(scrollProgressVariants({ position, size }), className), ...props, children: _jsx(m.div, { style: { scaleX: reduceMotion ? scrollYProgress : smoothProgress }, className: cn(scrollProgressIndicatorVariants({ color }), indicatorClassName) }) }));
|
|
78
|
+
}
|
|
79
|
+
ScrollProgress.displayName = "ScrollProgress";
|
|
80
|
+
//# sourceMappingURL=scroll-progress.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"scroll-progress.js","sourceRoot":"","sources":["../../../../src/components/ui/scroll-progress/scroll-progress.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAC;AAClE,OAAO,EACL,CAAC,EACD,SAAS,EACT,SAAS,EACT,gBAAgB,GACjB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AAGjC,MAAM,CAAC,MAAM,yBAAyB,GAAG;IACvC,KAAK;IACL,QAAQ;IACR,QAAQ;CACmB,CAAC;AAK9B,MAAM,CAAC,MAAM,qBAAqB,GAAG;IACnC,IAAI;IACJ,SAAS;IACT,IAAI;CACuB,CAAC;AAI9B,MAAM,CAAC,MAAM,sBAAsB,GAAG;IACpC,SAAS;IACT,OAAO;IACP,SAAS;IACT,UAAU;IACV,SAAS;IACT,aAAa;CACc,CAAC;AAI9B,MAAM,CAAC,MAAM,sBAAsB,GAAG,GAAG,CACvC,8EAA8E,EAC9E;IACE,QAAQ,EAAE;QACR,QAAQ,EAAE;YACR,GAAG,EAAE,4BAA4B;YACjC,MAAM,EAAE,+BAA+B;YACvC,MAAM,EAAE,UAAU;SACgC;QACpD,IAAI,EAAE;YACJ,EAAE,EAAE,OAAO;YACX,OAAO,EAAE,KAAK;YACd,EAAE,EAAE,OAAO;SACmC;KACjD;IACD,eAAe,EAAE;QACf,QAAQ,EAAE,KAAK;QACf,IAAI,EAAE,SAAS;KAChB;CACF,CACF,CAAC;AAEF,MAAM,CAAC,MAAM,+BAA+B,GAAG,GAAG,CAChD,0DAA0D,EAC1D;IACE,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,OAAO,EACL,yEAAyE;YAC3E,KAAK,EAAE,4BAA4B;YACnC,OAAO,EAAE,YAAY;YACrB,QAAQ,EAAE,cAAc;YACxB,OAAO,EAAE,eAAe;YACxB,WAAW,EAAE,gBAAgB;SACkB;KAClD;IACD,eAAe,EAAE;QACf,KAAK,EAAE,SAAS;KACjB;CACF,CACF,CAAC;AAiBF;;;;;;;;;;GAUG;AACH,MAAM,UAAU,cAAc,CAAC,EAC7B,QAAQ,EACR,IAAI,EACJ,KAAK,EACL,YAAY,EACZ,KAAK,GAAG,sBAAsB,EAC9B,SAAS,EACT,kBAAkB,EAClB,GAAG,KAAK,EACY;IACpB,MAAM,YAAY,GAAmB,gBAAgB,EAAE,CAAC;IACxD,MAAM,EAAE,eAAe,EAAE,GAAG,SAAS,CACnC,YAAY,CAAC,CAAC,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC,CAAC,CAAC,SAAS,CACvD,CAAC;IACF,MAAM,cAAc,GAAG,SAAS,CAAC,eAAe,EAAE;QAChD,SAAS,EAAE,GAAG;QACd,OAAO,EAAE,EAAE;QACX,IAAI,EAAE,GAAG;QACT,SAAS,EAAE,KAAK;KACjB,CAAC,CAAC;IAEH,OAAO,CACL,cACE,IAAI,EAAC,aAAa,gBACN,KAAK,mBACF,CAAC,mBACD,GAAG,EAClB,SAAS,EAAE,EAAE,CAAC,sBAAsB,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,EAAE,SAAS,CAAC,KAChE,KAAK,YAET,KAAC,CAAC,CAAC,GAAG,IACJ,KAAK,EAAE,EAAE,MAAM,EAAE,YAAY,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,cAAc,EAAE,EAClE,SAAS,EAAE,EAAE,CACX,+BAA+B,CAAC,EAAE,KAAK,EAAE,CAAC,EAC1C,kBAAkB,CACnB,GACD,GACE,CACP,CAAC;AACJ,CAAC;AAED,cAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC"}
|
|
@@ -5,7 +5,7 @@ export type SegmentedControlVariantId = (typeof segmentedControlVariantIds)[numb
|
|
|
5
5
|
export declare const segmentedControlSizeIds: readonly ["sm", "default", "lg"];
|
|
6
6
|
export type SegmentedControlSizeId = (typeof segmentedControlSizeIds)[number];
|
|
7
7
|
export declare const segmentedControlVariants: (props?: ({
|
|
8
|
-
variant?: "default" | "
|
|
8
|
+
variant?: "default" | "outline" | "ghost" | null | undefined;
|
|
9
9
|
size?: "sm" | "default" | "lg" | null | undefined;
|
|
10
10
|
fullWidth?: boolean | null | undefined;
|
|
11
11
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -5,7 +5,7 @@ export type StatCardVariantId = (typeof statCardVariantIds)[number];
|
|
|
5
5
|
export declare const statCardSizeIds: ["sm", "md", "lg"];
|
|
6
6
|
export type StatCardSizeId = (typeof statCardSizeIds)[number];
|
|
7
7
|
declare const statCardVariants: (props?: ({
|
|
8
|
-
variant?: "default" | "
|
|
8
|
+
variant?: "default" | "warning" | "destructive" | "primary" | "muted" | null | undefined;
|
|
9
9
|
size?: "sm" | "lg" | "md" | null | undefined;
|
|
10
10
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
11
11
|
export interface StatCardProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof statCardVariants> {
|
|
@@ -31,7 +31,7 @@ declare namespace StatCardLabel {
|
|
|
31
31
|
var displayName: string;
|
|
32
32
|
}
|
|
33
33
|
declare const statCardIconVariants: (props?: ({
|
|
34
|
-
variant?: "default" | "
|
|
34
|
+
variant?: "default" | "warning" | "destructive" | "primary" | "muted" | null | undefined;
|
|
35
35
|
size?: "sm" | "lg" | "md" | null | undefined;
|
|
36
36
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
37
37
|
export interface StatCardIconProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof statCardIconVariants> {
|
|
@@ -20,7 +20,7 @@ declare namespace TimelineItem {
|
|
|
20
20
|
var displayName: string;
|
|
21
21
|
}
|
|
22
22
|
declare const timelineDotVariants: (props?: ({
|
|
23
|
-
variant?: "default" | "
|
|
23
|
+
variant?: "default" | "warning" | "destructive" | "primary" | "muted" | null | undefined;
|
|
24
24
|
size?: "sm" | "lg" | "md" | null | undefined;
|
|
25
25
|
filled?: boolean | null | undefined;
|
|
26
26
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -32,7 +32,7 @@ declare namespace TimelineDot {
|
|
|
32
32
|
var displayName: string;
|
|
33
33
|
}
|
|
34
34
|
declare const timelineConnectorVariants: (props?: ({
|
|
35
|
-
variant?: "default" | "
|
|
35
|
+
variant?: "default" | "warning" | "destructive" | "primary" | "muted" | null | undefined;
|
|
36
36
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
37
37
|
export interface TimelineConnectorProps extends HTMLAttributes<HTMLSpanElement>, VariantProps<typeof timelineConnectorVariants> {
|
|
38
38
|
ref?: Ref<HTMLSpanElement>;
|
|
@@ -5,7 +5,7 @@ export type ToggleVariantId = (typeof toggleVariantIds)[number];
|
|
|
5
5
|
export declare const toggleSizeIds: readonly ["sm", "default", "lg", "icon"];
|
|
6
6
|
export type ToggleSizeId = (typeof toggleSizeIds)[number];
|
|
7
7
|
export declare const toggleVariants: (props?: ({
|
|
8
|
-
variant?: "default" | "
|
|
8
|
+
variant?: "default" | "destructive" | "primary" | "outline" | "ghost" | null | undefined;
|
|
9
9
|
size?: "sm" | "default" | "lg" | "icon" | null | undefined;
|
|
10
10
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
11
11
|
export interface ToggleProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "onChange">, VariantProps<typeof toggleVariants> {
|
package/dist/framer-motion.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { m, animate, AnimatePresence, domAnimation, LazyMotion, useAnimate, useAnimationFrame, useTransform, useMotionValue, usePresence, useScroll, useMotionValueEvent, useReducedMotion, } from "framer-motion";
|
|
1
|
+
export { m, animate, AnimatePresence, domAnimation, LazyMotion, useAnimate, useAnimationFrame, useTransform, useMotionValue, usePresence, useScroll, useSpring, useMotionValueEvent, useReducedMotion, } from "framer-motion";
|
|
2
2
|
export type { MotionValue, AnimationScope } from "framer-motion";
|
package/dist/framer-motion.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
export { m, animate, AnimatePresence, domAnimation, LazyMotion, useAnimate, useAnimationFrame, useTransform, useMotionValue, usePresence, useScroll, useMotionValueEvent, useReducedMotion, } from "framer-motion";
|
|
2
|
+
export { m, animate, AnimatePresence, domAnimation, LazyMotion, useAnimate, useAnimationFrame, useTransform, useMotionValue, usePresence, useScroll, useSpring, useMotionValueEvent, useReducedMotion, } from "framer-motion";
|
|
3
3
|
//# sourceMappingURL=framer-motion.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"framer-motion.js","sourceRoot":"","sources":["../src/framer-motion.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EACL,CAAC,EACD,OAAO,EACP,eAAe,EACf,YAAY,EACZ,UAAU,EACV,UAAU,EACV,iBAAiB,EACjB,YAAY,EACZ,cAAc,EACd,WAAW,EACX,SAAS,EACT,mBAAmB,EACnB,gBAAgB,GACjB,MAAM,eAAe,CAAC"}
|
|
1
|
+
{"version":3,"file":"framer-motion.js","sourceRoot":"","sources":["../src/framer-motion.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EACL,CAAC,EACD,OAAO,EACP,eAAe,EACf,YAAY,EACZ,UAAU,EACV,UAAU,EACV,iBAAiB,EACjB,YAAY,EACZ,cAAc,EACd,WAAW,EACX,SAAS,EACT,SAAS,EACT,mBAAmB,EACnB,gBAAgB,GACjB,MAAM,eAAe,CAAC"}
|