@nucleux/mcp 0.1.0 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +50 -4
- package/dist/index.js +3022 -228
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -8,7 +8,7 @@ import { z } from "zod";
|
|
|
8
8
|
// src/catalog.json
|
|
9
9
|
var catalog_default = {
|
|
10
10
|
library: "@nucleux/react",
|
|
11
|
-
version: "0.
|
|
11
|
+
version: "0.3.0",
|
|
12
12
|
generatedFrom: "packages/* (do not edit \u2014 run scripts/gen-mcp-catalog.mjs)",
|
|
13
13
|
setup: {
|
|
14
14
|
installFull: "pnpm add @nucleux/react @nucleux/tokens",
|
|
@@ -21,8 +21,8 @@ var catalog_default = {
|
|
|
21
21
|
note: "Every component is also re-exported from the @nucleux/react umbrella."
|
|
22
22
|
},
|
|
23
23
|
counts: {
|
|
24
|
-
components:
|
|
25
|
-
packages:
|
|
24
|
+
components: 116,
|
|
25
|
+
packages: 120,
|
|
26
26
|
examples: 6
|
|
27
27
|
},
|
|
28
28
|
packages: [
|
|
@@ -74,6 +74,88 @@ var catalog_default = {
|
|
|
74
74
|
"react-dom": ">=18"
|
|
75
75
|
}
|
|
76
76
|
},
|
|
77
|
+
{
|
|
78
|
+
name: "action-confirmation",
|
|
79
|
+
package: "@nucleux/action-confirmation",
|
|
80
|
+
kind: "component",
|
|
81
|
+
description: 'A guardrail shown before an agent performs a consequential or irreversible\naction \u2014 states the action, its impact, and requires explicit confirmation.\nSource: Figma "Recovery / Verification".',
|
|
82
|
+
summary: "ActionConfirmation \u2014 a guardrail before an agent takes a consequential action \u2014 Nucleux agentic UI for React.",
|
|
83
|
+
keywords: [
|
|
84
|
+
"nucleux",
|
|
85
|
+
"react",
|
|
86
|
+
"ui",
|
|
87
|
+
"components",
|
|
88
|
+
"agentic",
|
|
89
|
+
"ai",
|
|
90
|
+
"tailwind",
|
|
91
|
+
"action-confirmation"
|
|
92
|
+
],
|
|
93
|
+
exports: [
|
|
94
|
+
"ActionConfirmation",
|
|
95
|
+
"ActionConfirmationVariant",
|
|
96
|
+
"ActionConfirmationProps"
|
|
97
|
+
],
|
|
98
|
+
components: [
|
|
99
|
+
"ActionConfirmation"
|
|
100
|
+
],
|
|
101
|
+
import: 'import { ActionConfirmation } from "@nucleux/action-confirmation";',
|
|
102
|
+
installSingle: "pnpm add @nucleux/action-confirmation @nucleux/tokens",
|
|
103
|
+
props: [
|
|
104
|
+
{
|
|
105
|
+
name: "ActionConfirmationProps",
|
|
106
|
+
source: 'export interface ActionConfirmationProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {\n /** The action in question, e.g. `"Send 18 emails?"`. */\n title: React.ReactNode;\n /** What will happen / why it matters. */\n description?: React.ReactNode;\n /** Risk styling. `destructive` for irreversible/high-impact actions. */\n variant?: ActionConfirmationVariant;\n /** Badge text marking this as an agent action. Defaults to `"AI action"`. */\n badge?: React.ReactNode;\n /** Leading icon. Defaults to a warning triangle. */\n icon?: React.ReactNode;\n confirmLabel?: React.ReactNode;\n cancelLabel?: React.ReactNode;\n onConfirm?: () => void;\n onCancel?: () => void;\n}'
|
|
107
|
+
}
|
|
108
|
+
],
|
|
109
|
+
readme: '# @nucleux/action-confirmation\n\nActionConfirmation \u2014 a guardrail before an agent takes a consequential action \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/action-confirmation @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { ActionConfirmation } from "@nucleux/action-confirmation";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
110
|
+
peerDependencies: {
|
|
111
|
+
react: ">=18",
|
|
112
|
+
"react-dom": ">=18"
|
|
113
|
+
}
|
|
114
|
+
},
|
|
115
|
+
{
|
|
116
|
+
name: "action-plan",
|
|
117
|
+
package: "@nucleux/action-plan",
|
|
118
|
+
kind: "component",
|
|
119
|
+
description: "A single step in an {@link ActionPlan}. Numbered automatically by its order.",
|
|
120
|
+
summary: "ActionPlan \u2014 a proposed agent plan the user can accept, edit, or reject \u2014 Nucleux agentic UI for React.",
|
|
121
|
+
keywords: [
|
|
122
|
+
"nucleux",
|
|
123
|
+
"react",
|
|
124
|
+
"ui",
|
|
125
|
+
"components",
|
|
126
|
+
"agentic",
|
|
127
|
+
"ai",
|
|
128
|
+
"tailwind",
|
|
129
|
+
"action-plan"
|
|
130
|
+
],
|
|
131
|
+
exports: [
|
|
132
|
+
"ActionPlanStep",
|
|
133
|
+
"ActionPlan",
|
|
134
|
+
"ActionPlanStepProps",
|
|
135
|
+
"ActionPlanProps"
|
|
136
|
+
],
|
|
137
|
+
components: [
|
|
138
|
+
"ActionPlanStep",
|
|
139
|
+
"ActionPlan"
|
|
140
|
+
],
|
|
141
|
+
import: 'import { ActionPlanStep, ActionPlan } from "@nucleux/action-plan";',
|
|
142
|
+
installSingle: "pnpm add @nucleux/action-plan @nucleux/tokens",
|
|
143
|
+
props: [
|
|
144
|
+
{
|
|
145
|
+
name: "ActionPlanStepProps",
|
|
146
|
+
source: 'export interface ActionPlanStepProps\n extends Omit<React.LiHTMLAttributes<HTMLLIElement>, "title"> {\n /** Step title. */\n title: React.ReactNode;\n /** Supporting detail under the title. */\n description?: React.ReactNode;\n}'
|
|
147
|
+
},
|
|
148
|
+
{
|
|
149
|
+
name: "ActionPlanProps",
|
|
150
|
+
source: 'export interface ActionPlanProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Heading, e.g. `"Proposed plan"`. */\n heading?: React.ReactNode;\n /** Short description of what the agent intends to do. */\n description?: React.ReactNode;\n /** Called when the plan is accepted. Renders the accept button when set. */\n onAccept?: () => void;\n /** Called when the user asks to edit the plan. Renders the edit button when set. */\n onEdit?: () => void;\n /** Called when the plan is rejected. Renders the reject button when set. */\n onReject?: () => void;\n acceptLabel?: React.ReactNode;\n editLabel?: React.ReactNode;\n rejectLabel?: React.ReactNode;\n}'
|
|
151
|
+
}
|
|
152
|
+
],
|
|
153
|
+
readme: '# @nucleux/action-plan\n\nActionPlan \u2014 a proposed agent plan the user can accept, edit, or reject \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/action-plan @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { ActionPlan } from "@nucleux/action-plan";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
154
|
+
peerDependencies: {
|
|
155
|
+
react: ">=18",
|
|
156
|
+
"react-dom": ">=18"
|
|
157
|
+
}
|
|
158
|
+
},
|
|
77
159
|
{
|
|
78
160
|
name: "action-tile",
|
|
79
161
|
package: "@nucleux/action-tile",
|
|
@@ -111,6 +193,50 @@ var catalog_default = {
|
|
|
111
193
|
"react-dom": ">=18"
|
|
112
194
|
}
|
|
113
195
|
},
|
|
196
|
+
{
|
|
197
|
+
name: "activity-log",
|
|
198
|
+
package: "@nucleux/activity-log",
|
|
199
|
+
kind: "component",
|
|
200
|
+
description: "A single entry in an {@link ActivityLog}: an action the agent took, with a timestamp.",
|
|
201
|
+
summary: "ActivityLog \u2014 a timestamped audit trail of the actions an agent took \u2014 Nucleux agentic UI for React.",
|
|
202
|
+
keywords: [
|
|
203
|
+
"nucleux",
|
|
204
|
+
"react",
|
|
205
|
+
"ui",
|
|
206
|
+
"components",
|
|
207
|
+
"agentic",
|
|
208
|
+
"ai",
|
|
209
|
+
"tailwind",
|
|
210
|
+
"activity-log"
|
|
211
|
+
],
|
|
212
|
+
exports: [
|
|
213
|
+
"ActivityLogItem",
|
|
214
|
+
"ActivityLog",
|
|
215
|
+
"ActivityLogItemProps",
|
|
216
|
+
"ActivityLogProps"
|
|
217
|
+
],
|
|
218
|
+
components: [
|
|
219
|
+
"ActivityLogItem",
|
|
220
|
+
"ActivityLog"
|
|
221
|
+
],
|
|
222
|
+
import: 'import { ActivityLogItem, ActivityLog } from "@nucleux/activity-log";',
|
|
223
|
+
installSingle: "pnpm add @nucleux/activity-log @nucleux/tokens",
|
|
224
|
+
props: [
|
|
225
|
+
{
|
|
226
|
+
name: "ActivityLogItemProps",
|
|
227
|
+
source: 'export interface ActivityLogItemProps extends React.LiHTMLAttributes<HTMLLIElement> {\n /** Icon for the action type. Defaults to a generic activity glyph. */\n icon?: React.ReactNode;\n /** Relative or absolute timestamp, e.g. `"2m ago"`. */\n time?: React.ReactNode;\n}'
|
|
228
|
+
},
|
|
229
|
+
{
|
|
230
|
+
name: "ActivityLogProps",
|
|
231
|
+
source: "export interface ActivityLogProps extends React.HTMLAttributes<HTMLOListElement> {\n /** Heading above the trail. */\n heading?: React.ReactNode;\n}"
|
|
232
|
+
}
|
|
233
|
+
],
|
|
234
|
+
readme: '# @nucleux/activity-log\n\nActivityLog \u2014 a timestamped audit trail of the actions an agent took \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/activity-log @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { ActivityLog } from "@nucleux/activity-log";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
235
|
+
peerDependencies: {
|
|
236
|
+
react: ">=18",
|
|
237
|
+
"react-dom": ">=18"
|
|
238
|
+
}
|
|
239
|
+
},
|
|
114
240
|
{
|
|
115
241
|
name: "agent-composer",
|
|
116
242
|
package: "@nucleux/agent-composer",
|
|
@@ -148,6 +274,97 @@ var catalog_default = {
|
|
|
148
274
|
"react-dom": ">=18"
|
|
149
275
|
}
|
|
150
276
|
},
|
|
277
|
+
{
|
|
278
|
+
name: "agent-steps",
|
|
279
|
+
package: "@nucleux/agent-steps",
|
|
280
|
+
kind: "component",
|
|
281
|
+
description: "A single step in an {@link AgentSteps} tracker.",
|
|
282
|
+
summary: "AgentSteps \u2014 a live tracker of an agent's multi-step plan \u2014 Nucleux agentic UI for React.",
|
|
283
|
+
keywords: [
|
|
284
|
+
"nucleux",
|
|
285
|
+
"react",
|
|
286
|
+
"ui",
|
|
287
|
+
"components",
|
|
288
|
+
"agentic",
|
|
289
|
+
"ai",
|
|
290
|
+
"tailwind",
|
|
291
|
+
"agent-steps"
|
|
292
|
+
],
|
|
293
|
+
exports: [
|
|
294
|
+
"AgentStep",
|
|
295
|
+
"AgentSteps",
|
|
296
|
+
"AgentStepStatus",
|
|
297
|
+
"AgentStepProps",
|
|
298
|
+
"AgentStepsProps"
|
|
299
|
+
],
|
|
300
|
+
components: [
|
|
301
|
+
"AgentStep",
|
|
302
|
+
"AgentSteps",
|
|
303
|
+
"AgentStepStatus"
|
|
304
|
+
],
|
|
305
|
+
import: 'import { AgentStep, AgentSteps, AgentStepStatus } from "@nucleux/agent-steps";',
|
|
306
|
+
installSingle: "pnpm add @nucleux/agent-steps @nucleux/tokens",
|
|
307
|
+
props: [
|
|
308
|
+
{
|
|
309
|
+
name: "AgentStepProps",
|
|
310
|
+
source: 'export interface AgentStepProps\n extends Omit<React.LiHTMLAttributes<HTMLLIElement>, "title"> {\n /** Execution status of the step. */\n status?: AgentStepStatus;\n /** Action-type icon (e.g. read, execute, search). Overrides the status glyph. */\n icon?: React.ReactNode;\n /** Step label. */\n title: React.ReactNode;\n /** Supporting detail under the title. */\n description?: React.ReactNode;\n /** Optional progress track, 0\u2013100, shown under the step while active. */\n progress?: number;\n}'
|
|
311
|
+
},
|
|
312
|
+
{
|
|
313
|
+
name: "AgentStepsProps",
|
|
314
|
+
source: "export interface AgentStepsProps extends React.HTMLAttributes<HTMLOListElement> {}"
|
|
315
|
+
}
|
|
316
|
+
],
|
|
317
|
+
readme: '# @nucleux/agent-steps\n\nAgentSteps \u2014 a live tracker of an agent\'s multi-step plan \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/agent-steps @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { AgentSteps } from "@nucleux/agent-steps";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
318
|
+
peerDependencies: {
|
|
319
|
+
react: ">=18",
|
|
320
|
+
"react-dom": ">=18"
|
|
321
|
+
}
|
|
322
|
+
},
|
|
323
|
+
{
|
|
324
|
+
name: "ai-disclosure",
|
|
325
|
+
package: "@nucleux/ai-disclosure",
|
|
326
|
+
kind: "component",
|
|
327
|
+
description: 'A provenance marker that content was authored or assisted by AI \u2014 an\nanti-deception trust signal, as an inline pill, corner badge, or banner.\nSource: Figma "Trust & Disclosure / AI disclosure".',
|
|
328
|
+
summary: "AiDisclosure \u2014 provenance and fallibility markers for AI-generated content \u2014 Nucleux agentic UI for React.",
|
|
329
|
+
keywords: [
|
|
330
|
+
"nucleux",
|
|
331
|
+
"react",
|
|
332
|
+
"ui",
|
|
333
|
+
"components",
|
|
334
|
+
"agentic",
|
|
335
|
+
"ai",
|
|
336
|
+
"tailwind",
|
|
337
|
+
"ai-disclosure"
|
|
338
|
+
],
|
|
339
|
+
exports: [
|
|
340
|
+
"AiDisclosure",
|
|
341
|
+
"AiCaveat",
|
|
342
|
+
"AiDisclosureVariant",
|
|
343
|
+
"AiDisclosureProps",
|
|
344
|
+
"AiCaveatProps"
|
|
345
|
+
],
|
|
346
|
+
components: [
|
|
347
|
+
"AiDisclosure",
|
|
348
|
+
"AiCaveat"
|
|
349
|
+
],
|
|
350
|
+
import: 'import { AiDisclosure, AiCaveat } from "@nucleux/ai-disclosure";',
|
|
351
|
+
installSingle: "pnpm add @nucleux/ai-disclosure @nucleux/tokens",
|
|
352
|
+
props: [
|
|
353
|
+
{
|
|
354
|
+
name: "AiDisclosureProps",
|
|
355
|
+
source: "export interface AiDisclosureProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Presentation: inline `pill`, corner `badge`, or full-width `banner`. */\n variant?: AiDisclosureVariant;\n /** Leading icon. Defaults to a sparkle. */\n icon?: React.ReactNode;\n /** Label / message. Ignored if `children` is provided. Has a per-variant default. */\n label?: React.ReactNode;\n}"
|
|
356
|
+
},
|
|
357
|
+
{
|
|
358
|
+
name: "AiCaveatProps",
|
|
359
|
+
source: "export interface AiCaveatProps extends React.HTMLAttributes<HTMLParagraphElement> {\n /** Leading icon. Defaults to an info glyph. Pass `null` to omit. */\n icon?: React.ReactNode;\n}"
|
|
360
|
+
}
|
|
361
|
+
],
|
|
362
|
+
readme: '# @nucleux/ai-disclosure\n\nAiDisclosure \u2014 provenance and fallibility markers for AI-generated content \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/ai-disclosure @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { AiDisclosure } from "@nucleux/ai-disclosure";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
363
|
+
peerDependencies: {
|
|
364
|
+
react: ">=18",
|
|
365
|
+
"react-dom": ">=18"
|
|
366
|
+
}
|
|
367
|
+
},
|
|
151
368
|
{
|
|
152
369
|
name: "alert",
|
|
153
370
|
package: "@nucleux/alert",
|
|
@@ -186,6 +403,161 @@ var catalog_default = {
|
|
|
186
403
|
"react-dom": ">=18"
|
|
187
404
|
}
|
|
188
405
|
},
|
|
406
|
+
{
|
|
407
|
+
name: "alert-dialog",
|
|
408
|
+
package: "@nucleux/alert-dialog",
|
|
409
|
+
kind: "component",
|
|
410
|
+
description: 'A modal confirmation dialog for consequential actions. Unlike Dialog, it uses\nrole="alertdialog", does not close on overlay click, and focuses Cancel by\ndefault. Escape triggers cancel.',
|
|
411
|
+
summary: "Modal confirmation dialog \u2014 Nucleux agentic UI for React.",
|
|
412
|
+
keywords: [
|
|
413
|
+
"nucleux",
|
|
414
|
+
"react",
|
|
415
|
+
"ui",
|
|
416
|
+
"components",
|
|
417
|
+
"agentic",
|
|
418
|
+
"ai",
|
|
419
|
+
"tailwind",
|
|
420
|
+
"alert-dialog"
|
|
421
|
+
],
|
|
422
|
+
exports: [
|
|
423
|
+
"AlertDialog",
|
|
424
|
+
"AlertDialogProps"
|
|
425
|
+
],
|
|
426
|
+
components: [
|
|
427
|
+
"AlertDialog"
|
|
428
|
+
],
|
|
429
|
+
import: 'import { AlertDialog } from "@nucleux/alert-dialog";',
|
|
430
|
+
installSingle: "pnpm add @nucleux/alert-dialog @nucleux/tokens",
|
|
431
|
+
props: [
|
|
432
|
+
{
|
|
433
|
+
name: "AlertDialogProps",
|
|
434
|
+
source: "export interface AlertDialogProps {\n /** Whether the alert dialog is open. */\n open: boolean;\n /** Called when the dialog requests to close (Escape / a button). */\n onOpenChange: (open: boolean) => void;\n title: React.ReactNode;\n description?: React.ReactNode;\n /** Confirm button label. */\n confirmLabel?: string;\n /** Cancel button label. */\n cancelLabel?: string;\n onConfirm?: () => void;\n onCancel?: () => void;\n /** Style the confirm action as destructive. */\n destructive?: boolean;\n /** Extra content between the description and the actions. */\n children?: React.ReactNode;\n className?: string;\n}"
|
|
435
|
+
}
|
|
436
|
+
],
|
|
437
|
+
readme: '# @nucleux/alert-dialog\n\nModal confirmation dialog \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/alert-dialog @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { AlertDialog } from "@nucleux/alert-dialog";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
438
|
+
peerDependencies: {
|
|
439
|
+
react: ">=18",
|
|
440
|
+
"react-dom": ">=18"
|
|
441
|
+
}
|
|
442
|
+
},
|
|
443
|
+
{
|
|
444
|
+
name: "aspect-ratio",
|
|
445
|
+
package: "@nucleux/aspect-ratio",
|
|
446
|
+
kind: "component",
|
|
447
|
+
description: "Constrains its children to a fixed width-to-height ratio.",
|
|
448
|
+
summary: "Fixed aspect-ratio box \u2014 Nucleux agentic UI for React.",
|
|
449
|
+
keywords: [
|
|
450
|
+
"nucleux",
|
|
451
|
+
"react",
|
|
452
|
+
"ui",
|
|
453
|
+
"components",
|
|
454
|
+
"agentic",
|
|
455
|
+
"ai",
|
|
456
|
+
"tailwind",
|
|
457
|
+
"aspect-ratio"
|
|
458
|
+
],
|
|
459
|
+
exports: [
|
|
460
|
+
"AspectRatio",
|
|
461
|
+
"AspectRatioProps"
|
|
462
|
+
],
|
|
463
|
+
components: [
|
|
464
|
+
"AspectRatio"
|
|
465
|
+
],
|
|
466
|
+
import: 'import { AspectRatio } from "@nucleux/aspect-ratio";',
|
|
467
|
+
installSingle: "pnpm add @nucleux/aspect-ratio @nucleux/tokens",
|
|
468
|
+
props: [
|
|
469
|
+
{
|
|
470
|
+
name: "AspectRatioProps",
|
|
471
|
+
source: "export interface AspectRatioProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Width / height ratio (e.g. 16/9). Defaults to 1 (square). */\n ratio?: number;\n}"
|
|
472
|
+
}
|
|
473
|
+
],
|
|
474
|
+
readme: '# @nucleux/aspect-ratio\n\nFixed aspect-ratio box \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/aspect-ratio @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { AspectRatio } from "@nucleux/aspect-ratio";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
475
|
+
peerDependencies: {
|
|
476
|
+
react: ">=18",
|
|
477
|
+
"react-dom": ">=18"
|
|
478
|
+
}
|
|
479
|
+
},
|
|
480
|
+
{
|
|
481
|
+
name: "attachment-tile",
|
|
482
|
+
package: "@nucleux/attachment-tile",
|
|
483
|
+
kind: "component",
|
|
484
|
+
description: 'A removable preview of a file or image attached as context to an agent turn \u2014\ndocument chip or image thumbnail. The multimodal-context affordance.\nSource: Figma "Context Expansion / File Attachment".',
|
|
485
|
+
summary: "AttachmentTile \u2014 removable file and image context tiles for the composer \u2014 Nucleux agentic UI for React.",
|
|
486
|
+
keywords: [
|
|
487
|
+
"nucleux",
|
|
488
|
+
"react",
|
|
489
|
+
"ui",
|
|
490
|
+
"components",
|
|
491
|
+
"agentic",
|
|
492
|
+
"ai",
|
|
493
|
+
"tailwind",
|
|
494
|
+
"attachment-tile"
|
|
495
|
+
],
|
|
496
|
+
exports: [
|
|
497
|
+
"AttachmentTile",
|
|
498
|
+
"AttachmentTray",
|
|
499
|
+
"AttachmentTileProps",
|
|
500
|
+
"AttachmentTrayProps"
|
|
501
|
+
],
|
|
502
|
+
components: [
|
|
503
|
+
"AttachmentTile",
|
|
504
|
+
"AttachmentTray"
|
|
505
|
+
],
|
|
506
|
+
import: 'import { AttachmentTile, AttachmentTray } from "@nucleux/attachment-tile";',
|
|
507
|
+
installSingle: "pnpm add @nucleux/attachment-tile @nucleux/tokens",
|
|
508
|
+
props: [
|
|
509
|
+
{
|
|
510
|
+
name: "AttachmentTileProps",
|
|
511
|
+
source: 'export interface AttachmentTileProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {\n /** File or attachment name. */\n name: React.ReactNode;\n /** Metadata line, e.g. `"PDF \xB7 240 KB"`. */\n meta?: React.ReactNode;\n /** Image URL \u2014 renders a thumbnail tile instead of a document chip. */\n thumbnail?: string;\n /** Doctype icon for the document chip. Defaults to a document glyph. */\n icon?: React.ReactNode;\n /** Called when the remove control is used. Hidden if omitted. */\n onRemove?: () => void;\n}'
|
|
512
|
+
},
|
|
513
|
+
{
|
|
514
|
+
name: "AttachmentTrayProps",
|
|
515
|
+
source: "export interface AttachmentTrayProps extends React.HTMLAttributes<HTMLDivElement> {}"
|
|
516
|
+
}
|
|
517
|
+
],
|
|
518
|
+
readme: '# @nucleux/attachment-tile\n\nAttachmentTile \u2014 removable file and image context tiles for the composer \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/attachment-tile @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { AttachmentTile } from "@nucleux/attachment-tile";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
519
|
+
peerDependencies: {
|
|
520
|
+
react: ">=18",
|
|
521
|
+
"react-dom": ">=18"
|
|
522
|
+
}
|
|
523
|
+
},
|
|
524
|
+
{
|
|
525
|
+
name: "audio-message",
|
|
526
|
+
package: "@nucleux/audio-message",
|
|
527
|
+
kind: "component",
|
|
528
|
+
description: 'A player for AI-generated spoken output \u2014 play/pause, a waveform, duration,\nand an optional transcript.\nSource: Figma "Output & Processing / Audio player output".',
|
|
529
|
+
summary: "AudioMessage \u2014 a player for AI-generated voice output \u2014 Nucleux agentic UI for React.",
|
|
530
|
+
keywords: [
|
|
531
|
+
"nucleux",
|
|
532
|
+
"react",
|
|
533
|
+
"ui",
|
|
534
|
+
"components",
|
|
535
|
+
"agentic",
|
|
536
|
+
"ai",
|
|
537
|
+
"tailwind",
|
|
538
|
+
"audio-message"
|
|
539
|
+
],
|
|
540
|
+
exports: [
|
|
541
|
+
"AudioMessage",
|
|
542
|
+
"AudioMessageProps"
|
|
543
|
+
],
|
|
544
|
+
components: [
|
|
545
|
+
"AudioMessage"
|
|
546
|
+
],
|
|
547
|
+
import: 'import { AudioMessage } from "@nucleux/audio-message";',
|
|
548
|
+
installSingle: "pnpm add @nucleux/audio-message @nucleux/tokens",
|
|
549
|
+
props: [
|
|
550
|
+
{
|
|
551
|
+
name: "AudioMessageProps",
|
|
552
|
+
source: 'export interface AudioMessageProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Whether audio is currently playing (controls the play/pause glyph + animation). */\n playing?: boolean;\n /** Duration or elapsed label, e.g. `"0:42"`. */\n duration?: React.ReactNode;\n /** Transcript excerpt shown below the player. */\n transcript?: React.ReactNode;\n /** Called when the play/pause control is used. */\n onPlayToggle?: () => void;\n}'
|
|
553
|
+
}
|
|
554
|
+
],
|
|
555
|
+
readme: '# @nucleux/audio-message\n\nAudioMessage \u2014 a player for AI-generated voice output \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/audio-message @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { AudioMessage } from "@nucleux/audio-message";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
556
|
+
peerDependencies: {
|
|
557
|
+
react: ">=18",
|
|
558
|
+
"react-dom": ">=18"
|
|
559
|
+
}
|
|
560
|
+
},
|
|
189
561
|
{
|
|
190
562
|
name: "avatar",
|
|
191
563
|
package: "@nucleux/avatar",
|
|
@@ -314,38 +686,1572 @@ var catalog_default = {
|
|
|
314
686
|
"agentic",
|
|
315
687
|
"ai",
|
|
316
688
|
"tailwind",
|
|
317
|
-
"button"
|
|
689
|
+
"button"
|
|
690
|
+
],
|
|
691
|
+
exports: [
|
|
692
|
+
"Button",
|
|
693
|
+
"ButtonVariant",
|
|
694
|
+
"ButtonSize",
|
|
695
|
+
"ButtonProps"
|
|
696
|
+
],
|
|
697
|
+
components: [
|
|
698
|
+
"Button",
|
|
699
|
+
"ButtonSize"
|
|
700
|
+
],
|
|
701
|
+
import: 'import { Button, ButtonSize } from "@nucleux/button";',
|
|
702
|
+
installSingle: "pnpm add @nucleux/button @nucleux/tokens",
|
|
703
|
+
props: [
|
|
704
|
+
{
|
|
705
|
+
name: "ButtonProps",
|
|
706
|
+
source: "export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n variant?: ButtonVariant;\n size?: ButtonSize;\n /** Icon rendered before the label. */\n leftIcon?: React.ReactNode;\n /** Icon rendered after the label. */\n rightIcon?: React.ReactNode;\n}"
|
|
707
|
+
}
|
|
708
|
+
],
|
|
709
|
+
readme: '# @nucleux/button\n\nButton \u2014 variants, sizes, and icons \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/button @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Button } from "@nucleux/button";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
710
|
+
peerDependencies: {
|
|
711
|
+
react: ">=18",
|
|
712
|
+
"react-dom": ">=18"
|
|
713
|
+
}
|
|
714
|
+
},
|
|
715
|
+
{
|
|
716
|
+
name: "calendar",
|
|
717
|
+
package: "@nucleux/calendar",
|
|
718
|
+
kind: "component",
|
|
719
|
+
description: "A month calendar / date grid built on react-day-picker, restyled with Nucleux\ntokens. Supports single, multiple, and range selection via the `mode` prop.",
|
|
720
|
+
summary: "Month calendar / date grid \u2014 Nucleux agentic UI for React.",
|
|
721
|
+
keywords: [
|
|
722
|
+
"nucleux",
|
|
723
|
+
"react",
|
|
724
|
+
"ui",
|
|
725
|
+
"components",
|
|
726
|
+
"agentic",
|
|
727
|
+
"ai",
|
|
728
|
+
"tailwind",
|
|
729
|
+
"calendar"
|
|
730
|
+
],
|
|
731
|
+
exports: [
|
|
732
|
+
"Calendar",
|
|
733
|
+
"CalendarProps"
|
|
734
|
+
],
|
|
735
|
+
components: [
|
|
736
|
+
"Calendar"
|
|
737
|
+
],
|
|
738
|
+
import: 'import { Calendar } from "@nucleux/calendar";',
|
|
739
|
+
installSingle: "pnpm add @nucleux/calendar @nucleux/tokens",
|
|
740
|
+
props: [],
|
|
741
|
+
readme: '# @nucleux/calendar\n\nMonth calendar / date grid \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/calendar @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Calendar } from "@nucleux/calendar";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
742
|
+
peerDependencies: {
|
|
743
|
+
react: ">=18",
|
|
744
|
+
"react-dom": ">=18"
|
|
745
|
+
}
|
|
746
|
+
},
|
|
747
|
+
{
|
|
748
|
+
name: "capability-overview",
|
|
749
|
+
package: "@nucleux/capability-overview",
|
|
750
|
+
kind: "component",
|
|
751
|
+
description: 'A first-run card that sets expectations for an agent \u2014 what it can do, and\nwhere it falls short \u2014 as Examples / Capabilities / Limits columns.\nSource: Figma "Onboarding / Generic Assistant Overview".',
|
|
752
|
+
summary: "CapabilityOverview \u2014 an agent's examples, capabilities, and limits \u2014 Nucleux agentic UI for React.",
|
|
753
|
+
keywords: [
|
|
754
|
+
"nucleux",
|
|
755
|
+
"react",
|
|
756
|
+
"ui",
|
|
757
|
+
"components",
|
|
758
|
+
"agentic",
|
|
759
|
+
"ai",
|
|
760
|
+
"tailwind",
|
|
761
|
+
"capability-overview"
|
|
762
|
+
],
|
|
763
|
+
exports: [
|
|
764
|
+
"CapabilityOverview",
|
|
765
|
+
"CapabilitySection",
|
|
766
|
+
"CapabilityOverviewProps"
|
|
767
|
+
],
|
|
768
|
+
components: [
|
|
769
|
+
"CapabilityOverview",
|
|
770
|
+
"CapabilitySection"
|
|
771
|
+
],
|
|
772
|
+
import: 'import { CapabilityOverview, CapabilitySection } from "@nucleux/capability-overview";',
|
|
773
|
+
installSingle: "pnpm add @nucleux/capability-overview @nucleux/tokens",
|
|
774
|
+
props: [
|
|
775
|
+
{
|
|
776
|
+
name: "CapabilityOverviewProps",
|
|
777
|
+
source: "export interface CapabilityOverviewProps extends React.HTMLAttributes<HTMLDivElement> {\n /** The columns to show \u2014 typically Examples / Capabilities / Limits. */\n sections: CapabilitySection[];\n /** Heading above the columns. */\n heading?: React.ReactNode;\n /** Footnote, e.g. a knowledge-cutoff note. */\n footnote?: React.ReactNode;\n}"
|
|
778
|
+
}
|
|
779
|
+
],
|
|
780
|
+
readme: '# @nucleux/capability-overview\n\nCapabilityOverview \u2014 an agent\'s examples, capabilities, and limits \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/capability-overview @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { CapabilityOverview } from "@nucleux/capability-overview";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
781
|
+
peerDependencies: {
|
|
782
|
+
react: ">=18",
|
|
783
|
+
"react-dom": ">=18"
|
|
784
|
+
}
|
|
785
|
+
},
|
|
786
|
+
{
|
|
787
|
+
name: "card",
|
|
788
|
+
package: "@nucleux/card",
|
|
789
|
+
kind: "component",
|
|
790
|
+
description: "Card header. Lays children out in a row with space-between by default.",
|
|
791
|
+
summary: "Composable card surface (CardContainer + parts) \u2014 Nucleux agentic UI for React.",
|
|
792
|
+
keywords: [
|
|
793
|
+
"nucleux",
|
|
794
|
+
"react",
|
|
795
|
+
"ui",
|
|
796
|
+
"components",
|
|
797
|
+
"agentic",
|
|
798
|
+
"ai",
|
|
799
|
+
"tailwind",
|
|
800
|
+
"card"
|
|
801
|
+
],
|
|
802
|
+
exports: [
|
|
803
|
+
"CardContainer",
|
|
804
|
+
"CardHeader",
|
|
805
|
+
"CardTitle",
|
|
806
|
+
"CardDescription",
|
|
807
|
+
"CardAction",
|
|
808
|
+
"CardContent",
|
|
809
|
+
"CardDivider",
|
|
810
|
+
"CardContainerProps"
|
|
811
|
+
],
|
|
812
|
+
components: [
|
|
813
|
+
"CardContainer",
|
|
814
|
+
"CardHeader",
|
|
815
|
+
"CardTitle",
|
|
816
|
+
"CardDescription",
|
|
817
|
+
"CardAction",
|
|
818
|
+
"CardContent",
|
|
819
|
+
"CardDivider"
|
|
820
|
+
],
|
|
821
|
+
import: 'import { CardContainer, CardHeader, CardTitle, CardDescription } from "@nucleux/card";',
|
|
822
|
+
installSingle: "pnpm add @nucleux/card @nucleux/tokens",
|
|
823
|
+
props: [
|
|
824
|
+
{
|
|
825
|
+
name: "CardContainerProps",
|
|
826
|
+
source: "/**\n * Composable card surface. Compose the parts to match the design:\n *\n * ```tsx\n * <CardContainer>\n * <CardHeader>\n * <div>\n * <CardTitle>Recent meeting</CardTitle>\n * <CardDescription>1 in your library</CardDescription>\n * </div>\n * <CardAction>View all</CardAction>\n * </CardHeader>\n * <CardDivider />\n * <CardContent>\u2026</CardContent>\n * </CardContainer>\n * ```\n *\n * Named `CardContainer` to mirror the canonical Figma component.\n */\nexport interface CardContainerProps extends React.HTMLAttributes<HTMLDivElement> {}"
|
|
827
|
+
}
|
|
828
|
+
],
|
|
829
|
+
readme: '# @nucleux/card\n\nComposable card surface (CardContainer + parts) \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/card @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { CardContainer, CardHeader, CardTitle, CardDescription, CardAction, CardContent } from "@nucleux/card";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
830
|
+
peerDependencies: {
|
|
831
|
+
react: ">=18",
|
|
832
|
+
"react-dom": ">=18"
|
|
833
|
+
}
|
|
834
|
+
},
|
|
835
|
+
{
|
|
836
|
+
name: "carousel",
|
|
837
|
+
package: "@nucleux/carousel",
|
|
838
|
+
kind: "component",
|
|
839
|
+
description: "A swipeable/keyboard-navigable carousel built on Embla.",
|
|
840
|
+
summary: "Swipeable content carousel \u2014 Nucleux agentic UI for React.",
|
|
841
|
+
keywords: [
|
|
842
|
+
"nucleux",
|
|
843
|
+
"react",
|
|
844
|
+
"ui",
|
|
845
|
+
"components",
|
|
846
|
+
"agentic",
|
|
847
|
+
"ai",
|
|
848
|
+
"tailwind",
|
|
849
|
+
"carousel"
|
|
850
|
+
],
|
|
851
|
+
exports: [
|
|
852
|
+
"Carousel",
|
|
853
|
+
"CarouselContent",
|
|
854
|
+
"CarouselItem",
|
|
855
|
+
"CarouselPrevious",
|
|
856
|
+
"CarouselNext",
|
|
857
|
+
"CarouselProps",
|
|
858
|
+
"CarouselContentProps",
|
|
859
|
+
"CarouselItemProps"
|
|
860
|
+
],
|
|
861
|
+
components: [
|
|
862
|
+
"Carousel",
|
|
863
|
+
"CarouselContent",
|
|
864
|
+
"CarouselItem",
|
|
865
|
+
"CarouselPrevious",
|
|
866
|
+
"CarouselNext"
|
|
867
|
+
],
|
|
868
|
+
import: 'import { Carousel, CarouselContent, CarouselItem, CarouselPrevious } from "@nucleux/carousel";',
|
|
869
|
+
installSingle: "pnpm add @nucleux/carousel @nucleux/tokens",
|
|
870
|
+
props: [
|
|
871
|
+
{
|
|
872
|
+
name: "CarouselProps",
|
|
873
|
+
source: "export interface CarouselProps extends React.HTMLAttributes<HTMLDivElement> {\n orientation?: Orientation;\n opts?: EmblaOptionsType;\n /** Receive the Embla API instance once ready. */\n setApi?: (api: EmblaCarouselType | undefined) => void;\n}"
|
|
874
|
+
}
|
|
875
|
+
],
|
|
876
|
+
readme: '# @nucleux/carousel\n\nSwipeable content carousel \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/carousel @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Carousel } from "@nucleux/carousel";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
877
|
+
peerDependencies: {
|
|
878
|
+
react: ">=18",
|
|
879
|
+
"react-dom": ">=18"
|
|
880
|
+
}
|
|
881
|
+
},
|
|
882
|
+
{
|
|
883
|
+
name: "chart",
|
|
884
|
+
package: "@nucleux/chart",
|
|
885
|
+
kind: "component",
|
|
886
|
+
description: "Re-exported recharts Tooltip \u2014 pair with {@link ChartTooltipContent}.",
|
|
887
|
+
summary: "Composable chart primitives \u2014 Nucleux agentic UI for React.",
|
|
888
|
+
keywords: [
|
|
889
|
+
"nucleux",
|
|
890
|
+
"react",
|
|
891
|
+
"ui",
|
|
892
|
+
"components",
|
|
893
|
+
"agentic",
|
|
894
|
+
"ai",
|
|
895
|
+
"tailwind",
|
|
896
|
+
"chart"
|
|
897
|
+
],
|
|
898
|
+
exports: [
|
|
899
|
+
"ChartTooltip",
|
|
900
|
+
"ChartLegend",
|
|
901
|
+
"ChartContainer",
|
|
902
|
+
"ChartTooltipContent",
|
|
903
|
+
"ChartLegendContent",
|
|
904
|
+
"ChartSeriesConfig",
|
|
905
|
+
"ChartConfig",
|
|
906
|
+
"ChartContainerProps",
|
|
907
|
+
"ChartTooltipContentProps",
|
|
908
|
+
"ChartLegendContentProps"
|
|
909
|
+
],
|
|
910
|
+
components: [
|
|
911
|
+
"ChartTooltip",
|
|
912
|
+
"ChartLegend",
|
|
913
|
+
"ChartContainer",
|
|
914
|
+
"ChartTooltipContent",
|
|
915
|
+
"ChartLegendContent",
|
|
916
|
+
"ChartSeriesConfig",
|
|
917
|
+
"ChartConfig"
|
|
918
|
+
],
|
|
919
|
+
import: 'import { ChartTooltip, ChartLegend, ChartContainer, ChartTooltipContent } from "@nucleux/chart";',
|
|
920
|
+
installSingle: "pnpm add @nucleux/chart @nucleux/tokens",
|
|
921
|
+
props: [
|
|
922
|
+
{
|
|
923
|
+
name: "ChartContainerProps",
|
|
924
|
+
source: "export interface ChartContainerProps extends React.HTMLAttributes<HTMLDivElement> {\n config: ChartConfig;\n /** A single recharts chart element (BarChart, LineChart, \u2026). */\n children: React.ReactElement;\n}"
|
|
925
|
+
},
|
|
926
|
+
{
|
|
927
|
+
name: "ChartTooltipContentProps",
|
|
928
|
+
source: "export interface ChartTooltipContentProps {\n active?: boolean;\n payload?: TooltipPayloadItem[];\n label?: React.ReactNode;\n config?: ChartConfig;\n}"
|
|
929
|
+
},
|
|
930
|
+
{
|
|
931
|
+
name: "ChartLegendContentProps",
|
|
932
|
+
source: "export interface ChartLegendContentProps {\n payload?: LegendPayloadItem[];\n config?: ChartConfig;\n}"
|
|
933
|
+
}
|
|
934
|
+
],
|
|
935
|
+
readme: '# @nucleux/chart\n\nComposable chart primitives \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/chart @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Chart } from "@nucleux/chart";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
936
|
+
peerDependencies: {
|
|
937
|
+
react: ">=18",
|
|
938
|
+
"react-dom": ">=18"
|
|
939
|
+
}
|
|
940
|
+
},
|
|
941
|
+
{
|
|
942
|
+
name: "checkbox",
|
|
943
|
+
package: "@nucleux/checkbox",
|
|
944
|
+
kind: "component",
|
|
945
|
+
description: "Accessible checkbox (role=checkbox). Controlled via `checked` or uncontrolled.",
|
|
946
|
+
summary: "Accessible checkbox \u2014 Nucleux agentic UI for React.",
|
|
947
|
+
keywords: [
|
|
948
|
+
"nucleux",
|
|
949
|
+
"react",
|
|
950
|
+
"ui",
|
|
951
|
+
"components",
|
|
952
|
+
"agentic",
|
|
953
|
+
"ai",
|
|
954
|
+
"tailwind",
|
|
955
|
+
"checkbox"
|
|
956
|
+
],
|
|
957
|
+
exports: [
|
|
958
|
+
"Checkbox",
|
|
959
|
+
"CheckboxProps"
|
|
960
|
+
],
|
|
961
|
+
components: [
|
|
962
|
+
"Checkbox"
|
|
963
|
+
],
|
|
964
|
+
import: 'import { Checkbox } from "@nucleux/checkbox";',
|
|
965
|
+
installSingle: "pnpm add @nucleux/checkbox @nucleux/tokens",
|
|
966
|
+
props: [
|
|
967
|
+
{
|
|
968
|
+
name: "CheckboxProps",
|
|
969
|
+
source: 'export interface CheckboxProps\n extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onChange" | "value" | "type"> {\n /** Controlled checked state. */\n checked?: boolean;\n /** Initial state when uncontrolled. */\n defaultChecked?: boolean;\n /** Called with the next checked state. */\n onCheckedChange?: (checked: boolean) => void;\n}'
|
|
970
|
+
}
|
|
971
|
+
],
|
|
972
|
+
readme: '# @nucleux/checkbox\n\nAccessible checkbox \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/checkbox @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Checkbox } from "@nucleux/checkbox";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
973
|
+
peerDependencies: {
|
|
974
|
+
react: ">=18",
|
|
975
|
+
"react-dom": ">=18"
|
|
976
|
+
}
|
|
977
|
+
},
|
|
978
|
+
{
|
|
979
|
+
name: "checklist",
|
|
980
|
+
package: "@nucleux/checklist",
|
|
981
|
+
kind: "component",
|
|
982
|
+
description: "A single step in a {@link Checklist}.",
|
|
983
|
+
summary: "Onboarding / progress checklist \u2014 Nucleux agentic UI for React.",
|
|
984
|
+
keywords: [
|
|
985
|
+
"nucleux",
|
|
986
|
+
"react",
|
|
987
|
+
"ui",
|
|
988
|
+
"components",
|
|
989
|
+
"agentic",
|
|
990
|
+
"ai",
|
|
991
|
+
"tailwind",
|
|
992
|
+
"checklist"
|
|
993
|
+
],
|
|
994
|
+
exports: [
|
|
995
|
+
"ChecklistItem",
|
|
996
|
+
"Checklist",
|
|
997
|
+
"ChecklistItemProps",
|
|
998
|
+
"ChecklistProps"
|
|
999
|
+
],
|
|
1000
|
+
components: [
|
|
1001
|
+
"ChecklistItem",
|
|
1002
|
+
"Checklist"
|
|
1003
|
+
],
|
|
1004
|
+
import: 'import { ChecklistItem, Checklist } from "@nucleux/checklist";',
|
|
1005
|
+
installSingle: "pnpm add @nucleux/checklist @nucleux/tokens",
|
|
1006
|
+
props: [
|
|
1007
|
+
{
|
|
1008
|
+
name: "ChecklistItemProps",
|
|
1009
|
+
source: 'export interface ChecklistItemProps extends Omit<React.LiHTMLAttributes<HTMLLIElement>, "title"> {\n /** Whether the step is completed (shows a filled check + strikes the title). */\n done?: boolean;\n /** Step title. */\n title: React.ReactNode;\n /** Supporting description. */\n description?: React.ReactNode;\n /** Trailing action, e.g. a <Button>Connect</Button>. */\n action?: React.ReactNode;\n}'
|
|
1010
|
+
},
|
|
1011
|
+
{
|
|
1012
|
+
name: "ChecklistProps",
|
|
1013
|
+
source: "export interface ChecklistProps extends React.HTMLAttributes<HTMLUListElement> {\n /** Show hairline dividers between items. */\n divided?: boolean;\n}"
|
|
1014
|
+
}
|
|
1015
|
+
],
|
|
1016
|
+
readme: '# @nucleux/checklist\n\nOnboarding / progress checklist \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/checklist @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { ChecklistItem, Checklist } from "@nucleux/checklist";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1017
|
+
peerDependencies: {
|
|
1018
|
+
react: ">=18",
|
|
1019
|
+
"react-dom": ">=18"
|
|
1020
|
+
}
|
|
1021
|
+
},
|
|
1022
|
+
{
|
|
1023
|
+
name: "chip",
|
|
1024
|
+
package: "@nucleux/chip",
|
|
1025
|
+
kind: "component",
|
|
1026
|
+
description: "A small rounded tag/pill with an optional status dot and removable affordance.\nLighter-weight than {@link Badge} \u2014 use for filters, tokens, and inline tags.",
|
|
1027
|
+
summary: "Small rounded tag with optional dot and remove \u2014 Nucleux agentic UI for React.",
|
|
1028
|
+
keywords: [
|
|
1029
|
+
"nucleux",
|
|
1030
|
+
"react",
|
|
1031
|
+
"ui",
|
|
1032
|
+
"components",
|
|
1033
|
+
"agentic",
|
|
1034
|
+
"ai",
|
|
1035
|
+
"tailwind",
|
|
1036
|
+
"chip"
|
|
1037
|
+
],
|
|
1038
|
+
exports: [
|
|
1039
|
+
"Chip",
|
|
1040
|
+
"ChipProps"
|
|
1041
|
+
],
|
|
1042
|
+
components: [
|
|
1043
|
+
"Chip"
|
|
1044
|
+
],
|
|
1045
|
+
import: 'import { Chip } from "@nucleux/chip";',
|
|
1046
|
+
installSingle: "pnpm add @nucleux/chip @nucleux/tokens",
|
|
1047
|
+
props: [
|
|
1048
|
+
{
|
|
1049
|
+
name: "ChipProps",
|
|
1050
|
+
source: 'export interface ChipProps extends React.HTMLAttributes<HTMLSpanElement> {\n /** Show a leading status dot. Pass a className to color it (e.g. "bg-success"). */\n dot?: boolean;\n /** Tailwind classes controlling the dot color (defaults to muted). */\n dotClassName?: string;\n /** When provided, renders a trailing remove button that calls this handler. */\n onRemove?: () => void;\n /** Accessible label for the remove button. */\n removeLabel?: string;\n}'
|
|
1051
|
+
}
|
|
1052
|
+
],
|
|
1053
|
+
readme: '# @nucleux/chip\n\nSmall rounded tag with optional dot and remove \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/chip @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Chip } from "@nucleux/chip";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1054
|
+
peerDependencies: {
|
|
1055
|
+
react: ">=18",
|
|
1056
|
+
"react-dom": ">=18"
|
|
1057
|
+
}
|
|
1058
|
+
},
|
|
1059
|
+
{
|
|
1060
|
+
name: "citation",
|
|
1061
|
+
package: "@nucleux/citation",
|
|
1062
|
+
kind: "component",
|
|
1063
|
+
description: 'An inline citation chip embedded in an AI answer \u2014 a compact numbered or\ndomain marker that attributes a claim to a source.\nSource: Figma "Explainability / Inline source chip".',
|
|
1064
|
+
summary: "Citation \u2014 inline source chips and a grounded sources list for AI answers \u2014 Nucleux agentic UI for React.",
|
|
1065
|
+
keywords: [
|
|
1066
|
+
"nucleux",
|
|
1067
|
+
"react",
|
|
1068
|
+
"ui",
|
|
1069
|
+
"components",
|
|
1070
|
+
"agentic",
|
|
1071
|
+
"ai",
|
|
1072
|
+
"tailwind",
|
|
1073
|
+
"citation"
|
|
1074
|
+
],
|
|
1075
|
+
exports: [
|
|
1076
|
+
"Citation",
|
|
1077
|
+
"SourceItem",
|
|
1078
|
+
"SourceList",
|
|
1079
|
+
"CitationProps",
|
|
1080
|
+
"SourceItemProps",
|
|
1081
|
+
"SourceListProps"
|
|
1082
|
+
],
|
|
1083
|
+
components: [
|
|
1084
|
+
"Citation",
|
|
1085
|
+
"SourceItem",
|
|
1086
|
+
"SourceList"
|
|
1087
|
+
],
|
|
1088
|
+
import: 'import { Citation, SourceItem, SourceList } from "@nucleux/citation";',
|
|
1089
|
+
installSingle: "pnpm add @nucleux/citation @nucleux/tokens",
|
|
1090
|
+
props: [
|
|
1091
|
+
{
|
|
1092
|
+
name: "CitationProps",
|
|
1093
|
+
source: 'export interface CitationProps\n extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "title"> {\n /** Source index shown in the chip, e.g. `4`. Ignored if `children` is given. */\n index?: number;\n /** Text label instead of a number, e.g. `"wikipedia.com"`. */\n label?: React.ReactNode;\n}'
|
|
1094
|
+
},
|
|
1095
|
+
{
|
|
1096
|
+
name: "SourceItemProps",
|
|
1097
|
+
source: 'export interface SourceItemProps\n extends Omit<React.LiHTMLAttributes<HTMLLIElement>, "title"> {\n /** Optional leading index, e.g. `1`. */\n index?: number;\n /** Icon shown in the leading slot. Defaults to a document icon. */\n icon?: React.ReactNode;\n /** Source title, e.g. a filename. */\n title: React.ReactNode;\n /** Metadata line, e.g. `"Source \xB7 PDF \xB7 Section 4.1"`. */\n meta?: React.ReactNode;\n /** If set, the open affordance becomes a link to this href. */\n href?: string;\n /** Label for the open affordance. Defaults to `"Open"`. */\n actionLabel?: React.ReactNode;\n /** Called when the open affordance is activated (button mode). */\n onOpen?: () => void;\n}'
|
|
1098
|
+
},
|
|
1099
|
+
{
|
|
1100
|
+
name: "SourceListProps",
|
|
1101
|
+
source: 'export interface SourceListProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Heading above the list, e.g. `"3 sources \xB7 1 missing policy"`. */\n heading?: React.ReactNode;\n}'
|
|
1102
|
+
}
|
|
1103
|
+
],
|
|
1104
|
+
readme: '# @nucleux/citation\n\nCitation \u2014 inline source chips and a grounded sources list for AI answers \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/citation @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Citation } from "@nucleux/citation";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1105
|
+
peerDependencies: {
|
|
1106
|
+
react: ">=18",
|
|
1107
|
+
"react-dom": ">=18"
|
|
1108
|
+
}
|
|
1109
|
+
},
|
|
1110
|
+
{
|
|
1111
|
+
name: "code-block",
|
|
1112
|
+
package: "@nucleux/code-block",
|
|
1113
|
+
kind: "component",
|
|
1114
|
+
description: "A code surface with a language label and copy-to-clipboard button. Syntax\nhighlighting is intentionally left to the consumer (bring your own\nhighlighter such as Shiki) so the library stays dependency-light.",
|
|
1115
|
+
summary: "Code surface with copy button \u2014 Nucleux agentic UI for React.",
|
|
1116
|
+
keywords: [
|
|
1117
|
+
"nucleux",
|
|
1118
|
+
"react",
|
|
1119
|
+
"ui",
|
|
1120
|
+
"components",
|
|
1121
|
+
"agentic",
|
|
1122
|
+
"ai",
|
|
1123
|
+
"tailwind",
|
|
1124
|
+
"code-block"
|
|
1125
|
+
],
|
|
1126
|
+
exports: [
|
|
1127
|
+
"CodeBlock",
|
|
1128
|
+
"CodeBlockProps"
|
|
1129
|
+
],
|
|
1130
|
+
components: [
|
|
1131
|
+
"CodeBlock"
|
|
1132
|
+
],
|
|
1133
|
+
import: 'import { CodeBlock } from "@nucleux/code-block";',
|
|
1134
|
+
installSingle: "pnpm add @nucleux/code-block @nucleux/tokens",
|
|
1135
|
+
props: [
|
|
1136
|
+
{
|
|
1137
|
+
name: "CodeBlockProps",
|
|
1138
|
+
source: 'export interface CodeBlockProps extends React.HTMLAttributes<HTMLDivElement> {\n /** The raw source code to display. */\n code: string;\n /** Language label shown in the header (e.g. "ts", "python"). */\n language?: string;\n /** Hide the copy button. */\n hideCopy?: boolean;\n}'
|
|
1139
|
+
}
|
|
1140
|
+
],
|
|
1141
|
+
readme: '# @nucleux/code-block\n\nCode surface with copy button \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/code-block @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { CodeBlock } from "@nucleux/code-block";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1142
|
+
peerDependencies: {
|
|
1143
|
+
react: ">=18",
|
|
1144
|
+
"react-dom": ">=18"
|
|
1145
|
+
}
|
|
1146
|
+
},
|
|
1147
|
+
{
|
|
1148
|
+
name: "collapsible",
|
|
1149
|
+
package: "@nucleux/collapsible",
|
|
1150
|
+
kind: "component",
|
|
1151
|
+
description: "A disclosure region that expands/collapses its content.",
|
|
1152
|
+
summary: "Single collapsible disclosure region \u2014 Nucleux agentic UI for React.",
|
|
1153
|
+
keywords: [
|
|
1154
|
+
"nucleux",
|
|
1155
|
+
"react",
|
|
1156
|
+
"ui",
|
|
1157
|
+
"components",
|
|
1158
|
+
"agentic",
|
|
1159
|
+
"ai",
|
|
1160
|
+
"tailwind",
|
|
1161
|
+
"collapsible"
|
|
1162
|
+
],
|
|
1163
|
+
exports: [
|
|
1164
|
+
"Collapsible",
|
|
1165
|
+
"CollapsibleTrigger",
|
|
1166
|
+
"CollapsibleContent",
|
|
1167
|
+
"CollapsibleProps",
|
|
1168
|
+
"CollapsibleTriggerProps",
|
|
1169
|
+
"CollapsibleContentProps"
|
|
1170
|
+
],
|
|
1171
|
+
components: [
|
|
1172
|
+
"Collapsible",
|
|
1173
|
+
"CollapsibleTrigger",
|
|
1174
|
+
"CollapsibleContent"
|
|
1175
|
+
],
|
|
1176
|
+
import: 'import { Collapsible, CollapsibleTrigger, CollapsibleContent } from "@nucleux/collapsible";',
|
|
1177
|
+
installSingle: "pnpm add @nucleux/collapsible @nucleux/tokens",
|
|
1178
|
+
props: [
|
|
1179
|
+
{
|
|
1180
|
+
name: "CollapsibleProps",
|
|
1181
|
+
source: "export interface CollapsibleProps extends React.HTMLAttributes<HTMLDivElement> {\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n disabled?: boolean;\n}"
|
|
1182
|
+
},
|
|
1183
|
+
{
|
|
1184
|
+
name: "CollapsibleTriggerProps",
|
|
1185
|
+
source: "export interface CollapsibleTriggerProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n /** Hide the default chevron affordance. */\n hideChevron?: boolean;\n}"
|
|
1186
|
+
}
|
|
1187
|
+
],
|
|
1188
|
+
readme: '# @nucleux/collapsible\n\nSingle collapsible disclosure region \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/collapsible @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Collapsible } from "@nucleux/collapsible";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1189
|
+
peerDependencies: {
|
|
1190
|
+
react: ">=18",
|
|
1191
|
+
"react-dom": ">=18"
|
|
1192
|
+
}
|
|
1193
|
+
},
|
|
1194
|
+
{
|
|
1195
|
+
name: "combobox",
|
|
1196
|
+
package: "@nucleux/combobox",
|
|
1197
|
+
kind: "component",
|
|
1198
|
+
description: "A single-select control combining a text filter with a dropdown list.",
|
|
1199
|
+
summary: "Searchable single-select combobox \u2014 Nucleux agentic UI for React.",
|
|
1200
|
+
keywords: [
|
|
1201
|
+
"nucleux",
|
|
1202
|
+
"react",
|
|
1203
|
+
"ui",
|
|
1204
|
+
"components",
|
|
1205
|
+
"agentic",
|
|
1206
|
+
"ai",
|
|
1207
|
+
"tailwind",
|
|
1208
|
+
"combobox"
|
|
1209
|
+
],
|
|
1210
|
+
exports: [
|
|
1211
|
+
"Combobox",
|
|
1212
|
+
"ComboboxOption",
|
|
1213
|
+
"ComboboxProps"
|
|
1214
|
+
],
|
|
1215
|
+
components: [
|
|
1216
|
+
"Combobox",
|
|
1217
|
+
"ComboboxOption"
|
|
1218
|
+
],
|
|
1219
|
+
import: 'import { Combobox, ComboboxOption } from "@nucleux/combobox";',
|
|
1220
|
+
installSingle: "pnpm add @nucleux/combobox @nucleux/tokens",
|
|
1221
|
+
props: [
|
|
1222
|
+
{
|
|
1223
|
+
name: "ComboboxProps",
|
|
1224
|
+
source: 'export interface ComboboxProps {\n options: ComboboxOption[];\n value?: string;\n defaultValue?: string;\n onValueChange?: (value: string) => void;\n placeholder?: string;\n searchPlaceholder?: string;\n emptyText?: string;\n disabled?: boolean;\n className?: string;\n /** Accessible name for the trigger. */\n "aria-label"?: string;\n}'
|
|
1225
|
+
}
|
|
1226
|
+
],
|
|
1227
|
+
readme: '# @nucleux/combobox\n\nSearchable single-select combobox \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/combobox @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Combobox } from "@nucleux/combobox";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1228
|
+
peerDependencies: {
|
|
1229
|
+
react: ">=18",
|
|
1230
|
+
"react-dom": ">=18"
|
|
1231
|
+
}
|
|
1232
|
+
},
|
|
1233
|
+
{
|
|
1234
|
+
name: "command",
|
|
1235
|
+
package: "@nucleux/command",
|
|
1236
|
+
kind: "component",
|
|
1237
|
+
description: "A composable command palette: a filterable, keyboard-navigable list of\nactions. Compose with CommandInput, CommandList, CommandGroup, CommandItem,\nand CommandEmpty.",
|
|
1238
|
+
summary: "Searchable command palette \u2014 Nucleux agentic UI for React.",
|
|
1239
|
+
keywords: [
|
|
1240
|
+
"nucleux",
|
|
1241
|
+
"react",
|
|
1242
|
+
"ui",
|
|
1243
|
+
"components",
|
|
1244
|
+
"agentic",
|
|
1245
|
+
"ai",
|
|
1246
|
+
"tailwind",
|
|
1247
|
+
"command"
|
|
1248
|
+
],
|
|
1249
|
+
exports: [
|
|
1250
|
+
"Command",
|
|
1251
|
+
"CommandInput",
|
|
1252
|
+
"CommandList",
|
|
1253
|
+
"CommandGroup",
|
|
1254
|
+
"CommandItem",
|
|
1255
|
+
"CommandEmpty",
|
|
1256
|
+
"CommandProps",
|
|
1257
|
+
"CommandInputProps",
|
|
1258
|
+
"CommandListProps",
|
|
1259
|
+
"CommandGroupProps",
|
|
1260
|
+
"CommandItemProps",
|
|
1261
|
+
"CommandEmptyProps"
|
|
1262
|
+
],
|
|
1263
|
+
components: [
|
|
1264
|
+
"Command",
|
|
1265
|
+
"CommandInput",
|
|
1266
|
+
"CommandList",
|
|
1267
|
+
"CommandGroup",
|
|
1268
|
+
"CommandItem",
|
|
1269
|
+
"CommandEmpty"
|
|
1270
|
+
],
|
|
1271
|
+
import: 'import { Command, CommandInput, CommandList, CommandGroup } from "@nucleux/command";',
|
|
1272
|
+
installSingle: "pnpm add @nucleux/command @nucleux/tokens",
|
|
1273
|
+
props: [
|
|
1274
|
+
{
|
|
1275
|
+
name: "CommandGroupProps",
|
|
1276
|
+
source: "export interface CommandGroupProps extends React.HTMLAttributes<HTMLDivElement> {\n heading?: React.ReactNode;\n}"
|
|
1277
|
+
},
|
|
1278
|
+
{
|
|
1279
|
+
name: "CommandItemProps",
|
|
1280
|
+
source: 'export interface CommandItemProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, "onSelect"> {\n /** The value used for filtering + selection. Defaults to the text content. */\n value: string;\n disabled?: boolean;\n onSelect?: (value: string) => void;\n}'
|
|
1281
|
+
}
|
|
1282
|
+
],
|
|
1283
|
+
readme: '# @nucleux/command\n\nSearchable command palette \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/command @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Command } from "@nucleux/command";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1284
|
+
peerDependencies: {
|
|
1285
|
+
react: ">=18",
|
|
1286
|
+
"react-dom": ">=18"
|
|
1287
|
+
}
|
|
1288
|
+
},
|
|
1289
|
+
{
|
|
1290
|
+
name: "confidence-indicator",
|
|
1291
|
+
package: "@nucleux/confidence-indicator",
|
|
1292
|
+
kind: "component",
|
|
1293
|
+
description: 'A model-confidence meter with a review threshold \u2014 surfaces how certain the\nagent is about its own answer and gates autonomous action on it.\nSource: Figma "Explainability / Confidence Indicators".',
|
|
1294
|
+
summary: "ConfidenceIndicator \u2014 a model-confidence meter with a human-review threshold \u2014 Nucleux agentic UI for React.",
|
|
1295
|
+
keywords: [
|
|
1296
|
+
"nucleux",
|
|
1297
|
+
"react",
|
|
1298
|
+
"ui",
|
|
1299
|
+
"components",
|
|
1300
|
+
"agentic",
|
|
1301
|
+
"ai",
|
|
1302
|
+
"tailwind",
|
|
1303
|
+
"confidence-indicator"
|
|
1304
|
+
],
|
|
1305
|
+
exports: [
|
|
1306
|
+
"ConfidenceIndicator",
|
|
1307
|
+
"ConfidenceLevel",
|
|
1308
|
+
"ConfidenceIndicatorProps"
|
|
1309
|
+
],
|
|
1310
|
+
components: [
|
|
1311
|
+
"ConfidenceIndicator",
|
|
1312
|
+
"ConfidenceLevel"
|
|
1313
|
+
],
|
|
1314
|
+
import: 'import { ConfidenceIndicator, ConfidenceLevel } from "@nucleux/confidence-indicator";',
|
|
1315
|
+
installSingle: "pnpm add @nucleux/confidence-indicator @nucleux/tokens",
|
|
1316
|
+
props: [
|
|
1317
|
+
{
|
|
1318
|
+
name: "ConfidenceIndicatorProps",
|
|
1319
|
+
source: 'export interface ConfidenceIndicatorProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Confidence score, 0\u2013100. */\n value: number;\n /** Label above the meter. Defaults to `"Confidence"`. */\n label?: React.ReactNode;\n /** Score below which the agent should defer to a human. Defaults to 70. */\n threshold?: number;\n /** Explanatory note shown under the meter (e.g. a review recommendation). */\n note?: React.ReactNode;\n /** Force a level instead of deriving it from `value`/`threshold`. */\n level?: ConfidenceLevel;\n}'
|
|
1320
|
+
}
|
|
1321
|
+
],
|
|
1322
|
+
readme: '# @nucleux/confidence-indicator\n\nConfidenceIndicator \u2014 a model-confidence meter with a human-review threshold \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/confidence-indicator @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { ConfidenceIndicator } from "@nucleux/confidence-indicator";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1323
|
+
peerDependencies: {
|
|
1324
|
+
react: ">=18",
|
|
1325
|
+
"react-dom": ">=18"
|
|
1326
|
+
}
|
|
1327
|
+
},
|
|
1328
|
+
{
|
|
1329
|
+
name: "connector-card",
|
|
1330
|
+
package: "@nucleux/connector-card",
|
|
1331
|
+
kind: "component",
|
|
1332
|
+
description: 'A card to enable an external tool or data connector for the agent \u2014 icon,\nname, what it unlocks, and a connect action.\nSource: Figma "Context Expansion / Connector suggestion card".',
|
|
1333
|
+
summary: "ConnectorCard \u2014 enable an external tool or data connector \u2014 Nucleux agentic UI for React.",
|
|
1334
|
+
keywords: [
|
|
1335
|
+
"nucleux",
|
|
1336
|
+
"react",
|
|
1337
|
+
"ui",
|
|
1338
|
+
"components",
|
|
1339
|
+
"agentic",
|
|
1340
|
+
"ai",
|
|
1341
|
+
"tailwind",
|
|
1342
|
+
"connector-card"
|
|
1343
|
+
],
|
|
1344
|
+
exports: [
|
|
1345
|
+
"ConnectorCard",
|
|
1346
|
+
"ConnectorCardProps"
|
|
1347
|
+
],
|
|
1348
|
+
components: [
|
|
1349
|
+
"ConnectorCard"
|
|
1350
|
+
],
|
|
1351
|
+
import: 'import { ConnectorCard } from "@nucleux/connector-card";',
|
|
1352
|
+
installSingle: "pnpm add @nucleux/connector-card @nucleux/tokens",
|
|
1353
|
+
props: [
|
|
1354
|
+
{
|
|
1355
|
+
name: "ConnectorCardProps",
|
|
1356
|
+
source: 'export interface ConnectorCardProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {\n /** Connector name, e.g. `"GitHub"`. */\n name: React.ReactNode;\n /** What the connector gives the agent access to. */\n description?: React.ReactNode;\n /** Connector logo/icon. Defaults to a plug glyph. */\n icon?: React.ReactNode;\n /** Whether the connector is already connected. */\n connected?: boolean;\n /** Called to connect. Renders the connect button when set and not connected. */\n onConnect?: () => void;\n /** Called to disconnect. Renders a manage/disconnect control when connected. */\n onDisconnect?: () => void;\n connectLabel?: React.ReactNode;\n disconnectLabel?: React.ReactNode;\n}'
|
|
1357
|
+
}
|
|
1358
|
+
],
|
|
1359
|
+
readme: '# @nucleux/connector-card\n\nConnectorCard \u2014 enable an external tool or data connector \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/connector-card @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { ConnectorCard } from "@nucleux/connector-card";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1360
|
+
peerDependencies: {
|
|
1361
|
+
react: ">=18",
|
|
1362
|
+
"react-dom": ">=18"
|
|
1363
|
+
}
|
|
1364
|
+
},
|
|
1365
|
+
{
|
|
1366
|
+
name: "context-menu",
|
|
1367
|
+
package: "@nucleux/context-menu",
|
|
1368
|
+
kind: "component",
|
|
1369
|
+
description: "Wraps a region so right-clicking it opens a menu at the cursor.",
|
|
1370
|
+
summary: "Right-click context menu \u2014 Nucleux agentic UI for React.",
|
|
1371
|
+
keywords: [
|
|
1372
|
+
"nucleux",
|
|
1373
|
+
"react",
|
|
1374
|
+
"ui",
|
|
1375
|
+
"components",
|
|
1376
|
+
"agentic",
|
|
1377
|
+
"ai",
|
|
1378
|
+
"tailwind",
|
|
1379
|
+
"context-menu"
|
|
1380
|
+
],
|
|
1381
|
+
exports: [
|
|
1382
|
+
"ContextMenu",
|
|
1383
|
+
"ContextMenuItem",
|
|
1384
|
+
"ContextMenuSeparator",
|
|
1385
|
+
"ContextMenuLabel",
|
|
1386
|
+
"ContextMenuProps",
|
|
1387
|
+
"ContextMenuItemProps"
|
|
1388
|
+
],
|
|
1389
|
+
components: [
|
|
1390
|
+
"ContextMenu",
|
|
1391
|
+
"ContextMenuItem",
|
|
1392
|
+
"ContextMenuSeparator",
|
|
1393
|
+
"ContextMenuLabel"
|
|
1394
|
+
],
|
|
1395
|
+
import: 'import { ContextMenu, ContextMenuItem, ContextMenuSeparator, ContextMenuLabel } from "@nucleux/context-menu";',
|
|
1396
|
+
installSingle: "pnpm add @nucleux/context-menu @nucleux/tokens",
|
|
1397
|
+
props: [
|
|
1398
|
+
{
|
|
1399
|
+
name: "ContextMenuProps",
|
|
1400
|
+
source: 'export interface ContextMenuProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "content"> {\n /** Menu items \u2014 compose ContextMenuItem / ContextMenuSeparator / ContextMenuLabel. */\n content: React.ReactNode;\n /** The area that opens the menu on right-click. */\n children: React.ReactNode;\n}'
|
|
1401
|
+
},
|
|
1402
|
+
{
|
|
1403
|
+
name: "ContextMenuItemProps",
|
|
1404
|
+
source: "export interface ContextMenuItemProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n icon?: React.ReactNode;\n trailing?: React.ReactNode;\n destructive?: boolean;\n}"
|
|
1405
|
+
}
|
|
1406
|
+
],
|
|
1407
|
+
readme: '# @nucleux/context-menu\n\nRight-click context menu \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/context-menu @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { ContextMenu } from "@nucleux/context-menu";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1408
|
+
peerDependencies: {
|
|
1409
|
+
react: ">=18",
|
|
1410
|
+
"react-dom": ">=18"
|
|
1411
|
+
}
|
|
1412
|
+
},
|
|
1413
|
+
{
|
|
1414
|
+
name: "data-table",
|
|
1415
|
+
package: "@nucleux/data-table",
|
|
1416
|
+
kind: "component",
|
|
1417
|
+
description: "A sortable, paginated table built on TanStack Table. Pass column definitions\nand data; sorting and pagination are handled internally.",
|
|
1418
|
+
summary: "Sortable, paginated data table \u2014 Nucleux agentic UI for React.",
|
|
1419
|
+
keywords: [
|
|
1420
|
+
"nucleux",
|
|
1421
|
+
"react",
|
|
1422
|
+
"ui",
|
|
1423
|
+
"components",
|
|
1424
|
+
"agentic",
|
|
1425
|
+
"ai",
|
|
1426
|
+
"tailwind",
|
|
1427
|
+
"data-table"
|
|
1428
|
+
],
|
|
1429
|
+
exports: [
|
|
1430
|
+
"DataTable",
|
|
1431
|
+
"DataTableProps"
|
|
1432
|
+
],
|
|
1433
|
+
components: [
|
|
1434
|
+
"DataTable"
|
|
1435
|
+
],
|
|
1436
|
+
import: 'import { DataTable } from "@nucleux/data-table";',
|
|
1437
|
+
installSingle: "pnpm add @nucleux/data-table @nucleux/tokens",
|
|
1438
|
+
props: [
|
|
1439
|
+
{
|
|
1440
|
+
name: "DataTableProps",
|
|
1441
|
+
source: "export interface DataTableProps<TData, TValue> {\n columns: ColumnDef<TData, TValue>[];\n data: TData[];\n /** Rows per page. Set 0 to disable pagination. */\n pageSize?: number;\n /** Message shown when there are no rows. */\n emptyMessage?: React.ReactNode;\n className?: string;\n}"
|
|
1442
|
+
}
|
|
1443
|
+
],
|
|
1444
|
+
readme: '# @nucleux/data-table\n\nSortable, paginated data table \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/data-table @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { DataTable } from "@nucleux/data-table";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1445
|
+
peerDependencies: {
|
|
1446
|
+
react: ">=18",
|
|
1447
|
+
"react-dom": ">=18"
|
|
1448
|
+
}
|
|
1449
|
+
},
|
|
1450
|
+
{
|
|
1451
|
+
name: "date-picker",
|
|
1452
|
+
package: "@nucleux/date-picker",
|
|
1453
|
+
kind: "component",
|
|
1454
|
+
description: "A text trigger that reveals a {@link Calendar} to pick a single date.",
|
|
1455
|
+
summary: "Date picker with calendar popover \u2014 Nucleux agentic UI for React.",
|
|
1456
|
+
keywords: [
|
|
1457
|
+
"nucleux",
|
|
1458
|
+
"react",
|
|
1459
|
+
"ui",
|
|
1460
|
+
"components",
|
|
1461
|
+
"agentic",
|
|
1462
|
+
"ai",
|
|
1463
|
+
"tailwind",
|
|
1464
|
+
"date-picker"
|
|
1465
|
+
],
|
|
1466
|
+
exports: [
|
|
1467
|
+
"DatePicker",
|
|
1468
|
+
"DatePickerProps"
|
|
1469
|
+
],
|
|
1470
|
+
components: [
|
|
1471
|
+
"DatePicker"
|
|
1472
|
+
],
|
|
1473
|
+
import: 'import { DatePicker } from "@nucleux/date-picker";',
|
|
1474
|
+
installSingle: "pnpm add @nucleux/date-picker @nucleux/tokens",
|
|
1475
|
+
props: [
|
|
1476
|
+
{
|
|
1477
|
+
name: "DatePickerProps",
|
|
1478
|
+
source: 'export interface DatePickerProps {\n value?: Date;\n defaultValue?: Date;\n onValueChange?: (date: Date | undefined) => void;\n placeholder?: string;\n disabled?: boolean;\n /** Disable individual days. */\n isDateDisabled?: (date: Date) => boolean;\n className?: string;\n "aria-label"?: string;\n}'
|
|
1479
|
+
}
|
|
1480
|
+
],
|
|
1481
|
+
readme: '# @nucleux/date-picker\n\nDate picker with calendar popover \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/date-picker @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { DatePicker } from "@nucleux/date-picker";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1482
|
+
peerDependencies: {
|
|
1483
|
+
react: ">=18",
|
|
1484
|
+
"react-dom": ">=18"
|
|
1485
|
+
}
|
|
1486
|
+
},
|
|
1487
|
+
{
|
|
1488
|
+
name: "dialog",
|
|
1489
|
+
package: "@nucleux/dialog",
|
|
1490
|
+
kind: "component",
|
|
1491
|
+
description: "A modal dialog. Controlled via `open` / `onOpenChange`. Renders an overlay and\na centered panel; closes on overlay click or Escape (unless `dismissible` is\nfalse). Compose with DialogHeader, DialogTitle, DialogDescription, DialogFooter.",
|
|
1492
|
+
summary: "Modal dialog with overlay \u2014 Nucleux agentic UI for React.",
|
|
1493
|
+
keywords: [
|
|
1494
|
+
"nucleux",
|
|
1495
|
+
"react",
|
|
1496
|
+
"ui",
|
|
1497
|
+
"components",
|
|
1498
|
+
"agentic",
|
|
1499
|
+
"ai",
|
|
1500
|
+
"tailwind",
|
|
1501
|
+
"dialog"
|
|
1502
|
+
],
|
|
1503
|
+
exports: [
|
|
1504
|
+
"Dialog",
|
|
1505
|
+
"DialogHeader",
|
|
1506
|
+
"DialogTitle",
|
|
1507
|
+
"DialogDescription",
|
|
1508
|
+
"DialogFooter",
|
|
1509
|
+
"DialogProps"
|
|
1510
|
+
],
|
|
1511
|
+
components: [
|
|
1512
|
+
"Dialog",
|
|
1513
|
+
"DialogHeader",
|
|
1514
|
+
"DialogTitle",
|
|
1515
|
+
"DialogDescription",
|
|
1516
|
+
"DialogFooter"
|
|
1517
|
+
],
|
|
1518
|
+
import: 'import { Dialog, DialogHeader, DialogTitle, DialogDescription } from "@nucleux/dialog";',
|
|
1519
|
+
installSingle: "pnpm add @nucleux/dialog @nucleux/tokens",
|
|
1520
|
+
props: [
|
|
1521
|
+
{
|
|
1522
|
+
name: "DialogProps",
|
|
1523
|
+
source: "export interface DialogProps {\n /** Whether the dialog is open. */\n open: boolean;\n /** Called when the dialog requests to close (overlay click / Escape). */\n onOpenChange: (open: boolean) => void;\n /** Panel content \u2014 compose DialogHeader/Title/Description/Footer. */\n children: React.ReactNode;\n /** Class overrides for the panel. */\n className?: string;\n /** Disable closing on overlay click / Escape. */\n dismissible?: boolean;\n}"
|
|
1524
|
+
}
|
|
1525
|
+
],
|
|
1526
|
+
readme: '# @nucleux/dialog\n\nModal dialog with overlay \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/dialog @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Dialog, DialogHeader, DialogTitle, DialogDescription, DialogFooter } from "@nucleux/dialog";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1527
|
+
peerDependencies: {
|
|
1528
|
+
react: ">=18",
|
|
1529
|
+
"react-dom": ">=18"
|
|
1530
|
+
}
|
|
1531
|
+
},
|
|
1532
|
+
{
|
|
1533
|
+
name: "error-state",
|
|
1534
|
+
package: "@nucleux/error-state",
|
|
1535
|
+
kind: "component",
|
|
1536
|
+
description: `A centered empty / failure state \u2014 icon, title, description and recovery
|
|
1537
|
+
actions. The AI-failure variant is the "your prompt didn't go through, your
|
|
1538
|
+
draft is saved" recovery card.
|
|
1539
|
+
Source: Figma "Recovery / Error & Empty States".`,
|
|
1540
|
+
summary: "ErrorState \u2014 empty and AI-failure recovery states \u2014 Nucleux agentic UI for React.",
|
|
1541
|
+
keywords: [
|
|
1542
|
+
"nucleux",
|
|
1543
|
+
"react",
|
|
1544
|
+
"ui",
|
|
1545
|
+
"components",
|
|
1546
|
+
"agentic",
|
|
1547
|
+
"ai",
|
|
1548
|
+
"tailwind",
|
|
1549
|
+
"error-state"
|
|
1550
|
+
],
|
|
1551
|
+
exports: [
|
|
1552
|
+
"ErrorState",
|
|
1553
|
+
"ErrorStateVariant",
|
|
1554
|
+
"ErrorStateProps"
|
|
1555
|
+
],
|
|
1556
|
+
components: [
|
|
1557
|
+
"ErrorState"
|
|
1558
|
+
],
|
|
1559
|
+
import: 'import { ErrorState } from "@nucleux/error-state";',
|
|
1560
|
+
installSingle: "pnpm add @nucleux/error-state @nucleux/tokens",
|
|
1561
|
+
props: [
|
|
1562
|
+
{
|
|
1563
|
+
name: "ErrorStateProps",
|
|
1564
|
+
source: 'export interface ErrorStateProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {\n /** `empty` for neutral empty states, `error` for a failure (tints the icon). */\n variant?: ErrorStateVariant;\n /** Icon shown above the title. */\n icon?: React.ReactNode;\n /** Headline, e.g. `"Something went wrong"`. */\n title: React.ReactNode;\n /** Supporting explanation. */\n description?: React.ReactNode;\n /** Action buttons, e.g. Retry / Edit prompt. */\n actions?: React.ReactNode;\n}'
|
|
1565
|
+
}
|
|
1566
|
+
],
|
|
1567
|
+
readme: '# @nucleux/error-state\n\nErrorState \u2014 empty and AI-failure recovery states \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/error-state @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { ErrorState } from "@nucleux/error-state";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1568
|
+
peerDependencies: {
|
|
1569
|
+
react: ">=18",
|
|
1570
|
+
"react-dom": ">=18"
|
|
1571
|
+
}
|
|
1572
|
+
},
|
|
1573
|
+
{
|
|
1574
|
+
name: "follow-up",
|
|
1575
|
+
package: "@nucleux/follow-up",
|
|
1576
|
+
kind: "component",
|
|
1577
|
+
description: 'An AI answer that surfaces the assumption it made, with a chip to change it \u2014\nfor when a response would otherwise silently guess missing intent.\nSource: Figma "AIUX / Follow Up".',
|
|
1578
|
+
summary: "FollowUp \u2014 AI answer with an editable assumption chip \u2014 Nucleux agentic UI for React.",
|
|
1579
|
+
keywords: [
|
|
1580
|
+
"nucleux",
|
|
1581
|
+
"react",
|
|
1582
|
+
"ui",
|
|
1583
|
+
"components",
|
|
1584
|
+
"agentic",
|
|
1585
|
+
"ai",
|
|
1586
|
+
"tailwind",
|
|
1587
|
+
"follow-up",
|
|
1588
|
+
"assumption"
|
|
1589
|
+
],
|
|
1590
|
+
exports: [
|
|
1591
|
+
"FollowUp",
|
|
1592
|
+
"FollowUpAssumption",
|
|
1593
|
+
"FollowUpProps"
|
|
1594
|
+
],
|
|
1595
|
+
components: [
|
|
1596
|
+
"FollowUp",
|
|
1597
|
+
"FollowUpAssumption"
|
|
1598
|
+
],
|
|
1599
|
+
import: 'import { FollowUp, FollowUpAssumption } from "@nucleux/follow-up";',
|
|
1600
|
+
installSingle: "pnpm add @nucleux/follow-up @nucleux/tokens",
|
|
1601
|
+
props: [
|
|
1602
|
+
{
|
|
1603
|
+
name: "FollowUpProps",
|
|
1604
|
+
source: "export interface FollowUpProps extends React.HTMLAttributes<HTMLDivElement> {\n /** The AI answer text. Ignored if `children` is provided. */\n answer?: React.ReactNode;\n /** The stated assumption; rendered as an editable chip. */\n assumption?: FollowUpAssumption;\n /** Called when the assumption chip is activated (to change the assumption). */\n onChangeAssumption?: () => void;\n}"
|
|
1605
|
+
}
|
|
1606
|
+
],
|
|
1607
|
+
readme: '# @nucleux/follow-up\n\nFollowUp \u2014 AI answer with an editable assumption chip \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/follow-up @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { FollowUp } from "@nucleux/follow-up";\n\n<FollowUp\n answer="Three deals are at risk this quarter."\n assumption={{ label: "Assumed:", value: "Q3", hint: "tap to change" }}\n onChangeAssumption={() => {}}\n/>;\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1608
|
+
peerDependencies: {
|
|
1609
|
+
react: ">=18",
|
|
1610
|
+
"react-dom": ">=18"
|
|
1611
|
+
}
|
|
1612
|
+
},
|
|
1613
|
+
{
|
|
1614
|
+
name: "form",
|
|
1615
|
+
package: "@nucleux/form",
|
|
1616
|
+
kind: "component",
|
|
1617
|
+
description: "The form root \u2014 a re-export of react-hook-form's FormProvider.",
|
|
1618
|
+
summary: "Accessible form primitives \u2014 Nucleux agentic UI for React.",
|
|
1619
|
+
keywords: [
|
|
1620
|
+
"nucleux",
|
|
1621
|
+
"react",
|
|
1622
|
+
"ui",
|
|
1623
|
+
"components",
|
|
1624
|
+
"agentic",
|
|
1625
|
+
"ai",
|
|
1626
|
+
"tailwind",
|
|
1627
|
+
"form"
|
|
1628
|
+
],
|
|
1629
|
+
exports: [
|
|
1630
|
+
"Form",
|
|
1631
|
+
"FormField",
|
|
1632
|
+
"useFormField",
|
|
1633
|
+
"FormItem",
|
|
1634
|
+
"FormLabel",
|
|
1635
|
+
"FormControl",
|
|
1636
|
+
"FormDescription",
|
|
1637
|
+
"FormMessage"
|
|
1638
|
+
],
|
|
1639
|
+
components: [
|
|
1640
|
+
"Form",
|
|
1641
|
+
"FormField",
|
|
1642
|
+
"FormItem",
|
|
1643
|
+
"FormLabel",
|
|
1644
|
+
"FormControl",
|
|
1645
|
+
"FormDescription",
|
|
1646
|
+
"FormMessage"
|
|
1647
|
+
],
|
|
1648
|
+
import: 'import { Form, FormField, FormItem, FormLabel } from "@nucleux/form";',
|
|
1649
|
+
installSingle: "pnpm add @nucleux/form @nucleux/tokens",
|
|
1650
|
+
props: [],
|
|
1651
|
+
readme: '# @nucleux/form\n\nAccessible form primitives \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/form @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Form } from "@nucleux/form";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1652
|
+
peerDependencies: {
|
|
1653
|
+
react: ">=18",
|
|
1654
|
+
"react-dom": ">=18"
|
|
1655
|
+
}
|
|
1656
|
+
},
|
|
1657
|
+
{
|
|
1658
|
+
name: "getting-started-pill",
|
|
1659
|
+
package: "@nucleux/getting-started-pill",
|
|
1660
|
+
kind: "component",
|
|
1661
|
+
description: "A floating, collapsed onboarding launcher \u2014 an icon, a label, a progress\nbadge, and a chevron that toggles the expanded panel. Click toggles `open`\nvia `onClick`. Source: Figma `getting-started-collapsed`.",
|
|
1662
|
+
summary: "Floating onboarding progress launcher \u2014 Nucleux agentic UI for React.",
|
|
1663
|
+
keywords: [
|
|
1664
|
+
"nucleux",
|
|
1665
|
+
"react",
|
|
1666
|
+
"ui",
|
|
1667
|
+
"components",
|
|
1668
|
+
"agentic",
|
|
1669
|
+
"ai",
|
|
1670
|
+
"tailwind",
|
|
1671
|
+
"getting-started-pill"
|
|
1672
|
+
],
|
|
1673
|
+
exports: [
|
|
1674
|
+
"GettingStartedPill",
|
|
1675
|
+
"GettingStartedPillProps"
|
|
1676
|
+
],
|
|
1677
|
+
components: [
|
|
1678
|
+
"GettingStartedPill"
|
|
1679
|
+
],
|
|
1680
|
+
import: 'import { GettingStartedPill } from "@nucleux/getting-started-pill";',
|
|
1681
|
+
installSingle: "pnpm add @nucleux/getting-started-pill @nucleux/tokens",
|
|
1682
|
+
props: [
|
|
1683
|
+
{
|
|
1684
|
+
name: "GettingStartedPillProps",
|
|
1685
|
+
source: 'export interface GettingStartedPillProps\n extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "title"> {\n /** Leading label. */\n label?: React.ReactNode;\n /** Leading icon (defaults to a rocket). */\n icon?: React.ReactNode;\n /** Completed step count \u2014 combined with `total` to render "current of total". */\n current?: number;\n /** Total step count. */\n total?: number;\n /** Override the rendered progress text (takes precedence over current/total). */\n progressLabel?: React.ReactNode;\n /** Whether the associated panel is expanded \u2014 flips the chevron. */\n open?: boolean;\n}'
|
|
1686
|
+
}
|
|
1687
|
+
],
|
|
1688
|
+
readme: '# @nucleux/getting-started-pill\n\nFloating onboarding progress launcher \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/getting-started-pill @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { GettingStartedPill } from "@nucleux/getting-started-pill";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1689
|
+
peerDependencies: {
|
|
1690
|
+
react: ">=18",
|
|
1691
|
+
"react-dom": ">=18"
|
|
1692
|
+
}
|
|
1693
|
+
},
|
|
1694
|
+
{
|
|
1695
|
+
name: "global-nav",
|
|
1696
|
+
package: "@nucleux/global-nav",
|
|
1697
|
+
kind: "component",
|
|
1698
|
+
description: "Top application navigation bar. A fixed-height (64px) bar with three zones:\n`left`, `center`, and `right`. Pass slots, or `children` for full control.",
|
|
1699
|
+
summary: "Top application navigation bar \u2014 Nucleux agentic UI for React.",
|
|
1700
|
+
keywords: [
|
|
1701
|
+
"nucleux",
|
|
1702
|
+
"react",
|
|
1703
|
+
"ui",
|
|
1704
|
+
"components",
|
|
1705
|
+
"agentic",
|
|
1706
|
+
"ai",
|
|
1707
|
+
"tailwind",
|
|
1708
|
+
"global-nav"
|
|
1709
|
+
],
|
|
1710
|
+
exports: [
|
|
1711
|
+
"GlobalNav",
|
|
1712
|
+
"GlobalNavProps"
|
|
1713
|
+
],
|
|
1714
|
+
components: [
|
|
1715
|
+
"GlobalNav"
|
|
1716
|
+
],
|
|
1717
|
+
import: 'import { GlobalNav } from "@nucleux/global-nav";',
|
|
1718
|
+
installSingle: "pnpm add @nucleux/global-nav @nucleux/tokens",
|
|
1719
|
+
props: [
|
|
1720
|
+
{
|
|
1721
|
+
name: "GlobalNavProps",
|
|
1722
|
+
source: "export interface GlobalNavProps extends React.HTMLAttributes<HTMLElement> {\n /** Leading content \u2014 brand mark, page heading, breadcrumbs. */\n left?: React.ReactNode;\n /** Centered content \u2014 typically a search field. */\n center?: React.ReactNode;\n /** Trailing content \u2014 notifications, account avatar, actions. */\n right?: React.ReactNode;\n}"
|
|
1723
|
+
}
|
|
1724
|
+
],
|
|
1725
|
+
readme: '# @nucleux/global-nav\n\nTop application navigation bar \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/global-nav @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { GlobalNav } from "@nucleux/global-nav";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1726
|
+
peerDependencies: {
|
|
1727
|
+
react: ">=18",
|
|
1728
|
+
"react-dom": ">=18"
|
|
1729
|
+
}
|
|
1730
|
+
},
|
|
1731
|
+
{
|
|
1732
|
+
name: "hooks",
|
|
1733
|
+
package: "@nucleux/hooks",
|
|
1734
|
+
kind: "infrastructure",
|
|
1735
|
+
description: "React hooks for Nucleux (useAutoScroll, useCopyToClipboard) \u2014 Nucleux agentic UI for React.",
|
|
1736
|
+
summary: "React hooks for Nucleux (useAutoScroll, useCopyToClipboard) \u2014 Nucleux agentic UI for React.",
|
|
1737
|
+
keywords: [
|
|
1738
|
+
"nucleux",
|
|
1739
|
+
"react",
|
|
1740
|
+
"ui",
|
|
1741
|
+
"components",
|
|
1742
|
+
"agentic",
|
|
1743
|
+
"ai",
|
|
1744
|
+
"tailwind",
|
|
1745
|
+
"hooks"
|
|
1746
|
+
],
|
|
1747
|
+
exports: [],
|
|
1748
|
+
components: [],
|
|
1749
|
+
import: "",
|
|
1750
|
+
installSingle: "pnpm add @nucleux/hooks",
|
|
1751
|
+
props: [],
|
|
1752
|
+
readme: '# @nucleux/hooks\n\nReact hooks for Nucleux (useAutoScroll, useCopyToClipboard) \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/hooks @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\n\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1753
|
+
peerDependencies: {
|
|
1754
|
+
react: ">=18",
|
|
1755
|
+
"react-dom": ">=18"
|
|
1756
|
+
}
|
|
1757
|
+
},
|
|
1758
|
+
{
|
|
1759
|
+
name: "hover-card",
|
|
1760
|
+
package: "@nucleux/hover-card",
|
|
1761
|
+
kind: "component",
|
|
1762
|
+
description: "Reveals a floating card when its trigger is hovered or focused.",
|
|
1763
|
+
summary: "Hover-triggered content card \u2014 Nucleux agentic UI for React.",
|
|
1764
|
+
keywords: [
|
|
1765
|
+
"nucleux",
|
|
1766
|
+
"react",
|
|
1767
|
+
"ui",
|
|
1768
|
+
"components",
|
|
1769
|
+
"agentic",
|
|
1770
|
+
"ai",
|
|
1771
|
+
"tailwind",
|
|
1772
|
+
"hover-card"
|
|
1773
|
+
],
|
|
1774
|
+
exports: [
|
|
1775
|
+
"HoverCard",
|
|
1776
|
+
"HoverCardProps"
|
|
1777
|
+
],
|
|
1778
|
+
components: [
|
|
1779
|
+
"HoverCard"
|
|
1780
|
+
],
|
|
1781
|
+
import: 'import { HoverCard } from "@nucleux/hover-card";',
|
|
1782
|
+
installSingle: "pnpm add @nucleux/hover-card @nucleux/tokens",
|
|
1783
|
+
props: [
|
|
1784
|
+
{
|
|
1785
|
+
name: "HoverCardProps",
|
|
1786
|
+
source: 'export interface HoverCardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "content"> {\n /** The element that reveals the card on hover/focus. */\n trigger: React.ReactNode;\n /** The floating card content. */\n content: React.ReactNode;\n side?: "top" | "bottom";\n align?: "start" | "center" | "end";\n /** Delay in ms before opening on hover. */\n openDelay?: number;\n /** Delay in ms before closing after leaving. */\n closeDelay?: number;\n}'
|
|
1787
|
+
}
|
|
1788
|
+
],
|
|
1789
|
+
readme: '# @nucleux/hover-card\n\nHover-triggered content card \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/hover-card @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { HoverCard } from "@nucleux/hover-card";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1790
|
+
peerDependencies: {
|
|
1791
|
+
react: ">=18",
|
|
1792
|
+
"react-dom": ">=18"
|
|
1793
|
+
}
|
|
1794
|
+
},
|
|
1795
|
+
{
|
|
1796
|
+
name: "icon-button",
|
|
1797
|
+
package: "@nucleux/icon-button",
|
|
1798
|
+
kind: "component",
|
|
1799
|
+
description: "Square icon-only button \u2014 nav rails, toolbars, card actions.",
|
|
1800
|
+
summary: "Icon-only button for toolbars and nav rails \u2014 Nucleux agentic UI for React.",
|
|
1801
|
+
keywords: [
|
|
1802
|
+
"nucleux",
|
|
1803
|
+
"react",
|
|
1804
|
+
"ui",
|
|
1805
|
+
"components",
|
|
1806
|
+
"agentic",
|
|
1807
|
+
"ai",
|
|
1808
|
+
"tailwind",
|
|
1809
|
+
"icon-button"
|
|
1810
|
+
],
|
|
1811
|
+
exports: [
|
|
1812
|
+
"IconButton",
|
|
1813
|
+
"IconButtonVariant",
|
|
1814
|
+
"IconButtonSize",
|
|
1815
|
+
"IconButtonProps"
|
|
1816
|
+
],
|
|
1817
|
+
components: [
|
|
1818
|
+
"IconButton",
|
|
1819
|
+
"IconButtonSize"
|
|
1820
|
+
],
|
|
1821
|
+
import: 'import { IconButton, IconButtonSize } from "@nucleux/icon-button";',
|
|
1822
|
+
installSingle: "pnpm add @nucleux/icon-button @nucleux/tokens",
|
|
1823
|
+
props: [
|
|
1824
|
+
{
|
|
1825
|
+
name: "IconButtonProps",
|
|
1826
|
+
source: 'export interface IconButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n /** Accessible label \u2014 required since the button has no visible text. */\n "aria-label": string;\n variant?: IconButtonVariant;\n size?: IconButtonSize;\n}'
|
|
1827
|
+
}
|
|
1828
|
+
],
|
|
1829
|
+
readme: '# @nucleux/icon-button\n\nIcon-only button for toolbars and nav rails \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/icon-button @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { IconButton } from "@nucleux/icon-button";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1830
|
+
peerDependencies: {
|
|
1831
|
+
react: ">=18",
|
|
1832
|
+
"react-dom": ">=18"
|
|
1833
|
+
}
|
|
1834
|
+
},
|
|
1835
|
+
{
|
|
1836
|
+
name: "inline-feedback",
|
|
1837
|
+
package: "@nucleux/inline-feedback",
|
|
1838
|
+
kind: "component",
|
|
1839
|
+
description: 'A compact toolbar beneath an AI response: copy, rate (thumbs up/down) and\nregenerate \u2014 the feedback + re-run affordances specific to generated output.\nSource: Figma "Expressive Input / Inline Feedback Controls".',
|
|
1840
|
+
summary: "InlineFeedback \u2014 copy, rate, and regenerate controls for an AI response \u2014 Nucleux agentic UI for React.",
|
|
1841
|
+
keywords: [
|
|
1842
|
+
"nucleux",
|
|
1843
|
+
"react",
|
|
1844
|
+
"ui",
|
|
1845
|
+
"components",
|
|
1846
|
+
"agentic",
|
|
1847
|
+
"ai",
|
|
1848
|
+
"tailwind",
|
|
1849
|
+
"inline-feedback"
|
|
1850
|
+
],
|
|
1851
|
+
exports: [
|
|
1852
|
+
"InlineFeedback",
|
|
1853
|
+
"FeedbackRating",
|
|
1854
|
+
"InlineFeedbackProps"
|
|
1855
|
+
],
|
|
1856
|
+
components: [
|
|
1857
|
+
"InlineFeedback",
|
|
1858
|
+
"FeedbackRating"
|
|
1859
|
+
],
|
|
1860
|
+
import: 'import { InlineFeedback, FeedbackRating } from "@nucleux/inline-feedback";',
|
|
1861
|
+
installSingle: "pnpm add @nucleux/inline-feedback @nucleux/tokens",
|
|
1862
|
+
props: [
|
|
1863
|
+
{
|
|
1864
|
+
name: "InlineFeedbackProps",
|
|
1865
|
+
source: 'export interface InlineFeedbackProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> {\n /** Current rating (controlled). */\n rating?: FeedbackRating | null;\n /** Initial rating (uncontrolled). */\n defaultRating?: FeedbackRating | null;\n /** Called when the user rates the response. */\n onRate?: (rating: FeedbackRating) => void;\n /** Called when the copy control is used. Hidden if omitted. */\n onCopy?: () => void;\n /** Called when the regenerate control is used. Hidden if omitted. */\n onRegenerate?: () => void;\n /** Called when the more-actions control is used. Hidden if omitted. */\n onMore?: () => void;\n}'
|
|
1866
|
+
}
|
|
1867
|
+
],
|
|
1868
|
+
readme: '# @nucleux/inline-feedback\n\nInlineFeedback \u2014 copy, rate, and regenerate controls for an AI response \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/inline-feedback @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { InlineFeedback } from "@nucleux/inline-feedback";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1869
|
+
peerDependencies: {
|
|
1870
|
+
react: ">=18",
|
|
1871
|
+
"react-dom": ">=18"
|
|
1872
|
+
}
|
|
1873
|
+
},
|
|
1874
|
+
{
|
|
1875
|
+
name: "input",
|
|
1876
|
+
package: "@nucleux/input",
|
|
1877
|
+
kind: "component",
|
|
1878
|
+
description: "A single-line text input, tokenized and themeable.",
|
|
1879
|
+
summary: "Text input field \u2014 Nucleux agentic UI for React.",
|
|
1880
|
+
keywords: [
|
|
1881
|
+
"nucleux",
|
|
1882
|
+
"react",
|
|
1883
|
+
"ui",
|
|
1884
|
+
"components",
|
|
1885
|
+
"agentic",
|
|
1886
|
+
"ai",
|
|
1887
|
+
"tailwind",
|
|
1888
|
+
"input"
|
|
1889
|
+
],
|
|
1890
|
+
exports: [
|
|
1891
|
+
"Input",
|
|
1892
|
+
"InputProps"
|
|
1893
|
+
],
|
|
1894
|
+
components: [
|
|
1895
|
+
"Input"
|
|
1896
|
+
],
|
|
1897
|
+
import: 'import { Input } from "@nucleux/input";',
|
|
1898
|
+
installSingle: "pnpm add @nucleux/input @nucleux/tokens",
|
|
1899
|
+
props: [
|
|
1900
|
+
{
|
|
1901
|
+
name: "InputProps",
|
|
1902
|
+
source: "export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {\n /** Render an error ring and set `aria-invalid`. */\n invalid?: boolean;\n}"
|
|
1903
|
+
}
|
|
1904
|
+
],
|
|
1905
|
+
readme: '# @nucleux/input\n\nText input field \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/input @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Input } from "@nucleux/input";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1906
|
+
peerDependencies: {
|
|
1907
|
+
react: ">=18",
|
|
1908
|
+
"react-dom": ">=18"
|
|
1909
|
+
}
|
|
1910
|
+
},
|
|
1911
|
+
{
|
|
1912
|
+
name: "input-bar",
|
|
1913
|
+
package: "@nucleux/input-bar",
|
|
1914
|
+
kind: "component",
|
|
1915
|
+
description: "Auto-resizing chat composer. Enter submits, Shift+Enter inserts a newline.\nWhile `loading`, the send button becomes a stop button wired to `onStop`.",
|
|
1916
|
+
summary: "Chat composer with auto-resize \u2014 Nucleux agentic UI for React.",
|
|
1917
|
+
keywords: [
|
|
1918
|
+
"nucleux",
|
|
1919
|
+
"react",
|
|
1920
|
+
"ui",
|
|
1921
|
+
"components",
|
|
1922
|
+
"agentic",
|
|
1923
|
+
"ai",
|
|
1924
|
+
"tailwind",
|
|
1925
|
+
"input-bar"
|
|
1926
|
+
],
|
|
1927
|
+
exports: [
|
|
1928
|
+
"InputBar",
|
|
1929
|
+
"InputBarProps"
|
|
1930
|
+
],
|
|
1931
|
+
components: [
|
|
1932
|
+
"InputBar"
|
|
1933
|
+
],
|
|
1934
|
+
import: 'import { InputBar } from "@nucleux/input-bar";',
|
|
1935
|
+
installSingle: "pnpm add @nucleux/input-bar @nucleux/tokens",
|
|
1936
|
+
props: [
|
|
1937
|
+
{
|
|
1938
|
+
name: "InputBarProps",
|
|
1939
|
+
source: 'export interface InputBarProps\n extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "onSubmit" | "value" | "onChange"> {\n /** Controlled value of the input. */\n value: string;\n /** Called when the value changes. */\n onValueChange: (value: string) => void;\n /** Called with the trimmed value on submit (Enter or button). */\n onSubmit: (value: string) => void;\n /** Show the agent as busy \u2014 swaps the send button for a stop button. */\n loading?: boolean;\n /** Called when the stop button is pressed while `loading`. */\n onStop?: () => void;\n /** Max auto-grow height in px before scrolling. */\n maxHeight?: number;\n}'
|
|
1940
|
+
}
|
|
1941
|
+
],
|
|
1942
|
+
readme: '# @nucleux/input-bar\n\nChat composer with auto-resize \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/input-bar @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { InputBar } from "@nucleux/input-bar";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1943
|
+
peerDependencies: {
|
|
1944
|
+
react: ">=18",
|
|
1945
|
+
"react-dom": ">=18"
|
|
1946
|
+
}
|
|
1947
|
+
},
|
|
1948
|
+
{
|
|
1949
|
+
name: "input-otp",
|
|
1950
|
+
package: "@nucleux/input-otp",
|
|
1951
|
+
kind: "component",
|
|
1952
|
+
description: "A segmented input for one-time codes / PINs.",
|
|
1953
|
+
summary: "Segmented one-time-code input \u2014 Nucleux agentic UI for React.",
|
|
1954
|
+
keywords: [
|
|
1955
|
+
"nucleux",
|
|
1956
|
+
"react",
|
|
1957
|
+
"ui",
|
|
1958
|
+
"components",
|
|
1959
|
+
"agentic",
|
|
1960
|
+
"ai",
|
|
1961
|
+
"tailwind",
|
|
1962
|
+
"input-otp"
|
|
1963
|
+
],
|
|
1964
|
+
exports: [
|
|
1965
|
+
"InputOtp",
|
|
1966
|
+
"InputOtpProps"
|
|
1967
|
+
],
|
|
1968
|
+
components: [
|
|
1969
|
+
"InputOtp"
|
|
1970
|
+
],
|
|
1971
|
+
import: 'import { InputOtp } from "@nucleux/input-otp";',
|
|
1972
|
+
installSingle: "pnpm add @nucleux/input-otp @nucleux/tokens",
|
|
1973
|
+
props: [
|
|
1974
|
+
{
|
|
1975
|
+
name: "InputOtpProps",
|
|
1976
|
+
source: 'export interface InputOtpProps {\n /** Number of code cells. */\n length?: number;\n value?: string;\n defaultValue?: string;\n onChange?: (value: string) => void;\n /** Fired once every cell is filled. */\n onComplete?: (value: string) => void;\n disabled?: boolean;\n /** Only accept digits (default true). */\n numeric?: boolean;\n className?: string;\n "aria-label"?: string;\n}'
|
|
1977
|
+
}
|
|
1978
|
+
],
|
|
1979
|
+
readme: '# @nucleux/input-otp\n\nSegmented one-time-code input \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/input-otp @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { InputOtp } from "@nucleux/input-otp";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1980
|
+
peerDependencies: {
|
|
1981
|
+
react: ">=18",
|
|
1982
|
+
"react-dom": ">=18"
|
|
1983
|
+
}
|
|
1984
|
+
},
|
|
1985
|
+
{
|
|
1986
|
+
name: "knowledge-base-picker",
|
|
1987
|
+
package: "@nucleux/knowledge-base-picker",
|
|
1988
|
+
kind: "component",
|
|
1989
|
+
description: 'A selectable list of context files/knowledge sources an agent may draw on \u2014\ncurates the retrieval context for a turn.\nSource: Figma "Context Expansion / Knowledge Bases".',
|
|
1990
|
+
summary: "KnowledgeBasePicker \u2014 select the context files an agent may use \u2014 Nucleux agentic UI for React.",
|
|
1991
|
+
keywords: [
|
|
1992
|
+
"nucleux",
|
|
1993
|
+
"react",
|
|
1994
|
+
"ui",
|
|
1995
|
+
"components",
|
|
1996
|
+
"agentic",
|
|
1997
|
+
"ai",
|
|
1998
|
+
"tailwind",
|
|
1999
|
+
"knowledge-base-picker"
|
|
2000
|
+
],
|
|
2001
|
+
exports: [
|
|
2002
|
+
"KnowledgeBasePicker",
|
|
2003
|
+
"KnowledgeSource",
|
|
2004
|
+
"KnowledgeBasePickerProps"
|
|
2005
|
+
],
|
|
2006
|
+
components: [
|
|
2007
|
+
"KnowledgeBasePicker",
|
|
2008
|
+
"KnowledgeSource"
|
|
2009
|
+
],
|
|
2010
|
+
import: 'import { KnowledgeBasePicker, KnowledgeSource } from "@nucleux/knowledge-base-picker";',
|
|
2011
|
+
installSingle: "pnpm add @nucleux/knowledge-base-picker @nucleux/tokens",
|
|
2012
|
+
props: [
|
|
2013
|
+
{
|
|
2014
|
+
name: "KnowledgeBasePickerProps",
|
|
2015
|
+
source: 'export interface KnowledgeBasePickerProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> {\n /** The available knowledge sources. */\n sources: KnowledgeSource[];\n /** Selected source ids (controlled). */\n value?: string[];\n /** Initial selection (uncontrolled). */\n defaultValue?: string[];\n /** Called when the selection changes. */\n onValueChange?: (ids: string[]) => void;\n /** Heading above the list. Defaults to `"Knowledge sources"`. */\n heading?: React.ReactNode;\n}'
|
|
2016
|
+
}
|
|
2017
|
+
],
|
|
2018
|
+
readme: '# @nucleux/knowledge-base-picker\n\nKnowledgeBasePicker \u2014 select the context files an agent may use \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/knowledge-base-picker @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { KnowledgeBasePicker } from "@nucleux/knowledge-base-picker";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
2019
|
+
peerDependencies: {
|
|
2020
|
+
react: ">=18",
|
|
2021
|
+
"react-dom": ">=18"
|
|
2022
|
+
}
|
|
2023
|
+
},
|
|
2024
|
+
{
|
|
2025
|
+
name: "label",
|
|
2026
|
+
package: "@nucleux/label",
|
|
2027
|
+
kind: "component",
|
|
2028
|
+
description: "An accessible caption for a form control. Pair with `htmlFor`.",
|
|
2029
|
+
summary: "Accessible form label \u2014 Nucleux agentic UI for React.",
|
|
2030
|
+
keywords: [
|
|
2031
|
+
"nucleux",
|
|
2032
|
+
"react",
|
|
2033
|
+
"ui",
|
|
2034
|
+
"components",
|
|
2035
|
+
"agentic",
|
|
2036
|
+
"ai",
|
|
2037
|
+
"tailwind",
|
|
2038
|
+
"label"
|
|
2039
|
+
],
|
|
2040
|
+
exports: [
|
|
2041
|
+
"Label",
|
|
2042
|
+
"LabelProps"
|
|
2043
|
+
],
|
|
2044
|
+
components: [
|
|
2045
|
+
"Label"
|
|
2046
|
+
],
|
|
2047
|
+
import: 'import { Label } from "@nucleux/label";',
|
|
2048
|
+
installSingle: "pnpm add @nucleux/label @nucleux/tokens",
|
|
2049
|
+
props: [
|
|
2050
|
+
{
|
|
2051
|
+
name: "LabelProps",
|
|
2052
|
+
source: "export interface LabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {\n /** Show a destructive-colored asterisk to mark the field required. */\n required?: boolean;\n}"
|
|
2053
|
+
}
|
|
2054
|
+
],
|
|
2055
|
+
readme: '# @nucleux/label\n\nAccessible form label \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/label @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Label } from "@nucleux/label";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
2056
|
+
peerDependencies: {
|
|
2057
|
+
react: ">=18",
|
|
2058
|
+
"react-dom": ">=18"
|
|
2059
|
+
}
|
|
2060
|
+
},
|
|
2061
|
+
{
|
|
2062
|
+
name: "link-button",
|
|
2063
|
+
package: "@nucleux/link-button",
|
|
2064
|
+
kind: "component",
|
|
2065
|
+
description: "A link-styled action \u2014 underlined, semibold text with optional icons. Renders\nan `<a>` when `href` is provided, otherwise a `<button>` for in-app actions.",
|
|
2066
|
+
summary: "Link-styled action button \u2014 Nucleux agentic UI for React.",
|
|
2067
|
+
keywords: [
|
|
2068
|
+
"nucleux",
|
|
2069
|
+
"react",
|
|
2070
|
+
"ui",
|
|
2071
|
+
"components",
|
|
2072
|
+
"agentic",
|
|
2073
|
+
"ai",
|
|
2074
|
+
"tailwind",
|
|
2075
|
+
"link-button"
|
|
2076
|
+
],
|
|
2077
|
+
exports: [
|
|
2078
|
+
"LinkButton",
|
|
2079
|
+
"LinkButtonProps"
|
|
2080
|
+
],
|
|
2081
|
+
components: [
|
|
2082
|
+
"LinkButton"
|
|
2083
|
+
],
|
|
2084
|
+
import: 'import { LinkButton } from "@nucleux/link-button";',
|
|
2085
|
+
installSingle: "pnpm add @nucleux/link-button @nucleux/tokens",
|
|
2086
|
+
props: [
|
|
2087
|
+
{
|
|
2088
|
+
name: "LinkButtonProps",
|
|
2089
|
+
source: 'export interface LinkButtonProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {\n /** Icon before the label. */\n leftIcon?: React.ReactNode;\n /** Icon after the label (e.g. an arrow for "Learn More"). */\n rightIcon?: React.ReactNode;\n}'
|
|
2090
|
+
}
|
|
2091
|
+
],
|
|
2092
|
+
readme: '# @nucleux/link-button\n\nLink-styled action button \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/link-button @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { LinkButton } from "@nucleux/link-button";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
2093
|
+
peerDependencies: {
|
|
2094
|
+
react: ">=18",
|
|
2095
|
+
"react-dom": ">=18"
|
|
2096
|
+
}
|
|
2097
|
+
},
|
|
2098
|
+
{
|
|
2099
|
+
name: "md3-button",
|
|
2100
|
+
package: "@nucleux/md3-button",
|
|
2101
|
+
kind: "component",
|
|
2102
|
+
description: "A Material Design 3 button. Five variants (filled, tonal, elevated, outlined,\ntext) with an on-color state layer for hover/focus/press.",
|
|
2103
|
+
summary: "Material 3 button (filled, tonal, outlined, text, elevated) \u2014 Nucleux agentic UI for React.",
|
|
2104
|
+
keywords: [
|
|
2105
|
+
"nucleux",
|
|
2106
|
+
"react",
|
|
2107
|
+
"ui",
|
|
2108
|
+
"components",
|
|
2109
|
+
"agentic",
|
|
2110
|
+
"ai",
|
|
2111
|
+
"tailwind",
|
|
2112
|
+
"md3-button"
|
|
2113
|
+
],
|
|
2114
|
+
exports: [
|
|
2115
|
+
"Md3Button",
|
|
2116
|
+
"Md3ButtonVariant",
|
|
2117
|
+
"Md3ButtonProps"
|
|
2118
|
+
],
|
|
2119
|
+
components: [
|
|
2120
|
+
"Md3Button"
|
|
2121
|
+
],
|
|
2122
|
+
import: 'import { Md3Button } from "@nucleux/md3-button";',
|
|
2123
|
+
installSingle: "pnpm add @nucleux/md3-button @nucleux/tokens",
|
|
2124
|
+
props: [
|
|
2125
|
+
{
|
|
2126
|
+
name: "Md3ButtonProps",
|
|
2127
|
+
source: "export interface Md3ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n variant?: Md3ButtonVariant;\n /** Leading icon element. */\n icon?: React.ReactNode;\n}"
|
|
2128
|
+
}
|
|
2129
|
+
],
|
|
2130
|
+
readme: '# @nucleux/md3-button\n\nMaterial 3 button (filled, tonal, outlined, text, elevated) \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/md3-button @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Md3Button } from "@nucleux/md3-button";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
2131
|
+
peerDependencies: {
|
|
2132
|
+
react: ">=18",
|
|
2133
|
+
"react-dom": ">=18"
|
|
2134
|
+
}
|
|
2135
|
+
},
|
|
2136
|
+
{
|
|
2137
|
+
name: "md3-card",
|
|
2138
|
+
package: "@nucleux/md3-card",
|
|
2139
|
+
kind: "component",
|
|
2140
|
+
description: "A Material Design 3 card surface (elevated, filled, outlined).",
|
|
2141
|
+
summary: "Material 3 card (elevated, filled, outlined) \u2014 Nucleux agentic UI for React.",
|
|
2142
|
+
keywords: [
|
|
2143
|
+
"nucleux",
|
|
2144
|
+
"react",
|
|
2145
|
+
"ui",
|
|
2146
|
+
"components",
|
|
2147
|
+
"agentic",
|
|
2148
|
+
"ai",
|
|
2149
|
+
"tailwind",
|
|
2150
|
+
"md3-card"
|
|
2151
|
+
],
|
|
2152
|
+
exports: [
|
|
2153
|
+
"Md3Card",
|
|
2154
|
+
"Md3CardVariant",
|
|
2155
|
+
"Md3CardProps"
|
|
2156
|
+
],
|
|
2157
|
+
components: [
|
|
2158
|
+
"Md3Card"
|
|
2159
|
+
],
|
|
2160
|
+
import: 'import { Md3Card } from "@nucleux/md3-card";',
|
|
2161
|
+
installSingle: "pnpm add @nucleux/md3-card @nucleux/tokens",
|
|
2162
|
+
props: [
|
|
2163
|
+
{
|
|
2164
|
+
name: "Md3CardProps",
|
|
2165
|
+
source: "export interface Md3CardProps extends React.HTMLAttributes<HTMLDivElement> {\n variant?: Md3CardVariant;\n /** Add hover/press state layer + pointer cursor (for actionable cards). */\n interactive?: boolean;\n}"
|
|
2166
|
+
}
|
|
2167
|
+
],
|
|
2168
|
+
readme: '# @nucleux/md3-card\n\nMaterial 3 card (elevated, filled, outlined) \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/md3-card @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Md3Card } from "@nucleux/md3-card";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
2169
|
+
peerDependencies: {
|
|
2170
|
+
react: ">=18",
|
|
2171
|
+
"react-dom": ">=18"
|
|
2172
|
+
}
|
|
2173
|
+
},
|
|
2174
|
+
{
|
|
2175
|
+
name: "md3-checkbox",
|
|
2176
|
+
package: "@nucleux/md3-checkbox",
|
|
2177
|
+
kind: "component",
|
|
2178
|
+
description: "A Material Design 3 checkbox with a circular state layer and error-free tokens.",
|
|
2179
|
+
summary: "Material 3 checkbox \u2014 Nucleux agentic UI for React.",
|
|
2180
|
+
keywords: [
|
|
2181
|
+
"nucleux",
|
|
2182
|
+
"react",
|
|
2183
|
+
"ui",
|
|
2184
|
+
"components",
|
|
2185
|
+
"agentic",
|
|
2186
|
+
"ai",
|
|
2187
|
+
"tailwind",
|
|
2188
|
+
"md3-checkbox"
|
|
2189
|
+
],
|
|
2190
|
+
exports: [
|
|
2191
|
+
"Md3Checkbox",
|
|
2192
|
+
"Md3CheckboxProps"
|
|
2193
|
+
],
|
|
2194
|
+
components: [
|
|
2195
|
+
"Md3Checkbox"
|
|
2196
|
+
],
|
|
2197
|
+
import: 'import { Md3Checkbox } from "@nucleux/md3-checkbox";',
|
|
2198
|
+
installSingle: "pnpm add @nucleux/md3-checkbox @nucleux/tokens",
|
|
2199
|
+
props: [
|
|
2200
|
+
{
|
|
2201
|
+
name: "Md3CheckboxProps",
|
|
2202
|
+
source: 'export interface Md3CheckboxProps\n extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onChange" | "type"> {\n checked?: boolean;\n defaultChecked?: boolean;\n indeterminate?: boolean;\n onCheckedChange?: (checked: boolean) => void;\n}'
|
|
2203
|
+
}
|
|
2204
|
+
],
|
|
2205
|
+
readme: '# @nucleux/md3-checkbox\n\nMaterial 3 checkbox \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/md3-checkbox @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Md3Checkbox } from "@nucleux/md3-checkbox";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
2206
|
+
peerDependencies: {
|
|
2207
|
+
react: ">=18",
|
|
2208
|
+
"react-dom": ">=18"
|
|
2209
|
+
}
|
|
2210
|
+
},
|
|
2211
|
+
{
|
|
2212
|
+
name: "md3-chip",
|
|
2213
|
+
package: "@nucleux/md3-chip",
|
|
2214
|
+
kind: "component",
|
|
2215
|
+
description: "A Material Design 3 chip (assist, filter, input, suggestion). Filter chips\ntoggle a selected state; input chips render a trailing remove affordance.",
|
|
2216
|
+
summary: "Material 3 chip (assist, filter, input, suggestion) \u2014 Nucleux agentic UI for React.",
|
|
2217
|
+
keywords: [
|
|
2218
|
+
"nucleux",
|
|
2219
|
+
"react",
|
|
2220
|
+
"ui",
|
|
2221
|
+
"components",
|
|
2222
|
+
"agentic",
|
|
2223
|
+
"ai",
|
|
2224
|
+
"tailwind",
|
|
2225
|
+
"md3-chip"
|
|
318
2226
|
],
|
|
319
2227
|
exports: [
|
|
320
|
-
"
|
|
321
|
-
"
|
|
322
|
-
"
|
|
323
|
-
"ButtonProps"
|
|
2228
|
+
"Md3Chip",
|
|
2229
|
+
"Md3ChipVariant",
|
|
2230
|
+
"Md3ChipProps"
|
|
324
2231
|
],
|
|
325
2232
|
components: [
|
|
326
|
-
"
|
|
327
|
-
"ButtonSize"
|
|
2233
|
+
"Md3Chip"
|
|
328
2234
|
],
|
|
329
|
-
import: 'import {
|
|
330
|
-
installSingle: "pnpm add @nucleux/
|
|
2235
|
+
import: 'import { Md3Chip } from "@nucleux/md3-chip";',
|
|
2236
|
+
installSingle: "pnpm add @nucleux/md3-chip @nucleux/tokens",
|
|
331
2237
|
props: [
|
|
332
2238
|
{
|
|
333
|
-
name: "
|
|
334
|
-
source:
|
|
2239
|
+
name: "Md3ChipProps",
|
|
2240
|
+
source: 'export interface Md3ChipProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onSelect"> {\n variant?: Md3ChipVariant;\n /** Filter chips: selected state (shows a leading check). */\n selected?: boolean;\n /** Leading icon (assist/input/suggestion). */\n icon?: React.ReactNode;\n /** Input chips: renders a trailing remove button and fires this on click. */\n onRemove?: () => void;\n}'
|
|
335
2241
|
}
|
|
336
2242
|
],
|
|
337
|
-
readme: '# @nucleux/
|
|
2243
|
+
readme: '# @nucleux/md3-chip\n\nMaterial 3 chip (assist, filter, input, suggestion) \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/md3-chip @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Md3Chip } from "@nucleux/md3-chip";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
338
2244
|
peerDependencies: {
|
|
339
2245
|
react: ">=18",
|
|
340
2246
|
"react-dom": ">=18"
|
|
341
2247
|
}
|
|
342
2248
|
},
|
|
343
2249
|
{
|
|
344
|
-
name: "
|
|
345
|
-
package: "@nucleux/
|
|
2250
|
+
name: "md3-dialog",
|
|
2251
|
+
package: "@nucleux/md3-dialog",
|
|
346
2252
|
kind: "component",
|
|
347
|
-
description: "
|
|
348
|
-
summary: "
|
|
2253
|
+
description: "A Material Design 3 basic dialog with scrim, headline, body, and actions.",
|
|
2254
|
+
summary: "Material 3 dialog \u2014 Nucleux agentic UI for React.",
|
|
349
2255
|
keywords: [
|
|
350
2256
|
"nucleux",
|
|
351
2257
|
"react",
|
|
@@ -354,47 +2260,35 @@ var catalog_default = {
|
|
|
354
2260
|
"agentic",
|
|
355
2261
|
"ai",
|
|
356
2262
|
"tailwind",
|
|
357
|
-
"
|
|
2263
|
+
"md3-dialog"
|
|
358
2264
|
],
|
|
359
2265
|
exports: [
|
|
360
|
-
"
|
|
361
|
-
"
|
|
362
|
-
"CardTitle",
|
|
363
|
-
"CardDescription",
|
|
364
|
-
"CardAction",
|
|
365
|
-
"CardContent",
|
|
366
|
-
"CardDivider",
|
|
367
|
-
"CardContainerProps"
|
|
2266
|
+
"Md3Dialog",
|
|
2267
|
+
"Md3DialogProps"
|
|
368
2268
|
],
|
|
369
2269
|
components: [
|
|
370
|
-
"
|
|
371
|
-
"CardHeader",
|
|
372
|
-
"CardTitle",
|
|
373
|
-
"CardDescription",
|
|
374
|
-
"CardAction",
|
|
375
|
-
"CardContent",
|
|
376
|
-
"CardDivider"
|
|
2270
|
+
"Md3Dialog"
|
|
377
2271
|
],
|
|
378
|
-
import: 'import {
|
|
379
|
-
installSingle: "pnpm add @nucleux/
|
|
2272
|
+
import: 'import { Md3Dialog } from "@nucleux/md3-dialog";',
|
|
2273
|
+
installSingle: "pnpm add @nucleux/md3-dialog @nucleux/tokens",
|
|
380
2274
|
props: [
|
|
381
2275
|
{
|
|
382
|
-
name: "
|
|
383
|
-
source: "
|
|
2276
|
+
name: "Md3DialogProps",
|
|
2277
|
+
source: "export interface Md3DialogProps {\n open: boolean;\n onOpenChange: (open: boolean) => void;\n headline: React.ReactNode;\n /** Optional hero icon, centered above the headline. */\n icon?: React.ReactNode;\n /** Supporting body content. */\n children?: React.ReactNode;\n /** Action buttons (typically text buttons), right-aligned. */\n actions?: React.ReactNode;\n /** Close on scrim click / Escape (default true). */\n dismissible?: boolean;\n className?: string;\n}"
|
|
384
2278
|
}
|
|
385
2279
|
],
|
|
386
|
-
readme: '# @nucleux/
|
|
2280
|
+
readme: '# @nucleux/md3-dialog\n\nMaterial 3 dialog \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/md3-dialog @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Md3Dialog } from "@nucleux/md3-dialog";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
387
2281
|
peerDependencies: {
|
|
388
2282
|
react: ">=18",
|
|
389
2283
|
"react-dom": ">=18"
|
|
390
2284
|
}
|
|
391
2285
|
},
|
|
392
2286
|
{
|
|
393
|
-
name: "
|
|
394
|
-
package: "@nucleux/
|
|
2287
|
+
name: "md3-fab",
|
|
2288
|
+
package: "@nucleux/md3-fab",
|
|
395
2289
|
kind: "component",
|
|
396
|
-
description: "
|
|
397
|
-
summary: "
|
|
2290
|
+
description: "A Material Design 3 floating action button. Sizes small/regular/large plus an\nextended variant with a label; four container colors. Elevated with a state layer.",
|
|
2291
|
+
summary: "Material 3 floating action button \u2014 Nucleux agentic UI for React.",
|
|
398
2292
|
keywords: [
|
|
399
2293
|
"nucleux",
|
|
400
2294
|
"react",
|
|
@@ -403,35 +2297,39 @@ var catalog_default = {
|
|
|
403
2297
|
"agentic",
|
|
404
2298
|
"ai",
|
|
405
2299
|
"tailwind",
|
|
406
|
-
"
|
|
2300
|
+
"md3-fab"
|
|
407
2301
|
],
|
|
408
2302
|
exports: [
|
|
409
|
-
"
|
|
410
|
-
"
|
|
2303
|
+
"Md3Fab",
|
|
2304
|
+
"Md3FabSize",
|
|
2305
|
+
"Md3FabColor",
|
|
2306
|
+
"Md3FabProps"
|
|
411
2307
|
],
|
|
412
2308
|
components: [
|
|
413
|
-
"
|
|
2309
|
+
"Md3Fab",
|
|
2310
|
+
"Md3FabSize",
|
|
2311
|
+
"Md3FabColor"
|
|
414
2312
|
],
|
|
415
|
-
import: 'import {
|
|
416
|
-
installSingle: "pnpm add @nucleux/
|
|
2313
|
+
import: 'import { Md3Fab, Md3FabSize, Md3FabColor } from "@nucleux/md3-fab";',
|
|
2314
|
+
installSingle: "pnpm add @nucleux/md3-fab @nucleux/tokens",
|
|
417
2315
|
props: [
|
|
418
2316
|
{
|
|
419
|
-
name: "
|
|
420
|
-
source:
|
|
2317
|
+
name: "Md3FabProps",
|
|
2318
|
+
source: "export interface Md3FabProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n size?: Md3FabSize;\n color?: Md3FabColor;\n icon: React.ReactNode;\n}"
|
|
421
2319
|
}
|
|
422
2320
|
],
|
|
423
|
-
readme: '# @nucleux/
|
|
2321
|
+
readme: '# @nucleux/md3-fab\n\nMaterial 3 floating action button \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/md3-fab @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Md3Fab } from "@nucleux/md3-fab";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
424
2322
|
peerDependencies: {
|
|
425
2323
|
react: ">=18",
|
|
426
2324
|
"react-dom": ">=18"
|
|
427
2325
|
}
|
|
428
2326
|
},
|
|
429
2327
|
{
|
|
430
|
-
name: "
|
|
431
|
-
package: "@nucleux/
|
|
2328
|
+
name: "md3-icon-button",
|
|
2329
|
+
package: "@nucleux/md3-icon-button",
|
|
432
2330
|
kind: "component",
|
|
433
|
-
description: "A
|
|
434
|
-
summary: "
|
|
2331
|
+
description: "A Material Design 3 icon button (standard, filled, tonal, outlined).",
|
|
2332
|
+
summary: "Material 3 icon button \u2014 Nucleux agentic UI for React.",
|
|
435
2333
|
keywords: [
|
|
436
2334
|
"nucleux",
|
|
437
2335
|
"react",
|
|
@@ -440,42 +2338,36 @@ var catalog_default = {
|
|
|
440
2338
|
"agentic",
|
|
441
2339
|
"ai",
|
|
442
2340
|
"tailwind",
|
|
443
|
-
"
|
|
2341
|
+
"md3-icon-button"
|
|
444
2342
|
],
|
|
445
2343
|
exports: [
|
|
446
|
-
"
|
|
447
|
-
"
|
|
448
|
-
"
|
|
449
|
-
"ChecklistProps"
|
|
2344
|
+
"Md3IconButton",
|
|
2345
|
+
"Md3IconButtonVariant",
|
|
2346
|
+
"Md3IconButtonProps"
|
|
450
2347
|
],
|
|
451
2348
|
components: [
|
|
452
|
-
"
|
|
453
|
-
"Checklist"
|
|
2349
|
+
"Md3IconButton"
|
|
454
2350
|
],
|
|
455
|
-
import: 'import {
|
|
456
|
-
installSingle: "pnpm add @nucleux/
|
|
2351
|
+
import: 'import { Md3IconButton } from "@nucleux/md3-icon-button";',
|
|
2352
|
+
installSingle: "pnpm add @nucleux/md3-icon-button @nucleux/tokens",
|
|
457
2353
|
props: [
|
|
458
2354
|
{
|
|
459
|
-
name: "
|
|
460
|
-
source: 'export interface
|
|
461
|
-
},
|
|
462
|
-
{
|
|
463
|
-
name: "ChecklistProps",
|
|
464
|
-
source: "export interface ChecklistProps extends React.HTMLAttributes<HTMLUListElement> {\n /** Show hairline dividers between items. */\n divided?: boolean;\n}"
|
|
2355
|
+
name: "Md3IconButtonProps",
|
|
2356
|
+
source: 'export interface Md3IconButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n variant?: Md3IconButtonVariant;\n /** Toggle-selected state (affects filled/tonal background). */\n selected?: boolean;\n /** Required for icon-only buttons. */\n "aria-label": string;\n}'
|
|
465
2357
|
}
|
|
466
2358
|
],
|
|
467
|
-
readme: '# @nucleux/
|
|
2359
|
+
readme: '# @nucleux/md3-icon-button\n\nMaterial 3 icon button \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/md3-icon-button @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Md3IconButton } from "@nucleux/md3-icon-button";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
468
2360
|
peerDependencies: {
|
|
469
2361
|
react: ">=18",
|
|
470
2362
|
"react-dom": ">=18"
|
|
471
2363
|
}
|
|
472
2364
|
},
|
|
473
2365
|
{
|
|
474
|
-
name: "
|
|
475
|
-
package: "@nucleux/
|
|
2366
|
+
name: "md3-list",
|
|
2367
|
+
package: "@nucleux/md3-list",
|
|
476
2368
|
kind: "component",
|
|
477
|
-
description: "A
|
|
478
|
-
summary: "
|
|
2369
|
+
description: "A Material Design 3 list container. Compose with Md3ListItem.",
|
|
2370
|
+
summary: "Material 3 list \u2014 Nucleux agentic UI for React.",
|
|
479
2371
|
keywords: [
|
|
480
2372
|
"nucleux",
|
|
481
2373
|
"react",
|
|
@@ -484,35 +2376,37 @@ var catalog_default = {
|
|
|
484
2376
|
"agentic",
|
|
485
2377
|
"ai",
|
|
486
2378
|
"tailwind",
|
|
487
|
-
"
|
|
2379
|
+
"md3-list"
|
|
488
2380
|
],
|
|
489
2381
|
exports: [
|
|
490
|
-
"
|
|
491
|
-
"
|
|
2382
|
+
"Md3List",
|
|
2383
|
+
"Md3ListItem",
|
|
2384
|
+
"Md3ListItemProps"
|
|
492
2385
|
],
|
|
493
2386
|
components: [
|
|
494
|
-
"
|
|
2387
|
+
"Md3List",
|
|
2388
|
+
"Md3ListItem"
|
|
495
2389
|
],
|
|
496
|
-
import: 'import {
|
|
497
|
-
installSingle: "pnpm add @nucleux/
|
|
2390
|
+
import: 'import { Md3List, Md3ListItem } from "@nucleux/md3-list";',
|
|
2391
|
+
installSingle: "pnpm add @nucleux/md3-list @nucleux/tokens",
|
|
498
2392
|
props: [
|
|
499
2393
|
{
|
|
500
|
-
name: "
|
|
501
|
-
source: 'export interface
|
|
2394
|
+
name: "Md3ListItemProps",
|
|
2395
|
+
source: 'export interface Md3ListItemProps extends React.HTMLAttributes<HTMLDivElement> {\n headline: React.ReactNode;\n supportingText?: React.ReactNode;\n leading?: React.ReactNode;\n trailing?: React.ReactNode;\n /** Add a hover/press state layer + role="button" for actionable rows. */\n interactive?: boolean;\n}'
|
|
502
2396
|
}
|
|
503
2397
|
],
|
|
504
|
-
readme: '# @nucleux/
|
|
2398
|
+
readme: '# @nucleux/md3-list\n\nMaterial 3 list \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/md3-list @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Md3List } from "@nucleux/md3-list";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
505
2399
|
peerDependencies: {
|
|
506
2400
|
react: ">=18",
|
|
507
2401
|
"react-dom": ">=18"
|
|
508
2402
|
}
|
|
509
2403
|
},
|
|
510
2404
|
{
|
|
511
|
-
name: "
|
|
512
|
-
package: "@nucleux/
|
|
2405
|
+
name: "md3-menu",
|
|
2406
|
+
package: "@nucleux/md3-menu",
|
|
513
2407
|
kind: "component",
|
|
514
|
-
description: "A
|
|
515
|
-
summary: "
|
|
2408
|
+
description: "A Material Design 3 menu surface (presentational \u2014 pair with your own trigger\nand positioning). Compose with Md3MenuItem and Md3MenuDivider.",
|
|
2409
|
+
summary: "Material 3 menu surface \u2014 Nucleux agentic UI for React.",
|
|
516
2410
|
keywords: [
|
|
517
2411
|
"nucleux",
|
|
518
2412
|
"react",
|
|
@@ -521,35 +2415,39 @@ var catalog_default = {
|
|
|
521
2415
|
"agentic",
|
|
522
2416
|
"ai",
|
|
523
2417
|
"tailwind",
|
|
524
|
-
"
|
|
2418
|
+
"md3-menu"
|
|
525
2419
|
],
|
|
526
2420
|
exports: [
|
|
527
|
-
"
|
|
528
|
-
"
|
|
2421
|
+
"Md3Menu",
|
|
2422
|
+
"Md3MenuItem",
|
|
2423
|
+
"Md3MenuDivider",
|
|
2424
|
+
"Md3MenuItemProps"
|
|
529
2425
|
],
|
|
530
2426
|
components: [
|
|
531
|
-
"
|
|
2427
|
+
"Md3Menu",
|
|
2428
|
+
"Md3MenuItem",
|
|
2429
|
+
"Md3MenuDivider"
|
|
532
2430
|
],
|
|
533
|
-
import: 'import {
|
|
534
|
-
installSingle: "pnpm add @nucleux/
|
|
2431
|
+
import: 'import { Md3Menu, Md3MenuItem, Md3MenuDivider } from "@nucleux/md3-menu";',
|
|
2432
|
+
installSingle: "pnpm add @nucleux/md3-menu @nucleux/tokens",
|
|
535
2433
|
props: [
|
|
536
2434
|
{
|
|
537
|
-
name: "
|
|
538
|
-
source:
|
|
2435
|
+
name: "Md3MenuItemProps",
|
|
2436
|
+
source: "export interface Md3MenuItemProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n icon?: React.ReactNode;\n /** Trailing content \u2014 a shortcut hint or submenu marker. */\n trailing?: React.ReactNode;\n}"
|
|
539
2437
|
}
|
|
540
2438
|
],
|
|
541
|
-
readme: '# @nucleux/
|
|
2439
|
+
readme: '# @nucleux/md3-menu\n\nMaterial 3 menu surface \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/md3-menu @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Md3Menu } from "@nucleux/md3-menu";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
542
2440
|
peerDependencies: {
|
|
543
2441
|
react: ">=18",
|
|
544
2442
|
"react-dom": ">=18"
|
|
545
2443
|
}
|
|
546
2444
|
},
|
|
547
2445
|
{
|
|
548
|
-
name: "
|
|
549
|
-
package: "@nucleux/
|
|
2446
|
+
name: "md3-navigation-bar",
|
|
2447
|
+
package: "@nucleux/md3-navigation-bar",
|
|
550
2448
|
kind: "component",
|
|
551
|
-
description: "A
|
|
552
|
-
summary: "
|
|
2449
|
+
description: "A Material Design 3 bottom navigation bar. Compose with Md3NavigationBarItem.",
|
|
2450
|
+
summary: "Material 3 bottom navigation bar \u2014 Nucleux agentic UI for React.",
|
|
553
2451
|
keywords: [
|
|
554
2452
|
"nucleux",
|
|
555
2453
|
"react",
|
|
@@ -558,43 +2456,42 @@ var catalog_default = {
|
|
|
558
2456
|
"agentic",
|
|
559
2457
|
"ai",
|
|
560
2458
|
"tailwind",
|
|
561
|
-
"
|
|
2459
|
+
"md3-navigation-bar"
|
|
562
2460
|
],
|
|
563
2461
|
exports: [
|
|
564
|
-
"
|
|
565
|
-
"
|
|
566
|
-
"
|
|
567
|
-
"
|
|
568
|
-
"DialogFooter",
|
|
569
|
-
"DialogProps"
|
|
2462
|
+
"Md3NavigationBar",
|
|
2463
|
+
"Md3NavigationBarItem",
|
|
2464
|
+
"Md3NavigationBarProps",
|
|
2465
|
+
"Md3NavigationBarItemProps"
|
|
570
2466
|
],
|
|
571
2467
|
components: [
|
|
572
|
-
"
|
|
573
|
-
"
|
|
574
|
-
"DialogTitle",
|
|
575
|
-
"DialogDescription",
|
|
576
|
-
"DialogFooter"
|
|
2468
|
+
"Md3NavigationBar",
|
|
2469
|
+
"Md3NavigationBarItem"
|
|
577
2470
|
],
|
|
578
|
-
import: 'import {
|
|
579
|
-
installSingle: "pnpm add @nucleux/
|
|
2471
|
+
import: 'import { Md3NavigationBar, Md3NavigationBarItem } from "@nucleux/md3-navigation-bar";',
|
|
2472
|
+
installSingle: "pnpm add @nucleux/md3-navigation-bar @nucleux/tokens",
|
|
580
2473
|
props: [
|
|
581
2474
|
{
|
|
582
|
-
name: "
|
|
583
|
-
source:
|
|
2475
|
+
name: "Md3NavigationBarProps",
|
|
2476
|
+
source: 'export interface Md3NavigationBarProps\n extends Omit<React.HTMLAttributes<HTMLElement>, "defaultValue"> {\n value?: string;\n defaultValue?: string;\n onValueChange?: (value: string) => void;\n}'
|
|
2477
|
+
},
|
|
2478
|
+
{
|
|
2479
|
+
name: "Md3NavigationBarItemProps",
|
|
2480
|
+
source: "export interface Md3NavigationBarItemProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n value: string;\n icon: React.ReactNode;\n label: React.ReactNode;\n}"
|
|
584
2481
|
}
|
|
585
2482
|
],
|
|
586
|
-
readme: '# @nucleux/
|
|
2483
|
+
readme: '# @nucleux/md3-navigation-bar\n\nMaterial 3 bottom navigation bar \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/md3-navigation-bar @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Md3NavigationBar } from "@nucleux/md3-navigation-bar";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
587
2484
|
peerDependencies: {
|
|
588
2485
|
react: ">=18",
|
|
589
2486
|
"react-dom": ">=18"
|
|
590
2487
|
}
|
|
591
2488
|
},
|
|
592
2489
|
{
|
|
593
|
-
name: "
|
|
594
|
-
package: "@nucleux/
|
|
2490
|
+
name: "md3-navigation-rail",
|
|
2491
|
+
package: "@nucleux/md3-navigation-rail",
|
|
595
2492
|
kind: "component",
|
|
596
|
-
description:
|
|
597
|
-
summary: "
|
|
2493
|
+
description: "A Material Design 3 navigation rail. Compose with Md3NavigationRailItem.",
|
|
2494
|
+
summary: "Material 3 navigation rail \u2014 Nucleux agentic UI for React.",
|
|
598
2495
|
keywords: [
|
|
599
2496
|
"nucleux",
|
|
600
2497
|
"react",
|
|
@@ -603,38 +2500,42 @@ var catalog_default = {
|
|
|
603
2500
|
"agentic",
|
|
604
2501
|
"ai",
|
|
605
2502
|
"tailwind",
|
|
606
|
-
"
|
|
607
|
-
"assumption"
|
|
2503
|
+
"md3-navigation-rail"
|
|
608
2504
|
],
|
|
609
2505
|
exports: [
|
|
610
|
-
"
|
|
611
|
-
"
|
|
612
|
-
"
|
|
2506
|
+
"Md3NavigationRail",
|
|
2507
|
+
"Md3NavigationRailItem",
|
|
2508
|
+
"Md3NavigationRailProps",
|
|
2509
|
+
"Md3NavigationRailItemProps"
|
|
613
2510
|
],
|
|
614
2511
|
components: [
|
|
615
|
-
"
|
|
616
|
-
"
|
|
2512
|
+
"Md3NavigationRail",
|
|
2513
|
+
"Md3NavigationRailItem"
|
|
617
2514
|
],
|
|
618
|
-
import: 'import {
|
|
619
|
-
installSingle: "pnpm add @nucleux/
|
|
2515
|
+
import: 'import { Md3NavigationRail, Md3NavigationRailItem } from "@nucleux/md3-navigation-rail";',
|
|
2516
|
+
installSingle: "pnpm add @nucleux/md3-navigation-rail @nucleux/tokens",
|
|
620
2517
|
props: [
|
|
621
2518
|
{
|
|
622
|
-
name: "
|
|
623
|
-
source:
|
|
2519
|
+
name: "Md3NavigationRailProps",
|
|
2520
|
+
source: 'export interface Md3NavigationRailProps\n extends Omit<React.HTMLAttributes<HTMLElement>, "defaultValue"> {\n value?: string;\n defaultValue?: string;\n onValueChange?: (value: string) => void;\n /** Optional header content (e.g. a menu button or FAB), shown at the top. */\n header?: React.ReactNode;\n}'
|
|
2521
|
+
},
|
|
2522
|
+
{
|
|
2523
|
+
name: "Md3NavigationRailItemProps",
|
|
2524
|
+
source: "export interface Md3NavigationRailItemProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n value: string;\n icon: React.ReactNode;\n label: React.ReactNode;\n}"
|
|
624
2525
|
}
|
|
625
2526
|
],
|
|
626
|
-
readme: '# @nucleux/
|
|
2527
|
+
readme: '# @nucleux/md3-navigation-rail\n\nMaterial 3 navigation rail \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/md3-navigation-rail @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Md3NavigationRail } from "@nucleux/md3-navigation-rail";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
627
2528
|
peerDependencies: {
|
|
628
2529
|
react: ">=18",
|
|
629
2530
|
"react-dom": ">=18"
|
|
630
2531
|
}
|
|
631
2532
|
},
|
|
632
2533
|
{
|
|
633
|
-
name: "
|
|
634
|
-
package: "@nucleux/
|
|
2534
|
+
name: "md3-radio",
|
|
2535
|
+
package: "@nucleux/md3-radio",
|
|
635
2536
|
kind: "component",
|
|
636
|
-
description: "A
|
|
637
|
-
summary: "
|
|
2537
|
+
description: "A Material Design 3 radio group. Compose with {@link Md3Radio}.",
|
|
2538
|
+
summary: "Material 3 radio group \u2014 Nucleux agentic UI for React.",
|
|
638
2539
|
keywords: [
|
|
639
2540
|
"nucleux",
|
|
640
2541
|
"react",
|
|
@@ -643,35 +2544,42 @@ var catalog_default = {
|
|
|
643
2544
|
"agentic",
|
|
644
2545
|
"ai",
|
|
645
2546
|
"tailwind",
|
|
646
|
-
"
|
|
2547
|
+
"md3-radio"
|
|
647
2548
|
],
|
|
648
2549
|
exports: [
|
|
649
|
-
"
|
|
650
|
-
"
|
|
2550
|
+
"Md3RadioGroup",
|
|
2551
|
+
"Md3Radio",
|
|
2552
|
+
"Md3RadioGroupProps",
|
|
2553
|
+
"Md3RadioProps"
|
|
651
2554
|
],
|
|
652
2555
|
components: [
|
|
653
|
-
"
|
|
2556
|
+
"Md3RadioGroup",
|
|
2557
|
+
"Md3Radio"
|
|
654
2558
|
],
|
|
655
|
-
import: 'import {
|
|
656
|
-
installSingle: "pnpm add @nucleux/
|
|
2559
|
+
import: 'import { Md3RadioGroup, Md3Radio } from "@nucleux/md3-radio";',
|
|
2560
|
+
installSingle: "pnpm add @nucleux/md3-radio @nucleux/tokens",
|
|
657
2561
|
props: [
|
|
658
2562
|
{
|
|
659
|
-
name: "
|
|
660
|
-
source: 'export interface
|
|
2563
|
+
name: "Md3RadioGroupProps",
|
|
2564
|
+
source: 'export interface Md3RadioGroupProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue"> {\n value?: string;\n defaultValue?: string;\n onValueChange?: (value: string) => void;\n /** Accessible label for the group. */\n label?: string;\n}'
|
|
2565
|
+
},
|
|
2566
|
+
{
|
|
2567
|
+
name: "Md3RadioProps",
|
|
2568
|
+
source: 'export interface Md3RadioProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "value"> {\n value: string;\n}'
|
|
661
2569
|
}
|
|
662
2570
|
],
|
|
663
|
-
readme: '# @nucleux/
|
|
2571
|
+
readme: '# @nucleux/md3-radio\n\nMaterial 3 radio group \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/md3-radio @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Md3Radio } from "@nucleux/md3-radio";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
664
2572
|
peerDependencies: {
|
|
665
2573
|
react: ">=18",
|
|
666
2574
|
"react-dom": ">=18"
|
|
667
2575
|
}
|
|
668
2576
|
},
|
|
669
2577
|
{
|
|
670
|
-
name: "
|
|
671
|
-
package: "@nucleux/
|
|
2578
|
+
name: "md3-slider",
|
|
2579
|
+
package: "@nucleux/md3-slider",
|
|
672
2580
|
kind: "component",
|
|
673
|
-
description: "
|
|
674
|
-
summary: "
|
|
2581
|
+
description: "A Material Design 3 slider (single value) with pointer + keyboard control.",
|
|
2582
|
+
summary: "Material 3 slider \u2014 Nucleux agentic UI for React.",
|
|
675
2583
|
keywords: [
|
|
676
2584
|
"nucleux",
|
|
677
2585
|
"react",
|
|
@@ -680,35 +2588,35 @@ var catalog_default = {
|
|
|
680
2588
|
"agentic",
|
|
681
2589
|
"ai",
|
|
682
2590
|
"tailwind",
|
|
683
|
-
"
|
|
2591
|
+
"md3-slider"
|
|
684
2592
|
],
|
|
685
2593
|
exports: [
|
|
686
|
-
"
|
|
687
|
-
"
|
|
2594
|
+
"Md3Slider",
|
|
2595
|
+
"Md3SliderProps"
|
|
688
2596
|
],
|
|
689
2597
|
components: [
|
|
690
|
-
"
|
|
2598
|
+
"Md3Slider"
|
|
691
2599
|
],
|
|
692
|
-
import: 'import {
|
|
693
|
-
installSingle: "pnpm add @nucleux/
|
|
2600
|
+
import: 'import { Md3Slider } from "@nucleux/md3-slider";',
|
|
2601
|
+
installSingle: "pnpm add @nucleux/md3-slider @nucleux/tokens",
|
|
694
2602
|
props: [
|
|
695
2603
|
{
|
|
696
|
-
name: "
|
|
697
|
-
source:
|
|
2604
|
+
name: "Md3SliderProps",
|
|
2605
|
+
source: 'export interface Md3SliderProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, "defaultValue" | "onChange"> {\n value?: number;\n defaultValue?: number;\n min?: number;\n max?: number;\n step?: number;\n disabled?: boolean;\n onValueChange?: (value: number) => void;\n "aria-label"?: string;\n}'
|
|
698
2606
|
}
|
|
699
2607
|
],
|
|
700
|
-
readme: '# @nucleux/
|
|
2608
|
+
readme: '# @nucleux/md3-slider\n\nMaterial 3 slider \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/md3-slider @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Md3Slider } from "@nucleux/md3-slider";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
701
2609
|
peerDependencies: {
|
|
702
2610
|
react: ">=18",
|
|
703
2611
|
"react-dom": ">=18"
|
|
704
2612
|
}
|
|
705
2613
|
},
|
|
706
2614
|
{
|
|
707
|
-
name: "
|
|
708
|
-
package: "@nucleux/
|
|
709
|
-
kind: "
|
|
710
|
-
description: "
|
|
711
|
-
summary: "
|
|
2615
|
+
name: "md3-snackbar",
|
|
2616
|
+
package: "@nucleux/md3-snackbar",
|
|
2617
|
+
kind: "component",
|
|
2618
|
+
description: "A Material Design 3 snackbar. Presentational + controlled via `open`; position\nit with `className` (e.g. fixed bottom-4). Uses the inverse surface roles.",
|
|
2619
|
+
summary: "Material 3 snackbar \u2014 Nucleux agentic UI for React.",
|
|
712
2620
|
keywords: [
|
|
713
2621
|
"nucleux",
|
|
714
2622
|
"react",
|
|
@@ -717,25 +2625,35 @@ var catalog_default = {
|
|
|
717
2625
|
"agentic",
|
|
718
2626
|
"ai",
|
|
719
2627
|
"tailwind",
|
|
720
|
-
"
|
|
2628
|
+
"md3-snackbar"
|
|
721
2629
|
],
|
|
722
|
-
exports: [
|
|
723
|
-
|
|
724
|
-
|
|
725
|
-
|
|
726
|
-
|
|
727
|
-
|
|
2630
|
+
exports: [
|
|
2631
|
+
"Md3Snackbar",
|
|
2632
|
+
"Md3SnackbarProps"
|
|
2633
|
+
],
|
|
2634
|
+
components: [
|
|
2635
|
+
"Md3Snackbar"
|
|
2636
|
+
],
|
|
2637
|
+
import: 'import { Md3Snackbar } from "@nucleux/md3-snackbar";',
|
|
2638
|
+
installSingle: "pnpm add @nucleux/md3-snackbar @nucleux/tokens",
|
|
2639
|
+
props: [
|
|
2640
|
+
{
|
|
2641
|
+
name: "Md3SnackbarProps",
|
|
2642
|
+
source: "export interface Md3SnackbarProps extends React.HTMLAttributes<HTMLDivElement> {\n open: boolean;\n message: React.ReactNode;\n /** Optional trailing action label (rendered as a text button). */\n action?: string;\n onAction?: () => void;\n}"
|
|
2643
|
+
}
|
|
2644
|
+
],
|
|
2645
|
+
readme: '# @nucleux/md3-snackbar\n\nMaterial 3 snackbar \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/md3-snackbar @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Md3Snackbar } from "@nucleux/md3-snackbar";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
728
2646
|
peerDependencies: {
|
|
729
2647
|
react: ">=18",
|
|
730
2648
|
"react-dom": ">=18"
|
|
731
2649
|
}
|
|
732
2650
|
},
|
|
733
2651
|
{
|
|
734
|
-
name: "
|
|
735
|
-
package: "@nucleux/
|
|
2652
|
+
name: "md3-switch",
|
|
2653
|
+
package: "@nucleux/md3-switch",
|
|
736
2654
|
kind: "component",
|
|
737
|
-
description: "
|
|
738
|
-
summary: "
|
|
2655
|
+
description: "A Material Design 3 switch with a growing handle and optional check icon.",
|
|
2656
|
+
summary: "Material 3 switch \u2014 Nucleux agentic UI for React.",
|
|
739
2657
|
keywords: [
|
|
740
2658
|
"nucleux",
|
|
741
2659
|
"react",
|
|
@@ -744,38 +2662,35 @@ var catalog_default = {
|
|
|
744
2662
|
"agentic",
|
|
745
2663
|
"ai",
|
|
746
2664
|
"tailwind",
|
|
747
|
-
"
|
|
2665
|
+
"md3-switch"
|
|
748
2666
|
],
|
|
749
2667
|
exports: [
|
|
750
|
-
"
|
|
751
|
-
"
|
|
752
|
-
"IconButtonSize",
|
|
753
|
-
"IconButtonProps"
|
|
2668
|
+
"Md3Switch",
|
|
2669
|
+
"Md3SwitchProps"
|
|
754
2670
|
],
|
|
755
2671
|
components: [
|
|
756
|
-
"
|
|
757
|
-
"IconButtonSize"
|
|
2672
|
+
"Md3Switch"
|
|
758
2673
|
],
|
|
759
|
-
import: 'import {
|
|
760
|
-
installSingle: "pnpm add @nucleux/
|
|
2674
|
+
import: 'import { Md3Switch } from "@nucleux/md3-switch";',
|
|
2675
|
+
installSingle: "pnpm add @nucleux/md3-switch @nucleux/tokens",
|
|
761
2676
|
props: [
|
|
762
2677
|
{
|
|
763
|
-
name: "
|
|
764
|
-
source: 'export interface
|
|
2678
|
+
name: "Md3SwitchProps",
|
|
2679
|
+
source: 'export interface Md3SwitchProps\n extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onChange"> {\n checked?: boolean;\n defaultChecked?: boolean;\n onCheckedChange?: (checked: boolean) => void;\n /** Show a check icon in the handle when on (Material 3 default behaviour). */\n showIcon?: boolean;\n}'
|
|
765
2680
|
}
|
|
766
2681
|
],
|
|
767
|
-
readme: '# @nucleux/
|
|
2682
|
+
readme: '# @nucleux/md3-switch\n\nMaterial 3 switch \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/md3-switch @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Md3Switch } from "@nucleux/md3-switch";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
768
2683
|
peerDependencies: {
|
|
769
2684
|
react: ">=18",
|
|
770
2685
|
"react-dom": ">=18"
|
|
771
2686
|
}
|
|
772
2687
|
},
|
|
773
2688
|
{
|
|
774
|
-
name: "
|
|
775
|
-
package: "@nucleux/
|
|
2689
|
+
name: "md3-tabs",
|
|
2690
|
+
package: "@nucleux/md3-tabs",
|
|
776
2691
|
kind: "component",
|
|
777
|
-
description: "
|
|
778
|
-
summary: "
|
|
2692
|
+
description: "Material Design 3 primary tabs. Compose Md3TabsList, Md3Tab, Md3TabPanel.",
|
|
2693
|
+
summary: "Material 3 primary tabs \u2014 Nucleux agentic UI for React.",
|
|
779
2694
|
keywords: [
|
|
780
2695
|
"nucleux",
|
|
781
2696
|
"react",
|
|
@@ -784,35 +2699,51 @@ var catalog_default = {
|
|
|
784
2699
|
"agentic",
|
|
785
2700
|
"ai",
|
|
786
2701
|
"tailwind",
|
|
787
|
-
"
|
|
2702
|
+
"md3-tabs"
|
|
788
2703
|
],
|
|
789
2704
|
exports: [
|
|
790
|
-
"
|
|
791
|
-
"
|
|
2705
|
+
"Md3Tabs",
|
|
2706
|
+
"Md3TabsList",
|
|
2707
|
+
"Md3Tab",
|
|
2708
|
+
"Md3TabPanel",
|
|
2709
|
+
"Md3TabsProps",
|
|
2710
|
+
"Md3TabProps",
|
|
2711
|
+
"Md3TabPanelProps"
|
|
792
2712
|
],
|
|
793
2713
|
components: [
|
|
794
|
-
"
|
|
2714
|
+
"Md3Tabs",
|
|
2715
|
+
"Md3TabsList",
|
|
2716
|
+
"Md3Tab",
|
|
2717
|
+
"Md3TabPanel"
|
|
795
2718
|
],
|
|
796
|
-
import: 'import {
|
|
797
|
-
installSingle: "pnpm add @nucleux/
|
|
2719
|
+
import: 'import { Md3Tabs, Md3TabsList, Md3Tab, Md3TabPanel } from "@nucleux/md3-tabs";',
|
|
2720
|
+
installSingle: "pnpm add @nucleux/md3-tabs @nucleux/tokens",
|
|
798
2721
|
props: [
|
|
799
2722
|
{
|
|
800
|
-
name: "
|
|
801
|
-
source: 'export interface
|
|
2723
|
+
name: "Md3TabsProps",
|
|
2724
|
+
source: 'export interface Md3TabsProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "defaultValue"> {\n value?: string;\n defaultValue?: string;\n onValueChange?: (value: string) => void;\n}'
|
|
2725
|
+
},
|
|
2726
|
+
{
|
|
2727
|
+
name: "Md3TabProps",
|
|
2728
|
+
source: "export interface Md3TabProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n value: string;\n icon?: React.ReactNode;\n}"
|
|
2729
|
+
},
|
|
2730
|
+
{
|
|
2731
|
+
name: "Md3TabPanelProps",
|
|
2732
|
+
source: "export interface Md3TabPanelProps extends React.HTMLAttributes<HTMLDivElement> {\n value: string;\n}"
|
|
802
2733
|
}
|
|
803
2734
|
],
|
|
804
|
-
readme: '# @nucleux/
|
|
2735
|
+
readme: '# @nucleux/md3-tabs\n\nMaterial 3 primary tabs \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/md3-tabs @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Md3Tabs } from "@nucleux/md3-tabs";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
805
2736
|
peerDependencies: {
|
|
806
2737
|
react: ">=18",
|
|
807
2738
|
"react-dom": ">=18"
|
|
808
2739
|
}
|
|
809
2740
|
},
|
|
810
2741
|
{
|
|
811
|
-
name: "
|
|
812
|
-
package: "@nucleux/
|
|
2742
|
+
name: "md3-text-field",
|
|
2743
|
+
package: "@nucleux/md3-text-field",
|
|
813
2744
|
kind: "component",
|
|
814
|
-
description: "A
|
|
815
|
-
summary: "
|
|
2745
|
+
description: "A Material Design 3 text field (filled or outlined) with a floating label,\noptional leading/trailing icons, supporting text, and an error state.",
|
|
2746
|
+
summary: "Material 3 text field (filled, outlined) \u2014 Nucleux agentic UI for React.",
|
|
816
2747
|
keywords: [
|
|
817
2748
|
"nucleux",
|
|
818
2749
|
"react",
|
|
@@ -821,24 +2752,25 @@ var catalog_default = {
|
|
|
821
2752
|
"agentic",
|
|
822
2753
|
"ai",
|
|
823
2754
|
"tailwind",
|
|
824
|
-
"
|
|
2755
|
+
"md3-text-field"
|
|
825
2756
|
],
|
|
826
2757
|
exports: [
|
|
827
|
-
"
|
|
828
|
-
"
|
|
2758
|
+
"Md3TextField",
|
|
2759
|
+
"Md3TextFieldVariant",
|
|
2760
|
+
"Md3TextFieldProps"
|
|
829
2761
|
],
|
|
830
2762
|
components: [
|
|
831
|
-
"
|
|
2763
|
+
"Md3TextField"
|
|
832
2764
|
],
|
|
833
|
-
import: 'import {
|
|
834
|
-
installSingle: "pnpm add @nucleux/
|
|
2765
|
+
import: 'import { Md3TextField } from "@nucleux/md3-text-field";',
|
|
2766
|
+
installSingle: "pnpm add @nucleux/md3-text-field @nucleux/tokens",
|
|
835
2767
|
props: [
|
|
836
2768
|
{
|
|
837
|
-
name: "
|
|
838
|
-
source: 'export interface
|
|
2769
|
+
name: "Md3TextFieldProps",
|
|
2770
|
+
source: 'export interface Md3TextFieldProps\n extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "placeholder"> {\n label: string;\n variant?: Md3TextFieldVariant;\n supportingText?: React.ReactNode;\n error?: boolean;\n leadingIcon?: React.ReactNode;\n trailingIcon?: React.ReactNode;\n}'
|
|
839
2771
|
}
|
|
840
2772
|
],
|
|
841
|
-
readme: '# @nucleux/
|
|
2773
|
+
readme: '# @nucleux/md3-text-field\n\nMaterial 3 text field (filled, outlined) \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/md3-text-field @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Md3TextField } from "@nucleux/md3-text-field";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
842
2774
|
peerDependencies: {
|
|
843
2775
|
react: ">=18",
|
|
844
2776
|
"react-dom": ">=18"
|
|
@@ -875,7 +2807,48 @@ var catalog_default = {
|
|
|
875
2807
|
source: 'export interface MediaCardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {\n /** Card title. */\n title?: React.ReactNode;\n /** Supporting description. */\n description?: React.ReactNode;\n /** Media node (image/video). Takes precedence over `image`. */\n media?: React.ReactNode;\n /** Image URL rendered as the media, when `media` isn\'t provided. */\n image?: string;\n /** Alt text for `image`. */\n imageAlt?: string;\n /** Layout: media on top (vertical) or beside the body (horizontal). */\n orientation?: "vertical" | "horizontal";\n /** Trailing content below the description (e.g. actions). */\n footer?: React.ReactNode;\n}'
|
|
876
2808
|
}
|
|
877
2809
|
],
|
|
878
|
-
readme: '# @nucleux/media-card\n\nMediaCard \u2014 media + title + description card (card variations) \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/media-card @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { MediaCard } from "@nucleux/media-card";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
2810
|
+
readme: '# @nucleux/media-card\n\nMediaCard \u2014 media + title + description card (card variations) \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/media-card @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { MediaCard } from "@nucleux/media-card";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
2811
|
+
peerDependencies: {
|
|
2812
|
+
react: ">=18",
|
|
2813
|
+
"react-dom": ">=18"
|
|
2814
|
+
}
|
|
2815
|
+
},
|
|
2816
|
+
{
|
|
2817
|
+
name: "memory-summary",
|
|
2818
|
+
package: "@nucleux/memory-summary",
|
|
2819
|
+
kind: "component",
|
|
2820
|
+
description: `The user-facing view of an agent's long-term memory \u2014 grouped facts it holds
|
|
2821
|
+
about the user, with freshness, refresh, and an add/update composer.
|
|
2822
|
+
Source: Figma "Memory and Continuity / Memory summary".`,
|
|
2823
|
+
summary: "MemorySummary \u2014 what the assistant remembers about the user \u2014 Nucleux agentic UI for React.",
|
|
2824
|
+
keywords: [
|
|
2825
|
+
"nucleux",
|
|
2826
|
+
"react",
|
|
2827
|
+
"ui",
|
|
2828
|
+
"components",
|
|
2829
|
+
"agentic",
|
|
2830
|
+
"ai",
|
|
2831
|
+
"tailwind",
|
|
2832
|
+
"memory-summary"
|
|
2833
|
+
],
|
|
2834
|
+
exports: [
|
|
2835
|
+
"MemorySummary",
|
|
2836
|
+
"MemoryGroup",
|
|
2837
|
+
"MemorySummaryProps"
|
|
2838
|
+
],
|
|
2839
|
+
components: [
|
|
2840
|
+
"MemorySummary",
|
|
2841
|
+
"MemoryGroup"
|
|
2842
|
+
],
|
|
2843
|
+
import: 'import { MemorySummary, MemoryGroup } from "@nucleux/memory-summary";',
|
|
2844
|
+
installSingle: "pnpm add @nucleux/memory-summary @nucleux/tokens",
|
|
2845
|
+
props: [
|
|
2846
|
+
{
|
|
2847
|
+
name: "MemorySummaryProps",
|
|
2848
|
+
source: 'export interface MemorySummaryProps extends React.HTMLAttributes<HTMLDivElement> {\n /** The grouped facts the assistant remembers. */\n groups: MemoryGroup[];\n /** Heading. Defaults to `"What I remember"`. */\n heading?: React.ReactNode;\n /** Freshness line, e.g. `"Updated 1 minute ago"`. */\n updatedAt?: React.ReactNode;\n /** Called when the refresh control is used. Hidden if omitted. */\n onRefresh?: () => void;\n /** Called with the entered text to add/update a memory. Renders a composer when set. */\n onAdd?: (text: string) => void;\n addPlaceholder?: string;\n}'
|
|
2849
|
+
}
|
|
2850
|
+
],
|
|
2851
|
+
readme: '# @nucleux/memory-summary\n\nMemorySummary \u2014 what the assistant remembers about the user \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/memory-summary @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { MemorySummary } from "@nucleux/memory-summary";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
879
2852
|
peerDependencies: {
|
|
880
2853
|
react: ">=18",
|
|
881
2854
|
"react-dom": ">=18"
|
|
@@ -924,6 +2897,61 @@ var catalog_default = {
|
|
|
924
2897
|
"react-dom": ">=18"
|
|
925
2898
|
}
|
|
926
2899
|
},
|
|
2900
|
+
{
|
|
2901
|
+
name: "menubar",
|
|
2902
|
+
package: "@nucleux/menubar",
|
|
2903
|
+
kind: "component",
|
|
2904
|
+
description: "A horizontal bar of top-level menus (File / Edit / View \u2026).",
|
|
2905
|
+
summary: "Application menu bar \u2014 Nucleux agentic UI for React.",
|
|
2906
|
+
keywords: [
|
|
2907
|
+
"nucleux",
|
|
2908
|
+
"react",
|
|
2909
|
+
"ui",
|
|
2910
|
+
"components",
|
|
2911
|
+
"agentic",
|
|
2912
|
+
"ai",
|
|
2913
|
+
"tailwind",
|
|
2914
|
+
"menubar"
|
|
2915
|
+
],
|
|
2916
|
+
exports: [
|
|
2917
|
+
"Menubar",
|
|
2918
|
+
"MenubarMenu",
|
|
2919
|
+
"MenubarTrigger",
|
|
2920
|
+
"MenubarContent",
|
|
2921
|
+
"MenubarItem",
|
|
2922
|
+
"MenubarSeparator",
|
|
2923
|
+
"MenubarProps",
|
|
2924
|
+
"MenubarMenuProps",
|
|
2925
|
+
"MenubarTriggerProps",
|
|
2926
|
+
"MenubarContentProps",
|
|
2927
|
+
"MenubarItemProps"
|
|
2928
|
+
],
|
|
2929
|
+
components: [
|
|
2930
|
+
"Menubar",
|
|
2931
|
+
"MenubarMenu",
|
|
2932
|
+
"MenubarTrigger",
|
|
2933
|
+
"MenubarContent",
|
|
2934
|
+
"MenubarItem",
|
|
2935
|
+
"MenubarSeparator"
|
|
2936
|
+
],
|
|
2937
|
+
import: 'import { Menubar, MenubarMenu, MenubarTrigger, MenubarContent } from "@nucleux/menubar";',
|
|
2938
|
+
installSingle: "pnpm add @nucleux/menubar @nucleux/tokens",
|
|
2939
|
+
props: [
|
|
2940
|
+
{
|
|
2941
|
+
name: "MenubarMenuProps",
|
|
2942
|
+
source: "export interface MenubarMenuProps {\n /** Unique key for this menu. Auto-generated if omitted. */\n value?: string;\n children: React.ReactNode;\n}"
|
|
2943
|
+
},
|
|
2944
|
+
{
|
|
2945
|
+
name: "MenubarItemProps",
|
|
2946
|
+
source: "export interface MenubarItemProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n trailing?: React.ReactNode;\n destructive?: boolean;\n}"
|
|
2947
|
+
}
|
|
2948
|
+
],
|
|
2949
|
+
readme: '# @nucleux/menubar\n\nApplication menu bar \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/menubar @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Menubar } from "@nucleux/menubar";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
2950
|
+
peerDependencies: {
|
|
2951
|
+
react: ">=18",
|
|
2952
|
+
"react-dom": ">=18"
|
|
2953
|
+
}
|
|
2954
|
+
},
|
|
927
2955
|
{
|
|
928
2956
|
name: "message",
|
|
929
2957
|
package: "@nucleux/message",
|
|
@@ -961,6 +2989,45 @@ var catalog_default = {
|
|
|
961
2989
|
"react-dom": ">=18"
|
|
962
2990
|
}
|
|
963
2991
|
},
|
|
2992
|
+
{
|
|
2993
|
+
name: "model-selector",
|
|
2994
|
+
package: "@nucleux/model-selector",
|
|
2995
|
+
kind: "component",
|
|
2996
|
+
description: 'A composer-anchored dropdown for choosing which model handles the generation.\nSource: Figma "Context Expansion / Model Selection".',
|
|
2997
|
+
summary: "ModelSelector \u2014 choose which model handles the generation \u2014 Nucleux agentic UI for React.",
|
|
2998
|
+
keywords: [
|
|
2999
|
+
"nucleux",
|
|
3000
|
+
"react",
|
|
3001
|
+
"ui",
|
|
3002
|
+
"components",
|
|
3003
|
+
"agentic",
|
|
3004
|
+
"ai",
|
|
3005
|
+
"tailwind",
|
|
3006
|
+
"model-selector"
|
|
3007
|
+
],
|
|
3008
|
+
exports: [
|
|
3009
|
+
"ModelSelector",
|
|
3010
|
+
"ModelOption",
|
|
3011
|
+
"ModelSelectorProps"
|
|
3012
|
+
],
|
|
3013
|
+
components: [
|
|
3014
|
+
"ModelSelector",
|
|
3015
|
+
"ModelOption"
|
|
3016
|
+
],
|
|
3017
|
+
import: 'import { ModelSelector, ModelOption } from "@nucleux/model-selector";',
|
|
3018
|
+
installSingle: "pnpm add @nucleux/model-selector @nucleux/tokens",
|
|
3019
|
+
props: [
|
|
3020
|
+
{
|
|
3021
|
+
name: "ModelSelectorProps",
|
|
3022
|
+
source: 'export interface ModelSelectorProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> {\n /** The available models. */\n models: ModelOption[];\n /** Selected value (controlled). */\n value?: string;\n /** Initial value (uncontrolled). */\n defaultValue?: string;\n /** Called when a model is chosen. */\n onValueChange?: (value: string) => void;\n /** Accessible label for the trigger. Defaults to `"Model"`. */\n label?: string;\n}'
|
|
3023
|
+
}
|
|
3024
|
+
],
|
|
3025
|
+
readme: '# @nucleux/model-selector\n\nModelSelector \u2014 choose which model handles the generation \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/model-selector @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { ModelSelector } from "@nucleux/model-selector";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
3026
|
+
peerDependencies: {
|
|
3027
|
+
react: ">=18",
|
|
3028
|
+
"react-dom": ">=18"
|
|
3029
|
+
}
|
|
3030
|
+
},
|
|
964
3031
|
{
|
|
965
3032
|
name: "modular-consent",
|
|
966
3033
|
package: "@nucleux/modular-consent",
|
|
@@ -1053,6 +3120,62 @@ var catalog_default = {
|
|
|
1053
3120
|
"react-dom": ">=18"
|
|
1054
3121
|
}
|
|
1055
3122
|
},
|
|
3123
|
+
{
|
|
3124
|
+
name: "navigation-menu",
|
|
3125
|
+
package: "@nucleux/navigation-menu",
|
|
3126
|
+
kind: "component",
|
|
3127
|
+
description: "A site navigation bar with hover/focus-revealed dropdown panels.",
|
|
3128
|
+
summary: "Navigation menu with dropdown panels \u2014 Nucleux agentic UI for React.",
|
|
3129
|
+
keywords: [
|
|
3130
|
+
"nucleux",
|
|
3131
|
+
"react",
|
|
3132
|
+
"ui",
|
|
3133
|
+
"components",
|
|
3134
|
+
"agentic",
|
|
3135
|
+
"ai",
|
|
3136
|
+
"tailwind",
|
|
3137
|
+
"navigation-menu"
|
|
3138
|
+
],
|
|
3139
|
+
exports: [
|
|
3140
|
+
"NavigationMenu",
|
|
3141
|
+
"NavigationMenuList",
|
|
3142
|
+
"NavigationMenuItem",
|
|
3143
|
+
"NavigationMenuTrigger",
|
|
3144
|
+
"NavigationMenuContent",
|
|
3145
|
+
"NavigationMenuLink",
|
|
3146
|
+
"NavigationMenuProps",
|
|
3147
|
+
"NavigationMenuListProps",
|
|
3148
|
+
"NavigationMenuItemProps",
|
|
3149
|
+
"NavigationMenuTriggerProps",
|
|
3150
|
+
"NavigationMenuContentProps",
|
|
3151
|
+
"NavigationMenuLinkProps"
|
|
3152
|
+
],
|
|
3153
|
+
components: [
|
|
3154
|
+
"NavigationMenu",
|
|
3155
|
+
"NavigationMenuList",
|
|
3156
|
+
"NavigationMenuItem",
|
|
3157
|
+
"NavigationMenuTrigger",
|
|
3158
|
+
"NavigationMenuContent",
|
|
3159
|
+
"NavigationMenuLink"
|
|
3160
|
+
],
|
|
3161
|
+
import: 'import { NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger } from "@nucleux/navigation-menu";',
|
|
3162
|
+
installSingle: "pnpm add @nucleux/navigation-menu @nucleux/tokens",
|
|
3163
|
+
props: [
|
|
3164
|
+
{
|
|
3165
|
+
name: "NavigationMenuItemProps",
|
|
3166
|
+
source: "export interface NavigationMenuItemProps extends React.LiHTMLAttributes<HTMLLIElement> {\n value?: string;\n}"
|
|
3167
|
+
},
|
|
3168
|
+
{
|
|
3169
|
+
name: "NavigationMenuLinkProps",
|
|
3170
|
+
source: "export interface NavigationMenuLinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {\n active?: boolean;\n}"
|
|
3171
|
+
}
|
|
3172
|
+
],
|
|
3173
|
+
readme: '# @nucleux/navigation-menu\n\nNavigation menu with dropdown panels \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/navigation-menu @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { NavigationMenu } from "@nucleux/navigation-menu";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
3174
|
+
peerDependencies: {
|
|
3175
|
+
react: ">=18",
|
|
3176
|
+
"react-dom": ">=18"
|
|
3177
|
+
}
|
|
3178
|
+
},
|
|
1056
3179
|
{
|
|
1057
3180
|
name: "page-header",
|
|
1058
3181
|
package: "@nucleux/page-header",
|
|
@@ -1090,6 +3213,43 @@ var catalog_default = {
|
|
|
1090
3213
|
"react-dom": ">=18"
|
|
1091
3214
|
}
|
|
1092
3215
|
},
|
|
3216
|
+
{
|
|
3217
|
+
name: "pagination",
|
|
3218
|
+
package: "@nucleux/pagination",
|
|
3219
|
+
kind: "component",
|
|
3220
|
+
description: "Page navigation with previous/next controls and truncated page numbers.",
|
|
3221
|
+
summary: "Page navigation controls \u2014 Nucleux agentic UI for React.",
|
|
3222
|
+
keywords: [
|
|
3223
|
+
"nucleux",
|
|
3224
|
+
"react",
|
|
3225
|
+
"ui",
|
|
3226
|
+
"components",
|
|
3227
|
+
"agentic",
|
|
3228
|
+
"ai",
|
|
3229
|
+
"tailwind",
|
|
3230
|
+
"pagination"
|
|
3231
|
+
],
|
|
3232
|
+
exports: [
|
|
3233
|
+
"Pagination",
|
|
3234
|
+
"PaginationProps"
|
|
3235
|
+
],
|
|
3236
|
+
components: [
|
|
3237
|
+
"Pagination"
|
|
3238
|
+
],
|
|
3239
|
+
import: 'import { Pagination } from "@nucleux/pagination";',
|
|
3240
|
+
installSingle: "pnpm add @nucleux/pagination @nucleux/tokens",
|
|
3241
|
+
props: [
|
|
3242
|
+
{
|
|
3243
|
+
name: "PaginationProps",
|
|
3244
|
+
source: 'export interface PaginationProps extends Omit<React.HTMLAttributes<HTMLElement>, "onChange"> {\n /** 1-based current page. */\n page: number;\n /** Total number of pages. */\n count: number;\n onPageChange: (page: number) => void;\n /** How many page buttons to show around the current page. */\n siblingCount?: number;\n}'
|
|
3245
|
+
}
|
|
3246
|
+
],
|
|
3247
|
+
readme: '# @nucleux/pagination\n\nPage navigation controls \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/pagination @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Pagination } from "@nucleux/pagination";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
3248
|
+
peerDependencies: {
|
|
3249
|
+
react: ">=18",
|
|
3250
|
+
"react-dom": ">=18"
|
|
3251
|
+
}
|
|
3252
|
+
},
|
|
1093
3253
|
{
|
|
1094
3254
|
name: "popover",
|
|
1095
3255
|
package: "@nucleux/popover",
|
|
@@ -1136,6 +3296,46 @@ var catalog_default = {
|
|
|
1136
3296
|
"react-dom": ">=18"
|
|
1137
3297
|
}
|
|
1138
3298
|
},
|
|
3299
|
+
{
|
|
3300
|
+
name: "privacy-notice",
|
|
3301
|
+
package: "@nucleux/privacy-notice",
|
|
3302
|
+
kind: "component",
|
|
3303
|
+
description: `A subtle notice that a conversation is ephemeral or private \u2014 communicates
|
|
3304
|
+
the agent's data-handling/memory state to the user.
|
|
3305
|
+
Source: Figma "Privacy and Control / temporary & incognito notices".`,
|
|
3306
|
+
summary: "PrivacyNotice \u2014 a notice that a chat is ephemeral or private \u2014 Nucleux agentic UI for React.",
|
|
3307
|
+
keywords: [
|
|
3308
|
+
"nucleux",
|
|
3309
|
+
"react",
|
|
3310
|
+
"ui",
|
|
3311
|
+
"components",
|
|
3312
|
+
"agentic",
|
|
3313
|
+
"ai",
|
|
3314
|
+
"tailwind",
|
|
3315
|
+
"privacy-notice"
|
|
3316
|
+
],
|
|
3317
|
+
exports: [
|
|
3318
|
+
"PrivacyNotice",
|
|
3319
|
+
"PrivacyNoticeVariant",
|
|
3320
|
+
"PrivacyNoticeProps"
|
|
3321
|
+
],
|
|
3322
|
+
components: [
|
|
3323
|
+
"PrivacyNotice"
|
|
3324
|
+
],
|
|
3325
|
+
import: 'import { PrivacyNotice } from "@nucleux/privacy-notice";',
|
|
3326
|
+
installSingle: "pnpm add @nucleux/privacy-notice @nucleux/tokens",
|
|
3327
|
+
props: [
|
|
3328
|
+
{
|
|
3329
|
+
name: "PrivacyNoticeProps",
|
|
3330
|
+
source: "export interface PrivacyNoticeProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Which data-handling mode this notice describes. */\n variant?: PrivacyNoticeVariant;\n /** Leading icon. Defaults per variant. */\n icon?: React.ReactNode;\n}"
|
|
3331
|
+
}
|
|
3332
|
+
],
|
|
3333
|
+
readme: '# @nucleux/privacy-notice\n\nPrivacyNotice \u2014 a notice that a chat is ephemeral or private \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/privacy-notice @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { PrivacyNotice } from "@nucleux/privacy-notice";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
3334
|
+
peerDependencies: {
|
|
3335
|
+
react: ">=18",
|
|
3336
|
+
"react-dom": ">=18"
|
|
3337
|
+
}
|
|
3338
|
+
},
|
|
1139
3339
|
{
|
|
1140
3340
|
name: "progress",
|
|
1141
3341
|
package: "@nucleux/progress",
|
|
@@ -1175,6 +3375,86 @@ var catalog_default = {
|
|
|
1175
3375
|
"react-dom": ">=18"
|
|
1176
3376
|
}
|
|
1177
3377
|
},
|
|
3378
|
+
{
|
|
3379
|
+
name: "prompt-enhancer",
|
|
3380
|
+
package: "@nucleux/prompt-enhancer",
|
|
3381
|
+
kind: "component",
|
|
3382
|
+
description: `A sparkle "enhance" pill plus one-tap rewrite intents for the user's draft \u2014
|
|
3383
|
+
one-click AI improvement of a prompt before it's sent.
|
|
3384
|
+
Source: Figma "Prompt Scaffolds / Prompt Enhancer".`,
|
|
3385
|
+
summary: "PromptEnhancer \u2014 one-tap AI rewrite intents for a draft prompt \u2014 Nucleux agentic UI for React.",
|
|
3386
|
+
keywords: [
|
|
3387
|
+
"nucleux",
|
|
3388
|
+
"react",
|
|
3389
|
+
"ui",
|
|
3390
|
+
"components",
|
|
3391
|
+
"agentic",
|
|
3392
|
+
"ai",
|
|
3393
|
+
"tailwind",
|
|
3394
|
+
"prompt-enhancer"
|
|
3395
|
+
],
|
|
3396
|
+
exports: [
|
|
3397
|
+
"PromptEnhancer",
|
|
3398
|
+
"PromptEnhancerProps"
|
|
3399
|
+
],
|
|
3400
|
+
components: [
|
|
3401
|
+
"PromptEnhancer"
|
|
3402
|
+
],
|
|
3403
|
+
import: 'import { PromptEnhancer } from "@nucleux/prompt-enhancer";',
|
|
3404
|
+
installSingle: "pnpm add @nucleux/prompt-enhancer @nucleux/tokens",
|
|
3405
|
+
props: [
|
|
3406
|
+
{
|
|
3407
|
+
name: "PromptEnhancerProps",
|
|
3408
|
+
source: 'export interface PromptEnhancerProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, "onSelect"> {\n /** One-tap rewrite-intent chips, e.g. "Make it professional". */\n suggestions?: string[];\n /** Called when the main enhance pill is activated. */\n onEnhance?: () => void;\n /** Called with the chosen intent when a suggestion chip is activated. */\n onSelect?: (suggestion: string) => void;\n /** Label on the enhance pill. Defaults to `"Enhance prompt"`. */\n label?: React.ReactNode;\n}'
|
|
3409
|
+
}
|
|
3410
|
+
],
|
|
3411
|
+
readme: '# @nucleux/prompt-enhancer\n\nPromptEnhancer \u2014 one-tap AI rewrite intents for a draft prompt \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/prompt-enhancer @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { PromptEnhancer } from "@nucleux/prompt-enhancer";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
3412
|
+
peerDependencies: {
|
|
3413
|
+
react: ">=18",
|
|
3414
|
+
"react-dom": ">=18"
|
|
3415
|
+
}
|
|
3416
|
+
},
|
|
3417
|
+
{
|
|
3418
|
+
name: "prompt-template",
|
|
3419
|
+
package: "@nucleux/prompt-template",
|
|
3420
|
+
kind: "component",
|
|
3421
|
+
description: `A fillable prompt scaffold \u2014 a sentence with highlighted fill-in-the-blank
|
|
3422
|
+
slots the user tabs through, so users don't have to author a good prompt.
|
|
3423
|
+
Source: Figma "Prompt Scaffolds / Madlibs".`,
|
|
3424
|
+
summary: "PromptTemplate \u2014 a fillable prompt scaffold with named slots \u2014 Nucleux agentic UI for React.",
|
|
3425
|
+
keywords: [
|
|
3426
|
+
"nucleux",
|
|
3427
|
+
"react",
|
|
3428
|
+
"ui",
|
|
3429
|
+
"components",
|
|
3430
|
+
"agentic",
|
|
3431
|
+
"ai",
|
|
3432
|
+
"tailwind",
|
|
3433
|
+
"prompt-template"
|
|
3434
|
+
],
|
|
3435
|
+
exports: [
|
|
3436
|
+
"PromptTemplate",
|
|
3437
|
+
"PromptSegment",
|
|
3438
|
+
"PromptTemplateProps"
|
|
3439
|
+
],
|
|
3440
|
+
components: [
|
|
3441
|
+
"PromptTemplate",
|
|
3442
|
+
"PromptSegment"
|
|
3443
|
+
],
|
|
3444
|
+
import: 'import { PromptTemplate, PromptSegment } from "@nucleux/prompt-template";',
|
|
3445
|
+
installSingle: "pnpm add @nucleux/prompt-template @nucleux/tokens",
|
|
3446
|
+
props: [
|
|
3447
|
+
{
|
|
3448
|
+
name: "PromptTemplateProps",
|
|
3449
|
+
source: 'export interface PromptTemplateProps\n extends Omit<React.FormHTMLAttributes<HTMLFormElement>, "onSubmit"> {\n /** The template as an ordered mix of literal text and named slots. */\n segments: PromptSegment[];\n /** Slot values (controlled), keyed by slot id. */\n values?: Record<string, string>;\n /** Initial slot values (uncontrolled). */\n defaultValues?: Record<string, string>;\n /** Called when any slot changes. */\n onValuesChange?: (values: Record<string, string>) => void;\n /** Called with the interpolated prompt (and raw values) on submit. */\n onComplete?: (prompt: string, values: Record<string, string>) => void;\n /** Submit button label. Defaults to `"Use this prompt"`. */\n submitLabel?: React.ReactNode;\n}'
|
|
3450
|
+
}
|
|
3451
|
+
],
|
|
3452
|
+
readme: '# @nucleux/prompt-template\n\nPromptTemplate \u2014 a fillable prompt scaffold with named slots \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/prompt-template @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { PromptTemplate } from "@nucleux/prompt-template";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
3453
|
+
peerDependencies: {
|
|
3454
|
+
react: ">=18",
|
|
3455
|
+
"react-dom": ">=18"
|
|
3456
|
+
}
|
|
3457
|
+
},
|
|
1178
3458
|
{
|
|
1179
3459
|
name: "radio-group",
|
|
1180
3460
|
package: "@nucleux/radio-group",
|
|
@@ -1305,22 +3585,152 @@ var catalog_default = {
|
|
|
1305
3585
|
"RelatedPatternCardProps"
|
|
1306
3586
|
],
|
|
1307
3587
|
components: [
|
|
1308
|
-
"RelatedPatternsGrid",
|
|
1309
|
-
"RelatedPatternCard"
|
|
3588
|
+
"RelatedPatternsGrid",
|
|
3589
|
+
"RelatedPatternCard"
|
|
3590
|
+
],
|
|
3591
|
+
import: 'import { RelatedPatternsGrid, RelatedPatternCard } from "@nucleux/related-patterns-grid";',
|
|
3592
|
+
installSingle: "pnpm add @nucleux/related-patterns-grid @nucleux/tokens",
|
|
3593
|
+
props: [
|
|
3594
|
+
{
|
|
3595
|
+
name: "RelatedPatternsGridProps",
|
|
3596
|
+
source: "export interface RelatedPatternsGridProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Number of columns (default 2). */\n columns?: number;\n}"
|
|
3597
|
+
},
|
|
3598
|
+
{
|
|
3599
|
+
name: "RelatedPatternCardProps",
|
|
3600
|
+
source: 'export interface RelatedPatternCardProps\n extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "title"> {\n /** Card title. */\n title: React.ReactNode;\n /** Supporting meta text, e.g. "Onboarding \xB7 Trust & Disclosure". */\n meta?: React.ReactNode;\n}'
|
|
3601
|
+
}
|
|
3602
|
+
],
|
|
3603
|
+
readme: '# @nucleux/related-patterns-grid\n\nRelatedPatternsGrid \u2014 grid of related pattern cards \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/related-patterns-grid @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { RelatedPatternsGrid } from "@nucleux/related-patterns-grid";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
3604
|
+
peerDependencies: {
|
|
3605
|
+
react: ">=18",
|
|
3606
|
+
"react-dom": ">=18"
|
|
3607
|
+
}
|
|
3608
|
+
},
|
|
3609
|
+
{
|
|
3610
|
+
name: "resizable",
|
|
3611
|
+
package: "@nucleux/resizable",
|
|
3612
|
+
kind: "component",
|
|
3613
|
+
description: "A container of {@link ResizablePanel}s separated by draggable {@link ResizableHandle}s.",
|
|
3614
|
+
summary: "Resizable split panels \u2014 Nucleux agentic UI for React.",
|
|
3615
|
+
keywords: [
|
|
3616
|
+
"nucleux",
|
|
3617
|
+
"react",
|
|
3618
|
+
"ui",
|
|
3619
|
+
"components",
|
|
3620
|
+
"agentic",
|
|
3621
|
+
"ai",
|
|
3622
|
+
"tailwind",
|
|
3623
|
+
"resizable"
|
|
3624
|
+
],
|
|
3625
|
+
exports: [
|
|
3626
|
+
"ResizablePanelGroup",
|
|
3627
|
+
"ResizablePanel",
|
|
3628
|
+
"ResizableHandle",
|
|
3629
|
+
"ResizablePanelGroupProps",
|
|
3630
|
+
"ResizablePanelProps",
|
|
3631
|
+
"ResizableHandleProps"
|
|
3632
|
+
],
|
|
3633
|
+
components: [
|
|
3634
|
+
"ResizablePanelGroup",
|
|
3635
|
+
"ResizablePanel",
|
|
3636
|
+
"ResizableHandle"
|
|
3637
|
+
],
|
|
3638
|
+
import: 'import { ResizablePanelGroup, ResizablePanel, ResizableHandle } from "@nucleux/resizable";',
|
|
3639
|
+
installSingle: "pnpm add @nucleux/resizable @nucleux/tokens",
|
|
3640
|
+
props: [
|
|
3641
|
+
{
|
|
3642
|
+
name: "ResizablePanelGroupProps",
|
|
3643
|
+
source: "export interface ResizablePanelGroupProps extends React.HTMLAttributes<HTMLDivElement> {\n direction?: Direction;\n}"
|
|
3644
|
+
},
|
|
3645
|
+
{
|
|
3646
|
+
name: "ResizablePanelProps",
|
|
3647
|
+
source: "export interface ResizablePanelProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Initial size as a flex-grow weight (defaults to 1). */\n defaultSize?: number;\n}"
|
|
3648
|
+
},
|
|
3649
|
+
{
|
|
3650
|
+
name: "ResizableHandleProps",
|
|
3651
|
+
source: 'export interface ResizableHandleProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Show the grip dots affordance. */\n withHandle?: boolean;\n /** Accessible name for the splitter. */\n "aria-label"?: string;\n}'
|
|
3652
|
+
}
|
|
3653
|
+
],
|
|
3654
|
+
readme: '# @nucleux/resizable\n\nResizable split panels \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/resizable @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Resizable } from "@nucleux/resizable";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
3655
|
+
peerDependencies: {
|
|
3656
|
+
react: ">=18",
|
|
3657
|
+
"react-dom": ">=18"
|
|
3658
|
+
}
|
|
3659
|
+
},
|
|
3660
|
+
{
|
|
3661
|
+
name: "response-comparison",
|
|
3662
|
+
package: "@nucleux/response-comparison",
|
|
3663
|
+
kind: "component",
|
|
3664
|
+
description: 'Two candidate AI outputs shown side by side with a "prefer this response"\nchoice \u2014 collects A/B preference feedback on model generations.\nSource: Figma "Output & Processing / Summary Variants".',
|
|
3665
|
+
summary: "ResponseComparison \u2014 compare two AI responses and prefer one \u2014 Nucleux agentic UI for React.",
|
|
3666
|
+
keywords: [
|
|
3667
|
+
"nucleux",
|
|
3668
|
+
"react",
|
|
3669
|
+
"ui",
|
|
3670
|
+
"components",
|
|
3671
|
+
"agentic",
|
|
3672
|
+
"ai",
|
|
3673
|
+
"tailwind",
|
|
3674
|
+
"response-comparison"
|
|
3675
|
+
],
|
|
3676
|
+
exports: [
|
|
3677
|
+
"ResponseComparison",
|
|
3678
|
+
"ResponseOption",
|
|
3679
|
+
"ResponseComparisonProps"
|
|
3680
|
+
],
|
|
3681
|
+
components: [
|
|
3682
|
+
"ResponseComparison",
|
|
3683
|
+
"ResponseOption"
|
|
3684
|
+
],
|
|
3685
|
+
import: 'import { ResponseComparison, ResponseOption } from "@nucleux/response-comparison";',
|
|
3686
|
+
installSingle: "pnpm add @nucleux/response-comparison @nucleux/tokens",
|
|
3687
|
+
props: [
|
|
3688
|
+
{
|
|
3689
|
+
name: "ResponseComparisonProps",
|
|
3690
|
+
source: 'export interface ResponseComparisonProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> {\n /** The candidate responses to compare (typically two). */\n options: ResponseOption[];\n /** Preferred option id (controlled). */\n value?: string | null;\n /** Called when the user prefers a response. */\n onPrefer?: (id: string) => void;\n /** Prompt above the options. Defaults to a comparison question. */\n question?: React.ReactNode;\n /** Label for the prefer button. Defaults to `"Prefer this response"`. */\n preferLabel?: React.ReactNode;\n}'
|
|
3691
|
+
}
|
|
3692
|
+
],
|
|
3693
|
+
readme: '# @nucleux/response-comparison\n\nResponseComparison \u2014 compare two AI responses and prefer one \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/response-comparison @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { ResponseComparison } from "@nucleux/response-comparison";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
3694
|
+
peerDependencies: {
|
|
3695
|
+
react: ">=18",
|
|
3696
|
+
"react-dom": ">=18"
|
|
3697
|
+
}
|
|
3698
|
+
},
|
|
3699
|
+
{
|
|
3700
|
+
name: "rewrite-menu",
|
|
3701
|
+
package: "@nucleux/rewrite-menu",
|
|
3702
|
+
kind: "component",
|
|
3703
|
+
description: 'A menu of model-driven rewrite and transform actions on an AI response \u2014\nretry, expand, make concise, restyle, convert to bullets.\nSource: Figma "Refinement / Contextual transform".',
|
|
3704
|
+
summary: "RewriteMenu \u2014 a menu of AI rewrite and transform actions \u2014 Nucleux agentic UI for React.",
|
|
3705
|
+
keywords: [
|
|
3706
|
+
"nucleux",
|
|
3707
|
+
"react",
|
|
3708
|
+
"ui",
|
|
3709
|
+
"components",
|
|
3710
|
+
"agentic",
|
|
3711
|
+
"ai",
|
|
3712
|
+
"tailwind",
|
|
3713
|
+
"rewrite-menu"
|
|
3714
|
+
],
|
|
3715
|
+
exports: [
|
|
3716
|
+
"defaultRewriteActions",
|
|
3717
|
+
"RewriteMenu",
|
|
3718
|
+
"RewriteAction",
|
|
3719
|
+
"RewriteMenuProps"
|
|
3720
|
+
],
|
|
3721
|
+
components: [
|
|
3722
|
+
"RewriteMenu",
|
|
3723
|
+
"RewriteAction"
|
|
1310
3724
|
],
|
|
1311
|
-
import: 'import {
|
|
1312
|
-
installSingle: "pnpm add @nucleux/
|
|
3725
|
+
import: 'import { RewriteMenu, RewriteAction } from "@nucleux/rewrite-menu";',
|
|
3726
|
+
installSingle: "pnpm add @nucleux/rewrite-menu @nucleux/tokens",
|
|
1313
3727
|
props: [
|
|
1314
3728
|
{
|
|
1315
|
-
name: "
|
|
1316
|
-
source:
|
|
1317
|
-
},
|
|
1318
|
-
{
|
|
1319
|
-
name: "RelatedPatternCardProps",
|
|
1320
|
-
source: 'export interface RelatedPatternCardProps\n extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "title"> {\n /** Card title. */\n title: React.ReactNode;\n /** Supporting meta text, e.g. "Onboarding \xB7 Trust & Disclosure". */\n meta?: React.ReactNode;\n}'
|
|
3729
|
+
name: "RewriteMenuProps",
|
|
3730
|
+
source: 'export interface RewriteMenuProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, "onSelect"> {\n /** Actions to list. Defaults to {@link defaultRewriteActions}. */\n actions?: RewriteAction[];\n /** Called with the action id when an item is chosen. */\n onAction?: (id: string) => void;\n /** Optional heading above the list. */\n label?: React.ReactNode;\n}'
|
|
1321
3731
|
}
|
|
1322
3732
|
],
|
|
1323
|
-
readme: '# @nucleux/
|
|
3733
|
+
readme: '# @nucleux/rewrite-menu\n\nRewriteMenu \u2014 a menu of AI rewrite and transform actions \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/rewrite-menu @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { RewriteMenu } from "@nucleux/rewrite-menu";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1324
3734
|
peerDependencies: {
|
|
1325
3735
|
react: ">=18",
|
|
1326
3736
|
"react-dom": ">=18"
|
|
@@ -1420,6 +3830,43 @@ var catalog_default = {
|
|
|
1420
3830
|
"react-dom": ">=18"
|
|
1421
3831
|
}
|
|
1422
3832
|
},
|
|
3833
|
+
{
|
|
3834
|
+
name: "scroll-area",
|
|
3835
|
+
package: "@nucleux/scroll-area",
|
|
3836
|
+
kind: "component",
|
|
3837
|
+
description: "A scroll container with a thin, tokenized scrollbar. Set a height/width via\n`className` (e.g. `h-48`) for the scroll area to take effect.",
|
|
3838
|
+
summary: "Styled scroll container \u2014 Nucleux agentic UI for React.",
|
|
3839
|
+
keywords: [
|
|
3840
|
+
"nucleux",
|
|
3841
|
+
"react",
|
|
3842
|
+
"ui",
|
|
3843
|
+
"components",
|
|
3844
|
+
"agentic",
|
|
3845
|
+
"ai",
|
|
3846
|
+
"tailwind",
|
|
3847
|
+
"scroll-area"
|
|
3848
|
+
],
|
|
3849
|
+
exports: [
|
|
3850
|
+
"ScrollArea",
|
|
3851
|
+
"ScrollAreaProps"
|
|
3852
|
+
],
|
|
3853
|
+
components: [
|
|
3854
|
+
"ScrollArea"
|
|
3855
|
+
],
|
|
3856
|
+
import: 'import { ScrollArea } from "@nucleux/scroll-area";',
|
|
3857
|
+
installSingle: "pnpm add @nucleux/scroll-area @nucleux/tokens",
|
|
3858
|
+
props: [
|
|
3859
|
+
{
|
|
3860
|
+
name: "ScrollAreaProps",
|
|
3861
|
+
source: 'export interface ScrollAreaProps extends React.HTMLAttributes<HTMLDivElement> {\n orientation?: "vertical" | "horizontal" | "both";\n /** Max height (any CSS length) for the vertical scroll viewport. */\n viewportClassName?: string;\n}'
|
|
3862
|
+
}
|
|
3863
|
+
],
|
|
3864
|
+
readme: '# @nucleux/scroll-area\n\nStyled scroll container \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/scroll-area @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { ScrollArea } from "@nucleux/scroll-area";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
3865
|
+
peerDependencies: {
|
|
3866
|
+
react: ">=18",
|
|
3867
|
+
"react-dom": ">=18"
|
|
3868
|
+
}
|
|
3869
|
+
},
|
|
1423
3870
|
{
|
|
1424
3871
|
name: "search-input",
|
|
1425
3872
|
package: "@nucleux/search-input",
|
|
@@ -1531,6 +3978,43 @@ var catalog_default = {
|
|
|
1531
3978
|
"react-dom": ">=18"
|
|
1532
3979
|
}
|
|
1533
3980
|
},
|
|
3981
|
+
{
|
|
3982
|
+
name: "session-recap",
|
|
3983
|
+
package: "@nucleux/session-recap",
|
|
3984
|
+
kind: "component",
|
|
3985
|
+
description: 'A tinted callout that wraps up an agent run in one natural-language line \u2014\nwhat the agent did \u2014 with an optional link to the full log.\nSource: Figma "Explainability / Recap Card".',
|
|
3986
|
+
summary: "SessionRecap \u2014 a natural-language recap of an agent run \u2014 Nucleux agentic UI for React.",
|
|
3987
|
+
keywords: [
|
|
3988
|
+
"nucleux",
|
|
3989
|
+
"react",
|
|
3990
|
+
"ui",
|
|
3991
|
+
"components",
|
|
3992
|
+
"agentic",
|
|
3993
|
+
"ai",
|
|
3994
|
+
"tailwind",
|
|
3995
|
+
"session-recap"
|
|
3996
|
+
],
|
|
3997
|
+
exports: [
|
|
3998
|
+
"SessionRecap",
|
|
3999
|
+
"SessionRecapProps"
|
|
4000
|
+
],
|
|
4001
|
+
components: [
|
|
4002
|
+
"SessionRecap"
|
|
4003
|
+
],
|
|
4004
|
+
import: 'import { SessionRecap } from "@nucleux/session-recap";',
|
|
4005
|
+
installSingle: "pnpm add @nucleux/session-recap @nucleux/tokens",
|
|
4006
|
+
props: [
|
|
4007
|
+
{
|
|
4008
|
+
name: "SessionRecapProps",
|
|
4009
|
+
source: 'export interface SessionRecapProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Eyebrow label. Defaults to `"Session recap"`. */\n label?: React.ReactNode;\n /** Leading icon. Defaults to a sparkle. */\n icon?: React.ReactNode;\n /** Trailing action, e.g. a "View full log" button. */\n action?: React.ReactNode;\n}'
|
|
4010
|
+
}
|
|
4011
|
+
],
|
|
4012
|
+
readme: '# @nucleux/session-recap\n\nSessionRecap \u2014 a natural-language recap of an agent run \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/session-recap @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { SessionRecap } from "@nucleux/session-recap";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
4013
|
+
peerDependencies: {
|
|
4014
|
+
react: ">=18",
|
|
4015
|
+
"react-dom": ">=18"
|
|
4016
|
+
}
|
|
4017
|
+
},
|
|
1534
4018
|
{
|
|
1535
4019
|
name: "sheet",
|
|
1536
4020
|
package: "@nucleux/sheet",
|
|
@@ -1629,6 +4113,80 @@ var catalog_default = {
|
|
|
1629
4113
|
"react-dom": ">=18"
|
|
1630
4114
|
}
|
|
1631
4115
|
},
|
|
4116
|
+
{
|
|
4117
|
+
name: "skeleton",
|
|
4118
|
+
package: "@nucleux/skeleton",
|
|
4119
|
+
kind: "component",
|
|
4120
|
+
description: "A pulsing placeholder for content that is still loading.",
|
|
4121
|
+
summary: "Loading placeholder shimmer \u2014 Nucleux agentic UI for React.",
|
|
4122
|
+
keywords: [
|
|
4123
|
+
"nucleux",
|
|
4124
|
+
"react",
|
|
4125
|
+
"ui",
|
|
4126
|
+
"components",
|
|
4127
|
+
"agentic",
|
|
4128
|
+
"ai",
|
|
4129
|
+
"tailwind",
|
|
4130
|
+
"skeleton"
|
|
4131
|
+
],
|
|
4132
|
+
exports: [
|
|
4133
|
+
"Skeleton",
|
|
4134
|
+
"SkeletonProps"
|
|
4135
|
+
],
|
|
4136
|
+
components: [
|
|
4137
|
+
"Skeleton"
|
|
4138
|
+
],
|
|
4139
|
+
import: 'import { Skeleton } from "@nucleux/skeleton";',
|
|
4140
|
+
installSingle: "pnpm add @nucleux/skeleton @nucleux/tokens",
|
|
4141
|
+
props: [
|
|
4142
|
+
{
|
|
4143
|
+
name: "SkeletonProps",
|
|
4144
|
+
source: "export interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Pill shape for text/avatar placeholders. */\n circle?: boolean;\n}"
|
|
4145
|
+
}
|
|
4146
|
+
],
|
|
4147
|
+
readme: '# @nucleux/skeleton\n\nLoading placeholder shimmer \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/skeleton @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Skeleton } from "@nucleux/skeleton";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
4148
|
+
peerDependencies: {
|
|
4149
|
+
react: ">=18",
|
|
4150
|
+
"react-dom": ">=18"
|
|
4151
|
+
}
|
|
4152
|
+
},
|
|
4153
|
+
{
|
|
4154
|
+
name: "slider",
|
|
4155
|
+
package: "@nucleux/slider",
|
|
4156
|
+
kind: "component",
|
|
4157
|
+
description: "A single-thumb slider for choosing a numeric value from a range.",
|
|
4158
|
+
summary: "Draggable range slider \u2014 Nucleux agentic UI for React.",
|
|
4159
|
+
keywords: [
|
|
4160
|
+
"nucleux",
|
|
4161
|
+
"react",
|
|
4162
|
+
"ui",
|
|
4163
|
+
"components",
|
|
4164
|
+
"agentic",
|
|
4165
|
+
"ai",
|
|
4166
|
+
"tailwind",
|
|
4167
|
+
"slider"
|
|
4168
|
+
],
|
|
4169
|
+
exports: [
|
|
4170
|
+
"Slider",
|
|
4171
|
+
"SliderProps"
|
|
4172
|
+
],
|
|
4173
|
+
components: [
|
|
4174
|
+
"Slider"
|
|
4175
|
+
],
|
|
4176
|
+
import: 'import { Slider } from "@nucleux/slider";',
|
|
4177
|
+
installSingle: "pnpm add @nucleux/slider @nucleux/tokens",
|
|
4178
|
+
props: [
|
|
4179
|
+
{
|
|
4180
|
+
name: "SliderProps",
|
|
4181
|
+
source: 'export interface SliderProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, "defaultValue" | "onChange"> {\n value?: number;\n defaultValue?: number;\n min?: number;\n max?: number;\n step?: number;\n disabled?: boolean;\n onValueChange?: (value: number) => void;\n /** Accessible name for the thumb (falls back to aria-label on the root). */\n "aria-label"?: string;\n}'
|
|
4182
|
+
}
|
|
4183
|
+
],
|
|
4184
|
+
readme: '# @nucleux/slider\n\nDraggable range slider \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/slider @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Slider } from "@nucleux/slider";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
4185
|
+
peerDependencies: {
|
|
4186
|
+
react: ">=18",
|
|
4187
|
+
"react-dom": ">=18"
|
|
4188
|
+
}
|
|
4189
|
+
},
|
|
1632
4190
|
{
|
|
1633
4191
|
name: "streaming-text",
|
|
1634
4192
|
package: "@nucleux/streaming-text",
|
|
@@ -1666,6 +4224,45 @@ var catalog_default = {
|
|
|
1666
4224
|
"react-dom": ">=18"
|
|
1667
4225
|
}
|
|
1668
4226
|
},
|
|
4227
|
+
{
|
|
4228
|
+
name: "structured-input",
|
|
4229
|
+
package: "@nucleux/structured-input",
|
|
4230
|
+
kind: "component",
|
|
4231
|
+
description: 'An agent-generated clarifying question rendered as a structured choice \u2014\nsingle or multi-select options, a free-text escape, and a skip.\nSource: Figma "Expressive Input / Structured Input".',
|
|
4232
|
+
summary: "StructuredInput \u2014 an agent's structured clarifying question \u2014 Nucleux agentic UI for React.",
|
|
4233
|
+
keywords: [
|
|
4234
|
+
"nucleux",
|
|
4235
|
+
"react",
|
|
4236
|
+
"ui",
|
|
4237
|
+
"components",
|
|
4238
|
+
"agentic",
|
|
4239
|
+
"ai",
|
|
4240
|
+
"tailwind",
|
|
4241
|
+
"structured-input"
|
|
4242
|
+
],
|
|
4243
|
+
exports: [
|
|
4244
|
+
"StructuredInput",
|
|
4245
|
+
"StructuredOption",
|
|
4246
|
+
"StructuredInputProps"
|
|
4247
|
+
],
|
|
4248
|
+
components: [
|
|
4249
|
+
"StructuredInput",
|
|
4250
|
+
"StructuredOption"
|
|
4251
|
+
],
|
|
4252
|
+
import: 'import { StructuredInput, StructuredOption } from "@nucleux/structured-input";',
|
|
4253
|
+
installSingle: "pnpm add @nucleux/structured-input @nucleux/tokens",
|
|
4254
|
+
props: [
|
|
4255
|
+
{
|
|
4256
|
+
name: "StructuredInputProps",
|
|
4257
|
+
source: 'export interface StructuredInputProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange" | "onSubmit"> {\n /** The clarifying question the agent is asking. */\n question: React.ReactNode;\n /** The selectable answers. */\n options: StructuredOption[];\n /** Allow selecting more than one option. */\n multiple?: boolean;\n /** Selected values (controlled). */\n value?: string[];\n /** Initial selection (uncontrolled). */\n defaultValue?: string[];\n /** Called when the selection changes. */\n onValueChange?: (values: string[]) => void;\n /** Show a free-text "something else" escape. */\n allowOther?: boolean;\n /** Label for the other escape. Defaults to `"Something else\u2026"`. */\n otherPlaceholder?: string;\n /** Called when the answer is submitted. */\n onSubmit?: (values: string[], other?: string) => void;\n /** Called when the user skips the question. Renders the skip control when set. */\n onSkip?: () => void;\n submitLabel?: React.ReactNode;\n skipLabel?: React.ReactNode;\n}'
|
|
4258
|
+
}
|
|
4259
|
+
],
|
|
4260
|
+
readme: '# @nucleux/structured-input\n\nStructuredInput \u2014 an agent\'s structured clarifying question \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/structured-input @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { StructuredInput } from "@nucleux/structured-input";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
4261
|
+
peerDependencies: {
|
|
4262
|
+
react: ">=18",
|
|
4263
|
+
"react-dom": ">=18"
|
|
4264
|
+
}
|
|
4265
|
+
},
|
|
1669
4266
|
{
|
|
1670
4267
|
name: "suggestions",
|
|
1671
4268
|
package: "@nucleux/suggestions",
|
|
@@ -1840,6 +4437,43 @@ var catalog_default = {
|
|
|
1840
4437
|
"react-dom": ">=18"
|
|
1841
4438
|
}
|
|
1842
4439
|
},
|
|
4440
|
+
{
|
|
4441
|
+
name: "textarea",
|
|
4442
|
+
package: "@nucleux/textarea",
|
|
4443
|
+
kind: "component",
|
|
4444
|
+
description: "A multi-line text input, tokenized and themeable.",
|
|
4445
|
+
summary: "Multi-line text input \u2014 Nucleux agentic UI for React.",
|
|
4446
|
+
keywords: [
|
|
4447
|
+
"nucleux",
|
|
4448
|
+
"react",
|
|
4449
|
+
"ui",
|
|
4450
|
+
"components",
|
|
4451
|
+
"agentic",
|
|
4452
|
+
"ai",
|
|
4453
|
+
"tailwind",
|
|
4454
|
+
"textarea"
|
|
4455
|
+
],
|
|
4456
|
+
exports: [
|
|
4457
|
+
"Textarea",
|
|
4458
|
+
"TextareaProps"
|
|
4459
|
+
],
|
|
4460
|
+
components: [
|
|
4461
|
+
"Textarea"
|
|
4462
|
+
],
|
|
4463
|
+
import: 'import { Textarea } from "@nucleux/textarea";',
|
|
4464
|
+
installSingle: "pnpm add @nucleux/textarea @nucleux/tokens",
|
|
4465
|
+
props: [
|
|
4466
|
+
{
|
|
4467
|
+
name: "TextareaProps",
|
|
4468
|
+
source: "export interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {\n /** Render an error ring and set `aria-invalid`. */\n invalid?: boolean;\n}"
|
|
4469
|
+
}
|
|
4470
|
+
],
|
|
4471
|
+
readme: '# @nucleux/textarea\n\nMulti-line text input \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/textarea @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Textarea } from "@nucleux/textarea";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
4472
|
+
peerDependencies: {
|
|
4473
|
+
react: ">=18",
|
|
4474
|
+
"react-dom": ">=18"
|
|
4475
|
+
}
|
|
4476
|
+
},
|
|
1843
4477
|
{
|
|
1844
4478
|
name: "thread",
|
|
1845
4479
|
package: "@nucleux/thread",
|
|
@@ -1925,6 +4559,87 @@ var catalog_default = {
|
|
|
1925
4559
|
"react-dom": ">=18"
|
|
1926
4560
|
}
|
|
1927
4561
|
},
|
|
4562
|
+
{
|
|
4563
|
+
name: "toggle",
|
|
4564
|
+
package: "@nucleux/toggle",
|
|
4565
|
+
kind: "component",
|
|
4566
|
+
description: "A two-state button that stays pressed until toggled off.",
|
|
4567
|
+
summary: "Two-state pressable toggle button \u2014 Nucleux agentic UI for React.",
|
|
4568
|
+
keywords: [
|
|
4569
|
+
"nucleux",
|
|
4570
|
+
"react",
|
|
4571
|
+
"ui",
|
|
4572
|
+
"components",
|
|
4573
|
+
"agentic",
|
|
4574
|
+
"ai",
|
|
4575
|
+
"tailwind",
|
|
4576
|
+
"toggle"
|
|
4577
|
+
],
|
|
4578
|
+
exports: [
|
|
4579
|
+
"Toggle",
|
|
4580
|
+
"ToggleProps"
|
|
4581
|
+
],
|
|
4582
|
+
components: [
|
|
4583
|
+
"Toggle"
|
|
4584
|
+
],
|
|
4585
|
+
import: 'import { Toggle } from "@nucleux/toggle";',
|
|
4586
|
+
installSingle: "pnpm add @nucleux/toggle @nucleux/tokens",
|
|
4587
|
+
props: [
|
|
4588
|
+
{
|
|
4589
|
+
name: "ToggleProps",
|
|
4590
|
+
source: 'export interface ToggleProps\n extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onChange"> {\n /** Controlled pressed state. */\n pressed?: boolean;\n /** Uncontrolled initial pressed state. */\n defaultPressed?: boolean;\n /** Fired with the next pressed state on activation. */\n onPressedChange?: (pressed: boolean) => void;\n variant?: "default" | "outline";\n size?: "sm" | "md" | "lg";\n}'
|
|
4591
|
+
}
|
|
4592
|
+
],
|
|
4593
|
+
readme: '# @nucleux/toggle\n\nTwo-state pressable toggle button \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/toggle @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { Toggle } from "@nucleux/toggle";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
4594
|
+
peerDependencies: {
|
|
4595
|
+
react: ">=18",
|
|
4596
|
+
"react-dom": ">=18"
|
|
4597
|
+
}
|
|
4598
|
+
},
|
|
4599
|
+
{
|
|
4600
|
+
name: "toggle-group",
|
|
4601
|
+
package: "@nucleux/toggle-group",
|
|
4602
|
+
kind: "component",
|
|
4603
|
+
description: "A set of {@link ToggleGroupItem}s behaving as a single- or multi-select group.",
|
|
4604
|
+
summary: "Group of single/multi-select toggles \u2014 Nucleux agentic UI for React.",
|
|
4605
|
+
keywords: [
|
|
4606
|
+
"nucleux",
|
|
4607
|
+
"react",
|
|
4608
|
+
"ui",
|
|
4609
|
+
"components",
|
|
4610
|
+
"agentic",
|
|
4611
|
+
"ai",
|
|
4612
|
+
"tailwind",
|
|
4613
|
+
"toggle-group"
|
|
4614
|
+
],
|
|
4615
|
+
exports: [
|
|
4616
|
+
"ToggleGroup",
|
|
4617
|
+
"ToggleGroupItem",
|
|
4618
|
+
"ToggleGroupProps",
|
|
4619
|
+
"ToggleGroupItemProps"
|
|
4620
|
+
],
|
|
4621
|
+
components: [
|
|
4622
|
+
"ToggleGroup",
|
|
4623
|
+
"ToggleGroupItem"
|
|
4624
|
+
],
|
|
4625
|
+
import: 'import { ToggleGroup, ToggleGroupItem } from "@nucleux/toggle-group";',
|
|
4626
|
+
installSingle: "pnpm add @nucleux/toggle-group @nucleux/tokens",
|
|
4627
|
+
props: [
|
|
4628
|
+
{
|
|
4629
|
+
name: "ToggleGroupProps",
|
|
4630
|
+
source: 'export interface ToggleGroupProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue"> {\n /** "single" allows one active item; "multiple" allows many. */\n type?: "single" | "multiple";\n value?: Value | Value[];\n defaultValue?: Value | Value[];\n onValueChange?: (value: Value | Value[]) => void;\n size?: "sm" | "md" | "lg";\n variant?: "default" | "outline";\n}'
|
|
4631
|
+
},
|
|
4632
|
+
{
|
|
4633
|
+
name: "ToggleGroupItemProps",
|
|
4634
|
+
source: "export interface ToggleGroupItemProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n value: Value;\n}"
|
|
4635
|
+
}
|
|
4636
|
+
],
|
|
4637
|
+
readme: '# @nucleux/toggle-group\n\nGroup of single/multi-select toggles \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/toggle-group @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { ToggleGroup } from "@nucleux/toggle-group";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
4638
|
+
peerDependencies: {
|
|
4639
|
+
react: ">=18",
|
|
4640
|
+
"react-dom": ">=18"
|
|
4641
|
+
}
|
|
4642
|
+
},
|
|
1928
4643
|
{
|
|
1929
4644
|
name: "tokens",
|
|
1930
4645
|
package: "@nucleux/tokens",
|
|
@@ -1949,6 +4664,46 @@ var catalog_default = {
|
|
|
1949
4664
|
readme: '# @nucleux/tokens\n\nDesign tokens (CSS variables) + Tailwind preset for Nucleux \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/tokens\n```\n\n## Usage\n\n```ts\n// Theme stylesheet (import once near your app root)\nimport "@nucleux/tokens/styles.css";\n\n// Tailwind preset\nimport nucleux from "@nucleux/tokens/preset";\nexport default { presets: [nucleux], content: ["./src/**/*.{ts,tsx}"] };\n```\n\n## License\n\nMIT \xA9 Nucleux',
|
|
1950
4665
|
peerDependencies: {}
|
|
1951
4666
|
},
|
|
4667
|
+
{
|
|
4668
|
+
name: "tone-selector",
|
|
4669
|
+
package: "@nucleux/tone-selector",
|
|
4670
|
+
kind: "component",
|
|
4671
|
+
description: 'A tone/voice picker that steers the style of generated output \u2014 pick a tone\nand the assistant regenerates in it.\nSource: Figma "Expressive Input / Voice & Tone".',
|
|
4672
|
+
summary: "ToneSelector \u2014 pick the tone or voice of generated output \u2014 Nucleux agentic UI for React.",
|
|
4673
|
+
keywords: [
|
|
4674
|
+
"nucleux",
|
|
4675
|
+
"react",
|
|
4676
|
+
"ui",
|
|
4677
|
+
"components",
|
|
4678
|
+
"agentic",
|
|
4679
|
+
"ai",
|
|
4680
|
+
"tailwind",
|
|
4681
|
+
"tone-selector"
|
|
4682
|
+
],
|
|
4683
|
+
exports: [
|
|
4684
|
+
"defaultTones",
|
|
4685
|
+
"ToneSelector",
|
|
4686
|
+
"ToneOption",
|
|
4687
|
+
"ToneSelectorProps"
|
|
4688
|
+
],
|
|
4689
|
+
components: [
|
|
4690
|
+
"ToneSelector",
|
|
4691
|
+
"ToneOption"
|
|
4692
|
+
],
|
|
4693
|
+
import: 'import { ToneSelector, ToneOption } from "@nucleux/tone-selector";',
|
|
4694
|
+
installSingle: "pnpm add @nucleux/tone-selector @nucleux/tokens",
|
|
4695
|
+
props: [
|
|
4696
|
+
{
|
|
4697
|
+
name: "ToneSelectorProps",
|
|
4698
|
+
source: 'export interface ToneSelectorProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> {\n /** Tone options. Defaults to {@link defaultTones}. */\n options?: ToneOption[];\n /** Selected value (controlled). */\n value?: string;\n /** Initial value (uncontrolled). */\n defaultValue?: string;\n /** Called when a tone is chosen. */\n onValueChange?: (value: string) => void;\n /** Group label. Defaults to `"Tone"`. */\n label?: React.ReactNode;\n}'
|
|
4699
|
+
}
|
|
4700
|
+
],
|
|
4701
|
+
readme: '# @nucleux/tone-selector\n\nToneSelector \u2014 pick the tone or voice of generated output \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/tone-selector @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { ToneSelector } from "@nucleux/tone-selector";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
4702
|
+
peerDependencies: {
|
|
4703
|
+
react: ">=18",
|
|
4704
|
+
"react-dom": ">=18"
|
|
4705
|
+
}
|
|
4706
|
+
},
|
|
1952
4707
|
{
|
|
1953
4708
|
name: "tool-call",
|
|
1954
4709
|
package: "@nucleux/tool-call",
|
|
@@ -2085,6 +4840,45 @@ var catalog_default = {
|
|
|
2085
4840
|
props: [],
|
|
2086
4841
|
readme: '# @nucleux/utils\n\ncn() class merger + shared types for Nucleux \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/utils @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\n\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
2087
4842
|
peerDependencies: {}
|
|
4843
|
+
},
|
|
4844
|
+
{
|
|
4845
|
+
name: "voice-input",
|
|
4846
|
+
package: "@nucleux/voice-input",
|
|
4847
|
+
kind: "component",
|
|
4848
|
+
description: 'A composer in a live-dictation state \u2014 mic trigger, animated waveform while\nrecording, and a transcribing state \u2014 for voice input to the agent.\nSource: Figma "Expressive Input / Voice Input".',
|
|
4849
|
+
summary: "VoiceInput \u2014 a live dictation bar with a waveform \u2014 Nucleux agentic UI for React.",
|
|
4850
|
+
keywords: [
|
|
4851
|
+
"nucleux",
|
|
4852
|
+
"react",
|
|
4853
|
+
"ui",
|
|
4854
|
+
"components",
|
|
4855
|
+
"agentic",
|
|
4856
|
+
"ai",
|
|
4857
|
+
"tailwind",
|
|
4858
|
+
"voice-input"
|
|
4859
|
+
],
|
|
4860
|
+
exports: [
|
|
4861
|
+
"VoiceInput",
|
|
4862
|
+
"VoiceInputState",
|
|
4863
|
+
"VoiceInputProps"
|
|
4864
|
+
],
|
|
4865
|
+
components: [
|
|
4866
|
+
"VoiceInput",
|
|
4867
|
+
"VoiceInputState"
|
|
4868
|
+
],
|
|
4869
|
+
import: 'import { VoiceInput, VoiceInputState } from "@nucleux/voice-input";',
|
|
4870
|
+
installSingle: "pnpm add @nucleux/voice-input @nucleux/tokens",
|
|
4871
|
+
props: [
|
|
4872
|
+
{
|
|
4873
|
+
name: "VoiceInputProps",
|
|
4874
|
+
source: 'export interface VoiceInputProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Current state of the dictation flow. */\n state?: VoiceInputState;\n /** Elapsed time label while recording, e.g. `"0:12"`. */\n duration?: React.ReactNode;\n /** Transcribed text shown once available. */\n transcript?: React.ReactNode;\n /** Called from the idle mic button to start recording. */\n onStart?: () => void;\n /** Called to cancel/discard the recording. */\n onCancel?: () => void;\n /** Called to stop recording and confirm. */\n onConfirm?: () => void;\n}'
|
|
4875
|
+
}
|
|
4876
|
+
],
|
|
4877
|
+
readme: '# @nucleux/voice-input\n\nVoiceInput \u2014 a live dictation bar with a waveform \u2014 Nucleux agentic UI for React.\n\nPart of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** \u2014 agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).\n\n## Install\n\n```bash\npnpm add @nucleux/voice-input @nucleux/tokens\n```\n\n`react` / `react-dom` are peer dependencies.\n\n## Usage\n\n```tsx\nimport { VoiceInput } from "@nucleux/voice-input";\n```\n\nRequires the theme once in your app: `import "@nucleux/tokens/styles.css";`\nand the Tailwind preset from `@nucleux/tokens/preset`.\n\n## License\n\nMIT \xA9 Nucleux',
|
|
4878
|
+
peerDependencies: {
|
|
4879
|
+
react: ">=18",
|
|
4880
|
+
"react-dom": ">=18"
|
|
4881
|
+
}
|
|
2088
4882
|
}
|
|
2089
4883
|
],
|
|
2090
4884
|
examples: [
|