@shapesos/clay 0.10.0 → 0.11.0

package/dist/index.d.cts

@@ -1,12 +1,14 @@
 export { ColorToken, TypographyStyle, TypographyType, colors, fontFamilies, typographyMixin, typographyStyles, typographyTypes } from './tokens.cjs';
-export { Block, BlockContext, BlockContextValue, BlockServices, TextBlockService, useBlockContext } from './blocks.cjs';
-export { B as BlockComponentProps, a as BlockRecord, b as BlockService, c as BlockType, T as TextBlockRecord, d as blockTypes } from './types-Q9aqd9nq.cjs';
-export { ChatContext, ChatContextValue, ChatMessage, ChatMessageType, MESSAGE_ROLE, MessageRole, useChatContext, useCopyToClipboard } from './chat.cjs';
+export { ArtifactRefBlock, ArtifactRefBlockService, Block, BlockContext, BlockContextValue, BlockServices, TextBlockService, useBlockContext } from './blocks.cjs';
+export { A as ArtifactRefBlockRecord, B as BlockComponentProps, a as BlockRecord, b as BlockService, c as BlockType, T as TextBlockRecord, d as blockTypes } from './types-DuuRI4ll.cjs';
+export { A as ArtifactRecord, a as ArtifactService, b as ArtifactServiceProps, c as ArtifactType, T as TableArtifactRecord, d as TableColumn, e as TableConfig, f as TableRow, g as TableStats, h as artifactTypes } from './types-3Gzk7cRt.cjs';
+export { ArtifactDownloadButton, ArtifactDownloadButtonProps, ArtifactServices, TableArtifact, artifactToClipboardText, isSafeDownloadUrl } from './artifacts.cjs';
+export { ChatContext, ChatContextValue, ChatMessage, ChatMessageType, MESSAGE_ROLE, MessageRole, copyMessageText, useChatContext, useCopyToClipboard } from './chat.cjs';
 export { Icon, IconButton, IconButtonProps, IconButtonSize, IconButtonVariant, IconProps } from './icon.cjs';
 export { IconCtrl, KEYBOARD_SHORTCUT_VARIANTS, KeyIcon, KeyboardShortcut, KeyboardShortcutProps, KeyboardShortcutVariant } from './keyboard-shortcut.cjs';
 export { Lottie, LottieAnimationData, LottieProps, LottieRef } from './lottie.cjs';
 export { TextArea, TextAreaProps } from './text-area.cjs';
-export { MarkdownTable, convertTableToCSV, markdownToPlainText, mergeRefs, parseMarkdownTable } from './utils.cjs';
+export { MarkdownTable, convertTableToCSV, escapeCsvField, markdownToPlainText, mergeRefs, parseMarkdownTable } from './utils.cjs';
 export { BUTTON_INTENT, BUTTON_SIZE, BUTTON_VARIANT, Button, ButtonIntent, ButtonProps, ButtonSize, ButtonVariant, ICON_POSITION, IconPosition } from './button.cjs';
 import 'react';
 import 'react/jsx-runtime';

package/dist/index.d.ts

@@ -1,12 +1,14 @@
 export { ColorToken, TypographyStyle, TypographyType, colors, fontFamilies, typographyMixin, typographyStyles, typographyTypes } from './tokens.js';
-export { Block, BlockContext, BlockContextValue, BlockServices, TextBlockService, useBlockContext } from './blocks.js';
-export { B as BlockComponentProps, a as BlockRecord, b as BlockService, c as BlockType, T as TextBlockRecord, d as blockTypes } from './types-Q9aqd9nq.js';
-export { ChatContext, ChatContextValue, ChatMessage, ChatMessageType, MESSAGE_ROLE, MessageRole, useChatContext, useCopyToClipboard } from './chat.js';
+export { ArtifactRefBlock, ArtifactRefBlockService, Block, BlockContext, BlockContextValue, BlockServices, TextBlockService, useBlockContext } from './blocks.js';
+export { A as ArtifactRefBlockRecord, B as BlockComponentProps, a as BlockRecord, b as BlockService, c as BlockType, T as TextBlockRecord, d as blockTypes } from './types-C9XX-Uhk.js';
+export { A as ArtifactRecord, a as ArtifactService, b as ArtifactServiceProps, c as ArtifactType, T as TableArtifactRecord, d as TableColumn, e as TableConfig, f as TableRow, g as TableStats, h as artifactTypes } from './types-3Gzk7cRt.js';
+export { ArtifactDownloadButton, ArtifactDownloadButtonProps, ArtifactServices, TableArtifact, artifactToClipboardText, isSafeDownloadUrl } from './artifacts.js';
+export { ChatContext, ChatContextValue, ChatMessage, ChatMessageType, MESSAGE_ROLE, MessageRole, copyMessageText, useChatContext, useCopyToClipboard } from './chat.js';
 export { Icon, IconButton, IconButtonProps, IconButtonSize, IconButtonVariant, IconProps } from './icon.js';
 export { IconCtrl, KEYBOARD_SHORTCUT_VARIANTS, KeyIcon, KeyboardShortcut, KeyboardShortcutProps, KeyboardShortcutVariant } from './keyboard-shortcut.js';
 export { Lottie, LottieAnimationData, LottieProps, LottieRef } from './lottie.js';
 export { TextArea, TextAreaProps } from './text-area.js';
