@dowel-ui/react 0.5.0 → 0.8.0

package/src/registry/blocks.ts

@@ -1,13 +1,56 @@
 import type { ComponentMeta } from "./schema";
 
+import { meta as adminDashboardMeta } from "@/blocks/admin-dashboard/meta";
 import { meta as adminUsersMeta } from "@/blocks/admin-users/meta";
+import { meta as agentConsoleMeta } from "@/blocks/agent-console/meta";
 import { meta as aiChatMeta } from "@/blocks/ai-chat/meta";
+import { meta as aiDashboardMeta } from "@/blocks/ai-dashboard/meta";
+import { meta as aiWorkspaceMeta } from "@/blocks/ai-workspace/meta";
+import { meta as analyticsMeta } from "@/blocks/analytics/meta";
+import { meta as billingMeta } from "@/blocks/billing/meta";
+import { meta as commandCenterMeta } from "@/blocks/command-center/meta";
+import { meta as crmMeta } from "@/blocks/crm/meta";
 import { meta as dashboardMeta } from "@/blocks/dashboard/meta";
 import { meta as forgotPasswordMeta } from "@/blocks/forgot-password/meta";
 import { meta as loginMeta } from "@/blocks/login/meta";
+import { meta as onboardingMeta } from "@/blocks/onboarding/meta";
 import { meta as pricingMeta } from "@/blocks/pricing/meta";
 import { meta as settingsMeta } from "@/blocks/settings/meta";
 import { meta as signupMeta } from "@/blocks/signup/meta";
