npm - @nucleux/md3-disclaimer - Versions diffs - 0.9.0 → 0.11.0 - Mend

@nucleux/md3-disclaimer 0.9.0 → 0.11.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.

Files changed (5) hide show

package/dist/index.cjs CHANGED Viewed

@@ -42,6 +42,9 @@ var Md3Disclaimer = React__namespace.forwardRef(
     maxItems = 3,
     learnMoreHref,
     learnMoreLabel = "Learn more",
+    icon,
+    detailsLabel,
+    detailsCloseLabel = "Hide details",
     className,
     children,
     ...props
@@ -49,6 +52,7 @@ var Md3Disclaimer = React__namespace.forwardRef(
     const baseId = React__namespace.useId();
     const listId = `${baseId}-list`;
     const [expanded, setExpanded] = React__namespace.useState(false);
+    const [detailsOpen, setDetailsOpen] = React__namespace.useState(false);
     const Agent = capitalize(agentName);
     if (variant === "cutoff-note") {
       return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -71,34 +75,42 @@ var Md3Disclaimer = React__namespace.forwardRef(
       );
     }
     const limitations = variant === "limitations-card";
-    const heading = title ?? (limitations ? `${Agent} won't` : `What ${agentName} can do`);
+    const heading = title === null ? null : title ?? (limitations ? `${Agent} won't` : `What ${agentName} can do`);
     const visibleItems = items && !expanded ? items.slice(0, Math.max(0, maxItems)) : items;
+    const glyph = icon === void 0 ? limitations ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ShieldAlert, { className: "text-md-tertiary" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Info, {}) : icon;
+    const mark = glyph ? /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: "mt-0.5 flex shrink-0 text-md-on-surface-variant [&_svg]:size-5", children: glyph }) : null;
+    const groupsId = `${baseId}-groups`;
+    const groupsHidden = detailsLabel != null && !detailsOpen;
     return /* @__PURE__ */ jsxRuntime.jsxs(
       md3Card.Md3Card,
       {
         ref,
         variant: limitations ? "outlined" : "filled",
         role: "note",
-        "aria-labelledby": `${baseId}-title`,
+        "aria-labelledby": heading != null ? `${baseId}-title` : void 0,
+        "aria-label": heading == null ? `About ${agentName}` : void 0,
         className: utils.cn(
-          "flex flex-col gap-3 text-sm tracking-[0.25px]",
-          limitations ? "rounded-l-md-xs rounded-r-md-md border-l-4 border-l-md-tertiary bg-md-surface-container-low px-4 py-3.5" : "rounded-md-lg p-5",
+          "flex flex-col gap-2 text-sm tracking-[0.25px]",
+          limitations ? "rounded-l-md-xs rounded-r-md-md border-l-4 border-l-md-tertiary bg-md-surface-container-low px-4 py-3.5" : "rounded-md-lg px-4 py-3.5",
           className
         ),
         ...props,
         children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(
+          heading != null ? /* @__PURE__ */ jsxRuntime.jsxs(
             "p",
             {
               id: `${baseId}-title`,
-              className: "flex items-center gap-2 text-base font-medium leading-6 tracking-[0.15px] text-md-on-surface",
+              className: "flex items-center gap-2.5 text-base font-medium leading-6 tracking-[0.15px] text-md-on-surface",
               children: [
-                limitations ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ShieldAlert, { "aria-hidden": "true", className: "size-5 shrink-0 text-md-tertiary" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Info, { "aria-hidden": "true", className: "size-5 shrink-0 text-md-secondary" }),
+                mark,
                 heading
               ]
             }
-          ),
-          children != null && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-md-on-surface-variant", children }),
+          ) : null,
+          children != null && (heading == null ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-2.5 text-md-on-surface", children: [
+            mark,
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0 pt-px leading-5", children })
+          ] }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-md-on-surface-variant", children })),
           visibleItems && visibleItems.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
             "ul",
             {
@@ -118,10 +130,30 @@ var Md3Disclaimer = React__namespace.forwardRef(
               children: expanded ? "Show less" : `Show all (${items.length})`
             }
           ),
-          groups && groups.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("dl", { className: "m-0 flex flex-col gap-2.5", children: groups.map((g) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-[minmax(5.5rem,auto)_minmax(0,1fr)] items-baseline gap-x-3 gap-y-0.5", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("dt", { className: "font-medium text-md-on-surface", children: g.label }),
-            g.items.map((item, i) => /* @__PURE__ */ jsxRuntime.jsx("dd", { className: "col-start-2 m-0 text-md-on-surface-variant", children: item }, i))
-          ] }, g.label)) }),
+          groups && groups.length > 0 && detailsLabel != null && /* @__PURE__ */ jsxRuntime.jsx(
+            md3Button.Md3Button,
+            {
+              variant: "text",
+              "aria-expanded": detailsOpen,
+              "aria-controls": groupsId,
+              onClick: () => setDetailsOpen((o) => !o),
+              icon: detailsOpen ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { "aria-hidden": "true" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { "aria-hidden": "true" }),
+              className: "self-start pl-3 pr-4",
+              children: detailsOpen ? detailsCloseLabel : detailsLabel
+            }
+          ),
+          groups && groups.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
+            "dl",
+            {
+              id: groupsId,
+              hidden: groupsHidden,
+              className: utils.cn("m-0 flex flex-col gap-2.5 animate-nx-fade-in motion-reduce:animate-none", groupsHidden && "hidden"),
+              children: groups.map((g) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-[minmax(5.5rem,auto)_minmax(0,1fr)] items-baseline gap-x-3 gap-y-0.5", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("dt", { className: "font-medium text-md-on-surface", children: g.label }),
+                g.items.map((item, i) => /* @__PURE__ */ jsxRuntime.jsx("dd", { className: "col-start-2 m-0 text-md-on-surface-variant", children: item }, i))
+              ] }, g.label))
+            }
+          ),
           (cutoff || learnMoreHref) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 border-t border-md-outline-variant pt-3 text-xs tracking-[0.4px] text-md-on-surface-variant", children: [
             cutoff && /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
               "Knowledge cutoff \xB7 ",

