@e-burgos/tucu-ui 1.1.1 → 2.0.0

package/RadioGroupSection-BIMkY1F0.js

@@ -0,0 +1,27 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),d=require("react"),a=require("./index-CjRk4ezu.js");require("lucide-react");require("react-router-dom");require("react-dom");const p=()=>{const[o,t]=d.useState(""),i=[{value:"male",label:"Male"},{value:"female",label:"Female"},{value:"other",label:"Other"}],s=[{key:"prop",label:"Prop",render:l=>e.jsx("code",{className:"text-xs text-brand",children:String(l)})},{key:"type",label:"Type",render:l=>e.jsx("code",{className:"text-xs",children:String(l)})},{key:"default",label:"Default",render:l=>{const r=String(l);return r==="required"?e.jsx("span",{className:"text-xs text-red-500",children:"required"}):e.jsx("code",{className:"text-xs",children:r})}},{key:"description",label:"Description"}],n=[{prop:"options",type:"{ value: string | number, label: string }[]",default:"required",description:"Array of radio options"},{prop:"value",type:"string | number",default:"-",description:"Currently selected value"},{prop:"onChange",type:"(value: string | number) => void",default:"-",description:"Callback when selection changes"},{prop:"variant",type:"'ghost' | 'solid' | 'transparent'",default:"'ghost'",description:"Visual variant of the radio buttons"},{prop:"size",type:"'sm' | 'md' | 'lg' | 'xl'",default:"'md'",description:"Size of the radio buttons"},{prop:"color",type:"'primary' | 'secondary' | 'danger' | 'info' | 'success' | 'warning'",default:"'primary'",description:"Color theme of the radio buttons"},{prop:"direction",type:"'horizontal' | 'vertical'",default:"'vertical'",description:"Layout direction of radio buttons"},{prop:"label",type:"React.ReactNode",default:"-",description:"Group label text"},{prop:"disabled",type:"boolean",default:"false",description:"Disables all radio buttons in the group"},{prop:"error",type:"string",default:"-",description:"Error message to display"},{prop:"helperText",type:"React.ReactNode",default:"-",description:"Helper text displayed below the group"}];return e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"text-center space-y-4",children:[e.jsx(a.Typography,{tag:"h2",className:"text-3xl md:text-4xl font-bold",children:"RadioGroup"}),e.jsx(a.Typography,{tag:"p",className:"text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"A group of radio buttons for selecting one option from multiple choices."})]}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"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(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Basic RadioGroup"}),e.jsx(a.RadioGroup,{label:"Gender",options:i,value:o,onChange:l=>t(l)})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Helper Text"}),e.jsx(a.RadioGroup,{label:"Size",helperText:"Select your preferred size",options:[{value:"small",label:"Small"},{value:"medium",label:"Medium"},{value:"large",label:"Large"}]})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Error"}),e.jsx(a.RadioGroup,{label:"Priority",error:"Please select a priority",options:[{value:"low",label:"Low"},{value:"high",label:"High"}]})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Disabled"}),e.jsx(a.RadioGroup,{label:"Status",disabled:!0,options:[{value:"active",label:"Active"},{value:"inactive",label:"Inactive"}]})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Horizontal Layout"}),e.jsx(a.RadioGroup,{label:"Direction",direction:"horizontal",options:[{value:"vertical",label:"Vertical"},{value:"horizontal",label:"Horizontal"}]})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Different Colors"}),e.jsx(a.RadioGroup,{label:"Color",color:"danger",options:[{value:"red",label:"Red"},{value:"blue",label:"Blue"}]})]})]})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Variants",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-3 gap-4",children:[e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Ghost (default)"}),e.jsx(a.RadioGroup,{label:"Ghost Variant",variant:"ghost",options:[{value:"opt1",label:"Option 1"},{value:"opt2",label:"Option 2"}]})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Solid"}),e.jsx(a.RadioGroup,{label:"Solid Variant",variant:"solid",options:[{value:"opt1",label:"Option 1"},{value:"opt2",label:"Option 2"}]})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Transparent"}),e.jsx(a.RadioGroup,{label:"Transparent Variant",variant:"transparent",options:[{value:"opt1",label:"Option 1"},{value:"opt2",label:"Option 2"}]})]})]})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Props",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.BasicTable,{columns:s,data:n})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.CodeBlock,{language:"typescript",code:`import { RadioGroup } from '@e-burgos/tucu-ui';
+
+const options = [
+  { value: 'male', label: 'Male' },
+  { value: 'female', label: 'Female' },
+  { value: 'other', label: 'Other' },
+];
+
+<RadioGroup
+  label="Gender"
+  options={options}
+  value={value}
+  onChange={(value) => setValue(value)}
+/>
+
+// Variants
+<RadioGroup label="Ghost" variant="ghost" options={options} />
+<RadioGroup label="Solid" variant="solid" options={options} />
+<RadioGroup label="Transparent" variant="transparent" options={options} />
+
+// Colors
+<RadioGroup label="Primary" color="primary" options={options} />
+<RadioGroup label="Danger" color="danger" options={options} />
+
+// Layout
+<RadioGroup label="Horizontal" direction="horizontal" options={options} />
+<RadioGroup label="Vertical" direction="vertical" options={options} />`})})})})]})};exports.default=p;

