Naming the container

dust-tt · Jan 24, 2025 · 3fe9e01 · 3fe9e01
1 parent ea6e4ec
commit 3fe9e01
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 4 deletions.
diff --git a/sparkle/src/components/DataTable.tsx b/sparkle/src/components/DataTable.tsx
@@ -269,7 +269,10 @@ DataTable.Root = function DataTableRoot({
   ...props
 }: DataTableRootProps) {
   return (
-    <div className={cn("s-@container", containerClassName)} {...containerProps}>
+    <div
+      className={cn("s-@container/table", containerClassName)}
+      {...containerProps}
+    >
       <table
         className={cn("s-w-full s-table-fixed s-border-collapse", className)}
         {...props}

diff --git a/sparkle/src/stories/DataTable.stories.tsx b/sparkle/src/stories/DataTable.stories.tsx
@@ -165,7 +165,7 @@ const columns: ColumnDef<Data>[] = [
   {
     accessorKey: "usedBy",
     meta: {
-      className: "s-w-[82px] s-hidden @xs:s-table-cell",
+      className: "s-w-[82px] s-hidden @xs/table:s-table-cell",
     },
     header: "Used by",
     cell: (info) => (
@@ -190,7 +190,7 @@ const columns: ColumnDef<Data>[] = [
     accessorKey: "lastUpdated",
     header: "Last updated",
     meta: {
-      className: "s-w-[128px] s-hidden @sm:s-table-cell",
+      className: "s-w-[128px] s-hidden @sm/table:s-table-cell",
     },
     cell: (info) => (
       <DataTable.BasicCellContent label={info.row.original.lastUpdated} />
@@ -201,7 +201,7 @@ const columns: ColumnDef<Data>[] = [
     accessorKey: "size",
     header: "Size",
     meta: {
-      className: "s-w-[48px] s-hidden @sm:s-table-cell",
+      className: "s-w-[48px] s-hidden @sm/table:s-table-cell",
     },
     cell: (info) => (
       <DataTable.BasicCellContent label={info.row.original.size} />