package/dist/index.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/index.tsx"],"names":["React","jsxs","cn","jsx","Clock","Md3Card","ShieldAlert","Info","Md3Button"],"mappings":"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","file":"index.cjs","sourcesContent":["import * as React from \"react\";\nimport { Clock, Info, ShieldAlert } from \"lucide-react\";\nimport { cn } from \"@nucleux/utils\";\nimport type { DisclaimerGroup, DisclaimerProps, DisclaimerVariant } from \"@nucleux/disclaimer\";\nimport { Md3Button } from \"@nucleux/md3-button\";\nimport { Md3Card } from \"@nucleux/md3-card\";\n\n/** Props of {@link Md3Disclaimer} — identical to `DisclaimerProps` from `@nucleux/disclaimer`. /\nexport type Md3DisclaimerProps = DisclaimerProps;\n/* \"capabilities-list\", \"limitations-card\" or \"cutoff-note\". /\nexport type Md3DisclaimerVariant = DisclaimerVariant;\nexport type { DisclaimerGroup };\n\n// Copied from @nucleux/disclaimer (internal there).\nconst capitalize = (s: string) => s.charAt(0).toUpperCase() + s.slice(1);\n\nconst linkClass =\n \"rounded-md-xs font-medium text-md-primary underline underline-offset-2 outline-none hover:decoration-2 focus-visible:ring-2 focus-visible:ring-md-secondary\";\n\n/\n The Material 3 statement of what the agent can and can't do — the same API\n * and behaviour as `Disclaimer`. Calm and informative, never the error colour:\n * the capabilities list is a filled M3 card with an info mark in secondary;\n * the limitations card is a low surface whose leading rule takes the tertiary\n * role (a known limit is not a failure); the cutoff note is a full-corner,\n * body-small standing line. Points beyond `maxItems` (3) sit behind a text\n * \"Show all\" button, and `groups` render as labelled rows (can / can't /\n * needs approval / may get wrong) with the label in its own column.\n */\nexport const Md3Disclaimer = React.forwardRef<HTMLDivElement, Md3DisclaimerProps>(\n (\n {\n variant = \"capabilities-list\",\n agentName = \"the assistant\",\n title,\n items,\n groups,\n cutoff,\n maxItems = 3,\n learnMoreHref,\n learnMoreLabel = \"Learn more\",\n className,\n children,\n ...props\n },\n ref,\n ) => {\n const baseId = React.useId();\n const listId = `${baseId}-list`;\n const [expanded, setExpanded] = React.useState(false);\n const Agent = capitalize(agentName);\n\n if (variant === \"cutoff-note\") {\n return (\n <div\n ref={ref}\n role=\"note\"\n aria-label=\"Knowledge cutoff\"\n className={cn(\n \"inline-flex items-center gap-2 rounded-full bg-md-surface-container px-3.5 py-1.5 text-xs leading-4 tracking-[0.4px] text-md-on-surface-variant\",\n className,\n )}\n {...props}\n >\n <Clock aria-hidden=\"true\" className=\"size-3.5 shrink-0\" />\n {children ?? (cutoff ? `${Agent} knows up to ${cutoff}` : `${Agent} may not know recent events`)}\n {learnMoreHref && (\n <a href={learnMoreHref} className={linkClass}>\n {learnMoreLabel}\n </a>\n )}\n </div>\n );\n }\n\n const limitations = variant === \"limitations-card\";\n const heading = title ?? (limitations ? `${Agent} won't` : `What ${agentName} can do`);\n const visibleItems = items && !expanded ? items.slice(0, Math.max(0, maxItems)) : items;\n\n return (\n <Md3Card\n ref={ref}\n variant={limitations ? \"outlined\" : \"filled\"}\n role=\"note\"\n aria-labelledby={`${baseId}-title`}\n className={cn(\n \"flex flex-col gap-3 text-sm tracking-[0.25px]\",\n limitations\n ? \"rounded-l-md-xs rounded-r-md-md border-l-4 border-l-md-tertiary bg-md-surface-container-low px-4 py-3.5\"\n : \"rounded-md-lg p-5\",\n className,\n )}\n {...props}\n >\n <p\n id={`${baseId}-title`}\n className=\"flex items-center gap-2 text-base font-medium leading-6 tracking-[0.15px] text-md-on-surface\"\n >\n {limitations ? (\n <ShieldAlert aria-hidden=\"true\" className=\"size-5 shrink-0 text-md-tertiary\" />\n ) : (\n <Info aria-hidden=\"true\" className=\"size-5 shrink-0 text-md-secondary\" />\n )}\n {heading}\n </p>\n {children != null && <div className=\"text-md-on-surface-variant\">{children}</div>}\n {visibleItems && visibleItems.length > 0 && (\n <ul\n id={listId}\n className=\"m-0 flex list-disc flex-col gap-1 pl-5 text-md-on-surface-variant marker:text-md-outline\"\n >\n {visibleItems.map((item, i) => (\n <li key={i}>{item}</li>\n ))}\n </ul>\n )}\n {items && items.length > maxItems && (\n <Md3Button\n variant=\"text\"\n aria-expanded={expanded}\n aria-controls={listId}\n onClick={() => setExpanded((e) => !e)}\n className=\"-ml-3 h-8 self-start px-3\"\n >\n {expanded ? \"Show less\" : `Show all (${items.length})`}\n </Md3Button>\n )}\n {groups && groups.length > 0 && (\n <dl className=\"m-0 flex flex-col gap-2.5\">\n {groups.map((g) => (\n <div key={g.label} className=\"grid grid-cols-[minmax(5.5rem,auto)_minmax(0,1fr)] items-baseline gap-x-3 gap-y-0.5\">\n <dt className=\"font-medium text-md-on-surface\">{g.label}</dt>\n {g.items.map((item, i) => (\n <dd key={i} className=\"col-start-2 m-0 text-md-on-surface-variant\">\n {item}\n </dd>\n ))}\n </div>\n ))}\n </dl>\n )}\n {(cutoff \|\| learnMoreHref) && (\n <div className=\"flex items-center gap-3 border-t border-md-outline-variant pt-3 text-xs tracking-[0.4px] text-md-on-surface-variant\">\n {cutoff && <span>Knowledge cutoff · {cutoff}</span>}\n {learnMoreHref && (\n <a href={learnMoreHref} className={cn(\"ml-auto\", linkClass)}>\n {learnMoreLabel}\n </a>\n )}\n </div>\n )}\n </Md3Card>\n );\n },\n);\nMd3Disclaimer.displayName = \"Md3Disclaimer\";\n"]}
1	+ {"version":3,"sources":["../src/index.tsx"],"names":["React","jsxs","cn","jsx","Clock","ShieldAlert","Info","Md3Card","Md3Button","ChevronDown","ChevronRight"],"mappings":"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","file":"index.cjs","sourcesContent":["import * as React from \"react\";\nimport { ChevronDown, ChevronRight, Clock, Info, ShieldAlert } from \"lucide-react\";\nimport { cn } from \"@nucleux/utils\";\nimport type { DisclaimerGroup, DisclaimerProps, DisclaimerVariant } from \"@nucleux/disclaimer\";\nimport { Md3Button } from \"@nucleux/md3-button\";\nimport { Md3Card } from \"@nucleux/md3-card\";\n\n/** Props of {@link Md3Disclaimer} — identical to `DisclaimerProps` from `@nucleux/disclaimer`. /\nexport type Md3DisclaimerProps = DisclaimerProps;\n/* \"capabilities-list\", \"limitations-card\" or \"cutoff-note\". /\nexport type Md3DisclaimerVariant = DisclaimerVariant;\nexport type { DisclaimerGroup };\n\n// Copied from @nucleux/disclaimer (internal there).\nconst capitalize = (s: string) => s.charAt(0).toUpperCase() + s.slice(1);\n\nconst linkClass =\n \"rounded-md-xs font-medium text-md-primary underline underline-offset-2 outline-none hover:decoration-2 focus-visible:ring-2 focus-visible:ring-md-secondary\";\n\n/\n The Material 3 statement of what the agent can and can't do — the same API\n * and behaviour as `Disclaimer`. Calm and informative, never the error colour:\n * the capabilities list is a filled M3 card with an info mark in secondary;\n * the limitations card is a low surface whose leading rule takes the tertiary\n * role (a known limit is not a failure); the cutoff note is a full-corner,\n * body-small standing line. Points beyond `maxItems` (3) sit behind a text\n * \"Show all\" button, and `groups` render as labelled rows (can / can't /\n * needs approval / may get wrong) with the label in its own column.\n */\nexport const Md3Disclaimer = React.forwardRef<HTMLDivElement, Md3DisclaimerProps>(\n (\n {\n variant = \"capabilities-list\",\n agentName = \"the assistant\",\n title,\n items,\n groups,\n cutoff,\n maxItems = 3,\n learnMoreHref,\n learnMoreLabel = \"Learn more\",\n icon,\n detailsLabel,\n detailsCloseLabel = \"Hide details\",\n className,\n children,\n ...props\n },\n ref,\n ) => {\n const baseId = React.useId();\n const listId = `${baseId}-list`;\n const [expanded, setExpanded] = React.useState(false);\n const [detailsOpen, setDetailsOpen] = React.useState(false);\n const Agent = capitalize(agentName);\n\n if (variant === \"cutoff-note\") {\n return (\n <div\n ref={ref}\n role=\"note\"\n aria-label=\"Knowledge cutoff\"\n className={cn(\n \"inline-flex items-center gap-2 rounded-full bg-md-surface-container px-3.5 py-1.5 text-xs leading-4 tracking-[0.4px] text-md-on-surface-variant\",\n className,\n )}\n {...props}\n >\n <Clock aria-hidden=\"true\" className=\"size-3.5 shrink-0\" />\n {children ?? (cutoff ? `${Agent} knows up to ${cutoff}` : `${Agent} may not know recent events`)}\n {learnMoreHref && (\n <a href={learnMoreHref} className={linkClass}>\n {learnMoreLabel}\n </a>\n )}\n </div>\n );\n }\n\n const limitations = variant === \"limitations-card\";\n const heading =\n title === null ? null : (title ?? (limitations ? `${Agent} won't` : `What ${agentName} can do`));\n const visibleItems = items && !expanded ? items.slice(0, Math.max(0, maxItems)) : items;\n const glyph =\n icon === undefined ? (\n limitations ? (\n <ShieldAlert className=\"text-md-tertiary\" />\n ) : (\n <Info />\n )\n ) : (\n icon\n );\n const mark = glyph ? (\n <span aria-hidden=\"true\" className=\"mt-0.5 flex shrink-0 text-md-on-surface-variant [&_svg]:size-5\">\n {glyph}\n </span>\n ) : null;\n const groupsId = `${baseId}-groups`;\n const groupsHidden = detailsLabel != null && !detailsOpen;\n\n return (\n <Md3Card\n ref={ref}\n variant={limitations ? \"outlined\" : \"filled\"}\n role=\"note\"\n aria-labelledby={heading != null ? `${baseId}-title` : undefined}\n aria-label={heading == null ? `About ${agentName}` : undefined}\n className={cn(\n \"flex flex-col gap-2 text-sm tracking-[0.25px]\",\n limitations\n ? \"rounded-l-md-xs rounded-r-md-md border-l-4 border-l-md-tertiary bg-md-surface-container-low px-4 py-3.5\"\n : \"rounded-md-lg px-4 py-3.5\",\n className,\n )}\n {...props}\n >\n {heading != null ? (\n <p\n id={`${baseId}-title`}\n className=\"flex items-center gap-2.5 text-base font-medium leading-6 tracking-[0.15px] text-md-on-surface\"\n >\n {mark}\n {heading}\n </p>\n ) : null}\n {children != null &&\n (heading == null ? (\n <div className=\"flex items-start gap-2.5 text-md-on-surface\">\n {mark}\n <div className=\"min-w-0 pt-px leading-5\">{children}</div>\n </div>\n ) : (\n <div className=\"text-md-on-surface-variant\">{children}</div>\n ))}\n {visibleItems && visibleItems.length > 0 && (\n <ul\n id={listId}\n className=\"m-0 flex list-disc flex-col gap-1 pl-5 text-md-on-surface-variant marker:text-md-outline\"\n >\n {visibleItems.map((item, i) => (\n <li key={i}>{item}</li>\n ))}\n </ul>\n )}\n {items && items.length > maxItems && (\n <Md3Button\n variant=\"text\"\n aria-expanded={expanded}\n aria-controls={listId}\n onClick={() => setExpanded((e) => !e)}\n className=\"-ml-3 h-8 self-start px-3\"\n >\n {expanded ? \"Show less\" : `Show all (${items.length})`}\n </Md3Button>\n )}\n {groups && groups.length > 0 && detailsLabel != null && (\n <Md3Button\n variant=\"text\"\n aria-expanded={detailsOpen}\n aria-controls={groupsId}\n onClick={() => setDetailsOpen((o) => !o)}\n icon={detailsOpen ? <ChevronDown aria-hidden=\"true\" /> : <ChevronRight aria-hidden=\"true\" />}\n className=\"self-start pl-3 pr-4\"\n >\n {detailsOpen ? detailsCloseLabel : detailsLabel}\n </Md3Button>\n )}\n {groups && groups.length > 0 && (\n <dl\n id={groupsId}\n hidden={groupsHidden}\n className={cn(\"m-0 flex flex-col gap-2.5 animate-nx-fade-in motion-reduce:animate-none\", groupsHidden && \"hidden\")}\n >\n {groups.map((g) => (\n <div key={g.label} className=\"grid grid-cols-[minmax(5.5rem,auto)_minmax(0,1fr)] items-baseline gap-x-3 gap-y-0.5\">\n <dt className=\"font-medium text-md-on-surface\">{g.label}</dt>\n {g.items.map((item, i) => (\n <dd key={i} className=\"col-start-2 m-0 text-md-on-surface-variant\">\n {item}\n </dd>\n ))}\n </div>\n ))}\n </dl>\n )}\n {(cutoff \|\| learnMoreHref) && (\n <div className=\"flex items-center gap-3 border-t border-md-outline-variant pt-3 text-xs tracking-[0.4px] text-md-on-surface-variant\">\n {cutoff && <span>Knowledge cutoff · {cutoff}</span>}\n {learnMoreHref && (\n <a href={learnMoreHref} className={cn(\"ml-auto\", linkClass)}>\n {learnMoreLabel}\n </a>\n )}\n </div>\n )}\n </Md3Card>\n );\n },\n);\nMd3Disclaimer.displayName = \"Md3Disclaimer\";\n"]}