-export { MarkdownTable, convertTableToCSV, markdownToPlainText, mergeRefs, parseMarkdownTable } from './utils.js';
+export { MarkdownTable, convertTableToCSV, escapeCsvField, markdownToPlainText, mergeRefs, parseMarkdownTable } from './utils.js';
 export { BUTTON_INTENT, BUTTON_SIZE, BUTTON_VARIANT, Button, ButtonIntent, ButtonProps, ButtonSize, ButtonVariant, ICON_POSITION, IconPosition } from './button.js';
 import 'react';
 import 'react/jsx-runtime';

package/dist/index.js

@@ -1,7 +1,19 @@
+import {
+  TextArea
+} from "./chunk-WPQQVKWY.js";
+import {
+  IconCtrl,
+  KEYBOARD_SHORTCUT_VARIANTS,
+  KeyboardShortcut
+} from "./chunk-L6DUGB2E.js";
 import {
   convertTableToCSV,
+  escapeCsvField,
   parseMarkdownTable
-} from "./chunk-27GJUWVN.js";
+} from "./chunk-JJUIBBBU.js";
+import {
+  mergeRefs
+} from "./chunk-KNYB3RL7.js";
 import {
   BUTTON_INTENT,
   BUTTON_SIZE,
@@ -14,53 +26,60 @@ import {
   ChatContext,
   ChatMessage,
   MESSAGE_ROLE,
+  copyMessageText,
   useChatContext,
   useCopyToClipboard
-} from "./chunk-WS4IPADR.js";
+} from "./chunk-OUW6PUEB.js";
 import {
-  markdownToPlainText
-} from "./chunk-NMKKU2UG.js";
-import "./chunk-OKPNST44.js";
+  BlockContext,
+  useBlockContext
+} from "./chunk-JGMN6W72.js";
 import {
+  ArtifactRefBlock,
+  ArtifactRefBlockService,
   Block,
-  BlockContext,
   BlockServices,
   TextBlockService,
-  blockTypes,
-  useBlockContext
-} from "./chunk-R3BGPOAM.js";
-import "./chunk-72TJUKMV.js";
-import {
-  IconButton
-} from "./chunk-MLCRDVQ2.js";
+  blockTypes
+} from "./chunk-MXOPG747.js";
 import {
-  Lottie
-} from "./chunk-BIATJTD4.js";
-import {
-  TextArea
-} from "./chunk-WPQQVKWY.js";
-import {
-  mergeRefs
-} from "./chunk-KNYB3RL7.js";
+  markdownToPlainText
+} from "./chunk-NMKKU2UG.js";
 import {
   fontFamilies,
   typographyMixin,
   typographyStyles,
   typographyTypes
 } from "./chunk-SV24ONND.js";
+import "./chunk-MEJESPTZ.js";
 import {
-  IconCtrl,
-  KEYBOARD_SHORTCUT_VARIANTS,
-  KeyboardShortcut
-} from "./chunk-L6DUGB2E.js";
+  ArtifactDownloadButton,
+  ArtifactServices,
+  TableArtifact,
+  artifactToClipboardText,
+  artifactTypes,
+  isSafeDownloadUrl
+} from "./chunk-BX5TCEPR.js";
+import "./chunk-L35M3OD5.js";
+import "./chunk-72TJUKMV.js";
+import {
+  IconButton
+} from "./chunk-OBOXCBDL.js";
 import {
   Icon
 } from "./chunk-OLJIJYB5.js";
 import {
   colors
 } from "./chunk-JF3P66JF.js";
