@nadicodeai/ui 0.10.1 → 0.10.2
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/AGENTS.md +2 -2
- package/README.md +1 -1
- package/dist/components/ai-elements/code-block.d.ts.map +1 -1
- package/dist/components/ai-elements/code-block.js +9 -23
- package/dist/components/ai-elements/commit.d.ts.map +1 -1
- package/dist/components/ai-elements/commit.js +9 -23
- package/dist/components/ai-elements/environment-variables.d.ts.map +1 -1
- package/dist/components/ai-elements/environment-variables.js +4 -29
- package/dist/components/ai-elements/snippet.d.ts.map +1 -1
- package/dist/components/ai-elements/snippet.js +9 -23
- package/dist/components/ai-elements/stack-trace.d.ts.map +1 -1
- package/dist/components/ai-elements/stack-trace.js +8 -21
- package/dist/components/ai-elements/terminal.d.ts.map +1 -1
- package/dist/components/ai-elements/terminal.js +8 -21
- package/dist/components/alert-dialog.d.ts.map +1 -1
- package/dist/components/alert-dialog.js +3 -2
- package/dist/components/badge.js +1 -1
- package/dist/components/button.js +1 -1
- package/dist/components/chart-time-series.d.ts.map +1 -1
- package/dist/components/chart-time-series.js +2 -2
- package/dist/components/chart.js +1 -1
- package/dist/components/dialog.d.ts.map +1 -1
- package/dist/components/dialog.js +3 -2
- package/dist/components/dropdown-menu.d.ts.map +1 -1
- package/dist/components/dropdown-menu.js +2 -1
- package/dist/components/input-otp.js +1 -1
- package/dist/components/popover.d.ts.map +1 -1
- package/dist/components/popover.js +2 -1
- package/dist/components/select.d.ts.map +1 -1
- package/dist/components/select.js +2 -1
- package/dist/components/sheet.d.ts.map +1 -1
- package/dist/components/sheet.js +3 -2
- package/dist/components/sidebar.js +1 -1
- package/dist/components/toggle.js +1 -1
- package/dist/components/tooltip.d.ts.map +1 -1
- package/dist/components/tooltip.js +2 -1
- package/dist/lib/message-scroller-primitive/geometry.d.ts +1 -5
- package/dist/lib/message-scroller-primitive/geometry.d.ts.map +1 -1
- package/dist/lib/message-scroller-primitive/geometry.js +1 -1
- package/dist/lib/message-scroller-primitive/stores.d.ts +2 -3
- package/dist/lib/message-scroller-primitive/stores.d.ts.map +1 -1
- package/dist/lib/message-scroller-primitive/stores.js +1 -1
- package/dist/lib/message-scroller-primitive/types.d.ts +1 -2
- package/dist/lib/message-scroller-primitive/types.d.ts.map +1 -1
- package/dist/lib/message-scroller-primitive/types.js +1 -1
- package/dist/lib/motion.d.ts +12 -0
- package/dist/lib/motion.d.ts.map +1 -0
- package/dist/lib/motion.js +11 -0
- package/dist/lib/use-copy-to-clipboard.d.ts +11 -0
- package/dist/lib/use-copy-to-clipboard.d.ts.map +1 -0
- package/dist/lib/use-copy-to-clipboard.js +27 -0
- package/dist/styles/globals.css +1 -0
- package/docs/agents/nadicodeai-ui.md +1 -1
- package/package.json +2 -2
- package/skills/nadicodeai-ui/SKILL.md +8 -4
package/AGENTS.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# @nadicodeai/ui - Agent Rules
|
|
2
2
|
|
|
3
|
-
The `@nadicodeai/ui` npm workspace: the shared NadicodeAI React UI package on brand tokens (Tailwind v4, semantic light/dark roles), per ADR 0007. It ships shadcn primitives backed by Base UI, AI Elements, React adapters over the design-system grammar, reusable marketing/section compositions, and plan-approved product components once their source/export/tests/docs exist. It is source-authored in `src/` and published from built `dist` JavaScript, declarations, and CSS. Read this file before working in the component library. For website page assembly, also read
|
|
3
|
+
The `@nadicodeai/ui` npm workspace: the shared NadicodeAI React UI package on brand tokens (Tailwind v4, semantic light/dark roles), per ADR 0007. It ships shadcn primitives backed by Base UI, AI Elements, React adapters over the design-system grammar, reusable marketing/section compositions, and plan-approved product components once their source/export/tests/docs exist. It is source-authored in `src/` and published from built `dist` JavaScript, declarations, and CSS. Read this file before working in the component library. For website page assembly, also read **`../../website/AGENTS.md`**; for portal screens, read **`../../portal/AGENTS.md`**.
|
|
4
4
|
|
|
5
5
|
When this file is read from an installed package, use it as the consumer agent
|
|
6
6
|
contract: import `@nadicodeai/ui/globals.css` and
|
|
@@ -20,7 +20,7 @@ skills.
|
|
|
20
20
|
- **Dark-ready roles, no component `dark:` styling.** The generated design-system Tailwind theme owns the standard shadcn `:root` and `.dark` role maps; `globals.css` owns the Tailwind `@theme inline` bridge and UI-local product aliases. Components consume semantic utilities or product aliases such as `var(--nc-app-surface)`; they must not ship `dark:` Tailwind utilities, OS dark-mode branching, or raw dark palette utilities such as `dark:bg-slate-950` / `dark:text-white`. Enforced by `tests/guards/no-dark.test.ts`, `tests/guards/dark-semantic-roles.test.ts`, and `tests/guards/token-reference-integrity.test.ts`.
|
|
21
21
|
- **Components inherit the brand theme.** Consumers import `@nadicodeai/ui/globals.css` (Tailwind + the generated brand `@theme` + semantic role/alias maps) and `@nadicodeai/design-system/css` (kept `nc-*` geometry, type scale, chat CSS components, motion, and display components). Components carry no theme of their own — they resolve every color/radius from bridged brand tokens, UI-local aliases, and design-system CSS.
|
|
22
22
|
- **Source-authored, built package.** Components are authored as shadcn-style source in this workspace, then emitted to `dist/` for consumption by other apps. Package exports must point at built JS/declarations/CSS, not raw `src/*.tsx`, and `npm pack --dry-run` must include only intentional consumer artifacts.
|
|
23
|
-
- **Public surface changes require a release decision.** Any change to exported components, `src/index.ts`, `src/ai-elements.ts`, package `exports`, `globals.css`, UI-local semantic aliases, theme behavior, package docs, package skills, or design-system token/CSS/theme output consumed by this package must end with an explicit npm release decision before handoff. If the change should reach external consumers, bump the relevant package version(s), run `npm pack --dry-run -w @nadicodeai/ui`, and follow
|
|
23
|
+
- **Public surface changes require a release decision.** Any change to exported components, `src/index.ts`, `src/ai-elements.ts`, package `exports`, `globals.css`, UI-local semantic aliases, theme behavior, package docs, package skills, or design-system token/CSS/theme output consumed by this package must end with an explicit npm release decision before handoff. If the change should reach external consumers, bump the relevant package version(s), run `npm pack --dry-run -w @nadicodeai/ui`, and follow `../../docs/agents/npm-publishing.md`. If it cannot affect npm consumers, include the literal `[no-publish]` marker in a commit message and explain why in that commit body; the pre-push gate requires one of these two decisions. When the UI change depends on modified `@nadicodeai/design-system` output, bump/publish `@nadicodeai/design-system` first, then update `@nadicodeai/ui`'s dependency and publish UI. Never claim a UI package change is shipped to npm until `npm view @nadicodeai/ui version` reports the intended published version.
|
|
24
24
|
- **shadcn and AI Elements are package surface.** The installed shadcn source components under `src/components/` and all 48 Vercel AI Elements under `src/components/ai-elements/` are intentional ready-to-use exports. Keep `src/index.ts`, `src/ai-elements.ts`, package `exports`, README/agent docs, and `website/app/ui-check/elements` synchronized whenever this surface changes.
|
|
25
25
|
- **Base UI is the active primitive base.** `components.json` must resolve through a Base style, currently `base-nova`, and `npx shadcn@latest info --json` must report `base: "base"`. Do not reintroduce `radix-ui`, `@radix-ui/*`, or `vaul` to package source/dependencies or app optimizer configuration. Registry-owned shadcn primitives should stay aligned with current `shadcn@latest` Base UI output; use Base UI `render` composition instead of Radix `asChild`. `cmdk` is allowed only for the stock shadcn Command component while the current `base-nova` registry declares that dependency; do not use it elsewhere or replace it without a shadcn/compatibility decision and tests.
|
|
26
26
|
- **Named shadcn blocks stay named.** When a user, plan, or issue selects a shadcn block/example such as `login-02`, `signup-02`, `dashboard-01`, or `sidebar-*`, use that registry item as the source of truth through shadcn CLI/MCP. Do not replace it with a package-authored abstraction unless the plan explicitly records the substitution, the reason, and the true consumer route that proves it.
|
package/README.md
CHANGED
|
@@ -9,7 +9,7 @@ entry stylesheet needed by consuming apps. It is intentionally coupled to
|
|
|
9
9
|
framework-agnostic geometry, fonts, assets, and CSS components; this package owns
|
|
10
10
|
React components and reusable section compositions on those tokens. Shared
|
|
11
11
|
product compositions from
|
|
12
|
-
|
|
12
|
+
`../../docs/plans/2026-06-23-001-feat-nadia-product-ui-package-plan.md` now ship
|
|
13
13
|
when their source, public subpath export, docs, and tests exist.
|
|
14
14
|
|
|
15
15
|
The package ships:
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"code-block.d.ts","sourceRoot":"","sources":["../../../src/components/ai-elements/code-block.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,UAAU,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;
|
|
1
|
+
{"version":3,"file":"code-block.d.ts","sourceRoot":"","sources":["../../../src/components/ai-elements/code-block.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,UAAU,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAIpG,OAAO,KAAK,EAAE,cAAc,EAAiB,cAAc,EAAE,MAAM,OAAO,CAAC;AAE3E,OAAO,KAAK,EACV,eAAe,EAGf,WAAW,EAEZ,MAAM,OAAO,CAAC;AAYf,KAAK,cAAc,GAAG,WAAW,GAAG;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;CAC1C,CAAC;AAqFF,KAAK,cAAc,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG;IACrD,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,eAAe,CAAC;IAC1B,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC;AAEF,UAAU,aAAa;IACrB,MAAM,EAAE,cAAc,EAAE,EAAE,CAAC;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;CAChB;AAoFD,eAAO,MAAM,aAAa,GACxB,MAAM,MAAM,EACZ,UAAU,eAAe,EAEzB,WAAW,CAAC,MAAM,EAAE,aAAa,KAAK,IAAI,KACzC,aAAa,GAAG,IA6DlB,CAAC;AAgDF,eAAO,MAAM,kBAAkB,GAAI,0CAKhC,cAAc,CAAC,cAAc,CAAC,GAAG;IAAE,QAAQ,EAAE,MAAM,CAAA;CAAE,gCAcvD,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,mCAI7B,cAAc,CAAC,cAAc,CAAC,gCAUhC,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,mCAI5B,cAAc,CAAC,cAAc,CAAC,gCAIhC,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,mCAI/B,cAAc,CAAC,eAAe,CAAC,gCAIjC,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,mCAI9B,cAAc,CAAC,cAAc,CAAC,gCAIhC,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,sCAI9B;IACD,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,eAAe,CAAC;IAC1B,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,gCAiCA,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,oEAOvB,cAAc,gCAWhB,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,GAAG;IACrE,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACjC,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,6DAOjC,wBAAwB,gCAuB1B,CAAC;AAEF,MAAM,MAAM,8BAA8B,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,CAAC;AAE3E,eAAO,MAAM,yBAAyB,GAAI,OAAO,8BAA8B,gCAE9E,CAAC;AAEF,MAAM,MAAM,qCAAqC,GAAG,cAAc,CAAC,OAAO,aAAa,CAAC,CAAC;AAEzF,eAAO,MAAM,gCAAgC,GAAI,yBAG9C,qCAAqC,gCAMvC,CAAC;AAEF,MAAM,MAAM,mCAAmC,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,CAAC;AAErF,eAAO,MAAM,8BAA8B,GAAI,OAAO,mCAAmC,gCAExF,CAAC;AAEF,MAAM,MAAM,qCAAqC,GAAG,cAAc,CAAC,OAAO,aAAa,CAAC,CAAC;AAEzF,eAAO,MAAM,gCAAgC,GAAI,qBAG9C,qCAAqC,gCAA+C,CAAC;AAExF,MAAM,MAAM,kCAAkC,GAAG,cAAc,CAAC,OAAO,UAAU,CAAC,CAAC;AAEnF,eAAO,MAAM,6BAA6B,GAAI,OAAO,kCAAkC,gCAEtF,CAAC"}
|
|
@@ -3,8 +3,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import { Button } from "../button.js";
|
|
4
4
|
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../select.js";
|
|
5
5
|
import { cn } from "../../lib/utils.js";
|
|
6
|
+
import { useCopyToClipboard } from "../../lib/use-copy-to-clipboard.js";
|
|
6
7
|
import { CheckIcon, CopyIcon } from "lucide-react";
|
|
7
|
-
import { createContext, memo,
|
|
8
|
+
import { createContext, memo, useContext, useEffect, useMemo, useState } from "react";
|
|
8
9
|
import { createHighlighter } from "shiki";
|
|
9
10
|
// Shiki uses bitflags for font styles: 1=italic, 2=bold, 4=underline
|
|
10
11
|
// oxlint-disable-next-line eslint(no-bitwise)
|
|
@@ -220,29 +221,14 @@ export const CodeBlock = ({ code, language, showLineNumbers = false, className,
|
|
|
220
221
|
return (_jsx(CodeBlockContext.Provider, { value: contextValue, children: _jsxs(CodeBlockContainer, { className: className, language: language, ...props, children: [children, _jsx(CodeBlockContent, { code: code, language: language, showLineNumbers: showLineNumbers })] }) }));
|
|
221
222
|
};
|
|
222
223
|
export const CodeBlockCopyButton = ({ onCopy, onError, timeout = 2000, children, className, ...props }) => {
|
|
223
|
-
const [isCopied, setIsCopied] = useState(false);
|
|
224
|
-
const timeoutRef = useRef(0);
|
|
225
224
|
const { code } = useContext(CodeBlockContext);
|
|
226
|
-
const copyToClipboard =
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
await navigator.clipboard.writeText(code);
|
|
234
|
-
setIsCopied(true);
|
|
235
|
-
onCopy?.();
|
|
236
|
-
timeoutRef.current = window.setTimeout(() => setIsCopied(false), timeout);
|
|
237
|
-
}
|
|
238
|
-
}
|
|
239
|
-
catch (error) {
|
|
240
|
-
onError?.(error);
|
|
241
|
-
}
|
|
242
|
-
}, [code, onCopy, onError, timeout, isCopied]);
|
|
243
|
-
useEffect(() => () => {
|
|
244
|
-
window.clearTimeout(timeoutRef.current);
|
|
245
|
-
}, []);
|
|
225
|
+
const { copyToClipboard, isCopied } = useCopyToClipboard({
|
|
226
|
+
text: code,
|
|
227
|
+
onCopy,
|
|
228
|
+
onError,
|
|
229
|
+
timeout,
|
|
230
|
+
skipWhileCopied: true,
|
|
231
|
+
});
|
|
246
232
|
const Icon = isCopied ? CheckIcon : CopyIcon;
|
|
247
233
|
return (_jsx(Button, { className: cn("shrink-0", className), onClick: copyToClipboard, size: "icon", variant: "ghost", ...props, children: children ?? _jsx(Icon, { size: 14 }) }));
|
|
248
234
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"commit.d.ts","sourceRoot":"","sources":["../../../src/components/ai-elements/commit.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,EAAkB,MAAM,qBAAqB,CAAC;AAC7D,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"commit.d.ts","sourceRoot":"","sources":["../../../src/components/ai-elements/commit.tsx"],"names":[],"mappings":"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"}
|
|
@@ -4,8 +4,9 @@ import { Avatar, AvatarFallback } from "../avatar.js";
|
|
|
4
4
|
import { Button } from "../button.js";
|
|
5
5
|
import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "../collapsible.js";
|
|
6
6
|
import { cn } from "../../lib/utils.js";
|
|
7
|
+
import { useCopyToClipboard } from "../../lib/use-copy-to-clipboard.js";
|
|
7
8
|
import { CheckIcon, CopyIcon, FileIcon, GitCommitIcon, MinusIcon, PlusIcon } from "lucide-react";
|
|
8
|
-
import { useCallback, useEffect,
|
|
9
|
+
import { useCallback, useEffect, useState } from "react";
|
|
9
10
|
export const Commit = ({ className, children, ...props }) => (_jsx(Collapsible, { className: cn("rounded-lg border bg-background", className), ...props, children: children }));
|
|
10
11
|
export const CommitHeader = ({ className, children, ...props }) => (_jsx(CollapsibleTrigger, { nativeButton: false, render: _jsx("div", { className: cn("group flex cursor-pointer items-center justify-between gap-4 p-3 text-left transition-colors hover:opacity-80", className), children: children }), ...props }));
|
|
11
12
|
export const CommitHash = ({ className, children, ...props }) => (_jsxs("span", { className: cn("font-mono text-xs", className), ...props, children: [_jsx(GitCommitIcon, { className: "mr-1 inline-block size-3" }), children] }));
|
|
@@ -38,28 +39,13 @@ export const CommitActions = ({ className, children, ...props }) => (
|
|
|
38
39
|
// eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -- The group only intercepts bubbled events from its interactive child controls so the parent commit is not activated.
|
|
39
40
|
_jsx("div", { className: cn("flex items-center gap-1", className), onClick: handleActionsClick, onKeyDown: handleActionsKeyDown, role: "group", ...props, children: children }));
|
|
40
41
|
export const CommitCopyButton = ({ hash, onCopy, onError, timeout = 2000, children, className, ...props }) => {
|
|
41
|
-
const
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
try {
|
|
49
|
-
if (!isCopied) {
|
|
50
|
-
await navigator.clipboard.writeText(hash);
|
|
51
|
-
setIsCopied(true);
|
|
52
|
-
onCopy?.();
|
|
53
|
-
timeoutRef.current = window.setTimeout(() => setIsCopied(false), timeout);
|
|
54
|
-
}
|
|
55
|
-
}
|
|
56
|
-
catch (error) {
|
|
57
|
-
onError?.(error);
|
|
58
|
-
}
|
|
59
|
-
}, [hash, onCopy, onError, timeout, isCopied]);
|
|
60
|
-
useEffect(() => () => {
|
|
61
|
-
window.clearTimeout(timeoutRef.current);
|
|
62
|
-
}, []);
|
|
42
|
+
const { copyToClipboard, isCopied } = useCopyToClipboard({
|
|
43
|
+
text: hash,
|
|
44
|
+
onCopy,
|
|
45
|
+
onError,
|
|
46
|
+
timeout,
|
|
47
|
+
skipWhileCopied: true,
|
|
48
|
+
});
|
|
63
49
|
const Icon = isCopied ? CheckIcon : CopyIcon;
|
|
64
50
|
return (_jsx(Button, { className: cn("size-7 shrink-0", className), onClick: copyToClipboard, size: "icon", variant: "ghost", ...props, children: children ?? _jsx(Icon, { size: 14 }) }));
|
|
65
51
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"environment-variables.d.ts","sourceRoot":"","sources":["../../../src/components/ai-elements/environment-variables.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC3C,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;
|
|
1
|
+
{"version":3,"file":"environment-variables.d.ts","sourceRoot":"","sources":["../../../src/components/ai-elements/environment-variables.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC3C,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAI7C,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAiB5D,MAAM,MAAM,yBAAyB,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG;IACvE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,kBAAkB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CAC9C,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAI,4GAOlC,yBAAyB,gCAqB3B,CAAC;AAEF,MAAM,MAAM,+BAA+B,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAE7E,eAAO,MAAM,0BAA0B,GAAI,mCAIxC,+BAA+B,gCAIjC,CAAC;AAEF,MAAM,MAAM,8BAA8B,GAAG,cAAc,CAAC,kBAAkB,CAAC,CAAC;AAEhF,eAAO,MAAM,yBAAyB,GAAI,mCAIvC,8BAA8B,gCAIhC,CAAC;AAEF,MAAM,MAAM,+BAA+B,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,CAAC;AAE5E,eAAO,MAAM,0BAA0B,GAAI,yBAGxC,+BAA+B,gCAgBjC,CAAC;AAEF,MAAM,MAAM,gCAAgC,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAE9E,eAAO,MAAM,2BAA2B,GAAI,mCAIzC,gCAAgC,gCAIlC,CAAC;AAYF,MAAM,MAAM,6BAA6B,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAE3E,eAAO,MAAM,wBAAwB,GAAI,mCAItC,6BAA6B,gCAI/B,CAAC;AAEF,MAAM,MAAM,4BAA4B,GAAG,cAAc,CAAC,eAAe,CAAC,CAAC;AAE3E,eAAO,MAAM,uBAAuB,GAAI,mCAIrC,4BAA4B,gCAQ9B,CAAC;AAEF,MAAM,MAAM,6BAA6B,GAAG,cAAc,CAAC,eAAe,CAAC,CAAC;AAE5E,eAAO,MAAM,wBAAwB,GAAI,mCAItC,6BAA6B,gCAkB/B,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG;IACtE,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,gDAMjC,wBAAwB,gCAoB1B,CAAC;AAEF,MAAM,MAAM,kCAAkC,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,GAAG;IAC/E,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACjC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;CAC1C,CAAC;AAEF,eAAO,MAAM,6BAA6B,GAAI,yEAQ3C,kCAAkC,gCAmBpC,CAAC;AAEF,MAAM,MAAM,gCAAgC,GAAG,cAAc,CAAC,OAAO,KAAK,CAAC,CAAC;AAE5E,eAAO,MAAM,2BAA2B,GAAI,mCAIzC,gCAAgC,gCAIlC,CAAC"}
|
|
@@ -4,8 +4,9 @@ import { Badge } from "../badge.js";
|
|
|
4
4
|
import { Button } from "../button.js";
|
|
5
5
|
import { Switch } from "../switch.js";
|
|
6
6
|
import { cn } from "../../lib/utils.js";
|
|
7
|
+
import { useCopyToClipboard } from "../../lib/use-copy-to-clipboard.js";
|
|
7
8
|
import { CheckIcon, CopyIcon, EyeIcon, EyeOffIcon } from "lucide-react";
|
|
8
|
-
import { createContext, useCallback, useContext,
|
|
9
|
+
import { createContext, useCallback, useContext, useMemo, useState } from "react";
|
|
9
10
|
// Default noop for context default value
|
|
10
11
|
// oxlint-disable-next-line eslint(no-empty-function)
|
|
11
12
|
const noop = () => { };
|
|
@@ -50,35 +51,9 @@ export const EnvironmentVariable = ({ name, value, className, children, ...props
|
|
|
50
51
|
return (_jsx(EnvironmentVariableContext.Provider, { value: envVarContextValue, children: _jsx("div", { className: cn("flex items-center justify-between gap-4 px-4 py-3", className), ...props, children: children ?? (_jsxs(_Fragment, { children: [_jsx("div", { className: "flex items-center gap-2", children: _jsx(EnvironmentVariableName, {}) }), _jsx(EnvironmentVariableValue, {})] })) }) }));
|
|
51
52
|
};
|
|
52
53
|
export const EnvironmentVariableCopyButton = ({ onCopy, onError, timeout = 2000, copyFormat = "value", children, className, ...props }) => {
|
|
53
|
-
const [isCopied, setIsCopied] = useState(false);
|
|
54
|
-
const timeoutRef = useRef(0);
|
|
55
54
|
const { name, value } = useContext(EnvironmentVariableContext);
|
|
56
|
-
const
|
|
57
|
-
|
|
58
|
-
export: () => `export ${name}="${value}"`,
|
|
59
|
-
name: () => name,
|
|
60
|
-
value: () => value,
|
|
61
|
-
};
|
|
62
|
-
return formatMap[copyFormat]();
|
|
63
|
-
}, [name, value, copyFormat]);
|
|
64
|
-
const copyToClipboard = useCallback(async () => {
|
|
65
|
-
if (typeof window === "undefined" || !navigator?.clipboard?.writeText) {
|
|
66
|
-
onError?.(new Error("Clipboard API not available"));
|
|
67
|
-
return;
|
|
68
|
-
}
|
|
69
|
-
try {
|
|
70
|
-
await navigator.clipboard.writeText(getTextToCopy());
|
|
71
|
-
setIsCopied(true);
|
|
72
|
-
onCopy?.();
|
|
73
|
-
timeoutRef.current = window.setTimeout(() => setIsCopied(false), timeout);
|
|
74
|
-
}
|
|
75
|
-
catch (error) {
|
|
76
|
-
onError?.(error);
|
|
77
|
-
}
|
|
78
|
-
}, [getTextToCopy, onCopy, onError, timeout]);
|
|
79
|
-
useEffect(() => () => {
|
|
80
|
-
window.clearTimeout(timeoutRef.current);
|
|
81
|
-
}, []);
|
|
55
|
+
const text = copyFormat === "export" ? `export ${name}="${value}"` : copyFormat === "name" ? name : value;
|
|
56
|
+
const { copyToClipboard, isCopied } = useCopyToClipboard({ text, onCopy, onError, timeout });
|
|
82
57
|
const Icon = isCopied ? CheckIcon : CopyIcon;
|
|
83
58
|
return (_jsx(Button, { className: cn("size-6 shrink-0", className), onClick: copyToClipboard, size: "icon", variant: "ghost", ...props, children: children ?? _jsx(Icon, { size: 12 }) }));
|
|
84
59
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"snippet.d.ts","sourceRoot":"","sources":["../../../src/components/ai-elements/snippet.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,UAAU,EACV,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,cAAc,EACf,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"snippet.d.ts","sourceRoot":"","sources":["../../../src/components/ai-elements/snippet.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,UAAU,EACV,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,cAAc,EACf,MAAM,0BAA0B,CAAC;AAIlC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAW5C,MAAM,MAAM,YAAY,GAAG,cAAc,CAAC,OAAO,UAAU,CAAC,GAAG;IAC7D,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,eAAO,MAAM,OAAO,GAAI,yCAAyC,YAAY,gCAU5E,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,OAAO,eAAe,CAAC,CAAC;AAEvE,eAAO,MAAM,YAAY,GAAI,OAAO,iBAAiB,gCAAmC,CAAC;AAEzF,MAAM,MAAM,gBAAgB,GAAG,cAAc,CAAC,OAAO,cAAc,CAAC,CAAC;AAErE,eAAO,MAAM,WAAW,GAAI,yBAAyB,gBAAgB,gCAEpE,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC,CAAC;AAEnG,eAAO,MAAM,YAAY,GAAI,yBAAyB,iBAAiB,gCAWtE,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,cAAc,CAAC,OAAO,gBAAgB,CAAC,GAAG;IAC7E,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACjC,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,6DAO/B,sBAAsB,gCAwBxB,CAAC"}
|
|
@@ -2,8 +2,9 @@
|
|
|
2
2
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
3
|
import { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, } from "../input-group.js";
|
|
4
4
|
import { cn } from "../../lib/utils.js";
|
|
5
|
+
import { useCopyToClipboard } from "../../lib/use-copy-to-clipboard.js";
|
|
5
6
|
import { CheckIcon, CopyIcon } from "lucide-react";
|
|
6
|
-
import { createContext,
|
|
7
|
+
import { createContext, useContext, useMemo } from "react";
|
|
7
8
|
const SnippetContext = createContext({
|
|
8
9
|
code: "",
|
|
9
10
|
});
|
|
@@ -18,29 +19,14 @@ export const SnippetInput = ({ className, ...props }) => {
|
|
|
18
19
|
return (_jsx(InputGroupInput, { className: cn("text-foreground", className), readOnly: true, value: code, ...props }));
|
|
19
20
|
};
|
|
20
21
|
export const SnippetCopyButton = ({ onCopy, onError, timeout = 2000, children, className, ...props }) => {
|
|
21
|
-
const [isCopied, setIsCopied] = useState(false);
|
|
22
|
-
const timeoutRef = useRef(0);
|
|
23
22
|
const { code } = useContext(SnippetContext);
|
|
24
|
-
const copyToClipboard =
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
await navigator.clipboard.writeText(code);
|
|
32
|
-
setIsCopied(true);
|
|
33
|
-
onCopy?.();
|
|
34
|
-
timeoutRef.current = window.setTimeout(() => setIsCopied(false), timeout);
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
catch (error) {
|
|
38
|
-
onError?.(error);
|
|
39
|
-
}
|
|
40
|
-
}, [code, onCopy, onError, timeout, isCopied]);
|
|
41
|
-
useEffect(() => () => {
|
|
42
|
-
window.clearTimeout(timeoutRef.current);
|
|
43
|
-
}, []);
|
|
23
|
+
const { copyToClipboard, isCopied } = useCopyToClipboard({
|
|
24
|
+
text: code,
|
|
25
|
+
onCopy,
|
|
26
|
+
onError,
|
|
27
|
+
timeout,
|
|
28
|
+
skipWhileCopied: true,
|
|
29
|
+
});
|
|
44
30
|
const Icon = isCopied ? CheckIcon : CopyIcon;
|
|
45
31
|
return (_jsx(InputGroupButton, { "aria-label": "Copy", className: className, onClick: copyToClipboard, size: "icon-sm", title: "Copy", ...props, children: children ?? _jsx(Icon, { className: "size-3.5", size: 14 }) }));
|
|
46
32
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stack-trace.d.ts","sourceRoot":"","sources":["../../../src/components/ai-elements/stack-trace.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAe,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"stack-trace.d.ts","sourceRoot":"","sources":["../../../src/components/ai-elements/stack-trace.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAe,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAI/F,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAmI5C,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IACpD,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,eAAe,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;CAC9E,CAAC;AAEF,eAAO,MAAM,UAAU,mIAUlB,eAAe,iCAkCnB,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG,cAAc,CAAC,OAAO,kBAAkB,CAAC,CAAC;AAE9E,eAAO,MAAM,gBAAgB,0EAA4C,qBAAqB,iCAqB5F,CAAC;AAEH,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;AAEzD,eAAO,MAAM,eAAe,0EAA4C,oBAAoB,iCAK1F,CAAC;AAEH,MAAM,MAAM,wBAAwB,GAAG,cAAc,CAAC,MAAM,CAAC,CAAC;AAE9D,eAAO,MAAM,mBAAmB,0EACM,wBAAwB,iCAS7D,CAAC;AAEF,MAAM,MAAM,2BAA2B,GAAG,cAAc,CAAC,MAAM,CAAC,CAAC;AAEjE,eAAO,MAAM,sBAAsB,0EACG,2BAA2B,iCAShE,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;AAS3D,eAAO,MAAM,iBAAiB,0EACQ,sBAAsB,iCAY3D,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,GAAG;IACtE,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACjC,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,oBAAoB,oGAQ5B,yBAAyB,iCAuB7B,CAAC;AAEF,MAAM,MAAM,2BAA2B,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;AAEhE,eAAO,MAAM,sBAAsB,gEACP,2BAA2B,iCActD,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,cAAc,CAAC,OAAO,kBAAkB,CAAC,GAAG;IAC/E,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,iBAAiB,qFACyB,sBAAsB,iCAmB5E,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IAC1D,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B,CAAC;AAqCF,eAAO,MAAM,gBAAgB,oFAC0B,qBAAqB,iCAyC3E,CAAC"}
|
|
@@ -4,8 +4,9 @@ import { useControllableState } from "../../hooks/use-controllable-state.js";
|
|
|
4
4
|
import { Button } from "../button.js";
|
|
5
5
|
import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "../collapsible.js";
|
|
6
6
|
import { cn } from "../../lib/utils.js";
|
|
7
|
+
import { useCopyToClipboard } from "../../lib/use-copy-to-clipboard.js";
|
|
7
8
|
import { AlertTriangleIcon, CheckIcon, ChevronDownIcon, CopyIcon } from "lucide-react";
|
|
8
|
-
import { createContext, memo, useCallback, useContext,
|
|
9
|
+
import { createContext, memo, useCallback, useContext, useMemo } from "react";
|
|
9
10
|
// Regex patterns for parsing stack traces
|
|
10
11
|
const STACK_FRAME_WITH_PARENS_REGEX = /^at\s+(.+?)\s+\((.+):(\d+):(\d+)\)$/;
|
|
11
12
|
const STACK_FRAME_WITHOUT_FN_REGEX = /^at\s+(.+):(\d+):(\d+)$/;
|
|
@@ -134,27 +135,13 @@ export const StackTraceActions = memo(({ className, children, ...props }) => (
|
|
|
134
135
|
// eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -- The group only intercepts bubbled events from its interactive child controls so the parent stack frame is not activated.
|
|
135
136
|
_jsx("div", { className: cn("flex shrink-0 items-center gap-1", className), onClick: handleActionsClick, onKeyDown: handleActionsKeyDown, role: "group", ...props, children: children })));
|
|
136
137
|
export const StackTraceCopyButton = memo(({ onCopy, onError, timeout = 2000, className, children, ...props }) => {
|
|
137
|
-
const [isCopied, setIsCopied] = useState(false);
|
|
138
|
-
const timeoutRef = useRef(0);
|
|
139
138
|
const { raw } = useStackTrace();
|
|
140
|
-
const copyToClipboard =
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
await navigator.clipboard.writeText(raw);
|
|
147
|
-
setIsCopied(true);
|
|
148
|
-
onCopy?.();
|
|
149
|
-
timeoutRef.current = window.setTimeout(() => setIsCopied(false), timeout);
|
|
150
|
-
}
|
|
151
|
-
catch (error) {
|
|
152
|
-
onError?.(error);
|
|
153
|
-
}
|
|
154
|
-
}, [raw, onCopy, onError, timeout]);
|
|
155
|
-
useEffect(() => () => {
|
|
156
|
-
window.clearTimeout(timeoutRef.current);
|
|
157
|
-
}, []);
|
|
139
|
+
const { copyToClipboard, isCopied } = useCopyToClipboard({
|
|
140
|
+
text: raw,
|
|
141
|
+
onCopy,
|
|
142
|
+
onError,
|
|
143
|
+
timeout,
|
|
144
|
+
});
|
|
158
145
|
const Icon = isCopied ? CheckIcon : CopyIcon;
|
|
159
146
|
return (_jsx(Button, { className: cn("size-7", className), onClick: copyToClipboard, size: "icon", variant: "ghost", ...props, children: children ?? _jsx(Icon, { size: 14 }) }));
|
|
160
147
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"terminal.d.ts","sourceRoot":"","sources":["../../../src/components/ai-elements/terminal.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;
|
|
1
|
+
{"version":3,"file":"terminal.d.ts","sourceRoot":"","sources":["../../../src/components/ai-elements/terminal.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAK7C,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAgB5D,MAAM,MAAM,mBAAmB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEjE,eAAO,MAAM,cAAc,GAAI,mCAAmC,mBAAmB,gCAUpF,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEhE,eAAO,MAAM,aAAa,GAAI,mCAAmC,kBAAkB,gCAQlF,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEjE,eAAO,MAAM,cAAc,GAAI,mCAAmC,mBAAmB,uCAepF,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAElE,eAAO,MAAM,eAAe,GAAI,mCAAmC,oBAAoB,gCAItF,CAAC;AAEF,MAAM,MAAM,uBAAuB,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,GAAG;IACpE,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACjC,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,6DAOhC,uBAAuB,gCAyBzB,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,CAAC;AAErE,eAAO,MAAM,mBAAmB,GAAI,mCAIjC,wBAAwB,uCAqB1B,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAElE,eAAO,MAAM,eAAe,GAAI,mCAAmC,oBAAoB,gCA0BtF,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG;IAC3D,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,6EAQtB,aAAa,gCAiCf,CAAC"}
|
|
@@ -2,9 +2,10 @@
|
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
3
|
import { Button } from "../button.js";
|
|
4
4
|
import { cn } from "../../lib/utils.js";
|
|
5
|
+
import { useCopyToClipboard } from "../../lib/use-copy-to-clipboard.js";
|
|
5
6
|
import Ansi from "ansi-to-react";
|
|
6
7
|
import { CheckIcon, CopyIcon, TerminalIcon, Trash2Icon } from "lucide-react";
|
|
7
|
-
import { createContext,
|
|
8
|
+
import { createContext, useContext, useEffect, useMemo, useRef } from "react";
|
|
8
9
|
const TerminalContext = createContext({
|
|
9
10
|
autoScroll: true,
|
|
10
11
|
isStreaming: false,
|
|
@@ -21,27 +22,13 @@ export const TerminalStatus = ({ className, children, ...props }) => {
|
|
|
21
22
|
};
|
|
22
23
|
export const TerminalActions = ({ className, children, ...props }) => (_jsx("div", { className: cn("flex items-center gap-1", className), ...props, children: children }));
|
|
23
24
|
export const TerminalCopyButton = ({ onCopy, onError, timeout = 2000, children, className, ...props }) => {
|
|
24
|
-
const [isCopied, setIsCopied] = useState(false);
|
|
25
|
-
const timeoutRef = useRef(0);
|
|
26
25
|
const { output } = useContext(TerminalContext);
|
|
27
|
-
const copyToClipboard =
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
await navigator.clipboard.writeText(output);
|
|
34
|
-
setIsCopied(true);
|
|
35
|
-
onCopy?.();
|
|
36
|
-
timeoutRef.current = window.setTimeout(() => setIsCopied(false), timeout);
|
|
37
|
-
}
|
|
38
|
-
catch (error) {
|
|
39
|
-
onError?.(error);
|
|
40
|
-
}
|
|
41
|
-
}, [output, onCopy, onError, timeout]);
|
|
42
|
-
useEffect(() => () => {
|
|
43
|
-
window.clearTimeout(timeoutRef.current);
|
|
44
|
-
}, []);
|
|
26
|
+
const { copyToClipboard, isCopied } = useCopyToClipboard({
|
|
27
|
+
text: output,
|
|
28
|
+
onCopy,
|
|
29
|
+
onError,
|
|
30
|
+
timeout,
|
|
31
|
+
});
|
|
45
32
|
const Icon = isCopied ? CheckIcon : CopyIcon;
|
|
46
33
|
return (_jsx(Button, { className: cn("size-7 shrink-0 text-primary-foreground/70 hover:bg-primary-foreground/10 hover:text-primary-foreground", className), onClick: copyToClipboard, size: "icon", variant: "ghost", ...props, children: children ?? _jsx(Icon, { size: 14 }) }));
|
|
47
34
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alert-dialog.d.ts","sourceRoot":"","sources":["../../src/components/alert-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,WAAW,IAAI,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;
|
|
1
|
+
{"version":3,"file":"alert-dialog.d.ts","sourceRoot":"","sources":["../../src/components/alert-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,WAAW,IAAI,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAIlF,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAE7C,iBAAS,WAAW,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,oBAAoB,CAAC,IAAI,CAAC,KAAK,qBAEjE;AAED,iBAAS,kBAAkB,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,oBAAoB,CAAC,OAAO,CAAC,KAAK,qBAE3E;AAED,iBAAS,iBAAiB,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,oBAAoB,CAAC,MAAM,CAAC,KAAK,qBAEzE;AAED,iBAAS,kBAAkB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,oBAAoB,CAAC,QAAQ,CAAC,KAAK,qBAQvF;AAED,iBAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,IAAgB,EAChB,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,KAAK,CAAC,KAAK,GAAG;IACpC,IAAI,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;CACzB,qBAgBA;AAED,iBAAS,iBAAiB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAW9E;AAED,iBAAS,iBAAiB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAW9E;AAED,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAW7E;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,KAAK,CAAC,qBAWzD;AAED,iBAAS,sBAAsB,CAAC,EAC9B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,WAAW,CAAC,qBAW/D;AAID,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,OAAmB,EACnB,IAAgB,EAChB,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,KAAK,CAAC,KAAK,GACjC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC,qBAS9D;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,OAAmB,EACnB,IAAgB,EAChB,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,KAAK,CAAC,KAAK,GACjC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC,qBAS9D;AAED,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,sBAAsB,EACtB,iBAAiB,EACjB,iBAAiB,EACjB,gBAAgB,EAChB,kBAAkB,EAClB,iBAAiB,EACjB,gBAAgB,EAChB,kBAAkB,GACnB,CAAC"}
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { AlertDialog as AlertDialogPrimitive } from "@base-ui/react/alert-dialog";
|
|
4
4
|
import { cn } from "../lib/utils.js";
|
|
5
|
+
import { modalOverlayMotion, overlayBackdropMotion } from "../lib/motion.js";
|
|
5
6
|
import { Button } from "./button.js";
|
|
6
7
|
function AlertDialog({ ...props }) {
|
|
7
8
|
return _jsx(AlertDialogPrimitive.Root, { "data-slot": "alert-dialog", ...props });
|
|
@@ -13,10 +14,10 @@ function AlertDialogPortal({ ...props }) {
|
|
|
13
14
|
return _jsx(AlertDialogPrimitive.Portal, { "data-slot": "alert-dialog-portal", ...props });
|
|
14
15
|
}
|
|
15
16
|
function AlertDialogOverlay({ className, ...props }) {
|
|
16
|
-
return (_jsx(AlertDialogPrimitive.Backdrop, { "data-slot": "alert-dialog-overlay", className: cn("fixed inset-0 isolate z-50 bg-scrim/scrim
|
|
17
|
+
return (_jsx(AlertDialogPrimitive.Backdrop, { "data-slot": "alert-dialog-overlay", className: cn("fixed inset-0 isolate z-50 bg-scrim/scrim", overlayBackdropMotion, className), ...props }));
|
|
17
18
|
}
|
|
18
19
|
function AlertDialogContent({ className, size = "default", ...props }) {
|
|
19
|
-
return (_jsxs(AlertDialogPortal, { children: [_jsx(AlertDialogOverlay, {}), _jsx(AlertDialogPrimitive.Popup, { "data-slot": "alert-dialog-content", "data-size": size, className: cn("group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-nadicode-md rounded-2xl border border-border bg-popover p-nadicode-lg text-popover-foreground shadow-dialog
|
|
20
|
+
return (_jsxs(AlertDialogPortal, { children: [_jsx(AlertDialogOverlay, {}), _jsx(AlertDialogPrimitive.Popup, { "data-slot": "alert-dialog-content", "data-size": size, className: cn("group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-nadicode-md rounded-2xl border border-border bg-popover p-nadicode-lg text-popover-foreground shadow-dialog outline-none data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-sm", modalOverlayMotion, className), ...props })] }));
|
|
20
21
|
}
|
|
21
22
|
function AlertDialogHeader({ className, ...props }) {
|
|
22
23
|
return (_jsx("div", { "data-slot": "alert-dialog-header", className: cn("grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-left sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]", className), ...props }));
|
package/dist/components/badge.js
CHANGED
|
@@ -2,7 +2,7 @@ import { mergeProps } from "@base-ui/react/merge-props";
|
|
|
2
2
|
import { useRender } from "@base-ui/react/use-render";
|
|
3
3
|
import { cva } from "class-variance-authority";
|
|
4
4
|
import { cn } from "../lib/utils.js";
|
|
5
|
-
const badgeVariants = cva("group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-md border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-
|
|
5
|
+
const badgeVariants = cva("group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-md border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-[background-color,border-color,color,opacity] duration-[var(--nc-duration-confirm)] ease-[var(--nc-ease-out-strong)] motion-reduce:transition-none focus-visible:border-ring focus-visible:ring-focus focus-visible:ring-ring has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-focus aria-invalid:ring-destructive [&>svg]:pointer-events-none [&>svg]:size-3!", {
|
|
6
6
|
variants: {
|
|
7
7
|
variant: {
|
|
8
8
|
default: "bg-primary text-primary-foreground [a]:hover:bg-primary-hover",
|
|
@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import { Button as ButtonPrimitive } from "@base-ui/react/button";
|
|
3
3
|
import { cva } from "class-variance-authority";
|
|
4
4
|
import { cn } from "../lib/utils.js";
|
|
5
|
-
const buttonVariants = cva("group/button inline-flex min-h-touch-target min-w-touch-target shrink-0 items-center justify-center rounded-md border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-
|
|
5
|
+
const buttonVariants = cva("group/button inline-flex min-h-touch-target min-w-touch-target shrink-0 items-center justify-center rounded-md border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-[background-color,border-color,color] duration-[var(--nc-duration-confirm)] ease-[var(--nc-ease-out-strong)] outline-none select-none focus-visible:border-ring focus-visible:ring-focus focus-visible:ring-ring active:not-aria-[haspopup]:opacity-90 motion-reduce:transition-none disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-focus aria-invalid:ring-destructive [@media(hover:hover)_and_(pointer:fine)]:min-h-0 [@media(hover:hover)_and_(pointer:fine)]:min-w-0 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", {
|
|
6
6
|
variants: {
|
|
7
7
|
variant: {
|
|
8
8
|
default: "bg-primary text-primary-foreground hover:bg-primary-hover active:bg-primary-active",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chart-time-series.d.ts","sourceRoot":"","sources":["../../src/components/chart-time-series.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAY/B,OAAO,EAGL,KAAK,cAAc,EACpB,MAAM,kCAAkC,CAAC;AAsD1C,KAAK,gBAAgB,GAAG;IACtB,2EAA2E;IAC3E,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,eAAe,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;AAEvD,KAAK,eAAe,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE,UAAU,CAAC,GAAG;IACxE,IAAI,EAAE,SAAS,eAAe,EAAE,CAAC;IACjC,wDAAwD;IACxD,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,SAAS,gBAAgB,EAAE,CAAC;IACpC,2DAA2D;IAC3D,cAAc,EAAE,cAAc,CAAC;IAC/B,wEAAwE;IACxE,KAAK,EAAE,MAAM,CAAC;IACd,oEAAoE;IACpE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC3C;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,6EAA6E;IAC7E,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,CAAC;AAsJF,iBAAS,cAAc,CAAC,EACtB,IAAI,EACJ,IAAI,EACJ,MAAM,EACN,cAAc,EACd,KAAK,EACL,MAAiB,EACjB,cAA8B,EAC9B,UAAU,EACV,UAAoB,EACpB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,eAAe,
|
|
1
|
+
{"version":3,"file":"chart-time-series.d.ts","sourceRoot":"","sources":["../../src/components/chart-time-series.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAY/B,OAAO,EAGL,KAAK,cAAc,EACpB,MAAM,kCAAkC,CAAC;AAsD1C,KAAK,gBAAgB,GAAG;IACtB,2EAA2E;IAC3E,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,eAAe,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;AAEvD,KAAK,eAAe,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE,UAAU,CAAC,GAAG;IACxE,IAAI,EAAE,SAAS,eAAe,EAAE,CAAC;IACjC,wDAAwD;IACxD,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,SAAS,gBAAgB,EAAE,CAAC;IACpC,2DAA2D;IAC3D,cAAc,EAAE,cAAc,CAAC;IAC/B,wEAAwE;IACxE,KAAK,EAAE,MAAM,CAAC;IACd,oEAAoE;IACpE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC3C;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,6EAA6E;IAC7E,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,CAAC;AAsJF,iBAAS,cAAc,CAAC,EACtB,IAAI,EACJ,IAAI,EACJ,MAAM,EACN,cAAc,EACd,KAAK,EACL,MAAiB,EACjB,cAA8B,EAC9B,UAAU,EACV,UAAoB,EACpB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,eAAe,qBA+CjB;AAED,iBAAS,cAAc,CAAC,EACtB,IAAI,EACJ,IAAI,EACJ,MAAM,EACN,cAAc,EACd,KAAK,EACL,MAAiB,EACjB,cAA8B,EAC9B,UAAU,EACV,UAAoB,EACpB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,eAAe,qBAwDjB;AAED,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,eAAe,EAAE,gBAAgB,EAAE,CAAC"}
|
|
@@ -114,14 +114,14 @@ function TimeSeriesFrame({ label, className, children, ...props }) {
|
|
|
114
114
|
function TimeSeriesBars({ data, xKey, series, entityColorMap, label, xLabel = "Period", valueFormatter = defaultFormat, yAxisWidth, otherLabel = "Other", className, ...props }) {
|
|
115
115
|
const folded = foldNeutralSeries(series, entityColorMap, data, otherLabel);
|
|
116
116
|
const config = seriesChartConfig(folded.series, entityColorMap);
|
|
117
|
-
return (_jsxs(TimeSeriesFrame, { "data-slot": "time-series-bars", label: label, className: className, ...props, children: [_jsx(ChartContainer, { config: config, className: cn("w-full", CHART_SURFACE_FOCUS_CLASS), children: _jsxs(BarChart, { accessibilityLayer: true, title: label, data: folded.data, children: [_jsx(CartesianGrid, { vertical: false }), _jsx(XAxis, { dataKey: xKey, tickLine: false, axisLine: false, tickMargin: 8 }), _jsx(YAxis, { tickLine: false, axisLine: false, width: yAxisWidth ?? "auto", tickFormatter: (value) => valueFormatter(Number(value)) }), _jsx(ChartTooltip, { content: _jsx(ChartTooltipContent, { formatter: tooltipRowFormatter(folded.series, valueFormatter) }) }), folded.series.length > 1 ? _jsx(ChartLegend, { content: _jsx(ChartLegendContent, {}) }) : null, _jsx(BarStack, { stackId: "stacked", radius: [4, 4, 0, 0], children: folded.series.map((entry) => (_jsx(Bar, { dataKey: entry.id, maxBarSize: 24, fill: entityColor(entityColorMap, entry.id), stroke: "var(--background)", strokeWidth: 2 }, entry.id))) })] }) }), _jsx(TimeSeriesTableAlternative, { data: folded.data, xKey: xKey, xLabel: xLabel, series: folded.series, label: label, valueFormatter: valueFormatter })] }));
|
|
117
|
+
return (_jsxs(TimeSeriesFrame, { "data-slot": "time-series-bars", label: label, className: className, ...props, children: [_jsx(ChartContainer, { config: config, className: cn("w-full", CHART_SURFACE_FOCUS_CLASS), children: _jsxs(BarChart, { accessibilityLayer: true, title: label, data: folded.data, children: [_jsx(CartesianGrid, { vertical: false }), _jsx(XAxis, { dataKey: xKey, tickLine: false, axisLine: false, tickMargin: 8 }), _jsx(YAxis, { tickLine: false, axisLine: false, width: yAxisWidth ?? "auto", tickFormatter: (value) => valueFormatter(Number(value)) }), _jsx(ChartTooltip, { content: _jsx(ChartTooltipContent, { formatter: tooltipRowFormatter(folded.series, valueFormatter) }) }), folded.series.length > 1 ? _jsx(ChartLegend, { content: _jsx(ChartLegendContent, {}) }) : null, _jsx(BarStack, { stackId: "stacked", radius: [4, 4, 0, 0], children: folded.series.map((entry) => (_jsx(Bar, { dataKey: entry.id, isAnimationActive: false, maxBarSize: 24, fill: entityColor(entityColorMap, entry.id), stroke: "var(--background)", strokeWidth: 2 }, entry.id))) })] }) }), _jsx(TimeSeriesTableAlternative, { data: folded.data, xKey: xKey, xLabel: xLabel, series: folded.series, label: label, valueFormatter: valueFormatter })] }));
|
|
118
118
|
}
|
|
119
119
|
function TimeSeriesArea({ data, xKey, series, entityColorMap, label, xLabel = "Period", valueFormatter = defaultFormat, yAxisWidth, otherLabel = "Other", className, ...props }) {
|
|
120
120
|
const folded = foldNeutralSeries(series, entityColorMap, data, otherLabel);
|
|
121
121
|
const config = seriesChartConfig(folded.series, entityColorMap);
|
|
122
122
|
return (_jsxs(TimeSeriesFrame, { "data-slot": "time-series-area", label: label, className: className, ...props, children: [_jsx(ChartContainer, { config: config, className: cn("w-full", CHART_SURFACE_FOCUS_CLASS), children: _jsxs(AreaChart, { accessibilityLayer: true, title: label, data: folded.data, children: [_jsx(CartesianGrid, { vertical: false }), _jsx(XAxis, { dataKey: xKey, tickLine: false, axisLine: false, tickMargin: 8 }), _jsx(YAxis, { tickLine: false, axisLine: false, width: yAxisWidth ?? "auto", tickFormatter: (value) => valueFormatter(Number(value)) }), _jsx(ChartTooltip, { content: _jsx(ChartTooltipContent, { formatter: tooltipRowFormatter(folded.series, valueFormatter) }) }), folded.series.length > 1 ? _jsx(ChartLegend, { content: _jsx(ChartLegendContent, {}) }) : null, folded.series.map((entry) => {
|
|
123
123
|
const color = entityColor(entityColorMap, entry.id);
|
|
124
|
-
return (_jsx(Area, { type: "monotone", dataKey: entry.id, stackId: "stacked", stroke: color, strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", fill: color, fillOpacity: 0.1,
|
|
124
|
+
return (_jsx(Area, { type: "monotone", dataKey: entry.id, isAnimationActive: false, stackId: "stacked", stroke: color, strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", fill: color, fillOpacity: 0.1,
|
|
125
125
|
// Recharts' default activeDot ring is stroke #fff, which the
|
|
126
126
|
// chart foundation remaps to transparent — an explicit surface
|
|
127
127
|
// ring keeps the DESIGN.md 2px marker-ring spec on hover/focus.
|
package/dist/components/chart.js
CHANGED
|
@@ -8,7 +8,7 @@ const THEMES = { light: "", dark: ".dark" };
|
|
|
8
8
|
const INITIAL_DIMENSION = { width: 320, height: 200 };
|
|
9
9
|
// Deviates from stock base-nova (raw interpolation): chart id and color values
|
|
10
10
|
// are sanitized before they reach the injected <style> tag, closing the CSS
|
|
11
|
-
// injection surface.
|
|
11
|
+
// injection surface. Exercised through hostile-input rendering tests; see ADR 0010.
|
|
12
12
|
function sanitizeChartToken(value) {
|
|
13
13
|
const sanitized = value
|
|
14
14
|
.trim()
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../src/components/dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;
|
|
1
|
+
{"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../src/components/dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAOlE,iBAAS,MAAM,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,CAAC,IAAI,CAAC,KAAK,qBAEvD;AAED,iBAAS,aAAa,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,CAAC,OAAO,CAAC,KAAK,qBAEjE;AAED,iBAAS,YAAY,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,CAAC,MAAM,CAAC,KAAK,qBAE/D;AAED,iBAAS,WAAW,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,CAAC,KAAK,CAAC,KAAK,qBAE7D;AAED,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,CAAC,QAAQ,CAAC,KAAK,qBAQ7E;AAED,KAAK,kBAAkB,GAAG,eAAe,CAAC,KAAK,CAAC,KAAK,GAAG;IACtD,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC9B,CAAC;AAEF,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,QAAQ,EACR,eAAsB,EACtB,UAAoB,EACpB,GAAG,KAAK,EACT,EAAE,kBAAkB,qBAgCpB;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAIzE;AAED,KAAK,iBAAiB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IACrD,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC9B,CAAC;AAEF,iBAAS,YAAY,CAAC,EACpB,SAAS,EACT,eAAuB,EACvB,UAAoB,EACpB,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,iBAAiB,qBAkBnB;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,CAAC,KAAK,CAAC,KAAK,qBAQxE;AAED,iBAAS,iBAAiB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,CAAC,WAAW,CAAC,KAAK,qBAWpF;AAED,OAAO,EACL,MAAM,EACN,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,WAAW,EACX,aAAa,GACd,CAAC"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Dialog as DialogPrimitive } from "@base-ui/react/dialog";
|
|
3
3
|
import { cn } from "../lib/utils.js";
|
|
4
|
+
import { modalOverlayMotion, overlayBackdropMotion } from "../lib/motion.js";
|
|
4
5
|
import { Button } from "./button.js";
|
|
5
6
|
import { XIcon } from "lucide-react";
|
|
6
7
|
function Dialog({ ...props }) {
|
|
@@ -16,10 +17,10 @@ function DialogClose({ ...props }) {
|
|
|
16
17
|
return _jsx(DialogPrimitive.Close, { "data-slot": "dialog-close", ...props });
|
|
17
18
|
}
|
|
18
19
|
function DialogOverlay({ className, ...props }) {
|
|
19
|
-
return (_jsx(DialogPrimitive.Backdrop, { "data-slot": "dialog-overlay", className: cn("fixed inset-0 isolate z-50 bg-scrim/scrim
|
|
20
|
+
return (_jsx(DialogPrimitive.Backdrop, { "data-slot": "dialog-overlay", className: cn("fixed inset-0 isolate z-50 bg-scrim/scrim", overlayBackdropMotion, className), ...props }));
|
|
20
21
|
}
|
|
21
22
|
function DialogContent({ className, children, showCloseButton = true, closeLabel = "Close", ...props }) {
|
|
22
|
-
return (_jsxs(DialogPortal, { children: [_jsx(DialogOverlay, {}), _jsxs(DialogPrimitive.Popup, { "data-slot": "dialog-content", className: cn("fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-var(--nc-xl))] -translate-x-1/2 -translate-y-1/2 gap-nadicode-md rounded-2xl border border-border bg-popover p-nadicode-lg text-sm text-popover-foreground shadow-dialog
|
|
23
|
+
return (_jsxs(DialogPortal, { children: [_jsx(DialogOverlay, {}), _jsxs(DialogPrimitive.Popup, { "data-slot": "dialog-content", className: cn("fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-var(--nc-xl))] -translate-x-1/2 -translate-y-1/2 gap-nadicode-md rounded-2xl border border-border bg-popover p-nadicode-lg text-sm text-popover-foreground shadow-dialog outline-none sm:max-w-sm", modalOverlayMotion, className), ...props, children: [children, showCloseButton && (_jsxs(DialogPrimitive.Close, { "data-slot": "dialog-close", render: _jsx(Button, { variant: "ghost", className: "absolute top-nadicode-md right-nadicode-md", size: "icon-sm" }), children: [_jsx(XIcon, {}), _jsx("span", { className: "sr-only", children: closeLabel })] }))] })] }));
|
|
23
24
|
}
|
|
24
25
|
function DialogHeader({ className, ...props }) {
|
|
25
26
|
return (_jsx("div", { "data-slot": "dialog-header", className: cn("flex flex-col gap-2", className), ...props }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown-menu.d.ts","sourceRoot":"","sources":["../../src/components/dropdown-menu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,IAAI,IAAI,aAAa,EAAE,MAAM,qBAAqB,CAAC;
|
|
1
|
+
{"version":3,"file":"dropdown-menu.d.ts","sourceRoot":"","sources":["../../src/components/dropdown-menu.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Menu as MenuPrimitive } from "@base-ui/react/menu";
|
|
3
3
|
import { cn } from "../lib/utils.js";
|
|
4
|
+
import { anchoredOverlayMotion } from "../lib/motion.js";
|
|
4
5
|
import { ChevronRightIcon, CheckIcon } from "lucide-react";
|
|
5
6
|
function DropdownMenu({ ...props }) {
|
|
6
7
|
return _jsx(MenuPrimitive.Root, { "data-slot": "dropdown-menu", ...props });
|
|
@@ -12,7 +13,7 @@ function DropdownMenuTrigger({ ...props }) {
|
|
|
12
13
|
return _jsx(MenuPrimitive.Trigger, { "data-slot": "dropdown-menu-trigger", ...props });
|
|
13
14
|
}
|
|
14
15
|
function DropdownMenuContent({ align = "start", alignOffset = 0, side = "bottom", sideOffset = 4, className, ...props }) {
|
|
15
|
-
return (_jsx(MenuPrimitive.Portal, { children: _jsx(MenuPrimitive.Positioner, { className: "isolate z-50 outline-none", align: align, alignOffset: alignOffset, side: side, sideOffset: sideOffset, children: _jsx(MenuPrimitive.Popup, { "data-slot": "dropdown-menu-content", className: cn("z-50 max-h-(--available-height) w-(--anchor-width) min-w-32
|
|
16
|
+
return (_jsx(MenuPrimitive.Portal, { children: _jsx(MenuPrimitive.Positioner, { className: "isolate z-50 outline-none", align: align, alignOffset: alignOffset, side: side, sideOffset: sideOffset, children: _jsx(MenuPrimitive.Popup, { "data-slot": "dropdown-menu-content", className: cn("z-50 max-h-(--available-height) w-(--anchor-width) min-w-32 overflow-x-hidden overflow-y-auto rounded-2xl border border-border bg-popover p-nadicode-xxs text-popover-foreground shadow-menu outline-none data-closed:overflow-hidden", anchoredOverlayMotion, className), ...props }) }) }));
|
|
16
17
|
}
|
|
17
18
|
function DropdownMenuGroup({ ...props }) {
|
|
18
19
|
return _jsx(MenuPrimitive.Group, { "data-slot": "dropdown-menu-group", ...props });
|
|
@@ -18,7 +18,7 @@ function InputOTPGroup({ className, ...props }) {
|
|
|
18
18
|
function InputOTPSlot({ index, className, ...props }) {
|
|
19
19
|
const inputOTPContext = React.useContext(OTPInputContext);
|
|
20
20
|
const { char, hasFakeCaret, isActive } = inputOTPContext?.slots[index] ?? {};
|
|
21
|
-
return (_jsxs("div", { "data-slot": "input-otp-slot", "data-active": isActive, className: cn("relative flex h-control-height min-h-touch-target w-control-height min-w-touch-target items-center justify-center border-y border-r border-input bg-background text-sm transition-
|
|
21
|
+
return (_jsxs("div", { "data-slot": "input-otp-slot", "data-active": isActive, className: cn("relative flex h-control-height min-h-touch-target w-control-height min-w-touch-target items-center justify-center border-y border-r border-input bg-background text-sm transition-[border-color,box-shadow,color,opacity] duration-[var(--nc-duration-confirm)] ease-[var(--nc-ease-out-strong)] motion-reduce:transition-none outline-none first:rounded-l-md first:border-l last:rounded-r-md aria-invalid:border-destructive data-[active=true]:z-10 data-[active=true]:border-ring data-[active=true]:ring-focus data-[active=true]:ring-ring data-[active=true]:aria-invalid:border-destructive data-[active=true]:aria-invalid:ring-destructive [@media(hover:hover)_and_(pointer:fine)]:min-h-0 [@media(hover:hover)_and_(pointer:fine)]:min-w-0", className), ...props, children: [char, hasFakeCaret && (_jsx("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: _jsx("div", { className: "h-4 w-px animate-caret-blink bg-foreground duration-1000" }) }))] }));
|
|
22
22
|
}
|
|
23
23
|
function InputOTPSeparator({ ...props }) {
|
|
24
24
|
return (_jsx("div", { "data-slot": "input-otp-separator", className: "flex items-center [&_svg:not([class*='size-'])]:size-4", role: "separator", ...props, children: _jsx(MinusIcon, {}) }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"popover.d.ts","sourceRoot":"","sources":["../../src/components/popover.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;
|
|
1
|
+
{"version":3,"file":"popover.d.ts","sourceRoot":"","sources":["../../src/components/popover.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAKrE,iBAAS,OAAO,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,CAAC,IAAI,CAAC,KAAK,qBAEzD;AAED,iBAAS,cAAc,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,CAAC,OAAO,CAAC,KAAK,qBAEnE;AAED,iBAAS,cAAc,CAAC,EACtB,SAAS,EACT,KAAgB,EAChB,WAAe,EACf,IAAe,EACf,UAAc,EACd,GAAG,KAAK,EACT,EAAE,gBAAgB,CAAC,KAAK,CAAC,KAAK,GAC7B,IAAI,CAAC,gBAAgB,CAAC,UAAU,CAAC,KAAK,EAAE,OAAO,GAAG,aAAa,GAAG,MAAM,GAAG,YAAY,CAAC,qBAsBzF;AAED,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQ1E;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,CAAC,KAAK,CAAC,KAAK,qBAQ1E;AAED,iBAAS,kBAAkB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,CAAC,WAAW,CAAC,KAAK,qBAQtF;AAED,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,kBAAkB,EAAE,aAAa,EAAE,YAAY,EAAE,cAAc,EAAE,CAAC"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { Popover as PopoverPrimitive } from "@base-ui/react/popover";
|
|
3
3
|
import { cn } from "../lib/utils.js";
|
|
4
|
+
import { anchoredOverlayMotion } from "../lib/motion.js";
|
|
4
5
|
function Popover({ ...props }) {
|
|
5
6
|
return _jsx(PopoverPrimitive.Root, { "data-slot": "popover", ...props });
|
|
6
7
|
}
|
|
@@ -8,7 +9,7 @@ function PopoverTrigger({ ...props }) {
|
|
|
8
9
|
return _jsx(PopoverPrimitive.Trigger, { "data-slot": "popover-trigger", ...props });
|
|
9
10
|
}
|
|
10
11
|
function PopoverContent({ className, align = "center", alignOffset = 0, side = "bottom", sideOffset = 4, ...props }) {
|
|
11
|
-
return (_jsx(PopoverPrimitive.Portal, { children: _jsx(PopoverPrimitive.Positioner, { align: align, alignOffset: alignOffset, side: side, sideOffset: sideOffset, className: "isolate z-50", children: _jsx(PopoverPrimitive.Popup, { "data-slot": "popover-content", className: cn("z-50 flex w-72
|
|
12
|
+
return (_jsx(PopoverPrimitive.Portal, { children: _jsx(PopoverPrimitive.Positioner, { align: align, alignOffset: alignOffset, side: side, sideOffset: sideOffset, className: "isolate z-50", children: _jsx(PopoverPrimitive.Popup, { "data-slot": "popover-content", className: cn("z-50 flex w-72 flex-col gap-control-padding-inline rounded-2xl border border-border bg-popover p-control-padding-inline text-sm text-popover-foreground shadow-menu outline-hidden", anchoredOverlayMotion, className), ...props }) }) }));
|
|
12
13
|
}
|
|
13
14
|
function PopoverHeader({ className, ...props }) {
|
|
14
15
|
return (_jsx("div", { "data-slot": "popover-header", className: cn("flex flex-col gap-0.5 text-sm", className), ...props }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../src/components/select.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;
|
|
1
|
+
{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../src/components/select.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAMlE,QAAA,MAAM,MAAM,6BAAuB,CAAC;AAEpC,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,CAAC,KAAK,CAAC,KAAK,qBAQxE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,CAAC,KAAK,CAAC,KAAK,qBAQxE;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,IAAgB,EAChB,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,eAAe,CAAC,OAAO,CAAC,KAAK,GAAG;IACjC,IAAI,CAAC,EAAE,IAAI,GAAG,SAAS,CAAC;CACzB,qBAiBA;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,QAAQ,EACR,IAAe,EACf,UAAc,EACd,KAAgB,EAChB,WAAe,EACf,oBAA2B,EAC3B,GAAG,KAAK,EACT,EAAE,eAAe,CAAC,KAAK,CAAC,KAAK,GAC5B,IAAI,CACF,eAAe,CAAC,UAAU,CAAC,KAAK,EAChC,OAAO,GAAG,aAAa,GAAG,MAAM,GAAG,YAAY,GAAG,sBAAsB,CACzE,qBA4BF;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,CAAC,UAAU,CAAC,KAAK,qBAQ7E;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,CAAC,IAAI,CAAC,KAAK,qBAsBhF;AAED,iBAAS,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,CAAC,SAAS,CAAC,KAAK,qBAQhF;AAED,iBAAS,oBAAoB,CAAC,EAC5B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,aAAa,CAAC,qBAa5D;AAED,iBAAS,sBAAsB,CAAC,EAC9B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,eAAe,CAAC,qBAa9D;AAED,OAAO,EACL,MAAM,EACN,aAAa,EACb,WAAW,EACX,UAAU,EACV,WAAW,EACX,sBAAsB,EACtB,oBAAoB,EACpB,eAAe,EACf,aAAa,EACb,WAAW,GACZ,CAAC"}
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { Select as SelectPrimitive } from "@base-ui/react/select";
|
|
4
4
|
import { cn } from "../lib/utils.js";
|
|
5
|
+
import { anchoredOverlayMotion } from "../lib/motion.js";
|
|
5
6
|
import { ChevronDownIcon, CheckIcon, ChevronUpIcon } from "lucide-react";
|
|
6
7
|
const Select = SelectPrimitive.Root;
|
|
7
8
|
function SelectGroup({ className, ...props }) {
|
|
@@ -14,7 +15,7 @@ function SelectTrigger({ className, size = "default", children, ...props }) {
|
|
|
14
15
|
return (_jsxs(SelectPrimitive.Trigger, { "data-slot": "select-trigger", "data-size": size, className: cn("flex h-control-height min-h-touch-target w-fit items-center justify-between gap-1.5 rounded-md border border-input bg-background py-2 pr-2 pl-control-padding-inline text-sm whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-focus focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-focus aria-invalid:ring-destructive data-placeholder:text-placeholder data-[size=sm]:h-7 [@media(hover:hover)_and_(pointer:fine)]:min-h-0 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className), ...props, children: [children, _jsx(SelectPrimitive.Icon, { render: _jsx(ChevronDownIcon, { className: "pointer-events-none size-4 text-muted-foreground" }) })] }));
|
|
15
16
|
}
|
|
16
17
|
function SelectContent({ className, children, side = "bottom", sideOffset = 4, align = "center", alignOffset = 0, alignItemWithTrigger = true, ...props }) {
|
|
17
|
-
return (_jsx(SelectPrimitive.Portal, { children: _jsx(SelectPrimitive.Positioner, { side: side, sideOffset: sideOffset, align: align, alignOffset: alignOffset, alignItemWithTrigger: alignItemWithTrigger, className: "isolate z-50", children: _jsxs(SelectPrimitive.Popup, { "data-slot": "select-content", "data-align-trigger": alignItemWithTrigger, className: cn("relative isolate z-50 max-h-(--available-height) w-(--anchor-width) min-w-36
|
|
18
|
+
return (_jsx(SelectPrimitive.Portal, { children: _jsx(SelectPrimitive.Positioner, { side: side, sideOffset: sideOffset, align: align, alignOffset: alignOffset, alignItemWithTrigger: alignItemWithTrigger, className: "isolate z-50", children: _jsxs(SelectPrimitive.Popup, { "data-slot": "select-content", "data-align-trigger": alignItemWithTrigger, className: cn("relative isolate z-50 max-h-(--available-height) w-(--anchor-width) min-w-36 overflow-x-hidden overflow-y-auto rounded-2xl border border-border bg-popover text-popover-foreground shadow-menu data-[align-trigger=true]:transition-none", anchoredOverlayMotion, className), ...props, children: [_jsx(SelectScrollUpButton, {}), _jsx(SelectPrimitive.List, { children: children }), _jsx(SelectScrollDownButton, {})] }) }) }));
|
|
18
19
|
}
|
|
19
20
|
function SelectLabel({ className, ...props }) {
|
|
20
21
|
return (_jsx(SelectPrimitive.GroupLabel, { "data-slot": "select-label", className: cn("px-1.5 py-1 text-xs text-muted-foreground", className), ...props }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sheet.d.ts","sourceRoot":"","sources":["../../src/components/sheet.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,uBAAuB,CAAC;
|
|
1
|
+
{"version":3,"file":"sheet.d.ts","sourceRoot":"","sources":["../../src/components/sheet.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAOjE,iBAAS,KAAK,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,KAAK,qBAErD;AAED,iBAAS,YAAY,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,OAAO,CAAC,KAAK,qBAE/D;AAED,iBAAS,UAAU,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,KAAK,CAAC,KAAK,qBAE3D;AAgBD,KAAK,iBAAiB,GAAG,cAAc,CAAC,KAAK,CAAC,KAAK,GAAG;IACpD,IAAI,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAC3C,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC9B,CAAC;AAEF,iBAAS,YAAY,CAAC,EACpB,SAAS,EACT,QAAQ,EACR,IAAc,EACd,eAAsB,EACtB,UAAoB,EACpB,GAAG,KAAK,EACT,EAAE,iBAAiB,qBAgCnB;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQxE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQxE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,KAAK,CAAC,KAAK,qBAQtE;AAED,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,WAAW,CAAC,KAAK,qBAQlF;AAED,OAAO,EACL,KAAK,EACL,YAAY,EACZ,UAAU,EACV,YAAY,EACZ,WAAW,EACX,WAAW,EACX,UAAU,EACV,gBAAgB,GACjB,CAAC"}
|
package/dist/components/sheet.js
CHANGED
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { Dialog as SheetPrimitive } from "@base-ui/react/dialog";
|
|
4
4
|
import { cn } from "../lib/utils.js";
|
|
5
|
+
import { overlayBackdropMotion } from "../lib/motion.js";
|
|
5
6
|
import { Button } from "./button.js";
|
|
6
7
|
import { XIcon } from "lucide-react";
|
|
7
8
|
function Sheet({ ...props }) {
|
|
@@ -17,10 +18,10 @@ function SheetPortal({ ...props }) {
|
|
|
17
18
|
return _jsx(SheetPrimitive.Portal, { "data-slot": "sheet-portal", ...props });
|
|
18
19
|
}
|
|
19
20
|
function SheetOverlay({ className, ...props }) {
|
|
20
|
-
return (_jsx(SheetPrimitive.Backdrop, { "data-slot": "sheet-overlay", className: cn("fixed inset-0 z-50 bg-scrim/scrim
|
|
21
|
+
return (_jsx(SheetPrimitive.Backdrop, { "data-slot": "sheet-overlay", className: cn("fixed inset-0 z-50 bg-scrim/scrim", overlayBackdropMotion, className), ...props }));
|
|
21
22
|
}
|
|
22
23
|
function SheetContent({ className, children, side = "right", showCloseButton = true, closeLabel = "Close", ...props }) {
|
|
23
|
-
return (_jsxs(SheetPortal, { children: [_jsx(SheetOverlay, {}), _jsxs(SheetPrimitive.Popup, { "data-slot": "sheet-content", "data-side": side, className: cn("fixed z-50 flex max-h-[calc(100%-var(--nc-lg))] flex-col gap-nadicode-md rounded-3xl border border-border bg-popover bg-clip-padding text-sm text-popover-foreground shadow-sheet transition duration-
|
|
24
|
+
return (_jsxs(SheetPortal, { children: [_jsx(SheetOverlay, {}), _jsxs(SheetPrimitive.Popup, { "data-slot": "sheet-content", "data-side": side, className: cn("fixed z-50 flex max-h-[calc(100%-var(--nc-lg))] flex-col gap-nadicode-md rounded-3xl border border-border bg-popover bg-clip-padding text-sm text-popover-foreground shadow-sheet transition-[opacity,translate] duration-[var(--nc-duration-close)] ease-[var(--nc-ease-out-strong)] data-open:duration-[var(--nc-duration-open)] data-ending-style:opacity-0 data-starting-style:opacity-0 motion-reduce:transition-none motion-reduce:data-ending-style:opacity-100 motion-reduce:data-starting-style:opacity-100 data-[side=bottom]:inset-x-nadicode-sm data-[side=bottom]:bottom-nadicode-sm data-[side=bottom]:h-auto data-[side=bottom]:data-ending-style:translate-y-nadicode-md data-[side=bottom]:data-starting-style:translate-y-nadicode-md motion-reduce:data-[side=bottom]:data-ending-style:translate-none motion-reduce:data-[side=bottom]:data-starting-style:translate-none data-[side=left]:inset-y-nadicode-sm data-[side=left]:left-nadicode-sm data-[side=left]:w-3/4 data-[side=left]:data-ending-style:-translate-x-nadicode-md data-[side=left]:data-starting-style:-translate-x-nadicode-md motion-reduce:data-[side=left]:data-ending-style:translate-none motion-reduce:data-[side=left]:data-starting-style:translate-none data-[side=right]:inset-y-nadicode-sm data-[side=right]:right-nadicode-sm data-[side=right]:w-3/4 data-[side=right]:data-ending-style:translate-x-nadicode-md data-[side=right]:data-starting-style:translate-x-nadicode-md motion-reduce:data-[side=right]:data-ending-style:translate-none motion-reduce:data-[side=right]:data-starting-style:translate-none data-[side=top]:inset-x-nadicode-sm data-[side=top]:top-nadicode-sm data-[side=top]:h-auto data-[side=top]:data-ending-style:-translate-y-nadicode-md data-[side=top]:data-starting-style:-translate-y-nadicode-md motion-reduce:data-[side=top]:data-ending-style:translate-none motion-reduce:data-[side=top]:data-starting-style:translate-none data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm", className), ...props, children: [children, showCloseButton && (_jsxs(SheetPrimitive.Close, { "data-slot": "sheet-close", render: _jsx(Button, { variant: "ghost", className: "absolute top-nadicode-md right-nadicode-md", size: "icon-sm" }), children: [_jsx(XIcon, {}), _jsx("span", { className: "sr-only", children: closeLabel })] }))] })] }));
|
|
24
25
|
}
|
|
25
26
|
function SheetHeader({ className, ...props }) {
|
|
26
27
|
return (_jsx("div", { "data-slot": "sheet-header", className: cn("flex flex-col gap-0.5 p-nadicode-lg", className), ...props }));
|
|
@@ -105,7 +105,7 @@ function SidebarTrigger({ className, onClick, ...props }) {
|
|
|
105
105
|
}
|
|
106
106
|
function SidebarRail({ className, "aria-label": ariaLabel = "Toggle Sidebar", title, ...props }) {
|
|
107
107
|
const { toggleSidebar } = useSidebar();
|
|
108
|
-
return (_jsx("button", { "data-sidebar": "rail", "data-slot": "sidebar-rail", "aria-label": ariaLabel, title: title ?? ariaLabel, tabIndex: -1, onClick: toggleSidebar, className: cn("absolute inset-y-0 z-20 hidden w-11
|
|
108
|
+
return (_jsx("button", { "data-sidebar": "rail", "data-slot": "sidebar-rail", "aria-label": ariaLabel, title: title ?? ariaLabel, tabIndex: -1, onClick: toggleSidebar, className: cn("absolute inset-y-0 z-20 hidden w-11 group-data-[side=left]:-right-11 group-data-[side=right]:left-0 after:absolute after:inset-y-0 after:start-1/2 after:w-0.5 hover:after:bg-sidebar-border sm:flex ltr:-translate-x-1/2 rtl:-translate-x-1/2 [@media(hover:hover)_and_(pointer:fine)]:w-4 [@media(hover:hover)_and_(pointer:fine)]:group-data-[side=left]:-right-4", "in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize", "[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize", "group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full hover:group-data-[collapsible=offcanvas]:bg-sidebar", "[[data-side=left][data-collapsible=offcanvas]_&]:-right-2", "[[data-side=right][data-collapsible=offcanvas]_&]:-left-2", className), ...props }));
|
|
109
109
|
}
|
|
110
110
|
function SidebarInset({ className, ...props }) {
|
|
111
111
|
return (_jsx("main", { "data-slot": "sidebar-inset", className: cn("relative flex w-full flex-1 flex-col bg-background md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-md md:peer-data-[variant=inset]:border md:peer-data-[variant=inset]:border-border md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2", className), ...props }));
|
|
@@ -3,7 +3,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
3
3
|
import { Toggle as TogglePrimitive } from "@base-ui/react/toggle";
|
|
4
4
|
import { cva } from "class-variance-authority";
|
|
5
5
|
import { cn } from "../lib/utils.js";
|
|
6
|
-
const toggleVariants = cva("group/toggle inline-flex min-h-touch-target min-w-touch-target items-center justify-center gap-1 rounded-md border border-transparent text-sm font-medium whitespace-nowrap transition-
|
|
6
|
+
const toggleVariants = cva("group/toggle inline-flex min-h-touch-target min-w-touch-target items-center justify-center gap-1 rounded-md border border-transparent text-sm font-medium whitespace-nowrap transition-[background-color,border-color,color,opacity] duration-[var(--nc-duration-confirm)] ease-[var(--nc-ease-out-strong)] motion-reduce:transition-none outline-none hover:bg-muted hover:text-foreground focus-visible:border-ring focus-visible:ring-focus focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-focus aria-invalid:ring-destructive aria-pressed:bg-muted data-pressed:bg-muted [@media(hover:hover)_and_(pointer:fine)]:min-h-0 [@media(hover:hover)_and_(pointer:fine)]:min-w-0 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", {
|
|
7
7
|
variants: {
|
|
8
8
|
variant: {
|
|
9
9
|
default: "bg-transparent",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../src/components/tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;
|
|
1
|
+
{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../src/components/tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAKrE,iBAAS,eAAe,CAAC,EAAE,KAAS,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,CAAC,QAAQ,CAAC,KAAK,+BAEhF;AAED,iBAAS,OAAO,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,CAAC,IAAI,CAAC,KAAK,+BAEzD;AAED,iBAAS,cAAc,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,CAAC,OAAO,CAAC,KAAK,+BAEnE;AAED,iBAAS,cAAc,CAAC,EACtB,SAAS,EACT,IAAY,EACZ,UAAc,EACd,KAAgB,EAChB,WAAe,EACf,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,gBAAgB,CAAC,KAAK,CAAC,KAAK,GAC7B,IAAI,CAAC,gBAAgB,CAAC,UAAU,CAAC,KAAK,EAAE,OAAO,GAAG,aAAa,GAAG,MAAM,GAAG,YAAY,CAAC,+BAyBzF;AAED,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,eAAe,EAAE,CAAC"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Tooltip as TooltipPrimitive } from "@base-ui/react/tooltip";
|
|
3
3
|
import { cn } from "../lib/utils.js";
|
|
4
|
+
import { anchoredOverlayMotion } from "../lib/motion.js";
|
|
4
5
|
function TooltipProvider({ delay = 0, ...props }) {
|
|
5
6
|
return _jsx(TooltipPrimitive.Provider, { "data-slot": "tooltip-provider", delay: delay, ...props });
|
|
6
7
|
}
|
|
@@ -11,6 +12,6 @@ function TooltipTrigger({ ...props }) {
|
|
|
11
12
|
return _jsx(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
|
|
12
13
|
}
|
|
13
14
|
function TooltipContent({ className, side = "top", sideOffset = 4, align = "center", alignOffset = 0, children, ...props }) {
|
|
14
|
-
return (_jsx(TooltipPrimitive.Portal, { children: _jsx(TooltipPrimitive.Positioner, { align: align, alignOffset: alignOffset, side: side, sideOffset: sideOffset, className: "isolate z-50", children: _jsxs(TooltipPrimitive.Popup, { "data-slot": "tooltip-content", className: cn("z-50 inline-flex w-fit max-w-xs
|
|
15
|
+
return (_jsx(TooltipPrimitive.Portal, { children: _jsx(TooltipPrimitive.Positioner, { align: align, alignOffset: alignOffset, side: side, sideOffset: sideOffset, className: "isolate z-50", children: _jsxs(TooltipPrimitive.Popup, { "data-slot": "tooltip-content", className: cn("z-50 inline-flex w-fit max-w-xs items-center gap-1.5 rounded-md border border-border bg-popover px-nadicode-sm py-nadicode-filter-chip-gap text-xs text-popover-foreground shadow-tooltip has-data-[slot=kbd]:pr-1.5 **:data-[slot=kbd]:relative **:data-[slot=kbd]:isolate **:data-[slot=kbd]:z-50 **:data-[slot=kbd]:rounded-md", anchoredOverlayMotion, className), ...props, children: [children, _jsx(TooltipPrimitive.Arrow, { className: "z-50 size-2.5 translate-y-[calc(-50%-var(--nc-rounded-xs))] rotate-45 rounded-xs border border-border bg-popover fill-popover data-[side=bottom]:top-1 data-[side=inline-end]:top-1/2! data-[side=inline-end]:-left-1 data-[side=inline-end]:-translate-y-1/2 data-[side=inline-start]:top-1/2! data-[side=inline-start]:-right-1 data-[side=inline-start]:-translate-y-1/2 data-[side=left]:top-1/2! data-[side=left]:-right-1 data-[side=left]:-translate-y-1/2 data-[side=right]:top-1/2! data-[side=right]:-left-1 data-[side=right]:-translate-y-1/2 data-[side=top]:-bottom-2.5" })] }) }) }));
|
|
15
16
|
}
|
|
16
17
|
export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };
|
|
@@ -46,10 +46,6 @@ declare function getContentBottom({ content, spacer, viewport, }: {
|
|
|
46
46
|
viewport: HTMLElement;
|
|
47
47
|
}): number;
|
|
48
48
|
declare function getMaxScrollTop(viewport: HTMLElement): number;
|
|
49
|
-
declare function getContentBlockPadding(spacer: HTMLElement | null): {
|
|
50
|
-
end: number;
|
|
51
|
-
start: number;
|
|
52
|
-
};
|
|
53
49
|
declare function getFlexGap(element: HTMLElement | null): number;
|
|
54
|
-
export {
|
|
50
|
+
export { getContentBottom, getElementScrollTop, getElementTop, getElementViewportTop, getFirstVisibleMessageItem, getFlexGap, getLastScrollAnchor, getMaxScrollTop, getMessageScrollerItems, getMessageScrollerScrollable, getMessageScrollerVisibilityState, getNewScrollAnchor, getTailSpacerHeight, getUnanchoredScrollAnchor, hasMultipleNewScrollAnchors, };
|
|
55
51
|
//# sourceMappingURL=geometry.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"geometry.d.ts","sourceRoot":"","sources":["../../../src/lib/message-scroller-primitive/geometry.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EACV,yBAAyB,EACzB,0BAA0B,EAC1B,8BAA8B,EAC/B,MAAM,SAAS,CAAC;AAEjB,iBAAS,4BAA4B,CAAC,EACpC,OAAO,EACP,mBAAmB,EACnB,MAAM,EACN,QAAQ,GACT,EAAE;IACD,OAAO,EAAE,WAAW,GAAG,IAAI,CAAC;IAC5B,mBAAmB,EAAE,MAAM,CAAC;IAC5B,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC;IAC3B,QAAQ,EAAE,WAAW,GAAG,IAAI,CAAC;CAC9B,GAAG,yBAAyB,CAW5B;AAED,iBAAS,iCAAiC,CAAC,EACzC,OAAO,EACP,YAAY,EACZ,sBAAsB,EACtB,MAAM,EACN,QAAQ,EACR,iBAAiB,GAClB,EAAE;IACD,OAAO,EAAE,WAAW,GAAG,IAAI,CAAC;IAC5B,YAAY,EAAE,MAAM,CAAC;IACrB,sBAAsB,EAAE,MAAM,CAAC;IAC/B,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC;IAC3B,QAAQ,EAAE,WAAW,GAAG,IAAI,CAAC;IAC7B,iBAAiB,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;CAChC,GAAG,8BAA8B,CAuDjC;AAED,iBAAS,uBAAuB,CAAC,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,WAAW,GAAG,IAAI,iBAIhF;AAED,iBAAS,kBAAkB,CAAC,KAAK,EAAE,WAAW,EAAE,EAAE,iBAAiB,EAAE,MAAM,sBAU1E;AAED,iBAAS,yBAAyB,CAChC,KAAK,EAAE,WAAW,EAAE,EACpB,cAAc,EAAE;IAAE,GAAG,CAAC,OAAO,EAAE,WAAW,GAAG,OAAO,CAAA;CAAE,sBASvD;AAED,iBAAS,2BAA2B,CAAC,KAAK,EAAE,WAAW,EAAE,EAAE,iBAAiB,EAAE,MAAM,WAkBnF;AAED,iBAAS,mBAAmB,CAAC,KAAK,EAAE,WAAW,EAAE,sBAUhD;AAED,iBAAS,0BAA0B,CAAC,EAClC,OAAO,EACP,MAAM,EACN,QAAQ,GACT,EAAE;IACD,OAAO,EAAE,WAAW,CAAC;IACrB,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC;IAC3B,QAAQ,EAAE,WAAW,CAAC;CACvB,sBAgBA;AAED,iBAAS,mBAAmB,CAAC,EAC3B,KAAK,EACL,OAAO,EACP,YAAY,EACZ,MAAM,EACN,QAAQ,GACT,EAAE;IACD,KAAK,EAAE,0BAA0B,CAAC;IAClC,OAAO,EAAE,WAAW,CAAC;IACrB,YAAY,EAAE,MAAM,CAAC;IACrB,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC;IAC3B,QAAQ,EAAE,WAAW,CAAC;CACvB,UAmCA;AAED,iBAAS,aAAa,CAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,WAAW,UAKjE;AAED,iBAAS,qBAAqB,CAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,WAAW,UAEzE;AAED,iBAAS,mBAAmB,CAAC,EAC3B,OAAO,EACP,SAAS,EACT,MAAM,EACN,QAAQ,GACT,EAAE;IACD,OAAO,EAAE,WAAW,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC;IAC3B,QAAQ,EAAE,WAAW,CAAC;CACvB,UAIA;AAED,iBAAS,gBAAgB,CAAC,EACxB,OAAO,EACP,MAAM,EACN,QAAQ,GACT,EAAE;IACD,OAAO,EAAE,WAAW,CAAC;IACrB,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC;IAC3B,QAAQ,EAAE,WAAW,CAAC;CACvB,UAiBA;AAED,iBAAS,eAAe,CAAC,QAAQ,EAAE,WAAW,UAE7C;
|
|
1
|
+
{"version":3,"file":"geometry.d.ts","sourceRoot":"","sources":["../../../src/lib/message-scroller-primitive/geometry.ts"],"names":[],"mappings":"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"}
|
|
@@ -196,4 +196,4 @@ function readCssPixel(value) {
|
|
|
196
196
|
const number = Number.parseFloat(value);
|
|
197
197
|
return Number.isFinite(number) ? number : 0;
|
|
198
198
|
}
|
|
199
|
-
export {
|
|
199
|
+
export { getContentBottom, getElementScrollTop, getElementTop, getElementViewportTop, getFirstVisibleMessageItem, getFlexGap, getLastScrollAnchor, getMaxScrollTop, getMessageScrollerItems, getMessageScrollerScrollable, getMessageScrollerVisibilityState, getNewScrollAnchor, getTailSpacerHeight, getUnanchoredScrollAnchor, hasMultipleNewScrollAnchors, };
|
|
@@ -1,7 +1,6 @@
|
|
|
1
|
-
import type { MessageScrollerScrollable, MessageScrollerStore,
|
|
1
|
+
import type { MessageScrollerScrollable, MessageScrollerStore, MessageScrollerVisibilityStore } from "./types";
|
|
2
2
|
declare function createMessageScrollerStore<T>(initialSnapshot: T, isEqual: (a: T, b: T) => boolean): MessageScrollerStore<T>;
|
|
3
3
|
declare function createMessageScrollerVisibilityStore(): MessageScrollerVisibilityStore;
|
|
4
4
|
declare function areScrollStatesEqual(current: MessageScrollerScrollable, next: MessageScrollerScrollable): boolean;
|
|
5
|
-
|
|
6
|
-
export { areScrollStatesEqual, areVisibilityStatesEqual, createMessageScrollerStore, createMessageScrollerVisibilityStore, };
|
|
5
|
+
export { areScrollStatesEqual, createMessageScrollerStore, createMessageScrollerVisibilityStore };
|
|
7
6
|
//# sourceMappingURL=stores.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stores.d.ts","sourceRoot":"","sources":["../../../src/lib/message-scroller-primitive/stores.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EACV,yBAAyB,EACzB,oBAAoB,
|
|
1
|
+
{"version":3,"file":"stores.d.ts","sourceRoot":"","sources":["../../../src/lib/message-scroller-primitive/stores.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EACV,yBAAyB,EACzB,oBAAoB,EAEpB,8BAA8B,EAC/B,MAAM,SAAS,CAAC;AA4CjB,iBAAS,0BAA0B,CAAC,CAAC,EACnC,eAAe,EAAE,CAAC,EAClB,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,OAAO,GAC/B,oBAAoB,CAAC,CAAC,CAAC,CAEzB;AAED,iBAAS,oCAAoC,IAAI,8BAA8B,CAE9E;AAED,iBAAS,oBAAoB,CAAC,OAAO,EAAE,yBAAyB,EAAE,IAAI,EAAE,yBAAyB,WAEhG;AAmBD,OAAO,EAAE,oBAAoB,EAAE,0BAA0B,EAAE,oCAAoC,EAAE,CAAC"}
|
|
@@ -50,4 +50,4 @@ function areVisibilityStatesEqual(current, next) {
|
|
|
50
50
|
}
|
|
51
51
|
return current.visibleMessageIds.every((messageId, index) => messageId === next.visibleMessageIds[index]);
|
|
52
52
|
}
|
|
53
|
-
export { areScrollStatesEqual,
|
|
53
|
+
export { areScrollStatesEqual, createMessageScrollerStore, createMessageScrollerVisibilityStore };
|
|
@@ -82,8 +82,7 @@ type MessageScrollerContextValue = {
|
|
|
82
82
|
visibilityStore: MessageScrollerVisibilityStore;
|
|
83
83
|
};
|
|
84
84
|
declare const EMPTY_MESSAGE_SCROLLER_SCROLLABLE: MessageScrollerScrollable;
|
|
85
|
-
declare const EMPTY_VISIBLE_MESSAGE_IDS: string[];
|
|
86
85
|
declare const EMPTY_MESSAGE_SCROLLER_VISIBILITY_STATE: MessageScrollerVisibilityState;
|
|
87
|
-
export { AUTOSCROLLING_CLEAR_DELAY, DEFAULT_SCROLL_EDGE_THRESHOLD, DEFAULT_SCROLL_MARGIN, DEFAULT_SCROLL_PREVIOUS_ITEM_PEEK, EMPTY_MESSAGE_SCROLLER_SCROLLABLE, EMPTY_MESSAGE_SCROLLER_VISIBILITY_STATE,
|
|
86
|
+
export { AUTOSCROLLING_CLEAR_DELAY, DEFAULT_SCROLL_EDGE_THRESHOLD, DEFAULT_SCROLL_MARGIN, DEFAULT_SCROLL_PREVIOUS_ITEM_PEEK, EMPTY_MESSAGE_SCROLLER_SCROLLABLE, EMPTY_MESSAGE_SCROLLER_VISIBILITY_STATE, SCROLL_POSITION_EPSILON, USER_SCROLL_KEYS, };
|
|
88
87
|
export type { MessageScrollerButtonDirection, MessageScrollerButtonProps, MessageScrollerButtonRenderState, MessageScrollerContentProps, MessageScrollerContextValue, MessageScrollerDefaultScrollPosition, MessageScrollerItemProps, MessageScrollerMode, MessageScrollerProps, MessageScrollerProviderProps, MessageScrollerRegisterMessage, MessageScrollerScrollAlign, MessageScrollerScrollOptions, MessageScrollerScrollable, MessageScrollerStore, MessageScrollerViewportProps, MessageScrollerVisibilityState, MessageScrollerVisibilityStore, };
|
|
89
88
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/lib/message-scroller-primitive/types.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/lib/message-scroller-primitive/types.ts"],"names":[],"mappings":"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"}
|
|
@@ -37,4 +37,4 @@ const EMPTY_MESSAGE_SCROLLER_VISIBILITY_STATE = {
|
|
|
37
37
|
currentAnchorId: null,
|
|
38
38
|
visibleMessageIds: EMPTY_VISIBLE_MESSAGE_IDS,
|
|
39
39
|
};
|
|
40
|
-
export { AUTOSCROLLING_CLEAR_DELAY, DEFAULT_SCROLL_EDGE_THRESHOLD, DEFAULT_SCROLL_MARGIN, DEFAULT_SCROLL_PREVIOUS_ITEM_PEEK, EMPTY_MESSAGE_SCROLLER_SCROLLABLE, EMPTY_MESSAGE_SCROLLER_VISIBILITY_STATE,
|
|
40
|
+
export { AUTOSCROLLING_CLEAR_DELAY, DEFAULT_SCROLL_EDGE_THRESHOLD, DEFAULT_SCROLL_MARGIN, DEFAULT_SCROLL_PREVIOUS_ITEM_PEEK, EMPTY_MESSAGE_SCROLLER_SCROLLABLE, EMPTY_MESSAGE_SCROLLER_VISIBILITY_STATE, SCROLL_POSITION_EPSILON, USER_SCROLL_KEYS, };
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Shared motion classes for Base UI overlay primitives.
|
|
3
|
+
*
|
|
4
|
+
* Keeping these states behind one internal seam makes token timing and reduced
|
|
5
|
+
* motion part of every public primitive that consumes them. Base UI supplies
|
|
6
|
+
* the lifecycle attributes and transform origin; the classes only style them.
|
|
7
|
+
*/
|
|
8
|
+
declare const overlayBackdropMotion = "transition-opacity duration-[var(--nc-duration-close)] ease-[var(--nc-ease-out-strong)] data-open:duration-[var(--nc-duration-open)] data-ending-style:opacity-0 data-starting-style:opacity-0 motion-reduce:transition-none motion-reduce:data-ending-style:opacity-100 motion-reduce:data-starting-style:opacity-100";
|
|
9
|
+
declare const anchoredOverlayMotion = "origin-(--transform-origin) transition-[opacity,scale] duration-[var(--nc-duration-close)] ease-[var(--nc-ease-out-strong)] data-open:duration-[var(--nc-duration-open)] data-instant:transition-none data-ending-style:opacity-0 data-ending-style:scale-[0.98] data-starting-style:opacity-0 data-starting-style:scale-[0.98] motion-reduce:transition-none motion-reduce:data-ending-style:opacity-100 motion-reduce:data-ending-style:scale-100 motion-reduce:data-starting-style:opacity-100 motion-reduce:data-starting-style:scale-100";
|
|
10
|
+
declare const modalOverlayMotion = "transition-[opacity,scale] duration-[var(--nc-duration-close)] ease-[var(--nc-ease-out-strong)] data-open:duration-[var(--nc-duration-open)] data-ending-style:opacity-0 data-ending-style:scale-[0.98] data-starting-style:opacity-0 data-starting-style:scale-[0.98] motion-reduce:transition-none motion-reduce:data-ending-style:opacity-100 motion-reduce:data-ending-style:scale-100 motion-reduce:data-starting-style:opacity-100 motion-reduce:data-starting-style:scale-100";
|
|
11
|
+
export { anchoredOverlayMotion, modalOverlayMotion, overlayBackdropMotion };
|
|
12
|
+
//# sourceMappingURL=motion.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"motion.d.ts","sourceRoot":"","sources":["../../src/lib/motion.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,QAAA,MAAM,qBAAqB,2TAC+R,CAAC;AAE3T,QAAA,MAAM,qBAAqB,khBACsf,CAAC;AAElhB,QAAA,MAAM,kBAAkB,ydACgc,CAAC;AAEzd,OAAO,EAAE,qBAAqB,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,CAAC"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Shared motion classes for Base UI overlay primitives.
|
|
3
|
+
*
|
|
4
|
+
* Keeping these states behind one internal seam makes token timing and reduced
|
|
5
|
+
* motion part of every public primitive that consumes them. Base UI supplies
|
|
6
|
+
* the lifecycle attributes and transform origin; the classes only style them.
|
|
7
|
+
*/
|
|
8
|
+
const overlayBackdropMotion = "transition-opacity duration-[var(--nc-duration-close)] ease-[var(--nc-ease-out-strong)] data-open:duration-[var(--nc-duration-open)] data-ending-style:opacity-0 data-starting-style:opacity-0 motion-reduce:transition-none motion-reduce:data-ending-style:opacity-100 motion-reduce:data-starting-style:opacity-100";
|
|
9
|
+
const anchoredOverlayMotion = "origin-(--transform-origin) transition-[opacity,scale] duration-[var(--nc-duration-close)] ease-[var(--nc-ease-out-strong)] data-open:duration-[var(--nc-duration-open)] data-instant:transition-none data-ending-style:opacity-0 data-ending-style:scale-[0.98] data-starting-style:opacity-0 data-starting-style:scale-[0.98] motion-reduce:transition-none motion-reduce:data-ending-style:opacity-100 motion-reduce:data-ending-style:scale-100 motion-reduce:data-starting-style:opacity-100 motion-reduce:data-starting-style:scale-100";
|
|
10
|
+
const modalOverlayMotion = "transition-[opacity,scale] duration-[var(--nc-duration-close)] ease-[var(--nc-ease-out-strong)] data-open:duration-[var(--nc-duration-open)] data-ending-style:opacity-0 data-ending-style:scale-[0.98] data-starting-style:opacity-0 data-starting-style:scale-[0.98] motion-reduce:transition-none motion-reduce:data-ending-style:opacity-100 motion-reduce:data-ending-style:scale-100 motion-reduce:data-starting-style:opacity-100 motion-reduce:data-starting-style:scale-100";
|
|
11
|
+
export { anchoredOverlayMotion, modalOverlayMotion, overlayBackdropMotion };
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export declare function useCopyToClipboard({ text, onCopy, onError, timeout, skipWhileCopied, }: {
|
|
2
|
+
text: string;
|
|
3
|
+
onCopy?: () => void;
|
|
4
|
+
onError?: (error: Error) => void;
|
|
5
|
+
timeout: number;
|
|
6
|
+
skipWhileCopied?: boolean;
|
|
7
|
+
}): {
|
|
8
|
+
copyToClipboard: () => Promise<void>;
|
|
9
|
+
isCopied: boolean;
|
|
10
|
+
};
|
|
11
|
+
//# sourceMappingURL=use-copy-to-clipboard.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-copy-to-clipboard.d.ts","sourceRoot":"","sources":["../../src/lib/use-copy-to-clipboard.ts"],"names":[],"mappings":"AAEA,wBAAgB,kBAAkB,CAAC,EACjC,IAAI,EACJ,MAAM,EACN,OAAO,EACP,OAAO,EACP,eAAuB,GACxB,EAAE;IACD,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACjC,OAAO,EAAE,MAAM,CAAC;IAChB,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;;;EA+BA"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { useCallback, useEffect, useRef, useState } from "react";
|
|
2
|
+
export function useCopyToClipboard({ text, onCopy, onError, timeout, skipWhileCopied = false, }) {
|
|
3
|
+
const [isCopied, setIsCopied] = useState(false);
|
|
4
|
+
const timeoutRef = useRef(0);
|
|
5
|
+
const copyToClipboard = useCallback(async () => {
|
|
6
|
+
if (typeof window === "undefined" || !navigator?.clipboard?.writeText) {
|
|
7
|
+
onError?.(new Error("Clipboard API not available"));
|
|
8
|
+
return;
|
|
9
|
+
}
|
|
10
|
+
if (skipWhileCopied && isCopied) {
|
|
11
|
+
return;
|
|
12
|
+
}
|
|
13
|
+
try {
|
|
14
|
+
await navigator.clipboard.writeText(text);
|
|
15
|
+
setIsCopied(true);
|
|
16
|
+
onCopy?.();
|
|
17
|
+
timeoutRef.current = window.setTimeout(() => setIsCopied(false), timeout);
|
|
18
|
+
}
|
|
19
|
+
catch (error) {
|
|
20
|
+
onError?.(error);
|
|
21
|
+
}
|
|
22
|
+
}, [isCopied, onCopy, onError, skipWhileCopied, text, timeout]);
|
|
23
|
+
useEffect(() => () => {
|
|
24
|
+
window.clearTimeout(timeoutRef.current);
|
|
25
|
+
}, []);
|
|
26
|
+
return { copyToClipboard, isCopied };
|
|
27
|
+
}
|
package/dist/styles/globals.css
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nadicodeai/ui",
|
|
3
|
-
"version": "0.10.
|
|
3
|
+
"version": "0.10.2",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -63,7 +63,7 @@
|
|
|
63
63
|
},
|
|
64
64
|
"dependencies": {
|
|
65
65
|
"@base-ui/react": "^1.6.0",
|
|
66
|
-
"@nadicodeai/design-system": "0.10.
|
|
66
|
+
"@nadicodeai/design-system": "0.10.2",
|
|
67
67
|
"@rive-app/react-webgl2": "^4.29.1",
|
|
68
68
|
"@streamdown/cjk": "^1.0.3",
|
|
69
69
|
"@streamdown/code": "^1.1.1",
|
|
@@ -75,20 +75,24 @@ import { AgentChat } from "@nadicodeai/ui/components/agent-chat";
|
|
|
75
75
|
|
|
76
76
|
## Motion
|
|
77
77
|
|
|
78
|
-
Importing `@nadicodeai/design-system/css` in Required Setup gives you the brand motion contract at the CSS layer: the tokens below plus the four sanctioned moves — **Settle** (entrance, once), **Type** (agent transcript rhythm), **Confirm** (state change, colour arrives with meaning), **Invite** (hover/press) — each honouring `prefers-reduced-motion`.
|
|
78
|
+
Importing `@nadicodeai/design-system/css` in Required Setup gives you the brand motion contract at the CSS layer: the tokens below plus the four sanctioned moves — **Settle** (entrance, once), **Type** (agent transcript rhythm), **Confirm** (state change, colour arrives with meaning), **Invite** (hover/press) — each honouring `prefers-reduced-motion`. Shared Button and overlay primitives use that contract at their public boundary. Audit other package components rather than assuming every older animation already complies.
|
|
79
79
|
|
|
80
80
|
For any motion you add in your app, use the design-system tokens; never invent a `cubic-bezier` or a raw duration:
|
|
81
81
|
|
|
82
|
-
- Durations: `--nc-duration-confirm` (180ms, state feedback), `--nc-duration-open` (220ms) / `--nc-duration-close` (140ms, popover/dialog open vs dismiss), `--nc-duration-
|
|
82
|
+
- Durations: `--nc-duration-confirm` (180ms, state feedback), `--nc-duration-open` (220ms) / `--nc-duration-close` (140ms, popover/dialog open vs dismiss), `--nc-duration-msg-in` (360ms, one-time entrance only). `--nc-duration-reflow` remains defined only as a deprecated 0.10.x compatibility token; it is not adopted for runtime motion and is eligible for removal in a breaking release. Add no timing token without an approved first semantic use.
|
|
83
83
|
- Easings: `--nc-ease-emphasized` (settle), `--nc-ease-out-strong` (feedback/press).
|
|
84
84
|
|
|
85
85
|
Rules for app-authored motion:
|
|
86
86
|
|
|
87
87
|
- **Animate only to carry meaning.** Motion a user meets repeatedly (product UI, keyboard actions) stays minimal — Confirm and Invite only. Save entrances and richer motion for rarely-seen surfaces.
|
|
88
88
|
- **Stay under 300ms** for UI feedback; open deliberate (`--nc-duration-open`) and close snappier (`--nc-duration-close`); popovers scale from their trigger, not screen-centre.
|
|
89
|
-
- **Compositor-only movement:** animate `
|
|
89
|
+
- **Compositor-only movement:** animate individual `translate`/`scale` properties and `opacity` without taking over a consumer's full `transform`; a state change may transition `background-color`/`border-color`/`color` at `--nc-duration-confirm`; never `transition: all` or a layout-shifting property; gate hover behind `(hover: hover) and (pointer: fine)`.
|
|
90
90
|
- **The reduced-motion test:** under `prefers-reduced-motion: reduce` the surface must read identically motionless. If turning motion off changes what the user understands, cut the motion.
|
|
91
|
-
-
|
|
91
|
+
- **NumberFlow is not adopted:** values on repeated money, usage, and KPI surfaces update immediately; no count-up.
|
|
92
|
+
- **AutoAnimate is not adopted:** repeated tables, lists, and queues remain spatially stable; no row reflow choreography.
|
|
93
|
+
- **View Transitions are not adopted:** do not enable experimental Next integration or animate routes/tabs.
|
|
94
|
+
- Rive is confined to an approved versioned asset on a rare onboarding or first-run boundary. No approved asset means no runtime surface.
|
|
95
|
+
- Do not add parallax, scroll-jacking, gradient shimmer, staggered letter reveals, idle loops, or a spinner/pulse for operational state.
|
|
92
96
|
|
|
93
97
|
## Verification
|
|
94
98
|
|