"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-DEZRGktf.js"),o=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const l=()=>e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"TopupButton",description:`A specialized button component for top-up or recharge actions, with
          support for icons and links.`,icon:e.jsx("div",{className:"w-16 h-16 sm:w-20 sm:h-20 md:w-24 md:h-24 bg-linear-to-br from-indigo-500 to-blue-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(o.ArrowUpCircle,{className:"w-8 h-8 sm:w-10 sm:h-10 md:w-12 md:h-12 text-white filter drop-shadow-lg"})})}),e.jsx(s.CardContainer,{className:"overflow-hidden",children:e.jsx(s.CardTitle,{title:"Basic Examples",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4",children:[e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"Basic Topup Button"}),e.jsx(s.TopupButton,{label:"Add Funds"})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"With Icon"}),e.jsx(s.TopupButton,{label:"Top Up Account",icon:e.jsx(o.Plus,{className:"w-4 h-4"})})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"With Link"}),e.jsx(s.TopupButton,{label:"Recharge Now",href:"/topup",icon:e.jsx(o.CreditCard,{className:"w-4 h-4"})})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"With onClick Handler"}),e.jsx(s.TopupButton,{label:"Add Balance",icon:e.jsx(o.Wallet,{className:"w-4 h-4"}),onClick:()=>console.log("Topup clicked")})]})]})})})}),e.jsx(s.PropPlayground,{componentName:"TopupButton",defaultValues:{label:"Top Up"},excludeProps:["onClick","icon"],children:a=>e.jsx(s.TopupButton,{...a})}),e.jsx(s.AutoPropsTable,{componentName:"TopupButton"}),e.jsx(s.CardContainer,{className:"overflow-hidden",children:e.jsx(s.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(s.CodeBlock,{language:"tsx",code:`import { TopupButton, LucideIcons } from '@e-burgos/tucu-ui';

// Basic usage
<TopupButton label="Add Funds" />

// With icon
<TopupButton
  label="Top Up Account"
  icon={<LucideIcons.Plus className="w-4 h-4" />}
/>

// With link
<TopupButton
  label="Recharge Now"
  href="/topup"
  icon={<LucideIcons.CreditCard className="w-4 h-4" />}
/>

// With onClick handler
<TopupButton
  label="Add Balance"
  icon={<LucideIcons.Wallet className="w-4 h-4" />}
  onClick={() => handleTopup()}
/>`})})})})]});exports.default=l;