+import {
+  Lottie
+} from "./chunk-BIATJTD4.js";
 import "./chunk-5WRI5ZAA.js";
 export {
+  ArtifactDownloadButton,
+  ArtifactRefBlock,
+  ArtifactRefBlockService,
+  ArtifactServices,
   BUTTON_INTENT,
   BUTTON_SIZE,
   BUTTON_VARIANT,
@@ -78,12 +97,18 @@ export {
   KeyboardShortcut,
   Lottie,
   MESSAGE_ROLE,
+  TableArtifact,
   TextArea,
   TextBlockService,
+  artifactToClipboardText,
+  artifactTypes,
   blockTypes,
   colors,
   convertTableToCSV,
+  copyMessageText,
+  escapeCsvField,
   fontFamilies,
+  isSafeDownloadUrl,
   markdownToPlainText,
   mergeRefs,
   parseMarkdownTable,

package/dist/lottie.d.cts

@@ -1,4 +1,4 @@
-import * as react from 'react';
+import * as React from 'react';
 import { AnimationItem } from 'lottie-web';
 
 /** JSON animation data exported from After Effects via the Bodymovin plugin. */
@@ -59,6 +59,6 @@ interface LottieRef {
     getAnimationItem(): AnimationItem | null;
 }
 
-declare const Lottie: react.ForwardRefExoticComponent<LottieProps & react.RefAttributes<LottieRef>>;
+declare const Lottie: React.ForwardRefExoticComponent<LottieProps & React.RefAttributes<LottieRef>>;
 
 export { Lottie, type LottieAnimationData, type LottieProps, type LottieRef };

package/dist/lottie.d.ts

@@ -1,4 +1,4 @@
-import * as react from 'react';
+import * as React from 'react';
 import { AnimationItem } from 'lottie-web';
 
 /** JSON animation data exported from After Effects via the Bodymovin plugin. */
@@ -59,6 +59,6 @@ interface LottieRef {
     getAnimationItem(): AnimationItem | null;
 }
 
-declare const Lottie: react.ForwardRefExoticComponent<LottieProps & react.RefAttributes<LottieRef>>;
+declare const Lottie: React.ForwardRefExoticComponent<LottieProps & React.RefAttributes<LottieRef>>;
 
 export { Lottie, type LottieAnimationData, type LottieProps, type LottieRef };

package/dist/table.cjs

@@ -0,0 +1,142 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/table/index.ts
+var table_exports = {};
+__export(table_exports, {
+  Table: () => Table,
+  TableBody: () => TableBody,
+  TableCaption: () => TableCaption,
+  TableCell: () => TableCell,
+  TableFooter: () => TableFooter,
+  TableHead: () => TableHead,
+  TableHeader: () => TableHeader,
+  TableRow: () => TableRow,
+  useScrollShadow: () => useScrollShadow
+});
+module.exports = __toCommonJS(table_exports);
+
+// src/components/ui/table.tsx
+var React = __toESM(require("react"), 1);
+
+// src/lib/utils.ts
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+function cn(...inputs) {
+  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
+}
+
+// src/components/ui/table.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var Table = React.forwardRef(({ className, containerClassName, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: cn("relative w-full overflow-auto", containerClassName), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("table", { ref, className: cn("w-full caption-bottom text-sm", className), ...props }) }));
+Table.displayName = "Table";
+var TableHeader = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("thead", { ref, className: cn("[&_tr]:border-b", className), ...props })
+);
+TableHeader.displayName = "TableHeader";
+var TableBody = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("tbody", { ref, className: cn("[&_tr:last-child]:border-0", className), ...props })
+);
+TableBody.displayName = "TableBody";
+var TableFooter = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("tfoot", { ref, className: cn("border-t bg-muted/50 font-medium [&>tr]:last:border-b-0", className), ...props })
+);
+TableFooter.displayName = "TableFooter";
+var TableRow = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "tr",
+    {
+      ref,
+      className: cn("border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted", className),
+      ...props
+    }
+  )
+);
+TableRow.displayName = "TableRow";
+var TableHead = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "th",
+    {
+      ref,
+      className: cn(
+        "h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0",
+        className
+      ),
+      ...props
+    }
+  )
+);
+TableHead.displayName = "TableHead";
+var TableCell = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("td", { ref, className: cn("p-4 align-middle [&:has([role=checkbox])]:pr-0", className), ...props })
+);
+TableCell.displayName = "TableCell";
+var TableCaption = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("caption", { ref, className: cn("mt-4 text-sm text-muted-foreground", className), ...props })
+);
+TableCaption.displayName = "TableCaption";
+
+// src/components/table/use-scroll-shadow.ts
+var import_react = require("react");
+function useScrollShadow() {
+  const targetRef = (0, import_react.useRef)(null);
+  const [isScrolled, setIsScrolled] = (0, import_react.useState)(false);
+  (0, import_react.useEffect)(() => {
+    const target = targetRef.current;
+    if (!target) return;
+    let scrollContainer = target;
+    while (scrollContainer) {
+      const overflowY = getComputedStyle(scrollContainer).overflowY;
+      if (overflowY === "auto" || overflowY === "scroll") break;
+      scrollContainer = scrollContainer.parentElement;
+    }
+    if (!scrollContainer) return;
+    setIsScrolled(scrollContainer.scrollTop > 0);
+    const handleScroll = () => {
+      if (!scrollContainer) return;
+      setIsScrolled(scrollContainer.scrollTop > 0);
+    };
+    scrollContainer.addEventListener("scroll", handleScroll, { passive: true });
+    return () => scrollContainer.removeEventListener("scroll", handleScroll);
+  }, []);
+  return { targetRef, isScrolled };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Table,
+  TableBody,
+  TableCaption,
+  TableCell,
+  TableFooter,
+  TableHead,
+  TableHeader,
+  TableRow,
+  useScrollShadow
+});
+//# sourceMappingURL=table.cjs.map

