@betterlb/kapwa 1.1.0 → 1.1.2

package/dist/kapwa/banner/index.tsx.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../jsx-runtime-KWq1EBG2.cjs"),t=require("../../utils-GVl92sVg.cjs"),f=require("../button/index.tsx.cjs"),v=({title:n,description:x,type:m="default",icon:p=!1,cta:l,className:c,onDismiss:o,titleSize:d="lg"})=>{const h={success:{container:"bg-green-50 border border-green-200",icon:"text-green-600",title:"text-green-800",description:"text-green-700",iconSvg:e.jsxRuntimeExports.jsx("svg",{className:"h-6 w-6",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsxRuntimeExports.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"})})},error:{container:"bg-red-50 border border-red-200",icon:"text-red-600",title:"text-red-800",description:"text-red-700",iconSvg:e.jsxRuntimeExports.jsx("svg",{className:"h-6 w-6",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsxRuntimeExports.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"})})},warning:{container:"bg-yellow-50 border border-yellow-200",icon:"text-yellow-600",title:"text-yellow-800",description:"text-yellow-700",iconSvg:e.jsxRuntimeExports.jsx("svg",{className:"h-6 w-6",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsxRuntimeExports.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"})})},info:{container:"bg-blue-50 border border-blue-200",icon:"text-blue-600",title:"text-blue-800",description:"text-blue-700",iconSvg:e.jsxRuntimeExports.jsx("svg",{className:"h-6 w-6",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsxRuntimeExports.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"})})},default:{container:"bg-gray-50 border border-gray-200",icon:"text-gray-600",title:"text-gray-900",description:"text-gray-800",iconSvg:e.jsxRuntimeExports.jsx("svg",{className:"h-6 w-6",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsxRuntimeExports.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"})})}},u={sm:"text-base",md:"text-lg",lg:"text-xl"},j=(r="primary",i="lg")=>{const a={primary:"bg-primary-500 text-white hover:bg-primary-600 focus:ring-primary-500",secondary:"bg-secondary-500 text-white hover:bg-secondary-600 focus:ring-secondary-500",outline:"bg-transparent border border-gray-300 text-gray-700 hover:bg-gray-50 focus:ring-primary-500",ghost:"bg-transparent text-gray-700 hover:bg-gray-100 focus:ring-gray-500"},b={sm:"text-sm px-3 py-1.5 h-8",md:"text-base px-4 py-2 h-10",lg:"text-lg px-6 py-3 h-12"};return t.cn("inline-flex items-center justify-center rounded-md font-medium transition-colors","focus:outline-hidden focus:ring-2 focus:ring-offset-2",a[r],b[i],"shadow-xs")},s=h[m],g=(r,i)=>r.href?e.jsxRuntimeExports.jsx("a",{href:r.href,className:j(r.variant,r.size),children:r.label},i):e.jsxRuntimeExports.jsx(f.Button,{onClick:r.onClick,variant:r.variant||"primary",size:r.size||"md",children:r.label},i);if(l){const r=Array.isArray(l)?l:[l];return e.jsxRuntimeExports.jsx("div",{className:t.cn("relative rounded-lg p-4",s.container,c),children:e.jsxRuntimeExports.jsxs("div",{className:"md:flex items-center",children:[e.jsxRuntimeExports.jsxs("div",{className:t.cn("mb-6 md:mb-0 md:w-2/3 md:pr-8",o?"pr-10 md:pr-8":""),children:[n&&e.jsxRuntimeExports.jsx("h3",{className:t.cn("font-semibold mb-2",s.title,u[d]),children:n}),e.jsxRuntimeExports.jsx("p",{className:s.description,children:x})]}),e.jsxRuntimeExports.jsx("div",{className:"md:w-1/3 flex justify-center md:justify-end",children:e.jsxRuntimeExports.jsxs("div",{className:"flex space-x-2 items-center",children:[r.map((i,a)=>g(i,a)),o&&e.jsxRuntimeExports.jsx("button",{onClick:o,className:"absolute top-2 right-2 md:relative md:top-auto md:right-auto rounded-md p-2 transition-colors hover:bg-black/5 focus:outline-none focus:ring-2 focus:ring-offset-2","aria-label":"Dismiss banner",children:e.jsxRuntimeExports.jsx("svg",{className:"w-4 h-4 opacity-60",fill:"currentColor",viewBox:"0 0 20 20",children:e.jsxRuntimeExports.jsx("path",{fillRule:"evenodd",d:"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",clipRule:"evenodd"})})})]})})]})})}return e.jsxRuntimeExports.jsxs("div",{className:t.cn("relative flex justify-between rounded-lg p-4",s.container,c),children:[o&&e.jsxRuntimeExports.jsx("button",{onClick:o,className:"absolute top-2 right-2 md:relative md:top-auto md:right-auto md:flex md:items-center md:justify-end md:ml-3 flex-shrink-0 rounded-md p-2 transition-colors hover:bg-black/5 focus:outline-none focus:ring-2 focus:ring-offset-2","aria-label":"Dismiss banner",children:e.jsxRuntimeExports.jsx("svg",{className:"w-4 h-4 opacity-60",fill:"currentColor",viewBox:"0 0 20 20",children:e.jsxRuntimeExports.jsx("path",{fillRule:"evenodd",d:"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",clipRule:"evenodd"})})}),e.jsxRuntimeExports.jsxs("div",{className:t.cn("flex items-center",n?"items-start":"items-center",o?"pr-10 md:pr-0":""),children:[p&&e.jsxRuntimeExports.jsx("div",{className:t.cn("mr-3",n?"mt-1":"",s.icon),children:s.iconSvg}),e.jsxRuntimeExports.jsxs("div",{className:"flex-1",children:[n&&e.jsxRuntimeExports.jsx("h3",{className:t.cn("font-semibold",s.title,u[d]),children:n}),e.jsxRuntimeExports.jsx("p",{className:t.cn(s.description,"text-sm"),children:x})]})]})]})};exports.Banner=v;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../jsx-runtime-KWq1EBG2.cjs"),t=require("../../utils-GVl92sVg.cjs"),f=require("../button/index.tsx.cjs"),v=({title:n,description:x,type:p="default",icon:m=!1,cta:a,className:c,onDismiss:o,titleSize:d="lg"})=>{const g={success:{container:"bg-green-50 border border-green-200",icon:"text-green-600",title:"text-green-800",description:"text-green-700",iconSvg:e.jsxRuntimeExports.jsx("svg",{className:"h-6 w-6",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsxRuntimeExports.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"})})},error:{container:"bg-red-50 border border-red-200",icon:"text-red-600",title:"text-red-800",description:"text-red-700",iconSvg:e.jsxRuntimeExports.jsx("svg",{className:"h-6 w-6",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsxRuntimeExports.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"})})},warning:{container:"bg-yellow-50 border border-yellow-200",icon:"text-yellow-600",title:"text-yellow-800",description:"text-yellow-700",iconSvg:e.jsxRuntimeExports.jsx("svg",{className:"h-6 w-6",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsxRuntimeExports.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"})})},info:{container:"bg-blue-50 border border-blue-200",icon:"text-blue-600",title:"text-blue-800",description:"text-blue-700",iconSvg:e.jsxRuntimeExports.jsx("svg",{className:"h-6 w-6",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsxRuntimeExports.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"})})},default:{container:"bg-gray-50 border border-gray-200",icon:"text-gray-600",title:"text-gray-900",description:"text-gray-800",iconSvg:e.jsxRuntimeExports.jsx("svg",{className:"h-6 w-6",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsxRuntimeExports.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"})})}},u={sm:"text-base",md:"text-lg",lg:"text-xl"},j=(r="primary",i="lg")=>{const l={primary:"bg-kapwa-blue-600 text-kapwa-neutral-50 hover:bg-kapwa-blue-700 focus:ring-kapwa-blue-500",secondary:"bg-kapwa-orange-600 text-kapwa-neutral-50 hover:bg-kapwa-orange-700 focus:ring-kapwa-orange-500",outline:"bg-transparent border border-kapwa-gray-300 text-kapwa-gray-700 hover:bg-kapwa-gray-50 focus:ring-kapwa-blue-500",ghost:"bg-transparent text-kapwa-gray-700 hover:bg-kapwa-gray-100 focus:ring-kapwa-gray-500"},b={sm:"text-sm px-3 py-1.5 h-8",md:"text-base px-4 py-2 h-10",lg:"text-lg px-6 py-3 h-12"};return t.cn("inline-flex items-center justify-center rounded-md font-medium transition-colors","focus:outline-hidden focus:ring-2 focus:ring-offset-2",l[r],b[i],"shadow-xs")},s=g[p],h=(r,i)=>r.href?e.jsxRuntimeExports.jsx("a",{href:r.href,className:j(r.variant,r.size),children:r.label},i):e.jsxRuntimeExports.jsx(f.Button,{onClick:r.onClick,variant:r.variant||"primary",size:r.size||"md",children:r.label},i);if(a){const r=Array.isArray(a)?a:[a];return e.jsxRuntimeExports.jsx("div",{className:t.cn("relative rounded-lg p-4",s.container,c),children:e.jsxRuntimeExports.jsxs("div",{className:"md:flex items-center",children:[e.jsxRuntimeExports.jsxs("div",{className:t.cn("mb-6 md:mb-0 md:w-2/3 md:pr-8",o?"pr-10 md:pr-8":""),children:[n&&e.jsxRuntimeExports.jsx("h3",{className:t.cn("font-semibold mb-2",s.title,u[d]),children:n}),e.jsxRuntimeExports.jsx("p",{className:s.description,children:x})]}),e.jsxRuntimeExports.jsx("div",{className:"md:w-1/3 flex justify-center md:justify-end",children:e.jsxRuntimeExports.jsxs("div",{className:"flex space-x-2 items-center",children:[r.map((i,l)=>h(i,l)),o&&e.jsxRuntimeExports.jsx("button",{onClick:o,className:"absolute top-2 right-2 md:relative md:top-auto md:right-auto rounded-md p-2 transition-colors hover:bg-black/5 focus:outline-none focus:ring-2 focus:ring-offset-2","aria-label":"Dismiss banner",children:e.jsxRuntimeExports.jsx("svg",{className:"w-4 h-4 opacity-60",fill:"currentColor",viewBox:"0 0 20 20",children:e.jsxRuntimeExports.jsx("path",{fillRule:"evenodd",d:"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",clipRule:"evenodd"})})})]})})]})})}return e.jsxRuntimeExports.jsxs("div",{className:t.cn("relative flex justify-between rounded-lg p-4",s.container,c),children:[o&&e.jsxRuntimeExports.jsx("button",{onClick:o,className:"absolute top-2 right-2 md:relative md:top-auto md:right-auto md:flex md:items-center md:justify-end md:ml-3 flex-shrink-0 rounded-md p-2 transition-colors hover:bg-black/5 focus:outline-none focus:ring-2 focus:ring-offset-2","aria-label":"Dismiss banner",children:e.jsxRuntimeExports.jsx("svg",{className:"w-4 h-4 opacity-60",fill:"currentColor",viewBox:"0 0 20 20",children:e.jsxRuntimeExports.jsx("path",{fillRule:"evenodd",d:"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",clipRule:"evenodd"})})}),e.jsxRuntimeExports.jsxs("div",{className:t.cn("flex items-center",n?"items-start":"items-center",o?"pr-10 md:pr-0":""),children:[m&&e.jsxRuntimeExports.jsx("div",{className:t.cn("mr-3",n?"mt-1":"",s.icon),children:s.iconSvg}),e.jsxRuntimeExports.jsxs("div",{className:"flex-1",children:[n&&e.jsxRuntimeExports.jsx("h3",{className:t.cn("font-semibold",s.title,u[d]),children:n}),e.jsxRuntimeExports.jsx("p",{className:t.cn(s.description,"text-sm"),children:x})]})]})]})};exports.Banner=v;
 //# sourceMappingURL=index.tsx.cjs.map