+import { meta as ctaBannerMeta } from "@/blocks/cta-banner/meta";
+import { meta as ctaCenteredMeta } from "@/blocks/cta-centered/meta";
+import { meta as ctaSplitImageMeta } from "@/blocks/cta-split-image/meta";
+import { meta as faqAccordionMeta } from "@/blocks/faq-accordion/meta";
+import { meta as faqCategorizedMeta } from "@/blocks/faq-categorized/meta";
+import { meta as faqSearchableMeta } from "@/blocks/faq-searchable/meta";
+import { meta as faqTabbedGridMeta } from "@/blocks/faq-tabbed-grid/meta";
+import { meta as featuresAlternatingMeta } from "@/blocks/features-alternating/meta";
+import { meta as featuresBentoMeta } from "@/blocks/features-bento/meta";
+import { meta as featuresIconGridMeta } from "@/blocks/features-icon-grid/meta";
+import { meta as footerMegaMeta } from "@/blocks/footer-mega/meta";
+import { meta as footerMinimalMeta } from "@/blocks/footer-minimal/meta";
+import { meta as footerNewsletterMeta } from "@/blocks/footer-newsletter/meta";
+import { meta as footerSimpleMeta } from "@/blocks/footer-simple/meta";
+import { meta as heroGridMeta } from "@/blocks/hero-grid/meta";
+import { meta as heroMinimalMeta } from "@/blocks/hero-minimal/meta";
+import { meta as heroPerspectiveGridMeta } from "@/blocks/hero-perspective-grid/meta";
+import { meta as heroProductMeta } from "@/blocks/hero-product/meta";
+import { meta as heroSplitImageMeta } from "@/blocks/hero-split-image/meta";
+import { meta as heroSpotlightMeta } from "@/blocks/hero-spotlight/meta";
+import { meta as logoCloudSimpleMeta } from "@/blocks/logo-cloud-simple/meta";
+import { meta as logoGridTooltipsMeta } from "@/blocks/logo-grid-tooltips/meta";
+import { meta as logoLinksMarqueeMeta } from "@/blocks/logo-links-marquee/meta";
+import { meta as logoMarqueeMeta } from "@/blocks/logo-marquee/meta";
+import { meta as pricingSinglePlanMeta } from "@/blocks/pricing-single-plan/meta";
+import { meta as pricingThreeTierMeta } from "@/blocks/pricing-three-tier/meta";
+import { meta as pricingTwoTierMeta } from "@/blocks/pricing-two-tier/meta";
+import { meta as statsGridMeta } from "@/blocks/stats-grid/meta";
+import { meta as statsTrendCardsMeta } from "@/blocks/stats-trend-cards/meta";
+import { meta as teamCarouselMeta } from "@/blocks/team-carousel/meta";
+import { meta as teamGridMeta } from "@/blocks/team-grid/meta";
+import { meta as testimonialRotatorMeta } from "@/blocks/testimonial-rotator/meta";
+import { meta as testimonialSpotlightMeta } from "@/blocks/testimonial-spotlight/meta";
+import { meta as testimonialStarGridMeta } from "@/blocks/testimonial-star-grid/meta";
 
 /**
  * Every block in the registry.
@@ -19,12 +62,55 @@ import { meta as signupMeta } from "@/blocks/signup/meta";
  * `meta.test.ts` fails if a block directory exists that is missing from here.
  */
 export const blockMetas: ComponentMeta[] = [
+  adminDashboardMeta,
   adminUsersMeta,
+  agentConsoleMeta,
   aiChatMeta,
+  aiDashboardMeta,
+  aiWorkspaceMeta,
+  analyticsMeta,
+  billingMeta,
+  commandCenterMeta,
+  crmMeta,
   dashboardMeta,
   forgotPasswordMeta,
   loginMeta,
+  onboardingMeta,
   pricingMeta,
   settingsMeta,
   signupMeta,
+  ctaBannerMeta,
+  ctaCenteredMeta,
+  ctaSplitImageMeta,
+  faqAccordionMeta,
+  faqCategorizedMeta,
+  faqSearchableMeta,
+  faqTabbedGridMeta,
+  featuresAlternatingMeta,
+  featuresBentoMeta,
+  featuresIconGridMeta,
+  footerMegaMeta,
+  footerMinimalMeta,
+  footerNewsletterMeta,
+  footerSimpleMeta,
+  heroGridMeta,
+  heroMinimalMeta,
+  heroPerspectiveGridMeta,
+  heroProductMeta,
+  heroSplitImageMeta,
+  heroSpotlightMeta,
+  logoCloudSimpleMeta,
+  logoGridTooltipsMeta,
+  logoLinksMarqueeMeta,
+  logoMarqueeMeta,
+  pricingSinglePlanMeta,
+  pricingThreeTierMeta,
+  pricingTwoTierMeta,
+  statsGridMeta,
+  statsTrendCardsMeta,
+  teamCarouselMeta,
+  teamGridMeta,
+  testimonialRotatorMeta,
+  testimonialSpotlightMeta,
+  testimonialStarGridMeta,
 ];

package/src/registry/components.ts

@@ -23,17 +23,20 @@ import { meta as aiToolMeta } from "@/components/ai-tool/meta";
 import { meta as alertMeta } from "@/components/alert/meta";
 import { meta as avatarMeta } from "@/components/avatar/meta";
 import { meta as badgeMeta } from "@/components/badge/meta";
+import { meta as breadcrumbMeta } from "@/components/breadcrumb/meta";
 import { meta as buttonMeta } from "@/components/button/meta";
 import { meta as calendarMeta } from "@/components/calendar/meta";
 import { meta as cardMeta } from "@/components/card/meta";
 import { meta as checkboxMeta } from "@/components/checkbox/meta";
 import { meta as codeBlockMeta } from "@/components/code-block/meta";
+import { meta as collapsibleMeta } from "@/components/collapsible/meta";
 import { meta as comboboxMeta } from "@/components/combobox/meta";
 import { meta as commandMeta } from "@/components/command/meta";
 import { meta as confirmTypedMeta } from "@/components/confirm-typed/meta";
 import { meta as cronEditorMeta } from "@/components/cron-editor/meta";
 import { meta as dataTableMeta } from "@/components/data-table/meta";
 import { meta as datePickerMeta } from "@/components/date-picker/meta";