package/dist/table.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/table/index.ts","../src/components/ui/table.tsx","../src/lib/utils.ts","../src/components/table/use-scroll-shadow.ts"],"sourcesContent":["/**\n * Public clay table primitives — shadcn-style compound components.\n *\n * Consumers compose tables at the call site from these parts (no wrapper, no smart `Table`):\n *\n * ```tsx\n * import { Table, TableHeader, TableBody, TableRow, TableHead, TableCell } from \"@shapesos/clay/table\";\n *\n * <Table>\n *   <TableHeader>\n *     <TableRow>\n *       <TableHead>Name</TableHead>\n *       <TableHead>Count</TableHead>\n *     </TableRow>\n *   </TableHeader>\n *   <TableBody>\n *     {rows.map((row) => (\n *       <TableRow key={row.id}>\n *         <TableCell>{row.name}</TableCell>\n *         <TableCell>{row.count}</TableCell>\n *       </TableRow>\n *     ))}\n *   </TableBody>\n * </Table>\n * ```\n *\n * `Table` extends shadcn's primitive with a `containerClassName` prop so callers can override the\n * wrapping `<div>`'s `overflow-auto` — needed when the table sits inside an outer scroll container\n * (e.g. an artifact card) and you want the sticky-header containing block to align with that\n * outer container.\n *\n * **Style note:** these primitives use Tailwind v4 + the clay theme tokens (`bg-muted`,\n * `text-muted-foreground`, `border-border`, etc.). Consumers must import the compiled stylesheet\n * alongside the JS:\n *\n * ```ts\n * import \"@shapesos/clay/blocks/styles.css\";\n * ```\n *\n * (The stylesheet name is `blocks/styles.css` for historical reasons — it's the single bundle\n * that compiles all clay-side Tailwind output, including the table primitives.)\n */\nexport {\n  Table,\n  TableBody,\n  TableCaption,\n  TableCell,\n  TableFooter,\n  TableHead,\n  TableHeader,\n  TableRow,\n} from \"@/components/ui/table\";\nexport { useScrollShadow } from \"./use-scroll-shadow\";\n","import * as React from \"react\";\n\nimport { cn } from \"@/lib/utils\";\n\n/** Extension of shadcn's `Table` registry component: exposes `containerClassName` so callers can\n * override the wrapping `<div>`'s default `overflow-auto`. We need this for sticky-header support\n * (sticky uses the nearest overflow ancestor as its containing block — when the actual scroll\n * container is one level out, the inner overflow-auto needs to be neutralised with\n * `overflow-visible` so sticky aligns with the real scrolling parent). */\nconst Table = React.forwardRef<\n  HTMLTableElement,\n  React.HTMLAttributes<HTMLTableElement> & { containerClassName?: string }\n>(({ className, containerClassName, ...props }, ref) => (\n  <div className={cn(\"relative w-full overflow-auto\", containerClassName)}>\n    <table ref={ref} className={cn(\"w-full caption-bottom text-sm\", className)} {...props} />\n  </div>\n));\nTable.displayName = \"Table\";\n\nconst TableHeader = React.forwardRef<HTMLTableSectionElement, React.HTMLAttributes<HTMLTableSectionElement>>(\n  ({ className, ...props }, ref) => <thead ref={ref} className={cn(\"[&_tr]:border-b\", className)} {...props} />\n);\nTableHeader.displayName = \"TableHeader\";\n\nconst TableBody = React.forwardRef<HTMLTableSectionElement, React.HTMLAttributes<HTMLTableSectionElement>>(\n  ({ className, ...props }, ref) => (\n    <tbody ref={ref} className={cn(\"[&_tr:last-child]:border-0\", className)} {...props} />\n  )\n);\nTableBody.displayName = \"TableBody\";\n\nconst TableFooter = React.forwardRef<HTMLTableSectionElement, React.HTMLAttributes<HTMLTableSectionElement>>(\n  ({ className, ...props }, ref) => (\n    <tfoot ref={ref} className={cn(\"border-t bg-muted/50 font-medium [&>tr]:last:border-b-0\", className)} {...props} />\n  )\n);\nTableFooter.displayName = \"TableFooter\";\n\nconst TableRow = React.forwardRef<HTMLTableRowElement, React.HTMLAttributes<HTMLTableRowElement>>(\n  ({ className, ...props }, ref) => (\n    <tr\n      ref={ref}\n      className={cn(\"border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted\", className)}\n      {...props}\n    />\n  )\n);\nTableRow.displayName = \"TableRow\";\n\nconst TableHead = React.forwardRef<HTMLTableCellElement, React.ThHTMLAttributes<HTMLTableCellElement>>(\n  ({ className, ...props }, ref) => (\n    <th\n      ref={ref}\n      className={cn(\n        \"h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0\",\n        className\n      )}\n      {...props}\n    />\n  )\n);\nTableHead.displayName = \"TableHead\";\n\nconst TableCell = React.forwardRef<HTMLTableCellElement, React.TdHTMLAttributes<HTMLTableCellElement>>(\n  ({ className, ...props }, ref) => (\n    <td ref={ref} className={cn(\"p-4 align-middle [&:has([role=checkbox])]:pr-0\", className)} {...props} />\n  )\n);\nTableCell.displayName = \"TableCell\";\n\nconst TableCaption = React.forwardRef<HTMLTableCaptionElement, React.HTMLAttributes<HTMLTableCaptionElement>>(\n  ({ className, ...props }, ref) => (\n    <caption ref={ref} className={cn(\"mt-4 text-sm text-muted-foreground\", className)} {...props} />\n  )\n);\nTableCaption.displayName = \"TableCaption\";\n\nexport { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption };\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\n/**\n * Combines class names using clsx and tailwind-merge — the standard shadcn/ui helper.\n * Tailwind classes that conflict (e.g. `p-2 p-4`) get merged so the last one wins.\n */\nexport function cn(...inputs: ClassValue[]): string {\n  return twMerge(clsx(inputs));\n}\n","import { useEffect, useRef, useState, type RefObject } from \"react\";\n\n/**\n * Tracks whether a scroll container has scrolled past its top edge, for sticky-header shadow effects.\n *\n * Returns `targetRef` (attach to the scroll container itself or any element inside it) and\n * `isScrolled` (true once the container's `scrollTop > 0`). On mount the hook walks up the DOM\n * from the target to find the nearest overflow ancestor (or uses the target itself if it already\n * has `overflowY: auto | scroll`), then listens to its `scroll` event.\n *\n * Used to surface a subtle \"scroll lift\" shadow under sticky headers so users know there is\n * content hidden above.\n *\n * **Why a scroll listener and not a sentinel + IntersectionObserver:** an earlier version used a\n * 1px sentinel as the first child of the scroll container. The sentinel's height pushed the thead\n * down by one pixel in normal flow, and as soon as the user scrolled the thead snapped up to its\n * sticky position — a visible 1px jitter. A scroll listener has no layout footprint.\n *\n * `passive: true` so the listener doesn't block native scroll smoothness; we never call\n * `preventDefault`.\n */\nexport function useScrollShadow(): {\n  targetRef: RefObject<HTMLDivElement | null>;\n  isScrolled: boolean;\n} {\n  const targetRef = useRef<HTMLDivElement>(null);\n  const [isScrolled, setIsScrolled] = useState(false);\n\n  useEffect(() => {\n    const target = targetRef.current;\n    if (!target) return;\n\n    let scrollContainer: HTMLElement | null = target;\n    while (scrollContainer) {\n      const overflowY = getComputedStyle(scrollContainer).overflowY;\n      if (overflowY === \"auto\" || overflowY === \"scroll\") break;\n      scrollContainer = scrollContainer.parentElement;\n    }\n    if (!scrollContainer) return;\n\n    setIsScrolled(scrollContainer.scrollTop > 0);\n\n    const handleScroll = () => {\n      if (!scrollContainer) return;\n      setIsScrolled(scrollContainer.scrollTop > 0);\n    };\n    scrollContainer.addEventListener(\"scroll\", handleScroll, { passive: true });\n    return () => scrollContainer.removeEventListener(\"scroll\", handleScroll);\n  }, []);\n\n  return { targetRef, isScrolled };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,YAAuB;;;ACAvB,kBAAsC;AACtC,4BAAwB;AAMjB,SAAS,MAAM,QAA8B;AAClD,aAAO,mCAAQ,kBAAK,MAAM,CAAC;AAC7B;;;ADKI;AALJ,IAAM,QAAc,iBAGlB,CAAC,EAAE,WAAW,oBAAoB,GAAG,MAAM,GAAG,QAC9C,4CAAC,SAAI,WAAW,GAAG,iCAAiC,kBAAkB,GACpE,sDAAC,WAAM,KAAU,WAAW,GAAG,iCAAiC,SAAS,GAAI,GAAG,OAAO,GACzF,CACD;AACD,MAAM,cAAc;AAEpB,IAAM,cAAoB;AAAA,EACxB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAAQ,4CAAC,WAAM,KAAU,WAAW,GAAG,mBAAmB,SAAS,GAAI,GAAG,OAAO;AAC7G;AACA,YAAY,cAAc;AAE1B,IAAM,YAAkB;AAAA,EACtB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QACxB,4CAAC,WAAM,KAAU,WAAW,GAAG,8BAA8B,SAAS,GAAI,GAAG,OAAO;AAExF;AACA,UAAU,cAAc;AAExB,IAAM,cAAoB;AAAA,EACxB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QACxB,4CAAC,WAAM,KAAU,WAAW,GAAG,2DAA2D,SAAS,GAAI,GAAG,OAAO;AAErH;AACA,YAAY,cAAc;AAE1B,IAAM,WAAiB;AAAA,EACrB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QACxB;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW,GAAG,+EAA+E,SAAS;AAAA,MACrG,GAAG;AAAA;AAAA,EACN;AAEJ;AACA,SAAS,cAAc;AAEvB,IAAM,YAAkB;AAAA,EACtB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QACxB;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AACA,UAAU,cAAc;AAExB,IAAM,YAAkB;AAAA,EACtB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QACxB,4CAAC,QAAG,KAAU,WAAW,GAAG,kDAAkD,SAAS,GAAI,GAAG,OAAO;AAEzG;AACA,UAAU,cAAc;AAExB,IAAM,eAAqB;AAAA,EACzB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QACxB,4CAAC,aAAQ,KAAU,WAAW,GAAG,sCAAsC,SAAS,GAAI,GAAG,OAAO;AAElG;AACA,aAAa,cAAc;;;AE3E3B,mBAA4D;AAqBrD,SAAS,kBAGd;AACA,QAAM,gBAAY,qBAAuB,IAAI;AAC7C,QAAM,CAAC,YAAY,aAAa,QAAI,uBAAS,KAAK;AAElD,8BAAU,MAAM;AACd,UAAM,SAAS,UAAU;AACzB,QAAI,CAAC,OAAQ;AAEb,QAAI,kBAAsC;AAC1C,WAAO,iBAAiB;AACtB,YAAM,YAAY,iBAAiB,eAAe,EAAE;AACpD,UAAI,cAAc,UAAU,cAAc,SAAU;AACpD,wBAAkB,gBAAgB;AAAA,IACpC;AACA,QAAI,CAAC,gBAAiB;AAEtB,kBAAc,gBAAgB,YAAY,CAAC;AAE3C,UAAM,eAAe,MAAM;AACzB,UAAI,CAAC,gBAAiB;AACtB,oBAAc,gBAAgB,YAAY,CAAC;AAAA,IAC7C;AACA,oBAAgB,iBAAiB,UAAU,cAAc,EAAE,SAAS,KAAK,CAAC;AAC1E,WAAO,MAAM,gBAAgB,oBAAoB,UAAU,YAAY;AAAA,EACzE,GAAG,CAAC,CAAC;AAEL,SAAO,EAAE,WAAW,WAAW;AACjC;","names":[]}

