import { jsxs as e, Fragment as c, jsx as a } from "react/jsx-runtime";
import { H as s, C as i, a as m, T as n, d as l, P as t, A as d, c as h } from "../index-sdOMz8GW.js";
import { Info as p } from "lucide-react";
import "react-router-dom";
import "react";
import "react-dom";
import { b as o, e as g } from "../tether-DaYvmdAU.js";
const B = () => /* @__PURE__ */ e(c, { children: [
  /* @__PURE__ */ a(
    s,
    {
      title: "CoinInfoCard",
      description: "Compact card component for displaying coin information with icon, name, and balance. Supports multiple size variants.",
      icon: /* @__PURE__ */ a("div", { className: "w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-blue-500 via-cyan-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg border border-blue-500/50", children: /* @__PURE__ */ a(p, { className: "w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg" }) })
    }
  ),
  /* @__PURE__ */ a(i, { className: "overflow-hidden", children: /* @__PURE__ */ a(m, { title: "Basic Examples", className: "mt-2 mb-2", children: /* @__PURE__ */ a("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
    /* @__PURE__ */ e(i, { className: "p-4", children: [
      /* @__PURE__ */ a(n, { tag: "h5", className: "mb-3", children: "Basic Coin Info" }),
      /* @__PURE__ */ a(
        l,
        {
          item: {
            id: "bitcoin",
            name: "Bitcoin",
            logo: o,
            balance: "1.25 BTC"
          }
        }
      )
    ] }),
    /* @__PURE__ */ e(i, { className: "p-4", children: [
      /* @__PURE__ */ a(n, { tag: "h5", className: "mb-3", children: "With Coin Type" }),
      /* @__PURE__ */ a(
        l,
        {
          item: {
            id: "ethereum",
            name: "Ethereum",
            logo: g,
            balance: "5.5 ETH",
            coinType: "ERC-20"
          }
        }
      )
    ] })
  ] }) }) }) }),
  /* @__PURE__ */ a(i, { className: "overflow-hidden", children: /* @__PURE__ */ a(m, { title: "Variants", className: "mt-2 mb-2", children: /* @__PURE__ */ a("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [
    /* @__PURE__ */ e(i, { className: "p-4", children: [
      /* @__PURE__ */ a(n, { tag: "h5", className: "mb-3", children: "Small (default)" }),
      /* @__PURE__ */ a(
        l,
        {
          item: {
            id: "bitcoin",
            name: "Bitcoin",
            logo: o,
            balance: "1.25 BTC"
          },
          variant: "small"
        }
      )
    ] }),
    /* @__PURE__ */ e(i, { className: "p-4", children: [
      /* @__PURE__ */ a(n, { tag: "h5", className: "mb-3", children: "Medium" }),
      /* @__PURE__ */ a(
        l,
        {
          item: {
            id: "bitcoin",
            name: "Bitcoin",
            logo: o,
            balance: "1.25 BTC"
          },
          variant: "medium"
        }
      )
    ] }),
    /* @__PURE__ */ e(i, { className: "p-4", children: [
      /* @__PURE__ */ a(n, { tag: "h5", className: "mb-3", children: "Large" }),
      /* @__PURE__ */ a(
        l,
        {
          item: {
            id: "bitcoin",
            name: "Bitcoin",
            logo: o,
            balance: "1.25 BTC"
          },
          variant: "large"
        }
      )
    ] })
  ] }) }) }) }),
  /* @__PURE__ */ a(
    t,
    {
      componentName: "CoinInfoCard",
      defaultValues: {
        variant: "small"
      },
      controlOverrides: [
        {
          name: "variant",
          type: "select",
          options: ["small", "medium", "large"],
          description: "Size variant of the card"
        }
      ],
      includeProps: ["variant"],
      children: (r) => /* @__PURE__ */ a("div", { className: "w-full max-w-sm", children: /* @__PURE__ */ a(
        l,
        {
          ...r,
          item: {
            id: "bitcoin",
            name: "Bitcoin",
            logo: o,
            balance: "1.25 BTC",
            coinType: "ERC-20"
          }
        }
      ) })
    }
  ),
  /* @__PURE__ */ a(d, { componentName: "CoinInfoCard" }),
  /* @__PURE__ */ a(i, { className: "overflow-hidden", children: /* @__PURE__ */ a(m, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ a("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ a(
    h,
    {
      language: "tsx",
      code: `import { CoinInfoCard } from '@e-burgos/tucu-ui';

<CoinInfoCard
  item={{
    id: 'bitcoin',
    name: 'Bitcoin',
    logo: '/icons/bitcoin.svg',
    balance: '1.25 BTC',
    coinType: 'ERC-20', // Optional
  }}
  variant="small" // 'small' | 'medium' | 'large'
/>`
    }
  ) }) }) })
] });
export {
  B as default
};
