{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "total-earnigs-chart",
  "type": "registry:component",
  "description": "A Chart component with optional code display for UI blocks.",
  "registryDependencies": [
    "card"
  ],
  "files": [
    {
      "path": "src/app/components/ui-blocks/charts/code/TotalEarnigsCode.tsx",
      "content": "\"use client\";\r\nimport React from \"react\";\r\nimport { Card } from '@/components/ui/card'\r\nimport dynamic from \"next/dynamic\";\r\nconst Chart = dynamic(() => import(\"react-apexcharts\"), { ssr: false });\r\n\r\nconst TotalEarning = () => {\r\n  const ChartData: any = {\r\n    series: [\r\n      {\r\n        name: \"projects\",\r\n        data: [4, 10, 9, 7, 9, 10, 11, 8, 10, 12, 9],\r\n      },\r\n    ],\r\n    chart: {\r\n      type: \"bar\",\r\n      height: 55,\r\n      fontFamily: `inherit`,\r\n      sparkline: {\r\n        enabled: true,\r\n      },\r\n    },\r\n    colors: [\"var(--color-secondary)\"],\r\n\r\n    plotOptions: {\r\n      bar: {\r\n        borderRadius: 4,\r\n        columnWidth: \"60%\",\r\n        distributed: true,\r\n        endingShape: \"rounded\",\r\n      },\r\n    },\r\n    dataLabels: {\r\n      enabled: false,\r\n    },\r\n    stroke: {\r\n      show: true,\r\n      width: 2.5,\r\n      colors: [\"rgba(0,0,0,0.01)\"],\r\n    },\r\n    xaxis: {\r\n      axisBorder: {\r\n        show: false,\r\n      },\r\n      axisTicks: {\r\n        show: false,\r\n      },\r\n      labels: {\r\n        show: false,\r\n      },\r\n    },\r\n    yaxis: {\r\n      labels: {\r\n        show: false,\r\n      },\r\n    },\r\n    axisBorder: {\r\n      show: false,\r\n    },\r\n    fill: {\r\n      opacity: 1,\r\n    },\r\n    tooltip: {\r\n      theme: \"dark\",\r\n      x: {\r\n        show: false,\r\n      },\r\n    },\r\n  };\r\n  return (\r\n    <>\r\n      <Card className=\"overflow-hidden\">\r\n        <div className=\"flex justify-between items-end\">\r\n          <div>\r\n            <p className=\"text-sm\">Total Earning</p>\r\n            <h5 className=\"text-lg font-semibold text-dark dark:text-white\">$78,298</h5>\r\n          </div>\r\n        </div>\r\n\r\n        <Chart\r\n          options={ChartData}\r\n          series={ChartData.series}\r\n          type=\"bar\"\r\n          height='55px'\r\n          width='100%'\r\n          className=\"mt-8\"\r\n        />\r\n      </Card>\r\n    </>\r\n  );\r\n};\r\n\r\nexport default TotalEarning;\r\n",
      "type": "registry:component",
      "target": "components/tailwind-admin/charts/total-earnigs-chart/TotalEarnigsCode.tsx"
    }
  ]
}