package/dist/table.d.cts

@@ -0,0 +1,44 @@
+import * as React from 'react';
+import { RefObject } from 'react';
+
+/** Extension of shadcn's `Table` registry component: exposes `containerClassName` so callers can
+ * override the wrapping `<div>`'s default `overflow-auto`. We need this for sticky-header support
+ * (sticky uses the nearest overflow ancestor as its containing block — when the actual scroll
+ * container is one level out, the inner overflow-auto needs to be neutralised with
+ * `overflow-visible` so sticky aligns with the real scrolling parent). */
+declare const Table: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableElement> & {
+    containerClassName?: string;
+} & React.RefAttributes<HTMLTableElement>>;
+declare const TableHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableSectionElement> & React.RefAttributes<HTMLTableSectionElement>>;
+declare const TableBody: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableSectionElement> & React.RefAttributes<HTMLTableSectionElement>>;
+declare const TableFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableSectionElement> & React.RefAttributes<HTMLTableSectionElement>>;
+declare const TableRow: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableRowElement> & React.RefAttributes<HTMLTableRowElement>>;
+declare const TableHead: React.ForwardRefExoticComponent<React.ThHTMLAttributes<HTMLTableCellElement> & React.RefAttributes<HTMLTableCellElement>>;
+declare const TableCell: React.ForwardRefExoticComponent<React.TdHTMLAttributes<HTMLTableCellElement> & React.RefAttributes<HTMLTableCellElement>>;
+declare const TableCaption: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableCaptionElement> & React.RefAttributes<HTMLTableCaptionElement>>;
+
+/**
+ * Tracks whether a scroll container has scrolled past its top edge, for sticky-header shadow effects.
+ *
+ * Returns `targetRef` (attach to the scroll container itself or any element inside it) and
+ * `isScrolled` (true once the container's `scrollTop > 0`). On mount the hook walks up the DOM
+ * from the target to find the nearest overflow ancestor (or uses the target itself if it already
+ * has `overflowY: auto | scroll`), then listens to its `scroll` event.
+ *
+ * Used to surface a subtle "scroll lift" shadow under sticky headers so users know there is
+ * content hidden above.
+ *
+ * **Why a scroll listener and not a sentinel + IntersectionObserver:** an earlier version used a
+ * 1px sentinel as the first child of the scroll container. The sentinel's height pushed the thead
+ * down by one pixel in normal flow, and as soon as the user scrolled the thead snapped up to its
+ * sticky position — a visible 1px jitter. A scroll listener has no layout footprint.
+ *
+ * `passive: true` so the listener doesn't block native scroll smoothness; we never call
+ * `preventDefault`.
+ */
+declare function useScrollShadow(): {
+    targetRef: RefObject<HTMLDivElement | null>;
+    isScrolled: boolean;
+};
+
+export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, useScrollShadow };

