tembro 2.0.3 → 2.0.5

package/packages/cli/vendor/src/components/calendar/date-range-picker.tsx

@@ -1,5 +1,5 @@
 import * as React from "react"
-import { CalendarIcon } from "lucide-react"
+import { CalendarIcon, XIcon } from "lucide-react"
 
 import { Calendar, type CalendarDateRange, type CalendarProps } from "@/components/calendar/calendar"
 import { Button } from "@/components/ui/button"
@@ -10,10 +10,17 @@ import { parseDateKey } from "./date-utils"
 export type DateRangePickerValue = CalendarDateRange
 
 export type DateRangePickerLabels = CalendarProps["labels"] & {
-  placeholder?: string
-  apply?: React.ReactNode
-  clear?: React.ReactNode
-}
+  placeholder?: string
+  apply?: React.ReactNode
+  clear?: React.ReactNode
+  start?: string
+  end?: string
+}
+
+export type DateRangePickerPreset = {
+  label: React.ReactNode
+  value: DateRangePickerValue
+}
 
 export type DateRangePickerProps = Omit<
   CalendarProps,
@@ -23,31 +30,41 @@ export type DateRangePickerProps = Omit<
   onValueChange?: (value: DateRangePickerValue) => void
   labels?: DateRangePickerLabels
   placeholder?: string
-  disabled?: boolean
-  formatValue?: (value: string) => React.ReactNode
-  closeOnSelect?: boolean
-  showFooter?: boolean
-  triggerClassName?: string
-  contentClassName?: string
-}
+  disabled?: boolean
+  clearable?: boolean
+  formatValue?: (value: string) => React.ReactNode
+  closeOnSelect?: boolean
+  closeOnPresetSelect?: boolean
+  showFooter?: boolean
+  presets?: DateRangePickerPreset[]
+  triggerClassName?: string
+  contentClassName?: string
+}
 
