import { jsxs as n, Fragment as o, jsx as e } from "react/jsx-runtime";
import { T as r, C as a, a as t, n as l, c as d, P as m, A as h } from "../index-sdOMz8GW.js";
import "lucide-react";
import "react-router-dom";
import "react";
import "react-dom";
const s = [
  { name: "Chrome", value: 62 },
  { name: "Safari", value: 19 },
  { name: "Firefox", value: 10 },
  { name: "Edge", value: 6 },
  { name: "Other", value: 3 }
], v = () => /* @__PURE__ */ n(o, { children: [
  /* @__PURE__ */ n("div", { className: "text-center space-y-4", children: [
    /* @__PURE__ */ e(r, { tag: "h2", className: "text-base md:text-base font-semibold", children: "PieChart" }),
    /* @__PURE__ */ e(
      r,
      {
        tag: "p",
        className: "text-sm text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",
        children: "Pie and donut chart component for displaying proportions and distributions with labels and inner content support."
      }
    )
  ] }),
  /* @__PURE__ */ e(a, { className: "overflow-hidden", children: /* @__PURE__ */ e(t, { title: "Basic Pie Chart", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(l, { data: s, height: 300 }) }) }) }),
  /* @__PURE__ */ e(a, { className: "overflow-hidden", children: /* @__PURE__ */ e(t, { title: "Donut Chart", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(l, { data: s, donut: !0, height: 300 }) }) }) }),
  /* @__PURE__ */ e(a, { className: "overflow-hidden", children: /* @__PURE__ */ e(t, { title: "Donut with Inner Content", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
    l,
    {
      data: s,
      donut: !0,
      height: 300,
      innerContent: /* @__PURE__ */ n("div", { className: "text-center", children: [
        /* @__PURE__ */ e("p", { className: "text-2xl font-bold", children: "100%" }),
        /* @__PURE__ */ e("p", { className: "text-sm text-gray-500", children: "Total" })
      ] })
    }
  ) }) }) }),
  /* @__PURE__ */ e(a, { className: "overflow-hidden", children: /* @__PURE__ */ e(t, { title: "Without Labels", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(l, { data: s, showLabels: !1, height: 300 }) }) }) }),
  /* @__PURE__ */ e(a, { className: "overflow-hidden", children: /* @__PURE__ */ e(t, { title: "Usage", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
    d,
    {
      code: `import { PieChart } from '@e-burgos/tucu-ui';

const data = [
  { name: 'Chrome', value: 62 },
  { name: 'Safari', value: 19 },
  { name: 'Firefox', value: 10 },
  { name: 'Edge', value: 6 },
  { name: 'Other', value: 3 },
];

<PieChart
  data={data}
  height={300}
  donut
  showLabels
  showTooltip
  showLegend
  innerContent={<p>Center</p>}
/>`,
      language: "tsx"
    }
  ) }) }) }),
  /* @__PURE__ */ e(
    m,
    {
      componentName: "PieChart",
      defaultValues: {
        height: 300,
        donut: !1,
        showLabels: !0,
        showTooltip: !0,
        showLegend: !0,
        animate: !0
      },
      excludeProps: [
        "data",
        "colors",
        "className",
        "innerContent",
        "emptyMessage"
      ],
      children: (i) => /* @__PURE__ */ e(l, { data: s, ...i })
    }
  ),
  /* @__PURE__ */ e(h, { componentName: "PieChart" })
] });
export {
  v as default
};