package/dist/table.d.ts

@@ -0,0 +1,44 @@
+import * as React from 'react';
+import { RefObject } from 'react';
+
+/** Extension of shadcn's `Table` registry component: exposes `containerClassName` so callers can
+ * override the wrapping `<div>`'s default `overflow-auto`. We need this for sticky-header support
+ * (sticky uses the nearest overflow ancestor as its containing block — when the actual scroll
+ * container is one level out, the inner overflow-auto needs to be neutralised with
+ * `overflow-visible` so sticky aligns with the real scrolling parent). */
+declare const Table: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableElement> & {
+    containerClassName?: string;
+} & React.RefAttributes<HTMLTableElement>>;
+declare const TableHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableSectionElement> & React.RefAttributes<HTMLTableSectionElement>>;
+declare const TableBody: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableSectionElement> & React.RefAttributes<HTMLTableSectionElement>>;
+declare const TableFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableSectionElement> & React.RefAttributes<HTMLTableSectionElement>>;
+declare const TableRow: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableRowElement> & React.RefAttributes<HTMLTableRowElement>>;
+declare const TableHead: React.ForwardRefExoticComponent<React.ThHTMLAttributes<HTMLTableCellElement> & React.RefAttributes<HTMLTableCellElement>>;
+declare const TableCell: React.ForwardRefExoticComponent<React.TdHTMLAttributes<HTMLTableCellElement> & React.RefAttributes<HTMLTableCellElement>>;
+declare const TableCaption: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableCaptionElement> & React.RefAttributes<HTMLTableCaptionElement>>;
+
+/**
+ * Tracks whether a scroll container has scrolled past its top edge, for sticky-header shadow effects.
+ *
+ * Returns `targetRef` (attach to the scroll container itself or any element inside it) and
+ * `isScrolled` (true once the container's `scrollTop > 0`). On mount the hook walks up the DOM
+ * from the target to find the nearest overflow ancestor (or uses the target itself if it already
+ * has `overflowY: auto | scroll`), then listens to its `scroll` event.
+ *
+ * Used to surface a subtle "scroll lift" shadow under sticky headers so users know there is
+ * content hidden above.
+ *
+ * **Why a scroll listener and not a sentinel + IntersectionObserver:** an earlier version used a
+ * 1px sentinel as the first child of the scroll container. The sentinel's height pushed the thead
+ * down by one pixel in normal flow, and as soon as the user scrolled the thead snapped up to its
+ * sticky position — a visible 1px jitter. A scroll listener has no layout footprint.
+ *
+ * `passive: true` so the listener doesn't block native scroll smoothness; we never call
+ * `preventDefault`.
+ */
+declare function useScrollShadow(): {
+    targetRef: RefObject<HTMLDivElement | null>;
+    isScrolled: boolean;
+};
+
+export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, useScrollShadow };