+import { meta as directionMeta } from "@/components/direction/meta";
 import { meta as dialogMeta } from "@/components/dialog/meta";
 import { meta as diffViewerMeta } from "@/components/diff-viewer/meta";
 import { meta as dnsRecordMeta } from "@/components/dns-record/meta";
@@ -57,6 +60,7 @@ import { meta as secretFieldMeta } from "@/components/secret-field/meta";
 import { meta as selectMeta } from "@/components/select/meta";
 import { meta as separatorMeta } from "@/components/separator/meta";
 import { meta as sessionExpiryMeta } from "@/components/session-expiry/meta";
+import { meta as sidebarMeta } from "@/components/sidebar/meta";
 import { meta as sheetMeta } from "@/components/sheet/meta";
 import { meta as shortcutRecorderMeta } from "@/components/shortcut-recorder/meta";
 import { meta as skeletonMeta } from "@/components/skeleton/meta";
@@ -68,8 +72,118 @@ import { meta as tableMeta } from "@/components/table/meta";
 import { meta as tabsMeta } from "@/components/tabs/meta";
 import { meta as tagsInputMeta } from "@/components/tags-input/meta";
 import { meta as timeRangePickerMeta } from "@/components/time-range-picker/meta";
+import { meta as textareaMeta } from "@/components/textarea/meta";
 import { meta as toastMeta } from "@/components/toast/meta";
 import { meta as tooltipMeta } from "@/components/tooltip/meta";
