"use strict";(self.webpackChunkelite_events_nextjs=self.webpackChunkelite_events_nextjs||[]).push([[4928],{"./src/components/ui/Button/ButtonCVA.stories.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{AllSizes:()=>AllSizes,AllVariants:()=>AllVariants,ButtonGroups:()=>ButtonGroups,CompositionExample:()=>CompositionExample,DisabledStates:()=>DisabledStates,FullWidth:()=>FullWidth,Playground:()=>Playground,ResponsiveExample:()=>ResponsiveExample,WithIcons:()=>WithIcons,__namedExportsOrder:()=>__namedExportsOrder,default:()=>ButtonCVA_stories});var jsx_runtime=__webpack_require__("./node_modules/next/dist/compiled/react/jsx-runtime.js"),clsx=__webpack_require__("./node_modules/clsx/dist/clsx.mjs");const falsyToString=value=>"boolean"==typeof value?`${value}`:0===value?"0":value,cx=clsx.$,dist_cva=(base,config)=>props=>{var _config_compoundVariants;if(null==(null==config?void 0:config.variants))return cx(base,null==props?void 0:props.class,null==props?void 0:props.className);const{variants,defaultVariants}=config,getVariantClassNames=Object.keys(variants).map(variant=>{const variantProp=null==props?void 0:props[variant],defaultVariantProp=null==defaultVariants?void 0:defaultVariants[variant];if(null===variantProp)return null;const variantKey=falsyToString(variantProp)||falsyToString(defaultVariantProp);return variants[variant][variantKey]}),propsWithoutUndefined=props&&Object.entries(props).reduce((acc,param)=>{let[key,value]=param;return void 0===value||(acc[key]=value),acc},{}),getCompoundVariantClassNames=null==config||null===(_config_compoundVariants=config.compoundVariants)||void 0===_config_compoundVariants?void 0:_config_compoundVariants.reduce((acc,param)=>{let{class:cvClass,className:cvClassName,...compoundVariantOptions}=param;return Object.entries(compoundVariantOptions).every(param=>{let[key,value]=param;return Array.isArray(value)?value.includes({...defaultVariants,...propsWithoutUndefined}[key]):{...defaultVariants,...propsWithoutUndefined}[key]===value})?[...acc,cvClass,cvClassName]:acc},[]);return cx(base,getVariantClassNames,getCompoundVariantClassNames,null==props?void 0:props.class,null==props?void 0:props.className)};var core=__webpack_require__("./src/lib/core/index.ts");const buttonVariants=dist_cva("inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",{variants:{variant:{primary:"bg-primary text-white hover:bg-primary-700 focus-visible:ring-primary",secondary:"bg-secondary text-white hover:bg-secondary-700 focus-visible:ring-secondary",outline:"border border-gray-300 bg-transparent hover:bg-gray-100 focus-visible:ring-gray-400",ghost:"hover:bg-gray-100 focus-visible:ring-gray-400",danger:"bg-error text-white hover:bg-error-700 focus-visible:ring-error",link:"text-primary underline-offset-4 hover:underline"},size:{sm:"h-8 px-3 text-sm",md:"h-10 px-4 text-base",lg:"h-12 px-6 text-lg",icon:"h-10 w-10"},fullWidth:{true:"w-full",false:"w-auto"}},defaultVariants:{variant:"primary",size:"md",fullWidth:!1}});dist_cva("flex w-full rounded-md border bg-transparent px-3 py-2 text-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-gray-400 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",{variants:{state:{default:"border-gray-300 focus-visible:ring-primary",error:"border-error focus-visible:ring-error",success:"border-success focus-visible:ring-success",warning:"border-warning focus-visible:ring-warning"},size:{sm:"h-8 text-xs",md:"h-10 text-sm",lg:"h-12 text-base"}},defaultVariants:{state:"default",size:"md"}}),dist_cva("inline-flex items-center rounded-full font-medium transition-colors",{variants:{variant:{default:"bg-gray-100 text-gray-900",primary:"bg-primary-100 text-primary-900",secondary:"bg-secondary-100 text-secondary-900",success:"bg-success-100 text-success-900",warning:"bg-warning-100 text-warning-900",error:"bg-error-100 text-error-900",outline:"border border-current"},size:{sm:"px-2 py-0.5 text-xs",md:"px-2.5 py-1 text-sm",lg:"px-3 py-1.5 text-base"}},defaultVariants:{variant:"default",size:"md"}}),dist_cva("rounded-lg transition-shadow",{variants:{variant:{default:"bg-white border border-gray-200",elevated:"bg-white shadow-md",outlined:"bg-transparent border-2 border-gray-300",ghost:"bg-transparent"},padding:{none:"p-0",sm:"p-3",md:"p-4",lg:"p-6",xl:"p-8"},hover:{none:"",lift:"hover:shadow-lg hover:-translate-y-1",glow:"hover:shadow-xl"}},defaultVariants:{variant:"default",padding:"md",hover:"none"}});function ButtonCVA({children,variant,size,fullWidth,disabled,onClick}){return(0,jsx_runtime.jsx)("button",{className:(0,core.cn)(buttonVariants({variant,size,fullWidth})),disabled,onClick,children})}const ButtonCVA_stories={title:"UI/Button/CVA Variants",component:ButtonCVA,parameters:{layout:"centered",docs:{description:{component:"Enhanced button component showcasing the Class Variance Authority (CVA) system for type-safe, composable component variants."}}},tags:["autodocs"],argTypes:{variant:{control:"select",options:["primary","secondary","outline","ghost","danger","link"],description:"Button visual style"},size:{control:"select",options:["sm","md","lg","icon"],description:"Button size"},fullWidth:{control:"boolean",description:"Make button full width"},disabled:{control:"boolean",description:"Disable button"}}},AllVariants={render:()=>(0,jsx_runtime.jsx)("div",{className:"space-y-4",children:(0,jsx_runtime.jsxs)("div",{className:"flex flex-wrap gap-4",children:[(0,jsx_runtime.jsx)(ButtonCVA,{variant:"primary",children:"Primary"}),(0,jsx_runtime.jsx)(ButtonCVA,{variant:"secondary",children:"Secondary"}),(0,jsx_runtime.jsx)(ButtonCVA,{variant:"outline",children:"Outline"}),(0,jsx_runtime.jsx)(ButtonCVA,{variant:"ghost",children:"Ghost"}),(0,jsx_runtime.jsx)(ButtonCVA,{variant:"danger",children:"Danger"}),(0,jsx_runtime.jsx)(ButtonCVA,{variant:"link",children:"Link"})]})})},AllSizes={render:()=>(0,jsx_runtime.jsxs)("div",{className:"flex flex-wrap items-center gap-4",children:[(0,jsx_runtime.jsx)(ButtonCVA,{size:"sm",children:"Small"}),(0,jsx_runtime.jsx)(ButtonCVA,{size:"md",children:"Medium"}),(0,jsx_runtime.jsx)(ButtonCVA,{size:"lg",children:"Large"}),(0,jsx_runtime.jsx)(ButtonCVA,{size:"icon",children:"🚀"})]})},FullWidth={render:()=>(0,jsx_runtime.jsxs)("div",{className:"w-64 space-y-2",children:[(0,jsx_runtime.jsx)(ButtonCVA,{variant:"primary",fullWidth:!0,children:"Full Width Primary"}),(0,jsx_runtime.jsx)(ButtonCVA,{variant:"outline",fullWidth:!0,children:"Full Width Outline"})]})},DisabledStates={render:()=>(0,jsx_runtime.jsxs)("div",{className:"flex flex-wrap gap-4",children:[(0,jsx_runtime.jsx)(ButtonCVA,{variant:"primary",disabled:!0,children:"Primary Disabled"}),(0,jsx_runtime.jsx)(ButtonCVA,{variant:"secondary",disabled:!0,children:"Secondary Disabled"}),(0,jsx_runtime.jsx)(ButtonCVA,{variant:"outline",disabled:!0,children:"Outline Disabled"})]})},CompositionExample={render:()=>(0,jsx_runtime.jsxs)("div",{className:"space-y-4",children:[(0,jsx_runtime.jsx)("h3",{className:"font-semibold text-lg",children:"Variant Composition"}),(0,jsx_runtime.jsx)("p",{className:"text-sm text-gray-600 mb-4",children:"CVA allows you to easily compose variants and override styles"}),(0,jsx_runtime.jsxs)("div",{className:"flex flex-wrap gap-4",children:[(0,jsx_runtime.jsx)("button",{className:(0,core.cn)(buttonVariants({variant:"primary",size:"sm"})),children:"Small Primary"}),(0,jsx_runtime.jsx)("button",{className:(0,core.cn)(buttonVariants({variant:"outline",size:"lg"})),children:"Large Outline"}),(0,jsx_runtime.jsx)("button",{className:(0,core.cn)(buttonVariants({variant:"danger"}),"shadow-lg"),children:"Danger with Shadow"})]})]})},Playground={args:{children:"Button Text",variant:"primary",size:"md",fullWidth:!1,disabled:!1}},ResponsiveExample={render:()=>(0,jsx_runtime.jsxs)("div",{className:"space-y-4 w-full max-w-md",children:[(0,jsx_runtime.jsx)("h3",{className:"font-semibold text-lg",children:"Responsive Variants"}),(0,jsx_runtime.jsx)("p",{className:"text-sm text-gray-600 mb-4",children:"Buttons automatically adapt with fullWidth on mobile"}),(0,jsx_runtime.jsxs)("div",{className:"space-y-2",children:[(0,jsx_runtime.jsx)(ButtonCVA,{variant:"primary",fullWidth:!0,children:"Mobile: Full Width, Desktop: Auto"}),(0,jsx_runtime.jsx)(ButtonCVA,{variant:"secondary",fullWidth:!0,children:"Responsive Button"})]})]})},WithIcons={render:()=>(0,jsx_runtime.jsxs)("div",{className:"flex flex-wrap gap-4",children:[(0,jsx_runtime.jsxs)("button",{className:(0,core.cn)(buttonVariants({variant:"primary"})),children:[(0,jsx_runtime.jsx)("span",{className:"mr-2",children:"➕"}),"Add Item"]}),(0,jsx_runtime.jsxs)("button",{className:(0,core.cn)(buttonVariants({variant:"secondary"})),children:["Download",(0,jsx_runtime.jsx)("span",{className:"ml-2",children:"⬇️"})]}),(0,jsx_runtime.jsxs)("button",{className:(0,core.cn)(buttonVariants({variant:"outline"})),children:[(0,jsx_runtime.jsx)("span",{className:"mr-2",children:"❤️"}),"Favorite"]}),(0,jsx_runtime.jsx)("button",{className:(0,core.cn)(buttonVariants({size:"icon"})),children:"🔍"}),(0,jsx_runtime.jsx)("button",{className:(0,core.cn)(buttonVariants({size:"icon",variant:"danger"})),children:"🗑️"})]})},ButtonGroups={render:()=>(0,jsx_runtime.jsxs)("div",{className:"space-y-6",children:[(0,jsx_runtime.jsxs)("div",{children:[(0,jsx_runtime.jsx)("h4",{className:"text-sm font-medium mb-2",children:"Primary Group"}),(0,jsx_runtime.jsxs)("div",{className:"inline-flex rounded-md shadow-sm",role:"group",children:[(0,jsx_runtime.jsx)("button",{className:(0,core.cn)(buttonVariants({variant:"primary"}),"rounded-r-none border-r border-white/20"),children:"Left"}),(0,jsx_runtime.jsx)("button",{className:(0,core.cn)(buttonVariants({variant:"primary"}),"rounded-none border-r border-white/20"),children:"Middle"}),(0,jsx_runtime.jsx)("button",{className:(0,core.cn)(buttonVariants({variant:"primary"}),"rounded-l-none"),children:"Right"})]})]}),(0,jsx_runtime.jsxs)("div",{children:[(0,jsx_runtime.jsx)("h4",{className:"text-sm font-medium mb-2",children:"Outline Group"}),(0,jsx_runtime.jsxs)("div",{className:"inline-flex rounded-md",role:"group",children:[(0,jsx_runtime.jsx)("button",{className:(0,core.cn)(buttonVariants({variant:"outline"}),"rounded-r-none -mr-px"),children:"View"}),(0,jsx_runtime.jsx)("button",{className:(0,core.cn)(buttonVariants({variant:"outline"}),"rounded-none -mr-px"),children:"Edit"}),(0,jsx_runtime.jsx)("button",{className:(0,core.cn)(buttonVariants({variant:"outline"}),"rounded-l-none"),children:"Delete"})]})]})]})},__namedExportsOrder=["AllVariants","AllSizes","FullWidth","DisabledStates","CompositionExample","Playground","ResponsiveExample","WithIcons","ButtonGroups"]}}]);