package/dist/table.js

@@ -0,0 +1,24 @@
+import {
+  Table,
+  TableBody,
+  TableCaption,
+  TableCell,
+  TableFooter,
+  TableHead,
+  TableHeader,
+  TableRow,
+  useScrollShadow
+} from "./chunk-L35M3OD5.js";
+import "./chunk-5WRI5ZAA.js";
+export {
+  Table,
+  TableBody,
+  TableCaption,
+  TableCell,
+  TableFooter,
+  TableHead,
+  TableHeader,
+  TableRow,
+  useScrollShadow
+};
+//# sourceMappingURL=table.js.map

package/dist/table.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/text-area.d.cts

@@ -1,4 +1,4 @@
-import * as react from 'react';
+import * as React from 'react';
 import { KeyboardEventHandler } from 'react';
 
 /** Props for the TextArea auto-resizing input component. */
@@ -23,6 +23,6 @@ interface TextAreaProps {
     className?: string;
 }
 
-declare const TextArea: react.ForwardRefExoticComponent<TextAreaProps & react.RefAttributes<HTMLTextAreaElement>>;
+declare const TextArea: React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<HTMLTextAreaElement>>;
 
 export { TextArea, type TextAreaProps };

package/dist/text-area.d.ts

@@ -1,4 +1,4 @@
-import * as react from 'react';
+import * as React from 'react';
 import { KeyboardEventHandler } from 'react';
 
 /** Props for the TextArea auto-resizing input component. */
@@ -23,6 +23,6 @@ interface TextAreaProps {
     className?: string;
 }
 
-declare const TextArea: react.ForwardRefExoticComponent<TextAreaProps & react.RefAttributes<HTMLTextAreaElement>>;
+declare const TextArea: React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<HTMLTextAreaElement>>;
 
 export { TextArea, type TextAreaProps };

package/dist/types-3Gzk7cRt.d.cts