+import { meta as dotsLoaderMeta } from "@/components/dots-loader/meta";
+import { meta as ringLoaderMeta } from "@/components/ring-loader/meta";
+import { meta as barLoaderMeta } from "@/components/bar-loader/meta";
+import { meta as shapeLoaderMeta } from "@/components/shape-loader/meta";
+import { meta as textLoaderMeta } from "@/components/text-loader/meta";
+import { meta as gridLoaderMeta } from "@/components/grid-loader/meta";
+import { meta as morphButtonMeta } from "@/components/morph-button/meta";
+import { meta as effectButtonMeta } from "@/components/effect-button/meta";
+import { meta as magneticButtonMeta } from "@/components/magnetic-button/meta";
+import { meta as dotMorphButtonMeta } from "@/components/dot-morph-button/meta";
+import { meta as focusBlurLinksMeta } from "@/components/focus-blur-links/meta";
+import { meta as copyButtonMeta } from "@/components/copy-button/meta";
+import { meta as textEffectMeta } from "@/components/text-effect/meta";
+import { meta as textSwapMeta } from "@/components/text-swap/meta";
+import { meta as shimmerTextMeta } from "@/components/shimmer-text/meta";
+import { meta as scrambleTextMeta } from "@/components/scramble-text/meta";
+import { meta as typewriterTextMeta } from "@/components/typewriter-text/meta";
+import { meta as scrollRevealTextMeta } from "@/components/scroll-reveal-text/meta";
+import { meta as numberFlowMeta } from "@/components/number-flow/meta";
+import { meta as cardSpreadMeta } from "@/components/card-spread/meta";
+import { meta as carousel3dMeta } from "@/components/carousel-3d/meta";
+import { meta as timeStackMeta } from "@/components/time-stack/meta";
+import { meta as expandableCardsMeta } from "@/components/expandable-cards/meta";
+import { meta as glowCardMeta } from "@/components/glow-card/meta";
+import { meta as photoStackMeta } from "@/components/photo-stack/meta";
+import { meta as cardStackMeta } from "@/components/card-stack/meta";
+import { meta as bookMeta } from "@/components/book/meta";
+import { meta as productCardMeta } from "@/components/product-card/meta";
+import { meta as marqueeMeta } from "@/components/marquee/meta";
+import { meta as reviewsCarouselMeta } from "@/components/reviews-carousel/meta";
+import { meta as inviteCarouselMeta } from "@/components/invite-carousel/meta";
+import { meta as swipeCarouselMeta } from "@/components/swipe-carousel/meta";
+import { meta as imageAccordionMeta } from "@/components/image-accordion/meta";
+import { meta as tiltCardMeta } from "@/components/tilt-card/meta";
+import { meta as ditherCanvasMeta } from "@/components/dither-canvas/meta";
+import { meta as ditherDonutMeta } from "@/components/dither-donut/meta";
+import { meta as ditherBarMeta } from "@/components/dither-bar/meta";
+import { meta as ditherAreaMeta } from "@/components/dither-area/meta";
+import { meta as ditherLineMeta } from "@/components/dither-line/meta";
+import { meta as ditherHeatmapMeta } from "@/components/dither-heatmap/meta";
+import { meta as ditherGaugeMeta } from "@/components/dither-gauge/meta";
+import { meta as ditherScatterMeta } from "@/components/dither-scatter/meta";
+import { meta as ditherFunnelMeta } from "@/components/dither-funnel/meta";
+import { meta as ditherMeterMeta } from "@/components/dither-meter/meta";
+import { meta as uptimeMatrixMeta } from "@/components/uptime-matrix/meta";
+import { meta as avatarGroupMeta } from "@/components/avatar-group/meta";
+import { meta as appStackMeta } from "@/components/app-stack/meta";
+import { meta as contributionGraphMeta } from "@/components/contribution-graph/meta";
+import { meta as starCountMeta } from "@/components/star-count/meta";
+import { meta as notificationBadgeMeta } from "@/components/notification-badge/meta";
+import { meta as switchboardCardMeta } from "@/components/switchboard-card/meta";
+import { meta as islandMeta } from "@/components/island/meta";
+import { meta as morphSurfaceMeta } from "@/components/morph-surface/meta";
+import { meta as gooeyPopoverMeta } from "@/components/gooey-popover/meta";
+import { meta as richPopoverMeta } from "@/components/rich-popover/meta";
+import { meta as commentBubbleMeta } from "@/components/comment-bubble/meta";
+import { meta as accountMenuMeta } from "@/components/account-menu/meta";
+import { meta as exposureSliderMeta } from "@/components/exposure-slider/meta";
+import { meta as scrubberMeta } from "@/components/scrubber/meta";
+import { meta as imageSelectorMeta } from "@/components/image-selector/meta";
+import { meta as imageMetadataMeta } from "@/components/image-metadata/meta";
+import { meta as photoTabsMeta } from "@/components/photo-tabs/meta";
+import { meta as socialSelectorMeta } from "@/components/social-selector/meta";
+import { meta as expandableListMeta } from "@/components/expandable-list/meta";
+import { meta as otpInputMeta } from "@/components/otp-input/meta";
+import { meta as stepperMeta } from "@/components/stepper/meta";
+import { meta as contextMenuMeta } from "@/components/context-menu/meta";
+import { meta as tweetCardMeta } from "@/components/tweet-card/meta";
+import { meta as cursorFollowMeta } from "@/components/cursor-follow/meta";
+import { meta as gradientOrbMeta } from "@/components/gradient-orb/meta";
+import { meta as orbFaceMeta } from "@/components/orb-face/meta";
+import { meta as pixelAvatarMeta } from "@/components/pixel-avatar/meta";
+import { meta as aiLoaderMeta } from "@/components/ai-loader/meta";
+import { meta as aiSuggestionsMeta } from "@/components/ai-suggestions/meta";
+import { meta as aiBranchMeta } from "@/components/ai-branch/meta";
+import { meta as aiArtifactMeta } from "@/components/ai-artifact/meta";
+import { meta as shaderTransitionMeta } from "@/components/shader-transition/meta";
+import { meta as magneticSelectMeta } from "@/components/magnetic-select/meta";
+import { meta as aspectMorphMeta } from "@/components/aspect-morph/meta";
+import { meta as createMenuMeta } from "@/components/create-menu/meta";
+import { meta as radialMenuMeta } from "@/components/radial-menu/meta";
+import { meta as canvasToolbarMeta } from "@/components/canvas-toolbar/meta";
+import { meta as gooTabsMeta } from "@/components/goo-tabs/meta";
+import { meta as assigneePickerMeta } from "@/components/assignee-picker/meta";
+import { meta as selectionListMeta } from "@/components/selection-list/meta";
+import { meta as browserTabsMeta } from "@/components/browser-tabs/meta";
+import { meta as actionNodeMeta } from "@/components/action-node/meta";
+import { meta as gooBallMeta } from "@/components/goo-ball/meta";
+import { meta as glassBubbleMeta } from "@/components/glass-bubble/meta";
+import { meta as dragStepperMeta } from "@/components/drag-stepper/meta";
+import { meta as sloshSliderMeta } from "@/components/slosh-slider/meta";
+import { meta as reorderListMeta } from "@/components/reorder-list/meta";
+import { meta as magnifyDockMeta } from "@/components/magnify-dock/meta";
+import { meta as rangeDialMeta } from "@/components/range-dial/meta";
+import { meta as foldingFrameMeta } from "@/components/folding-frame/meta";
+import { meta as slideToConfirmMeta } from "@/components/slide-to-confirm/meta";
+import { meta as pullToRefreshMeta } from "@/components/pull-to-refresh/meta";
+import { meta as todoTowerMeta } from "@/components/todo-tower/meta";
+import { meta as paletteGeneratorMeta } from "@/components/palette-generator/meta";
+import { meta as inlineConfirmMeta } from "@/components/inline-confirm/meta";
+import { meta as liquidToggleMeta } from "@/components/liquid-toggle/meta";
+import { meta as animatedChecklistMeta } from "@/components/animated-checklist/meta";
+import { meta as nowPlayingMeta } from "@/components/now-playing/meta";
+import { meta as notifyButtonMeta } from "@/components/notify-button/meta";
+import { meta as tickProgressMeta } from "@/components/tick-progress/meta";
+import { meta as escapeButtonMeta } from "@/components/escape-button/meta";
+import { meta as expandingSearchMeta } from "@/components/expanding-search/meta";
+import { meta as dialMeta } from "@/components/dial/meta";
+import { meta as commandBarMeta } from "@/components/command-bar/meta";
 
 /**
  * Every component in the registry.
@@ -106,11 +220,13 @@ export const componentMetas: ComponentMeta[] = [
   alertMeta,
   avatarMeta,
   badgeMeta,
+  breadcrumbMeta,
   buttonMeta,
   calendarMeta,
   cardMeta,
   checkboxMeta,
   codeBlockMeta,
+  collapsibleMeta,
   comboboxMeta,
   commandMeta,
   confirmTypedMeta,
@@ -118,6 +234,7 @@ export const componentMetas: ComponentMeta[] = [
   dataTableMeta,
   datePickerMeta,
   dialogMeta,
+  directionMeta,
   diffViewerMeta,
   dnsRecordMeta,
   drawerMeta,
@@ -141,6 +258,7 @@ export const componentMetas: ComponentMeta[] = [
   separatorMeta,
   sessionExpiryMeta,
   sheetMeta,
+  sidebarMeta,
   shortcutRecorderMeta,
   skeletonMeta,
   sliderMeta,
@@ -151,8 +269,118 @@ export const componentMetas: ComponentMeta[] = [
   tabsMeta,
   tagsInputMeta,
   timeRangePickerMeta,
+  textareaMeta,
   toastMeta,
   tooltipMeta,
+  dotsLoaderMeta,
+  ringLoaderMeta,
+  barLoaderMeta,
+  shapeLoaderMeta,
+  textLoaderMeta,
+  gridLoaderMeta,
+  morphButtonMeta,
+  effectButtonMeta,
+  magneticButtonMeta,
+  dotMorphButtonMeta,
+  focusBlurLinksMeta,
+  copyButtonMeta,
+  textEffectMeta,
+  textSwapMeta,
+  shimmerTextMeta,
+  scrambleTextMeta,
+  typewriterTextMeta,
+  scrollRevealTextMeta,
+  numberFlowMeta,
+  cardSpreadMeta,
+  carousel3dMeta,
+  timeStackMeta,
+  expandableCardsMeta,
+  glowCardMeta,
+  photoStackMeta,
+  cardStackMeta,
+  bookMeta,
+  productCardMeta,
+  marqueeMeta,
+  reviewsCarouselMeta,
+  inviteCarouselMeta,
+  swipeCarouselMeta,
+  imageAccordionMeta,
+  tiltCardMeta,
+  ditherCanvasMeta,
+  ditherDonutMeta,
+  ditherBarMeta,
+  ditherAreaMeta,
+  ditherLineMeta,
+  ditherHeatmapMeta,
+  ditherGaugeMeta,
+  ditherScatterMeta,
+  ditherFunnelMeta,
+  ditherMeterMeta,
+  uptimeMatrixMeta,
+  avatarGroupMeta,
+  appStackMeta,
+  contributionGraphMeta,
+  starCountMeta,
+  notificationBadgeMeta,
+  switchboardCardMeta,
+  islandMeta,
+  morphSurfaceMeta,
+  gooeyPopoverMeta,
+  richPopoverMeta,
+  commentBubbleMeta,
+  accountMenuMeta,
+  exposureSliderMeta,
+  scrubberMeta,
+  imageSelectorMeta,
+  imageMetadataMeta,
+  photoTabsMeta,
+  socialSelectorMeta,
+  expandableListMeta,
+  otpInputMeta,
+  stepperMeta,
+  contextMenuMeta,
+  tweetCardMeta,
+  cursorFollowMeta,
+  gradientOrbMeta,
+  orbFaceMeta,
+  pixelAvatarMeta,
+  aiLoaderMeta,
+  aiSuggestionsMeta,
+  aiBranchMeta,
+  aiArtifactMeta,
+  shaderTransitionMeta,
+  magneticSelectMeta,
+  aspectMorphMeta,
+  createMenuMeta,
+  radialMenuMeta,
+  canvasToolbarMeta,
+  gooTabsMeta,
+  assigneePickerMeta,
+  selectionListMeta,
+  browserTabsMeta,
+  actionNodeMeta,
+  gooBallMeta,
+  glassBubbleMeta,
+  dragStepperMeta,
+  sloshSliderMeta,
+  reorderListMeta,
+  magnifyDockMeta,
+  rangeDialMeta,
+  foldingFrameMeta,
+  slideToConfirmMeta,
+  pullToRefreshMeta,
+  todoTowerMeta,
+  paletteGeneratorMeta,
+  inlineConfirmMeta,
+  liquidToggleMeta,
+  animatedChecklistMeta,
+  nowPlayingMeta,
+  notifyButtonMeta,
+  tickProgressMeta,
+  escapeButtonMeta,
+  expandingSearchMeta,
+  dialMeta,
+  commandBarMeta,
 ];
 
 // This file is the `@dowel-ui/react/registry` entry point, so the block barrel is

package/src/registry/schema.ts

@@ -17,6 +17,7 @@ export const COMPONENT_CATEGORIES = [
   "feedback",
   "data",
   "ai",
+  "effects",
 ] as const;
 
 export type ComponentCategory = (typeof COMPONENT_CATEGORIES)[number];
@@ -50,6 +51,14 @@ export interface ComponentMeta {
   files: string[];
   /** Accessibility notes surfaced on the docs page. */
   a11y?: string;
