@particle-academy/react-fancy 5.41.0 → 5.42.0
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/CHANGELOG.md +33 -0
- package/dist/{chunk-Z7DNWCEO.js → chunk-3AQLEMH7.js} +6 -5
- package/dist/chunk-3AQLEMH7.js.map +1 -0
- package/dist/{chunk-H6WSJL2X.js → chunk-D354R6T6.js} +62 -14
- package/dist/chunk-D354R6T6.js.map +1 -0
- package/dist/{chunk-EOBWEJCU.cjs → chunk-UBZFOTZN.cjs} +4 -3
- package/dist/chunk-UBZFOTZN.cjs.map +1 -0
- package/dist/{chunk-35TZQIIN.cjs → chunk-W7IP6RT3.cjs} +61 -13
- package/dist/chunk-W7IP6RT3.cjs.map +1 -0
- package/dist/command.cjs +3 -3
- package/dist/command.d.cts +2 -0
- package/dist/command.d.ts +2 -0
- package/dist/command.js +1 -1
- package/dist/index.cjs +6 -6
- package/dist/index.js +2 -2
- package/dist/toast.cjs +3 -3
- package/dist/toast.d.cts +6 -0
- package/dist/toast.d.ts +6 -0
- package/dist/toast.js +1 -1
- package/package.json +1 -1
- package/dist/chunk-35TZQIIN.cjs.map +0 -1
- package/dist/chunk-EOBWEJCU.cjs.map +0 -1
- package/dist/chunk-H6WSJL2X.js.map +0 -1
- package/dist/chunk-Z7DNWCEO.js.map +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -11,6 +11,39 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|
|
11
11
|
|
|
12
12
|
## [Unreleased]
|
|
13
13
|
|
|
14
|
+
## [5.42.0] - 2026-10-17
|
|
15
|
+
|
|
16
|
+
### Fixed
|
|
17
|
+
|
|
18
|
+
- **Enter in `Command.Input` now picks an item**: the active one, or the first
|
|
19
|
+
visible one when none is active. Before, typing a query and pressing Enter did
|
|
20
|
+
nothing — `Command` handled no Enter, and only a *focused* item took it, as a
|
|
21
|
+
native click. Found by Genie 2's real-window test.
|
|
22
|
+
|
|
23
|
+
### Changed
|
|
24
|
+
|
|
25
|
+
- **`Command` is a proper combobox: focus stays in the input.** ArrowUp/Down move
|
|
26
|
+
the *active* item (marked `aria-selected="true"` and `data-active`, scrolled into
|
|
27
|
+
view, highlighted) and the input announces it through `aria-activedescendant`;
|
|
28
|
+
the input is `role="combobox"` with `aria-controls` pointing at the list. Typing
|
|
29
|
+
resets the active item, so Enter picks the new first match. Hovering an item
|
|
30
|
+
makes it active.
|
|
31
|
+
|
|
32
|
+
**Visible change:** the arrows used to move keyboard focus onto the item buttons,
|
|
33
|
+
and items were in the Tab order; now focus stays in the input and items are
|
|
34
|
+
`tabIndex={-1}`. **What you must DO: nothing**, unless you styled
|
|
35
|
+
`:focus` on `Command.Item` to show the highlighted row — style `[data-active]`
|
|
36
|
+
(or `aria-selected="true"`) instead.
|
|
37
|
+
|
|
38
|
+
## [5.41.1] - 2026-10-17
|
|
39
|
+
|
|
40
|
+
### Fixed
|
|
41
|
+
|
|
42
|
+
- **`Toast.Item` is now exported.** The docs describe it for rendering your own
|
|
43
|
+
viewport, and its props type `ToastItemProps` was exported, but the part was
|
|
44
|
+
not: following the docs gave `undefined` and a render crash. **Nothing to do**
|
|
45
|
+
unless you had worked around it, in which case `Toast.Item` now just works.
|
|
46
|
+
|
|
14
47
|
## [5.41.0] - 2026-10-17
|
|
15
48
|
|
|
16
49
|
### Added
|
|
@@ -2,9 +2,9 @@ import { Badge } from './chunk-6FCQD2KQ.js';
|
|
|
2
2
|
import { Portal } from './chunk-WHEXTDPV.js';
|
|
3
3
|
import { useControllableState } from './chunk-EDYAXGUM.js';
|
|
4
4
|
import { cn } from './chunk-MMW2JGKZ.js';
|
|
5
|
-
import { createContext, useContext,
|
|
5
|
+
import { createContext, useContext, useEffect, useRef, useState, useCallback, useMemo } from 'react';
|
|
6
6
|
import { Check, XCircle, AlertTriangle, Info, X } from 'lucide-react';
|
|
7
|
-
import {
|
|
7
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
8
8
|
|
|
9
9
|
var ToastContext = createContext(null);
|
|
10
10
|
function useToast() {
|
|
@@ -288,9 +288,10 @@ function ToastProvider({
|
|
|
288
288
|
}
|
|
289
289
|
var Toast = {
|
|
290
290
|
Provider: ToastProvider,
|
|
291
|
-
Stack: ToastStack
|
|
291
|
+
Stack: ToastStack,
|
|
292
|
+
Item: ToastItem
|
|
292
293
|
};
|
|
293
294
|
|
|
294
295
|
export { Toast, useToast };
|
|
295
|
-
//# sourceMappingURL=chunk-
|
|
296
|
-
//# sourceMappingURL=chunk-
|
|
296
|
+
//# sourceMappingURL=chunk-3AQLEMH7.js.map
|
|
297
|
+
//# sourceMappingURL=chunk-3AQLEMH7.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/Toast/Toast.context.ts","../src/components/Toast/ToastItem.tsx","../src/components/Toast/ToastStack.tsx","../src/components/Toast/Toast.tsx"],"names":["useEffect","jsx","jsxs","POSITION_STYLES","useRef"],"mappings":"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","file":"chunk-3AQLEMH7.js","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { ToastContextValue } from \"./Toast.types\";\n\nexport const ToastContext = createContext<ToastContextValue | null>(null);\n\nexport function useToast(): ToastContextValue {\n const ctx = useContext(ToastContext);\n if (!ctx) {\n throw new Error(\"useToast must be used within a <Toast.Provider>\");\n }\n return ctx;\n}\n","import { useEffect } from \"react\";\nimport { AlertTriangle, Check, Info, X, XCircle } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport type { ToastItemProps } from \"./Toast.types\";\n\nconst VARIANT_STYLES = {\n default:\n \"border-zinc-200 bg-white dark:border-zinc-700 dark:bg-zinc-900\",\n success:\n \"border-emerald-200 bg-emerald-50 dark:border-emerald-800 dark:bg-emerald-950\",\n error:\n \"border-red-200 bg-red-50 dark:border-red-800 dark:bg-red-950\",\n warning:\n \"border-amber-200 bg-amber-50 dark:border-amber-800 dark:bg-amber-950\",\n info: \"border-blue-200 bg-blue-50 dark:border-blue-800 dark:bg-blue-950\",\n} as const;\n\nconst VARIANT_ICON_COLORS = {\n default: \"text-zinc-400\",\n success: \"text-emerald-500\",\n error: \"text-red-500\",\n warning: \"text-amber-500\",\n info: \"text-blue-500\",\n} as const;\n\nexport function ToastItem({ data, onDismiss }: ToastItemProps) {\n const { id, title, description, variant = \"default\", action } = data;\n // An action toast does not expire by default.\n const duration = data.duration ?? (action ? 0 : 5000);\n\n useEffect(() => {\n if (duration <= 0) return;\n const timer = setTimeout(() => onDismiss(id), duration);\n return () => clearTimeout(timer);\n }, [id, duration, onDismiss]);\n\n return (\n <div\n data-react-fancy-toast-item=\"\"\n role=\"alert\"\n // Scoped to the toast rather than the document: a global Escape handler\n // would fight whatever modal or drawer is already listening.\n onKeyDown={(e) => {\n if (e.key === \"Escape\") onDismiss(id);\n }}\n className={cn(\n \"fancy-toast-in pointer-events-auto w-80 rounded-xl border p-4 shadow-lg\",\n VARIANT_STYLES[variant],\n )}\n >\n <div className=\"flex items-start gap-3\">\n <div className={cn(\"mt-0.5 shrink-0\", VARIANT_ICON_COLORS[variant])}>\n {variant === \"success\" && <Check size={16} />}\n {variant === \"error\" && <XCircle size={16} />}\n {variant === \"warning\" && <AlertTriangle size={16} />}\n {variant === \"info\" && <Info size={16} />}\n </div>\n <div className=\"flex-1 min-w-0\">\n <p className=\"text-sm font-medium text-zinc-900 dark:text-zinc-100\">{title}</p>\n {description && (\n <p className=\"mt-1 text-xs text-zinc-500 dark:text-zinc-400\">\n {description}\n </p>\n )}\n </div>\n {action && (\n <button\n type=\"button\"\n onClick={() => {\n action.onClick();\n // The offer is consumed; leaving it up invites undoing an\n // already-undone action.\n onDismiss(id);\n }}\n className=\"shrink-0 self-center rounded-md px-2 py-1 text-xs font-medium text-zinc-700 underline-offset-2 transition-colors hover:bg-zinc-100 hover:underline dark:text-zinc-200 dark:hover:bg-zinc-800\"\n >\n {action.label}\n </button>\n )}\n <button\n type=\"button\"\n onClick={() => onDismiss(id)}\n className=\"shrink-0 rounded p-0.5 text-zinc-400 transition-colors hover:text-zinc-600 dark:hover:text-zinc-300\"\n aria-label=\"Dismiss\"\n >\n <X size={14} />\n </button>\n </div>\n </div>\n );\n}\n\nToastItem.displayName = \"ToastItem\";\n","import { useEffect, useRef, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useControllableState } from \"../../hooks/use-controllable-state\";\nimport { Portal } from \"../Portal\";\nimport { Badge } from \"../Badge\";\nimport type { ToastPosition } from \"./Toast.types\";\n\nexport interface ToastStackProps<T> {\n /**\n * Everything to show — the stack is a VIEW of this list and owns none of it.\n * There is no limit and no timer: an item leaves only when you remove it.\n */\n items: readonly T[];\n /** One card's content, actions included. Only the front card is interactive. */\n renderItem: (item: T, state: { index: number; isFront: boolean }) => ReactNode;\n /** A stable key per item. Defaults to `item.id`, then the index. */\n getKey?: (item: T, index: number) => string;\n /** How many cards show behind the front one. Default 2. */\n depth?: number;\n /** How far each card behind peeks out above the one in front, in px. Default 8. */\n offset?: number;\n /** How much smaller each card behind is than the one in front. Default 0.05. */\n scaleStep?: number;\n /** Which item is in front, if you want to own it. Wraps; out-of-range values are clamped. */\n frontIndex?: number;\n defaultFrontIndex?: number;\n onFrontIndexChange?: (index: number) => void;\n /** A screen corner, or `\"inline\"` to render where it is placed. Default `\"bottom-right\"`. */\n position?: ToastPosition | \"inline\";\n /** The stack's accessible name. Default \"Notifications\". */\n label?: string;\n /** Classes for each card's shell, merged onto the defaults. */\n cardClassName?: string;\n className?: string;\n}\n\nconst POSITION_STYLES: Record<ToastPosition, string> = {\n \"top-right\": \"top-4 right-4\",\n \"top-left\": \"top-4 left-4\",\n \"bottom-right\": \"bottom-4 right-4\",\n \"bottom-left\": \"bottom-4 left-4\",\n};\n\n/** Pixels of wheel travel that count as one step. A mouse notch is ~100; a trackpad sends many small ones. */\nconst WHEEL_STEP = 50;\n\nconst CARD =\n \"rounded-xl border border-zinc-200 bg-white p-4 shadow-lg dark:border-zinc-700 dark:bg-zinc-900\";\n\nfunction defaultKey(item: unknown, index: number): string {\n const id = (item as { id?: unknown } | null)?.id;\n return typeof id === \"string\" || typeof id === \"number\" ? String(id) : String(index);\n}\n\nfunction isTextField(target: EventTarget | null): boolean {\n if (!(target instanceof HTMLElement)) return false;\n return (\n target.isContentEditable ||\n target.getAttribute(\"contenteditable\") === \"true\" ||\n /^(INPUT|TEXTAREA|SELECT)$/.test(target.tagName)\n );\n}\n\n/**\n * A controlled stack of actionable toasts — approval requests, say — that the\n * person walks through rather than races.\n *\n * Built for react-fancy#33. The owner's requirements were that requests stack\n * behind each other with a slight top offset, that scrolling over the stack\n * walks through them, and that a pending request NEVER expires or disappears.\n * The last is why this is a view of the caller's list rather than a queue it\n * keeps: there is nothing here that can drop an item, because nothing here owns\n * one. (The imperative provider's `maxToasts` silently drops the oldest.)\n */\nexport function ToastStack<T>({\n items,\n renderItem,\n getKey = defaultKey,\n depth = 2,\n offset = 8,\n scaleStep = 0.05,\n frontIndex: controlledFront,\n defaultFrontIndex = 0,\n onFrontIndexChange,\n position = \"bottom-right\",\n label = \"Notifications\",\n cardClassName,\n className,\n}: ToastStackProps<T>) {\n const [rawFront, setFront] = useControllableState(\n controlledFront,\n defaultFrontIndex,\n onFrontIndexChange,\n );\n const count = items.length;\n // Clamped for display rather than corrected through onChange: a list that\n // shrinks under a far-forward index must not make render report a change.\n const front = count === 0 ? 0 : ((rawFront % count) + count) % count;\n\n const stackRef = useRef<HTMLDivElement>(null);\n const wheelTravel = useRef(0);\n const live = useRef({ front, count });\n live.current = { front, count };\n\n const step = (by: number) => {\n const { front: current, count: n } = live.current;\n if (n < 2) return;\n setFront((((current + by) % n) + n) % n);\n };\n const stepRef = useRef(step);\n stepRef.current = step;\n\n /*\n * A native listener, because React's wheel listener is passive and cannot stop\n * the page scrolling underneath — and a stack that cycles AND scrolls the page\n * moves two things at once under the person's hand.\n */\n useEffect(() => {\n const el = stackRef.current;\n if (!el) return;\n\n const onWheel = (e: WheelEvent) => {\n if (live.current.count < 2 || e.deltaY === 0) return;\n e.preventDefault();\n\n // Line or page mode: every event is a notch.\n if (e.deltaMode !== 0) {\n wheelTravel.current = 0;\n stepRef.current(Math.sign(e.deltaY));\n return;\n }\n // A notch-sized event steps at once; small trackpad deltas add up first.\n if (Math.abs(e.deltaY) >= WHEEL_STEP) {\n wheelTravel.current = 0;\n stepRef.current(Math.sign(e.deltaY));\n return;\n }\n wheelTravel.current += e.deltaY;\n if (Math.abs(wheelTravel.current) >= WHEEL_STEP) {\n stepRef.current(Math.sign(wheelTravel.current));\n wheelTravel.current = 0;\n }\n };\n\n el.addEventListener(\"wheel\", onWheel, { passive: false });\n return () => el.removeEventListener(\"wheel\", onWheel);\n // Re-bound when the element can change: it appears with the first item, and\n // moving between a corner and inline remounts it.\n }, [count > 0, position]);\n\n if (count === 0) return null;\n\n const visibleBehind = Math.min(Math.max(0, depth), count - 1);\n const hidden = count - 1 - visibleBehind;\n\n const card = (index: number, k: number) => {\n const item = items[index];\n const isFront = k === 0;\n return (\n <div\n key={getKey(item, index)}\n data-react-fancy-toast-stack-card={isFront ? \"front\" : \"behind\"}\n aria-hidden={isFront ? undefined : true}\n inert={isFront ? undefined : true}\n className={cn(\n CARD,\n \"origin-top transition-transform duration-200\",\n isFront ? \"relative\" : \"pointer-events-none absolute inset-0 overflow-hidden\",\n cardClassName,\n )}\n style={{\n zIndex: depth + 1 - k,\n transform: isFront ? undefined : `translateY(-${k * offset}px) scale(${1 - k * scaleStep})`,\n }}\n >\n {renderItem(item, { index, isFront })}\n </div>\n );\n };\n\n const stackEl = (\n <div\n ref={stackRef}\n data-react-fancy-toast-stack=\"\"\n role=\"region\"\n aria-label={label}\n tabIndex={0}\n onKeyDown={(e) => {\n if (isTextField(e.target)) return;\n if (e.key === \"ArrowDown\" || e.key === \"ArrowRight\") {\n e.preventDefault();\n step(1);\n } else if (e.key === \"ArrowUp\" || e.key === \"ArrowLeft\") {\n e.preventDefault();\n step(-1);\n }\n }}\n className={cn(\n \"pointer-events-auto relative w-80 rounded-xl outline-none focus-visible:ring-2 focus-visible:ring-violet-500 focus-visible:ring-offset-2\",\n className,\n )}\n style={{ paddingTop: visibleBehind * offset }}\n >\n <div className=\"relative\">\n {/* z-index decides what paints on top; the front card sizes the box. */}\n {Array.from({ length: visibleBehind }, (_, i) => i + 1).map((k) =>\n card((front + k) % count, k),\n )}\n {card(front, 0)}\n </div>\n {hidden > 0 && (\n <Badge\n data-react-fancy-toast-stack-more=\"\"\n size=\"sm\"\n variant=\"soft\"\n color=\"zinc\"\n className=\"absolute -top-2 right-2 z-20\"\n >\n +{hidden}\n </Badge>\n )}\n <span data-react-fancy-toast-stack-status=\"\" aria-live=\"polite\" className=\"sr-only\">\n {count > 1 ? `${front + 1} of ${count}` : \"\"}\n </span>\n </div>\n );\n\n if (position === \"inline\") return stackEl;\n\n return (\n <Portal>\n <div\n data-react-fancy-toast-stack-position={position}\n className={cn(\"pointer-events-none fixed z-[100]\", POSITION_STYLES[position])}\n >\n {stackEl}\n </div>\n </Portal>\n );\n}\n\nToastStack.displayName = \"ToastStack\";\n","import { useCallback, useMemo, useRef, useState } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { ToastContext } from \"./Toast.context\";\nimport { ToastItem } from \"./ToastItem\";\nimport { ToastStack } from \"./ToastStack\";\nimport type { ToastData, ToastProviderProps } from \"./Toast.types\";\n\nconst POSITION_STYLES = {\n \"top-right\": \"top-4 right-4\",\n \"top-left\": \"top-4 left-4\",\n \"bottom-right\": \"bottom-4 right-4\",\n \"bottom-left\": \"bottom-4 left-4\",\n} as const;\n\nfunction ToastProvider({\n children,\n position = \"bottom-right\",\n maxToasts = 5,\n}: ToastProviderProps) {\n const [toasts, setToasts] = useState<ToastData[]>([]);\n const idCounter = useRef(0);\n\n const toast = useCallback(\n (data: Omit<ToastData, \"id\">) => {\n const id = `toast-${++idCounter.current}`;\n setToasts((prev) => [...prev.slice(-(maxToasts - 1)), { ...data, id }]);\n return id;\n },\n [maxToasts],\n );\n\n const dismiss = useCallback((id: string) => {\n setToasts((prev) => prev.filter((t) => t.id !== id));\n }, []);\n\n const ctx = useMemo(() => ({ toasts, toast, dismiss }), [toasts, toast, dismiss]);\n\n return (\n <ToastContext.Provider value={ctx}>\n {children}\n <Portal>\n <div\n data-react-fancy-toast=\"\"\n className={cn(\n \"fixed z-[100] flex flex-col gap-2 pointer-events-none\",\n POSITION_STYLES[position],\n )}\n >\n {toasts.map((t) => (\n <ToastItem key={t.id} data={t} onDismiss={dismiss} />\n ))}\n </div>\n </Portal>\n </ToastContext.Provider>\n );\n}\n\nexport const Toast = {\n Provider: ToastProvider,\n Stack: ToastStack,\n Item: ToastItem,\n};\n"]}
|
|
@@ -4,7 +4,7 @@ import { Portal } from './chunk-WHEXTDPV.js';
|
|
|
4
4
|
import { useEscapeKey } from './chunk-JXE5XID6.js';
|
|
5
5
|
import { useControllableState } from './chunk-EDYAXGUM.js';
|
|
6
6
|
import { cn } from './chunk-MMW2JGKZ.js';
|
|
7
|
-
import { createContext, useState, useRef, useCallback, useEffect, useMemo, useContext } from 'react';
|
|
7
|
+
import { createContext, useState, useRef, useId, useCallback, useEffect, useLayoutEffect, useMemo, useContext } from 'react';
|
|
8
8
|
import { Search } from 'lucide-react';
|
|
9
9
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
10
10
|
|
|
@@ -22,13 +22,17 @@ function CommandInput({
|
|
|
22
22
|
placeholder = "Type a command or search...",
|
|
23
23
|
className
|
|
24
24
|
}) {
|
|
25
|
-
const { query, setQuery } = useCommand();
|
|
25
|
+
const { query, setQuery, listId } = useCommand();
|
|
26
26
|
return /* @__PURE__ */ jsxs("div", { "data-react-fancy-command-input": "", className: "flex items-center border-b border-zinc-200 px-4 dark:border-zinc-700", children: [
|
|
27
27
|
/* @__PURE__ */ jsx(Search, { size: 16, className: "shrink-0 text-zinc-400" }),
|
|
28
28
|
/* @__PURE__ */ jsx(
|
|
29
29
|
"input",
|
|
30
30
|
{
|
|
31
31
|
type: "text",
|
|
32
|
+
role: "combobox",
|
|
33
|
+
"aria-expanded": "true",
|
|
34
|
+
"aria-controls": listId,
|
|
35
|
+
"aria-autocomplete": "list",
|
|
32
36
|
value: query,
|
|
33
37
|
onChange: (e) => setQuery(e.target.value),
|
|
34
38
|
placeholder,
|
|
@@ -43,9 +47,11 @@ function CommandInput({
|
|
|
43
47
|
}
|
|
44
48
|
CommandInput.displayName = "CommandInput";
|
|
45
49
|
function CommandList({ children, className }) {
|
|
50
|
+
const { listId } = useCommand();
|
|
46
51
|
return /* @__PURE__ */ jsx(
|
|
47
52
|
"div",
|
|
48
53
|
{
|
|
54
|
+
id: listId,
|
|
49
55
|
"data-react-fancy-command-list": "",
|
|
50
56
|
role: "listbox",
|
|
51
57
|
className: cn("max-h-72 overflow-y-auto p-2", className),
|
|
@@ -60,7 +66,8 @@ function CommandItem({
|
|
|
60
66
|
onSelect,
|
|
61
67
|
className
|
|
62
68
|
}) {
|
|
63
|
-
const { query, close, shouldFilter } = useCommand();
|
|
69
|
+
const { query, close, shouldFilter, setActiveIndex } = useCommand();
|
|
70
|
+
const id = useId();
|
|
64
71
|
const text = value ?? (typeof children === "string" ? children : "");
|
|
65
72
|
if (shouldFilter && query && !text.toLowerCase().includes(query.toLowerCase())) {
|
|
66
73
|
return null;
|
|
@@ -68,12 +75,19 @@ function CommandItem({
|
|
|
68
75
|
return /* @__PURE__ */ jsx(
|
|
69
76
|
"button",
|
|
70
77
|
{
|
|
78
|
+
id,
|
|
71
79
|
"data-react-fancy-command-item": "",
|
|
72
80
|
type: "button",
|
|
73
81
|
role: "option",
|
|
82
|
+
"aria-selected": false,
|
|
83
|
+
tabIndex: -1,
|
|
84
|
+
onMouseEnter: (e) => {
|
|
85
|
+
const options = e.currentTarget.closest("[data-react-fancy-command]")?.querySelectorAll('[role="option"]');
|
|
86
|
+
if (options) setActiveIndex(Array.from(options).indexOf(e.currentTarget));
|
|
87
|
+
},
|
|
74
88
|
className: cn(
|
|
75
89
|
"flex w-full items-center rounded-lg px-3 py-2 text-left text-sm transition-colors",
|
|
76
|
-
"text-zinc-700 hover:bg-zinc-100 dark:text-zinc-300 dark:hover:bg-zinc-800",
|
|
90
|
+
"text-zinc-700 hover:bg-zinc-100 data-[active]:bg-zinc-100 dark:text-zinc-300 dark:hover:bg-zinc-800 dark:data-[active]:bg-zinc-800",
|
|
77
91
|
className
|
|
78
92
|
),
|
|
79
93
|
onClick: () => {
|
|
@@ -125,6 +139,7 @@ function CommandRoot({
|
|
|
125
139
|
const [query, setQuery] = useControllableState(controlledQuery, "", onQueryChange);
|
|
126
140
|
const [activeIndex, setActiveIndex] = useState(-1);
|
|
127
141
|
const panelRef = useRef(null);
|
|
142
|
+
const listId = useId();
|
|
128
143
|
const close = useCallback(() => {
|
|
129
144
|
onClose();
|
|
130
145
|
setQuery("");
|
|
@@ -150,27 +165,60 @@ function CommandRoot({
|
|
|
150
165
|
if (!items?.length) return;
|
|
151
166
|
if (e.key === "ArrowDown") {
|
|
152
167
|
e.preventDefault();
|
|
153
|
-
|
|
154
|
-
setActiveIndex(next);
|
|
155
|
-
items[next]?.focus();
|
|
168
|
+
setActiveIndex(activeIndex < items.length - 1 ? activeIndex + 1 : 0);
|
|
156
169
|
} else if (e.key === "ArrowUp") {
|
|
157
170
|
e.preventDefault();
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
171
|
+
setActiveIndex(activeIndex > 0 ? activeIndex - 1 : items.length - 1);
|
|
172
|
+
} else if (e.key === "Enter") {
|
|
173
|
+
if (e.target?.getAttribute("role") === "option") return;
|
|
174
|
+
const pick = items[activeIndex] ?? items[0];
|
|
175
|
+
e.preventDefault();
|
|
176
|
+
pick.click();
|
|
161
177
|
}
|
|
162
178
|
};
|
|
163
179
|
document.addEventListener("keydown", handleKeyDown);
|
|
164
180
|
return () => document.removeEventListener("keydown", handleKeyDown);
|
|
165
181
|
}, [open, activeIndex]);
|
|
182
|
+
useLayoutEffect(() => {
|
|
183
|
+
const panel = panelRef.current;
|
|
184
|
+
if (!panel) return;
|
|
185
|
+
const items = Array.from(panel.querySelectorAll('[role="option"]'));
|
|
186
|
+
const active = items[activeIndex];
|
|
187
|
+
items.forEach((item) => {
|
|
188
|
+
const on = item === active;
|
|
189
|
+
item.setAttribute("aria-selected", on ? "true" : "false");
|
|
190
|
+
if (on) item.setAttribute("data-active", "");
|
|
191
|
+
else item.removeAttribute("data-active");
|
|
192
|
+
});
|
|
193
|
+
const input = panel.querySelector("[data-react-fancy-command-input] input");
|
|
194
|
+
if (active?.id) input?.setAttribute("aria-activedescendant", active.id);
|
|
195
|
+
else input?.removeAttribute("aria-activedescendant");
|
|
196
|
+
active?.scrollIntoView?.({ block: "nearest" });
|
|
197
|
+
});
|
|
198
|
+
const changeQuery = useCallback(
|
|
199
|
+
(next) => {
|
|
200
|
+
setQuery(next);
|
|
201
|
+
setActiveIndex(-1);
|
|
202
|
+
},
|
|
203
|
+
[setQuery]
|
|
204
|
+
);
|
|
166
205
|
const { mounted, className: animClass, ref: animRef } = useAnimation({
|
|
167
206
|
open,
|
|
168
207
|
enterClass: "fancy-slide-up",
|
|
169
208
|
exitClass: "fancy-fade-out"
|
|
170
209
|
});
|
|
171
210
|
const ctx = useMemo(
|
|
172
|
-
() => ({
|
|
173
|
-
|
|
211
|
+
() => ({
|
|
212
|
+
open,
|
|
213
|
+
close,
|
|
214
|
+
query,
|
|
215
|
+
setQuery: changeQuery,
|
|
216
|
+
activeIndex,
|
|
217
|
+
setActiveIndex,
|
|
218
|
+
shouldFilter,
|
|
219
|
+
listId
|
|
220
|
+
}),
|
|
221
|
+
[open, close, query, changeQuery, activeIndex, shouldFilter, listId]
|
|
174
222
|
);
|
|
175
223
|
if (!mounted) return null;
|
|
176
224
|
return /* @__PURE__ */ jsx(CommandContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsxs("div", { className: "fixed inset-0 z-50 flex items-start justify-center pt-[20vh]", children: [
|
|
@@ -209,5 +257,5 @@ var Command = Object.assign(CommandRoot, {
|
|
|
209
257
|
});
|
|
210
258
|
|
|
211
259
|
export { Command, useCommand };
|
|
212
|
-
//# sourceMappingURL=chunk-
|
|
213
|
-
//# sourceMappingURL=chunk-
|
|
260
|
+
//# sourceMappingURL=chunk-D354R6T6.js.map
|
|
261
|
+
//# sourceMappingURL=chunk-D354R6T6.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/Command/Command.context.ts","../src/components/Command/CommandInput.tsx","../src/components/Command/CommandList.tsx","../src/components/Command/CommandItem.tsx","../src/components/Command/CommandGroup.tsx","../src/components/Command/CommandEmpty.tsx","../src/components/Command/Command.tsx"],"names":["jsx","jsxs","useId"],"mappings":"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","file":"chunk-D354R6T6.js","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { CommandContextValue } from \"./Command.types\";\n\nexport const CommandContext = createContext<CommandContextValue | null>(null);\n\nexport function useCommand(): CommandContextValue {\n const ctx = useContext(CommandContext);\n if (!ctx) {\n throw new Error(\n \"Command compound components must be used within <Command>\",\n );\n }\n return ctx;\n}\n","import { Search } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { useCommand } from \"./Command.context\";\nimport type { CommandInputProps } from \"./Command.types\";\n\nexport function CommandInput({\n placeholder = \"Type a command or search...\",\n className,\n}: CommandInputProps) {\n const { query, setQuery, listId } = useCommand();\n\n return (\n <div data-react-fancy-command-input=\"\" className=\"flex items-center border-b border-zinc-200 px-4 dark:border-zinc-700\">\n <Search size={16} className=\"shrink-0 text-zinc-400\" />\n <input\n type=\"text\"\n // A combobox: focus stays here while the arrows move the active option,\n // which Command announces through aria-activedescendant.\n role=\"combobox\"\n aria-expanded=\"true\"\n aria-controls={listId}\n aria-autocomplete=\"list\"\n value={query}\n onChange={(e) => setQuery(e.target.value)}\n placeholder={placeholder}\n className={cn(\n \"flex-1 bg-transparent px-3 py-3 text-sm outline-none placeholder:text-zinc-400\",\n className,\n )}\n autoFocus\n />\n </div>\n );\n}\n\nCommandInput.displayName = \"CommandInput\";\n","import { cn } from \"../../utils/cn\";\nimport { useCommand } from \"./Command.context\";\nimport type { CommandListProps } from \"./Command.types\";\n\nexport function CommandList({ children, className }: CommandListProps) {\n const { listId } = useCommand();\n\n return (\n <div\n id={listId}\n data-react-fancy-command-list=\"\"\n role=\"listbox\"\n className={cn(\"max-h-72 overflow-y-auto p-2\", className)}\n >\n {children}\n </div>\n );\n}\n\nCommandList.displayName = \"CommandList\";\n","import { useId } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useCommand } from \"./Command.context\";\nimport type { CommandItemProps } from \"./Command.types\";\n\nexport function CommandItem({\n children,\n value,\n onSelect,\n className,\n}: CommandItemProps) {\n const { query, close, shouldFilter, setActiveIndex } = useCommand();\n // Called before the filter's early return, so the hook order never changes.\n const id = useId();\n\n // Filter by query — unless the caller filters for itself (`shouldFilter={false}`).\n const text = value ?? (typeof children === \"string\" ? children : \"\");\n if (shouldFilter && query && !text.toLowerCase().includes(query.toLowerCase())) {\n return null;\n }\n\n return (\n <button\n id={id}\n data-react-fancy-command-item=\"\"\n type=\"button\"\n role=\"option\"\n // Marked active by Command itself (aria-selected + data-active), since an\n // item cannot know its own position among the rendered options.\n aria-selected={false}\n // Keyboard focus stays in the input; the items are reached with the arrows.\n tabIndex={-1}\n onMouseEnter={(e) => {\n const options = e.currentTarget\n .closest(\"[data-react-fancy-command]\")\n ?.querySelectorAll('[role=\"option\"]');\n if (options) setActiveIndex(Array.from(options).indexOf(e.currentTarget));\n }}\n className={cn(\n \"flex w-full items-center rounded-lg px-3 py-2 text-left text-sm transition-colors\",\n \"text-zinc-700 hover:bg-zinc-100 data-[active]:bg-zinc-100 dark:text-zinc-300 dark:hover:bg-zinc-800 dark:data-[active]:bg-zinc-800\",\n className,\n )}\n onClick={() => {\n onSelect?.();\n close();\n }}\n >\n {children}\n </button>\n );\n}\n\nCommandItem.displayName = \"CommandItem\";\n","import { cn } from \"../../utils/cn\";\nimport type { CommandGroupProps } from \"./Command.types\";\n\nexport function CommandGroup({\n children,\n heading,\n className,\n}: CommandGroupProps) {\n return (\n <div data-react-fancy-command-group=\"\" role=\"group\" className={cn(\"py-1\", className)}>\n {heading && (\n <div className=\"px-3 py-1.5 text-xs font-medium text-zinc-400\">\n {heading}\n </div>\n )}\n {children}\n </div>\n );\n}\n\nCommandGroup.displayName = \"CommandGroup\";\n","import { cn } from \"../../utils/cn\";\nimport type { CommandEmptyProps } from \"./Command.types\";\n\nexport function CommandEmpty({\n children = \"No results found.\",\n className,\n}: CommandEmptyProps) {\n return (\n <div\n data-react-fancy-command-empty=\"\"\n className={cn(\n \"py-6 text-center text-sm text-zinc-500 dark:text-zinc-400\",\n className,\n )}\n >\n {children}\n </div>\n );\n}\n\nCommandEmpty.displayName = \"CommandEmpty\";\n","import {\n useCallback,\n useEffect,\n useId,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { CommandContext } from \"./Command.context\";\nimport { CommandInput } from \"./CommandInput\";\nimport { CommandList } from \"./CommandList\";\nimport { CommandItem } from \"./CommandItem\";\nimport { CommandGroup } from \"./CommandGroup\";\nimport { CommandEmpty } from \"./CommandEmpty\";\nimport { useFocusTrap } from \"../../hooks/use-focus-trap\";\nimport { useEscapeKey } from \"../../hooks/use-escape-key\";\nimport { useAnimation } from \"../../hooks/use-animation\";\nimport { useControllableState } from \"../../hooks/use-controllable-state\";\nimport type { CommandProps } from \"./Command.types\";\n\nfunction CommandRoot({\n children,\n open,\n onClose,\n className,\n shouldFilter = true,\n query: controlledQuery,\n onQueryChange,\n}: CommandProps) {\n const [query, setQuery] = useControllableState(controlledQuery, \"\", onQueryChange);\n const [activeIndex, setActiveIndex] = useState(-1);\n const panelRef = useRef<HTMLDivElement>(null);\n const listId = useId();\n\n const close = useCallback(() => {\n onClose();\n setQuery(\"\");\n setActiveIndex(-1);\n }, [onClose]);\n\n useEscapeKey(close, open);\n useFocusTrap(panelRef, open);\n\n // Cmd+K global shortcut is handled by the consumer\n useEffect(() => {\n if (open) {\n const original = document.body.style.overflow;\n document.body.style.overflow = \"hidden\";\n return () => {\n document.body.style.overflow = original;\n };\n }\n }, [open]);\n\n /*\n * Keyboard navigation, as a combobox: the arrows move the ACTIVE item while\n * focus stays in the input (announced through aria-activedescendant), and\n * Enter picks the active item — or the first visible one when none is active.\n *\n * Focus used to move onto the items, and Enter was handled nowhere, so typing\n * a query and pressing Enter did nothing: only a focused item took Enter, as a\n * native click. Found by Genie 2's real-window test.\n */\n useEffect(() => {\n if (!open) return;\n\n const handleKeyDown = (e: KeyboardEvent) => {\n const items = panelRef.current?.querySelectorAll<HTMLElement>(\n '[role=\"option\"]',\n );\n if (!items?.length) return;\n\n if (e.key === \"ArrowDown\") {\n e.preventDefault();\n setActiveIndex(activeIndex < items.length - 1 ? activeIndex + 1 : 0);\n } else if (e.key === \"ArrowUp\") {\n e.preventDefault();\n setActiveIndex(activeIndex > 0 ? activeIndex - 1 : items.length - 1);\n } else if (e.key === \"Enter\") {\n // A focused item takes Enter natively, as a click; picking here as well\n // would select it twice.\n if ((e.target as HTMLElement | null)?.getAttribute(\"role\") === \"option\") return;\n const pick = items[activeIndex] ?? items[0];\n e.preventDefault();\n pick.click();\n }\n };\n\n document.addEventListener(\"keydown\", handleKeyDown);\n return () => document.removeEventListener(\"keydown\", handleKeyDown);\n }, [open, activeIndex]);\n\n /*\n * Mark the active item and point the input at it. Done on the DOM after each\n * render because an item cannot know its own index — that is its position\n * among the options currently rendered, which filtering changes.\n */\n useLayoutEffect(() => {\n const panel = panelRef.current;\n if (!panel) return;\n\n const items = Array.from(panel.querySelectorAll<HTMLElement>('[role=\"option\"]'));\n const active = items[activeIndex];\n items.forEach((item) => {\n const on = item === active;\n item.setAttribute(\"aria-selected\", on ? \"true\" : \"false\");\n if (on) item.setAttribute(\"data-active\", \"\");\n else item.removeAttribute(\"data-active\");\n });\n\n const input = panel.querySelector<HTMLInputElement>(\"[data-react-fancy-command-input] input\");\n if (active?.id) input?.setAttribute(\"aria-activedescendant\", active.id);\n else input?.removeAttribute(\"aria-activedescendant\");\n active?.scrollIntoView?.({ block: \"nearest\" });\n });\n\n // A new query is a new list: nothing in it is active yet, so Enter picks the first match.\n const changeQuery = useCallback(\n (next: string) => {\n setQuery(next);\n setActiveIndex(-1);\n },\n [setQuery],\n );\n\n const { mounted, className: animClass, ref: animRef } = useAnimation({\n open,\n enterClass: \"fancy-slide-up\",\n exitClass: \"fancy-fade-out\",\n });\n\n const ctx = useMemo(\n () => ({\n open,\n close,\n query,\n setQuery: changeQuery,\n activeIndex,\n setActiveIndex,\n shouldFilter,\n listId,\n }),\n [open, close, query, changeQuery, activeIndex, shouldFilter, listId],\n );\n\n if (!mounted) return null;\n\n return (\n <CommandContext.Provider value={ctx}>\n <Portal>\n <div className=\"fixed inset-0 z-50 flex items-start justify-center pt-[20vh]\">\n <div\n className=\"absolute inset-0 bg-black/50 backdrop-blur-sm\"\n onClick={close}\n aria-hidden=\"true\"\n />\n <div\n ref={(node) => {\n panelRef.current = node;\n (animRef as React.MutableRefObject<HTMLElement | null>).current =\n node;\n }}\n data-react-fancy-command=\"\"\n className={cn(\n \"relative w-full max-w-lg overflow-hidden rounded-2xl border border-zinc-200 bg-white shadow-2xl dark:border-zinc-700 dark:bg-zinc-900\",\n animClass,\n className,\n )}\n >\n {children}\n </div>\n </div>\n </Portal>\n </CommandContext.Provider>\n );\n}\n\nexport const Command = Object.assign(CommandRoot, {\n Input: CommandInput,\n List: CommandList,\n Item: CommandItem,\n Group: CommandGroup,\n Empty: CommandEmpty,\n});\n"]}
|
|
@@ -290,10 +290,11 @@ function ToastProvider({
|
|
|
290
290
|
}
|
|
291
291
|
var Toast = {
|
|
292
292
|
Provider: ToastProvider,
|
|
293
|
-
Stack: ToastStack
|
|
293
|
+
Stack: ToastStack,
|
|
294
|
+
Item: ToastItem
|
|
294
295
|
};
|
|
295
296
|
|
|
296
297
|
exports.Toast = Toast;
|
|
297
298
|
exports.useToast = useToast;
|
|
298
|
-
//# sourceMappingURL=chunk-
|
|
299
|
-
//# sourceMappingURL=chunk-
|
|
299
|
+
//# sourceMappingURL=chunk-UBZFOTZN.cjs.map
|
|
300
|
+
//# sourceMappingURL=chunk-UBZFOTZN.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/Toast/Toast.context.ts","../src/components/Toast/ToastItem.tsx","../src/components/Toast/ToastStack.tsx","../src/components/Toast/Toast.tsx"],"names":["createContext","useContext","useEffect","jsx","cn","jsxs","Check","XCircle","AlertTriangle","Info","X","useControllableState","useRef","Badge","Portal","POSITION_STYLES","useState","useCallback","useMemo"],"mappings":"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","file":"chunk-UBZFOTZN.cjs","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { ToastContextValue } from \"./Toast.types\";\n\nexport const ToastContext = createContext<ToastContextValue | null>(null);\n\nexport function useToast(): ToastContextValue {\n const ctx = useContext(ToastContext);\n if (!ctx) {\n throw new Error(\"useToast must be used within a <Toast.Provider>\");\n }\n return ctx;\n}\n","import { useEffect } from \"react\";\nimport { AlertTriangle, Check, Info, X, XCircle } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport type { ToastItemProps } from \"./Toast.types\";\n\nconst VARIANT_STYLES = {\n default:\n \"border-zinc-200 bg-white dark:border-zinc-700 dark:bg-zinc-900\",\n success:\n \"border-emerald-200 bg-emerald-50 dark:border-emerald-800 dark:bg-emerald-950\",\n error:\n \"border-red-200 bg-red-50 dark:border-red-800 dark:bg-red-950\",\n warning:\n \"border-amber-200 bg-amber-50 dark:border-amber-800 dark:bg-amber-950\",\n info: \"border-blue-200 bg-blue-50 dark:border-blue-800 dark:bg-blue-950\",\n} as const;\n\nconst VARIANT_ICON_COLORS = {\n default: \"text-zinc-400\",\n success: \"text-emerald-500\",\n error: \"text-red-500\",\n warning: \"text-amber-500\",\n info: \"text-blue-500\",\n} as const;\n\nexport function ToastItem({ data, onDismiss }: ToastItemProps) {\n const { id, title, description, variant = \"default\", action } = data;\n // An action toast does not expire by default.\n const duration = data.duration ?? (action ? 0 : 5000);\n\n useEffect(() => {\n if (duration <= 0) return;\n const timer = setTimeout(() => onDismiss(id), duration);\n return () => clearTimeout(timer);\n }, [id, duration, onDismiss]);\n\n return (\n <div\n data-react-fancy-toast-item=\"\"\n role=\"alert\"\n // Scoped to the toast rather than the document: a global Escape handler\n // would fight whatever modal or drawer is already listening.\n onKeyDown={(e) => {\n if (e.key === \"Escape\") onDismiss(id);\n }}\n className={cn(\n \"fancy-toast-in pointer-events-auto w-80 rounded-xl border p-4 shadow-lg\",\n VARIANT_STYLES[variant],\n )}\n >\n <div className=\"flex items-start gap-3\">\n <div className={cn(\"mt-0.5 shrink-0\", VARIANT_ICON_COLORS[variant])}>\n {variant === \"success\" && <Check size={16} />}\n {variant === \"error\" && <XCircle size={16} />}\n {variant === \"warning\" && <AlertTriangle size={16} />}\n {variant === \"info\" && <Info size={16} />}\n </div>\n <div className=\"flex-1 min-w-0\">\n <p className=\"text-sm font-medium text-zinc-900 dark:text-zinc-100\">{title}</p>\n {description && (\n <p className=\"mt-1 text-xs text-zinc-500 dark:text-zinc-400\">\n {description}\n </p>\n )}\n </div>\n {action && (\n <button\n type=\"button\"\n onClick={() => {\n action.onClick();\n // The offer is consumed; leaving it up invites undoing an\n // already-undone action.\n onDismiss(id);\n }}\n className=\"shrink-0 self-center rounded-md px-2 py-1 text-xs font-medium text-zinc-700 underline-offset-2 transition-colors hover:bg-zinc-100 hover:underline dark:text-zinc-200 dark:hover:bg-zinc-800\"\n >\n {action.label}\n </button>\n )}\n <button\n type=\"button\"\n onClick={() => onDismiss(id)}\n className=\"shrink-0 rounded p-0.5 text-zinc-400 transition-colors hover:text-zinc-600 dark:hover:text-zinc-300\"\n aria-label=\"Dismiss\"\n >\n <X size={14} />\n </button>\n </div>\n </div>\n );\n}\n\nToastItem.displayName = \"ToastItem\";\n","import { useEffect, useRef, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useControllableState } from \"../../hooks/use-controllable-state\";\nimport { Portal } from \"../Portal\";\nimport { Badge } from \"../Badge\";\nimport type { ToastPosition } from \"./Toast.types\";\n\nexport interface ToastStackProps<T> {\n /**\n * Everything to show — the stack is a VIEW of this list and owns none of it.\n * There is no limit and no timer: an item leaves only when you remove it.\n */\n items: readonly T[];\n /** One card's content, actions included. Only the front card is interactive. */\n renderItem: (item: T, state: { index: number; isFront: boolean }) => ReactNode;\n /** A stable key per item. Defaults to `item.id`, then the index. */\n getKey?: (item: T, index: number) => string;\n /** How many cards show behind the front one. Default 2. */\n depth?: number;\n /** How far each card behind peeks out above the one in front, in px. Default 8. */\n offset?: number;\n /** How much smaller each card behind is than the one in front. Default 0.05. */\n scaleStep?: number;\n /** Which item is in front, if you want to own it. Wraps; out-of-range values are clamped. */\n frontIndex?: number;\n defaultFrontIndex?: number;\n onFrontIndexChange?: (index: number) => void;\n /** A screen corner, or `\"inline\"` to render where it is placed. Default `\"bottom-right\"`. */\n position?: ToastPosition | \"inline\";\n /** The stack's accessible name. Default \"Notifications\". */\n label?: string;\n /** Classes for each card's shell, merged onto the defaults. */\n cardClassName?: string;\n className?: string;\n}\n\nconst POSITION_STYLES: Record<ToastPosition, string> = {\n \"top-right\": \"top-4 right-4\",\n \"top-left\": \"top-4 left-4\",\n \"bottom-right\": \"bottom-4 right-4\",\n \"bottom-left\": \"bottom-4 left-4\",\n};\n\n/** Pixels of wheel travel that count as one step. A mouse notch is ~100; a trackpad sends many small ones. */\nconst WHEEL_STEP = 50;\n\nconst CARD =\n \"rounded-xl border border-zinc-200 bg-white p-4 shadow-lg dark:border-zinc-700 dark:bg-zinc-900\";\n\nfunction defaultKey(item: unknown, index: number): string {\n const id = (item as { id?: unknown } | null)?.id;\n return typeof id === \"string\" || typeof id === \"number\" ? String(id) : String(index);\n}\n\nfunction isTextField(target: EventTarget | null): boolean {\n if (!(target instanceof HTMLElement)) return false;\n return (\n target.isContentEditable ||\n target.getAttribute(\"contenteditable\") === \"true\" ||\n /^(INPUT|TEXTAREA|SELECT)$/.test(target.tagName)\n );\n}\n\n/**\n * A controlled stack of actionable toasts — approval requests, say — that the\n * person walks through rather than races.\n *\n * Built for react-fancy#33. The owner's requirements were that requests stack\n * behind each other with a slight top offset, that scrolling over the stack\n * walks through them, and that a pending request NEVER expires or disappears.\n * The last is why this is a view of the caller's list rather than a queue it\n * keeps: there is nothing here that can drop an item, because nothing here owns\n * one. (The imperative provider's `maxToasts` silently drops the oldest.)\n */\nexport function ToastStack<T>({\n items,\n renderItem,\n getKey = defaultKey,\n depth = 2,\n offset = 8,\n scaleStep = 0.05,\n frontIndex: controlledFront,\n defaultFrontIndex = 0,\n onFrontIndexChange,\n position = \"bottom-right\",\n label = \"Notifications\",\n cardClassName,\n className,\n}: ToastStackProps<T>) {\n const [rawFront, setFront] = useControllableState(\n controlledFront,\n defaultFrontIndex,\n onFrontIndexChange,\n );\n const count = items.length;\n // Clamped for display rather than corrected through onChange: a list that\n // shrinks under a far-forward index must not make render report a change.\n const front = count === 0 ? 0 : ((rawFront % count) + count) % count;\n\n const stackRef = useRef<HTMLDivElement>(null);\n const wheelTravel = useRef(0);\n const live = useRef({ front, count });\n live.current = { front, count };\n\n const step = (by: number) => {\n const { front: current, count: n } = live.current;\n if (n < 2) return;\n setFront((((current + by) % n) + n) % n);\n };\n const stepRef = useRef(step);\n stepRef.current = step;\n\n /*\n * A native listener, because React's wheel listener is passive and cannot stop\n * the page scrolling underneath — and a stack that cycles AND scrolls the page\n * moves two things at once under the person's hand.\n */\n useEffect(() => {\n const el = stackRef.current;\n if (!el) return;\n\n const onWheel = (e: WheelEvent) => {\n if (live.current.count < 2 || e.deltaY === 0) return;\n e.preventDefault();\n\n // Line or page mode: every event is a notch.\n if (e.deltaMode !== 0) {\n wheelTravel.current = 0;\n stepRef.current(Math.sign(e.deltaY));\n return;\n }\n // A notch-sized event steps at once; small trackpad deltas add up first.\n if (Math.abs(e.deltaY) >= WHEEL_STEP) {\n wheelTravel.current = 0;\n stepRef.current(Math.sign(e.deltaY));\n return;\n }\n wheelTravel.current += e.deltaY;\n if (Math.abs(wheelTravel.current) >= WHEEL_STEP) {\n stepRef.current(Math.sign(wheelTravel.current));\n wheelTravel.current = 0;\n }\n };\n\n el.addEventListener(\"wheel\", onWheel, { passive: false });\n return () => el.removeEventListener(\"wheel\", onWheel);\n // Re-bound when the element can change: it appears with the first item, and\n // moving between a corner and inline remounts it.\n }, [count > 0, position]);\n\n if (count === 0) return null;\n\n const visibleBehind = Math.min(Math.max(0, depth), count - 1);\n const hidden = count - 1 - visibleBehind;\n\n const card = (index: number, k: number) => {\n const item = items[index];\n const isFront = k === 0;\n return (\n <div\n key={getKey(item, index)}\n data-react-fancy-toast-stack-card={isFront ? \"front\" : \"behind\"}\n aria-hidden={isFront ? undefined : true}\n inert={isFront ? undefined : true}\n className={cn(\n CARD,\n \"origin-top transition-transform duration-200\",\n isFront ? \"relative\" : \"pointer-events-none absolute inset-0 overflow-hidden\",\n cardClassName,\n )}\n style={{\n zIndex: depth + 1 - k,\n transform: isFront ? undefined : `translateY(-${k * offset}px) scale(${1 - k * scaleStep})`,\n }}\n >\n {renderItem(item, { index, isFront })}\n </div>\n );\n };\n\n const stackEl = (\n <div\n ref={stackRef}\n data-react-fancy-toast-stack=\"\"\n role=\"region\"\n aria-label={label}\n tabIndex={0}\n onKeyDown={(e) => {\n if (isTextField(e.target)) return;\n if (e.key === \"ArrowDown\" || e.key === \"ArrowRight\") {\n e.preventDefault();\n step(1);\n } else if (e.key === \"ArrowUp\" || e.key === \"ArrowLeft\") {\n e.preventDefault();\n step(-1);\n }\n }}\n className={cn(\n \"pointer-events-auto relative w-80 rounded-xl outline-none focus-visible:ring-2 focus-visible:ring-violet-500 focus-visible:ring-offset-2\",\n className,\n )}\n style={{ paddingTop: visibleBehind * offset }}\n >\n <div className=\"relative\">\n {/* z-index decides what paints on top; the front card sizes the box. */}\n {Array.from({ length: visibleBehind }, (_, i) => i + 1).map((k) =>\n card((front + k) % count, k),\n )}\n {card(front, 0)}\n </div>\n {hidden > 0 && (\n <Badge\n data-react-fancy-toast-stack-more=\"\"\n size=\"sm\"\n variant=\"soft\"\n color=\"zinc\"\n className=\"absolute -top-2 right-2 z-20\"\n >\n +{hidden}\n </Badge>\n )}\n <span data-react-fancy-toast-stack-status=\"\" aria-live=\"polite\" className=\"sr-only\">\n {count > 1 ? `${front + 1} of ${count}` : \"\"}\n </span>\n </div>\n );\n\n if (position === \"inline\") return stackEl;\n\n return (\n <Portal>\n <div\n data-react-fancy-toast-stack-position={position}\n className={cn(\"pointer-events-none fixed z-[100]\", POSITION_STYLES[position])}\n >\n {stackEl}\n </div>\n </Portal>\n );\n}\n\nToastStack.displayName = \"ToastStack\";\n","import { useCallback, useMemo, useRef, useState } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { ToastContext } from \"./Toast.context\";\nimport { ToastItem } from \"./ToastItem\";\nimport { ToastStack } from \"./ToastStack\";\nimport type { ToastData, ToastProviderProps } from \"./Toast.types\";\n\nconst POSITION_STYLES = {\n \"top-right\": \"top-4 right-4\",\n \"top-left\": \"top-4 left-4\",\n \"bottom-right\": \"bottom-4 right-4\",\n \"bottom-left\": \"bottom-4 left-4\",\n} as const;\n\nfunction ToastProvider({\n children,\n position = \"bottom-right\",\n maxToasts = 5,\n}: ToastProviderProps) {\n const [toasts, setToasts] = useState<ToastData[]>([]);\n const idCounter = useRef(0);\n\n const toast = useCallback(\n (data: Omit<ToastData, \"id\">) => {\n const id = `toast-${++idCounter.current}`;\n setToasts((prev) => [...prev.slice(-(maxToasts - 1)), { ...data, id }]);\n return id;\n },\n [maxToasts],\n );\n\n const dismiss = useCallback((id: string) => {\n setToasts((prev) => prev.filter((t) => t.id !== id));\n }, []);\n\n const ctx = useMemo(() => ({ toasts, toast, dismiss }), [toasts, toast, dismiss]);\n\n return (\n <ToastContext.Provider value={ctx}>\n {children}\n <Portal>\n <div\n data-react-fancy-toast=\"\"\n className={cn(\n \"fixed z-[100] flex flex-col gap-2 pointer-events-none\",\n POSITION_STYLES[position],\n )}\n >\n {toasts.map((t) => (\n <ToastItem key={t.id} data={t} onDismiss={dismiss} />\n ))}\n </div>\n </Portal>\n </ToastContext.Provider>\n );\n}\n\nexport const Toast = {\n Provider: ToastProvider,\n Stack: ToastStack,\n Item: ToastItem,\n};\n"]}
|
|
@@ -24,13 +24,17 @@ function CommandInput({
|
|
|
24
24
|
placeholder = "Type a command or search...",
|
|
25
25
|
className
|
|
26
26
|
}) {
|
|
27
|
-
const { query, setQuery } = useCommand();
|
|
27
|
+
const { query, setQuery, listId } = useCommand();
|
|
28
28
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-react-fancy-command-input": "", className: "flex items-center border-b border-zinc-200 px-4 dark:border-zinc-700", children: [
|
|
29
29
|
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { size: 16, className: "shrink-0 text-zinc-400" }),
|
|
30
30
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
31
31
|
"input",
|
|
32
32
|
{
|
|
33
33
|
type: "text",
|
|
34
|
+
role: "combobox",
|
|
35
|
+
"aria-expanded": "true",
|
|
36
|
+
"aria-controls": listId,
|
|
37
|
+
"aria-autocomplete": "list",
|
|
34
38
|
value: query,
|
|
35
39
|
onChange: (e) => setQuery(e.target.value),
|
|
36
40
|
placeholder,
|
|
@@ -45,9 +49,11 @@ function CommandInput({
|
|
|
45
49
|
}
|
|
46
50
|
CommandInput.displayName = "CommandInput";
|
|
47
51
|
function CommandList({ children, className }) {
|
|
52
|
+
const { listId } = useCommand();
|
|
48
53
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
49
54
|
"div",
|
|
50
55
|
{
|
|
56
|
+
id: listId,
|
|
51
57
|
"data-react-fancy-command-list": "",
|
|
52
58
|
role: "listbox",
|
|
53
59
|
className: chunkZU5Q77OT_cjs.cn("max-h-72 overflow-y-auto p-2", className),
|
|
@@ -62,7 +68,8 @@ function CommandItem({
|
|
|
62
68
|
onSelect,
|
|
63
69
|
className
|
|
64
70
|
}) {
|
|
65
|
-
const { query, close, shouldFilter } = useCommand();
|
|
71
|
+
const { query, close, shouldFilter, setActiveIndex } = useCommand();
|
|
72
|
+
const id = react.useId();
|
|
66
73
|
const text = value ?? (typeof children === "string" ? children : "");
|
|
67
74
|
if (shouldFilter && query && !text.toLowerCase().includes(query.toLowerCase())) {
|
|
68
75
|
return null;
|
|
@@ -70,12 +77,19 @@ function CommandItem({
|
|
|
70
77
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
71
78
|
"button",
|
|
72
79
|
{
|
|
80
|
+
id,
|
|
73
81
|
"data-react-fancy-command-item": "",
|
|
74
82
|
type: "button",
|
|
75
83
|
role: "option",
|
|
84
|
+
"aria-selected": false,
|
|
85
|
+
tabIndex: -1,
|
|
86
|
+
onMouseEnter: (e) => {
|
|
87
|
+
const options = e.currentTarget.closest("[data-react-fancy-command]")?.querySelectorAll('[role="option"]');
|
|
88
|
+
if (options) setActiveIndex(Array.from(options).indexOf(e.currentTarget));
|
|
89
|
+
},
|
|
76
90
|
className: chunkZU5Q77OT_cjs.cn(
|
|
77
91
|
"flex w-full items-center rounded-lg px-3 py-2 text-left text-sm transition-colors",
|
|
78
|
-
"text-zinc-700 hover:bg-zinc-100 dark:text-zinc-300 dark:hover:bg-zinc-800",
|
|
92
|
+
"text-zinc-700 hover:bg-zinc-100 data-[active]:bg-zinc-100 dark:text-zinc-300 dark:hover:bg-zinc-800 dark:data-[active]:bg-zinc-800",
|
|
79
93
|
className
|
|
80
94
|
),
|
|
81
95
|
onClick: () => {
|
|
@@ -127,6 +141,7 @@ function CommandRoot({
|
|
|
127
141
|
const [query, setQuery] = chunkSNHU2AI4_cjs.useControllableState(controlledQuery, "", onQueryChange);
|
|
128
142
|
const [activeIndex, setActiveIndex] = react.useState(-1);
|
|
129
143
|
const panelRef = react.useRef(null);
|
|
144
|
+
const listId = react.useId();
|
|
130
145
|
const close = react.useCallback(() => {
|
|
131
146
|
onClose();
|
|
132
147
|
setQuery("");
|
|
@@ -152,27 +167,60 @@ function CommandRoot({
|
|
|
152
167
|
if (!items?.length) return;
|
|
153
168
|
if (e.key === "ArrowDown") {
|
|
154
169
|
e.preventDefault();
|
|
155
|
-
|
|
156
|
-
setActiveIndex(next);
|
|
157
|
-
items[next]?.focus();
|
|
170
|
+
setActiveIndex(activeIndex < items.length - 1 ? activeIndex + 1 : 0);
|
|
158
171
|
} else if (e.key === "ArrowUp") {
|
|
159
172
|
e.preventDefault();
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
173
|
+
setActiveIndex(activeIndex > 0 ? activeIndex - 1 : items.length - 1);
|
|
174
|
+
} else if (e.key === "Enter") {
|
|
175
|
+
if (e.target?.getAttribute("role") === "option") return;
|
|
176
|
+
const pick = items[activeIndex] ?? items[0];
|
|
177
|
+
e.preventDefault();
|
|
178
|
+
pick.click();
|
|
163
179
|
}
|
|
164
180
|
};
|
|
165
181
|
document.addEventListener("keydown", handleKeyDown);
|
|
166
182
|
return () => document.removeEventListener("keydown", handleKeyDown);
|
|
167
183
|
}, [open, activeIndex]);
|
|
184
|
+
react.useLayoutEffect(() => {
|
|
185
|
+
const panel = panelRef.current;
|
|
186
|
+
if (!panel) return;
|
|
187
|
+
const items = Array.from(panel.querySelectorAll('[role="option"]'));
|
|
188
|
+
const active = items[activeIndex];
|
|
189
|
+
items.forEach((item) => {
|
|
190
|
+
const on = item === active;
|
|
191
|
+
item.setAttribute("aria-selected", on ? "true" : "false");
|
|
192
|
+
if (on) item.setAttribute("data-active", "");
|
|
193
|
+
else item.removeAttribute("data-active");
|
|
194
|
+
});
|
|
195
|
+
const input = panel.querySelector("[data-react-fancy-command-input] input");
|
|
196
|
+
if (active?.id) input?.setAttribute("aria-activedescendant", active.id);
|
|
197
|
+
else input?.removeAttribute("aria-activedescendant");
|
|
198
|
+
active?.scrollIntoView?.({ block: "nearest" });
|
|
199
|
+
});
|
|
200
|
+
const changeQuery = react.useCallback(
|
|
201
|
+
(next) => {
|
|
202
|
+
setQuery(next);
|
|
203
|
+
setActiveIndex(-1);
|
|
204
|
+
},
|
|
205
|
+
[setQuery]
|
|
206
|
+
);
|
|
168
207
|
const { mounted, className: animClass, ref: animRef } = chunk3WGRVDQR_cjs.useAnimation({
|
|
169
208
|
open,
|
|
170
209
|
enterClass: "fancy-slide-up",
|
|
171
210
|
exitClass: "fancy-fade-out"
|
|
172
211
|
});
|
|
173
212
|
const ctx = react.useMemo(
|
|
174
|
-
() => ({
|
|
175
|
-
|
|
213
|
+
() => ({
|
|
214
|
+
open,
|
|
215
|
+
close,
|
|
216
|
+
query,
|
|
217
|
+
setQuery: changeQuery,
|
|
218
|
+
activeIndex,
|
|
219
|
+
setActiveIndex,
|
|
220
|
+
shouldFilter,
|
|
221
|
+
listId
|
|
222
|
+
}),
|
|
223
|
+
[open, close, query, changeQuery, activeIndex, shouldFilter, listId]
|
|
176
224
|
);
|
|
177
225
|
if (!mounted) return null;
|
|
178
226
|
return /* @__PURE__ */ jsxRuntime.jsx(CommandContext.Provider, { value: ctx, children: /* @__PURE__ */ jsxRuntime.jsx(chunkNBZC6LOB_cjs.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "fixed inset-0 z-50 flex items-start justify-center pt-[20vh]", children: [
|
|
@@ -212,5 +260,5 @@ var Command = Object.assign(CommandRoot, {
|
|
|
212
260
|
|
|
213
261
|
exports.Command = Command;
|
|
214
262
|
exports.useCommand = useCommand;
|
|
215
|
-
//# sourceMappingURL=chunk-
|
|
216
|
-
//# sourceMappingURL=chunk-
|
|
263
|
+
//# sourceMappingURL=chunk-W7IP6RT3.cjs.map
|
|
264
|
+
//# sourceMappingURL=chunk-W7IP6RT3.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/Command/Command.context.ts","../src/components/Command/CommandInput.tsx","../src/components/Command/CommandList.tsx","../src/components/Command/CommandItem.tsx","../src/components/Command/CommandGroup.tsx","../src/components/Command/CommandEmpty.tsx","../src/components/Command/Command.tsx"],"names":["createContext","useContext","jsxs","jsx","Search","cn","useId","useControllableState","useState","useRef","useCallback","useEscapeKey","useFocusTrap","useEffect","useLayoutEffect","useAnimation","useMemo","Portal"],"mappings":"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","file":"chunk-W7IP6RT3.cjs","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { CommandContextValue } from \"./Command.types\";\n\nexport const CommandContext = createContext<CommandContextValue | null>(null);\n\nexport function useCommand(): CommandContextValue {\n const ctx = useContext(CommandContext);\n if (!ctx) {\n throw new Error(\n \"Command compound components must be used within <Command>\",\n );\n }\n return ctx;\n}\n","import { Search } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { useCommand } from \"./Command.context\";\nimport type { CommandInputProps } from \"./Command.types\";\n\nexport function CommandInput({\n placeholder = \"Type a command or search...\",\n className,\n}: CommandInputProps) {\n const { query, setQuery, listId } = useCommand();\n\n return (\n <div data-react-fancy-command-input=\"\" className=\"flex items-center border-b border-zinc-200 px-4 dark:border-zinc-700\">\n <Search size={16} className=\"shrink-0 text-zinc-400\" />\n <input\n type=\"text\"\n // A combobox: focus stays here while the arrows move the active option,\n // which Command announces through aria-activedescendant.\n role=\"combobox\"\n aria-expanded=\"true\"\n aria-controls={listId}\n aria-autocomplete=\"list\"\n value={query}\n onChange={(e) => setQuery(e.target.value)}\n placeholder={placeholder}\n className={cn(\n \"flex-1 bg-transparent px-3 py-3 text-sm outline-none placeholder:text-zinc-400\",\n className,\n )}\n autoFocus\n />\n </div>\n );\n}\n\nCommandInput.displayName = \"CommandInput\";\n","import { cn } from \"../../utils/cn\";\nimport { useCommand } from \"./Command.context\";\nimport type { CommandListProps } from \"./Command.types\";\n\nexport function CommandList({ children, className }: CommandListProps) {\n const { listId } = useCommand();\n\n return (\n <div\n id={listId}\n data-react-fancy-command-list=\"\"\n role=\"listbox\"\n className={cn(\"max-h-72 overflow-y-auto p-2\", className)}\n >\n {children}\n </div>\n );\n}\n\nCommandList.displayName = \"CommandList\";\n","import { useId } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useCommand } from \"./Command.context\";\nimport type { CommandItemProps } from \"./Command.types\";\n\nexport function CommandItem({\n children,\n value,\n onSelect,\n className,\n}: CommandItemProps) {\n const { query, close, shouldFilter, setActiveIndex } = useCommand();\n // Called before the filter's early return, so the hook order never changes.\n const id = useId();\n\n // Filter by query — unless the caller filters for itself (`shouldFilter={false}`).\n const text = value ?? (typeof children === \"string\" ? children : \"\");\n if (shouldFilter && query && !text.toLowerCase().includes(query.toLowerCase())) {\n return null;\n }\n\n return (\n <button\n id={id}\n data-react-fancy-command-item=\"\"\n type=\"button\"\n role=\"option\"\n // Marked active by Command itself (aria-selected + data-active), since an\n // item cannot know its own position among the rendered options.\n aria-selected={false}\n // Keyboard focus stays in the input; the items are reached with the arrows.\n tabIndex={-1}\n onMouseEnter={(e) => {\n const options = e.currentTarget\n .closest(\"[data-react-fancy-command]\")\n ?.querySelectorAll('[role=\"option\"]');\n if (options) setActiveIndex(Array.from(options).indexOf(e.currentTarget));\n }}\n className={cn(\n \"flex w-full items-center rounded-lg px-3 py-2 text-left text-sm transition-colors\",\n \"text-zinc-700 hover:bg-zinc-100 data-[active]:bg-zinc-100 dark:text-zinc-300 dark:hover:bg-zinc-800 dark:data-[active]:bg-zinc-800\",\n className,\n )}\n onClick={() => {\n onSelect?.();\n close();\n }}\n >\n {children}\n </button>\n );\n}\n\nCommandItem.displayName = \"CommandItem\";\n","import { cn } from \"../../utils/cn\";\nimport type { CommandGroupProps } from \"./Command.types\";\n\nexport function CommandGroup({\n children,\n heading,\n className,\n}: CommandGroupProps) {\n return (\n <div data-react-fancy-command-group=\"\" role=\"group\" className={cn(\"py-1\", className)}>\n {heading && (\n <div className=\"px-3 py-1.5 text-xs font-medium text-zinc-400\">\n {heading}\n </div>\n )}\n {children}\n </div>\n );\n}\n\nCommandGroup.displayName = \"CommandGroup\";\n","import { cn } from \"../../utils/cn\";\nimport type { CommandEmptyProps } from \"./Command.types\";\n\nexport function CommandEmpty({\n children = \"No results found.\",\n className,\n}: CommandEmptyProps) {\n return (\n <div\n data-react-fancy-command-empty=\"\"\n className={cn(\n \"py-6 text-center text-sm text-zinc-500 dark:text-zinc-400\",\n className,\n )}\n >\n {children}\n </div>\n );\n}\n\nCommandEmpty.displayName = \"CommandEmpty\";\n","import {\n useCallback,\n useEffect,\n useId,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { CommandContext } from \"./Command.context\";\nimport { CommandInput } from \"./CommandInput\";\nimport { CommandList } from \"./CommandList\";\nimport { CommandItem } from \"./CommandItem\";\nimport { CommandGroup } from \"./CommandGroup\";\nimport { CommandEmpty } from \"./CommandEmpty\";\nimport { useFocusTrap } from \"../../hooks/use-focus-trap\";\nimport { useEscapeKey } from \"../../hooks/use-escape-key\";\nimport { useAnimation } from \"../../hooks/use-animation\";\nimport { useControllableState } from \"../../hooks/use-controllable-state\";\nimport type { CommandProps } from \"./Command.types\";\n\nfunction CommandRoot({\n children,\n open,\n onClose,\n className,\n shouldFilter = true,\n query: controlledQuery,\n onQueryChange,\n}: CommandProps) {\n const [query, setQuery] = useControllableState(controlledQuery, \"\", onQueryChange);\n const [activeIndex, setActiveIndex] = useState(-1);\n const panelRef = useRef<HTMLDivElement>(null);\n const listId = useId();\n\n const close = useCallback(() => {\n onClose();\n setQuery(\"\");\n setActiveIndex(-1);\n }, [onClose]);\n\n useEscapeKey(close, open);\n useFocusTrap(panelRef, open);\n\n // Cmd+K global shortcut is handled by the consumer\n useEffect(() => {\n if (open) {\n const original = document.body.style.overflow;\n document.body.style.overflow = \"hidden\";\n return () => {\n document.body.style.overflow = original;\n };\n }\n }, [open]);\n\n /*\n * Keyboard navigation, as a combobox: the arrows move the ACTIVE item while\n * focus stays in the input (announced through aria-activedescendant), and\n * Enter picks the active item — or the first visible one when none is active.\n *\n * Focus used to move onto the items, and Enter was handled nowhere, so typing\n * a query and pressing Enter did nothing: only a focused item took Enter, as a\n * native click. Found by Genie 2's real-window test.\n */\n useEffect(() => {\n if (!open) return;\n\n const handleKeyDown = (e: KeyboardEvent) => {\n const items = panelRef.current?.querySelectorAll<HTMLElement>(\n '[role=\"option\"]',\n );\n if (!items?.length) return;\n\n if (e.key === \"ArrowDown\") {\n e.preventDefault();\n setActiveIndex(activeIndex < items.length - 1 ? activeIndex + 1 : 0);\n } else if (e.key === \"ArrowUp\") {\n e.preventDefault();\n setActiveIndex(activeIndex > 0 ? activeIndex - 1 : items.length - 1);\n } else if (e.key === \"Enter\") {\n // A focused item takes Enter natively, as a click; picking here as well\n // would select it twice.\n if ((e.target as HTMLElement | null)?.getAttribute(\"role\") === \"option\") return;\n const pick = items[activeIndex] ?? items[0];\n e.preventDefault();\n pick.click();\n }\n };\n\n document.addEventListener(\"keydown\", handleKeyDown);\n return () => document.removeEventListener(\"keydown\", handleKeyDown);\n }, [open, activeIndex]);\n\n /*\n * Mark the active item and point the input at it. Done on the DOM after each\n * render because an item cannot know its own index — that is its position\n * among the options currently rendered, which filtering changes.\n */\n useLayoutEffect(() => {\n const panel = panelRef.current;\n if (!panel) return;\n\n const items = Array.from(panel.querySelectorAll<HTMLElement>('[role=\"option\"]'));\n const active = items[activeIndex];\n items.forEach((item) => {\n const on = item === active;\n item.setAttribute(\"aria-selected\", on ? \"true\" : \"false\");\n if (on) item.setAttribute(\"data-active\", \"\");\n else item.removeAttribute(\"data-active\");\n });\n\n const input = panel.querySelector<HTMLInputElement>(\"[data-react-fancy-command-input] input\");\n if (active?.id) input?.setAttribute(\"aria-activedescendant\", active.id);\n else input?.removeAttribute(\"aria-activedescendant\");\n active?.scrollIntoView?.({ block: \"nearest\" });\n });\n\n // A new query is a new list: nothing in it is active yet, so Enter picks the first match.\n const changeQuery = useCallback(\n (next: string) => {\n setQuery(next);\n setActiveIndex(-1);\n },\n [setQuery],\n );\n\n const { mounted, className: animClass, ref: animRef } = useAnimation({\n open,\n enterClass: \"fancy-slide-up\",\n exitClass: \"fancy-fade-out\",\n });\n\n const ctx = useMemo(\n () => ({\n open,\n close,\n query,\n setQuery: changeQuery,\n activeIndex,\n setActiveIndex,\n shouldFilter,\n listId,\n }),\n [open, close, query, changeQuery, activeIndex, shouldFilter, listId],\n );\n\n if (!mounted) return null;\n\n return (\n <CommandContext.Provider value={ctx}>\n <Portal>\n <div className=\"fixed inset-0 z-50 flex items-start justify-center pt-[20vh]\">\n <div\n className=\"absolute inset-0 bg-black/50 backdrop-blur-sm\"\n onClick={close}\n aria-hidden=\"true\"\n />\n <div\n ref={(node) => {\n panelRef.current = node;\n (animRef as React.MutableRefObject<HTMLElement | null>).current =\n node;\n }}\n data-react-fancy-command=\"\"\n className={cn(\n \"relative w-full max-w-lg overflow-hidden rounded-2xl border border-zinc-200 bg-white shadow-2xl dark:border-zinc-700 dark:bg-zinc-900\",\n animClass,\n className,\n )}\n >\n {children}\n </div>\n </div>\n </Portal>\n </CommandContext.Provider>\n );\n}\n\nexport const Command = Object.assign(CommandRoot, {\n Input: CommandInput,\n List: CommandList,\n Item: CommandItem,\n Group: CommandGroup,\n Empty: CommandEmpty,\n});\n"]}
|
package/dist/command.cjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var chunkW7IP6RT3_cjs = require('./chunk-W7IP6RT3.cjs');
|
|
4
4
|
require('./chunk-TXTRTTG7.cjs');
|
|
5
5
|
require('./chunk-3WGRVDQR.cjs');
|
|
6
6
|
require('./chunk-NBZC6LOB.cjs');
|
|
@@ -12,11 +12,11 @@ require('./chunk-ZU5Q77OT.cjs');
|
|
|
12
12
|
|
|
13
13
|
Object.defineProperty(exports, "Command", {
|
|
14
14
|
enumerable: true,
|
|
15
|
-
get: function () { return
|
|
15
|
+
get: function () { return chunkW7IP6RT3_cjs.Command; }
|
|
16
16
|
});
|
|
17
17
|
Object.defineProperty(exports, "useCommand", {
|
|
18
18
|
enumerable: true,
|
|
19
|
-
get: function () { return
|
|
19
|
+
get: function () { return chunkW7IP6RT3_cjs.useCommand; }
|
|
20
20
|
});
|
|
21
21
|
//# sourceMappingURL=command.cjs.map
|
|
22
22
|
//# sourceMappingURL=command.cjs.map
|
package/dist/command.d.cts
CHANGED
|
@@ -9,6 +9,8 @@ interface CommandContextValue {
|
|
|
9
9
|
activeIndex: number;
|
|
10
10
|
setActiveIndex: (index: number) => void;
|
|
11
11
|
shouldFilter: boolean;
|
|
12
|
+
/** The listbox's id, so the input can point at it (`aria-controls`). */
|
|
13
|
+
listId: string;
|
|
12
14
|
}
|
|
13
15
|
interface CommandProps {
|
|
14
16
|
children: ReactNode;
|
package/dist/command.d.ts
CHANGED
|
@@ -9,6 +9,8 @@ interface CommandContextValue {
|
|
|
9
9
|
activeIndex: number;
|
|
10
10
|
setActiveIndex: (index: number) => void;
|
|
11
11
|
shouldFilter: boolean;
|
|
12
|
+
/** The listbox's id, so the input can point at it (`aria-controls`). */
|
|
13
|
+
listId: string;
|
|
12
14
|
}
|
|
13
15
|
interface CommandProps {
|
|
14
16
|
children: ReactNode;
|
package/dist/command.js
CHANGED
package/dist/index.cjs
CHANGED
|
@@ -18,7 +18,7 @@ require('./chunk-XURQVDCN.cjs');
|
|
|
18
18
|
var chunkCOH45MGW_cjs = require('./chunk-COH45MGW.cjs');
|
|
19
19
|
var chunkYMDYDUBH_cjs = require('./chunk-YMDYDUBH.cjs');
|
|
20
20
|
var chunkRLMU3NHQ_cjs = require('./chunk-RLMU3NHQ.cjs');
|
|
21
|
-
var
|
|
21
|
+
var chunkUBZFOTZN_cjs = require('./chunk-UBZFOTZN.cjs');
|
|
22
22
|
var chunk7VLRHXLQ_cjs = require('./chunk-7VLRHXLQ.cjs');
|
|
23
23
|
var chunk5P3PISAX_cjs = require('./chunk-5P3PISAX.cjs');
|
|
24
24
|
var chunkOS2QC3NE_cjs = require('./chunk-OS2QC3NE.cjs');
|
|
@@ -86,7 +86,7 @@ require('./chunk-AIA5UNQ5.cjs');
|
|
|
86
86
|
var chunkG7227RTY_cjs = require('./chunk-G7227RTY.cjs');
|
|
87
87
|
require('./chunk-XFBLUPKF.cjs');
|
|
88
88
|
var chunkBVRPDMB7_cjs = require('./chunk-BVRPDMB7.cjs');
|
|
89
|
-
var
|
|
89
|
+
var chunkW7IP6RT3_cjs = require('./chunk-W7IP6RT3.cjs');
|
|
90
90
|
var chunkTXTRTTG7_cjs = require('./chunk-TXTRTTG7.cjs');
|
|
91
91
|
var chunk3WGRVDQR_cjs = require('./chunk-3WGRVDQR.cjs');
|
|
92
92
|
var chunkBZOU7VJQ_cjs = require('./chunk-BZOU7VJQ.cjs');
|
|
@@ -179,11 +179,11 @@ Object.defineProperty(exports, "Timeline", {
|
|
|
179
179
|
});
|
|
180
180
|
Object.defineProperty(exports, "Toast", {
|
|
181
181
|
enumerable: true,
|
|
182
|
-
get: function () { return
|
|
182
|
+
get: function () { return chunkUBZFOTZN_cjs.Toast; }
|
|
183
183
|
});
|
|
184
184
|
Object.defineProperty(exports, "useToast", {
|
|
185
185
|
enumerable: true,
|
|
186
|
-
get: function () { return
|
|
186
|
+
get: function () { return chunkUBZFOTZN_cjs.useToast; }
|
|
187
187
|
});
|
|
188
188
|
Object.defineProperty(exports, "TreeNav", {
|
|
189
189
|
enumerable: true,
|
|
@@ -627,11 +627,11 @@ Object.defineProperty(exports, "ColorPicker", {
|
|
|
627
627
|
});
|
|
628
628
|
Object.defineProperty(exports, "Command", {
|
|
629
629
|
enumerable: true,
|
|
630
|
-
get: function () { return
|
|
630
|
+
get: function () { return chunkW7IP6RT3_cjs.Command; }
|
|
631
631
|
});
|
|
632
632
|
Object.defineProperty(exports, "useCommand", {
|
|
633
633
|
enumerable: true,
|
|
634
|
-
get: function () { return
|
|
634
|
+
get: function () { return chunkW7IP6RT3_cjs.useCommand; }
|
|
635
635
|
});
|
|
636
636
|
Object.defineProperty(exports, "useFocusTrap", {
|
|
637
637
|
enumerable: true,
|
package/dist/index.js
CHANGED
|
@@ -16,7 +16,7 @@ import './chunk-TMR56BBE.js';
|
|
|
16
16
|
export { TimeGrid } from './chunk-7CN7IHES.js';
|
|
17
17
|
export { TimePicker } from './chunk-OTCLBINT.js';
|
|
18
18
|
export { Timeline } from './chunk-7JDVCQXD.js';
|
|
19
|
-
export { Toast, useToast } from './chunk-
|
|
19
|
+
export { Toast, useToast } from './chunk-3AQLEMH7.js';
|
|
20
20
|
export { TreeNav, useTreeNav } from './chunk-NUPQJ5SJ.js';
|
|
21
21
|
export { Section } from './chunk-SLJD25VV.js';
|
|
22
22
|
export { Separator } from './chunk-ZLWCZV7R.js';
|
|
@@ -84,7 +84,7 @@ import './chunk-TJ66S5K6.js';
|
|
|
84
84
|
export { CodeView } from './chunk-FBWUXSKH.js';
|
|
85
85
|
import './chunk-J324MF75.js';
|
|
86
86
|
export { ColorPicker } from './chunk-F2GAZZVS.js';
|
|
87
|
-
export { Command, useCommand } from './chunk-
|
|
87
|
+
export { Command, useCommand } from './chunk-D354R6T6.js';
|
|
88
88
|
export { useFocusTrap } from './chunk-5U2DZ7AV.js';
|
|
89
89
|
export { useAnimation } from './chunk-CHADHN6M.js';
|
|
90
90
|
export { Composer } from './chunk-MXAVGOHW.js';
|
package/dist/toast.cjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var chunkUBZFOTZN_cjs = require('./chunk-UBZFOTZN.cjs');
|
|
4
4
|
require('./chunk-VBWRH4UW.cjs');
|
|
5
5
|
require('./chunk-MOU6O324.cjs');
|
|
6
6
|
require('./chunk-NBZC6LOB.cjs');
|
|
@@ -11,11 +11,11 @@ require('./chunk-ZU5Q77OT.cjs');
|
|
|
11
11
|
|
|
12
12
|
Object.defineProperty(exports, "Toast", {
|
|
13
13
|
enumerable: true,
|
|
14
|
-
get: function () { return
|
|
14
|
+
get: function () { return chunkUBZFOTZN_cjs.Toast; }
|
|
15
15
|
});
|
|
16
16
|
Object.defineProperty(exports, "useToast", {
|
|
17
17
|
enumerable: true,
|
|
18
|
-
get: function () { return
|
|
18
|
+
get: function () { return chunkUBZFOTZN_cjs.useToast; }
|
|
19
19
|
});
|
|
20
20
|
//# sourceMappingURL=toast.cjs.map
|
|
21
21
|
//# sourceMappingURL=toast.cjs.map
|
package/dist/toast.d.cts
CHANGED
|
@@ -44,6 +44,11 @@ interface ToastItemProps {
|
|
|
44
44
|
onDismiss: (id: string) => void;
|
|
45
45
|
}
|
|
46
46
|
|
|
47
|
+
declare function ToastItem({ data, onDismiss }: ToastItemProps): react.JSX.Element;
|
|
48
|
+
declare namespace ToastItem {
|
|
49
|
+
var displayName: string;
|
|
50
|
+
}
|
|
51
|
+
|
|
47
52
|
interface ToastStackProps<T> {
|
|
48
53
|
/**
|
|
49
54
|
* Everything to show — the stack is a VIEW of this list and owns none of it.
|
|
@@ -95,6 +100,7 @@ declare function ToastProvider({ children, position, maxToasts, }: ToastProvider
|
|
|
95
100
|
declare const Toast: {
|
|
96
101
|
Provider: typeof ToastProvider;
|
|
97
102
|
Stack: typeof ToastStack;
|
|
103
|
+
Item: typeof ToastItem;
|
|
98
104
|
};
|
|
99
105
|
|
|
100
106
|
declare function useToast(): ToastContextValue;
|
package/dist/toast.d.ts
CHANGED
|
@@ -44,6 +44,11 @@ interface ToastItemProps {
|
|
|
44
44
|
onDismiss: (id: string) => void;
|
|
45
45
|
}
|
|
46
46
|
|
|
47
|
+
declare function ToastItem({ data, onDismiss }: ToastItemProps): react.JSX.Element;
|
|
48
|
+
declare namespace ToastItem {
|
|
49
|
+
var displayName: string;
|
|
50
|
+
}
|
|
51
|
+
|
|
47
52
|
interface ToastStackProps<T> {
|
|
48
53
|
/**
|
|
49
54
|
* Everything to show — the stack is a VIEW of this list and owns none of it.
|
|
@@ -95,6 +100,7 @@ declare function ToastProvider({ children, position, maxToasts, }: ToastProvider
|
|
|
95
100
|
declare const Toast: {
|
|
96
101
|
Provider: typeof ToastProvider;
|
|
97
102
|
Stack: typeof ToastStack;
|
|
103
|
+
Item: typeof ToastItem;
|
|
98
104
|
};
|
|
99
105
|
|
|
100
106
|
declare function useToast(): ToastContextValue;
|
package/dist/toast.js
CHANGED
package/package.json
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Command/Command.context.ts","../src/components/Command/CommandInput.tsx","../src/components/Command/CommandList.tsx","../src/components/Command/CommandItem.tsx","../src/components/Command/CommandGroup.tsx","../src/components/Command/CommandEmpty.tsx","../src/components/Command/Command.tsx"],"names":["createContext","useContext","jsxs","jsx","Search","cn","useControllableState","useState","useRef","useCallback","useEscapeKey","useFocusTrap","useEffect","useAnimation","useMemo","Portal"],"mappings":"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","file":"chunk-35TZQIIN.cjs","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { CommandContextValue } from \"./Command.types\";\n\nexport const CommandContext = createContext<CommandContextValue | null>(null);\n\nexport function useCommand(): CommandContextValue {\n const ctx = useContext(CommandContext);\n if (!ctx) {\n throw new Error(\n \"Command compound components must be used within <Command>\",\n );\n }\n return ctx;\n}\n","import { Search } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { useCommand } from \"./Command.context\";\nimport type { CommandInputProps } from \"./Command.types\";\n\nexport function CommandInput({\n placeholder = \"Type a command or search...\",\n className,\n}: CommandInputProps) {\n const { query, setQuery } = useCommand();\n\n return (\n <div data-react-fancy-command-input=\"\" className=\"flex items-center border-b border-zinc-200 px-4 dark:border-zinc-700\">\n <Search size={16} className=\"shrink-0 text-zinc-400\" />\n <input\n type=\"text\"\n value={query}\n onChange={(e) => setQuery(e.target.value)}\n placeholder={placeholder}\n className={cn(\n \"flex-1 bg-transparent px-3 py-3 text-sm outline-none placeholder:text-zinc-400\",\n className,\n )}\n autoFocus\n />\n </div>\n );\n}\n\nCommandInput.displayName = \"CommandInput\";\n","import { cn } from \"../../utils/cn\";\nimport type { CommandListProps } from \"./Command.types\";\n\nexport function CommandList({ children, className }: CommandListProps) {\n return (\n <div\n data-react-fancy-command-list=\"\"\n role=\"listbox\"\n className={cn(\"max-h-72 overflow-y-auto p-2\", className)}\n >\n {children}\n </div>\n );\n}\n\nCommandList.displayName = \"CommandList\";\n","import { cn } from \"../../utils/cn\";\nimport { useCommand } from \"./Command.context\";\nimport type { CommandItemProps } from \"./Command.types\";\n\nexport function CommandItem({\n children,\n value,\n onSelect,\n className,\n}: CommandItemProps) {\n const { query, close, shouldFilter } = useCommand();\n\n // Filter by query — unless the caller filters for itself (`shouldFilter={false}`).\n const text = value ?? (typeof children === \"string\" ? children : \"\");\n if (shouldFilter && query && !text.toLowerCase().includes(query.toLowerCase())) {\n return null;\n }\n\n return (\n <button\n data-react-fancy-command-item=\"\"\n type=\"button\"\n role=\"option\"\n className={cn(\n \"flex w-full items-center rounded-lg px-3 py-2 text-left text-sm transition-colors\",\n \"text-zinc-700 hover:bg-zinc-100 dark:text-zinc-300 dark:hover:bg-zinc-800\",\n className,\n )}\n onClick={() => {\n onSelect?.();\n close();\n }}\n >\n {children}\n </button>\n );\n}\n\nCommandItem.displayName = \"CommandItem\";\n","import { cn } from \"../../utils/cn\";\nimport type { CommandGroupProps } from \"./Command.types\";\n\nexport function CommandGroup({\n children,\n heading,\n className,\n}: CommandGroupProps) {\n return (\n <div data-react-fancy-command-group=\"\" role=\"group\" className={cn(\"py-1\", className)}>\n {heading && (\n <div className=\"px-3 py-1.5 text-xs font-medium text-zinc-400\">\n {heading}\n </div>\n )}\n {children}\n </div>\n );\n}\n\nCommandGroup.displayName = \"CommandGroup\";\n","import { cn } from \"../../utils/cn\";\nimport type { CommandEmptyProps } from \"./Command.types\";\n\nexport function CommandEmpty({\n children = \"No results found.\",\n className,\n}: CommandEmptyProps) {\n return (\n <div\n data-react-fancy-command-empty=\"\"\n className={cn(\n \"py-6 text-center text-sm text-zinc-500 dark:text-zinc-400\",\n className,\n )}\n >\n {children}\n </div>\n );\n}\n\nCommandEmpty.displayName = \"CommandEmpty\";\n","import { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { CommandContext } from \"./Command.context\";\nimport { CommandInput } from \"./CommandInput\";\nimport { CommandList } from \"./CommandList\";\nimport { CommandItem } from \"./CommandItem\";\nimport { CommandGroup } from \"./CommandGroup\";\nimport { CommandEmpty } from \"./CommandEmpty\";\nimport { useFocusTrap } from \"../../hooks/use-focus-trap\";\nimport { useEscapeKey } from \"../../hooks/use-escape-key\";\nimport { useAnimation } from \"../../hooks/use-animation\";\nimport { useControllableState } from \"../../hooks/use-controllable-state\";\nimport type { CommandProps } from \"./Command.types\";\n\nfunction CommandRoot({\n children,\n open,\n onClose,\n className,\n shouldFilter = true,\n query: controlledQuery,\n onQueryChange,\n}: CommandProps) {\n const [query, setQuery] = useControllableState(controlledQuery, \"\", onQueryChange);\n const [activeIndex, setActiveIndex] = useState(-1);\n const panelRef = useRef<HTMLDivElement>(null);\n\n const close = useCallback(() => {\n onClose();\n setQuery(\"\");\n setActiveIndex(-1);\n }, [onClose]);\n\n useEscapeKey(close, open);\n useFocusTrap(panelRef, open);\n\n // Cmd+K global shortcut is handled by the consumer\n useEffect(() => {\n if (open) {\n const original = document.body.style.overflow;\n document.body.style.overflow = \"hidden\";\n return () => {\n document.body.style.overflow = original;\n };\n }\n }, [open]);\n\n // Keyboard navigation\n useEffect(() => {\n if (!open) return;\n\n const handleKeyDown = (e: KeyboardEvent) => {\n const items = panelRef.current?.querySelectorAll<HTMLElement>(\n '[role=\"option\"]',\n );\n if (!items?.length) return;\n\n if (e.key === \"ArrowDown\") {\n e.preventDefault();\n const next = activeIndex < items.length - 1 ? activeIndex + 1 : 0;\n setActiveIndex(next);\n items[next]?.focus();\n } else if (e.key === \"ArrowUp\") {\n e.preventDefault();\n const prev = activeIndex > 0 ? activeIndex - 1 : items.length - 1;\n setActiveIndex(prev);\n items[prev]?.focus();\n }\n };\n\n document.addEventListener(\"keydown\", handleKeyDown);\n return () => document.removeEventListener(\"keydown\", handleKeyDown);\n }, [open, activeIndex]);\n\n const { mounted, className: animClass, ref: animRef } = useAnimation({\n open,\n enterClass: \"fancy-slide-up\",\n exitClass: \"fancy-fade-out\",\n });\n\n const ctx = useMemo(\n () => ({ open, close, query, setQuery, activeIndex, setActiveIndex, shouldFilter }),\n [open, close, query, setQuery, activeIndex, shouldFilter],\n );\n\n if (!mounted) return null;\n\n return (\n <CommandContext.Provider value={ctx}>\n <Portal>\n <div className=\"fixed inset-0 z-50 flex items-start justify-center pt-[20vh]\">\n <div\n className=\"absolute inset-0 bg-black/50 backdrop-blur-sm\"\n onClick={close}\n aria-hidden=\"true\"\n />\n <div\n ref={(node) => {\n panelRef.current = node;\n (animRef as React.MutableRefObject<HTMLElement | null>).current =\n node;\n }}\n data-react-fancy-command=\"\"\n className={cn(\n \"relative w-full max-w-lg overflow-hidden rounded-2xl border border-zinc-200 bg-white shadow-2xl dark:border-zinc-700 dark:bg-zinc-900\",\n animClass,\n className,\n )}\n >\n {children}\n </div>\n </div>\n </Portal>\n </CommandContext.Provider>\n );\n}\n\nexport const Command = Object.assign(CommandRoot, {\n Input: CommandInput,\n List: CommandList,\n Item: CommandItem,\n Group: CommandGroup,\n Empty: CommandEmpty,\n});\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Toast/Toast.context.ts","../src/components/Toast/ToastItem.tsx","../src/components/Toast/ToastStack.tsx","../src/components/Toast/Toast.tsx"],"names":["createContext","useContext","useEffect","jsx","cn","jsxs","Check","XCircle","AlertTriangle","Info","X","useControllableState","useRef","Badge","Portal","POSITION_STYLES","useState","useCallback","useMemo"],"mappings":"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","file":"chunk-EOBWEJCU.cjs","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { ToastContextValue } from \"./Toast.types\";\n\nexport const ToastContext = createContext<ToastContextValue | null>(null);\n\nexport function useToast(): ToastContextValue {\n const ctx = useContext(ToastContext);\n if (!ctx) {\n throw new Error(\"useToast must be used within a <Toast.Provider>\");\n }\n return ctx;\n}\n","import { useEffect } from \"react\";\nimport { AlertTriangle, Check, Info, X, XCircle } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport type { ToastItemProps } from \"./Toast.types\";\n\nconst VARIANT_STYLES = {\n default:\n \"border-zinc-200 bg-white dark:border-zinc-700 dark:bg-zinc-900\",\n success:\n \"border-emerald-200 bg-emerald-50 dark:border-emerald-800 dark:bg-emerald-950\",\n error:\n \"border-red-200 bg-red-50 dark:border-red-800 dark:bg-red-950\",\n warning:\n \"border-amber-200 bg-amber-50 dark:border-amber-800 dark:bg-amber-950\",\n info: \"border-blue-200 bg-blue-50 dark:border-blue-800 dark:bg-blue-950\",\n} as const;\n\nconst VARIANT_ICON_COLORS = {\n default: \"text-zinc-400\",\n success: \"text-emerald-500\",\n error: \"text-red-500\",\n warning: \"text-amber-500\",\n info: \"text-blue-500\",\n} as const;\n\nexport function ToastItem({ data, onDismiss }: ToastItemProps) {\n const { id, title, description, variant = \"default\", action } = data;\n // An action toast does not expire by default.\n const duration = data.duration ?? (action ? 0 : 5000);\n\n useEffect(() => {\n if (duration <= 0) return;\n const timer = setTimeout(() => onDismiss(id), duration);\n return () => clearTimeout(timer);\n }, [id, duration, onDismiss]);\n\n return (\n <div\n data-react-fancy-toast-item=\"\"\n role=\"alert\"\n // Scoped to the toast rather than the document: a global Escape handler\n // would fight whatever modal or drawer is already listening.\n onKeyDown={(e) => {\n if (e.key === \"Escape\") onDismiss(id);\n }}\n className={cn(\n \"fancy-toast-in pointer-events-auto w-80 rounded-xl border p-4 shadow-lg\",\n VARIANT_STYLES[variant],\n )}\n >\n <div className=\"flex items-start gap-3\">\n <div className={cn(\"mt-0.5 shrink-0\", VARIANT_ICON_COLORS[variant])}>\n {variant === \"success\" && <Check size={16} />}\n {variant === \"error\" && <XCircle size={16} />}\n {variant === \"warning\" && <AlertTriangle size={16} />}\n {variant === \"info\" && <Info size={16} />}\n </div>\n <div className=\"flex-1 min-w-0\">\n <p className=\"text-sm font-medium text-zinc-900 dark:text-zinc-100\">{title}</p>\n {description && (\n <p className=\"mt-1 text-xs text-zinc-500 dark:text-zinc-400\">\n {description}\n </p>\n )}\n </div>\n {action && (\n <button\n type=\"button\"\n onClick={() => {\n action.onClick();\n // The offer is consumed; leaving it up invites undoing an\n // already-undone action.\n onDismiss(id);\n }}\n className=\"shrink-0 self-center rounded-md px-2 py-1 text-xs font-medium text-zinc-700 underline-offset-2 transition-colors hover:bg-zinc-100 hover:underline dark:text-zinc-200 dark:hover:bg-zinc-800\"\n >\n {action.label}\n </button>\n )}\n <button\n type=\"button\"\n onClick={() => onDismiss(id)}\n className=\"shrink-0 rounded p-0.5 text-zinc-400 transition-colors hover:text-zinc-600 dark:hover:text-zinc-300\"\n aria-label=\"Dismiss\"\n >\n <X size={14} />\n </button>\n </div>\n </div>\n );\n}\n\nToastItem.displayName = \"ToastItem\";\n","import { useEffect, useRef, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useControllableState } from \"../../hooks/use-controllable-state\";\nimport { Portal } from \"../Portal\";\nimport { Badge } from \"../Badge\";\nimport type { ToastPosition } from \"./Toast.types\";\n\nexport interface ToastStackProps<T> {\n /**\n * Everything to show — the stack is a VIEW of this list and owns none of it.\n * There is no limit and no timer: an item leaves only when you remove it.\n */\n items: readonly T[];\n /** One card's content, actions included. Only the front card is interactive. */\n renderItem: (item: T, state: { index: number; isFront: boolean }) => ReactNode;\n /** A stable key per item. Defaults to `item.id`, then the index. */\n getKey?: (item: T, index: number) => string;\n /** How many cards show behind the front one. Default 2. */\n depth?: number;\n /** How far each card behind peeks out above the one in front, in px. Default 8. */\n offset?: number;\n /** How much smaller each card behind is than the one in front. Default 0.05. */\n scaleStep?: number;\n /** Which item is in front, if you want to own it. Wraps; out-of-range values are clamped. */\n frontIndex?: number;\n defaultFrontIndex?: number;\n onFrontIndexChange?: (index: number) => void;\n /** A screen corner, or `\"inline\"` to render where it is placed. Default `\"bottom-right\"`. */\n position?: ToastPosition | \"inline\";\n /** The stack's accessible name. Default \"Notifications\". */\n label?: string;\n /** Classes for each card's shell, merged onto the defaults. */\n cardClassName?: string;\n className?: string;\n}\n\nconst POSITION_STYLES: Record<ToastPosition, string> = {\n \"top-right\": \"top-4 right-4\",\n \"top-left\": \"top-4 left-4\",\n \"bottom-right\": \"bottom-4 right-4\",\n \"bottom-left\": \"bottom-4 left-4\",\n};\n\n/** Pixels of wheel travel that count as one step. A mouse notch is ~100; a trackpad sends many small ones. */\nconst WHEEL_STEP = 50;\n\nconst CARD =\n \"rounded-xl border border-zinc-200 bg-white p-4 shadow-lg dark:border-zinc-700 dark:bg-zinc-900\";\n\nfunction defaultKey(item: unknown, index: number): string {\n const id = (item as { id?: unknown } | null)?.id;\n return typeof id === \"string\" || typeof id === \"number\" ? String(id) : String(index);\n}\n\nfunction isTextField(target: EventTarget | null): boolean {\n if (!(target instanceof HTMLElement)) return false;\n return (\n target.isContentEditable ||\n target.getAttribute(\"contenteditable\") === \"true\" ||\n /^(INPUT|TEXTAREA|SELECT)$/.test(target.tagName)\n );\n}\n\n/**\n * A controlled stack of actionable toasts — approval requests, say — that the\n * person walks through rather than races.\n *\n * Built for react-fancy#33. The owner's requirements were that requests stack\n * behind each other with a slight top offset, that scrolling over the stack\n * walks through them, and that a pending request NEVER expires or disappears.\n * The last is why this is a view of the caller's list rather than a queue it\n * keeps: there is nothing here that can drop an item, because nothing here owns\n * one. (The imperative provider's `maxToasts` silently drops the oldest.)\n */\nexport function ToastStack<T>({\n items,\n renderItem,\n getKey = defaultKey,\n depth = 2,\n offset = 8,\n scaleStep = 0.05,\n frontIndex: controlledFront,\n defaultFrontIndex = 0,\n onFrontIndexChange,\n position = \"bottom-right\",\n label = \"Notifications\",\n cardClassName,\n className,\n}: ToastStackProps<T>) {\n const [rawFront, setFront] = useControllableState(\n controlledFront,\n defaultFrontIndex,\n onFrontIndexChange,\n );\n const count = items.length;\n // Clamped for display rather than corrected through onChange: a list that\n // shrinks under a far-forward index must not make render report a change.\n const front = count === 0 ? 0 : ((rawFront % count) + count) % count;\n\n const stackRef = useRef<HTMLDivElement>(null);\n const wheelTravel = useRef(0);\n const live = useRef({ front, count });\n live.current = { front, count };\n\n const step = (by: number) => {\n const { front: current, count: n } = live.current;\n if (n < 2) return;\n setFront((((current + by) % n) + n) % n);\n };\n const stepRef = useRef(step);\n stepRef.current = step;\n\n /*\n * A native listener, because React's wheel listener is passive and cannot stop\n * the page scrolling underneath — and a stack that cycles AND scrolls the page\n * moves two things at once under the person's hand.\n */\n useEffect(() => {\n const el = stackRef.current;\n if (!el) return;\n\n const onWheel = (e: WheelEvent) => {\n if (live.current.count < 2 || e.deltaY === 0) return;\n e.preventDefault();\n\n // Line or page mode: every event is a notch.\n if (e.deltaMode !== 0) {\n wheelTravel.current = 0;\n stepRef.current(Math.sign(e.deltaY));\n return;\n }\n // A notch-sized event steps at once; small trackpad deltas add up first.\n if (Math.abs(e.deltaY) >= WHEEL_STEP) {\n wheelTravel.current = 0;\n stepRef.current(Math.sign(e.deltaY));\n return;\n }\n wheelTravel.current += e.deltaY;\n if (Math.abs(wheelTravel.current) >= WHEEL_STEP) {\n stepRef.current(Math.sign(wheelTravel.current));\n wheelTravel.current = 0;\n }\n };\n\n el.addEventListener(\"wheel\", onWheel, { passive: false });\n return () => el.removeEventListener(\"wheel\", onWheel);\n // Re-bound when the element can change: it appears with the first item, and\n // moving between a corner and inline remounts it.\n }, [count > 0, position]);\n\n if (count === 0) return null;\n\n const visibleBehind = Math.min(Math.max(0, depth), count - 1);\n const hidden = count - 1 - visibleBehind;\n\n const card = (index: number, k: number) => {\n const item = items[index];\n const isFront = k === 0;\n return (\n <div\n key={getKey(item, index)}\n data-react-fancy-toast-stack-card={isFront ? \"front\" : \"behind\"}\n aria-hidden={isFront ? undefined : true}\n inert={isFront ? undefined : true}\n className={cn(\n CARD,\n \"origin-top transition-transform duration-200\",\n isFront ? \"relative\" : \"pointer-events-none absolute inset-0 overflow-hidden\",\n cardClassName,\n )}\n style={{\n zIndex: depth + 1 - k,\n transform: isFront ? undefined : `translateY(-${k * offset}px) scale(${1 - k * scaleStep})`,\n }}\n >\n {renderItem(item, { index, isFront })}\n </div>\n );\n };\n\n const stackEl = (\n <div\n ref={stackRef}\n data-react-fancy-toast-stack=\"\"\n role=\"region\"\n aria-label={label}\n tabIndex={0}\n onKeyDown={(e) => {\n if (isTextField(e.target)) return;\n if (e.key === \"ArrowDown\" || e.key === \"ArrowRight\") {\n e.preventDefault();\n step(1);\n } else if (e.key === \"ArrowUp\" || e.key === \"ArrowLeft\") {\n e.preventDefault();\n step(-1);\n }\n }}\n className={cn(\n \"pointer-events-auto relative w-80 rounded-xl outline-none focus-visible:ring-2 focus-visible:ring-violet-500 focus-visible:ring-offset-2\",\n className,\n )}\n style={{ paddingTop: visibleBehind * offset }}\n >\n <div className=\"relative\">\n {/* z-index decides what paints on top; the front card sizes the box. */}\n {Array.from({ length: visibleBehind }, (_, i) => i + 1).map((k) =>\n card((front + k) % count, k),\n )}\n {card(front, 0)}\n </div>\n {hidden > 0 && (\n <Badge\n data-react-fancy-toast-stack-more=\"\"\n size=\"sm\"\n variant=\"soft\"\n color=\"zinc\"\n className=\"absolute -top-2 right-2 z-20\"\n >\n +{hidden}\n </Badge>\n )}\n <span data-react-fancy-toast-stack-status=\"\" aria-live=\"polite\" className=\"sr-only\">\n {count > 1 ? `${front + 1} of ${count}` : \"\"}\n </span>\n </div>\n );\n\n if (position === \"inline\") return stackEl;\n\n return (\n <Portal>\n <div\n data-react-fancy-toast-stack-position={position}\n className={cn(\"pointer-events-none fixed z-[100]\", POSITION_STYLES[position])}\n >\n {stackEl}\n </div>\n </Portal>\n );\n}\n\nToastStack.displayName = \"ToastStack\";\n","import { useCallback, useMemo, useRef, useState } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { ToastContext } from \"./Toast.context\";\nimport { ToastItem } from \"./ToastItem\";\nimport { ToastStack } from \"./ToastStack\";\nimport type { ToastData, ToastProviderProps } from \"./Toast.types\";\n\nconst POSITION_STYLES = {\n \"top-right\": \"top-4 right-4\",\n \"top-left\": \"top-4 left-4\",\n \"bottom-right\": \"bottom-4 right-4\",\n \"bottom-left\": \"bottom-4 left-4\",\n} as const;\n\nfunction ToastProvider({\n children,\n position = \"bottom-right\",\n maxToasts = 5,\n}: ToastProviderProps) {\n const [toasts, setToasts] = useState<ToastData[]>([]);\n const idCounter = useRef(0);\n\n const toast = useCallback(\n (data: Omit<ToastData, \"id\">) => {\n const id = `toast-${++idCounter.current}`;\n setToasts((prev) => [...prev.slice(-(maxToasts - 1)), { ...data, id }]);\n return id;\n },\n [maxToasts],\n );\n\n const dismiss = useCallback((id: string) => {\n setToasts((prev) => prev.filter((t) => t.id !== id));\n }, []);\n\n const ctx = useMemo(() => ({ toasts, toast, dismiss }), [toasts, toast, dismiss]);\n\n return (\n <ToastContext.Provider value={ctx}>\n {children}\n <Portal>\n <div\n data-react-fancy-toast=\"\"\n className={cn(\n \"fixed z-[100] flex flex-col gap-2 pointer-events-none\",\n POSITION_STYLES[position],\n )}\n >\n {toasts.map((t) => (\n <ToastItem key={t.id} data={t} onDismiss={dismiss} />\n ))}\n </div>\n </Portal>\n </ToastContext.Provider>\n );\n}\n\nexport const Toast = {\n Provider: ToastProvider,\n Stack: ToastStack,\n};\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Command/Command.context.ts","../src/components/Command/CommandInput.tsx","../src/components/Command/CommandList.tsx","../src/components/Command/CommandItem.tsx","../src/components/Command/CommandGroup.tsx","../src/components/Command/CommandEmpty.tsx","../src/components/Command/Command.tsx"],"names":["jsx","jsxs"],"mappings":"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","file":"chunk-H6WSJL2X.js","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { CommandContextValue } from \"./Command.types\";\n\nexport const CommandContext = createContext<CommandContextValue | null>(null);\n\nexport function useCommand(): CommandContextValue {\n const ctx = useContext(CommandContext);\n if (!ctx) {\n throw new Error(\n \"Command compound components must be used within <Command>\",\n );\n }\n return ctx;\n}\n","import { Search } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { useCommand } from \"./Command.context\";\nimport type { CommandInputProps } from \"./Command.types\";\n\nexport function CommandInput({\n placeholder = \"Type a command or search...\",\n className,\n}: CommandInputProps) {\n const { query, setQuery } = useCommand();\n\n return (\n <div data-react-fancy-command-input=\"\" className=\"flex items-center border-b border-zinc-200 px-4 dark:border-zinc-700\">\n <Search size={16} className=\"shrink-0 text-zinc-400\" />\n <input\n type=\"text\"\n value={query}\n onChange={(e) => setQuery(e.target.value)}\n placeholder={placeholder}\n className={cn(\n \"flex-1 bg-transparent px-3 py-3 text-sm outline-none placeholder:text-zinc-400\",\n className,\n )}\n autoFocus\n />\n </div>\n );\n}\n\nCommandInput.displayName = \"CommandInput\";\n","import { cn } from \"../../utils/cn\";\nimport type { CommandListProps } from \"./Command.types\";\n\nexport function CommandList({ children, className }: CommandListProps) {\n return (\n <div\n data-react-fancy-command-list=\"\"\n role=\"listbox\"\n className={cn(\"max-h-72 overflow-y-auto p-2\", className)}\n >\n {children}\n </div>\n );\n}\n\nCommandList.displayName = \"CommandList\";\n","import { cn } from \"../../utils/cn\";\nimport { useCommand } from \"./Command.context\";\nimport type { CommandItemProps } from \"./Command.types\";\n\nexport function CommandItem({\n children,\n value,\n onSelect,\n className,\n}: CommandItemProps) {\n const { query, close, shouldFilter } = useCommand();\n\n // Filter by query — unless the caller filters for itself (`shouldFilter={false}`).\n const text = value ?? (typeof children === \"string\" ? children : \"\");\n if (shouldFilter && query && !text.toLowerCase().includes(query.toLowerCase())) {\n return null;\n }\n\n return (\n <button\n data-react-fancy-command-item=\"\"\n type=\"button\"\n role=\"option\"\n className={cn(\n \"flex w-full items-center rounded-lg px-3 py-2 text-left text-sm transition-colors\",\n \"text-zinc-700 hover:bg-zinc-100 dark:text-zinc-300 dark:hover:bg-zinc-800\",\n className,\n )}\n onClick={() => {\n onSelect?.();\n close();\n }}\n >\n {children}\n </button>\n );\n}\n\nCommandItem.displayName = \"CommandItem\";\n","import { cn } from \"../../utils/cn\";\nimport type { CommandGroupProps } from \"./Command.types\";\n\nexport function CommandGroup({\n children,\n heading,\n className,\n}: CommandGroupProps) {\n return (\n <div data-react-fancy-command-group=\"\" role=\"group\" className={cn(\"py-1\", className)}>\n {heading && (\n <div className=\"px-3 py-1.5 text-xs font-medium text-zinc-400\">\n {heading}\n </div>\n )}\n {children}\n </div>\n );\n}\n\nCommandGroup.displayName = \"CommandGroup\";\n","import { cn } from \"../../utils/cn\";\nimport type { CommandEmptyProps } from \"./Command.types\";\n\nexport function CommandEmpty({\n children = \"No results found.\",\n className,\n}: CommandEmptyProps) {\n return (\n <div\n data-react-fancy-command-empty=\"\"\n className={cn(\n \"py-6 text-center text-sm text-zinc-500 dark:text-zinc-400\",\n className,\n )}\n >\n {children}\n </div>\n );\n}\n\nCommandEmpty.displayName = \"CommandEmpty\";\n","import { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { CommandContext } from \"./Command.context\";\nimport { CommandInput } from \"./CommandInput\";\nimport { CommandList } from \"./CommandList\";\nimport { CommandItem } from \"./CommandItem\";\nimport { CommandGroup } from \"./CommandGroup\";\nimport { CommandEmpty } from \"./CommandEmpty\";\nimport { useFocusTrap } from \"../../hooks/use-focus-trap\";\nimport { useEscapeKey } from \"../../hooks/use-escape-key\";\nimport { useAnimation } from \"../../hooks/use-animation\";\nimport { useControllableState } from \"../../hooks/use-controllable-state\";\nimport type { CommandProps } from \"./Command.types\";\n\nfunction CommandRoot({\n children,\n open,\n onClose,\n className,\n shouldFilter = true,\n query: controlledQuery,\n onQueryChange,\n}: CommandProps) {\n const [query, setQuery] = useControllableState(controlledQuery, \"\", onQueryChange);\n const [activeIndex, setActiveIndex] = useState(-1);\n const panelRef = useRef<HTMLDivElement>(null);\n\n const close = useCallback(() => {\n onClose();\n setQuery(\"\");\n setActiveIndex(-1);\n }, [onClose]);\n\n useEscapeKey(close, open);\n useFocusTrap(panelRef, open);\n\n // Cmd+K global shortcut is handled by the consumer\n useEffect(() => {\n if (open) {\n const original = document.body.style.overflow;\n document.body.style.overflow = \"hidden\";\n return () => {\n document.body.style.overflow = original;\n };\n }\n }, [open]);\n\n // Keyboard navigation\n useEffect(() => {\n if (!open) return;\n\n const handleKeyDown = (e: KeyboardEvent) => {\n const items = panelRef.current?.querySelectorAll<HTMLElement>(\n '[role=\"option\"]',\n );\n if (!items?.length) return;\n\n if (e.key === \"ArrowDown\") {\n e.preventDefault();\n const next = activeIndex < items.length - 1 ? activeIndex + 1 : 0;\n setActiveIndex(next);\n items[next]?.focus();\n } else if (e.key === \"ArrowUp\") {\n e.preventDefault();\n const prev = activeIndex > 0 ? activeIndex - 1 : items.length - 1;\n setActiveIndex(prev);\n items[prev]?.focus();\n }\n };\n\n document.addEventListener(\"keydown\", handleKeyDown);\n return () => document.removeEventListener(\"keydown\", handleKeyDown);\n }, [open, activeIndex]);\n\n const { mounted, className: animClass, ref: animRef } = useAnimation({\n open,\n enterClass: \"fancy-slide-up\",\n exitClass: \"fancy-fade-out\",\n });\n\n const ctx = useMemo(\n () => ({ open, close, query, setQuery, activeIndex, setActiveIndex, shouldFilter }),\n [open, close, query, setQuery, activeIndex, shouldFilter],\n );\n\n if (!mounted) return null;\n\n return (\n <CommandContext.Provider value={ctx}>\n <Portal>\n <div className=\"fixed inset-0 z-50 flex items-start justify-center pt-[20vh]\">\n <div\n className=\"absolute inset-0 bg-black/50 backdrop-blur-sm\"\n onClick={close}\n aria-hidden=\"true\"\n />\n <div\n ref={(node) => {\n panelRef.current = node;\n (animRef as React.MutableRefObject<HTMLElement | null>).current =\n node;\n }}\n data-react-fancy-command=\"\"\n className={cn(\n \"relative w-full max-w-lg overflow-hidden rounded-2xl border border-zinc-200 bg-white shadow-2xl dark:border-zinc-700 dark:bg-zinc-900\",\n animClass,\n className,\n )}\n >\n {children}\n </div>\n </div>\n </Portal>\n </CommandContext.Provider>\n );\n}\n\nexport const Command = Object.assign(CommandRoot, {\n Input: CommandInput,\n List: CommandList,\n Item: CommandItem,\n Group: CommandGroup,\n Empty: CommandEmpty,\n});\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Toast/Toast.context.ts","../src/components/Toast/ToastItem.tsx","../src/components/Toast/ToastStack.tsx","../src/components/Toast/Toast.tsx"],"names":["useEffect","jsx","jsxs","POSITION_STYLES","useRef"],"mappings":"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","file":"chunk-Z7DNWCEO.js","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { ToastContextValue } from \"./Toast.types\";\n\nexport const ToastContext = createContext<ToastContextValue | null>(null);\n\nexport function useToast(): ToastContextValue {\n const ctx = useContext(ToastContext);\n if (!ctx) {\n throw new Error(\"useToast must be used within a <Toast.Provider>\");\n }\n return ctx;\n}\n","import { useEffect } from \"react\";\nimport { AlertTriangle, Check, Info, X, XCircle } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport type { ToastItemProps } from \"./Toast.types\";\n\nconst VARIANT_STYLES = {\n default:\n \"border-zinc-200 bg-white dark:border-zinc-700 dark:bg-zinc-900\",\n success:\n \"border-emerald-200 bg-emerald-50 dark:border-emerald-800 dark:bg-emerald-950\",\n error:\n \"border-red-200 bg-red-50 dark:border-red-800 dark:bg-red-950\",\n warning:\n \"border-amber-200 bg-amber-50 dark:border-amber-800 dark:bg-amber-950\",\n info: \"border-blue-200 bg-blue-50 dark:border-blue-800 dark:bg-blue-950\",\n} as const;\n\nconst VARIANT_ICON_COLORS = {\n default: \"text-zinc-400\",\n success: \"text-emerald-500\",\n error: \"text-red-500\",\n warning: \"text-amber-500\",\n info: \"text-blue-500\",\n} as const;\n\nexport function ToastItem({ data, onDismiss }: ToastItemProps) {\n const { id, title, description, variant = \"default\", action } = data;\n // An action toast does not expire by default.\n const duration = data.duration ?? (action ? 0 : 5000);\n\n useEffect(() => {\n if (duration <= 0) return;\n const timer = setTimeout(() => onDismiss(id), duration);\n return () => clearTimeout(timer);\n }, [id, duration, onDismiss]);\n\n return (\n <div\n data-react-fancy-toast-item=\"\"\n role=\"alert\"\n // Scoped to the toast rather than the document: a global Escape handler\n // would fight whatever modal or drawer is already listening.\n onKeyDown={(e) => {\n if (e.key === \"Escape\") onDismiss(id);\n }}\n className={cn(\n \"fancy-toast-in pointer-events-auto w-80 rounded-xl border p-4 shadow-lg\",\n VARIANT_STYLES[variant],\n )}\n >\n <div className=\"flex items-start gap-3\">\n <div className={cn(\"mt-0.5 shrink-0\", VARIANT_ICON_COLORS[variant])}>\n {variant === \"success\" && <Check size={16} />}\n {variant === \"error\" && <XCircle size={16} />}\n {variant === \"warning\" && <AlertTriangle size={16} />}\n {variant === \"info\" && <Info size={16} />}\n </div>\n <div className=\"flex-1 min-w-0\">\n <p className=\"text-sm font-medium text-zinc-900 dark:text-zinc-100\">{title}</p>\n {description && (\n <p className=\"mt-1 text-xs text-zinc-500 dark:text-zinc-400\">\n {description}\n </p>\n )}\n </div>\n {action && (\n <button\n type=\"button\"\n onClick={() => {\n action.onClick();\n // The offer is consumed; leaving it up invites undoing an\n // already-undone action.\n onDismiss(id);\n }}\n className=\"shrink-0 self-center rounded-md px-2 py-1 text-xs font-medium text-zinc-700 underline-offset-2 transition-colors hover:bg-zinc-100 hover:underline dark:text-zinc-200 dark:hover:bg-zinc-800\"\n >\n {action.label}\n </button>\n )}\n <button\n type=\"button\"\n onClick={() => onDismiss(id)}\n className=\"shrink-0 rounded p-0.5 text-zinc-400 transition-colors hover:text-zinc-600 dark:hover:text-zinc-300\"\n aria-label=\"Dismiss\"\n >\n <X size={14} />\n </button>\n </div>\n </div>\n );\n}\n\nToastItem.displayName = \"ToastItem\";\n","import { useEffect, useRef, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useControllableState } from \"../../hooks/use-controllable-state\";\nimport { Portal } from \"../Portal\";\nimport { Badge } from \"../Badge\";\nimport type { ToastPosition } from \"./Toast.types\";\n\nexport interface ToastStackProps<T> {\n /**\n * Everything to show — the stack is a VIEW of this list and owns none of it.\n * There is no limit and no timer: an item leaves only when you remove it.\n */\n items: readonly T[];\n /** One card's content, actions included. Only the front card is interactive. */\n renderItem: (item: T, state: { index: number; isFront: boolean }) => ReactNode;\n /** A stable key per item. Defaults to `item.id`, then the index. */\n getKey?: (item: T, index: number) => string;\n /** How many cards show behind the front one. Default 2. */\n depth?: number;\n /** How far each card behind peeks out above the one in front, in px. Default 8. */\n offset?: number;\n /** How much smaller each card behind is than the one in front. Default 0.05. */\n scaleStep?: number;\n /** Which item is in front, if you want to own it. Wraps; out-of-range values are clamped. */\n frontIndex?: number;\n defaultFrontIndex?: number;\n onFrontIndexChange?: (index: number) => void;\n /** A screen corner, or `\"inline\"` to render where it is placed. Default `\"bottom-right\"`. */\n position?: ToastPosition | \"inline\";\n /** The stack's accessible name. Default \"Notifications\". */\n label?: string;\n /** Classes for each card's shell, merged onto the defaults. */\n cardClassName?: string;\n className?: string;\n}\n\nconst POSITION_STYLES: Record<ToastPosition, string> = {\n \"top-right\": \"top-4 right-4\",\n \"top-left\": \"top-4 left-4\",\n \"bottom-right\": \"bottom-4 right-4\",\n \"bottom-left\": \"bottom-4 left-4\",\n};\n\n/** Pixels of wheel travel that count as one step. A mouse notch is ~100; a trackpad sends many small ones. */\nconst WHEEL_STEP = 50;\n\nconst CARD =\n \"rounded-xl border border-zinc-200 bg-white p-4 shadow-lg dark:border-zinc-700 dark:bg-zinc-900\";\n\nfunction defaultKey(item: unknown, index: number): string {\n const id = (item as { id?: unknown } | null)?.id;\n return typeof id === \"string\" || typeof id === \"number\" ? String(id) : String(index);\n}\n\nfunction isTextField(target: EventTarget | null): boolean {\n if (!(target instanceof HTMLElement)) return false;\n return (\n target.isContentEditable ||\n target.getAttribute(\"contenteditable\") === \"true\" ||\n /^(INPUT|TEXTAREA|SELECT)$/.test(target.tagName)\n );\n}\n\n/**\n * A controlled stack of actionable toasts — approval requests, say — that the\n * person walks through rather than races.\n *\n * Built for react-fancy#33. The owner's requirements were that requests stack\n * behind each other with a slight top offset, that scrolling over the stack\n * walks through them, and that a pending request NEVER expires or disappears.\n * The last is why this is a view of the caller's list rather than a queue it\n * keeps: there is nothing here that can drop an item, because nothing here owns\n * one. (The imperative provider's `maxToasts` silently drops the oldest.)\n */\nexport function ToastStack<T>({\n items,\n renderItem,\n getKey = defaultKey,\n depth = 2,\n offset = 8,\n scaleStep = 0.05,\n frontIndex: controlledFront,\n defaultFrontIndex = 0,\n onFrontIndexChange,\n position = \"bottom-right\",\n label = \"Notifications\",\n cardClassName,\n className,\n}: ToastStackProps<T>) {\n const [rawFront, setFront] = useControllableState(\n controlledFront,\n defaultFrontIndex,\n onFrontIndexChange,\n );\n const count = items.length;\n // Clamped for display rather than corrected through onChange: a list that\n // shrinks under a far-forward index must not make render report a change.\n const front = count === 0 ? 0 : ((rawFront % count) + count) % count;\n\n const stackRef = useRef<HTMLDivElement>(null);\n const wheelTravel = useRef(0);\n const live = useRef({ front, count });\n live.current = { front, count };\n\n const step = (by: number) => {\n const { front: current, count: n } = live.current;\n if (n < 2) return;\n setFront((((current + by) % n) + n) % n);\n };\n const stepRef = useRef(step);\n stepRef.current = step;\n\n /*\n * A native listener, because React's wheel listener is passive and cannot stop\n * the page scrolling underneath — and a stack that cycles AND scrolls the page\n * moves two things at once under the person's hand.\n */\n useEffect(() => {\n const el = stackRef.current;\n if (!el) return;\n\n const onWheel = (e: WheelEvent) => {\n if (live.current.count < 2 || e.deltaY === 0) return;\n e.preventDefault();\n\n // Line or page mode: every event is a notch.\n if (e.deltaMode !== 0) {\n wheelTravel.current = 0;\n stepRef.current(Math.sign(e.deltaY));\n return;\n }\n // A notch-sized event steps at once; small trackpad deltas add up first.\n if (Math.abs(e.deltaY) >= WHEEL_STEP) {\n wheelTravel.current = 0;\n stepRef.current(Math.sign(e.deltaY));\n return;\n }\n wheelTravel.current += e.deltaY;\n if (Math.abs(wheelTravel.current) >= WHEEL_STEP) {\n stepRef.current(Math.sign(wheelTravel.current));\n wheelTravel.current = 0;\n }\n };\n\n el.addEventListener(\"wheel\", onWheel, { passive: false });\n return () => el.removeEventListener(\"wheel\", onWheel);\n // Re-bound when the element can change: it appears with the first item, and\n // moving between a corner and inline remounts it.\n }, [count > 0, position]);\n\n if (count === 0) return null;\n\n const visibleBehind = Math.min(Math.max(0, depth), count - 1);\n const hidden = count - 1 - visibleBehind;\n\n const card = (index: number, k: number) => {\n const item = items[index];\n const isFront = k === 0;\n return (\n <div\n key={getKey(item, index)}\n data-react-fancy-toast-stack-card={isFront ? \"front\" : \"behind\"}\n aria-hidden={isFront ? undefined : true}\n inert={isFront ? undefined : true}\n className={cn(\n CARD,\n \"origin-top transition-transform duration-200\",\n isFront ? \"relative\" : \"pointer-events-none absolute inset-0 overflow-hidden\",\n cardClassName,\n )}\n style={{\n zIndex: depth + 1 - k,\n transform: isFront ? undefined : `translateY(-${k * offset}px) scale(${1 - k * scaleStep})`,\n }}\n >\n {renderItem(item, { index, isFront })}\n </div>\n );\n };\n\n const stackEl = (\n <div\n ref={stackRef}\n data-react-fancy-toast-stack=\"\"\n role=\"region\"\n aria-label={label}\n tabIndex={0}\n onKeyDown={(e) => {\n if (isTextField(e.target)) return;\n if (e.key === \"ArrowDown\" || e.key === \"ArrowRight\") {\n e.preventDefault();\n step(1);\n } else if (e.key === \"ArrowUp\" || e.key === \"ArrowLeft\") {\n e.preventDefault();\n step(-1);\n }\n }}\n className={cn(\n \"pointer-events-auto relative w-80 rounded-xl outline-none focus-visible:ring-2 focus-visible:ring-violet-500 focus-visible:ring-offset-2\",\n className,\n )}\n style={{ paddingTop: visibleBehind * offset }}\n >\n <div className=\"relative\">\n {/* z-index decides what paints on top; the front card sizes the box. */}\n {Array.from({ length: visibleBehind }, (_, i) => i + 1).map((k) =>\n card((front + k) % count, k),\n )}\n {card(front, 0)}\n </div>\n {hidden > 0 && (\n <Badge\n data-react-fancy-toast-stack-more=\"\"\n size=\"sm\"\n variant=\"soft\"\n color=\"zinc\"\n className=\"absolute -top-2 right-2 z-20\"\n >\n +{hidden}\n </Badge>\n )}\n <span data-react-fancy-toast-stack-status=\"\" aria-live=\"polite\" className=\"sr-only\">\n {count > 1 ? `${front + 1} of ${count}` : \"\"}\n </span>\n </div>\n );\n\n if (position === \"inline\") return stackEl;\n\n return (\n <Portal>\n <div\n data-react-fancy-toast-stack-position={position}\n className={cn(\"pointer-events-none fixed z-[100]\", POSITION_STYLES[position])}\n >\n {stackEl}\n </div>\n </Portal>\n );\n}\n\nToastStack.displayName = \"ToastStack\";\n","import { useCallback, useMemo, useRef, useState } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { ToastContext } from \"./Toast.context\";\nimport { ToastItem } from \"./ToastItem\";\nimport { ToastStack } from \"./ToastStack\";\nimport type { ToastData, ToastProviderProps } from \"./Toast.types\";\n\nconst POSITION_STYLES = {\n \"top-right\": \"top-4 right-4\",\n \"top-left\": \"top-4 left-4\",\n \"bottom-right\": \"bottom-4 right-4\",\n \"bottom-left\": \"bottom-4 left-4\",\n} as const;\n\nfunction ToastProvider({\n children,\n position = \"bottom-right\",\n maxToasts = 5,\n}: ToastProviderProps) {\n const [toasts, setToasts] = useState<ToastData[]>([]);\n const idCounter = useRef(0);\n\n const toast = useCallback(\n (data: Omit<ToastData, \"id\">) => {\n const id = `toast-${++idCounter.current}`;\n setToasts((prev) => [...prev.slice(-(maxToasts - 1)), { ...data, id }]);\n return id;\n },\n [maxToasts],\n );\n\n const dismiss = useCallback((id: string) => {\n setToasts((prev) => prev.filter((t) => t.id !== id));\n }, []);\n\n const ctx = useMemo(() => ({ toasts, toast, dismiss }), [toasts, toast, dismiss]);\n\n return (\n <ToastContext.Provider value={ctx}>\n {children}\n <Portal>\n <div\n data-react-fancy-toast=\"\"\n className={cn(\n \"fixed z-[100] flex flex-col gap-2 pointer-events-none\",\n POSITION_STYLES[position],\n )}\n >\n {toasts.map((t) => (\n <ToastItem key={t.id} data={t} onDismiss={dismiss} />\n ))}\n </div>\n </Portal>\n </ToastContext.Provider>\n );\n}\n\nexport const Toast = {\n Provider: ToastProvider,\n Stack: ToastStack,\n};\n"]}
|