package/dist/index.js CHANGED Viewed

@@ -1,6 +1,6 @@
 "use client";
 import * as React from 'react';
-import { Clock, ShieldAlert, Info } from 'lucide-react';
+import { Clock, ChevronDown, ChevronRight, ShieldAlert, Info } from 'lucide-react';
 import { cn } from '@nucleux/utils';
 import { Md3Button } from '@nucleux/md3-button';
 import { Md3Card } from '@nucleux/md3-card';
@@ -20,6 +20,9 @@ var Md3Disclaimer = React.forwardRef(
     maxItems = 3,
     learnMoreHref,
     learnMoreLabel = "Learn more",
+    icon,
+    detailsLabel,
+    detailsCloseLabel = "Hide details",
     className,
     children,
     ...props
@@ -27,6 +30,7 @@ var Md3Disclaimer = React.forwardRef(
     const baseId = React.useId();
     const listId = `${baseId}-list`;
     const [expanded, setExpanded] = React.useState(false);
+    const [detailsOpen, setDetailsOpen] = React.useState(false);
     const Agent = capitalize(agentName);
     if (variant === "cutoff-note") {
       return /* @__PURE__ */ jsxs(
@@ -49,34 +53,42 @@ var Md3Disclaimer = React.forwardRef(
       );
     }
     const limitations = variant === "limitations-card";
-    const heading = title ?? (limitations ? `${Agent} won't` : `What ${agentName} can do`);
+    const heading = title === null ? null : title ?? (limitations ? `${Agent} won't` : `What ${agentName} can do`);
     const visibleItems = items && !expanded ? items.slice(0, Math.max(0, maxItems)) : items;
+    const glyph = icon === void 0 ? limitations ? /* @__PURE__ */ jsx(ShieldAlert, { className: "text-md-tertiary" }) : /* @__PURE__ */ jsx(Info, {}) : icon;
+    const mark = glyph ? /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "mt-0.5 flex shrink-0 text-md-on-surface-variant [&_svg]:size-5", children: glyph }) : null;
+    const groupsId = `${baseId}-groups`;
+    const groupsHidden = detailsLabel != null && !detailsOpen;
     return /* @__PURE__ */ jsxs(
       Md3Card,
       {
         ref,
         variant: limitations ? "outlined" : "filled",
         role: "note",
-        "aria-labelledby": `${baseId}-title`,
+        "aria-labelledby": heading != null ? `${baseId}-title` : void 0,
+        "aria-label": heading == null ? `About ${agentName}` : void 0,
         className: cn(
-          "flex flex-col gap-3 text-sm tracking-[0.25px]",
-          limitations ? "rounded-l-md-xs rounded-r-md-md border-l-4 border-l-md-tertiary bg-md-surface-container-low px-4 py-3.5" : "rounded-md-lg p-5",
+          "flex flex-col gap-2 text-sm tracking-[0.25px]",
+          limitations ? "rounded-l-md-xs rounded-r-md-md border-l-4 border-l-md-tertiary bg-md-surface-container-low px-4 py-3.5" : "rounded-md-lg px-4 py-3.5",
           className
         ),
         ...props,
         children: [
-          /* @__PURE__ */ jsxs(
+          heading != null ? /* @__PURE__ */ jsxs(
             "p",
             {
               id: `${baseId}-title`,
-              className: "flex items-center gap-2 text-base font-medium leading-6 tracking-[0.15px] text-md-on-surface",
+              className: "flex items-center gap-2.5 text-base font-medium leading-6 tracking-[0.15px] text-md-on-surface",
               children: [
-                limitations ? /* @__PURE__ */ jsx(ShieldAlert, { "aria-hidden": "true", className: "size-5 shrink-0 text-md-tertiary" }) : /* @__PURE__ */ jsx(Info, { "aria-hidden": "true", className: "size-5 shrink-0 text-md-secondary" }),
+                mark,
                 heading
               ]
             }
-          ),
-          children != null && /* @__PURE__ */ jsx("div", { className: "text-md-on-surface-variant", children }),
+          ) : null,
+          children != null && (heading == null ? /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-2.5 text-md-on-surface", children: [
+            mark,
+            /* @__PURE__ */ jsx("div", { className: "min-w-0 pt-px leading-5", children })
+          ] }) : /* @__PURE__ */ jsx("div", { className: "text-md-on-surface-variant", children })),
           visibleItems && visibleItems.length > 0 && /* @__PURE__ */ jsx(
             "ul",
             {
@@ -96,10 +108,30 @@ var Md3Disclaimer = React.forwardRef(
               children: expanded ? "Show less" : `Show all (${items.length})`
             }
           ),
-          groups && groups.length > 0 && /* @__PURE__ */ jsx("dl", { className: "m-0 flex flex-col gap-2.5", children: groups.map((g) => /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-[minmax(5.5rem,auto)_minmax(0,1fr)] items-baseline gap-x-3 gap-y-0.5", children: [
-            /* @__PURE__ */ jsx("dt", { className: "font-medium text-md-on-surface", children: g.label }),
-            g.items.map((item, i) => /* @__PURE__ */ jsx("dd", { className: "col-start-2 m-0 text-md-on-surface-variant", children: item }, i))
-          ] }, g.label)) }),
+          groups && groups.length > 0 && detailsLabel != null && /* @__PURE__ */ jsx(
+            Md3Button,
+            {
+              variant: "text",
+              "aria-expanded": detailsOpen,
+              "aria-controls": groupsId,
+              onClick: () => setDetailsOpen((o) => !o),
+              icon: detailsOpen ? /* @__PURE__ */ jsx(ChevronDown, { "aria-hidden": "true" }) : /* @__PURE__ */ jsx(ChevronRight, { "aria-hidden": "true" }),
+              className: "self-start pl-3 pr-4",
+              children: detailsOpen ? detailsCloseLabel : detailsLabel
+            }
+          ),
+          groups && groups.length > 0 && /* @__PURE__ */ jsx(
+            "dl",
+            {
+              id: groupsId,
+              hidden: groupsHidden,
+              className: cn("m-0 flex flex-col gap-2.5 animate-nx-fade-in motion-reduce:animate-none", groupsHidden && "hidden"),
+              children: groups.map((g) => /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-[minmax(5.5rem,auto)_minmax(0,1fr)] items-baseline gap-x-3 gap-y-0.5", children: [
+                /* @__PURE__ */ jsx("dt", { className: "font-medium text-md-on-surface", children: g.label }),
+                g.items.map((item, i) => /* @__PURE__ */ jsx("dd", { className: "col-start-2 m-0 text-md-on-surface-variant", children: item }, i))
+              ] }, g.label))
+            }
+          ),
           (cutoff || learnMoreHref) && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 border-t border-md-outline-variant pt-3 text-xs tracking-[0.4px] text-md-on-surface-variant", children: [
             cutoff && /* @__PURE__ */ jsxs("span", { children: [
               "Knowledge cutoff \xB7 ",

package/dist/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/index.tsx"],"names":[],"mappings":"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","file":"index.js","sourcesContent":["import * as React from \"react\";\nimport { Clock, Info, ShieldAlert } from \"lucide-react\";\nimport { cn } from \"@nucleux/utils\";\nimport type { DisclaimerGroup, DisclaimerProps, DisclaimerVariant } from \"@nucleux/disclaimer\";\nimport { Md3Button } from \"@nucleux/md3-button\";\nimport { Md3Card } from \"@nucleux/md3-card\";\n\n/** Props of {@link Md3Disclaimer} — identical to `DisclaimerProps` from `@nucleux/disclaimer`. /\nexport type Md3DisclaimerProps = DisclaimerProps;\n/* \"capabilities-list\", \"limitations-card\" or \"cutoff-note\". /\nexport type Md3DisclaimerVariant = DisclaimerVariant;\nexport type { DisclaimerGroup };\n\n// Copied from @nucleux/disclaimer (internal there).\nconst capitalize = (s: string) => s.charAt(0).toUpperCase() + s.slice(1);\n\nconst linkClass =\n \"rounded-md-xs font-medium text-md-primary underline underline-offset-2 outline-none hover:decoration-2 focus-visible:ring-2 focus-visible:ring-md-secondary\";\n\n/\n The Material 3 statement of what the agent can and can't do — the same API\n * and behaviour as `Disclaimer`. Calm and informative, never the error colour:\n * the capabilities list is a filled M3 card with an info mark in secondary;\n * the limitations card is a low surface whose leading rule takes the tertiary\n * role (a known limit is not a failure); the cutoff note is a full-corner,\n * body-small standing line. Points beyond `maxItems` (3) sit behind a text\n * \"Show all\" button, and `groups` render as labelled rows (can / can't /\n * needs approval / may get wrong) with the label in its own column.\n */\nexport const Md3Disclaimer = React.forwardRef<HTMLDivElement, Md3DisclaimerProps>(\n (\n {\n variant = \"capabilities-list\",\n agentName = \"the assistant\",\n title,\n items,\n groups,\n cutoff,\n maxItems = 3,\n learnMoreHref,\n learnMoreLabel = \"Learn more\",\n className,\n children,\n ...props\n },\n ref,\n ) => {\n const baseId = React.useId();\n const listId = `${baseId}-list`;\n const [expanded, setExpanded] = React.useState(false);\n const Agent = capitalize(agentName);\n\n if (variant === \"cutoff-note\") {\n return (\n <div\n ref={ref}\n role=\"note\"\n aria-label=\"Knowledge cutoff\"\n className={cn(\n \"inline-flex items-center gap-2 rounded-full bg-md-surface-container px-3.5 py-1.5 text-xs leading-4 tracking-[0.4px] text-md-on-surface-variant\",\n className,\n )}\n {...props}\n >\n <Clock aria-hidden=\"true\" className=\"size-3.5 shrink-0\" />\n {children ?? (cutoff ? `${Agent} knows up to ${cutoff}` : `${Agent} may not know recent events`)}\n {learnMoreHref && (\n <a href={learnMoreHref} className={linkClass}>\n {learnMoreLabel}\n </a>\n )}\n </div>\n );\n }\n\n const limitations = variant === \"limitations-card\";\n const heading = title ?? (limitations ? `${Agent} won't` : `What ${agentName} can do`);\n const visibleItems = items && !expanded ? items.slice(0, Math.max(0, maxItems)) : items;\n\n return (\n <Md3Card\n ref={ref}\n variant={limitations ? \"outlined\" : \"filled\"}\n role=\"note\"\n aria-labelledby={`${baseId}-title`}\n className={cn(\n \"flex flex-col gap-3 text-sm tracking-[0.25px]\",\n limitations\n ? \"rounded-l-md-xs rounded-r-md-md border-l-4 border-l-md-tertiary bg-md-surface-container-low px-4 py-3.5\"\n : \"rounded-md-lg p-5\",\n className,\n )}\n {...props}\n >\n <p\n id={`${baseId}-title`}\n className=\"flex items-center gap-2 text-base font-medium leading-6 tracking-[0.15px] text-md-on-surface\"\n >\n {limitations ? (\n <ShieldAlert aria-hidden=\"true\" className=\"size-5 shrink-0 text-md-tertiary\" />\n ) : (\n <Info aria-hidden=\"true\" className=\"size-5 shrink-0 text-md-secondary\" />\n )}\n {heading}\n </p>\n {children != null && <div className=\"text-md-on-surface-variant\">{children}</div>}\n {visibleItems && visibleItems.length > 0 && (\n <ul\n id={listId}\n className=\"m-0 flex list-disc flex-col gap-1 pl-5 text-md-on-surface-variant marker:text-md-outline\"\n >\n {visibleItems.map((item, i) => (\n <li key={i}>{item}</li>\n ))}\n </ul>\n )}\n {items && items.length > maxItems && (\n <Md3Button\n variant=\"text\"\n aria-expanded={expanded}\n aria-controls={listId}\n onClick={() => setExpanded((e) => !e)}\n className=\"-ml-3 h-8 self-start px-3\"\n >\n {expanded ? \"Show less\" : `Show all (${items.length})`}\n </Md3Button>\n )}\n {groups && groups.length > 0 && (\n <dl className=\"m-0 flex flex-col gap-2.5\">\n {groups.map((g) => (\n <div key={g.label} className=\"grid grid-cols-[minmax(5.5rem,auto)_minmax(0,1fr)] items-baseline gap-x-3 gap-y-0.5\">\n <dt className=\"font-medium text-md-on-surface\">{g.label}</dt>\n {g.items.map((item, i) => (\n <dd key={i} className=\"col-start-2 m-0 text-md-on-surface-variant\">\n {item}\n </dd>\n ))}\n </div>\n ))}\n </dl>\n )}\n {(cutoff \|\| learnMoreHref) && (\n <div className=\"flex items-center gap-3 border-t border-md-outline-variant pt-3 text-xs tracking-[0.4px] text-md-on-surface-variant\">\n {cutoff && <span>Knowledge cutoff · {cutoff}</span>}\n {learnMoreHref && (\n <a href={learnMoreHref} className={cn(\"ml-auto\", linkClass)}>\n {learnMoreLabel}\n </a>\n )}\n </div>\n )}\n </Md3Card>\n );\n },\n);\nMd3Disclaimer.displayName = \"Md3Disclaimer\";\n"]}
1	+ {"version":3,"sources":["../src/index.tsx"],"names":[],"mappings":"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","file":"index.js","sourcesContent":["import * as React from \"react\";\nimport { ChevronDown, ChevronRight, Clock, Info, ShieldAlert } from \"lucide-react\";\nimport { cn } from \"@nucleux/utils\";\nimport type { DisclaimerGroup, DisclaimerProps, DisclaimerVariant } from \"@nucleux/disclaimer\";\nimport { Md3Button } from \"@nucleux/md3-button\";\nimport { Md3Card } from \"@nucleux/md3-card\";\n\n/** Props of {@link Md3Disclaimer} — identical to `DisclaimerProps` from `@nucleux/disclaimer`. /\nexport type Md3DisclaimerProps = DisclaimerProps;\n/* \"capabilities-list\", \"limitations-card\" or \"cutoff-note\". /\nexport type Md3DisclaimerVariant = DisclaimerVariant;\nexport type { DisclaimerGroup };\n\n// Copied from @nucleux/disclaimer (internal there).\nconst capitalize = (s: string) => s.charAt(0).toUpperCase() + s.slice(1);\n\nconst linkClass =\n \"rounded-md-xs font-medium text-md-primary underline underline-offset-2 outline-none hover:decoration-2 focus-visible:ring-2 focus-visible:ring-md-secondary\";\n\n/\n The Material 3 statement of what the agent can and can't do — the same API\n * and behaviour as `Disclaimer`. Calm and informative, never the error colour:\n * the capabilities list is a filled M3 card with an info mark in secondary;\n * the limitations card is a low surface whose leading rule takes the tertiary\n * role (a known limit is not a failure); the cutoff note is a full-corner,\n * body-small standing line. Points beyond `maxItems` (3) sit behind a text\n * \"Show all\" button, and `groups` render as labelled rows (can / can't /\n * needs approval / may get wrong) with the label in its own column.\n */\nexport const Md3Disclaimer = React.forwardRef<HTMLDivElement, Md3DisclaimerProps>(\n (\n {\n variant = \"capabilities-list\",\n agentName = \"the assistant\",\n title,\n items,\n groups,\n cutoff,\n maxItems = 3,\n learnMoreHref,\n learnMoreLabel = \"Learn more\",\n icon,\n detailsLabel,\n detailsCloseLabel = \"Hide details\",\n className,\n children,\n ...props\n },\n ref,\n ) => {\n const baseId = React.useId();\n const listId = `${baseId}-list`;\n const [expanded, setExpanded] = React.useState(false);\n const [detailsOpen, setDetailsOpen] = React.useState(false);\n const Agent = capitalize(agentName);\n\n if (variant === \"cutoff-note\") {\n return (\n <div\n ref={ref}\n role=\"note\"\n aria-label=\"Knowledge cutoff\"\n className={cn(\n \"inline-flex items-center gap-2 rounded-full bg-md-surface-container px-3.5 py-1.5 text-xs leading-4 tracking-[0.4px] text-md-on-surface-variant\",\n className,\n )}\n {...props}\n >\n <Clock aria-hidden=\"true\" className=\"size-3.5 shrink-0\" />\n {children ?? (cutoff ? `${Agent} knows up to ${cutoff}` : `${Agent} may not know recent events`)}\n {learnMoreHref && (\n <a href={learnMoreHref} className={linkClass}>\n {learnMoreLabel}\n </a>\n )}\n </div>\n );\n }\n\n const limitations = variant === \"limitations-card\";\n const heading =\n title === null ? null : (title ?? (limitations ? `${Agent} won't` : `What ${agentName} can do`));\n const visibleItems = items && !expanded ? items.slice(0, Math.max(0, maxItems)) : items;\n const glyph =\n icon === undefined ? (\n limitations ? (\n <ShieldAlert className=\"text-md-tertiary\" />\n ) : (\n <Info />\n )\n ) : (\n icon\n );\n const mark = glyph ? (\n <span aria-hidden=\"true\" className=\"mt-0.5 flex shrink-0 text-md-on-surface-variant [&_svg]:size-5\">\n {glyph}\n </span>\n ) : null;\n const groupsId = `${baseId}-groups`;\n const groupsHidden = detailsLabel != null && !detailsOpen;\n\n return (\n <Md3Card\n ref={ref}\n variant={limitations ? \"outlined\" : \"filled\"}\n role=\"note\"\n aria-labelledby={heading != null ? `${baseId}-title` : undefined}\n aria-label={heading == null ? `About ${agentName}` : undefined}\n className={cn(\n \"flex flex-col gap-2 text-sm tracking-[0.25px]\",\n limitations\n ? \"rounded-l-md-xs rounded-r-md-md border-l-4 border-l-md-tertiary bg-md-surface-container-low px-4 py-3.5\"\n : \"rounded-md-lg px-4 py-3.5\",\n className,\n )}\n {...props}\n >\n {heading != null ? (\n <p\n id={`${baseId}-title`}\n className=\"flex items-center gap-2.5 text-base font-medium leading-6 tracking-[0.15px] text-md-on-surface\"\n >\n {mark}\n {heading}\n </p>\n ) : null}\n {children != null &&\n (heading == null ? (\n <div className=\"flex items-start gap-2.5 text-md-on-surface\">\n {mark}\n <div className=\"min-w-0 pt-px leading-5\">{children}</div>\n </div>\n ) : (\n <div className=\"text-md-on-surface-variant\">{children}</div>\n ))}\n {visibleItems && visibleItems.length > 0 && (\n <ul\n id={listId}\n className=\"m-0 flex list-disc flex-col gap-1 pl-5 text-md-on-surface-variant marker:text-md-outline\"\n >\n {visibleItems.map((item, i) => (\n <li key={i}>{item}</li>\n ))}\n </ul>\n )}\n {items && items.length > maxItems && (\n <Md3Button\n variant=\"text\"\n aria-expanded={expanded}\n aria-controls={listId}\n onClick={() => setExpanded((e) => !e)}\n className=\"-ml-3 h-8 self-start px-3\"\n >\n {expanded ? \"Show less\" : `Show all (${items.length})`}\n </Md3Button>\n )}\n {groups && groups.length > 0 && detailsLabel != null && (\n <Md3Button\n variant=\"text\"\n aria-expanded={detailsOpen}\n aria-controls={groupsId}\n onClick={() => setDetailsOpen((o) => !o)}\n icon={detailsOpen ? <ChevronDown aria-hidden=\"true\" /> : <ChevronRight aria-hidden=\"true\" />}\n className=\"self-start pl-3 pr-4\"\n >\n {detailsOpen ? detailsCloseLabel : detailsLabel}\n </Md3Button>\n )}\n {groups && groups.length > 0 && (\n <dl\n id={groupsId}\n hidden={groupsHidden}\n className={cn(\"m-0 flex flex-col gap-2.5 animate-nx-fade-in motion-reduce:animate-none\", groupsHidden && \"hidden\")}\n >\n {groups.map((g) => (\n <div key={g.label} className=\"grid grid-cols-[minmax(5.5rem,auto)_minmax(0,1fr)] items-baseline gap-x-3 gap-y-0.5\">\n <dt className=\"font-medium text-md-on-surface\">{g.label}</dt>\n {g.items.map((item, i) => (\n <dd key={i} className=\"col-start-2 m-0 text-md-on-surface-variant\">\n {item}\n </dd>\n ))}\n </div>\n ))}\n </dl>\n )}\n {(cutoff \|\| learnMoreHref) && (\n <div className=\"flex items-center gap-3 border-t border-md-outline-variant pt-3 text-xs tracking-[0.4px] text-md-on-surface-variant\">\n {cutoff && <span>Knowledge cutoff · {cutoff}</span>}\n {learnMoreHref && (\n <a href={learnMoreHref} className={cn(\"ml-auto\", linkClass)}>\n {learnMoreLabel}\n </a>\n )}\n </div>\n )}\n </Md3Card>\n );\n },\n);\nMd3Disclaimer.displayName = \"Md3Disclaimer\";\n"]}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@nucleux/md3-disclaimer",
-  "version": "0.9.0",
+  "version": "0.11.0",
   "type": "module",
   "sideEffects": false,
   "description": "Material 3 Disclaimer — a short, honest statement of what the agent can and can't do — Nucleux agentic UI for React.",
@@ -38,10 +38,10 @@
     "react-dom": ">=18"
   },
   "dependencies": {
-    "@nucleux/disclaimer": "0.9.0",
-    "@nucleux/md3-button": "0.9.0",
-    "@nucleux/md3-card": "0.9.0",
-    "@nucleux/utils": "0.9.0",
+    "@nucleux/disclaimer": "0.11.0",
+    "@nucleux/md3-button": "0.11.0",
+    "@nucleux/md3-card": "0.11.0",
+    "@nucleux/utils": "0.11.0",
     "lucide-react": "^0.469.0"
   },
   "devDependencies": {