+  /**
+   * Whether the source is public.
+   *
+   * Omitted means `free`, and free is a promise: an item that has shipped
+   * installable without a licence stays that way. Marking an existing component
+   * `pro` breaks every project that already installs it.
+   */
+  access?: "free" | "pro";
 }
 
 /** Identity helper that gives editors autocomplete inside `meta.ts`. */

package/src/blocks/admin-users/admin-users.tsx

@@ -1,251 +0,0 @@
-"use client";
-
-import {
-  columnVisibilityFeature,
-  createPaginatedRowModel,
-  createSortedRowModel,
-  rowPaginationFeature,
-  rowSortingFeature,
-  tableFeatures,
-  useTable,
-} from "@tanstack/react-table";
-import { useMemo, useState } from "react";
-
-import { Avatar, AvatarFallback } from "@/components/avatar";
-import { Badge } from "@/components/badge";
-import { Button } from "@/components/button";
-import {
-  DataTable,
-  DataTableColumnHeader,
-  DataTablePagination,
-  DataTableViewOptions,
-} from "@/components/data-table";
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuLabel,
-  DropdownMenuSeparator,
-  DropdownMenuTrigger,
-} from "@/components/dropdown-menu";
-import { EmptyState, EmptyStateDescription, EmptyStateTitle } from "@/components/empty-state";
-import { Input } from "@/components/input";
-import { Label } from "@/components/label";
-import { cn } from "@/lib/utils";
-
-/**
- * A user administration table.
- *
- * The filter is the part worth reading. Results change as you type, which for
- * a screen reader user is a change they never asked for and cannot see — so the
- * row count is announced politely, and the search input is a labelled control
- * rather than a placeholder-only box.
- */
-
-export interface AdminUser {
-  id: string;
-  name: string;
-  email: string;
-  role: "Owner" | "Admin" | "Member" | "Viewer";
-  status: "Active" | "Invited" | "Suspended";
-  lastActive: string;
-}
-
-export interface AdminUsersBlockProps {
-  users: AdminUser[];
-  onInvite?: () => void;
-  onEdit?: (user: AdminUser) => void;
-  onRemove?: (user: AdminUser) => void;
-  className?: string;
-}
-
-const features = tableFeatures({
-  rowSortingFeature,
-  rowPaginationFeature,
-  columnVisibilityFeature,
-  sortedRowModel: createSortedRowModel(),
-  paginatedRowModel: createPaginatedRowModel(),
-});
-
-function initials(name: string): string {
-  return name
-    .split(" ")
-    .map((part) => part[0] ?? "")
-    .slice(0, 2)
-    .join("")
-    .toUpperCase();
-}
-
-export function AdminUsersBlock({
-  users,
-  onInvite,
-  onEdit,
-  onRemove,
-  className,
-}: AdminUsersBlockProps) {
-  const [query, setQuery] = useState("");
-
-  // Filtered here rather than through the table's filtering feature, so the
-  // block stays usable without wiring that feature up.
-  const filtered = useMemo(() => {
-    const needle = query.trim().toLowerCase();
-    if (!needle) return users;
-    return users.filter(
-      (user) =>
-        user.name.toLowerCase().includes(needle) || user.email.toLowerCase().includes(needle),
-    );
-  }, [users, query]);
-
-  const table = useTable({
-    features,
-    data: filtered,
-    initialState: { pagination: { pageIndex: 0, pageSize: 10 } },
-    columns: [
-      {
-        accessorKey: "name",
-        header: ({ column }) => <DataTableColumnHeader column={column} title="User" />,
-        cell: ({ row }) => (
-          <div className="flex items-center gap-3">
-            <Avatar size="sm">
-              <AvatarFallback>{initials(row.original.name)}</AvatarFallback>
-            </Avatar>
-            <div className="min-w-0">
-              <p className="truncate text-sm font-medium">{row.original.name}</p>
-              <p className="truncate text-xs text-muted-foreground">{row.original.email}</p>
-            </div>
-          </div>
-        ),
-      },
-      {
-        accessorKey: "role",
-        header: ({ column }) => <DataTableColumnHeader column={column} title="Role" />,
-      },
-      {
-        accessorKey: "status",
-        header: ({ column }) => <DataTableColumnHeader column={column} title="Status" />,
-        cell: ({ row }) => (
-          <Badge
-            size="sm"
-            variant={
-              row.original.status === "Active"
-                ? "success"
-                : row.original.status === "Suspended"
-                  ? "destructive"
-                  : "secondary"
-            }
-          >
-            {row.original.status}
-          </Badge>
-        ),
-      },
-      {
-        accessorKey: "lastActive",
-        header: ({ column }) => <DataTableColumnHeader column={column} title="Last active" />,
-        cell: ({ row }) => (
-          <span className="text-sm text-muted-foreground">{row.original.lastActive}</span>
-        ),
-      },
-      {
-        id: "actions",
-        // Not an empty header: a th with no text is a column a screen reader
-        // cannot name. Hidden visually, present in the table semantics.
-        header: () => <span className="sr-only">Actions</span>,
-        enableSorting: false,
-        cell: ({ row }) => (
-          <DropdownMenu>
-            <DropdownMenuTrigger asChild>
-              <Button
-                variant="ghost"
-                size="icon-sm"
-                // Named per row: four identical "Actions" buttons tell a screen
-                // reader user nothing about which row they are on.
-                aria-label={`Actions for ${row.original.name}`}
-              >
-                <svg viewBox="0 0 24 24" fill="none" aria-hidden="true">
-                  <circle cx="12" cy="5" r="1.5" fill="currentColor" />
-                  <circle cx="12" cy="12" r="1.5" fill="currentColor" />
-                  <circle cx="12" cy="19" r="1.5" fill="currentColor" />
-                </svg>
-              </Button>
-            </DropdownMenuTrigger>
-            <DropdownMenuContent align="end">
-              <DropdownMenuLabel>{row.original.name}</DropdownMenuLabel>
-              <DropdownMenuSeparator />
-              <DropdownMenuItem
-                onSelect={() => {
-                  onEdit?.(row.original);
-                }}
-              >
-                Edit member
-              </DropdownMenuItem>
-              <DropdownMenuItem
-                variant="destructive"
-                onSelect={() => {
-                  onRemove?.(row.original);
-                }}
-              >
-                Remove from team
-              </DropdownMenuItem>
-            </DropdownMenuContent>
-          </DropdownMenu>
-        ),
-      },
-    ],
-  });
-
-  return (
-    <div className={cn("flex flex-col gap-4", className)}>
-      <div className="flex flex-wrap items-end justify-between gap-3">
-        <div>
-          <h1 className="text-xl font-semibold tracking-tight">Team members</h1>
-          <p className="mt-1 text-sm text-muted-foreground">
-            {users.length} {users.length === 1 ? "person" : "people"} in this workspace.
-          </p>
-        </div>
-        <Button onClick={onInvite}>Invite people</Button>
-      </div>
-
-      <div className="flex flex-wrap items-center gap-2">
-        <div className="grid flex-1 gap-1.5 sm:max-w-xs">
-          {/* A real label, not a placeholder: placeholders vanish as soon as
-              anyone types, taking the field's name with them. */}
-          <Label htmlFor="user-filter" className="sr-only">
-            Filter by name or email
-          </Label>
-          <Input
-            id="user-filter"
-            inputSize="sm"
-            type="search"
-            placeholder="Filter by name or email…"
-            value={query}
-            onChange={(event) => {
-              setQuery(event.target.value);
-            }}
-          />
-        </div>
-        <DataTableViewOptions table={table} />
-      </div>
-
-      {/* Filtering changes the results without the user asking, so the count is
-          announced. Polite, so it waits for a pause in typing. */}
-      <p aria-live="polite" className="sr-only">
-        {filtered.length} {filtered.length === 1 ? "person" : "people"} match the filter.
-      </p>
-
-      <DataTable
-        table={table}
-        aria-label="Team members"
-        empty={
-          <EmptyState size="sm">
-            <EmptyStateTitle>No one matches “{query}”</EmptyStateTitle>
-            <EmptyStateDescription>
-              Try a different name or email address.
-            </EmptyStateDescription>
-          </EmptyState>
-        }
-      />
-
-      <DataTablePagination table={table} pageSizes={[10, 25, 50]} />
-    </div>
-  );
-}