@@ -0,0 +1,121 @@
+import { ComponentType } from 'react';
+
+/**
+ * Artifact-domain types — wire-protocol shapes shared between artifact components, block-services, and
+ * consumers. The block layer (`@/components/blocks`) imports these to define
+ * `ArtifactRefBlockRecord`; the artifact components consume them directly.
+ *
+ * Mirrored from the agent / io-server contract — see the `chat-typed-content-blocks-and-artifacts`
+ * plan, §6.4 (table contract).
+ */
+
+/**
+ * Artifact-type discriminator constants. Uppercase to match the server-side `artifactTypes`
+ * constant — io-server stores `artifact.type === "TABLE"` (aligned with the GraphQL enum).
+ */
+declare const artifactTypes: {
+    readonly TABLE: "TABLE";
+};
+/** Discriminator for artifact types. Additive — new types extend this union. */
+type ArtifactType = (typeof artifactTypes)[keyof typeof artifactTypes];
+/**
+ * A single column descriptor for a `TableArtifact`. Carries the ORDER and LABEL for the
+ * rendered table — `key` selects a column from the CSV header; `label` overrides the rendered
+ * header text. The CSV is always the source of truth for the data shape; clay never coerces,
+ * reformats, or interprets cell values.
+ */
+interface TableColumn {
+    /** Matches a header in the CSV. Required. Used to project + order the CSV's columns. */
+    key: string;
+    /** Human-readable header text. Required. */
+    label: string;
+    /**
+     * Accepted in the wire payload but not consulted by the renderer — every cell is rendered as
+     * the raw CSV string (or empty for null). Format conversion is a server concern; if a column
+     * needs to be "Yes/No" instead of "true/false", the server should emit it that way in the CSV.
+     * Kept in the interface so callers that pass `type` (e.g. io-client) don't get a type error.
+     */
+    type?: "string" | "number" | "date" | "boolean";
+    /**
+     * Accepted in the wire payload but not consulted by the renderer — every column is left-aligned
+     * by design. Kept in the interface for forward-compat; restore per-column alignment by editing
+     * `table-artifact-content.tsx` if a future use case justifies it.
+     */
+    align?: "left" | "center" | "right";
+}
+/**
+ * Optional stats embedded in `TableConfig` so clients can pre-render UI before fetching the
+ * actual data payload (e.g. N loading shimmers sized to the eventual row count).
+ *
+ * Backward-compat: optional everywhere — older artifacts persisted before this field shipped
+ * still validate. The renderer falls back to a single status-message line when `stats` is absent.
+ */
+interface TableStats {
+    /** Total number of rows in the materialised CSV. Lets the loading branch render shimmers. */
+    rowCount: number;
+}
+/** Rendering config for a table artifact, stored at `artifact.config` (JSONB on the server). */
+interface TableConfig {
+    /** Column descriptors in render order. */
+    columns: TableColumn[];
+    /** Optional metadata describing the underlying data — used for loading-state UI. */
+    stats?: TableStats;
+}
+/**
+ * A row inside a table artifact's parsed CSV. Every cell is the raw string from the CSV (or
+ * `null` for the empty string). The renderer never coerces or interprets — type-aware formatting
+ * is a server concern (the CSV's contents are what the user sees).
+ */
+type TableRow = Record<string, string | null>;
+/** Common shape every artifact record carries. Discriminated by `type`. */
+interface ArtifactBase<TType extends ArtifactType, TConfig> {
+    /** Artifact-type discriminator. */
+    type: TType;
+    /** Human-readable label. Nullable when the artifact has no title. */
+    title: string | null;
+    /** Rendering config — shape varies per artifact type. */
+    config: TConfig;
+    /** Protected-asset metadata pointing to the underlying data payload. Null while the asset is unavailable. */
+    protectedAsset: {
+        /** Time-limited URL the renderer fetches the artifact's data from. */
+        presignedUrl: string;
+    } | null;
+}
+/** Concrete table artifact record. Future artifact types extend `ArtifactRecord` here. */
+type TableArtifactRecord = ArtifactBase<typeof artifactTypes.TABLE, TableConfig>;
+/**
+ * Discriminated union of all supported artifacts. Single-member today; extension pattern:
+ *
+ *   export type ArtifactRecord = TableArtifactRecord | ChartArtifactRecord;
+ *
+ * Every consumer that narrows on `artifact.type` must add the new branch here AND in the
+ * `ArtifactServices` map (single source of truth for the type→component mapping). Older clay
+ * versions that don't know about a new type silently render nothing — see `ArtifactRefBlock` guard.
+ */
+type ArtifactRecord = TableArtifactRecord;
+/** Props every concrete artifact component receives from the dispatcher. */
+interface ArtifactServiceProps<TArtifact extends ArtifactRecord = ArtifactRecord> {
+    /** The artifact metadata (config + presigned URL). */
+    artifact: TArtifact;
+}
+/** Per-artifact-type service — registry entry that pairs a discriminator with its concrete component. */
+interface ArtifactService<TArtifact extends ArtifactRecord = ArtifactRecord> {
+    /** Discriminator value this service handles. */
+    type: ArtifactType;
+    /** React component that renders an artifact of this type — composes ai-elements primitives
+     * (`Artifact`, `ArtifactHeader`, `ArtifactTitle`, `ArtifactActions`, `ArtifactContent`) directly. */
+    Component: ComponentType<ArtifactServiceProps<TArtifact>>;
+    /**
+     * Returns a plain-text / markdown string suitable for clipboard copy.
+     *
+     * Called by `ArtifactRefBlockService.toClipboardText` when the user copies a message that
+     * contains this artifact. Must be pure and synchronous.
+     *
+     * Implementation notes per type:
+     * - `table`: returns the artifact title as plain text (see `TableArtifactService`).
+     * - Future types implement their own representation in a co-located `*-service.ts` file.
+     */
+    toClipboardText: (artifact: TArtifact) => string;
+}
+
+export { type ArtifactRecord as A, type TableArtifactRecord as T, type ArtifactService as a, type ArtifactServiceProps as b, type ArtifactType as c, type TableColumn as d, type TableConfig as e, type TableRow as f, type TableStats as g, artifactTypes as h };