@nucleux/caveat 0.8.0 → 0.10.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/dist/index.cjs +47 -18
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +8 -1
- package/dist/index.d.ts +8 -1
- package/dist/index.js +47 -18
- package/dist/index.js.map +1 -1
- package/package.json +5 -4
package/dist/index.cjs
CHANGED
|
@@ -30,25 +30,54 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
|
30
30
|
// src/index.tsx
|
|
31
31
|
var DEFAULT_TEXT = "AI can make mistakes. Verify important information.";
|
|
32
32
|
var Caveat = React__namespace.forwardRef(
|
|
33
|
-
({ variant = "below-input", icon, actions, className, children, ...props }, ref) =>
|
|
34
|
-
"
|
|
35
|
-
{
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
33
|
+
({ variant = "below-input", icon, actions, detail, className, children, ...props }, ref) => {
|
|
34
|
+
const glyph = icon === void 0 ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Info, { "aria-hidden": "true" }) : icon;
|
|
35
|
+
if (detail != null) {
|
|
36
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
37
|
+
"p",
|
|
38
|
+
{
|
|
39
|
+
ref,
|
|
40
|
+
role: "note",
|
|
41
|
+
"data-variant": variant,
|
|
42
|
+
className: utils.cn(
|
|
43
|
+
"flex w-full flex-col gap-2 text-sm [&_svg]:shrink-0",
|
|
44
|
+
variant === "output-footer" && "mt-2.5 rounded-lg border border-border bg-muted/60 px-3.5 py-3",
|
|
45
|
+
className
|
|
46
|
+
),
|
|
47
|
+
...props,
|
|
48
|
+
children: [
|
|
49
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-start gap-2.5 [&>svg]:mt-0.5 [&>svg]:size-4 [&>svg]:text-muted-foreground", children: [
|
|
50
|
+
glyph,
|
|
51
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex min-w-0 flex-col gap-0.5", children: [
|
|
52
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium text-foreground", children: children ?? DEFAULT_TEXT }),
|
|
53
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: detail })
|
|
54
|
+
] })
|
|
55
|
+
] }),
|
|
56
|
+
actions && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-5 inline-flex flex-wrap items-center gap-1.5 [&_svg]:size-3.5", children: actions })
|
|
57
|
+
]
|
|
58
|
+
}
|
|
59
|
+
);
|
|
50
60
|
}
|
|
51
|
-
|
|
61
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
62
|
+
"p",
|
|
63
|
+
{
|
|
64
|
+
ref,
|
|
65
|
+
role: "note",
|
|
66
|
+
"data-variant": variant,
|
|
67
|
+
className: utils.cn(
|
|
68
|
+
"items-center gap-1.5 text-xs text-muted-foreground [&_svg]:size-3.5 [&_svg]:shrink-0",
|
|
69
|
+
variant === "output-footer" ? "mt-2.5 flex w-full flex-wrap rounded-md border border-border bg-muted/60 px-2.5 py-2 text-foreground/80" : "inline-flex",
|
|
70
|
+
className
|
|
71
|
+
),
|
|
72
|
+
...props,
|
|
73
|
+
children: [
|
|
74
|
+
glyph,
|
|
75
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { children: children ?? DEFAULT_TEXT }),
|
|
76
|
+
actions && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-auto inline-flex flex-wrap items-center gap-1.5", children: actions })
|
|
77
|
+
]
|
|
78
|
+
}
|
|
79
|
+
);
|
|
80
|
+
}
|
|
52
81
|
);
|
|
53
82
|
Caveat.displayName = "Caveat";
|
|
54
83
|
var CaveatTooltip = React__namespace.forwardRef(
|
package/dist/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.tsx"],"names":["React","jsxs","cn","jsx","
|
|
1
|
+
{"version":3,"sources":["../src/index.tsx"],"names":["React","Info","jsxs","cn","jsx","Tooltip"],"mappings":"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","file":"index.cjs","sourcesContent":["import * as React from \"react\";\nimport { Info } from \"lucide-react\";\nimport { cn } from \"@nucleux/utils\";\nimport { Tooltip, type TooltipSide } from \"@nucleux/tooltip\";\n\n/**\n * Where the caveat sits.\n * - `below-input` — a quiet caption under the composer, seen before anything is sent (default).\n * - `output-footer` — a filled note under output that will be acted on (sent, published,\n * deployed); can carry next steps in `actions`.\n * For the third spec variant, `info-tooltip`, wrap the generate control in `CaveatTooltip`.\n */\nexport type CaveatVariant = \"below-input\" | \"output-footer\";\n\nexport interface CaveatProps extends React.HTMLAttributes<HTMLParagraphElement> {\n /** Placement style. Default `below-input`. */\n variant?: CaveatVariant;\n /** Leading icon. Defaults to an info glyph. Pass `null` to omit. */\n icon?: React.ReactNode;\n /**\n * Next steps that remove the reason for the caveat — \"Review sources\",\n * \"Reconnect\". Shown after the text; use small Buttons or links.\n */\n actions?: React.ReactNode;\n /**\n * Why the limitation matters for this result (\"Themes raised only in those\n * two calls are missing\"). When given, the note stacks: the limitation, this\n * line under it, then the `actions` on their own row.\n */\n detail?: React.ReactNode;\n}\n\nconst DEFAULT_TEXT = \"AI can make mistakes. Verify important information.\";\n\n/**\n * A short, calm reminder that AI output can be wrong and should be checked —\n * or, better, the specific limitation of this result (\"2 of 8 interviews\n * could not be opened\"). Caption-size and muted, never alarming or\n * apologetic, once per surface. `below-input` sits under the composer;\n * `output-footer` sits under output that will be acted on and can offer\n * next steps; with a `detail` line the note stacks (limitation, why it\n * matters, then the next steps). Rendered as a `note`.\n */\nexport const Caveat = React.forwardRef<HTMLParagraphElement, CaveatProps>(\n ({ variant = \"below-input\", icon, actions, detail, className, children, ...props }, ref) => {\n const glyph = icon === undefined ? <Info aria-hidden=\"true\" /> : icon;\n if (detail != null) {\n return (\n <p\n ref={ref}\n role=\"note\"\n data-variant={variant}\n className={cn(\n \"flex w-full flex-col gap-2 text-sm [&_svg]:shrink-0\",\n variant === \"output-footer\" && \"mt-2.5 rounded-lg border border-border bg-muted/60 px-3.5 py-3\",\n className,\n )}\n {...props}\n >\n <span className=\"flex items-start gap-2.5 [&>svg]:mt-0.5 [&>svg]:size-4 [&>svg]:text-muted-foreground\">\n {glyph}\n <span className=\"flex min-w-0 flex-col gap-0.5\">\n <span className=\"font-medium text-foreground\">{children ?? DEFAULT_TEXT}</span>\n <span className=\"text-muted-foreground\">{detail}</span>\n </span>\n </span>\n {actions && <span className=\"ml-5 inline-flex flex-wrap items-center gap-1.5 [&_svg]:size-3.5\">{actions}</span>}\n </p>\n );\n }\n return (\n <p\n ref={ref}\n role=\"note\"\n data-variant={variant}\n className={cn(\n \"items-center gap-1.5 text-xs text-muted-foreground [&_svg]:size-3.5 [&_svg]:shrink-0\",\n variant === \"output-footer\"\n ? \"mt-2.5 flex w-full flex-wrap rounded-md border border-border bg-muted/60 px-2.5 py-2 text-foreground/80\"\n : \"inline-flex\",\n className,\n )}\n {...props}\n >\n {glyph}\n <span>{children ?? DEFAULT_TEXT}</span>\n {actions && <span className=\"ml-auto inline-flex flex-wrap items-center gap-1.5\">{actions}</span>}\n </p>\n );\n },\n);\nCaveat.displayName = \"Caveat\";\n\nexport interface CaveatTooltipProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, \"content\"> {\n /** The caveat. Default \"Output may be inaccurate\". */\n content?: React.ReactNode;\n /** Side of the trigger. Default `top`. */\n side?: TooltipSide;\n /** Show the info glyph in the tooltip. Default `true`. */\n showIcon?: boolean;\n /** The AI action the caveat rides on — a single focusable element (e.g. an `Iconography` or Button). */\n children: React.ReactElement;\n}\n\n/**\n * The `info-tooltip` caveat: the reminder rides the generate control,\n * shown on hover and keyboard focus without ever being in the way, and\n * linked to the control with `aria-describedby` so screen readers hear it too.\n */\nexport const CaveatTooltip = React.forwardRef<HTMLSpanElement, CaveatTooltipProps>(\n ({ content = \"Output may be inaccurate\", side = \"top\", showIcon = true, children, ...props }, ref) => {\n const id = React.useId();\n const childProps = children.props as { \"aria-describedby\"?: string };\n const trigger = React.cloneElement(children, {\n \"aria-describedby\": [childProps[\"aria-describedby\"], id].filter(Boolean).join(\" \"),\n } as Record<string, unknown>);\n return (\n <Tooltip\n ref={ref}\n side={side}\n content={\n <span id={id} className=\"inline-flex items-center gap-1.5 [&_svg]:size-3\">\n {showIcon && <Info aria-hidden=\"true\" />}\n {content}\n </span>\n }\n {...props}\n >\n {trigger}\n </Tooltip>\n );\n },\n);\nCaveatTooltip.displayName = \"CaveatTooltip\";\n"]}
|
package/dist/index.d.cts
CHANGED
|
@@ -19,6 +19,12 @@ interface CaveatProps extends React.HTMLAttributes<HTMLParagraphElement> {
|
|
|
19
19
|
* "Reconnect". Shown after the text; use small Buttons or links.
|
|
20
20
|
*/
|
|
21
21
|
actions?: React.ReactNode;
|
|
22
|
+
/**
|
|
23
|
+
* Why the limitation matters for this result ("Themes raised only in those
|
|
24
|
+
* two calls are missing"). When given, the note stacks: the limitation, this
|
|
25
|
+
* line under it, then the `actions` on their own row.
|
|
26
|
+
*/
|
|
27
|
+
detail?: React.ReactNode;
|
|
22
28
|
}
|
|
23
29
|
/**
|
|
24
30
|
* A short, calm reminder that AI output can be wrong and should be checked —
|
|
@@ -26,7 +32,8 @@ interface CaveatProps extends React.HTMLAttributes<HTMLParagraphElement> {
|
|
|
26
32
|
* could not be opened"). Caption-size and muted, never alarming or
|
|
27
33
|
* apologetic, once per surface. `below-input` sits under the composer;
|
|
28
34
|
* `output-footer` sits under output that will be acted on and can offer
|
|
29
|
-
* next steps
|
|
35
|
+
* next steps; with a `detail` line the note stacks (limitation, why it
|
|
36
|
+
* matters, then the next steps). Rendered as a `note`.
|
|
30
37
|
*/
|
|
31
38
|
declare const Caveat: React.ForwardRefExoticComponent<CaveatProps & React.RefAttributes<HTMLParagraphElement>>;
|
|
32
39
|
interface CaveatTooltipProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "content"> {
|
package/dist/index.d.ts
CHANGED
|
@@ -19,6 +19,12 @@ interface CaveatProps extends React.HTMLAttributes<HTMLParagraphElement> {
|
|
|
19
19
|
* "Reconnect". Shown after the text; use small Buttons or links.
|
|
20
20
|
*/
|
|
21
21
|
actions?: React.ReactNode;
|
|
22
|
+
/**
|
|
23
|
+
* Why the limitation matters for this result ("Themes raised only in those
|
|
24
|
+
* two calls are missing"). When given, the note stacks: the limitation, this
|
|
25
|
+
* line under it, then the `actions` on their own row.
|
|
26
|
+
*/
|
|
27
|
+
detail?: React.ReactNode;
|
|
22
28
|
}
|
|
23
29
|
/**
|
|
24
30
|
* A short, calm reminder that AI output can be wrong and should be checked —
|
|
@@ -26,7 +32,8 @@ interface CaveatProps extends React.HTMLAttributes<HTMLParagraphElement> {
|
|
|
26
32
|
* could not be opened"). Caption-size and muted, never alarming or
|
|
27
33
|
* apologetic, once per surface. `below-input` sits under the composer;
|
|
28
34
|
* `output-footer` sits under output that will be acted on and can offer
|
|
29
|
-
* next steps
|
|
35
|
+
* next steps; with a `detail` line the note stacks (limitation, why it
|
|
36
|
+
* matters, then the next steps). Rendered as a `note`.
|
|
30
37
|
*/
|
|
31
38
|
declare const Caveat: React.ForwardRefExoticComponent<CaveatProps & React.RefAttributes<HTMLParagraphElement>>;
|
|
32
39
|
interface CaveatTooltipProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "content"> {
|
package/dist/index.js
CHANGED
|
@@ -8,25 +8,54 @@ import { jsxs, jsx } from 'react/jsx-runtime';
|
|
|
8
8
|
// src/index.tsx
|
|
9
9
|
var DEFAULT_TEXT = "AI can make mistakes. Verify important information.";
|
|
10
10
|
var Caveat = React.forwardRef(
|
|
11
|
-
({ variant = "below-input", icon, actions, className, children, ...props }, ref) =>
|
|
12
|
-
"
|
|
13
|
-
{
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
11
|
+
({ variant = "below-input", icon, actions, detail, className, children, ...props }, ref) => {
|
|
12
|
+
const glyph = icon === void 0 ? /* @__PURE__ */ jsx(Info, { "aria-hidden": "true" }) : icon;
|
|
13
|
+
if (detail != null) {
|
|
14
|
+
return /* @__PURE__ */ jsxs(
|
|
15
|
+
"p",
|
|
16
|
+
{
|
|
17
|
+
ref,
|
|
18
|
+
role: "note",
|
|
19
|
+
"data-variant": variant,
|
|
20
|
+
className: cn(
|
|
21
|
+
"flex w-full flex-col gap-2 text-sm [&_svg]:shrink-0",
|
|
22
|
+
variant === "output-footer" && "mt-2.5 rounded-lg border border-border bg-muted/60 px-3.5 py-3",
|
|
23
|
+
className
|
|
24
|
+
),
|
|
25
|
+
...props,
|
|
26
|
+
children: [
|
|
27
|
+
/* @__PURE__ */ jsxs("span", { className: "flex items-start gap-2.5 [&>svg]:mt-0.5 [&>svg]:size-4 [&>svg]:text-muted-foreground", children: [
|
|
28
|
+
glyph,
|
|
29
|
+
/* @__PURE__ */ jsxs("span", { className: "flex min-w-0 flex-col gap-0.5", children: [
|
|
30
|
+
/* @__PURE__ */ jsx("span", { className: "font-medium text-foreground", children: children ?? DEFAULT_TEXT }),
|
|
31
|
+
/* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: detail })
|
|
32
|
+
] })
|
|
33
|
+
] }),
|
|
34
|
+
actions && /* @__PURE__ */ jsx("span", { className: "ml-5 inline-flex flex-wrap items-center gap-1.5 [&_svg]:size-3.5", children: actions })
|
|
35
|
+
]
|
|
36
|
+
}
|
|
37
|
+
);
|
|
28
38
|
}
|
|
29
|
-
|
|
39
|
+
return /* @__PURE__ */ jsxs(
|
|
40
|
+
"p",
|
|
41
|
+
{
|
|
42
|
+
ref,
|
|
43
|
+
role: "note",
|
|
44
|
+
"data-variant": variant,
|
|
45
|
+
className: cn(
|
|
46
|
+
"items-center gap-1.5 text-xs text-muted-foreground [&_svg]:size-3.5 [&_svg]:shrink-0",
|
|
47
|
+
variant === "output-footer" ? "mt-2.5 flex w-full flex-wrap rounded-md border border-border bg-muted/60 px-2.5 py-2 text-foreground/80" : "inline-flex",
|
|
48
|
+
className
|
|
49
|
+
),
|
|
50
|
+
...props,
|
|
51
|
+
children: [
|
|
52
|
+
glyph,
|
|
53
|
+
/* @__PURE__ */ jsx("span", { children: children ?? DEFAULT_TEXT }),
|
|
54
|
+
actions && /* @__PURE__ */ jsx("span", { className: "ml-auto inline-flex flex-wrap items-center gap-1.5", children: actions })
|
|
55
|
+
]
|
|
56
|
+
}
|
|
57
|
+
);
|
|
58
|
+
}
|
|
30
59
|
);
|
|
31
60
|
Caveat.displayName = "Caveat";
|
|
32
61
|
var CaveatTooltip = React.forwardRef(
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.tsx"],"names":[],"mappings":";;;;;;;
|
|
1
|
+
{"version":3,"sources":["../src/index.tsx"],"names":[],"mappings":"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","file":"index.js","sourcesContent":["import * as React from \"react\";\nimport { Info } from \"lucide-react\";\nimport { cn } from \"@nucleux/utils\";\nimport { Tooltip, type TooltipSide } from \"@nucleux/tooltip\";\n\n/**\n * Where the caveat sits.\n * - `below-input` — a quiet caption under the composer, seen before anything is sent (default).\n * - `output-footer` — a filled note under output that will be acted on (sent, published,\n * deployed); can carry next steps in `actions`.\n * For the third spec variant, `info-tooltip`, wrap the generate control in `CaveatTooltip`.\n */\nexport type CaveatVariant = \"below-input\" | \"output-footer\";\n\nexport interface CaveatProps extends React.HTMLAttributes<HTMLParagraphElement> {\n /** Placement style. Default `below-input`. */\n variant?: CaveatVariant;\n /** Leading icon. Defaults to an info glyph. Pass `null` to omit. */\n icon?: React.ReactNode;\n /**\n * Next steps that remove the reason for the caveat — \"Review sources\",\n * \"Reconnect\". Shown after the text; use small Buttons or links.\n */\n actions?: React.ReactNode;\n /**\n * Why the limitation matters for this result (\"Themes raised only in those\n * two calls are missing\"). When given, the note stacks: the limitation, this\n * line under it, then the `actions` on their own row.\n */\n detail?: React.ReactNode;\n}\n\nconst DEFAULT_TEXT = \"AI can make mistakes. Verify important information.\";\n\n/**\n * A short, calm reminder that AI output can be wrong and should be checked —\n * or, better, the specific limitation of this result (\"2 of 8 interviews\n * could not be opened\"). Caption-size and muted, never alarming or\n * apologetic, once per surface. `below-input` sits under the composer;\n * `output-footer` sits under output that will be acted on and can offer\n * next steps; with a `detail` line the note stacks (limitation, why it\n * matters, then the next steps). Rendered as a `note`.\n */\nexport const Caveat = React.forwardRef<HTMLParagraphElement, CaveatProps>(\n ({ variant = \"below-input\", icon, actions, detail, className, children, ...props }, ref) => {\n const glyph = icon === undefined ? <Info aria-hidden=\"true\" /> : icon;\n if (detail != null) {\n return (\n <p\n ref={ref}\n role=\"note\"\n data-variant={variant}\n className={cn(\n \"flex w-full flex-col gap-2 text-sm [&_svg]:shrink-0\",\n variant === \"output-footer\" && \"mt-2.5 rounded-lg border border-border bg-muted/60 px-3.5 py-3\",\n className,\n )}\n {...props}\n >\n <span className=\"flex items-start gap-2.5 [&>svg]:mt-0.5 [&>svg]:size-4 [&>svg]:text-muted-foreground\">\n {glyph}\n <span className=\"flex min-w-0 flex-col gap-0.5\">\n <span className=\"font-medium text-foreground\">{children ?? DEFAULT_TEXT}</span>\n <span className=\"text-muted-foreground\">{detail}</span>\n </span>\n </span>\n {actions && <span className=\"ml-5 inline-flex flex-wrap items-center gap-1.5 [&_svg]:size-3.5\">{actions}</span>}\n </p>\n );\n }\n return (\n <p\n ref={ref}\n role=\"note\"\n data-variant={variant}\n className={cn(\n \"items-center gap-1.5 text-xs text-muted-foreground [&_svg]:size-3.5 [&_svg]:shrink-0\",\n variant === \"output-footer\"\n ? \"mt-2.5 flex w-full flex-wrap rounded-md border border-border bg-muted/60 px-2.5 py-2 text-foreground/80\"\n : \"inline-flex\",\n className,\n )}\n {...props}\n >\n {glyph}\n <span>{children ?? DEFAULT_TEXT}</span>\n {actions && <span className=\"ml-auto inline-flex flex-wrap items-center gap-1.5\">{actions}</span>}\n </p>\n );\n },\n);\nCaveat.displayName = \"Caveat\";\n\nexport interface CaveatTooltipProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, \"content\"> {\n /** The caveat. Default \"Output may be inaccurate\". */\n content?: React.ReactNode;\n /** Side of the trigger. Default `top`. */\n side?: TooltipSide;\n /** Show the info glyph in the tooltip. Default `true`. */\n showIcon?: boolean;\n /** The AI action the caveat rides on — a single focusable element (e.g. an `Iconography` or Button). */\n children: React.ReactElement;\n}\n\n/**\n * The `info-tooltip` caveat: the reminder rides the generate control,\n * shown on hover and keyboard focus without ever being in the way, and\n * linked to the control with `aria-describedby` so screen readers hear it too.\n */\nexport const CaveatTooltip = React.forwardRef<HTMLSpanElement, CaveatTooltipProps>(\n ({ content = \"Output may be inaccurate\", side = \"top\", showIcon = true, children, ...props }, ref) => {\n const id = React.useId();\n const childProps = children.props as { \"aria-describedby\"?: string };\n const trigger = React.cloneElement(children, {\n \"aria-describedby\": [childProps[\"aria-describedby\"], id].filter(Boolean).join(\" \"),\n } as Record<string, unknown>);\n return (\n <Tooltip\n ref={ref}\n side={side}\n content={\n <span id={id} className=\"inline-flex items-center gap-1.5 [&_svg]:size-3\">\n {showIcon && <Info aria-hidden=\"true\" />}\n {content}\n </span>\n }\n {...props}\n >\n {trigger}\n </Tooltip>\n );\n },\n);\nCaveatTooltip.displayName = \"CaveatTooltip\";\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nucleux/caveat",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.10.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"description": "Caveat — says what is incomplete, uncertain or out of date about an AI result — Nucleux agentic UI for React.",
|
|
@@ -33,9 +33,10 @@
|
|
|
33
33
|
"react-dom": ">=18"
|
|
34
34
|
},
|
|
35
35
|
"dependencies": {
|
|
36
|
-
"@nucleux/tooltip": "0.
|
|
37
|
-
"@nucleux/utils": "0.
|
|
38
|
-
"lucide-react": "^0.469.0"
|
|
36
|
+
"@nucleux/tooltip": "0.10.0",
|
|
37
|
+
"@nucleux/utils": "0.10.0",
|
|
38
|
+
"lucide-react": "^0.469.0",
|
|
39
|
+
"@nucleux/open-input": "0.10.0"
|
|
39
40
|
},
|
|
40
41
|
"devDependencies": {
|
|
41
42
|
"tsup": "^8.3.5",
|