@d4gger/design-system 3.0.1 → 4.0.1

package/dist/components/commentThread/CommentThread.cjs

@@ -39,39 +39,67 @@ __export(CommentThread_exports, {
 module.exports = __toCommonJS(CommentThread_exports);
 var React = __toESM(require("react"), 1);
 var import_classnames = __toESM(require("classnames"), 1);
+var import_Button = require("../button/Button");
 var import_jsx_runtime = require("react/jsx-runtime");
-const Comment = React.forwardRef(({ author, avatarSrc, badge, dateTime, timeLabel, actions, className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("article", { ...props, ref, className: (0, import_classnames.default)("dsx-comment-thread__comment", className), children: [
+const Comment = React.forwardRef(({ author, avatarSrc, badge, dateTime, timeLabel, actions, metadata, className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("article", { ...props, ref, className: (0, import_classnames.default)("dsx-comment-thread__comment", className), children: [
   /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dsx-comment-thread__avatar", children: avatarSrc ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("img", { src: avatarSrc, alt: "" }) : author.split(/\s+/).map((part) => part[0]).join("").slice(0, 2).toUpperCase() }),
   /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("header", { children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("strong", { children: author }),
     badge,
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("time", { dateTime, children: timeLabel })
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("time", { dateTime, children: timeLabel }),
+    metadata
   ] }),
   /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dsx-comment-thread__body", children }),
   actions ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dsx-comment-thread__actions", children: actions }) : null
 ] }));
 Comment.displayName = "CommentThreadComment";
 const ReplyDepthContext = React.createContext(0);
-const Replies = React.forwardRef(({ className, children, ...props }, ref) => {
+const Replies = React.forwardRef(({ className, children, limit, expanded: expandedProp, onExpandedChange, moreLabel, ...props }, ref) => {
+  const [localExpanded, setLocalExpanded] = React.useState(false);
+  const expanded = expandedProp ?? localExpanded;
+  const all = React.Children.toArray(children);
+  const visible = limit == null || expanded ? all : all.slice(0, Math.max(0, limit));
+  const remaining = all.length - visible.length;
   const depth = React.useContext(ReplyDepthContext);
   if (depth >= 1) throw new Error("CommentThread supports one reply level.");
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ReplyDepthContext.Provider, { value: depth + 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ...props, ref, role: props.role ?? "group", className: (0, import_classnames.default)("dsx-comment-thread__replies", className), children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ReplyDepthContext.Provider, { value: depth + 1, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { ...props, ref, role: props.role ?? "group", className: (0, import_classnames.default)("dsx-comment-thread__replies", className), children: [
+    visible,
+    remaining > 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Button.Button, { type: "button", size: "lg", variant: "ghost", onClick: () => {
+      setLocalExpanded(true);
+      onExpandedChange?.(true);
+    }, children: moreLabel?.(remaining) ?? `Show ${remaining} more replies` }) : null
+  ] }) });
 });
 Replies.displayName = "CommentThreadReplies";
-const Tombstone = React.forwardRef(({ children = "Comment removed", className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ...props, ref, className: (0, import_classnames.default)("dsx-comment-thread__tombstone", className), role: "status", "data-removed": "true", children }));
+const Tombstone = React.forwardRef(({ children, state = "removed", className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ...props, ref, className: (0, import_classnames.default)("dsx-comment-thread__tombstone", className), role: "status", "data-removed": "true", "data-state": state, children: children ?? `Comment ${state}` }));
 Tombstone.displayName = "CommentThreadTombstone";
-const Composer = React.forwardRef(({ value, onValueChange, onSubmit, maxLength = 2e3, submitting, locked, className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("form", { ...props, ref, className: (0, import_classnames.default)("dsx-comment-thread__composer", className), "aria-busy": submitting || void 0, onSubmit: (event) => {
-  event.preventDefault();
-  if (!locked && !submitting && value.trim()) onSubmit?.();
-}, children: [
-  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("textarea", { value, maxLength, disabled: locked || submitting, onChange: (event) => onValueChange(event.currentTarget.value), "aria-label": "Comment" }),
-  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { "aria-live": "polite", children: [
-    value.length,
-    "/",
-    maxLength
-  ] }),
-  children ?? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "submit", disabled: locked || submitting || !value.trim(), children: submitting ? "Submitting\u2026" : "Comment" })
-] }));
+const Composer = React.forwardRef(({ value, onValueChange, onSubmit, maxLength = 2e3, submitting, locked, label = "Comment", error, status, input, actions, className, children, ...props }, ref) => {
+  const id = React.useId();
+  const countId = `${id}-count`;
+  const errorId = `${id}-error`;
+  const statusId = `${id}-status`;
+  const invalid = Boolean(error) || value.length > maxLength;
+  const disabled = Boolean(locked || submitting);
+  const describedBy = [countId, error ? errorId : "", status ? statusId : ""].filter(Boolean).join(" ");
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("form", { ...props, ref, className: (0, import_classnames.default)("dsx-comment-thread__composer", className), "aria-busy": submitting || void 0, onSubmit: (event) => {
+    event.preventDefault();
+    if (!disabled && !invalid && value.trim()) onSubmit?.();
+  }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("label", { id: `${id}-label`, htmlFor: id, children: label }),
+    input ? input({ id, value, onValueChange, maxLength, disabled, describedBy, invalid }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("textarea", { id, value, maxLength, disabled, onChange: (event) => onValueChange(event.currentTarget.value), "aria-invalid": invalid || void 0, "aria-describedby": describedBy }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { id: countId, className: "dsx-comment-thread__count", "aria-live": "polite", children: [
+      value.length,
+      "/",
+      maxLength
+    ] }),
+    error ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { id: errorId, role: "alert", children: error }) : null,
+    status ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { id: statusId, role: "status", children: status }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsx-comment-thread__actions", children: [
+      actions,
+      children ?? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Button.Button, { className: "dsx-comment-thread__submit", type: "submit", size: "lg", disabled: disabled || invalid || !value.trim(), children: submitting ? "Submitting\u2026" : "Comment" })
+    ] })
+  ] });
+});
 Composer.displayName = "CommentThreadComposer";
 const Locked = React.forwardRef(({ children = "Comments are locked", className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ...props, ref, className: (0, import_classnames.default)("dsx-comment-thread__locked", className), role: "status", children }));
 Locked.displayName = "CommentThreadLocked";

package/dist/components/commentThread/CommentThread.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/commentThread/CommentThread.tsx"],
-  "sourcesContent": ["import * as React from 'react'\nimport classNames from 'classnames'\n\nimport type { CommentProps, CommentThreadRootProps, ComposerProps } from './commentThread.props'\n\nconst Comment = React.forwardRef<HTMLElement, CommentProps>(({ author, avatarSrc, badge, dateTime, timeLabel, actions, className, children, ...props }, ref) => <article {...props} ref={ref} className={classNames('dsx-comment-thread__comment', className)}><div className=\"dsx-comment-thread__avatar\">{avatarSrc ? <img src={avatarSrc} alt=\"\" /> : author.split(/\\s+/).map((part) => part[0]).join('').slice(0, 2).toUpperCase()}</div><header><strong>{author}</strong>{badge}<time dateTime={dateTime}>{timeLabel}</time></header><div className=\"dsx-comment-thread__body\">{children}</div>{actions ? <div className=\"dsx-comment-thread__actions\">{actions}</div> : null}</article>)\nComment.displayName = 'CommentThreadComment'\nconst ReplyDepthContext = React.createContext(0)\nconst Replies = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ className, children, ...props }, ref) => {\n  const depth = React.useContext(ReplyDepthContext)\n  if (depth >= 1) throw new Error('CommentThread supports one reply level.')\n  return <ReplyDepthContext.Provider value={depth + 1}><div {...props} ref={ref} role={props.role ?? 'group'} className={classNames('dsx-comment-thread__replies', className)}>{children}</div></ReplyDepthContext.Provider>\n})\nReplies.displayName = 'CommentThreadReplies'\nconst Tombstone = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ children = 'Comment removed', className, ...props }, ref) => <div {...props} ref={ref} className={classNames('dsx-comment-thread__tombstone', className)} role=\"status\" data-removed=\"true\">{children}</div>)\nTombstone.displayName = 'CommentThreadTombstone'\nconst Composer = React.forwardRef<HTMLFormElement, ComposerProps>(({ value, onValueChange, onSubmit, maxLength = 2000, submitting, locked, className, children, ...props }, ref) => <form {...props} ref={ref} className={classNames('dsx-comment-thread__composer', className)} aria-busy={submitting || undefined} onSubmit={(event) => { event.preventDefault(); if (!locked && !submitting && value.trim()) onSubmit?.() }}><textarea value={value} maxLength={maxLength} disabled={locked || submitting} onChange={(event) => onValueChange(event.currentTarget.value)} aria-label=\"Comment\"/><span aria-live=\"polite\">{value.length}/{maxLength}</span>{children ?? <button type=\"submit\" disabled={locked || submitting || !value.trim()}>{submitting ? 'Submitting\u2026' : 'Comment'}</button>}</form>)\nComposer.displayName = 'CommentThreadComposer'\nconst Locked = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ children = 'Comments are locked', className, ...props }, ref) => <div {...props} ref={ref} className={classNames('dsx-comment-thread__locked', className)} role=\"status\">{children}</div>)\nLocked.displayName = 'CommentThreadLocked'\nconst Root = React.forwardRef<HTMLDivElement, CommentThreadRootProps>(({ className, ...props }, ref) => <div {...props} ref={ref} className={classNames('dsx-comment-thread', className)} />)\nRoot.displayName = 'CommentThread'\nconst CommentThread = Object.assign(Root, { Root, Comment, Replies, Tombstone, Composer, Locked })\nexport { CommentThread, Comment, Composer, Locked, Replies, Root as CommentThreadRoot, Tombstone }\nexport type { CommentProps, CommentThreadRootProps, ComposerProps } from './commentThread.props'\n"],
-  "mappings": "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",
+  "sourcesContent": ["import * as React from 'react'\nimport classNames from 'classnames'\nimport { Button } from '../button/Button'\n\nimport type { CommentProps, CommentThreadRootProps, ComposerProps, RepliesProps, TombstoneProps } from './commentThread.props'\n\nconst Comment = React.forwardRef<HTMLElement, CommentProps>(({ author, avatarSrc, badge, dateTime, timeLabel, actions, metadata, className, children, ...props }, ref) => <article {...props} ref={ref} className={classNames('dsx-comment-thread__comment', className)}><div className=\"dsx-comment-thread__avatar\">{avatarSrc ? <img src={avatarSrc} alt=\"\" /> : author.split(/\\s+/).map((part) => part[0]).join('').slice(0, 2).toUpperCase()}</div><header><strong>{author}</strong>{badge}<time dateTime={dateTime}>{timeLabel}</time>{metadata}</header><div className=\"dsx-comment-thread__body\">{children}</div>{actions ? <div className=\"dsx-comment-thread__actions\">{actions}</div> : null}</article>)\nComment.displayName = 'CommentThreadComment'\nconst ReplyDepthContext = React.createContext(0)\nconst Replies = React.forwardRef<HTMLDivElement, RepliesProps>(({ className, children, limit, expanded: expandedProp, onExpandedChange, moreLabel, ...props }, ref) => {\n  const [localExpanded, setLocalExpanded] = React.useState(false)\n  const expanded = expandedProp ?? localExpanded\n  const all = React.Children.toArray(children)\n  const visible = limit == null || expanded ? all : all.slice(0, Math.max(0, limit))\n  const remaining = all.length - visible.length\n  const depth = React.useContext(ReplyDepthContext)\n  if (depth >= 1) throw new Error('CommentThread supports one reply level.')\n  return <ReplyDepthContext.Provider value={depth + 1}><div {...props} ref={ref} role={props.role ?? 'group'} className={classNames('dsx-comment-thread__replies', className)}>{visible}{remaining > 0 ? <Button type=\"button\" size=\"lg\" variant=\"ghost\" onClick={() => { setLocalExpanded(true); onExpandedChange?.(true) }}>{moreLabel?.(remaining) ?? `Show ${remaining} more replies`}</Button> : null}</div></ReplyDepthContext.Provider>\n})\nReplies.displayName = 'CommentThreadReplies'\nconst Tombstone = React.forwardRef<HTMLDivElement, TombstoneProps>(({ children, state = 'removed', className, ...props }, ref) => <div {...props} ref={ref} className={classNames('dsx-comment-thread__tombstone', className)} role=\"status\" data-removed=\"true\" data-state={state}>{children ?? `Comment ${state}`}</div>)\nTombstone.displayName = 'CommentThreadTombstone'\nconst Composer = React.forwardRef<HTMLFormElement, ComposerProps>(({ value, onValueChange, onSubmit, maxLength = 2000, submitting, locked, label = 'Comment', error, status, input, actions, className, children, ...props }, ref) => {\n  const id = React.useId()\n  const countId = `${id}-count`\n  const errorId = `${id}-error`\n  const statusId = `${id}-status`\n  const invalid = Boolean(error) || value.length > maxLength\n  const disabled = Boolean(locked || submitting)\n  const describedBy = [countId, error ? errorId : '', status ? statusId : ''].filter(Boolean).join(' ')\n  return <form {...props} ref={ref} className={classNames('dsx-comment-thread__composer', className)} aria-busy={submitting || undefined} onSubmit={event => { event.preventDefault(); if (!disabled && !invalid && value.trim()) onSubmit?.() }}>\n    <label id={`${id}-label`} htmlFor={id}>{label}</label>\n    {input ? input({ id, value, onValueChange, maxLength, disabled, describedBy, invalid }) : <textarea id={id} value={value} maxLength={maxLength} disabled={disabled} onChange={event => onValueChange(event.currentTarget.value)} aria-invalid={invalid || undefined} aria-describedby={describedBy} />}\n    <span id={countId} className=\"dsx-comment-thread__count\" aria-live=\"polite\">{value.length}/{maxLength}</span>\n    {error ? <div id={errorId} role=\"alert\">{error}</div> : null}\n    {status ? <div id={statusId} role=\"status\">{status}</div> : null}\n    <div className=\"dsx-comment-thread__actions\">{actions}{children ?? <Button className=\"dsx-comment-thread__submit\" type=\"submit\" size=\"lg\" disabled={disabled || invalid || !value.trim()}>{submitting ? 'Submitting\u2026' : 'Comment'}</Button>}</div>\n  </form>\n})\nComposer.displayName = 'CommentThreadComposer'\nconst Locked = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ children = 'Comments are locked', className, ...props }, ref) => <div {...props} ref={ref} className={classNames('dsx-comment-thread__locked', className)} role=\"status\">{children}</div>)\nLocked.displayName = 'CommentThreadLocked'\nconst Root = React.forwardRef<HTMLDivElement, CommentThreadRootProps>(({ className, ...props }, ref) => <div {...props} ref={ref} className={classNames('dsx-comment-thread', className)} />)\nRoot.displayName = 'CommentThread'\nconst CommentThread = Object.assign(Root, { Root, Comment, Replies, Tombstone, Composer, Locked })\nexport { CommentThread, Comment, Composer, Locked, Replies, Root as CommentThreadRoot, Tombstone }\nexport type { CommentProps, CommentThreadRootProps, ComposerProps, ComposerInputContext, RepliesProps, TombstoneProps } from './commentThread.props'\n"],
+  "mappings": "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",
   "names": ["classNames"]
 }

package/dist/components/commentThread/CommentThread.d.cts

@@ -1,19 +1,19 @@
 import * as React from 'react';
-import type { CommentProps, CommentThreadRootProps, ComposerProps } from './commentThread.props.cjs';
+import type { CommentProps, CommentThreadRootProps, ComposerProps, RepliesProps, TombstoneProps } from './commentThread.props.cjs';
 declare const Comment: React.ForwardRefExoticComponent<CommentProps & React.RefAttributes<HTMLElement>>;
-declare const Replies: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-declare const Tombstone: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const Replies: React.ForwardRefExoticComponent<RepliesProps & React.RefAttributes<HTMLDivElement>>;
+declare const Tombstone: React.ForwardRefExoticComponent<TombstoneProps & React.RefAttributes<HTMLDivElement>>;
 declare const Composer: React.ForwardRefExoticComponent<ComposerProps & React.RefAttributes<HTMLFormElement>>;
 declare const Locked: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 declare const Root: React.ForwardRefExoticComponent<CommentThreadRootProps & React.RefAttributes<HTMLDivElement>>;
 declare const CommentThread: React.ForwardRefExoticComponent<CommentThreadRootProps & React.RefAttributes<HTMLDivElement>> & {
     Root: React.ForwardRefExoticComponent<CommentThreadRootProps & React.RefAttributes<HTMLDivElement>>;
     Comment: React.ForwardRefExoticComponent<CommentProps & React.RefAttributes<HTMLElement>>;
-    Replies: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-    Tombstone: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+    Replies: React.ForwardRefExoticComponent<RepliesProps & React.RefAttributes<HTMLDivElement>>;
+    Tombstone: React.ForwardRefExoticComponent<TombstoneProps & React.RefAttributes<HTMLDivElement>>;
     Composer: React.ForwardRefExoticComponent<ComposerProps & React.RefAttributes<HTMLFormElement>>;
     Locked: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 };
 export { CommentThread, Comment, Composer, Locked, Replies, Root as CommentThreadRoot, Tombstone };
-export type { CommentProps, CommentThreadRootProps, ComposerProps } from './commentThread.props.cjs';
+export type { CommentProps, CommentThreadRootProps, ComposerProps, ComposerInputContext, RepliesProps, TombstoneProps } from './commentThread.props.cjs';
 //# sourceMappingURL=CommentThread.d.cts.map

package/dist/components/commentThread/CommentThread.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"CommentThread.d.cts","sourceRoot":"","sources":["../../../src/components/commentThread/CommentThread.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAE,YAAY,EAAE,sBAAsB,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAA;AAEhG,QAAA,MAAM,OAAO,kFAAipB,CAAA;AAG9pB,QAAA,MAAM,OAAO,6GAIX,CAAA;AAEF,QAAA,MAAM,SAAS,6GAA0R,CAAA;AAEzS,QAAA,MAAM,QAAQ,uFAA6vB,CAAA;AAE3wB,QAAA,MAAM,MAAM,6GAAuQ,CAAA;AAEnR,QAAA,MAAM,IAAI,+FAAmL,CAAA;AAE7L,QAAA,MAAM,aAAa;;;;;;;CAA+E,CAAA;AAClG,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,IAAI,iBAAiB,EAAE,SAAS,EAAE,CAAA;AAClG,YAAY,EAAE,YAAY,EAAE,sBAAsB,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAA"}
+{"version":3,"file":"CommentThread.d.cts","sourceRoot":"","sources":["../../../src/components/commentThread/CommentThread.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,OAAO,KAAK,EAAE,YAAY,EAAE,sBAAsB,EAAE,aAAa,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAA;AAE9H,QAAA,MAAM,OAAO,kFAAqqB,CAAA;AAGlrB,QAAA,MAAM,OAAO,qFASX,CAAA;AAEF,QAAA,MAAM,SAAS,uFAA4S,CAAA;AAE3T,QAAA,MAAM,QAAQ,uFAgBZ,CAAA;AAEF,QAAA,MAAM,MAAM,6GAAuQ,CAAA;AAEnR,QAAA,MAAM,IAAI,+FAAmL,CAAA;AAE7L,QAAA,MAAM,aAAa;;;;;;;CAA+E,CAAA;AAClG,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,IAAI,iBAAiB,EAAE,SAAS,EAAE,CAAA;AAClG,YAAY,EAAE,YAAY,EAAE,sBAAsB,EAAE,aAAa,EAAE,oBAAoB,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAA"}

package/dist/components/commentThread/CommentThread.d.mts

@@ -1,19 +1,19 @@
 import * as React from 'react';
-import type { CommentProps, CommentThreadRootProps, ComposerProps } from './commentThread.props.js';
+import type { CommentProps, CommentThreadRootProps, ComposerProps, RepliesProps, TombstoneProps } from './commentThread.props.js';
 declare const Comment: React.ForwardRefExoticComponent<CommentProps & React.RefAttributes<HTMLElement>>;
-declare const Replies: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-declare const Tombstone: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const Replies: React.ForwardRefExoticComponent<RepliesProps & React.RefAttributes<HTMLDivElement>>;
+declare const Tombstone: React.ForwardRefExoticComponent<TombstoneProps & React.RefAttributes<HTMLDivElement>>;
 declare const Composer: React.ForwardRefExoticComponent<ComposerProps & React.RefAttributes<HTMLFormElement>>;
 declare const Locked: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 declare const Root: React.ForwardRefExoticComponent<CommentThreadRootProps & React.RefAttributes<HTMLDivElement>>;
 declare const CommentThread: React.ForwardRefExoticComponent<CommentThreadRootProps & React.RefAttributes<HTMLDivElement>> & {
     Root: React.ForwardRefExoticComponent<CommentThreadRootProps & React.RefAttributes<HTMLDivElement>>;
     Comment: React.ForwardRefExoticComponent<CommentProps & React.RefAttributes<HTMLElement>>;
-    Replies: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-    Tombstone: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+    Replies: React.ForwardRefExoticComponent<RepliesProps & React.RefAttributes<HTMLDivElement>>;
+    Tombstone: React.ForwardRefExoticComponent<TombstoneProps & React.RefAttributes<HTMLDivElement>>;
     Composer: React.ForwardRefExoticComponent<ComposerProps & React.RefAttributes<HTMLFormElement>>;
     Locked: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 };
 export { CommentThread, Comment, Composer, Locked, Replies, Root as CommentThreadRoot, Tombstone };
-export type { CommentProps, CommentThreadRootProps, ComposerProps } from './commentThread.props.js';
+export type { CommentProps, CommentThreadRootProps, ComposerProps, ComposerInputContext, RepliesProps, TombstoneProps } from './commentThread.props.js';
 //# sourceMappingURL=CommentThread.d.mts.map

package/dist/components/commentThread/CommentThread.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"CommentThread.d.mts","sourceRoot":"","sources":["../../../src/components/commentThread/CommentThread.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAE,YAAY,EAAE,sBAAsB,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAA;AAEhG,QAAA,MAAM,OAAO,kFAAipB,CAAA;AAG9pB,QAAA,MAAM,OAAO,6GAIX,CAAA;AAEF,QAAA,MAAM,SAAS,6GAA0R,CAAA;AAEzS,QAAA,MAAM,QAAQ,uFAA6vB,CAAA;AAE3wB,QAAA,MAAM,MAAM,6GAAuQ,CAAA;AAEnR,QAAA,MAAM,IAAI,+FAAmL,CAAA;AAE7L,QAAA,MAAM,aAAa;;;;;;;CAA+E,CAAA;AAClG,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,IAAI,iBAAiB,EAAE,SAAS,EAAE,CAAA;AAClG,YAAY,EAAE,YAAY,EAAE,sBAAsB,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAA"}
+{"version":3,"file":"CommentThread.d.mts","sourceRoot":"","sources":["../../../src/components/commentThread/CommentThread.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,OAAO,KAAK,EAAE,YAAY,EAAE,sBAAsB,EAAE,aAAa,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAA;AAE9H,QAAA,MAAM,OAAO,kFAAqqB,CAAA;AAGlrB,QAAA,MAAM,OAAO,qFASX,CAAA;AAEF,QAAA,MAAM,SAAS,uFAA4S,CAAA;AAE3T,QAAA,MAAM,QAAQ,uFAgBZ,CAAA;AAEF,QAAA,MAAM,MAAM,6GAAuQ,CAAA;AAEnR,QAAA,MAAM,IAAI,+FAAmL,CAAA;AAE7L,QAAA,MAAM,aAAa;;;;;;;CAA+E,CAAA;AAClG,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,IAAI,iBAAiB,EAAE,SAAS,EAAE,CAAA;AAClG,YAAY,EAAE,YAAY,EAAE,sBAAsB,EAAE,aAAa,EAAE,oBAAoB,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAA"}

package/dist/components/commentThread/CommentThread.d.ts

@@ -1,19 +1,19 @@
 import * as React from 'react';
-import type { CommentProps, CommentThreadRootProps, ComposerProps } from './commentThread.props.js';
+import type { CommentProps, CommentThreadRootProps, ComposerProps, RepliesProps, TombstoneProps } from './commentThread.props.js';
 declare const Comment: React.ForwardRefExoticComponent<CommentProps & React.RefAttributes<HTMLElement>>;
-declare const Replies: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-declare const Tombstone: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const Replies: React.ForwardRefExoticComponent<RepliesProps & React.RefAttributes<HTMLDivElement>>;
+declare const Tombstone: React.ForwardRefExoticComponent<TombstoneProps & React.RefAttributes<HTMLDivElement>>;
 declare const Composer: React.ForwardRefExoticComponent<ComposerProps & React.RefAttributes<HTMLFormElement>>;
 declare const Locked: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 declare const Root: React.ForwardRefExoticComponent<CommentThreadRootProps & React.RefAttributes<HTMLDivElement>>;
 declare const CommentThread: React.ForwardRefExoticComponent<CommentThreadRootProps & React.RefAttributes<HTMLDivElement>> & {
     Root: React.ForwardRefExoticComponent<CommentThreadRootProps & React.RefAttributes<HTMLDivElement>>;
     Comment: React.ForwardRefExoticComponent<CommentProps & React.RefAttributes<HTMLElement>>;
-    Replies: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-    Tombstone: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+    Replies: React.ForwardRefExoticComponent<RepliesProps & React.RefAttributes<HTMLDivElement>>;
+    Tombstone: React.ForwardRefExoticComponent<TombstoneProps & React.RefAttributes<HTMLDivElement>>;
     Composer: React.ForwardRefExoticComponent<ComposerProps & React.RefAttributes<HTMLFormElement>>;
     Locked: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 };
 export { CommentThread, Comment, Composer, Locked, Replies, Root as CommentThreadRoot, Tombstone };
-export type { CommentProps, CommentThreadRootProps, ComposerProps } from './commentThread.props.js';
+export type { CommentProps, CommentThreadRootProps, ComposerProps, ComposerInputContext, RepliesProps, TombstoneProps } from './commentThread.props.js';
 //# sourceMappingURL=CommentThread.d.ts.map

package/dist/components/commentThread/CommentThread.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CommentThread.d.ts","sourceRoot":"","sources":["../../../src/components/commentThread/CommentThread.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAE,YAAY,EAAE,sBAAsB,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAA;AAEhG,QAAA,MAAM,OAAO,kFAAipB,CAAA;AAG9pB,QAAA,MAAM,OAAO,6GAIX,CAAA;AAEF,QAAA,MAAM,SAAS,6GAA0R,CAAA;AAEzS,QAAA,MAAM,QAAQ,uFAA6vB,CAAA;AAE3wB,QAAA,MAAM,MAAM,6GAAuQ,CAAA;AAEnR,QAAA,MAAM,IAAI,+FAAmL,CAAA;AAE7L,QAAA,MAAM,aAAa;;;;;;;CAA+E,CAAA;AAClG,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,IAAI,iBAAiB,EAAE,SAAS,EAAE,CAAA;AAClG,YAAY,EAAE,YAAY,EAAE,sBAAsB,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAA"}
+{"version":3,"file":"CommentThread.d.ts","sourceRoot":"","sources":["../../../src/components/commentThread/CommentThread.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,OAAO,KAAK,EAAE,YAAY,EAAE,sBAAsB,EAAE,aAAa,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAA;AAE9H,QAAA,MAAM,OAAO,kFAAqqB,CAAA;AAGlrB,QAAA,MAAM,OAAO,qFASX,CAAA;AAEF,QAAA,MAAM,SAAS,uFAA4S,CAAA;AAE3T,QAAA,MAAM,QAAQ,uFAgBZ,CAAA;AAEF,QAAA,MAAM,MAAM,6GAAuQ,CAAA;AAEnR,QAAA,MAAM,IAAI,+FAAmL,CAAA;AAE7L,QAAA,MAAM,aAAa;;;;;;;CAA+E,CAAA;AAClG,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,IAAI,iBAAiB,EAAE,SAAS,EAAE,CAAA;AAClG,YAAY,EAAE,YAAY,EAAE,sBAAsB,EAAE,aAAa,EAAE,oBAAoB,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAA"}

package/dist/components/commentThread/CommentThread.js

@@ -1,38 +1,66 @@
 import * as React from "react";
 import classNames from "classnames";
+import { Button } from "../button/Button.js";
 import { jsx, jsxs } from "react/jsx-runtime";
-const Comment = React.forwardRef(({ author, avatarSrc, badge, dateTime, timeLabel, actions, className, children, ...props }, ref) => /* @__PURE__ */ jsxs("article", { ...props, ref, className: classNames("dsx-comment-thread__comment", className), children: [
+const Comment = React.forwardRef(({ author, avatarSrc, badge, dateTime, timeLabel, actions, metadata, className, children, ...props }, ref) => /* @__PURE__ */ jsxs("article", { ...props, ref, className: classNames("dsx-comment-thread__comment", className), children: [
   /* @__PURE__ */ jsx("div", { className: "dsx-comment-thread__avatar", children: avatarSrc ? /* @__PURE__ */ jsx("img", { src: avatarSrc, alt: "" }) : author.split(/\s+/).map((part) => part[0]).join("").slice(0, 2).toUpperCase() }),
   /* @__PURE__ */ jsxs("header", { children: [
     /* @__PURE__ */ jsx("strong", { children: author }),
     badge,
-    /* @__PURE__ */ jsx("time", { dateTime, children: timeLabel })
+    /* @__PURE__ */ jsx("time", { dateTime, children: timeLabel }),
+    metadata
   ] }),
   /* @__PURE__ */ jsx("div", { className: "dsx-comment-thread__body", children }),
   actions ? /* @__PURE__ */ jsx("div", { className: "dsx-comment-thread__actions", children: actions }) : null
 ] }));
 Comment.displayName = "CommentThreadComment";
 const ReplyDepthContext = React.createContext(0);
-const Replies = React.forwardRef(({ className, children, ...props }, ref) => {
+const Replies = React.forwardRef(({ className, children, limit, expanded: expandedProp, onExpandedChange, moreLabel, ...props }, ref) => {
+  const [localExpanded, setLocalExpanded] = React.useState(false);
+  const expanded = expandedProp ?? localExpanded;
+  const all = React.Children.toArray(children);
+  const visible = limit == null || expanded ? all : all.slice(0, Math.max(0, limit));
+  const remaining = all.length - visible.length;
   const depth = React.useContext(ReplyDepthContext);
   if (depth >= 1) throw new Error("CommentThread supports one reply level.");
-  return /* @__PURE__ */ jsx(ReplyDepthContext.Provider, { value: depth + 1, children: /* @__PURE__ */ jsx("div", { ...props, ref, role: props.role ?? "group", className: classNames("dsx-comment-thread__replies", className), children }) });
+  return /* @__PURE__ */ jsx(ReplyDepthContext.Provider, { value: depth + 1, children: /* @__PURE__ */ jsxs("div", { ...props, ref, role: props.role ?? "group", className: classNames("dsx-comment-thread__replies", className), children: [
+    visible,
+    remaining > 0 ? /* @__PURE__ */ jsx(Button, { type: "button", size: "lg", variant: "ghost", onClick: () => {
+      setLocalExpanded(true);
+      onExpandedChange?.(true);
+    }, children: moreLabel?.(remaining) ?? `Show ${remaining} more replies` }) : null
+  ] }) });
 });
 Replies.displayName = "CommentThreadReplies";
-const Tombstone = React.forwardRef(({ children = "Comment removed", className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ...props, ref, className: classNames("dsx-comment-thread__tombstone", className), role: "status", "data-removed": "true", children }));
+const Tombstone = React.forwardRef(({ children, state = "removed", className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ...props, ref, className: classNames("dsx-comment-thread__tombstone", className), role: "status", "data-removed": "true", "data-state": state, children: children ?? `Comment ${state}` }));
 Tombstone.displayName = "CommentThreadTombstone";
-const Composer = React.forwardRef(({ value, onValueChange, onSubmit, maxLength = 2e3, submitting, locked, className, children, ...props }, ref) => /* @__PURE__ */ jsxs("form", { ...props, ref, className: classNames("dsx-comment-thread__composer", className), "aria-busy": submitting || void 0, onSubmit: (event) => {
-  event.preventDefault();
-  if (!locked && !submitting && value.trim()) onSubmit?.();
-}, children: [
-  /* @__PURE__ */ jsx("textarea", { value, maxLength, disabled: locked || submitting, onChange: (event) => onValueChange(event.currentTarget.value), "aria-label": "Comment" }),
-  /* @__PURE__ */ jsxs("span", { "aria-live": "polite", children: [
-    value.length,
-    "/",
-    maxLength
-  ] }),
-  children ?? /* @__PURE__ */ jsx("button", { type: "submit", disabled: locked || submitting || !value.trim(), children: submitting ? "Submitting\u2026" : "Comment" })
-] }));
+const Composer = React.forwardRef(({ value, onValueChange, onSubmit, maxLength = 2e3, submitting, locked, label = "Comment", error, status, input, actions, className, children, ...props }, ref) => {
+  const id = React.useId();
+  const countId = `${id}-count`;
+  const errorId = `${id}-error`;
+  const statusId = `${id}-status`;
+  const invalid = Boolean(error) || value.length > maxLength;
+  const disabled = Boolean(locked || submitting);
+  const describedBy = [countId, error ? errorId : "", status ? statusId : ""].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs("form", { ...props, ref, className: classNames("dsx-comment-thread__composer", className), "aria-busy": submitting || void 0, onSubmit: (event) => {
+    event.preventDefault();
+    if (!disabled && !invalid && value.trim()) onSubmit?.();
+  }, children: [
+    /* @__PURE__ */ jsx("label", { id: `${id}-label`, htmlFor: id, children: label }),
+    input ? input({ id, value, onValueChange, maxLength, disabled, describedBy, invalid }) : /* @__PURE__ */ jsx("textarea", { id, value, maxLength, disabled, onChange: (event) => onValueChange(event.currentTarget.value), "aria-invalid": invalid || void 0, "aria-describedby": describedBy }),
+    /* @__PURE__ */ jsxs("span", { id: countId, className: "dsx-comment-thread__count", "aria-live": "polite", children: [
+      value.length,
+      "/",
+      maxLength
+    ] }),
+    error ? /* @__PURE__ */ jsx("div", { id: errorId, role: "alert", children: error }) : null,
+    status ? /* @__PURE__ */ jsx("div", { id: statusId, role: "status", children: status }) : null,
+    /* @__PURE__ */ jsxs("div", { className: "dsx-comment-thread__actions", children: [
+      actions,
+      children ?? /* @__PURE__ */ jsx(Button, { className: "dsx-comment-thread__submit", type: "submit", size: "lg", disabled: disabled || invalid || !value.trim(), children: submitting ? "Submitting\u2026" : "Comment" })
+    ] })
+  ] });
+});
 Composer.displayName = "CommentThreadComposer";
 const Locked = React.forwardRef(({ children = "Comments are locked", className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ...props, ref, className: classNames("dsx-comment-thread__locked", className), role: "status", children }));
 Locked.displayName = "CommentThreadLocked";

package/dist/components/commentThread/CommentThread.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/commentThread/CommentThread.tsx"],
-  "sourcesContent": ["import * as React from 'react'\nimport classNames from 'classnames'\n\nimport type { CommentProps, CommentThreadRootProps, ComposerProps } from './commentThread.props'\n\nconst Comment = React.forwardRef<HTMLElement, CommentProps>(({ author, avatarSrc, badge, dateTime, timeLabel, actions, className, children, ...props }, ref) => <article {...props} ref={ref} className={classNames('dsx-comment-thread__comment', className)}><div className=\"dsx-comment-thread__avatar\">{avatarSrc ? <img src={avatarSrc} alt=\"\" /> : author.split(/\\s+/).map((part) => part[0]).join('').slice(0, 2).toUpperCase()}</div><header><strong>{author}</strong>{badge}<time dateTime={dateTime}>{timeLabel}</time></header><div className=\"dsx-comment-thread__body\">{children}</div>{actions ? <div className=\"dsx-comment-thread__actions\">{actions}</div> : null}</article>)\nComment.displayName = 'CommentThreadComment'\nconst ReplyDepthContext = React.createContext(0)\nconst Replies = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ className, children, ...props }, ref) => {\n  const depth = React.useContext(ReplyDepthContext)\n  if (depth >= 1) throw new Error('CommentThread supports one reply level.')\n  return <ReplyDepthContext.Provider value={depth + 1}><div {...props} ref={ref} role={props.role ?? 'group'} className={classNames('dsx-comment-thread__replies', className)}>{children}</div></ReplyDepthContext.Provider>\n})\nReplies.displayName = 'CommentThreadReplies'\nconst Tombstone = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ children = 'Comment removed', className, ...props }, ref) => <div {...props} ref={ref} className={classNames('dsx-comment-thread__tombstone', className)} role=\"status\" data-removed=\"true\">{children}</div>)\nTombstone.displayName = 'CommentThreadTombstone'\nconst Composer = React.forwardRef<HTMLFormElement, ComposerProps>(({ value, onValueChange, onSubmit, maxLength = 2000, submitting, locked, className, children, ...props }, ref) => <form {...props} ref={ref} className={classNames('dsx-comment-thread__composer', className)} aria-busy={submitting || undefined} onSubmit={(event) => { event.preventDefault(); if (!locked && !submitting && value.trim()) onSubmit?.() }}><textarea value={value} maxLength={maxLength} disabled={locked || submitting} onChange={(event) => onValueChange(event.currentTarget.value)} aria-label=\"Comment\"/><span aria-live=\"polite\">{value.length}/{maxLength}</span>{children ?? <button type=\"submit\" disabled={locked || submitting || !value.trim()}>{submitting ? 'Submitting\u2026' : 'Comment'}</button>}</form>)\nComposer.displayName = 'CommentThreadComposer'\nconst Locked = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ children = 'Comments are locked', className, ...props }, ref) => <div {...props} ref={ref} className={classNames('dsx-comment-thread__locked', className)} role=\"status\">{children}</div>)\nLocked.displayName = 'CommentThreadLocked'\nconst Root = React.forwardRef<HTMLDivElement, CommentThreadRootProps>(({ className, ...props }, ref) => <div {...props} ref={ref} className={classNames('dsx-comment-thread', className)} />)\nRoot.displayName = 'CommentThread'\nconst CommentThread = Object.assign(Root, { Root, Comment, Replies, Tombstone, Composer, Locked })\nexport { CommentThread, Comment, Composer, Locked, Replies, Root as CommentThreadRoot, Tombstone }\nexport type { CommentProps, CommentThreadRootProps, ComposerProps } from './commentThread.props'\n"],
-  "mappings": "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",
+  "sourcesContent": ["import * as React from 'react'\nimport classNames from 'classnames'\nimport { Button } from '../button/Button'\n\nimport type { CommentProps, CommentThreadRootProps, ComposerProps, RepliesProps, TombstoneProps } from './commentThread.props'\n\nconst Comment = React.forwardRef<HTMLElement, CommentProps>(({ author, avatarSrc, badge, dateTime, timeLabel, actions, metadata, className, children, ...props }, ref) => <article {...props} ref={ref} className={classNames('dsx-comment-thread__comment', className)}><div className=\"dsx-comment-thread__avatar\">{avatarSrc ? <img src={avatarSrc} alt=\"\" /> : author.split(/\\s+/).map((part) => part[0]).join('').slice(0, 2).toUpperCase()}</div><header><strong>{author}</strong>{badge}<time dateTime={dateTime}>{timeLabel}</time>{metadata}</header><div className=\"dsx-comment-thread__body\">{children}</div>{actions ? <div className=\"dsx-comment-thread__actions\">{actions}</div> : null}</article>)\nComment.displayName = 'CommentThreadComment'\nconst ReplyDepthContext = React.createContext(0)\nconst Replies = React.forwardRef<HTMLDivElement, RepliesProps>(({ className, children, limit, expanded: expandedProp, onExpandedChange, moreLabel, ...props }, ref) => {\n  const [localExpanded, setLocalExpanded] = React.useState(false)\n  const expanded = expandedProp ?? localExpanded\n  const all = React.Children.toArray(children)\n  const visible = limit == null || expanded ? all : all.slice(0, Math.max(0, limit))\n  const remaining = all.length - visible.length\n  const depth = React.useContext(ReplyDepthContext)\n  if (depth >= 1) throw new Error('CommentThread supports one reply level.')\n  return <ReplyDepthContext.Provider value={depth + 1}><div {...props} ref={ref} role={props.role ?? 'group'} className={classNames('dsx-comment-thread__replies', className)}>{visible}{remaining > 0 ? <Button type=\"button\" size=\"lg\" variant=\"ghost\" onClick={() => { setLocalExpanded(true); onExpandedChange?.(true) }}>{moreLabel?.(remaining) ?? `Show ${remaining} more replies`}</Button> : null}</div></ReplyDepthContext.Provider>\n})\nReplies.displayName = 'CommentThreadReplies'\nconst Tombstone = React.forwardRef<HTMLDivElement, TombstoneProps>(({ children, state = 'removed', className, ...props }, ref) => <div {...props} ref={ref} className={classNames('dsx-comment-thread__tombstone', className)} role=\"status\" data-removed=\"true\" data-state={state}>{children ?? `Comment ${state}`}</div>)\nTombstone.displayName = 'CommentThreadTombstone'\nconst Composer = React.forwardRef<HTMLFormElement, ComposerProps>(({ value, onValueChange, onSubmit, maxLength = 2000, submitting, locked, label = 'Comment', error, status, input, actions, className, children, ...props }, ref) => {\n  const id = React.useId()\n  const countId = `${id}-count`\n  const errorId = `${id}-error`\n  const statusId = `${id}-status`\n  const invalid = Boolean(error) || value.length > maxLength\n  const disabled = Boolean(locked || submitting)\n  const describedBy = [countId, error ? errorId : '', status ? statusId : ''].filter(Boolean).join(' ')\n  return <form {...props} ref={ref} className={classNames('dsx-comment-thread__composer', className)} aria-busy={submitting || undefined} onSubmit={event => { event.preventDefault(); if (!disabled && !invalid && value.trim()) onSubmit?.() }}>\n    <label id={`${id}-label`} htmlFor={id}>{label}</label>\n    {input ? input({ id, value, onValueChange, maxLength, disabled, describedBy, invalid }) : <textarea id={id} value={value} maxLength={maxLength} disabled={disabled} onChange={event => onValueChange(event.currentTarget.value)} aria-invalid={invalid || undefined} aria-describedby={describedBy} />}\n    <span id={countId} className=\"dsx-comment-thread__count\" aria-live=\"polite\">{value.length}/{maxLength}</span>\n    {error ? <div id={errorId} role=\"alert\">{error}</div> : null}\n    {status ? <div id={statusId} role=\"status\">{status}</div> : null}\n    <div className=\"dsx-comment-thread__actions\">{actions}{children ?? <Button className=\"dsx-comment-thread__submit\" type=\"submit\" size=\"lg\" disabled={disabled || invalid || !value.trim()}>{submitting ? 'Submitting\u2026' : 'Comment'}</Button>}</div>\n  </form>\n})\nComposer.displayName = 'CommentThreadComposer'\nconst Locked = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ children = 'Comments are locked', className, ...props }, ref) => <div {...props} ref={ref} className={classNames('dsx-comment-thread__locked', className)} role=\"status\">{children}</div>)\nLocked.displayName = 'CommentThreadLocked'\nconst Root = React.forwardRef<HTMLDivElement, CommentThreadRootProps>(({ className, ...props }, ref) => <div {...props} ref={ref} className={classNames('dsx-comment-thread', className)} />)\nRoot.displayName = 'CommentThread'\nconst CommentThread = Object.assign(Root, { Root, Comment, Replies, Tombstone, Composer, Locked })\nexport { CommentThread, Comment, Composer, Locked, Replies, Root as CommentThreadRoot, Tombstone }\nexport type { CommentProps, CommentThreadRootProps, ComposerProps, ComposerInputContext, RepliesProps, TombstoneProps } from './commentThread.props'\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/components/commentThread/commentThread.props.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/commentThread/commentThread.props.ts"],
-  "sourcesContent": ["import type * as React from 'react'\n\ninterface CommentThreadRootProps extends React.HTMLAttributes<HTMLDivElement> {}\n\ninterface CommentProps extends React.HTMLAttributes<HTMLElement> {\n  author: string\n  avatarSrc?: string\n  badge?: React.ReactNode\n  dateTime: string\n  timeLabel: React.ReactNode\n  actions?: React.ReactNode\n}\n\ninterface ComposerProps extends Omit<React.FormHTMLAttributes<HTMLFormElement>, 'onSubmit'> {\n  value: string\n  onValueChange: (value: string) => void\n  onSubmit?: () => void\n  maxLength?: number\n  submitting?: boolean\n  locked?: boolean\n}\n\nexport type { CommentProps, CommentThreadRootProps, ComposerProps }\n"],
+  "sourcesContent": ["import type * as React from 'react'\n\ninterface CommentThreadRootProps extends React.HTMLAttributes<HTMLDivElement> {}\n\ninterface CommentProps extends React.HTMLAttributes<HTMLElement> {\n  author: string\n  avatarSrc?: string\n  badge?: React.ReactNode\n  dateTime: string\n  timeLabel: React.ReactNode\n  actions?: React.ReactNode\n  metadata?: React.ReactNode\n}\n\ninterface ComposerProps extends Omit<React.FormHTMLAttributes<HTMLFormElement>, 'onSubmit'> {\n  value: string\n  onValueChange: (value: string) => void\n  onSubmit?: () => void\n  maxLength?: number\n  submitting?: boolean\n  locked?: boolean\n  label?: string\n  error?: React.ReactNode\n  status?: React.ReactNode\n  actions?: React.ReactNode\n  input?: (context: ComposerInputContext) => React.ReactNode\n}\n\nexport type { CommentProps, CommentThreadRootProps, ComposerProps }\n\nexport interface ComposerInputContext {\n  id: string; value: string; onValueChange: (value: string) => void\n  maxLength: number; disabled: boolean; describedBy: string; invalid: boolean\n}\nexport interface RepliesProps extends React.HTMLAttributes<HTMLDivElement> {\n  limit?: number; expanded?: boolean; onExpandedChange?: (expanded: boolean) => void\n  moreLabel?: (remaining: number) => React.ReactNode\n}\nexport interface TombstoneProps extends React.HTMLAttributes<HTMLDivElement> { state?: 'hidden' | 'removed' | 'deleted' }\n"],
   "mappings": ";;;;;;;;;;;;;;AAAA;AAAA;",
   "names": []
 }

package/dist/components/commentThread/commentThread.props.d.cts

@@ -8,6 +8,7 @@ interface CommentProps extends React.HTMLAttributes<HTMLElement> {
     dateTime: string;
     timeLabel: React.ReactNode;
     actions?: React.ReactNode;
+    metadata?: React.ReactNode;
 }
 interface ComposerProps extends Omit<React.FormHTMLAttributes<HTMLFormElement>, 'onSubmit'> {
     value: string;
@@ -16,6 +17,29 @@ interface ComposerProps extends Omit<React.FormHTMLAttributes<HTMLFormElement>,
     maxLength?: number;
     submitting?: boolean;
     locked?: boolean;
+    label?: string;
+    error?: React.ReactNode;
+    status?: React.ReactNode;
+    actions?: React.ReactNode;
+    input?: (context: ComposerInputContext) => React.ReactNode;
 }
 export type { CommentProps, CommentThreadRootProps, ComposerProps };
+export interface ComposerInputContext {
+    id: string;
+    value: string;
+    onValueChange: (value: string) => void;
+    maxLength: number;
+    disabled: boolean;
+    describedBy: string;
+    invalid: boolean;
+}
+export interface RepliesProps extends React.HTMLAttributes<HTMLDivElement> {
+    limit?: number;
+    expanded?: boolean;
+    onExpandedChange?: (expanded: boolean) => void;
+    moreLabel?: (remaining: number) => React.ReactNode;
+}
+export interface TombstoneProps extends React.HTMLAttributes<HTMLDivElement> {
+    state?: 'hidden' | 'removed' | 'deleted';
+}
 //# sourceMappingURL=commentThread.props.d.cts.map

package/dist/components/commentThread/commentThread.props.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"commentThread.props.d.cts","sourceRoot":"","sources":["../../../src/components/commentThread/commentThread.props.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAA;AAEnC,UAAU,sBAAuB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAEhF,UAAU,YAAa,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IAC9D,MAAM,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,QAAQ,EAAE,MAAM,CAAA;IAChB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B;AAED,UAAU,aAAc,SAAQ,IAAI,CAAC,KAAK,CAAC,kBAAkB,CAAC,eAAe,CAAC,EAAE,UAAU,CAAC;IACzF,KAAK,EAAE,MAAM,CAAA;IACb,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACtC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB;AAED,YAAY,EAAE,YAAY,EAAE,sBAAsB,EAAE,aAAa,EAAE,CAAA"}
+{"version":3,"file":"commentThread.props.d.cts","sourceRoot":"","sources":["../../../src/components/commentThread/commentThread.props.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAA;AAEnC,UAAU,sBAAuB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAEhF,UAAU,YAAa,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IAC9D,MAAM,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,QAAQ,EAAE,MAAM,CAAA;IAChB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B;AAED,UAAU,aAAc,SAAQ,IAAI,CAAC,KAAK,CAAC,kBAAkB,CAAC,eAAe,CAAC,EAAE,UAAU,CAAC;IACzF,KAAK,EAAE,MAAM,CAAA;IACb,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACtC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACxB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,KAAK,CAAC,EAAE,CAAC,OAAO,EAAE,oBAAoB,KAAK,KAAK,CAAC,SAAS,CAAA;CAC3D;AAED,YAAY,EAAE,YAAY,EAAE,sBAAsB,EAAE,aAAa,EAAE,CAAA;AAEnE,MAAM,WAAW,oBAAoB;IACnC,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjE,SAAS,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,OAAO,CAAC;IAAC,WAAW,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,OAAO,CAAA;CAC5E;AACD,MAAM,WAAW,YAAa,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACxE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAA;IAClF,SAAS,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAA;CACnD;AACD,MAAM,WAAW,cAAe,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAAG,KAAK,CAAC,EAAE,QAAQ,GAAG,SAAS,GAAG,SAAS,CAAA;CAAE"}

package/dist/components/commentThread/commentThread.props.d.mts

@@ -8,6 +8,7 @@ interface CommentProps extends React.HTMLAttributes<HTMLElement> {
     dateTime: string;
     timeLabel: React.ReactNode;
     actions?: React.ReactNode;
+    metadata?: React.ReactNode;
 }
 interface ComposerProps extends Omit<React.FormHTMLAttributes<HTMLFormElement>, 'onSubmit'> {
     value: string;
@@ -16,6 +17,29 @@ interface ComposerProps extends Omit<React.FormHTMLAttributes<HTMLFormElement>,
     maxLength?: number;
     submitting?: boolean;
     locked?: boolean;
+    label?: string;
+    error?: React.ReactNode;
+    status?: React.ReactNode;
+    actions?: React.ReactNode;
+    input?: (context: ComposerInputContext) => React.ReactNode;
 }
 export type { CommentProps, CommentThreadRootProps, ComposerProps };
+export interface ComposerInputContext {
+    id: string;
+    value: string;
+    onValueChange: (value: string) => void;
+    maxLength: number;
+    disabled: boolean;
+    describedBy: string;
+    invalid: boolean;
+}
+export interface RepliesProps extends React.HTMLAttributes<HTMLDivElement> {
+    limit?: number;
+    expanded?: boolean;
+    onExpandedChange?: (expanded: boolean) => void;
+    moreLabel?: (remaining: number) => React.ReactNode;
+}
+export interface TombstoneProps extends React.HTMLAttributes<HTMLDivElement> {
+    state?: 'hidden' | 'removed' | 'deleted';
+}
 //# sourceMappingURL=commentThread.props.d.mts.map

package/dist/components/commentThread/commentThread.props.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"commentThread.props.d.mts","sourceRoot":"","sources":["../../../src/components/commentThread/commentThread.props.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAA;AAEnC,UAAU,sBAAuB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAEhF,UAAU,YAAa,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IAC9D,MAAM,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,QAAQ,EAAE,MAAM,CAAA;IAChB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B;AAED,UAAU,aAAc,SAAQ,IAAI,CAAC,KAAK,CAAC,kBAAkB,CAAC,eAAe,CAAC,EAAE,UAAU,CAAC;IACzF,KAAK,EAAE,MAAM,CAAA;IACb,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACtC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB;AAED,YAAY,EAAE,YAAY,EAAE,sBAAsB,EAAE,aAAa,EAAE,CAAA"}
+{"version":3,"file":"commentThread.props.d.mts","sourceRoot":"","sources":["../../../src/components/commentThread/commentThread.props.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAA;AAEnC,UAAU,sBAAuB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAEhF,UAAU,YAAa,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IAC9D,MAAM,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,QAAQ,EAAE,MAAM,CAAA;IAChB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B;AAED,UAAU,aAAc,SAAQ,IAAI,CAAC,KAAK,CAAC,kBAAkB,CAAC,eAAe,CAAC,EAAE,UAAU,CAAC;IACzF,KAAK,EAAE,MAAM,CAAA;IACb,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACtC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACxB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,KAAK,CAAC,EAAE,CAAC,OAAO,EAAE,oBAAoB,KAAK,KAAK,CAAC,SAAS,CAAA;CAC3D;AAED,YAAY,EAAE,YAAY,EAAE,sBAAsB,EAAE,aAAa,EAAE,CAAA;AAEnE,MAAM,WAAW,oBAAoB;IACnC,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjE,SAAS,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,OAAO,CAAC;IAAC,WAAW,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,OAAO,CAAA;CAC5E;AACD,MAAM,WAAW,YAAa,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACxE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAA;IAClF,SAAS,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAA;CACnD;AACD,MAAM,WAAW,cAAe,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAAG,KAAK,CAAC,EAAE,QAAQ,GAAG,SAAS,GAAG,SAAS,CAAA;CAAE"}

package/dist/components/commentThread/commentThread.props.d.ts

@@ -8,6 +8,7 @@ interface CommentProps extends React.HTMLAttributes<HTMLElement> {
     dateTime: string;
     timeLabel: React.ReactNode;
     actions?: React.ReactNode;
+    metadata?: React.ReactNode;
 }
 interface ComposerProps extends Omit<React.FormHTMLAttributes<HTMLFormElement>, 'onSubmit'> {
     value: string;
@@ -16,6 +17,29 @@ interface ComposerProps extends Omit<React.FormHTMLAttributes<HTMLFormElement>,
     maxLength?: number;
     submitting?: boolean;
     locked?: boolean;
+    label?: string;
+    error?: React.ReactNode;
+    status?: React.ReactNode;
+    actions?: React.ReactNode;
+    input?: (context: ComposerInputContext) => React.ReactNode;
 }
 export type { CommentProps, CommentThreadRootProps, ComposerProps };
+export interface ComposerInputContext {
+    id: string;
+    value: string;
+    onValueChange: (value: string) => void;
+    maxLength: number;
+    disabled: boolean;
+    describedBy: string;
+    invalid: boolean;
+}
+export interface RepliesProps extends React.HTMLAttributes<HTMLDivElement> {
+    limit?: number;
+    expanded?: boolean;
+    onExpandedChange?: (expanded: boolean) => void;
+    moreLabel?: (remaining: number) => React.ReactNode;
+}
+export interface TombstoneProps extends React.HTMLAttributes<HTMLDivElement> {
+    state?: 'hidden' | 'removed' | 'deleted';
+}
 //# sourceMappingURL=commentThread.props.d.ts.map

package/dist/components/commentThread/commentThread.props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"commentThread.props.d.ts","sourceRoot":"","sources":["../../../src/components/commentThread/commentThread.props.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAA;AAEnC,UAAU,sBAAuB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAEhF,UAAU,YAAa,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IAC9D,MAAM,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,QAAQ,EAAE,MAAM,CAAA;IAChB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B;AAED,UAAU,aAAc,SAAQ,IAAI,CAAC,KAAK,CAAC,kBAAkB,CAAC,eAAe,CAAC,EAAE,UAAU,CAAC;IACzF,KAAK,EAAE,MAAM,CAAA;IACb,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACtC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB;AAED,YAAY,EAAE,YAAY,EAAE,sBAAsB,EAAE,aAAa,EAAE,CAAA"}
+{"version":3,"file":"commentThread.props.d.ts","sourceRoot":"","sources":["../../../src/components/commentThread/commentThread.props.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAA;AAEnC,UAAU,sBAAuB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAEhF,UAAU,YAAa,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IAC9D,MAAM,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,QAAQ,EAAE,MAAM,CAAA;IAChB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B;AAED,UAAU,aAAc,SAAQ,IAAI,CAAC,KAAK,CAAC,kBAAkB,CAAC,eAAe,CAAC,EAAE,UAAU,CAAC;IACzF,KAAK,EAAE,MAAM,CAAA;IACb,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACtC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACxB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,KAAK,CAAC,EAAE,CAAC,OAAO,EAAE,oBAAoB,KAAK,KAAK,CAAC,SAAS,CAAA;CAC3D;AAED,YAAY,EAAE,YAAY,EAAE,sBAAsB,EAAE,aAAa,EAAE,CAAA;AAEnE,MAAM,WAAW,oBAAoB;IACnC,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjE,SAAS,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,OAAO,CAAC;IAAC,WAAW,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,OAAO,CAAA;CAC5E;AACD,MAAM,WAAW,YAAa,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACxE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAA;IAClF,SAAS,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAA;CACnD;AACD,MAAM,WAAW,cAAe,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAAG,KAAK,CAAC,EAAE,QAAQ,GAAG,SAAS,GAAG,SAAS,CAAA;CAAE"}

package/dist/components/config-drawer.css

@@ -1,6 +1,6 @@
 
 
-/* ConfigDrawer renders inside Sheet.Content (right-anchored panel).
+/* ConfigDrawer renders inside Drawer.Content (host-selected edge).
    These rules style the body layout and each settings row. */
 
 .dsx-config-drawer__body {
@@ -11,11 +11,13 @@
   overflow-y: auto;
   padding: var(--dsx-space-md) 0;
   min-height: 0;
+  min-width: 0;
 }
 
 .dsx-config-drawer__row {
   display: flex;
   flex-direction: row;
+  flex-wrap: wrap;
   align-items: center;
   justify-content: space-between;
   gap: var(--dsx-space-md);
@@ -26,12 +28,14 @@
   display: flex;
   flex-direction: column;
   gap: var(--dsx-space-2xs);
-  flex: 1 1 auto;
+  flex: 1 1 max-content;
   min-width: 0;
 }
 
 .dsx-config-drawer__row-control {
-  flex-shrink: 0;
+  flex: 0 0 auto;
+  min-width: 0;
+  max-width: 100%;
 }
 
 .dsx-config-drawer__accent-swatch {

package/dist/components/configDrawer/ConfigDrawer.cjs

@@ -61,7 +61,7 @@ function AccentSwatch({ tier }) {
   );
 }
 function SettingRow({ label, description, children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_Flex.Flex, { direction: "row", justify: "between", align: "center", gap: "md", className: "dsx-config-drawer__row", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_Flex.Flex, { direction: "row", justify: "between", align: "center", gap: "md", wrap: "wrap", className: "dsx-config-drawer__row", children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_Flex.Flex, { direction: "column", gap: "1", className: "dsx-config-drawer__row-info", children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Label.Label, { children: label }),
       description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Text.Text, { variant: "label-small", tone: "muted", children: description })