package/RadioGroupSection-CLbIvqN6.mjs

@@ -0,0 +1,288 @@
+import { jsxs as a, Fragment as d, jsx as e } from "react/jsx-runtime";
+import { useState as c } from "react";
+import { T as o, C as l, a as i, o as t, B as u, c as m } from "./index-Hq6IUBmn.mjs";
+import "lucide-react";
+import "react-router-dom";
+import "react-dom";
+const R = () => {
+  const [n, p] = c("");
+  return /* @__PURE__ */ a(d, { children: [
+    /* @__PURE__ */ a("div", { className: "text-center space-y-4", children: [
+      /* @__PURE__ */ e(o, { tag: "h2", className: "text-3xl md:text-4xl font-bold", children: "RadioGroup" }),
+      /* @__PURE__ */ e(
+        o,
+        {
+          tag: "p",
+          className: "text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",
+          children: "A group of radio buttons for selecting one option from multiple choices."
+        }
+      )
+    ] }),
+    /* @__PURE__ */ e(l, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Examples", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ a("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
+      /* @__PURE__ */ a(l, { className: "p-4", children: [
+        /* @__PURE__ */ e(o, { tag: "h5", className: "mb-3", children: "Basic RadioGroup" }),
+        /* @__PURE__ */ e(
+          t,
+          {
+            label: "Gender",
+            options: [
+              { value: "male", label: "Male" },
+              { value: "female", label: "Female" },
+              { value: "other", label: "Other" }
+            ],
+            value: n,
+            onChange: (r) => p(r)
+          }
+        )
+      ] }),
+      /* @__PURE__ */ a(l, { className: "p-4", children: [
+        /* @__PURE__ */ e(o, { tag: "h5", className: "mb-3", children: "With Helper Text" }),
+        /* @__PURE__ */ e(
+          t,
+          {
+            label: "Size",
+            helperText: "Select your preferred size",
+            options: [
+              { value: "small", label: "Small" },
+              { value: "medium", label: "Medium" },
+              { value: "large", label: "Large" }
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ a(l, { className: "p-4", children: [
+        /* @__PURE__ */ e(o, { tag: "h5", className: "mb-3", children: "With Error" }),
+        /* @__PURE__ */ e(
+          t,
+          {
+            label: "Priority",
+            error: "Please select a priority",
+            options: [
+              { value: "low", label: "Low" },
+              { value: "high", label: "High" }
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ a(l, { className: "p-4", children: [
+        /* @__PURE__ */ e(o, { tag: "h5", className: "mb-3", children: "Disabled" }),
+        /* @__PURE__ */ e(
+          t,
+          {
+            label: "Status",
+            disabled: !0,
+            options: [
+              { value: "active", label: "Active" },
+              { value: "inactive", label: "Inactive" }
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ a(l, { className: "p-4", children: [
+        /* @__PURE__ */ e(o, { tag: "h5", className: "mb-3", children: "Horizontal Layout" }),
+        /* @__PURE__ */ e(
+          t,
+          {
+            label: "Direction",
+            direction: "horizontal",
+            options: [
+              { value: "vertical", label: "Vertical" },
+              { value: "horizontal", label: "Horizontal" }
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ a(l, { className: "p-4", children: [
+        /* @__PURE__ */ e(o, { tag: "h5", className: "mb-3", children: "Different Colors" }),
+        /* @__PURE__ */ e(
+          t,
+          {
+            label: "Color",
+            color: "danger",
+            options: [
+              { value: "red", label: "Red" },
+              { value: "blue", label: "Blue" }
+            ]
+          }
+        )
+      ] })
+    ] }) }) }) }),
+    /* @__PURE__ */ e(l, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Variants", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ a("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [
+      /* @__PURE__ */ a(l, { className: "p-4", children: [
+        /* @__PURE__ */ e(o, { tag: "h5", className: "mb-3", children: "Ghost (default)" }),
+        /* @__PURE__ */ e(
+          t,
+          {
+            label: "Ghost Variant",
+            variant: "ghost",
+            options: [
+              { value: "opt1", label: "Option 1" },
+              { value: "opt2", label: "Option 2" }
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ a(l, { className: "p-4", children: [
+        /* @__PURE__ */ e(o, { tag: "h5", className: "mb-3", children: "Solid" }),
+        /* @__PURE__ */ e(
+          t,
+          {
+            label: "Solid Variant",
+            variant: "solid",
+            options: [
+              { value: "opt1", label: "Option 1" },
+              { value: "opt2", label: "Option 2" }
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ a(l, { className: "p-4", children: [
+        /* @__PURE__ */ e(o, { tag: "h5", className: "mb-3", children: "Transparent" }),
+        /* @__PURE__ */ e(
+          t,
+          {
+            label: "Transparent Variant",
+            variant: "transparent",
+            options: [
+              { value: "opt1", label: "Option 1" },
+              { value: "opt2", label: "Option 2" }
+            ]
+          }
+        )
+      ] })
+    ] }) }) }) }),
+    /* @__PURE__ */ e(l, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Props", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
+      u,
+      {
+        columns: [
+          {
+            key: "prop",
+            label: "Prop",
+            render: (r) => /* @__PURE__ */ e("code", { className: "text-xs text-brand", children: String(r) })
+          },
+          {
+            key: "type",
+            label: "Type",
+            render: (r) => /* @__PURE__ */ e("code", { className: "text-xs", children: String(r) })
+          },
+          {
+            key: "default",
+            label: "Default",
+            render: (r) => {
+              const s = String(r);
+              return s === "required" ? /* @__PURE__ */ e("span", { className: "text-xs text-red-500", children: "required" }) : /* @__PURE__ */ e("code", { className: "text-xs", children: s });
+            }
+          },
+          {
+            key: "description",
+            label: "Description"
+          }
+        ],
+        data: [
+          {
+            prop: "options",
+            type: "{ value: string | number, label: string }[]",
+            default: "required",
+            description: "Array of radio options"
+          },
+          {
+            prop: "value",
+            type: "string | number",
+            default: "-",
+            description: "Currently selected value"
+          },
+          {
+            prop: "onChange",
+            type: "(value: string | number) => void",
+            default: "-",
+            description: "Callback when selection changes"
+          },
+          {
+            prop: "variant",
+            type: "'ghost' | 'solid' | 'transparent'",
+            default: "'ghost'",
+            description: "Visual variant of the radio buttons"
+          },
+          {
+            prop: "size",
+            type: "'sm' | 'md' | 'lg' | 'xl'",
+            default: "'md'",
+            description: "Size of the radio buttons"
+          },
+          {
+            prop: "color",
+            type: "'primary' | 'secondary' | 'danger' | 'info' | 'success' | 'warning'",
+            default: "'primary'",
+            description: "Color theme of the radio buttons"
+          },
+          {
+            prop: "direction",
+            type: "'horizontal' | 'vertical'",
+            default: "'vertical'",
+            description: "Layout direction of radio buttons"
+          },
+          {
+            prop: "label",
+            type: "React.ReactNode",
+            default: "-",
+            description: "Group label text"
+          },
+          {
+            prop: "disabled",
+            type: "boolean",
+            default: "false",
+            description: "Disables all radio buttons in the group"
+          },
+          {
+            prop: "error",
+            type: "string",
+            default: "-",
+            description: "Error message to display"
+          },
+          {
+            prop: "helperText",
+            type: "React.ReactNode",
+            default: "-",
+            description: "Helper text displayed below the group"
+          }
+        ]
+      }
+    ) }) }) }),
+    /* @__PURE__ */ e(l, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
+      m,
+      {
+        language: "typescript",
+        code: `import { RadioGroup } from '@e-burgos/tucu-ui';
+
+const options = [
+  { value: 'male', label: 'Male' },
+  { value: 'female', label: 'Female' },
+  { value: 'other', label: 'Other' },
+];
+
+<RadioGroup
+  label="Gender"
+  options={options}
+  value={value}
+  onChange={(value) => setValue(value)}
+/>
+
+// Variants
+<RadioGroup label="Ghost" variant="ghost" options={options} />
+<RadioGroup label="Solid" variant="solid" options={options} />
+<RadioGroup label="Transparent" variant="transparent" options={options} />
+
+// Colors
+<RadioGroup label="Primary" color="primary" options={options} />
+<RadioGroup label="Danger" color="danger" options={options} />
+
+// Layout
+<RadioGroup label="Horizontal" direction="horizontal" options={options} />
+<RadioGroup label="Vertical" direction="vertical" options={options} />`
+      }
+    ) }) }) })
+  ] });
+};
+export {
+  R as default
+};

package/RadioSection-DZD5W976.js

@@ -0,0 +1,23 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),d=require("react"),a=require("./index-CjRk4ezu.js");require("lucide-react");require("react-router-dom");require("react-dom");const n=()=>{const[l,r]=d.useState(""),t=[{key:"prop",label:"Prop",render:s=>e.jsx("code",{className:"text-xs text-brand",children:String(s)})},{key:"type",label:"Type",render:s=>e.jsx("code",{className:"text-xs",children:String(s)})},{key:"default",label:"Default",render:s=>{const i=String(s);return i==="required"?e.jsx("span",{className:"text-xs text-red-500",children:"required"}):e.jsx("code",{className:"text-xs",children:i})}},{key:"description",label:"Description"}],o=[{prop:"label",type:"React.ReactNode",default:"-",description:"Radio button label"},{prop:"value",type:"string",default:"required",description:"Radio button value"},{prop:"variant",type:"'ghost' | 'solid' | 'transparent'",default:"'ghost'",description:"Visual variant of the radio button"},{prop:"size",type:"'sm' | 'md' | 'lg' | 'xl'",default:"'md'",description:"Size of the radio button"},{prop:"color",type:"'primary' | 'secondary' | 'danger' | 'info' | 'success' | 'warning'",default:"'primary'",description:"Color theme of the radio button"},{prop:"disabled",type:"boolean",default:"false",description:"Disables the radio button"},{prop:"labelPlacement",type:"'start' | 'end'",default:"'end'",description:"Position of the label relative to the radio"},{prop:"error",type:"string",default:"-",description:"Error message to display"},{prop:"helperText",type:"React.ReactNode",default:"-",description:"Helper text displayed below the radio"}];return e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"text-center space-y-4",children:[e.jsx(a.Typography,{tag:"h2",className:"text-3xl md:text-4xl font-bold",children:"Radio"}),e.jsx(a.Typography,{tag:"p",className:"text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"A single radio button component for binary choices."})]}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"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(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Basic Radio"}),e.jsx(a.Radio,{label:"Option 1",value:"option1",checked:l==="option1",onChange:s=>r(s.target.value)})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Disabled"}),e.jsx(a.Radio,{label:"Disabled option",value:"disabled",disabled:!0})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Different Colors"}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(a.Radio,{label:"Primary",value:"primary",color:"primary"}),e.jsx(a.Radio,{label:"Danger",value:"danger",color:"danger"}),e.jsx(a.Radio,{label:"Success",value:"success",color:"success"})]})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Different Sizes"}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(a.Radio,{label:"Small",value:"sm",size:"sm"}),e.jsx(a.Radio,{label:"Medium",value:"md",size:"md"}),e.jsx(a.Radio,{label:"Large",value:"lg",size:"lg"})]})]})]})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Variants",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-3 gap-4",children:[e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Ghost (default)"}),e.jsx(a.Radio,{label:"Ghost Variant",value:"ghost",variant:"ghost",checked:l==="ghost",onChange:s=>r(s.target.value)})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Solid"}),e.jsx(a.Radio,{label:"Solid Variant",value:"solid",variant:"solid",checked:l==="solid",onChange:s=>r(s.target.value)})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Transparent"}),e.jsx(a.Radio,{label:"Transparent Variant",value:"transparent",variant:"transparent",checked:l==="transparent",onChange:s=>r(s.target.value)})]})]})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Props",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.BasicTable,{columns:t,data:o})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.CodeBlock,{language:"tsx",code:`import { Radio } from '@e-burgos/tucu-ui';
+
+<Radio
+  label="Option 1"
+  value="option1"
+  checked={value === 'option1'}
+  onChange={(e) => setValue(e.target.value)}
+/>
+
+// Variants
+<Radio label="Ghost" variant="ghost" value="ghost" />
+<Radio label="Solid" variant="solid" value="solid" />
+<Radio label="Transparent" variant="transparent" value="transparent" />
+
+// Colors
+<Radio label="Primary" color="primary" />
+<Radio label="Danger" color="danger" />
+<Radio label="Success" color="success" />
+
+// Sizes
+<Radio label="Small" size="sm" />
+<Radio label="Medium" size="md" />
+<Radio label="Large" size="lg" />`})})})})]})};exports.default=n;