-function defaultFormatValue(value: string) {
-  const date = parseDateKey(value)
-  if (!date) return value
-  return new Intl.DateTimeFormat("en-US", { dateStyle: "medium" }).format(date)
-}
+function defaultFormatValue(value: string) {
+  const date = parseDateKey(value)
+  if (!date) return value
+  return new Intl.DateTimeFormat("en-US", { dateStyle: "medium" }).format(date)
+}
+
+function getTextLabel(value: React.ReactNode, fallback: string) {
+  return typeof value === "string" ? value : fallback
+}
 
 function DateRangePicker({
   className,
   value,
   onValueChange,
-  labels,
-  placeholder,
-  disabled = false,
-  formatValue = defaultFormatValue,
-  closeOnSelect = true,
-  showFooter = false,
-  triggerClassName,
+  labels,
+  placeholder,
+  disabled = false,
+  clearable = true,
+  formatValue = defaultFormatValue,
+  closeOnSelect = false,
+  closeOnPresetSelect = false,
+  showFooter = true,
+  presets,
+  triggerClassName,
   contentClassName,
   numberOfMonths = 2,
   pagedNavigation = true,
@@ -98,16 +115,44 @@ function DateRangePicker({
     setOpen(false)
   }
 
-  const clearDraftValue = () => {
-    const nextValue = {}
+  const clearDraftValue = () => {
+    const nextValue = {}
 
     if (showFooter) {
       setDraftValue(nextValue)
       return
     }
 
-    onValueChange?.(nextValue)
-  }
+    onValueChange?.(nextValue)
+  }
+
+  const resetValue = () => {
+    const nextValue = {}
+    setDraftValue(nextValue)
+    onValueChange?.(nextValue)
+  }
+
+  const clearValue = (event: React.MouseEvent<HTMLElement>) => {
+    event.preventDefault()
+    event.stopPropagation()
+    resetValue()
+  }
+
+  const selectPreset = (presetValue: DateRangePickerValue) => {
+    if (showFooter) {
+      setDraftValue(presetValue)
+      if (closeOnPresetSelect) {
+        onValueChange?.(presetValue)
+        setOpen(false)
+      }
+      return
+    }
+
+    onValueChange?.(presetValue)
+    if ((closeOnSelect || closeOnPresetSelect) && presetValue.from && presetValue.to) {
+      setOpen(false)
+    }
+  }
 
   return (
     <div data-slot="date-range-picker" className={cn("w-full", className)}>
@@ -118,33 +163,93 @@ function DateRangePicker({
               type="button"
               variant="outline"
               disabled={disabled}
-              className={cn(
-                "min-h-11 w-full justify-start rounded-[var(--aui-control-radius,var(--radius-md))] border-border/80 bg-background/96 text-left font-normal shadow-[var(--aui-control-shadow,0_1px_2px_rgba(15,23,42,0.04))]",
-                !hasValue && "text-muted-foreground",
-                triggerClassName
-              )}
-            />
-          }
-        >
-          <CalendarIcon data-icon="inline-start" />
-          <span className="min-w-0 flex-1 truncate">{label}</span>
-        </PopoverTrigger>
+              className={cn(
+                "group min-h-11 w-full justify-start gap-3 rounded-[var(--aui-control-radius,var(--radius-md))] border-border/80 bg-background/96 px-3 text-left font-normal shadow-[var(--aui-control-shadow,0_1px_2px_rgba(15,23,42,0.04))]",
+                !hasValue && "text-muted-foreground",
+                triggerClassName
+              )}
+            />
+          }
+        >
+          <CalendarIcon data-icon="inline-start" className={cn(hasValue && "text-primary")} />
+          {hasValue ? (
+            <span className="grid min-w-0 flex-1 grid-cols-[minmax(0,1fr)_auto_minmax(0,1fr)] items-center gap-2">
+              <span className="grid min-w-0 gap-0.5">
+                <span className="text-[11px] font-semibold uppercase tracking-[0.16em] text-muted-foreground">{labels?.start ?? "Start"}</span>
+                <span className="truncate text-sm font-semibold text-foreground">{from ? formatValue(from) : "..."}</span>
+              </span>
+              <span className="text-muted-foreground">-</span>
+              <span className="grid min-w-0 gap-0.5">
+                <span className="text-[11px] font-semibold uppercase tracking-[0.16em] text-muted-foreground">{labels?.end ?? "End"}</span>
+                <span className="truncate text-sm font-semibold text-foreground">{to ? formatValue(to) : "..."}</span>
+              </span>
+            </span>
+          ) : (
+            <span className="grid min-w-0 flex-1 gap-0.5">
+              <span className="text-[11px] font-semibold uppercase tracking-[0.16em] text-muted-foreground">Range</span>
+              <span className="truncate text-sm">{label}</span>
+            </span>
+          )}
+          {clearable && hasValue ? (
+            <span
+              role="button"
+              tabIndex={0}
+              aria-label={getTextLabel(labels?.clear, "Clear date range")}
+              className="ml-auto inline-flex size-7 shrink-0 items-center justify-center rounded-[var(--radius-sm)] text-muted-foreground opacity-80 transition hover:bg-muted hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring"
+              onClick={clearValue}
+              onKeyDown={(event) => {
+                if (event.key === "Enter" || event.key === " ") {
+                  event.preventDefault()
+                  resetValue()
+                }
+              }}
+            >
+              <XIcon className="size-3.5" />
+            </span>
+          ) : null}
+        </PopoverTrigger>
         <PopoverContent
           align="start"
           className={cn(
             "w-auto overflow-hidden rounded-[var(--aui-card-radius,var(--radius-lg))] border-border/70 bg-popover p-0 shadow-[var(--aui-control-panel-shadow,0_18px_40px_rgba(15,23,42,0.14))] backdrop-blur",
             contentClassName
           )}
-        >
-          <Calendar
-            mode="range"
-            range={activeValue}
-            onRangeChange={handleRangeChange}
-            labels={labels}
-            numberOfMonths={numberOfMonths}
-            pagedNavigation={pagedNavigation}
-            {...calendarProps}
-          />
+        >
+          {presets?.length ? (
+            <div className="flex flex-wrap gap-2 border-b border-border/70 bg-muted/20 px-3 py-3">
+              {presets.map((preset, index) => (
+                <Button
+                  key={index}
+                  type="button"
+                  variant="outline"
+                  size="sm"
+                  className="h-7 rounded-full px-3 text-xs"
+                  onClick={() => selectPreset(preset.value)}
+                >
+                  {preset.label}
+                </Button>
+              ))}
+            </div>
+          ) : null}
+          <Calendar
+            mode="range"
+            range={activeValue}
+            onRangeChange={handleRangeChange}
+            labels={labels}
+            renderSelectionSummary={({ range }) => {
+              const fromValue = range?.from ? formatValue(range.from) : null
+              const toValue = range?.to ? formatValue(range.to) : null
+
+              if (fromValue && toValue) return `${fromValue} -> ${toValue}`
+              if (fromValue) return `${fromValue} -> ...`
+              return "No range selected"
+            }}
+            numberOfMonths={numberOfMonths}
+            pagedNavigation={pagedNavigation}
+            showClearShortcut={!showFooter && clearable}
+            showSelectionSummary
+            {...calendarProps}
+          />
           {showFooter && (
             <div className="flex flex-wrap items-center justify-between gap-3 border-t border-border/70 bg-muted/24 px-4 py-3">
               <div className="min-w-0 text-sm text-muted-foreground">

package/packages/cli/vendor/src/components/data-table/data-table-toolbar.tsx

@@ -22,46 +22,55 @@ const dataTableToolbarVariants = cva("flex flex-col", {
   },
 })
 
-export type DataTableToolbarProps = React.ComponentProps<"div"> &
-  VariantProps<typeof dataTableToolbarVariants> & {
-    title?: React.ReactNode
-    description?: React.ReactNode
-    search?: React.ReactNode
-    filters?: React.ReactNode
-    actions?: React.ReactNode
-    selectionActions?: React.ReactNode
-    selectedCount?: number
-    totalCount?: number
-    selectedLabel?: (selectedCount: number, totalCount?: number) => React.ReactNode
-    titleClassName?: string
-    descriptionClassName?: string
-    actionsClassName?: string
-  }
+export type DataTableToolbarProps = React.ComponentProps<"div"> &
+  VariantProps<typeof dataTableToolbarVariants> & {
+    title?: React.ReactNode
+    description?: React.ReactNode
+    search?: React.ReactNode
+    filters?: React.ReactNode
+    summary?: React.ReactNode
+    actions?: React.ReactNode
+    selectionActions?: React.ReactNode
+    selectedCount?: number
+    totalCount?: number
+    selectedLabel?: (selectedCount: number, totalCount?: number) => React.ReactNode
+    titleClassName?: string
+    descriptionClassName?: string
+    searchClassName?: string
+    filtersClassName?: string
+    summaryClassName?: string
+    actionsClassName?: string
+  }
 
 function DataTableToolbar({
   className,
   variant,
   density,
   title,
-  description,
-  search,
-  filters,
-  actions,
-  selectionActions,
-  selectedCount = 0,
-  totalCount,
-  selectedLabel = (selected, total) =>
-    total === undefined ? `${selected} selected` : `${selected} of ${total} selected`,
-  titleClassName,
-  descriptionClassName,
-  actionsClassName,
-  children,
-  ...props
-}: DataTableToolbarProps) {
-  const hasHeading = Boolean(title || description)
-  const hasSelection = selectedCount > 0 && Boolean(selectionActions)
-
-  return (
+  description,
+  search,
+  filters,
+  summary,
+  actions,
+  selectionActions,
+  selectedCount = 0,
+  totalCount,
+  selectedLabel = (selected, total) =>
+    total === undefined ? `${selected} selected` : `${selected} of ${total} selected`,
+  titleClassName,
+  descriptionClassName,
+  searchClassName,
+  filtersClassName,
+  summaryClassName,
+  actionsClassName,
+  children,
+  ...props
+}: DataTableToolbarProps) {
+  const hasHeading = Boolean(title || description)
+  const hasSelection = selectedCount > 0 && Boolean(selectionActions)
+  const hasMainControls = Boolean(search || filters || children)
+
+  return (
     <div
       data-slot="data-table-toolbar"
       data-variant={variant ?? "plain"}
@@ -69,8 +78,8 @@ function DataTableToolbar({
       className={cn(dataTableToolbarVariants({ variant, density }), className)}
       {...props}
     >
-      {(hasHeading || actions) && (
-        <div className="flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between">
+      {(hasHeading || actions) && (
+        <div className="flex flex-col gap-3 xl:flex-row xl:items-start xl:justify-between">
           {hasHeading && (
             <div className="grid gap-1">
               {title && <h2 className={cn("text-lg font-semibold tracking-tight text-foreground", titleClassName)}>{title}</h2>}
@@ -78,24 +87,36 @@ function DataTableToolbar({
             </div>
           )}
 
-          {actions && <div className={cn("flex shrink-0 flex-wrap items-center gap-2", actionsClassName)}>{actions}</div>}
-        </div>
-      )}
-
-      {(search || filters || hasSelection || children) && (
-        <div className="flex flex-col gap-2 lg:flex-row lg:items-center lg:justify-between">
-          <div className="flex min-w-0 flex-1 flex-col gap-2 sm:flex-row sm:items-center">
-            {search}
-            {filters}
-            {children}
-          </div>
-
+          {actions && <div className={cn("flex min-w-0 shrink-0 flex-wrap items-center gap-2 xl:justify-end", actionsClassName)}>{actions}</div>}
+        </div>
+      )}
+
+      {(hasMainControls || summary || hasSelection) && (
+        <div className="flex flex-col gap-3 xl:flex-row xl:items-start xl:justify-between">
+          <div className="flex min-w-0 flex-1 flex-col gap-3">
+            {hasMainControls && (
+              <div className="flex min-w-0 flex-1 flex-col gap-2 lg:flex-row lg:flex-wrap lg:items-center">
+                {search ? <div className={cn("min-w-[16rem] max-w-xl flex-1", searchClassName)}>{search}</div> : null}
+                {filters ? <div className={cn("flex min-w-0 flex-1 flex-wrap items-center gap-2", filtersClassName)}>{filters}</div> : null}
+                {children}
+              </div>
+            )}
+            {summary ? (
+              <div
+                data-slot="data-table-summary"
+                className={cn("flex flex-wrap items-center gap-2 text-sm text-muted-foreground", summaryClassName)}
+              >
+                {summary}
+              </div>
+            ) : null}
+          </div>
+
           {hasSelection && (
-            <div data-slot="data-table-selection-bar" className="flex shrink-0 items-center gap-2 rounded-[var(--radius-md)] border border-[color:var(--aui-control-border-strong,var(--border))] bg-[color:var(--aui-control-surface,var(--background))] px-2.5 py-1.5 text-sm shadow-[var(--aui-control-shadow,none)] backdrop-blur">
+            <div data-slot="data-table-selection-bar" className="flex shrink-0 flex-wrap items-center gap-2 rounded-[var(--radius-md)] border border-[color:var(--aui-control-border-strong,var(--border))] bg-[color:var(--aui-control-surface,var(--background))] px-2.5 py-1.5 text-sm shadow-[var(--aui-control-shadow,none)] backdrop-blur">
               <span className="text-muted-foreground">{selectedLabel(selectedCount, totalCount)}</span>
               {selectionActions}
             </div>
-          )}
+          )}
         </div>
       )}
     </div>

package/packages/cli/vendor/src/components/data-table/data-table.tsx

@@ -24,7 +24,7 @@ import { DataTableColumnVisibilityMenu } from "@/components/data-table/data-tabl
 import { DataTablePagination, type DataTablePaginationProps } from "@/components/data-table/data-table-pagination"
 import { type DataTableRowAction } from "@/components/data-table/data-table-row-actions"
 import { DataTableToolbar, type DataTableToolbarProps } from "@/components/data-table/data-table-toolbar"
-import { EmptyState, type EmptyStateProps } from "@/components/feedback/empty-state"
+import { DataState, type DataStateProps } from "@/components/display/data-state"
 import { LoadingState, type LoadingStateProps } from "@/components/feedback/loading-state"
 import { SearchInput, type SearchInputProps } from "@/components/inputs/search-input"
 import { Button } from "@/components/ui/button"
@@ -87,28 +87,30 @@ export type DataTablePaginationConfig = Pick<
   onPageSizeChange?: (pageSize: number) => void
 }
 
-export type DataTableProps<TData, TValue = unknown> = Omit<
-  React.ComponentProps<"div">,
-  "children"
-> & {
+export type DataTableProps<TData, TValue = unknown> = Omit<
+  React.ComponentProps<"div">,
+  "children"
+> & {
   columns: ColumnDef<TData, TValue>[]
   data: TData[]
-  title?: React.ReactNode
-  description?: React.ReactNode
-  features?: DataTableFeatureConfig
-  search?: DataTableSearchConfig
-  toolbarActions?: React.ReactNode | ((context: DataTableActionContext<TData>) => React.ReactNode)
-  rowActions?: (row: Row<TData>, original: TData) => DataTableRowAction<TData>[]
+  title?: React.ReactNode
+  description?: React.ReactNode
+  features?: DataTableFeatureConfig
+  search?: DataTableSearchConfig
+  filters?: React.ReactNode | ((context: DataTableActionContext<TData>) => React.ReactNode)
+  summary?: React.ReactNode | ((context: DataTableActionContext<TData>) => React.ReactNode)
+  toolbarActions?: React.ReactNode | ((context: DataTableActionContext<TData>) => React.ReactNode)
+  rowActions?: (row: Row<TData>, original: TData) => DataTableRowAction<TData>[]
   bulkActions?: DataTableBulkAction<TData>[]
   onRefresh?: (context: DataTableActionContext<TData>) => void
-  onExport?: (context: DataTableActionContext<TData>) => void
+  onExport?: (context: DataTableActionContext<TData>) => void
   refreshLabel?: React.ReactNode
   exportLabel?: React.ReactNode
   getRowId?: (originalRow: TData, index: number, parent?: Row<TData>) => string
   isLoading?: boolean
   isError?: boolean
-  emptyState?: EmptyStateProps
-  errorState?: EmptyStateProps
+  emptyState?: Omit<DataStateProps, "status">
+  errorState?: Omit<DataStateProps, "status">
   loadingState?: LoadingStateProps
   loadingVariant?: DataTableLoadingVariant
   toolbar?: React.ReactNode | ((table: TanStackTable<TData>) => React.ReactNode)
@@ -189,11 +191,13 @@ function DataTable<TData, TValue = unknown>({
   columns,
   data,
   title,
-  description,
-  features,
-  search,
-  toolbarActions,
-  rowActions,
+  description,
+  features,
+  search,
+  filters,
+  summary,
+  toolbarActions,
+  rowActions,
   bulkActions,
   onRefresh,
   onExport,
@@ -259,11 +263,10 @@ function DataTable<TData, TValue = unknown>({
         pageSize: paginationConfig.pageSize,
       }
     : undefined
-  const manualPagination = Boolean(paginationConfig && paginationConfig.manual !== false)
-  const resolvedRowSelection = rowSelection ?? {}
-  const selectedRowCount = Object.keys(resolvedRowSelection).length
-
-  // TanStack Table returns imperative helpers that React Compiler flags by design.
+  const manualPagination = Boolean(paginationConfig && paginationConfig.manual !== false)
+  const resolvedRowSelection = rowSelection ?? {}
+
+  // TanStack Table returns imperative helpers that React Compiler flags by design.
   // eslint-disable-next-line react-hooks/incompatible-library
   const table = useReactTable({
     data,
@@ -291,18 +294,21 @@ function DataTable<TData, TValue = unknown>({
     getExpandedRowModel: getExpandedRowModel(),
   })
 
-  const rows = table.getRowModel().rows
-  const selectedRows = table.getSelectedRowModel().rows.map((row) => row.original)
-  const actionContext = React.useMemo<DataTableActionContext<TData>>(
-    () => ({ table, data, selectedRows }),
-    [data, selectedRows, table]
-  )
-  const visibleColumns = table.getVisibleLeafColumns()
-  const visibleColumnCount = Math.max(visibleColumns.length, 1)
-  const resolvedToolbar = typeof toolbar === "function" ? toolbar(table) : toolbar
-  const resolvedToolbarProps = typeof toolbarProps === "function" ? toolbarProps(table) : toolbarProps
-  const shouldShowSearch = Boolean(search && features?.search !== false)
-  const shouldShowColumnVisibility = Boolean(features?.columnVisibility && table.getAllLeafColumns().some((column) => column.getCanHide()))
+  const rows = table.getRowModel().rows
+  const selectedRows = table.getSelectedRowModel().rows.map((row) => row.original)
+  const selectedRowCount = selectedRows.length
+  const actionContext = React.useMemo<DataTableActionContext<TData>>(
+    () => ({ table, data, selectedRows }),
+    [data, selectedRows, table]
+  )
+  const visibleColumns = table.getVisibleLeafColumns()
+  const visibleColumnCount = Math.max(visibleColumns.length, 1)
+  const resolvedToolbar = typeof toolbar === "function" ? toolbar(table) : toolbar
+  const resolvedToolbarProps = typeof toolbarProps === "function" ? toolbarProps(table) : toolbarProps
+  const resolvedFilters = typeof filters === "function" ? filters(actionContext) : filters
+  const resolvedSummary = typeof summary === "function" ? summary(actionContext) : summary
+  const shouldShowSearch = Boolean(search && features?.search !== false)
+  const shouldShowColumnVisibility = Boolean(features?.columnVisibility && table.getAllLeafColumns().some((column) => column.getCanHide()))
   const shouldShowRefresh = Boolean(features?.refresh && onRefresh)
   const shouldShowExport = Boolean(features?.export && onExport)
   const shouldShowBulkActions = Boolean(features?.bulkActions !== false && bulkActions?.length)
@@ -310,6 +316,8 @@ function DataTable<TData, TValue = unknown>({
     title ||
       description ||
       search ||
+      resolvedFilters ||
+      resolvedSummary ||
       toolbarActions ||
       shouldShowRefresh ||
       shouldShowExport
@@ -355,9 +363,11 @@ function DataTable<TData, TValue = unknown>({
     />
   ) : undefined
   const hasDefaultToolbarContent = Boolean(
-    title ||
-      description ||
+    title ||
+      description ||
       defaultSearch ||
+      resolvedFilters ||
+      resolvedSummary ||
       toolbarActions ||
       shouldShowColumnVisibilityInToolbar ||
       shouldShowRefresh ||
@@ -400,26 +410,28 @@ function DataTable<TData, TValue = unknown>({
       </TableRow>
     ))
 
-  const stateContent = shouldRenderSkeleton ? null : isLoading ? (
-    <LoadingState label="Loading data..." {...loadingState} />
-  ) : isError ? (
-    <EmptyState title="Could not load data" description="Please try again." {...errorState} />
-  ) : rows.length === 0 ? (
-    <EmptyState {...emptyState} />
-  ) : null
+  const stateContent = shouldRenderSkeleton ? null : isLoading ? (
+    <LoadingState label="Loading data..." {...loadingState} />
+  ) : isError ? (
+    <DataState status="error" title="Could not load data" description="Please try again." variant="plain" {...errorState} />
+  ) : rows.length === 0 ? (
+    <DataState status="empty" variant="plain" {...emptyState} />
+  ) : null
 
   return (
     <div data-slot="data-table" className={cn("grid gap-3", className)} {...props}>
       {hasToolbar &&
         (resolvedToolbar ?? (
-          <DataTableToolbar
-            title={title}
-            description={description}
-            search={defaultSearch}
-            actions={defaultActions}
-            selectionActions={defaultSelectionActions}
-            selectedCount={selectedRowCount}
-            totalCount={paginationConfig ? paginationConfig.rowCount ?? data.length : data.length}
+          <DataTableToolbar
+            title={title}
+            description={description}
+            search={defaultSearch}
+            filters={resolvedFilters}
+            summary={resolvedSummary}
+            actions={defaultActions}
+            selectionActions={defaultSelectionActions}
+            selectedCount={selectedRowCount}
+            totalCount={paginationConfig ? paginationConfig.rowCount ?? data.length : data.length}
             variant="plain"
             {...resolvedToolbarProps}
           />

package/packages/cli/vendor/src/components/data-table/demo.tsx

@@ -1,13 +1,3 @@
-import { component, createShowcaseDemoRegistry } from "@/showcase/create-demo"
+import { createShowcaseDemoRegistry } from "@/showcase/create-demo"
 
-export const dataTableShowcaseDemoRegistry = createShowcaseDemoRegistry([
-  component("data-table-pagination", "DataTablePagination", "data-table", "Pagination control used by DataTable pages."),
-  component("data-table-toolbar", "DataTableToolbar", "data-table", "Toolbar surface for DataTable search, filters and actions."),
-  component("data-table-column-visibility-menu", "DataTableColumnVisibilityMenu", "data-table", "Column visibility menu pattern for table views."),
-  component("data-table-select-column", "DataTableSelectColumn", "data-table", "Selection column pattern for bulk table workflows."),
-  component("data-table-sortable-header", "DataTableSortableHeader", "data-table", "Sortable header trigger with clear visual state."),
-  component("data-table-row-actions", "DataTableRowActions", "data-table", "Row action menu for inspect, duplicate and archive operations."),
-  component("data-table-actions-column", "DataTableActionsColumn", "data-table", "Reusable actions column for DataTable definitions."),
-  component("data-table-bulk-actions", "DataTableBulkActions", "data-table", "Bulk action bar for selected rows."),
-  component("data-table-view-presets", "DataTableViewPresets", "data-table", "Saved table view presets for operational dashboards."),
-])
+export const dataTableShowcaseDemoRegistry = createShowcaseDemoRegistry([])

package/packages/cli/vendor/src/components/data-table/public.ts

@@ -1,11 +1,6 @@
 export * from "./data-table"
-export * from "./data-table-actions-column"
+export * from "./data-table-pagination"
 export * from "./data-table-bulk-actions"
 export * from "./data-table-column-visibility-menu"
-export * from "./data-table-pagination"
-export * from "./data-table-row-actions"
-export * from "./data-table-select-column"
 export * from "./data-table-sortable-header"
-export * from "./data-table-toolbar"
 export * from "./data-table-view-presets"
-export * from "./data-table-saved-filters"