package/dist/kapwa/banner/index.tsx.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.tsx.cjs","sources":["../../../src/kapwa/banner/index.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '@lib/utils';\nimport { Button } from '../button';\n\nexport type BannerType = 'info' | 'warning' | 'error' | 'success' | 'default';\n\nexport interface BannerProps {\n  title?: string;\n  description: string;\n  type?: BannerType;\n  icon?: boolean;\n  cta?:\n    | {\n        label: string;\n        onClick: () => void;\n        href?: string;\n        variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'link';\n        size?: 'sm' | 'md' | 'lg';\n      }\n    | Array<{\n        label: string;\n        onClick: () => void;\n        href?: string;\n        variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'link';\n        size?: 'sm' | 'md' | 'lg';\n      }>;\n  className?: string;\n  onDismiss?: () => void;\n  titleSize?: 'sm' | 'md' | 'lg';\n}\n\nconst Banner: React.FC<BannerProps> = ({\n  title,\n  description,\n  type = 'default',\n  icon = false,\n  cta,\n  className,\n  onDismiss,\n  titleSize = 'lg',\n}) => {\n  const typeStyles = {\n    success: {\n      container: 'bg-green-50 border border-green-200',\n      icon: 'text-green-600',\n      title: 'text-green-800',\n      description: 'text-green-700',\n      iconSvg: (\n        <svg\n          className='h-6 w-6'\n          fill='none'\n          stroke='currentColor'\n          viewBox='0 0 24 24'\n        >\n          <path\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth={2}\n            d='M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z'\n          />\n        </svg>\n      ),\n    },\n    error: {\n      container: 'bg-red-50 border border-red-200',\n      icon: 'text-red-600',\n      title: 'text-red-800',\n      description: 'text-red-700',\n      iconSvg: (\n        <svg\n          className='h-6 w-6'\n          fill='none'\n          stroke='currentColor'\n          viewBox='0 0 24 24'\n        >\n          <path\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth={2}\n            d='M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z'\n          />\n        </svg>\n      ),\n    },\n    warning: {\n      container: 'bg-yellow-50 border border-yellow-200',\n      icon: 'text-yellow-600',\n      title: 'text-yellow-800',\n      description: 'text-yellow-700',\n      iconSvg: (\n        <svg\n          className='h-6 w-6'\n          fill='none'\n          stroke='currentColor'\n          viewBox='0 0 24 24'\n        >\n          <path\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth={2}\n            d='M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z'\n          />\n        </svg>\n      ),\n    },\n    info: {\n      container: 'bg-blue-50 border border-blue-200',\n      icon: 'text-blue-600',\n      title: 'text-blue-800',\n      description: 'text-blue-700',\n      iconSvg: (\n        <svg\n          className='h-6 w-6'\n          fill='none'\n          stroke='currentColor'\n          viewBox='0 0 24 24'\n        >\n          <path\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth={2}\n            d='M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z'\n          />\n        </svg>\n      ),\n    },\n    default: {\n      container: 'bg-gray-50 border border-gray-200',\n      icon: 'text-gray-600',\n      title: 'text-gray-900',\n      description: 'text-gray-800',\n      iconSvg: (\n        <svg\n          className='h-6 w-6'\n          fill='none'\n          stroke='currentColor'\n          viewBox='0 0 24 24'\n        >\n          <path\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth={2}\n            d='M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z'\n          />\n        </svg>\n      ),\n    },\n  };\n\n  const titleSizes = {\n    sm: 'text-base',\n    md: 'text-lg',\n    lg: 'text-xl',\n  };\n\n  const getButtonStyling = (\n    variant: string = 'primary',\n    size: string = 'lg'\n  ) => {\n    const variants = {\n      primary:\n        'bg-primary-500 text-white hover:bg-primary-600 focus:ring-primary-500',\n      secondary:\n        'bg-secondary-500 text-white hover:bg-secondary-600 focus:ring-secondary-500',\n      outline:\n        'bg-transparent border border-gray-300 text-gray-700 hover:bg-gray-50 focus:ring-primary-500',\n      ghost:\n        'bg-transparent text-gray-700 hover:bg-gray-100 focus:ring-gray-500',\n    };\n\n    const sizes = {\n      sm: 'text-sm px-3 py-1.5 h-8',\n      md: 'text-base px-4 py-2 h-10',\n      lg: 'text-lg px-6 py-3 h-12',\n    };\n\n    return cn(\n      'inline-flex items-center justify-center rounded-md font-medium transition-colors',\n      'focus:outline-hidden focus:ring-2 focus:ring-offset-2',\n      variants[variant as keyof typeof variants],\n      sizes[size as keyof typeof sizes],\n      'shadow-xs'\n    );\n  };\n\n  const currentStyles = typeStyles[type];\n\n  // Helper function to render a single CTA button\n  const renderCTAButton = (\n    ctaItem: {\n      label: string;\n      onClick: () => void;\n      href?: string;\n      variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'link';\n      size?: 'sm' | 'md' | 'lg';\n    },\n    index: number\n  ) => {\n    if (ctaItem.href) {\n      return (\n        <a\n          key={index}\n          href={ctaItem.href}\n          className={getButtonStyling(ctaItem.variant, ctaItem.size)}\n        >\n          {ctaItem.label}\n        </a>\n      );\n    }\n\n    return (\n      <Button\n        key={index}\n        onClick={ctaItem.onClick}\n        variant={ctaItem.variant || 'primary'}\n        size={ctaItem.size || 'md'}\n      >\n        {ctaItem.label}\n      </Button>\n    );\n  };\n\n  // CTA button (for banner with button layout)\n  if (cta) {\n    const ctaArray = Array.isArray(cta) ? cta : [cta];\n\n    return (\n      <div\n        className={cn(\n          'relative rounded-lg p-4',\n          currentStyles.container,\n          className\n        )}\n      >\n        <div className='md:flex items-center'>\n          <div\n            className={cn(\n              'mb-6 md:mb-0 md:w-2/3 md:pr-8',\n              onDismiss ? 'pr-10 md:pr-8' : ''\n            )}\n          >\n            {title && (\n              <h3\n                className={cn(\n                  'font-semibold mb-2',\n                  currentStyles.title,\n                  titleSizes[titleSize]\n                )}\n              >\n                {title}\n              </h3>\n            )}\n            <p className={currentStyles.description}>{description}</p>\n          </div>\n          <div className='md:w-1/3 flex justify-center md:justify-end'>\n            <div className='flex space-x-2 items-center'>\n              {ctaArray.map((ctaItem, index) =>\n                renderCTAButton(ctaItem, index)\n              )}\n              {onDismiss && (\n                <button\n                  onClick={onDismiss}\n                  className='absolute top-2 right-2 md:relative md:top-auto md:right-auto rounded-md p-2 transition-colors hover:bg-black/5 focus:outline-none focus:ring-2 focus:ring-offset-2'\n                  aria-label='Dismiss banner'\n                >\n                  <svg\n                    className='w-4 h-4 opacity-60'\n                    fill='currentColor'\n                    viewBox='0 0 20 20'\n                  >\n                    <path\n                      fillRule='evenodd'\n                      d='M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z'\n                      clipRule='evenodd'\n                    />\n                  </svg>\n                </button>\n              )}\n            </div>\n          </div>\n        </div>\n      </div>\n    );\n  }\n\n  // Standard banner layout (with or without icon)\n  return (\n    <div\n      className={cn(\n        'relative flex justify-between rounded-lg p-4',\n        currentStyles.container,\n        className\n      )}\n    >\n      {onDismiss && (\n        <button\n          onClick={onDismiss}\n          className='absolute top-2 right-2 md:relative md:top-auto md:right-auto md:flex md:items-center md:justify-end md:ml-3 flex-shrink-0 rounded-md p-2 transition-colors hover:bg-black/5 focus:outline-none focus:ring-2 focus:ring-offset-2'\n          aria-label='Dismiss banner'\n        >\n          <svg\n            className='w-4 h-4 opacity-60'\n            fill='currentColor'\n            viewBox='0 0 20 20'\n          >\n            <path\n              fillRule='evenodd'\n              d='M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z'\n              clipRule='evenodd'\n            />\n          </svg>\n        </button>\n      )}\n      <div\n        className={cn(\n          'flex items-center',\n          title ? 'items-start' : 'items-center',\n          onDismiss ? 'pr-10 md:pr-0' : ''\n        )}\n      >\n        {icon && (\n          <div className={cn('mr-3', title ? 'mt-1' : '', currentStyles.icon)}>\n            {currentStyles.iconSvg}\n          </div>\n        )}\n\n        <div className='flex-1'>\n          {title && (\n            <h3\n              className={cn(\n                'font-semibold',\n                currentStyles.title,\n                titleSizes[titleSize]\n              )}\n            >\n              {title}\n            </h3>\n          )}\n          <p className={cn(currentStyles.description, 'text-sm')}>\n            {description}\n          </p>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nexport { Banner };\n"],"names":["Banner","title","description","type","icon","cta","className","onDismiss","titleSize","typeStyles","jsx","titleSizes","getButtonStyling","variant","size","variants","sizes","cn","currentStyles","renderCTAButton","ctaItem","index","Button","ctaArray","jsxs"],"mappings":"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"}
+{"version":3,"file":"index.tsx.cjs","sources":["../../../src/kapwa/banner/index.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '@lib/utils';\nimport { Button } from '../button';\n\nexport type BannerType = 'info' | 'warning' | 'error' | 'success' | 'default';\n\nexport interface BannerProps {\n  title?: string;\n  description: string;\n  type?: BannerType;\n  icon?: boolean;\n  cta?:\n    | {\n        label: string;\n        onClick: () => void;\n        href?: string;\n        variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'link';\n        size?: 'sm' | 'md' | 'lg';\n      }\n    | Array<{\n        label: string;\n        onClick: () => void;\n        href?: string;\n        variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'link';\n        size?: 'sm' | 'md' | 'lg';\n      }>;\n  className?: string;\n  onDismiss?: () => void;\n  titleSize?: 'sm' | 'md' | 'lg';\n}\n\nconst Banner: React.FC<BannerProps> = ({\n  title,\n  description,\n  type = 'default',\n  icon = false,\n  cta,\n  className,\n  onDismiss,\n  titleSize = 'lg',\n}) => {\n  const typeStyles = {\n    success: {\n      container: 'bg-green-50 border border-green-200',\n      icon: 'text-green-600',\n      title: 'text-green-800',\n      description: 'text-green-700',\n      iconSvg: (\n        <svg\n          className='h-6 w-6'\n          fill='none'\n          stroke='currentColor'\n          viewBox='0 0 24 24'\n        >\n          <path\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth={2}\n            d='M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z'\n          />\n        </svg>\n      ),\n    },\n    error: {\n      container: 'bg-red-50 border border-red-200',\n      icon: 'text-red-600',\n      title: 'text-red-800',\n      description: 'text-red-700',\n      iconSvg: (\n        <svg\n          className='h-6 w-6'\n          fill='none'\n          stroke='currentColor'\n          viewBox='0 0 24 24'\n        >\n          <path\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth={2}\n            d='M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z'\n          />\n        </svg>\n      ),\n    },\n    warning: {\n      container: 'bg-yellow-50 border border-yellow-200',\n      icon: 'text-yellow-600',\n      title: 'text-yellow-800',\n      description: 'text-yellow-700',\n      iconSvg: (\n        <svg\n          className='h-6 w-6'\n          fill='none'\n          stroke='currentColor'\n          viewBox='0 0 24 24'\n        >\n          <path\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth={2}\n            d='M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z'\n          />\n        </svg>\n      ),\n    },\n    info: {\n      container: 'bg-blue-50 border border-blue-200',\n      icon: 'text-blue-600',\n      title: 'text-blue-800',\n      description: 'text-blue-700',\n      iconSvg: (\n        <svg\n          className='h-6 w-6'\n          fill='none'\n          stroke='currentColor'\n          viewBox='0 0 24 24'\n        >\n          <path\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth={2}\n            d='M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z'\n          />\n        </svg>\n      ),\n    },\n    default: {\n      container: 'bg-gray-50 border border-gray-200',\n      icon: 'text-gray-600',\n      title: 'text-gray-900',\n      description: 'text-gray-800',\n      iconSvg: (\n        <svg\n          className='h-6 w-6'\n          fill='none'\n          stroke='currentColor'\n          viewBox='0 0 24 24'\n        >\n          <path\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth={2}\n            d='M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z'\n          />\n        </svg>\n      ),\n    },\n  };\n\n  const titleSizes = {\n    sm: 'text-base',\n    md: 'text-lg',\n    lg: 'text-xl',\n  };\n\n  const getButtonStyling = (\n    variant: string = 'primary',\n    size: string = 'lg'\n  ) => {\n    const variants = {\n      primary:\n        'bg-kapwa-blue-600 text-kapwa-neutral-50 hover:bg-kapwa-blue-700 focus:ring-kapwa-blue-500',\n      secondary:\n        'bg-kapwa-orange-600 text-kapwa-neutral-50 hover:bg-kapwa-orange-700 focus:ring-kapwa-orange-500',\n      outline:\n        'bg-transparent border border-kapwa-gray-300 text-kapwa-gray-700 hover:bg-kapwa-gray-50 focus:ring-kapwa-blue-500',\n      ghost:\n        'bg-transparent text-kapwa-gray-700 hover:bg-kapwa-gray-100 focus:ring-kapwa-gray-500',\n    };\n\n    const sizes = {\n      sm: 'text-sm px-3 py-1.5 h-8',\n      md: 'text-base px-4 py-2 h-10',\n      lg: 'text-lg px-6 py-3 h-12',\n    };\n\n    return cn(\n      'inline-flex items-center justify-center rounded-md font-medium transition-colors',\n      'focus:outline-hidden focus:ring-2 focus:ring-offset-2',\n      variants[variant as keyof typeof variants],\n      sizes[size as keyof typeof sizes],\n      'shadow-xs'\n    );\n  };\n\n  const currentStyles = typeStyles[type];\n\n  // Helper function to render a single CTA button\n  const renderCTAButton = (\n    ctaItem: {\n      label: string;\n      onClick: () => void;\n      href?: string;\n      variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'link';\n      size?: 'sm' | 'md' | 'lg';\n    },\n    index: number\n  ) => {\n    if (ctaItem.href) {\n      return (\n        <a\n          key={index}\n          href={ctaItem.href}\n          className={getButtonStyling(ctaItem.variant, ctaItem.size)}\n        >\n          {ctaItem.label}\n        </a>\n      );\n    }\n\n    return (\n      <Button\n        key={index}\n        onClick={ctaItem.onClick}\n        variant={ctaItem.variant || 'primary'}\n        size={ctaItem.size || 'md'}\n      >\n        {ctaItem.label}\n      </Button>\n    );\n  };\n\n  // CTA button (for banner with button layout)\n  if (cta) {\n    const ctaArray = Array.isArray(cta) ? cta : [cta];\n\n    return (\n      <div\n        className={cn(\n          'relative rounded-lg p-4',\n          currentStyles.container,\n          className\n        )}\n      >\n        <div className='md:flex items-center'>\n          <div\n            className={cn(\n              'mb-6 md:mb-0 md:w-2/3 md:pr-8',\n              onDismiss ? 'pr-10 md:pr-8' : ''\n            )}\n          >\n            {title && (\n              <h3\n                className={cn(\n                  'font-semibold mb-2',\n                  currentStyles.title,\n                  titleSizes[titleSize]\n                )}\n              >\n                {title}\n              </h3>\n            )}\n            <p className={currentStyles.description}>{description}</p>\n          </div>\n          <div className='md:w-1/3 flex justify-center md:justify-end'>\n            <div className='flex space-x-2 items-center'>\n              {ctaArray.map((ctaItem, index) =>\n                renderCTAButton(ctaItem, index)\n              )}\n              {onDismiss && (\n                <button\n                  onClick={onDismiss}\n                  className='absolute top-2 right-2 md:relative md:top-auto md:right-auto rounded-md p-2 transition-colors hover:bg-black/5 focus:outline-none focus:ring-2 focus:ring-offset-2'\n                  aria-label='Dismiss banner'\n                >\n                  <svg\n                    className='w-4 h-4 opacity-60'\n                    fill='currentColor'\n                    viewBox='0 0 20 20'\n                  >\n                    <path\n                      fillRule='evenodd'\n                      d='M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z'\n                      clipRule='evenodd'\n                    />\n                  </svg>\n                </button>\n              )}\n            </div>\n          </div>\n        </div>\n      </div>\n    );\n  }\n\n  // Standard banner layout (with or without icon)\n  return (\n    <div\n      className={cn(\n        'relative flex justify-between rounded-lg p-4',\n        currentStyles.container,\n        className\n      )}\n    >\n      {onDismiss && (\n        <button\n          onClick={onDismiss}\n          className='absolute top-2 right-2 md:relative md:top-auto md:right-auto md:flex md:items-center md:justify-end md:ml-3 flex-shrink-0 rounded-md p-2 transition-colors hover:bg-black/5 focus:outline-none focus:ring-2 focus:ring-offset-2'\n          aria-label='Dismiss banner'\n        >\n          <svg\n            className='w-4 h-4 opacity-60'\n            fill='currentColor'\n            viewBox='0 0 20 20'\n          >\n            <path\n              fillRule='evenodd'\n              d='M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z'\n              clipRule='evenodd'\n            />\n          </svg>\n        </button>\n      )}\n      <div\n        className={cn(\n          'flex items-center',\n          title ? 'items-start' : 'items-center',\n          onDismiss ? 'pr-10 md:pr-0' : ''\n        )}\n      >\n        {icon && (\n          <div className={cn('mr-3', title ? 'mt-1' : '', currentStyles.icon)}>\n            {currentStyles.iconSvg}\n          </div>\n        )}\n\n        <div className='flex-1'>\n          {title && (\n            <h3\n              className={cn(\n                'font-semibold',\n                currentStyles.title,\n                titleSizes[titleSize]\n              )}\n            >\n              {title}\n            </h3>\n          )}\n          <p className={cn(currentStyles.description, 'text-sm')}>\n            {description}\n          </p>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nexport { Banner };\n"],"names":["Banner","title","description","type","icon","cta","className","onDismiss","titleSize","typeStyles","jsx","titleSizes","getButtonStyling","variant","size","variants","sizes","cn","currentStyles","renderCTAButton","ctaItem","index","Button","ctaArray","jsxs"],"mappings":"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"}

package/dist/kapwa/banner/index.tsx.js

@@ -1,17 +1,17 @@
 import { j as e } from "../../jsx-runtime-DdAyboqB.js";
-import { c as t } from "../../utils-BWXuiikn.js";
+import { c as n } from "../../utils-BWXuiikn.js";
 import { Button as v } from "../button/index.tsx.js";
-const w = ({
+const y = ({
   title: o,
   description: d,
-  type: h = "default",
-  icon: u = !1,
-  cta: l,
+  type: g = "default",
+  icon: h = !1,
+  cta: i,
   className: c,
   onDismiss: s,
-  titleSize: x = "lg"
+  titleSize: u = "lg"
 }) => {
-  const g = {
+  const m = {
     success: {
       container: "bg-green-50 border border-green-200",
       icon: "text-green-600",
@@ -132,36 +132,36 @@ const w = ({
         }
       )
     }
-  }, m = {
+  }, x = {
     sm: "text-base",
     md: "text-lg",
     lg: "text-xl"
-  }, p = (r = "primary", i = "lg") => {
-    const a = {
-      primary: "bg-primary-500 text-white hover:bg-primary-600 focus:ring-primary-500",
-      secondary: "bg-secondary-500 text-white hover:bg-secondary-600 focus:ring-secondary-500",
-      outline: "bg-transparent border border-gray-300 text-gray-700 hover:bg-gray-50 focus:ring-primary-500",
-      ghost: "bg-transparent text-gray-700 hover:bg-gray-100 focus:ring-gray-500"
+  }, p = (r = "primary", a = "lg") => {
+    const l = {
+      primary: "bg-kapwa-blue-600 text-kapwa-neutral-50 hover:bg-kapwa-blue-700 focus:ring-kapwa-blue-500",
+      secondary: "bg-kapwa-orange-600 text-kapwa-neutral-50 hover:bg-kapwa-orange-700 focus:ring-kapwa-orange-500",
+      outline: "bg-transparent border border-kapwa-gray-300 text-kapwa-gray-700 hover:bg-kapwa-gray-50 focus:ring-kapwa-blue-500",
+      ghost: "bg-transparent text-kapwa-gray-700 hover:bg-kapwa-gray-100 focus:ring-kapwa-gray-500"
     }, b = {
       sm: "text-sm px-3 py-1.5 h-8",
       md: "text-base px-4 py-2 h-10",
       lg: "text-lg px-6 py-3 h-12"
     };
-    return t(
+    return n(
       "inline-flex items-center justify-center rounded-md font-medium transition-colors",
       "focus:outline-hidden focus:ring-2 focus:ring-offset-2",
-      a[r],
-      b[i],
+      l[r],
+      b[a],
       "shadow-xs"
     );
-  }, n = g[h], f = (r, i) => r.href ? /* @__PURE__ */ e.jsx(
+  }, t = m[g], f = (r, a) => r.href ? /* @__PURE__ */ e.jsx(
     "a",
     {
       href: r.href,
       className: p(r.variant, r.size),
       children: r.label
     },
-    i
+    a
   ) : /* @__PURE__ */ e.jsx(
     v,
     {
@@ -170,23 +170,23 @@ const w = ({
       size: r.size || "md",
       children: r.label
     },
-    i
+    a
   );
-  if (l) {
-    const r = Array.isArray(l) ? l : [l];
+  if (i) {
+    const r = Array.isArray(i) ? i : [i];
     return /* @__PURE__ */ e.jsx(
       "div",
       {
-        className: t(
+        className: n(
           "relative rounded-lg p-4",
-          n.container,
+          t.container,
           c
         ),
         children: /* @__PURE__ */ e.jsxs("div", { className: "md:flex items-center", children: [
           /* @__PURE__ */ e.jsxs(
             "div",
             {
-              className: t(
+              className: n(
                 "mb-6 md:mb-0 md:w-2/3 md:pr-8",
                 s ? "pr-10 md:pr-8" : ""
               ),
@@ -194,21 +194,21 @@ const w = ({
                 o && /* @__PURE__ */ e.jsx(
                   "h3",
                   {
-                    className: t(
+                    className: n(
                       "font-semibold mb-2",
-                      n.title,
-                      m[x]
+                      t.title,
+                      x[u]
                     ),
                     children: o
                   }
                 ),
-                /* @__PURE__ */ e.jsx("p", { className: n.description, children: d })
+                /* @__PURE__ */ e.jsx("p", { className: t.description, children: d })
               ]
             }
           ),
           /* @__PURE__ */ e.jsx("div", { className: "md:w-1/3 flex justify-center md:justify-end", children: /* @__PURE__ */ e.jsxs("div", { className: "flex space-x-2 items-center", children: [
             r.map(
-              (i, a) => f(i, a)
+              (a, l) => f(a, l)
             ),
             s && /* @__PURE__ */ e.jsx(
               "button",
@@ -242,9 +242,9 @@ const w = ({
   return /* @__PURE__ */ e.jsxs(
     "div",
     {
-      className: t(
+      className: n(
         "relative flex justify-between rounded-lg p-4",
-        n.container,
+        t.container,
         c
       ),
       children: [
@@ -275,26 +275,26 @@ const w = ({
         /* @__PURE__ */ e.jsxs(
           "div",
           {
-            className: t(
+            className: n(
               "flex items-center",
               o ? "items-start" : "items-center",
               s ? "pr-10 md:pr-0" : ""
             ),
             children: [
-              u && /* @__PURE__ */ e.jsx("div", { className: t("mr-3", o ? "mt-1" : "", n.icon), children: n.iconSvg }),
+              h && /* @__PURE__ */ e.jsx("div", { className: n("mr-3", o ? "mt-1" : "", t.icon), children: t.iconSvg }),
               /* @__PURE__ */ e.jsxs("div", { className: "flex-1", children: [
                 o && /* @__PURE__ */ e.jsx(
                   "h3",
                   {
-                    className: t(
+                    className: n(
                       "font-semibold",
-                      n.title,
-                      m[x]
+                      t.title,
+                      x[u]
                     ),
                     children: o
                   }
                 ),
-                /* @__PURE__ */ e.jsx("p", { className: t(n.description, "text-sm"), children: d })
+                /* @__PURE__ */ e.jsx("p", { className: n(t.description, "text-sm"), children: d })
               ] })
             ]
           }
@@ -304,6 +304,6 @@ const w = ({
   );
 };
 export {
-  w as Banner
+  y as Banner
 };
 //# sourceMappingURL=index.tsx.js.map

package/dist/kapwa/banner/index.tsx.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.tsx.js","sources":["../../../src/kapwa/banner/index.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '@lib/utils';\nimport { Button } from '../button';\n\nexport type BannerType = 'info' | 'warning' | 'error' | 'success' | 'default';\n\nexport interface BannerProps {\n  title?: string;\n  description: string;\n  type?: BannerType;\n  icon?: boolean;\n  cta?:\n    | {\n        label: string;\n        onClick: () => void;\n        href?: string;\n        variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'link';\n        size?: 'sm' | 'md' | 'lg';\n      }\n    | Array<{\n        label: string;\n        onClick: () => void;\n        href?: string;\n        variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'link';\n        size?: 'sm' | 'md' | 'lg';\n      }>;\n  className?: string;\n  onDismiss?: () => void;\n  titleSize?: 'sm' | 'md' | 'lg';\n}\n\nconst Banner: React.FC<BannerProps> = ({\n  title,\n  description,\n  type = 'default',\n  icon = false,\n  cta,\n  className,\n  onDismiss,\n  titleSize = 'lg',\n}) => {\n  const typeStyles = {\n    success: {\n      container: 'bg-green-50 border border-green-200',\n      icon: 'text-green-600',\n      title: 'text-green-800',\n      description: 'text-green-700',\n      iconSvg: (\n        <svg\n          className='h-6 w-6'\n          fill='none'\n          stroke='currentColor'\n          viewBox='0 0 24 24'\n        >\n          <path\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth={2}\n            d='M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z'\n          />\n        </svg>\n      ),\n    },\n    error: {\n      container: 'bg-red-50 border border-red-200',\n      icon: 'text-red-600',\n      title: 'text-red-800',\n      description: 'text-red-700',\n      iconSvg: (\n        <svg\n          className='h-6 w-6'\n          fill='none'\n          stroke='currentColor'\n          viewBox='0 0 24 24'\n        >\n          <path\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth={2}\n            d='M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z'\n          />\n        </svg>\n      ),\n    },\n    warning: {\n      container: 'bg-yellow-50 border border-yellow-200',\n      icon: 'text-yellow-600',\n      title: 'text-yellow-800',\n      description: 'text-yellow-700',\n      iconSvg: (\n        <svg\n          className='h-6 w-6'\n          fill='none'\n          stroke='currentColor'\n          viewBox='0 0 24 24'\n        >\n          <path\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth={2}\n            d='M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z'\n          />\n        </svg>\n      ),\n    },\n    info: {\n      container: 'bg-blue-50 border border-blue-200',\n      icon: 'text-blue-600',\n      title: 'text-blue-800',\n      description: 'text-blue-700',\n      iconSvg: (\n        <svg\n          className='h-6 w-6'\n          fill='none'\n          stroke='currentColor'\n          viewBox='0 0 24 24'\n        >\n          <path\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth={2}\n            d='M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z'\n          />\n        </svg>\n      ),\n    },\n    default: {\n      container: 'bg-gray-50 border border-gray-200',\n      icon: 'text-gray-600',\n      title: 'text-gray-900',\n      description: 'text-gray-800',\n      iconSvg: (\n        <svg\n          className='h-6 w-6'\n          fill='none'\n          stroke='currentColor'\n          viewBox='0 0 24 24'\n        >\n          <path\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth={2}\n            d='M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z'\n          />\n        </svg>\n      ),\n    },\n  };\n\n  const titleSizes = {\n    sm: 'text-base',\n    md: 'text-lg',\n    lg: 'text-xl',\n  };\n\n  const getButtonStyling = (\n    variant: string = 'primary',\n    size: string = 'lg'\n  ) => {\n    const variants = {\n      primary:\n        'bg-primary-500 text-white hover:bg-primary-600 focus:ring-primary-500',\n      secondary:\n        'bg-secondary-500 text-white hover:bg-secondary-600 focus:ring-secondary-500',\n      outline:\n        'bg-transparent border border-gray-300 text-gray-700 hover:bg-gray-50 focus:ring-primary-500',\n      ghost:\n        'bg-transparent text-gray-700 hover:bg-gray-100 focus:ring-gray-500',\n    };\n\n    const sizes = {\n      sm: 'text-sm px-3 py-1.5 h-8',\n      md: 'text-base px-4 py-2 h-10',\n      lg: 'text-lg px-6 py-3 h-12',\n    };\n\n    return cn(\n      'inline-flex items-center justify-center rounded-md font-medium transition-colors',\n      'focus:outline-hidden focus:ring-2 focus:ring-offset-2',\n      variants[variant as keyof typeof variants],\n      sizes[size as keyof typeof sizes],\n      'shadow-xs'\n    );\n  };\n\n  const currentStyles = typeStyles[type];\n\n  // Helper function to render a single CTA button\n  const renderCTAButton = (\n    ctaItem: {\n      label: string;\n      onClick: () => void;\n      href?: string;\n      variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'link';\n      size?: 'sm' | 'md' | 'lg';\n    },\n    index: number\n  ) => {\n    if (ctaItem.href) {\n      return (\n        <a\n          key={index}\n          href={ctaItem.href}\n          className={getButtonStyling(ctaItem.variant, ctaItem.size)}\n        >\n          {ctaItem.label}\n        </a>\n      );\n    }\n\n    return (\n      <Button\n        key={index}\n        onClick={ctaItem.onClick}\n        variant={ctaItem.variant || 'primary'}\n        size={ctaItem.size || 'md'}\n      >\n        {ctaItem.label}\n      </Button>\n    );\n  };\n\n  // CTA button (for banner with button layout)\n  if (cta) {\n    const ctaArray = Array.isArray(cta) ? cta : [cta];\n\n    return (\n      <div\n        className={cn(\n          'relative rounded-lg p-4',\n          currentStyles.container,\n          className\n        )}\n      >\n        <div className='md:flex items-center'>\n          <div\n            className={cn(\n              'mb-6 md:mb-0 md:w-2/3 md:pr-8',\n              onDismiss ? 'pr-10 md:pr-8' : ''\n            )}\n          >\n            {title && (\n              <h3\n                className={cn(\n                  'font-semibold mb-2',\n                  currentStyles.title,\n                  titleSizes[titleSize]\n                )}\n              >\n                {title}\n              </h3>\n            )}\n            <p className={currentStyles.description}>{description}</p>\n          </div>\n          <div className='md:w-1/3 flex justify-center md:justify-end'>\n            <div className='flex space-x-2 items-center'>\n              {ctaArray.map((ctaItem, index) =>\n                renderCTAButton(ctaItem, index)\n              )}\n              {onDismiss && (\n                <button\n                  onClick={onDismiss}\n                  className='absolute top-2 right-2 md:relative md:top-auto md:right-auto rounded-md p-2 transition-colors hover:bg-black/5 focus:outline-none focus:ring-2 focus:ring-offset-2'\n                  aria-label='Dismiss banner'\n                >\n                  <svg\n                    className='w-4 h-4 opacity-60'\n                    fill='currentColor'\n                    viewBox='0 0 20 20'\n                  >\n                    <path\n                      fillRule='evenodd'\n                      d='M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z'\n                      clipRule='evenodd'\n                    />\n                  </svg>\n                </button>\n              )}\n            </div>\n          </div>\n        </div>\n      </div>\n    );\n  }\n\n  // Standard banner layout (with or without icon)\n  return (\n    <div\n      className={cn(\n        'relative flex justify-between rounded-lg p-4',\n        currentStyles.container,\n        className\n      )}\n    >\n      {onDismiss && (\n        <button\n          onClick={onDismiss}\n          className='absolute top-2 right-2 md:relative md:top-auto md:right-auto md:flex md:items-center md:justify-end md:ml-3 flex-shrink-0 rounded-md p-2 transition-colors hover:bg-black/5 focus:outline-none focus:ring-2 focus:ring-offset-2'\n          aria-label='Dismiss banner'\n        >\n          <svg\n            className='w-4 h-4 opacity-60'\n            fill='currentColor'\n            viewBox='0 0 20 20'\n          >\n            <path\n              fillRule='evenodd'\n              d='M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z'\n              clipRule='evenodd'\n            />\n          </svg>\n        </button>\n      )}\n      <div\n        className={cn(\n          'flex items-center',\n          title ? 'items-start' : 'items-center',\n          onDismiss ? 'pr-10 md:pr-0' : ''\n        )}\n      >\n        {icon && (\n          <div className={cn('mr-3', title ? 'mt-1' : '', currentStyles.icon)}>\n            {currentStyles.iconSvg}\n          </div>\n        )}\n\n        <div className='flex-1'>\n          {title && (\n            <h3\n              className={cn(\n                'font-semibold',\n                currentStyles.title,\n                titleSizes[titleSize]\n              )}\n            >\n              {title}\n            </h3>\n          )}\n          <p className={cn(currentStyles.description, 'text-sm')}>\n            {description}\n          </p>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nexport { Banner };\n"],"names":["Banner","title","description","type","icon","cta","className","onDismiss","titleSize","typeStyles","jsx","titleSizes","getButtonStyling","variant","size","variants","sizes","cn","currentStyles","renderCTAButton","ctaItem","index","Button","ctaArray","jsxs"],"mappings":"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"}
+{"version":3,"file":"index.tsx.js","sources":["../../../src/kapwa/banner/index.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '@lib/utils';\nimport { Button } from '../button';\n\nexport type BannerType = 'info' | 'warning' | 'error' | 'success' | 'default';\n\nexport interface BannerProps {\n  title?: string;\n  description: string;\n  type?: BannerType;\n  icon?: boolean;\n  cta?:\n    | {\n        label: string;\n        onClick: () => void;\n        href?: string;\n        variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'link';\n        size?: 'sm' | 'md' | 'lg';\n      }\n    | Array<{\n        label: string;\n        onClick: () => void;\n        href?: string;\n        variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'link';\n        size?: 'sm' | 'md' | 'lg';\n      }>;\n  className?: string;\n  onDismiss?: () => void;\n  titleSize?: 'sm' | 'md' | 'lg';\n}\n\nconst Banner: React.FC<BannerProps> = ({\n  title,\n  description,\n  type = 'default',\n  icon = false,\n  cta,\n  className,\n  onDismiss,\n  titleSize = 'lg',\n}) => {\n  const typeStyles = {\n    success: {\n      container: 'bg-green-50 border border-green-200',\n      icon: 'text-green-600',\n      title: 'text-green-800',\n      description: 'text-green-700',\n      iconSvg: (\n        <svg\n          className='h-6 w-6'\n          fill='none'\n          stroke='currentColor'\n          viewBox='0 0 24 24'\n        >\n          <path\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth={2}\n            d='M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z'\n          />\n        </svg>\n      ),\n    },\n    error: {\n      container: 'bg-red-50 border border-red-200',\n      icon: 'text-red-600',\n      title: 'text-red-800',\n      description: 'text-red-700',\n      iconSvg: (\n        <svg\n          className='h-6 w-6'\n          fill='none'\n          stroke='currentColor'\n          viewBox='0 0 24 24'\n        >\n          <path\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth={2}\n            d='M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z'\n          />\n        </svg>\n      ),\n    },\n    warning: {\n      container: 'bg-yellow-50 border border-yellow-200',\n      icon: 'text-yellow-600',\n      title: 'text-yellow-800',\n      description: 'text-yellow-700',\n      iconSvg: (\n        <svg\n          className='h-6 w-6'\n          fill='none'\n          stroke='currentColor'\n          viewBox='0 0 24 24'\n        >\n          <path\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth={2}\n            d='M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z'\n          />\n        </svg>\n      ),\n    },\n    info: {\n      container: 'bg-blue-50 border border-blue-200',\n      icon: 'text-blue-600',\n      title: 'text-blue-800',\n      description: 'text-blue-700',\n      iconSvg: (\n        <svg\n          className='h-6 w-6'\n          fill='none'\n          stroke='currentColor'\n          viewBox='0 0 24 24'\n        >\n          <path\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth={2}\n            d='M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z'\n          />\n        </svg>\n      ),\n    },\n    default: {\n      container: 'bg-gray-50 border border-gray-200',\n      icon: 'text-gray-600',\n      title: 'text-gray-900',\n      description: 'text-gray-800',\n      iconSvg: (\n        <svg\n          className='h-6 w-6'\n          fill='none'\n          stroke='currentColor'\n          viewBox='0 0 24 24'\n        >\n          <path\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth={2}\n            d='M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z'\n          />\n        </svg>\n      ),\n    },\n  };\n\n  const titleSizes = {\n    sm: 'text-base',\n    md: 'text-lg',\n    lg: 'text-xl',\n  };\n\n  const getButtonStyling = (\n    variant: string = 'primary',\n    size: string = 'lg'\n  ) => {\n    const variants = {\n      primary:\n        'bg-kapwa-blue-600 text-kapwa-neutral-50 hover:bg-kapwa-blue-700 focus:ring-kapwa-blue-500',\n      secondary:\n        'bg-kapwa-orange-600 text-kapwa-neutral-50 hover:bg-kapwa-orange-700 focus:ring-kapwa-orange-500',\n      outline:\n        'bg-transparent border border-kapwa-gray-300 text-kapwa-gray-700 hover:bg-kapwa-gray-50 focus:ring-kapwa-blue-500',\n      ghost:\n        'bg-transparent text-kapwa-gray-700 hover:bg-kapwa-gray-100 focus:ring-kapwa-gray-500',\n    };\n\n    const sizes = {\n      sm: 'text-sm px-3 py-1.5 h-8',\n      md: 'text-base px-4 py-2 h-10',\n      lg: 'text-lg px-6 py-3 h-12',\n    };\n\n    return cn(\n      'inline-flex items-center justify-center rounded-md font-medium transition-colors',\n      'focus:outline-hidden focus:ring-2 focus:ring-offset-2',\n      variants[variant as keyof typeof variants],\n      sizes[size as keyof typeof sizes],\n      'shadow-xs'\n    );\n  };\n\n  const currentStyles = typeStyles[type];\n\n  // Helper function to render a single CTA button\n  const renderCTAButton = (\n    ctaItem: {\n      label: string;\n      onClick: () => void;\n      href?: string;\n      variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'link';\n      size?: 'sm' | 'md' | 'lg';\n    },\n    index: number\n  ) => {\n    if (ctaItem.href) {\n      return (\n        <a\n          key={index}\n          href={ctaItem.href}\n          className={getButtonStyling(ctaItem.variant, ctaItem.size)}\n        >\n          {ctaItem.label}\n        </a>\n      );\n    }\n\n    return (\n      <Button\n        key={index}\n        onClick={ctaItem.onClick}\n        variant={ctaItem.variant || 'primary'}\n        size={ctaItem.size || 'md'}\n      >\n        {ctaItem.label}\n      </Button>\n    );\n  };\n\n  // CTA button (for banner with button layout)\n  if (cta) {\n    const ctaArray = Array.isArray(cta) ? cta : [cta];\n\n    return (\n      <div\n        className={cn(\n          'relative rounded-lg p-4',\n          currentStyles.container,\n          className\n        )}\n      >\n        <div className='md:flex items-center'>\n          <div\n            className={cn(\n              'mb-6 md:mb-0 md:w-2/3 md:pr-8',\n              onDismiss ? 'pr-10 md:pr-8' : ''\n            )}\n          >\n            {title && (\n              <h3\n                className={cn(\n                  'font-semibold mb-2',\n                  currentStyles.title,\n                  titleSizes[titleSize]\n                )}\n              >\n                {title}\n              </h3>\n            )}\n            <p className={currentStyles.description}>{description}</p>\n          </div>\n          <div className='md:w-1/3 flex justify-center md:justify-end'>\n            <div className='flex space-x-2 items-center'>\n              {ctaArray.map((ctaItem, index) =>\n                renderCTAButton(ctaItem, index)\n              )}\n              {onDismiss && (\n                <button\n                  onClick={onDismiss}\n                  className='absolute top-2 right-2 md:relative md:top-auto md:right-auto rounded-md p-2 transition-colors hover:bg-black/5 focus:outline-none focus:ring-2 focus:ring-offset-2'\n                  aria-label='Dismiss banner'\n                >\n                  <svg\n                    className='w-4 h-4 opacity-60'\n                    fill='currentColor'\n                    viewBox='0 0 20 20'\n                  >\n                    <path\n                      fillRule='evenodd'\n                      d='M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z'\n                      clipRule='evenodd'\n                    />\n                  </svg>\n                </button>\n              )}\n            </div>\n          </div>\n        </div>\n      </div>\n    );\n  }\n\n  // Standard banner layout (with or without icon)\n  return (\n    <div\n      className={cn(\n        'relative flex justify-between rounded-lg p-4',\n        currentStyles.container,\n        className\n      )}\n    >\n      {onDismiss && (\n        <button\n          onClick={onDismiss}\n          className='absolute top-2 right-2 md:relative md:top-auto md:right-auto md:flex md:items-center md:justify-end md:ml-3 flex-shrink-0 rounded-md p-2 transition-colors hover:bg-black/5 focus:outline-none focus:ring-2 focus:ring-offset-2'\n          aria-label='Dismiss banner'\n        >\n          <svg\n            className='w-4 h-4 opacity-60'\n            fill='currentColor'\n            viewBox='0 0 20 20'\n          >\n            <path\n              fillRule='evenodd'\n              d='M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z'\n              clipRule='evenodd'\n            />\n          </svg>\n        </button>\n      )}\n      <div\n        className={cn(\n          'flex items-center',\n          title ? 'items-start' : 'items-center',\n          onDismiss ? 'pr-10 md:pr-0' : ''\n        )}\n      >\n        {icon && (\n          <div className={cn('mr-3', title ? 'mt-1' : '', currentStyles.icon)}>\n            {currentStyles.iconSvg}\n          </div>\n        )}\n\n        <div className='flex-1'>\n          {title && (\n            <h3\n              className={cn(\n                'font-semibold',\n                currentStyles.title,\n                titleSizes[titleSize]\n              )}\n            >\n              {title}\n            </h3>\n          )}\n          <p className={cn(currentStyles.description, 'text-sm')}>\n            {description}\n          </p>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nexport { Banner };\n"],"names":["Banner","title","description","type","icon","cta","className","onDismiss","titleSize","typeStyles","jsx","titleSizes","getButtonStyling","variant","size","variants","sizes","cn","currentStyles","renderCTAButton","ctaItem","index","Button","ctaArray","jsxs"],"mappings":"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"}

package/dist/kapwa/button/index.tsx.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("../../jsx-runtime-KWq1EBG2.cjs"),y=require("../../utils-GVl92sVg.cjs"),g=({children:i,className:a,variant:t="primary",size:c="md",fullWidth:l=!1,isLoading:e=!1,leftIcon:s,rightIcon:n,disabled:u,...m})=>{const x={primary:"bg-primary-500 text-white hover:bg-primary-600 focus:ring-primary-500",secondary:"bg-secondary-500 text-white hover:bg-secondary-600 focus:ring-secondary-500",outline:"bg-transparent border border-gray-300 text-gray-700 hover:bg-gray-50 focus:ring-primary-500",ghost:"bg-transparent text-gray-700 hover:bg-gray-100 focus:ring-gray-500",link:"bg-transparent text-primary-500 hover:underline p-0 h-auto focus:ring-0"},p={sm:"text-sm px-3 py-1.5 h-8",md:"text-base px-4 py-2 h-10",lg:"text-lg px-6 py-3 h-12"},o=u||e;return r.jsxRuntimeExports.jsxs("button",{className:y.cn("inline-flex items-center justify-center rounded-md font-medium transition-colors","focus:outline-hidden focus:ring-2 focus:ring-offset-2",x[t],p[c],l?"w-full":"",o?"opacity-60 cursor-not-allowed":"",t!=="link"&&"shadow-xs",a),disabled:o,...m,children:[e&&r.jsxRuntimeExports.jsxs("svg",{className:"animate-spin -ml-1 mr-2 h-4 w-4 text-current",xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",children:[r.jsxRuntimeExports.jsx("circle",{className:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),r.jsxRuntimeExports.jsx("path",{className:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]}),!e&&s&&r.jsxRuntimeExports.jsx("span",{className:"mr-2",children:s}),i,!e&&n&&r.jsxRuntimeExports.jsx("span",{className:"ml-2",children:n})]})};exports.Button=g;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../jsx-runtime-KWq1EBG2.cjs"),g=require("../../utils-GVl92sVg.cjs"),w=({children:o,className:l,variant:a="primary",size:i="md",fullWidth:u=!1,isLoading:t=!1,leftIcon:r,rightIcon:s,disabled:p,...c})=>{const x={primary:"bg-kapwa-blue-600 text-kapwa-neutral-50 hover:bg-kapwa-blue-700 focus:ring-kapwa-blue-500",secondary:"bg-kapwa-orange-600 text-kapwa-neutral-50 hover:bg-kapwa-orange-700 focus:ring-kapwa-orange-500",outline:"bg-transparent border border-kapwa-gray-300 text-kapwa-gray-700 hover:bg-kapwa-gray-50 focus:ring-kapwa-blue-500",ghost:"bg-transparent text-kapwa-gray-700 hover:bg-kapwa-gray-100 focus:ring-kapwa-gray-500",link:"bg-transparent text-kapwa-blue-600 hover:underline p-0 h-auto focus:ring-0"},m={sm:"text-sm px-3 py-1.5 h-8",md:"text-base px-4 py-2 h-10",lg:"text-lg px-6 py-3 h-12"},n=p||t;return e.jsxRuntimeExports.jsxs("button",{className:g.cn("inline-flex items-center justify-center rounded-md font-medium transition-colors","focus:outline-hidden focus:ring-2 focus:ring-offset-2",x[a],m[i],u?"w-full":"",n?"opacity-60 cursor-not-allowed":"",a!=="link"&&"shadow-xs",l),disabled:n,...c,children:[t&&e.jsxRuntimeExports.jsxs("svg",{className:"animate-spin -ml-1 mr-2 h-4 w-4 text-current",xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",children:[e.jsxRuntimeExports.jsx("circle",{className:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),e.jsxRuntimeExports.jsx("path",{className:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]}),!t&&r&&e.jsxRuntimeExports.jsx("span",{className:"mr-2",children:r}),o,!t&&s&&e.jsxRuntimeExports.jsx("span",{className:"ml-2",children:s})]})};exports.Button=w;
 //# sourceMappingURL=index.tsx.cjs.map

package/dist/kapwa/button/index.tsx.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.tsx.cjs","sources":["../../../src/kapwa/button/index.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '@lib/utils';\n\ninterface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  children: React.ReactNode;\n  variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'link';\n  size?: 'sm' | 'md' | 'lg';\n  fullWidth?: boolean;\n  isLoading?: boolean;\n  leftIcon?: React.ReactNode;\n  rightIcon?: React.ReactNode;\n}\n\nconst Button = ({\n  children,\n  className,\n  variant = 'primary',\n  size = 'md',\n  fullWidth = false,\n  isLoading = false,\n  leftIcon,\n  rightIcon,\n  disabled,\n  ...props\n}: ButtonProps) => {\n  const variants = {\n    primary:\n      'bg-primary-500 text-white hover:bg-primary-600 focus:ring-primary-500',\n    secondary:\n      'bg-secondary-500 text-white hover:bg-secondary-600 focus:ring-secondary-500',\n    outline:\n      'bg-transparent border border-gray-300 text-gray-700 hover:bg-gray-50 focus:ring-primary-500',\n    ghost: 'bg-transparent text-gray-700 hover:bg-gray-100 focus:ring-gray-500',\n    link: 'bg-transparent text-primary-500 hover:underline p-0 h-auto focus:ring-0',\n  };\n\n  const sizes = {\n    sm: 'text-sm px-3 py-1.5 h-8',\n    md: 'text-base px-4 py-2 h-10',\n    lg: 'text-lg px-6 py-3 h-12',\n  };\n\n  const isDisabled = disabled || isLoading;\n\n  return (\n    <button\n      className={cn(\n        'inline-flex items-center justify-center rounded-md font-medium transition-colors',\n        'focus:outline-hidden focus:ring-2 focus:ring-offset-2',\n        variants[variant],\n        sizes[size],\n        fullWidth ? 'w-full' : '',\n        isDisabled ? 'opacity-60 cursor-not-allowed' : '',\n        variant !== 'link' && 'shadow-xs',\n        className\n      )}\n      disabled={isDisabled}\n      {...props}\n    >\n      {isLoading && (\n        <svg\n          className='animate-spin -ml-1 mr-2 h-4 w-4 text-current'\n          xmlns='http://www.w3.org/2000/svg'\n          fill='none'\n          viewBox='0 0 24 24'\n        >\n          <circle\n            className='opacity-25'\n            cx='12'\n            cy='12'\n            r='10'\n            stroke='currentColor'\n            strokeWidth='4'\n          ></circle>\n          <path\n            className='opacity-75'\n            fill='currentColor'\n            d='M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z'\n          ></path>\n        </svg>\n      )}\n      {!isLoading && leftIcon && <span className='mr-2'>{leftIcon}</span>}\n      {children}\n      {!isLoading && rightIcon && <span className='ml-2'>{rightIcon}</span>}\n    </button>\n  );\n};\n\nexport { Button };\n"],"names":["Button","children","className","variant","size","fullWidth","isLoading","leftIcon","rightIcon","disabled","props","variants","sizes","isDisabled","jsxs","cn","jsx"],"mappings":"wKAaMA,EAAS,CAAC,CACd,SAAAC,EACA,UAAAC,EACA,QAAAC,EAAU,UACV,KAAAC,EAAO,KACP,UAAAC,EAAY,GACZ,UAAAC,EAAY,GACZ,SAAAC,EACA,UAAAC,EACA,SAAAC,EACA,GAAGC,CACL,IAAmB,CACjB,MAAMC,EAAW,CACf,QACE,wEACF,UACE,8EACF,QACE,8FACF,MAAO,qEACP,KAAM,yEAAA,EAGFC,EAAQ,CACZ,GAAI,0BACJ,GAAI,2BACJ,GAAI,wBAAA,EAGAC,EAAaJ,GAAYH,EAE/B,OACEQ,EAAAA,kBAAAA,KAAC,SAAA,CACC,UAAWC,EAAAA,GACT,mFACA,wDACAJ,EAASR,CAAO,EAChBS,EAAMR,CAAI,EACVC,EAAY,SAAW,GACvBQ,EAAa,gCAAkC,GAC/CV,IAAY,QAAU,YACtBD,CAAA,EAEF,SAAUW,EACT,GAAGH,EAEH,SAAA,CAAAJ,GACCQ,EAAAA,kBAAAA,KAAC,MAAA,CACC,UAAU,+CACV,MAAM,6BACN,KAAK,OACL,QAAQ,YAER,SAAA,CAAAE,EAAAA,kBAAAA,IAAC,SAAA,CACC,UAAU,aACV,GAAG,KACH,GAAG,KACH,EAAE,KACF,OAAO,eACP,YAAY,GAAA,CAAA,EAEdA,EAAAA,kBAAAA,IAAC,OAAA,CACC,UAAU,aACV,KAAK,eACL,EAAE,iHAAA,CAAA,CACH,CAAA,CAAA,EAGJ,CAACV,GAAaC,2BAAa,OAAA,CAAK,UAAU,OAAQ,SAAAA,EAAS,EAC3DN,EACA,CAACK,GAAaE,2BAAc,OAAA,CAAK,UAAU,OAAQ,SAAAA,CAAA,CAAU,CAAA,CAAA,CAAA,CAGpE"}
+{"version":3,"file":"index.tsx.cjs","sources":["../../../src/kapwa/button/index.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '@lib/utils';\n\ninterface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  children: React.ReactNode;\n  variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'link';\n  size?: 'sm' | 'md' | 'lg';\n  fullWidth?: boolean;\n  isLoading?: boolean;\n  leftIcon?: React.ReactNode;\n  rightIcon?: React.ReactNode;\n}\n\nconst Button = ({\n  children,\n  className,\n  variant = 'primary',\n  size = 'md',\n  fullWidth = false,\n  isLoading = false,\n  leftIcon,\n  rightIcon,\n  disabled,\n  ...props\n}: ButtonProps) => {\n  const variants = {\n    primary:\n      'bg-kapwa-blue-600 text-kapwa-neutral-50 hover:bg-kapwa-blue-700 focus:ring-kapwa-blue-500',\n    secondary:\n      'bg-kapwa-orange-600 text-kapwa-neutral-50 hover:bg-kapwa-orange-700 focus:ring-kapwa-orange-500',\n    outline:\n      'bg-transparent border border-kapwa-gray-300 text-kapwa-gray-700 hover:bg-kapwa-gray-50 focus:ring-kapwa-blue-500',\n    ghost: 'bg-transparent text-kapwa-gray-700 hover:bg-kapwa-gray-100 focus:ring-kapwa-gray-500',\n    link: 'bg-transparent text-kapwa-blue-600 hover:underline p-0 h-auto focus:ring-0',\n  };\n\n  const sizes = {\n    sm: 'text-sm px-3 py-1.5 h-8',\n    md: 'text-base px-4 py-2 h-10',\n    lg: 'text-lg px-6 py-3 h-12',\n  };\n\n  const isDisabled = disabled || isLoading;\n\n  return (\n    <button\n      className={cn(\n        'inline-flex items-center justify-center rounded-md font-medium transition-colors',\n        'focus:outline-hidden focus:ring-2 focus:ring-offset-2',\n        variants[variant],\n        sizes[size],\n        fullWidth ? 'w-full' : '',\n        isDisabled ? 'opacity-60 cursor-not-allowed' : '',\n        variant !== 'link' && 'shadow-xs',\n        className\n      )}\n      disabled={isDisabled}\n      {...props}\n    >\n      {isLoading && (\n        <svg\n          className='animate-spin -ml-1 mr-2 h-4 w-4 text-current'\n          xmlns='http://www.w3.org/2000/svg'\n          fill='none'\n          viewBox='0 0 24 24'\n        >\n          <circle\n            className='opacity-25'\n            cx='12'\n            cy='12'\n            r='10'\n            stroke='currentColor'\n            strokeWidth='4'\n          ></circle>\n          <path\n            className='opacity-75'\n            fill='currentColor'\n            d='M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z'\n          ></path>\n        </svg>\n      )}\n      {!isLoading && leftIcon && <span className='mr-2'>{leftIcon}</span>}\n      {children}\n      {!isLoading && rightIcon && <span className='ml-2'>{rightIcon}</span>}\n    </button>\n  );\n};\n\nexport { Button };\n"],"names":["Button","children","className","variant","size","fullWidth","isLoading","leftIcon","rightIcon","disabled","props","variants","sizes","isDisabled","jsxs","cn","jsx"],"mappings":"wKAaMA,EAAS,CAAC,CACd,SAAAC,EACA,UAAAC,EACA,QAAAC,EAAU,UACV,KAAAC,EAAO,KACP,UAAAC,EAAY,GACZ,UAAAC,EAAY,GACZ,SAAAC,EACA,UAAAC,EACA,SAAAC,EACA,GAAGC,CACL,IAAmB,CACjB,MAAMC,EAAW,CACf,QACE,4FACF,UACE,kGACF,QACE,mHACF,MAAO,uFACP,KAAM,4EAAA,EAGFC,EAAQ,CACZ,GAAI,0BACJ,GAAI,2BACJ,GAAI,wBAAA,EAGAC,EAAaJ,GAAYH,EAE/B,OACEQ,EAAAA,kBAAAA,KAAC,SAAA,CACC,UAAWC,EAAAA,GACT,mFACA,wDACAJ,EAASR,CAAO,EAChBS,EAAMR,CAAI,EACVC,EAAY,SAAW,GACvBQ,EAAa,gCAAkC,GAC/CV,IAAY,QAAU,YACtBD,CAAA,EAEF,SAAUW,EACT,GAAGH,EAEH,SAAA,CAAAJ,GACCQ,EAAAA,kBAAAA,KAAC,MAAA,CACC,UAAU,+CACV,MAAM,6BACN,KAAK,OACL,QAAQ,YAER,SAAA,CAAAE,EAAAA,kBAAAA,IAAC,SAAA,CACC,UAAU,aACV,GAAG,KACH,GAAG,KACH,EAAE,KACF,OAAO,eACP,YAAY,GAAA,CAAA,EAEdA,EAAAA,kBAAAA,IAAC,OAAA,CACC,UAAU,aACV,KAAK,eACL,EAAE,iHAAA,CAAA,CACH,CAAA,CAAA,EAGJ,CAACV,GAAaC,2BAAa,OAAA,CAAK,UAAU,OAAQ,SAAAA,EAAS,EAC3DN,EACA,CAACK,GAAaE,2BAAc,OAAA,CAAK,UAAU,OAAQ,SAAAA,CAAA,CAAU,CAAA,CAAA,CAAA,CAGpE"}

package/dist/kapwa/button/index.tsx.js

@@ -1,45 +1,45 @@
-import { j as r } from "../../jsx-runtime-DdAyboqB.js";
-import { c as g } from "../../utils-BWXuiikn.js";
-const h = ({
-  children: n,
-  className: i,
-  variant: s = "primary",
-  size: c = "md",
-  fullWidth: l = !1,
+import { j as a } from "../../jsx-runtime-DdAyboqB.js";
+import { c as x } from "../../utils-BWXuiikn.js";
+const d = ({
+  children: o,
+  className: l,
+  variant: r = "primary",
+  size: p = "md",
+  fullWidth: c = !1,
   isLoading: e = !1,
-  leftIcon: t,
-  rightIcon: a,
-  disabled: m,
-  ...p
+  leftIcon: s,
+  rightIcon: t,
+  disabled: i,
+  ...u
 }) => {
-  const x = {
-    primary: "bg-primary-500 text-white hover:bg-primary-600 focus:ring-primary-500",
-    secondary: "bg-secondary-500 text-white hover:bg-secondary-600 focus:ring-secondary-500",
-    outline: "bg-transparent border border-gray-300 text-gray-700 hover:bg-gray-50 focus:ring-primary-500",
-    ghost: "bg-transparent text-gray-700 hover:bg-gray-100 focus:ring-gray-500",
-    link: "bg-transparent text-primary-500 hover:underline p-0 h-auto focus:ring-0"
-  }, y = {
+  const m = {
+    primary: "bg-kapwa-blue-600 text-kapwa-neutral-50 hover:bg-kapwa-blue-700 focus:ring-kapwa-blue-500",
+    secondary: "bg-kapwa-orange-600 text-kapwa-neutral-50 hover:bg-kapwa-orange-700 focus:ring-kapwa-orange-500",
+    outline: "bg-transparent border border-kapwa-gray-300 text-kapwa-gray-700 hover:bg-kapwa-gray-50 focus:ring-kapwa-blue-500",
+    ghost: "bg-transparent text-kapwa-gray-700 hover:bg-kapwa-gray-100 focus:ring-kapwa-gray-500",
+    link: "bg-transparent text-kapwa-blue-600 hover:underline p-0 h-auto focus:ring-0"
+  }, g = {
     sm: "text-sm px-3 py-1.5 h-8",
     md: "text-base px-4 py-2 h-10",
     lg: "text-lg px-6 py-3 h-12"
-  }, o = m || e;
-  return /* @__PURE__ */ r.jsxs(
+  }, n = i || e;
+  return /* @__PURE__ */ a.jsxs(
     "button",
     {
-      className: g(
+      className: x(
         "inline-flex items-center justify-center rounded-md font-medium transition-colors",
         "focus:outline-hidden focus:ring-2 focus:ring-offset-2",
-        x[s],
-        y[c],
-        l ? "w-full" : "",
-        o ? "opacity-60 cursor-not-allowed" : "",
-        s !== "link" && "shadow-xs",
-        i
+        m[r],
+        g[p],
+        c ? "w-full" : "",
+        n ? "opacity-60 cursor-not-allowed" : "",
+        r !== "link" && "shadow-xs",
+        l
       ),
-      disabled: o,
-      ...p,
+      disabled: n,
+      ...u,
       children: [
-        e && /* @__PURE__ */ r.jsxs(
+        e && /* @__PURE__ */ a.jsxs(
           "svg",
           {
             className: "animate-spin -ml-1 mr-2 h-4 w-4 text-current",
@@ -47,7 +47,7 @@ const h = ({
             fill: "none",
             viewBox: "0 0 24 24",
             children: [
-              /* @__PURE__ */ r.jsx(
+              /* @__PURE__ */ a.jsx(
                 "circle",
                 {
                   className: "opacity-25",
@@ -58,7 +58,7 @@ const h = ({
                   strokeWidth: "4"
                 }
               ),
-              /* @__PURE__ */ r.jsx(
+              /* @__PURE__ */ a.jsx(
                 "path",
                 {
                   className: "opacity-75",
@@ -69,14 +69,14 @@ const h = ({
             ]
           }
         ),
-        !e && t && /* @__PURE__ */ r.jsx("span", { className: "mr-2", children: t }),
-        n,
-        !e && a && /* @__PURE__ */ r.jsx("span", { className: "ml-2", children: a })
+        !e && s && /* @__PURE__ */ a.jsx("span", { className: "mr-2", children: s }),
+        o,
+        !e && t && /* @__PURE__ */ a.jsx("span", { className: "ml-2", children: t })
       ]
     }
   );
 };
 export {
-  h as Button
+  d as Button
 };
 //# sourceMappingURL=index.tsx.js.map

package/dist/kapwa/button/index.tsx.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.tsx.js","sources":["../../../src/kapwa/button/index.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '@lib/utils';\n\ninterface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  children: React.ReactNode;\n  variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'link';\n  size?: 'sm' | 'md' | 'lg';\n  fullWidth?: boolean;\n  isLoading?: boolean;\n  leftIcon?: React.ReactNode;\n  rightIcon?: React.ReactNode;\n}\n\nconst Button = ({\n  children,\n  className,\n  variant = 'primary',\n  size = 'md',\n  fullWidth = false,\n  isLoading = false,\n  leftIcon,\n  rightIcon,\n  disabled,\n  ...props\n}: ButtonProps) => {\n  const variants = {\n    primary:\n      'bg-primary-500 text-white hover:bg-primary-600 focus:ring-primary-500',\n    secondary:\n      'bg-secondary-500 text-white hover:bg-secondary-600 focus:ring-secondary-500',\n    outline:\n      'bg-transparent border border-gray-300 text-gray-700 hover:bg-gray-50 focus:ring-primary-500',\n    ghost: 'bg-transparent text-gray-700 hover:bg-gray-100 focus:ring-gray-500',\n    link: 'bg-transparent text-primary-500 hover:underline p-0 h-auto focus:ring-0',\n  };\n\n  const sizes = {\n    sm: 'text-sm px-3 py-1.5 h-8',\n    md: 'text-base px-4 py-2 h-10',\n    lg: 'text-lg px-6 py-3 h-12',\n  };\n\n  const isDisabled = disabled || isLoading;\n\n  return (\n    <button\n      className={cn(\n        'inline-flex items-center justify-center rounded-md font-medium transition-colors',\n        'focus:outline-hidden focus:ring-2 focus:ring-offset-2',\n        variants[variant],\n        sizes[size],\n        fullWidth ? 'w-full' : '',\n        isDisabled ? 'opacity-60 cursor-not-allowed' : '',\n        variant !== 'link' && 'shadow-xs',\n        className\n      )}\n      disabled={isDisabled}\n      {...props}\n    >\n      {isLoading && (\n        <svg\n          className='animate-spin -ml-1 mr-2 h-4 w-4 text-current'\n          xmlns='http://www.w3.org/2000/svg'\n          fill='none'\n          viewBox='0 0 24 24'\n        >\n          <circle\n            className='opacity-25'\n            cx='12'\n            cy='12'\n            r='10'\n            stroke='currentColor'\n            strokeWidth='4'\n          ></circle>\n          <path\n            className='opacity-75'\n            fill='currentColor'\n            d='M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z'\n          ></path>\n        </svg>\n      )}\n      {!isLoading && leftIcon && <span className='mr-2'>{leftIcon}</span>}\n      {children}\n      {!isLoading && rightIcon && <span className='ml-2'>{rightIcon}</span>}\n    </button>\n  );\n};\n\nexport { Button };\n"],"names":["Button","children","className","variant","size","fullWidth","isLoading","leftIcon","rightIcon","disabled","props","variants","sizes","isDisabled","jsxs","cn","jsx"],"mappings":";;AAaA,MAAMA,IAAS,CAAC;AAAA,EACd,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,MAAAC,IAAO;AAAA,EACP,WAAAC,IAAY;AAAA,EACZ,WAAAC,IAAY;AAAA,EACZ,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,MAAmB;AACjB,QAAMC,IAAW;AAAA,IACf,SACE;AAAA,IACF,WACE;AAAA,IACF,SACE;AAAA,IACF,OAAO;AAAA,IACP,MAAM;AAAA,EAAA,GAGFC,IAAQ;AAAA,IACZ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EAAA,GAGAC,IAAaJ,KAAYH;AAE/B,SACEQ,gBAAAA,EAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACA;AAAA,QACAJ,EAASR,CAAO;AAAA,QAChBS,EAAMR,CAAI;AAAA,QACVC,IAAY,WAAW;AAAA,QACvBQ,IAAa,kCAAkC;AAAA,QAC/CV,MAAY,UAAU;AAAA,QACtBD;AAAA,MAAA;AAAA,MAEF,UAAUW;AAAA,MACT,GAAGH;AAAA,MAEH,UAAA;AAAA,QAAAJ,KACCQ,gBAAAA,EAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,OAAM;AAAA,YACN,MAAK;AAAA,YACL,SAAQ;AAAA,YAER,UAAA;AAAA,cAAAE,gBAAAA,EAAAA;AAAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAU;AAAA,kBACV,IAAG;AAAA,kBACH,IAAG;AAAA,kBACH,GAAE;AAAA,kBACF,QAAO;AAAA,kBACP,aAAY;AAAA,gBAAA;AAAA,cAAA;AAAA,cAEdA,gBAAAA,EAAAA;AAAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAU;AAAA,kBACV,MAAK;AAAA,kBACL,GAAE;AAAA,gBAAA;AAAA,cAAA;AAAA,YACH;AAAA,UAAA;AAAA,QAAA;AAAA,QAGJ,CAACV,KAAaC,2BAAa,QAAA,EAAK,WAAU,QAAQ,UAAAA,GAAS;AAAA,QAC3DN;AAAA,QACA,CAACK,KAAaE,2BAAc,QAAA,EAAK,WAAU,QAAQ,UAAAA,EAAA,CAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGpE;"}
+{"version":3,"file":"index.tsx.js","sources":["../../../src/kapwa/button/index.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '@lib/utils';\n\ninterface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  children: React.ReactNode;\n  variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'link';\n  size?: 'sm' | 'md' | 'lg';\n  fullWidth?: boolean;\n  isLoading?: boolean;\n  leftIcon?: React.ReactNode;\n  rightIcon?: React.ReactNode;\n}\n\nconst Button = ({\n  children,\n  className,\n  variant = 'primary',\n  size = 'md',\n  fullWidth = false,\n  isLoading = false,\n  leftIcon,\n  rightIcon,\n  disabled,\n  ...props\n}: ButtonProps) => {\n  const variants = {\n    primary:\n      'bg-kapwa-blue-600 text-kapwa-neutral-50 hover:bg-kapwa-blue-700 focus:ring-kapwa-blue-500',\n    secondary:\n      'bg-kapwa-orange-600 text-kapwa-neutral-50 hover:bg-kapwa-orange-700 focus:ring-kapwa-orange-500',\n    outline:\n      'bg-transparent border border-kapwa-gray-300 text-kapwa-gray-700 hover:bg-kapwa-gray-50 focus:ring-kapwa-blue-500',\n    ghost: 'bg-transparent text-kapwa-gray-700 hover:bg-kapwa-gray-100 focus:ring-kapwa-gray-500',\n    link: 'bg-transparent text-kapwa-blue-600 hover:underline p-0 h-auto focus:ring-0',\n  };\n\n  const sizes = {\n    sm: 'text-sm px-3 py-1.5 h-8',\n    md: 'text-base px-4 py-2 h-10',\n    lg: 'text-lg px-6 py-3 h-12',\n  };\n\n  const isDisabled = disabled || isLoading;\n\n  return (\n    <button\n      className={cn(\n        'inline-flex items-center justify-center rounded-md font-medium transition-colors',\n        'focus:outline-hidden focus:ring-2 focus:ring-offset-2',\n        variants[variant],\n        sizes[size],\n        fullWidth ? 'w-full' : '',\n        isDisabled ? 'opacity-60 cursor-not-allowed' : '',\n        variant !== 'link' && 'shadow-xs',\n        className\n      )}\n      disabled={isDisabled}\n      {...props}\n    >\n      {isLoading && (\n        <svg\n          className='animate-spin -ml-1 mr-2 h-4 w-4 text-current'\n          xmlns='http://www.w3.org/2000/svg'\n          fill='none'\n          viewBox='0 0 24 24'\n        >\n          <circle\n            className='opacity-25'\n            cx='12'\n            cy='12'\n            r='10'\n            stroke='currentColor'\n            strokeWidth='4'\n          ></circle>\n          <path\n            className='opacity-75'\n            fill='currentColor'\n            d='M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z'\n          ></path>\n        </svg>\n      )}\n      {!isLoading && leftIcon && <span className='mr-2'>{leftIcon}</span>}\n      {children}\n      {!isLoading && rightIcon && <span className='ml-2'>{rightIcon}</span>}\n    </button>\n  );\n};\n\nexport { Button };\n"],"names":["Button","children","className","variant","size","fullWidth","isLoading","leftIcon","rightIcon","disabled","props","variants","sizes","isDisabled","jsxs","cn","jsx"],"mappings":";;AAaA,MAAMA,IAAS,CAAC;AAAA,EACd,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,MAAAC,IAAO;AAAA,EACP,WAAAC,IAAY;AAAA,EACZ,WAAAC,IAAY;AAAA,EACZ,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,MAAmB;AACjB,QAAMC,IAAW;AAAA,IACf,SACE;AAAA,IACF,WACE;AAAA,IACF,SACE;AAAA,IACF,OAAO;AAAA,IACP,MAAM;AAAA,EAAA,GAGFC,IAAQ;AAAA,IACZ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EAAA,GAGAC,IAAaJ,KAAYH;AAE/B,SACEQ,gBAAAA,EAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACA;AAAA,QACAJ,EAASR,CAAO;AAAA,QAChBS,EAAMR,CAAI;AAAA,QACVC,IAAY,WAAW;AAAA,QACvBQ,IAAa,kCAAkC;AAAA,QAC/CV,MAAY,UAAU;AAAA,QACtBD;AAAA,MAAA;AAAA,MAEF,UAAUW;AAAA,MACT,GAAGH;AAAA,MAEH,UAAA;AAAA,QAAAJ,KACCQ,gBAAAA,EAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,OAAM;AAAA,YACN,MAAK;AAAA,YACL,SAAQ;AAAA,YAER,UAAA;AAAA,cAAAE,gBAAAA,EAAAA;AAAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAU;AAAA,kBACV,IAAG;AAAA,kBACH,IAAG;AAAA,kBACH,GAAE;AAAA,kBACF,QAAO;AAAA,kBACP,aAAY;AAAA,gBAAA;AAAA,cAAA;AAAA,cAEdA,gBAAAA,EAAAA;AAAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAU;AAAA,kBACV,MAAK;AAAA,kBACL,GAAE;AAAA,gBAAA;AAAA,cAAA;AAAA,YACH;AAAA,UAAA;AAAA,QAAA;AAAA,QAGJ,CAACV,KAAaC,2BAAa,QAAA,EAAK,WAAU,QAAQ,UAAAA,GAAS;AAAA,QAC3DN;AAAA,QACA,CAACK,KAAaE,2BAAc,QAAA,EAAK,WAAU,QAAQ,UAAAA,EAAA,CAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGpE;"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@betterlb/kapwa",
   "private": false,
-  "version": "1.1.0",
+  "version": "1.1.2",
   "type": "module",
   "files": [
     "dist",