package/RadioSection-LW7GeXAA.mjs

@@ -0,0 +1,208 @@
+import { jsxs as l, Fragment as c, jsx as e } from "react/jsx-runtime";
+import { useState as p } from "react";
+import { T as s, C as r, a as d, R as t, B as m, c as h } from "./index-Hq6IUBmn.mjs";
+import "lucide-react";
+import "react-router-dom";
+import "react-dom";
+const R = () => {
+  const [i, o] = p("");
+  return /* @__PURE__ */ l(c, { children: [
+    /* @__PURE__ */ l("div", { className: "text-center space-y-4", children: [
+      /* @__PURE__ */ e(s, { tag: "h2", className: "text-3xl md:text-4xl font-bold", children: "Radio" }),
+      /* @__PURE__ */ e(
+        s,
+        {
+          tag: "p",
+          className: "text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",
+          children: "A single radio button component for binary choices."
+        }
+      )
+    ] }),
+    /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(d, { title: "Examples", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ l("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
+      /* @__PURE__ */ l(r, { className: "p-4", children: [
+        /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Basic Radio" }),
+        /* @__PURE__ */ e(
+          t,
+          {
+            label: "Option 1",
+            value: "option1",
+            checked: i === "option1",
+            onChange: (a) => o(a.target.value)
+          }
+        )
+      ] }),
+      /* @__PURE__ */ l(r, { className: "p-4", children: [
+        /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Disabled" }),
+        /* @__PURE__ */ e(t, { label: "Disabled option", value: "disabled", disabled: !0 })
+      ] }),
+      /* @__PURE__ */ l(r, { className: "p-4", children: [
+        /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Different Colors" }),
+        /* @__PURE__ */ l("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ e(t, { label: "Primary", value: "primary", color: "primary" }),
+          /* @__PURE__ */ e(t, { label: "Danger", value: "danger", color: "danger" }),
+          /* @__PURE__ */ e(t, { label: "Success", value: "success", color: "success" })
+        ] })
+      ] }),
+      /* @__PURE__ */ l(r, { className: "p-4", children: [
+        /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Different Sizes" }),
+        /* @__PURE__ */ l("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ e(t, { label: "Small", value: "sm", size: "sm" }),
+          /* @__PURE__ */ e(t, { label: "Medium", value: "md", size: "md" }),
+          /* @__PURE__ */ e(t, { label: "Large", value: "lg", size: "lg" })
+        ] })
+      ] })
+    ] }) }) }) }),
+    /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(d, { title: "Variants", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ l("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [
+      /* @__PURE__ */ l(r, { className: "p-4", children: [
+        /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Ghost (default)" }),
+        /* @__PURE__ */ e(
+          t,
+          {
+            label: "Ghost Variant",
+            value: "ghost",
+            variant: "ghost",
+            checked: i === "ghost",
+            onChange: (a) => o(a.target.value)
+          }
+        )
+      ] }),
+      /* @__PURE__ */ l(r, { className: "p-4", children: [
+        /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Solid" }),
+        /* @__PURE__ */ e(
+          t,
+          {
+            label: "Solid Variant",
+            value: "solid",
+            variant: "solid",
+            checked: i === "solid",
+            onChange: (a) => o(a.target.value)
+          }
+        )
+      ] }),
+      /* @__PURE__ */ l(r, { className: "p-4", children: [
+        /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Transparent" }),
+        /* @__PURE__ */ e(
+          t,
+          {
+            label: "Transparent Variant",
+            value: "transparent",
+            variant: "transparent",
+            checked: i === "transparent",
+            onChange: (a) => o(a.target.value)
+          }
+        )
+      ] })
+    ] }) }) }) }),
+    /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(d, { title: "Props", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(m, { columns: [
+      {
+        key: "prop",
+        label: "Prop",
+        render: (a) => /* @__PURE__ */ e("code", { className: "text-xs text-brand", children: String(a) })
+      },
+      {
+        key: "type",
+        label: "Type",
+        render: (a) => /* @__PURE__ */ e("code", { className: "text-xs", children: String(a) })
+      },
+      {
+        key: "default",
+        label: "Default",
+        render: (a) => {
+          const n = String(a);
+          return n === "required" ? /* @__PURE__ */ e("span", { className: "text-xs text-red-500", children: "required" }) : /* @__PURE__ */ e("code", { className: "text-xs", children: n });
+        }
+      },
+      {
+        key: "description",
+        label: "Description"
+      }
+    ], data: [
+      {
+        prop: "label",
+        type: "React.ReactNode",
+        default: "-",
+        description: "Radio button label"
+      },
+      {
+        prop: "value",
+        type: "string",
+        default: "required",
+        description: "Radio button value"
+      },
+      {
+        prop: "variant",
+        type: "'ghost' | 'solid' | 'transparent'",
+        default: "'ghost'",
+        description: "Visual variant of the radio button"
+      },
+      {
+        prop: "size",
+        type: "'sm' | 'md' | 'lg' | 'xl'",
+        default: "'md'",
+        description: "Size of the radio button"
+      },
+      {
+        prop: "color",
+        type: "'primary' | 'secondary' | 'danger' | 'info' | 'success' | 'warning'",
+        default: "'primary'",
+        description: "Color theme of the radio button"
+      },
+      {
+        prop: "disabled",
+        type: "boolean",
+        default: "false",
+        description: "Disables the radio button"
+      },
+      {
+        prop: "labelPlacement",
+        type: "'start' | 'end'",
+        default: "'end'",
+        description: "Position of the label relative to the radio"
+      },
+      {
+        prop: "error",
+        type: "string",
+        default: "-",
+        description: "Error message to display"
+      },
+      {
+        prop: "helperText",
+        type: "React.ReactNode",
+        default: "-",
+        description: "Helper text displayed below the radio"
+      }
+    ] }) }) }) }),
+    /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(d, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
+      h,
+      {
+        language: "tsx",
+        code: `import { Radio } from '@e-burgos/tucu-ui';
+
+<Radio
+  label="Option 1"
+  value="option1"
+  checked={value === 'option1'}
+  onChange={(e) => setValue(e.target.value)}
+/>
+
+// Variants
+<Radio label="Ghost" variant="ghost" value="ghost" />
+<Radio label="Solid" variant="solid" value="solid" />
+<Radio label="Transparent" variant="transparent" value="transparent" />
+
+// Colors
+<Radio label="Primary" color="primary" />
+<Radio label="Danger" color="danger" />
+<Radio label="Success" color="success" />
+
+// Sizes
+<Radio label="Small" size="sm" />
+<Radio label="Medium" size="md" />
+<Radio label="Large" size="lg" />`
+      }
+    ) }) }) })
+  ] });
+};
+export {
+  R as default
+};