{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "dashboard-widget",
  "title": "Dashboard widget",
  "description": "Card-based dashboard widget with header, optional description, filters, and content area. Supports gray/white background types.",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "https://blok.sitecore.com/r/theme.json",
    "https://blok.sitecore.com/r/button.json",
    "https://blok.sitecore.com/r/card.json",
    "https://blok.sitecore.com/r/filter.json"
  ],
  "files": [
    {
      "path": "src/components/bloks/dashboard-widget.tsx",
      "content": "import { Card } from \"@/components/ui/card\";\nimport { cn } from \"@/lib/utils\";\nimport type * as React from \"react\";\n\nexport type DashboardWidgetType = \"gray-bg-large\" | \"white-bg-large\";\n\nfunction DashboardWidget({\n  type = \"white-bg-large\",\n  className,\n  children,\n}: {\n  type?: DashboardWidgetType;\n  className?: string;\n  children?: React.ReactNode;\n}) {\n  const isGrayBg = type === \"gray-bg-large\";\n\n  return (\n    <Card\n      style={isGrayBg ? \"filled\" : \"flat\"}\n      padding=\"md\"\n      data-slot=\"dashboard-widget\"\n      className={cn(\n        \"overflow-hidden w-full min-w-[420px]\",\n        isGrayBg && \"bg-neutral-50\",\n        className,\n      )}\n    >\n      <div className=\"flex flex-col flex-1\">{children}</div>\n    </Card>\n  );\n}\n\nfunction DashboardWidgetHeader({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"dashboard-widget-header\"\n      className={cn(\n        \"grid auto-rows-min items-center gap-x-4 has-data-[slot=dashboard-widget-action]:grid-cols-[1fr_auto] has-data-[slot=dashboard-widget-description]:items-start has-data-[slot=dashboard-widget-description]:gap-y-1.5\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction DashboardWidgetTitle({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"dashboard-widget-title\"\n      className={cn(\n        \"flex items-center gap-2 font-semibold text-base leading-none min-w-0\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction DashboardWidgetDescription({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"dashboard-widget-description\"\n      className={cn(\"text-sm text-subtle-text col-start-1\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction DashboardWidgetAction({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"dashboard-widget-action\"\n      className={cn(\"col-start-2 row-start-1\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction DashboardWidgetToolbar({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"dashboard-widget-toolbar\"\n      className={cn(\"flex justify-end mt-4\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction DashboardWidgetContent({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"dashboard-widget-content\"\n      className={cn(\n        \"mt-4 min-h-[120px] flex-1 flex items-center justify-center rounded-lg bg-subtle-bg overflow-hidden\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport {\n  DashboardWidget,\n  DashboardWidgetHeader,\n  DashboardWidgetTitle,\n  DashboardWidgetDescription,\n  DashboardWidgetAction,\n  DashboardWidgetToolbar,\n  DashboardWidgetContent,\n};\n",
      "type": "registry:ui",
      "target": "src/components/bloks/dashboard-widget.tsx"
    }
  ],
  "type": "registry:block"
}