bynana-ui 1.6.0 → 1.6.1

package/dist/apple-activity-card/index.js

@@ -0,0 +1,2 @@
+'use strict';var framerMotion=require('framer-motion'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),jsxRuntime=require('react/jsx-runtime');function c(...e){return tailwindMerge.twMerge(clsx.clsx(e))}var x=({data:e,index:r})=>{let i=(e.size-16)/2,o=i*2*Math.PI,m=(100-e.value)/100*o,n=`gradient-${e.label.toLowerCase()}-${r}`;return jsxRuntime.jsx(framerMotion.motion.div,{className:"absolute inset-0 flex items-center justify-center",initial:{opacity:0,scale:.8},animate:{opacity:1,scale:1},transition:{duration:.8,delay:r*.2,ease:"easeOut"},children:jsxRuntime.jsxs("svg",{width:e.size,height:e.size,viewBox:`0 0 ${e.size} ${e.size}`,className:"transform -rotate-90","aria-label":`${e.label} Activity Progress - ${e.value}%`,children:[jsxRuntime.jsx("title",{children:`${e.label} Activity Progress - ${e.value}%`}),jsxRuntime.jsx("defs",{children:jsxRuntime.jsxs("linearGradient",{id:n,x1:"0%",y1:"0%",x2:"100%",y2:"100%",children:[jsxRuntime.jsx("stop",{offset:"0%",style:{stopColor:e.color,stopOpacity:1}}),jsxRuntime.jsx("stop",{offset:"100%",style:{stopColor:e.color==="#FF2D55"?"#FF6B8B":e.color==="#A3F900"?"#C5FF4D":"#4DDFED",stopOpacity:1}})]})}),jsxRuntime.jsx("circle",{cx:e.size/2,cy:e.size/2,r:i,fill:"none",stroke:"currentColor",strokeWidth:16,className:"text-zinc-200/50 dark:text-zinc-800/50"}),jsxRuntime.jsx(framerMotion.motion.circle,{cx:e.size/2,cy:e.size/2,r:i,fill:"none",stroke:`url(#${n})`,strokeWidth:16,strokeDasharray:o,initial:{strokeDashoffset:o},animate:{strokeDashoffset:m},transition:{duration:1.8,delay:r*.2,ease:"easeInOut"},strokeLinecap:"round",style:{filter:"drop-shadow(0 0 6px rgba(0,0,0,0.15))"}})]})})},d=[{label:"MOVE",value:85,color:"#FF2D55",size:200,current:479,target:800,unit:"CAL"},{label:"EXERCISE",value:60,color:"#A3F900",size:160,current:24,target:30,unit:"MIN"},{label:"STAND",value:30,color:"#04C7DD",size:120,current:6,target:12,unit:"HR"}];function b({title:e="Activity Rings",className:r,activities:a=d}){return jsxRuntime.jsx("div",{className:c("relative w-full max-w-3xl mx-auto p-8 rounded-3xl text-zinc-900 dark:text-white",r),children:jsxRuntime.jsxs("div",{className:"flex flex-col items-center gap-8",children:[jsxRuntime.jsx(framerMotion.motion.h2,{className:"text-2xl font-medium text-zinc-900 dark:text-white",initial:{opacity:0,y:-20},animate:{opacity:1,y:0},transition:{duration:.5},children:e}),jsxRuntime.jsxs("div",{className:"flex items-center",children:[jsxRuntime.jsx("div",{className:"relative w-[180px] h-[180px]",children:a.map((i,o)=>jsxRuntime.jsx(x,{data:i,index:o},i.label))}),jsxRuntime.jsx(framerMotion.motion.div,{className:"flex flex-col gap-6 ml-8",initial:{opacity:0,x:20},animate:{opacity:1,x:0},transition:{duration:.5,delay:.3},children:a.map(i=>jsxRuntime.jsxs("div",{className:"flex flex-col",children:[jsxRuntime.jsx("span",{className:"text-sm font-medium text-zinc-600 dark:text-zinc-400",children:i.label}),jsxRuntime.jsxs("span",{className:"text-2xl font-semibold",style:{color:i.color},children:[i.current,"/",i.target,jsxRuntime.jsx("span",{className:"text-base ml-1 text-zinc-600 dark:text-zinc-400",children:i.unit})]})]},i.label))})]})]})})}exports.AppleActivityCard=b;//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/apple-activity-card/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/utils/cn.ts","../../src/apple-activity-card/index.tsx"],"names":["cn","inputs","twMerge","clsx","CircleProgress","data","index","radius","circumference","progress","gradientId","jsx","motion","jsxs","defaultActivities","AppleActivityCard","title","className","activities","activity"],"mappings":"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","file":"index.js","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\r\nimport { twMerge } from \"tailwind-merge\";\r\n\r\nexport function cn(...inputs: ClassValue[]) {\r\n  return twMerge(clsx(inputs));\r\n}\r\n","\"use client\";\r\n\r\nimport { motion } from \"framer-motion\";\r\nimport { cn } from \"../utils/cn\";\r\n\r\ninterface ActivityData {\r\n  label: string;\r\n  value: number;\r\n  color: string;\r\n  size: number;\r\n  current: number;\r\n  target: number;\r\n  unit: string;\r\n}\r\n\r\ninterface CircleProgressProps {\r\n  data: ActivityData;\r\n  index: number;\r\n}\r\n\r\nconst CircleProgress = ({ data, index }: CircleProgressProps) => {\r\n  const strokeWidth = 16;\r\n  const radius = (data.size - strokeWidth) / 2;\r\n  const circumference = radius * 2 * Math.PI;\r\n  const progress = ((100 - data.value) / 100) * circumference;\r\n  const gradientId = `gradient-${data.label.toLowerCase()}-${index}`;\r\n\r\n  return (\r\n    <motion.div\r\n      className=\"absolute inset-0 flex items-center justify-center\"\r\n      initial={{ opacity: 0, scale: 0.8 }}\r\n      animate={{ opacity: 1, scale: 1 }}\r\n      transition={{ duration: 0.8, delay: index * 0.2, ease: \"easeOut\" }}\r\n    >\r\n      <svg\r\n        width={data.size}\r\n        height={data.size}\r\n        viewBox={`0 0 ${data.size} ${data.size}`}\r\n        className=\"transform -rotate-90\"\r\n        aria-label={`${data.label} Activity Progress - ${data.value}%`}\r\n      >\r\n        <title>{`${data.label} Activity Progress - ${data.value}%`}</title>\r\n        <defs>\r\n          <linearGradient id={gradientId} x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"100%\">\r\n            <stop offset=\"0%\" style={{ stopColor: data.color, stopOpacity: 1 }} />\r\n            <stop\r\n              offset=\"100%\"\r\n              style={{\r\n                stopColor: data.color === \"#FF2D55\" ? \"#FF6B8B\" : data.color === \"#A3F900\" ? \"#C5FF4D\" : \"#4DDFED\",\r\n                stopOpacity: 1,\r\n              }}\r\n            />\r\n          </linearGradient>\r\n        </defs>\r\n        <circle\r\n          cx={data.size / 2}\r\n          cy={data.size / 2}\r\n          r={radius}\r\n          fill=\"none\"\r\n          stroke=\"currentColor\"\r\n          strokeWidth={strokeWidth}\r\n          className=\"text-zinc-200/50 dark:text-zinc-800/50\"\r\n        />\r\n        <motion.circle\r\n          cx={data.size / 2}\r\n          cy={data.size / 2}\r\n          r={radius}\r\n          fill=\"none\"\r\n          stroke={`url(#${gradientId})`}\r\n          strokeWidth={strokeWidth}\r\n          strokeDasharray={circumference}\r\n          initial={{ strokeDashoffset: circumference }}\r\n          animate={{ strokeDashoffset: progress }}\r\n          transition={{ duration: 1.8, delay: index * 0.2, ease: \"easeInOut\" }}\r\n          strokeLinecap=\"round\"\r\n          style={{ filter: \"drop-shadow(0 0 6px rgba(0,0,0,0.15))\" }}\r\n        />\r\n      </svg>\r\n    </motion.div>\r\n  );\r\n};\r\n\r\ninterface AppleActivityCardProps {\r\n  title?: string;\r\n  className?: string;\r\n  activities?: ActivityData[];\r\n}\r\n\r\nconst defaultActivities: ActivityData[] = [\r\n  { label: \"MOVE\", value: 85, color: \"#FF2D55\", size: 200, current: 479, target: 800, unit: \"CAL\" },\r\n  { label: \"EXERCISE\", value: 60, color: \"#A3F900\", size: 160, current: 24, target: 30, unit: \"MIN\" },\r\n  { label: \"STAND\", value: 30, color: \"#04C7DD\", size: 120, current: 6, target: 12, unit: \"HR\" },\r\n];\r\n\r\nexport function AppleActivityCard({ title = \"Activity Rings\", className, activities = defaultActivities }: AppleActivityCardProps) {\r\n  return (\r\n    <div className={cn(\"relative w-full max-w-3xl mx-auto p-8 rounded-3xl text-zinc-900 dark:text-white\", className)}>\r\n      <div className=\"flex flex-col items-center gap-8\">\r\n        <motion.h2\r\n          className=\"text-2xl font-medium text-zinc-900 dark:text-white\"\r\n          initial={{ opacity: 0, y: -20 }}\r\n          animate={{ opacity: 1, y: 0 }}\r\n          transition={{ duration: 0.5 }}\r\n        >\r\n          {title}\r\n        </motion.h2>\r\n        <div className=\"flex items-center\">\r\n          <div className=\"relative w-[180px] h-[180px]\">\r\n            {activities.map((activity, index) => (\r\n              <CircleProgress key={activity.label} data={activity} index={index} />\r\n            ))}\r\n          </div>\r\n          <motion.div\r\n            className=\"flex flex-col gap-6 ml-8\"\r\n            initial={{ opacity: 0, x: 20 }}\r\n            animate={{ opacity: 1, x: 0 }}\r\n            transition={{ duration: 0.5, delay: 0.3 }}\r\n          >\r\n            {activities.map((activity) => (\r\n              <div key={activity.label} className=\"flex flex-col\">\r\n                <span className=\"text-sm font-medium text-zinc-600 dark:text-zinc-400\">{activity.label}</span>\r\n                <span className=\"text-2xl font-semibold\" style={{ color: activity.color }}>\r\n                  {activity.current}/{activity.target}\r\n                  <span className=\"text-base ml-1 text-zinc-600 dark:text-zinc-400\">{activity.unit}</span>\r\n                </span>\r\n              </div>\r\n            ))}\r\n          </motion.div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  );\r\n}\r\n\r\nexport type { ActivityData };\r\n"]}

package/dist/apple-activity-card/index.mjs

@@ -0,0 +1,2 @@
+import {motion}from'framer-motion';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';import {jsx,jsxs}from'react/jsx-runtime';function c(...e){return twMerge(clsx(e))}var x=({data:e,index:r})=>{let i=(e.size-16)/2,o=i*2*Math.PI,m=(100-e.value)/100*o,n=`gradient-${e.label.toLowerCase()}-${r}`;return jsx(motion.div,{className:"absolute inset-0 flex items-center justify-center",initial:{opacity:0,scale:.8},animate:{opacity:1,scale:1},transition:{duration:.8,delay:r*.2,ease:"easeOut"},children:jsxs("svg",{width:e.size,height:e.size,viewBox:`0 0 ${e.size} ${e.size}`,className:"transform -rotate-90","aria-label":`${e.label} Activity Progress - ${e.value}%`,children:[jsx("title",{children:`${e.label} Activity Progress - ${e.value}%`}),jsx("defs",{children:jsxs("linearGradient",{id:n,x1:"0%",y1:"0%",x2:"100%",y2:"100%",children:[jsx("stop",{offset:"0%",style:{stopColor:e.color,stopOpacity:1}}),jsx("stop",{offset:"100%",style:{stopColor:e.color==="#FF2D55"?"#FF6B8B":e.color==="#A3F900"?"#C5FF4D":"#4DDFED",stopOpacity:1}})]})}),jsx("circle",{cx:e.size/2,cy:e.size/2,r:i,fill:"none",stroke:"currentColor",strokeWidth:16,className:"text-zinc-200/50 dark:text-zinc-800/50"}),jsx(motion.circle,{cx:e.size/2,cy:e.size/2,r:i,fill:"none",stroke:`url(#${n})`,strokeWidth:16,strokeDasharray:o,initial:{strokeDashoffset:o},animate:{strokeDashoffset:m},transition:{duration:1.8,delay:r*.2,ease:"easeInOut"},strokeLinecap:"round",style:{filter:"drop-shadow(0 0 6px rgba(0,0,0,0.15))"}})]})})},d=[{label:"MOVE",value:85,color:"#FF2D55",size:200,current:479,target:800,unit:"CAL"},{label:"EXERCISE",value:60,color:"#A3F900",size:160,current:24,target:30,unit:"MIN"},{label:"STAND",value:30,color:"#04C7DD",size:120,current:6,target:12,unit:"HR"}];function b({title:e="Activity Rings",className:r,activities:a=d}){return jsx("div",{className:c("relative w-full max-w-3xl mx-auto p-8 rounded-3xl text-zinc-900 dark:text-white",r),children:jsxs("div",{className:"flex flex-col items-center gap-8",children:[jsx(motion.h2,{className:"text-2xl font-medium text-zinc-900 dark:text-white",initial:{opacity:0,y:-20},animate:{opacity:1,y:0},transition:{duration:.5},children:e}),jsxs("div",{className:"flex items-center",children:[jsx("div",{className:"relative w-[180px] h-[180px]",children:a.map((i,o)=>jsx(x,{data:i,index:o},i.label))}),jsx(motion.div,{className:"flex flex-col gap-6 ml-8",initial:{opacity:0,x:20},animate:{opacity:1,x:0},transition:{duration:.5,delay:.3},children:a.map(i=>jsxs("div",{className:"flex flex-col",children:[jsx("span",{className:"text-sm font-medium text-zinc-600 dark:text-zinc-400",children:i.label}),jsxs("span",{className:"text-2xl font-semibold",style:{color:i.color},children:[i.current,"/",i.target,jsx("span",{className:"text-base ml-1 text-zinc-600 dark:text-zinc-400",children:i.unit})]})]},i.label))})]})]})})}export{b as AppleActivityCard};//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.mjs.map

package/dist/apple-activity-card/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/utils/cn.ts","../../src/apple-activity-card/index.tsx"],"names":["cn","inputs","twMerge","clsx","CircleProgress","data","index","radius","circumference","progress","gradientId","jsx","motion","jsxs","defaultActivities","AppleActivityCard","title","className","activities","activity"],"mappings":"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","file":"index.mjs","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\r\nimport { twMerge } from \"tailwind-merge\";\r\n\r\nexport function cn(...inputs: ClassValue[]) {\r\n  return twMerge(clsx(inputs));\r\n}\r\n","\"use client\";\r\n\r\nimport { motion } from \"framer-motion\";\r\nimport { cn } from \"../utils/cn\";\r\n\r\ninterface ActivityData {\r\n  label: string;\r\n  value: number;\r\n  color: string;\r\n  size: number;\r\n  current: number;\r\n  target: number;\r\n  unit: string;\r\n}\r\n\r\ninterface CircleProgressProps {\r\n  data: ActivityData;\r\n  index: number;\r\n}\r\n\r\nconst CircleProgress = ({ data, index }: CircleProgressProps) => {\r\n  const strokeWidth = 16;\r\n  const radius = (data.size - strokeWidth) / 2;\r\n  const circumference = radius * 2 * Math.PI;\r\n  const progress = ((100 - data.value) / 100) * circumference;\r\n  const gradientId = `gradient-${data.label.toLowerCase()}-${index}`;\r\n\r\n  return (\r\n    <motion.div\r\n      className=\"absolute inset-0 flex items-center justify-center\"\r\n      initial={{ opacity: 0, scale: 0.8 }}\r\n      animate={{ opacity: 1, scale: 1 }}\r\n      transition={{ duration: 0.8, delay: index * 0.2, ease: \"easeOut\" }}\r\n    >\r\n      <svg\r\n        width={data.size}\r\n        height={data.size}\r\n        viewBox={`0 0 ${data.size} ${data.size}`}\r\n        className=\"transform -rotate-90\"\r\n        aria-label={`${data.label} Activity Progress - ${data.value}%`}\r\n      >\r\n        <title>{`${data.label} Activity Progress - ${data.value}%`}</title>\r\n        <defs>\r\n          <linearGradient id={gradientId} x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"100%\">\r\n            <stop offset=\"0%\" style={{ stopColor: data.color, stopOpacity: 1 }} />\r\n            <stop\r\n              offset=\"100%\"\r\n              style={{\r\n                stopColor: data.color === \"#FF2D55\" ? \"#FF6B8B\" : data.color === \"#A3F900\" ? \"#C5FF4D\" : \"#4DDFED\",\r\n                stopOpacity: 1,\r\n              }}\r\n            />\r\n          </linearGradient>\r\n        </defs>\r\n        <circle\r\n          cx={data.size / 2}\r\n          cy={data.size / 2}\r\n          r={radius}\r\n          fill=\"none\"\r\n          stroke=\"currentColor\"\r\n          strokeWidth={strokeWidth}\r\n          className=\"text-zinc-200/50 dark:text-zinc-800/50\"\r\n        />\r\n        <motion.circle\r\n          cx={data.size / 2}\r\n          cy={data.size / 2}\r\n          r={radius}\r\n          fill=\"none\"\r\n          stroke={`url(#${gradientId})`}\r\n          strokeWidth={strokeWidth}\r\n          strokeDasharray={circumference}\r\n          initial={{ strokeDashoffset: circumference }}\r\n          animate={{ strokeDashoffset: progress }}\r\n          transition={{ duration: 1.8, delay: index * 0.2, ease: \"easeInOut\" }}\r\n          strokeLinecap=\"round\"\r\n          style={{ filter: \"drop-shadow(0 0 6px rgba(0,0,0,0.15))\" }}\r\n        />\r\n      </svg>\r\n    </motion.div>\r\n  );\r\n};\r\n\r\ninterface AppleActivityCardProps {\r\n  title?: string;\r\n  className?: string;\r\n  activities?: ActivityData[];\r\n}\r\n\r\nconst defaultActivities: ActivityData[] = [\r\n  { label: \"MOVE\", value: 85, color: \"#FF2D55\", size: 200, current: 479, target: 800, unit: \"CAL\" },\r\n  { label: \"EXERCISE\", value: 60, color: \"#A3F900\", size: 160, current: 24, target: 30, unit: \"MIN\" },\r\n  { label: \"STAND\", value: 30, color: \"#04C7DD\", size: 120, current: 6, target: 12, unit: \"HR\" },\r\n];\r\n\r\nexport function AppleActivityCard({ title = \"Activity Rings\", className, activities = defaultActivities }: AppleActivityCardProps) {\r\n  return (\r\n    <div className={cn(\"relative w-full max-w-3xl mx-auto p-8 rounded-3xl text-zinc-900 dark:text-white\", className)}>\r\n      <div className=\"flex flex-col items-center gap-8\">\r\n        <motion.h2\r\n          className=\"text-2xl font-medium text-zinc-900 dark:text-white\"\r\n          initial={{ opacity: 0, y: -20 }}\r\n          animate={{ opacity: 1, y: 0 }}\r\n          transition={{ duration: 0.5 }}\r\n        >\r\n          {title}\r\n        </motion.h2>\r\n        <div className=\"flex items-center\">\r\n          <div className=\"relative w-[180px] h-[180px]\">\r\n            {activities.map((activity, index) => (\r\n              <CircleProgress key={activity.label} data={activity} index={index} />\r\n            ))}\r\n          </div>\r\n          <motion.div\r\n            className=\"flex flex-col gap-6 ml-8\"\r\n            initial={{ opacity: 0, x: 20 }}\r\n            animate={{ opacity: 1, x: 0 }}\r\n            transition={{ duration: 0.5, delay: 0.3 }}\r\n          >\r\n            {activities.map((activity) => (\r\n              <div key={activity.label} className=\"flex flex-col\">\r\n                <span className=\"text-sm font-medium text-zinc-600 dark:text-zinc-400\">{activity.label}</span>\r\n                <span className=\"text-2xl font-semibold\" style={{ color: activity.color }}>\r\n                  {activity.current}/{activity.target}\r\n                  <span className=\"text-base ml-1 text-zinc-600 dark:text-zinc-400\">{activity.unit}</span>\r\n                </span>\r\n              </div>\r\n            ))}\r\n          </motion.div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  );\r\n}\r\n\r\nexport type { ActivityData };\r\n"]}

package/dist/bento-grid/index.js

@@ -0,0 +1,2 @@
+'use strict';var clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),jsxRuntime=require('react/jsx-runtime');function t(...r){return tailwindMerge.twMerge(clsx.clsx(r))}function h({children:r,className:a}){return jsxRuntime.jsx("div",{className:t("grid w-full auto-rows-[22rem] grid-cols-3 gap-4",a),children:r})}function k({name:r,className:a,background:o,Icon:i,description:p,href:n,cta:l,onClick:d}){return jsxRuntime.jsxs(n?"a":"div",{...n?{href:n,target:"_blank",rel:"noopener noreferrer"}:{},onClick:d,className:t("group relative col-span-3 flex flex-col justify-between overflow-hidden rounded-xl cursor-pointer","bg-white [box-shadow:0_0_0_1px_rgba(0,0,0,.03),0_2px_4px_rgba(0,0,0,.05),0_12px_24px_rgba(0,0,0,.05)]","transform-gpu dark:bg-black dark:[border:1px_solid_rgba(255,255,255,.1)] dark:[box-shadow:0_-20px_80px_-20px_#ffffff1f_inset]",a),children:[typeof o=="string"?jsxRuntime.jsx("div",{className:t("absolute inset-0",o)}):jsxRuntime.jsx("div",{className:"absolute inset-0",children:o}),jsxRuntime.jsxs("div",{className:"pointer-events-none z-10 flex transform-gpu flex-col gap-1 p-6 transition-all duration-300 group-hover:-translate-y-10",children:[i&&jsxRuntime.jsx(i,{className:"h-12 w-12 origin-left transform-gpu text-neutral-700 transition-all duration-300 ease-in-out group-hover:scale-75 dark:text-neutral-300"}),jsxRuntime.jsx("h3",{className:"text-xl font-semibold text-neutral-700 dark:text-neutral-300",children:r}),jsxRuntime.jsx("p",{className:"max-w-lg text-neutral-400",children:p})]}),l&&jsxRuntime.jsx("div",{className:"pointer-events-none absolute bottom-0 flex w-full translate-y-10 transform-gpu flex-row items-center p-4 opacity-0 transition-all duration-300 group-hover:translate-y-0 group-hover:opacity-100",children:jsxRuntime.jsxs("span",{className:"pointer-events-auto ml-auto flex items-center gap-2 rounded-lg bg-black px-4 py-2 text-white dark:bg-white dark:text-black",children:[l,jsxRuntime.jsx("svg",{className:"ml-2 h-4 w-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:jsxRuntime.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M9 5l7 7-7 7"})})]})}),jsxRuntime.jsx("div",{className:"pointer-events-none absolute inset-0 transform-gpu transition-all duration-300 group-hover:bg-black/[.03] group-hover:dark:bg-neutral-800/10"})]})}exports.BentoCard=k;exports.BentoGrid=h;//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/bento-grid/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/utils/cn.ts","../../src/bento-grid/index.tsx"],"names":["cn","inputs","twMerge","clsx","BentoGrid","children","className","jsx","BentoCard","name","background","Icon","description","href","cta","onClick","jsxs"],"mappings":"sHAGO,SAASA,CAAAA,CAAAA,GAAMC,CAAAA,CAAsB,CAC1C,OAAOC,qBAAAA,CAAQC,SAAAA,CAAKF,CAAM,CAAC,CAC7B,CCgBO,SAASG,CAAAA,CAAU,CAAE,QAAA,CAAAC,CAAAA,CAAU,UAAAC,CAAU,CAAA,CAAmB,CACjE,OAAOC,cAAAA,CAAC,OAAI,SAAA,CAAWP,CAAAA,CAAG,kDAAmDM,CAAS,CAAA,CAAI,SAAAD,CAAAA,CAAS,CACrG,CAEO,SAASG,EAAU,CAAE,IAAA,CAAAC,EAAM,SAAA,CAAAH,CAAAA,CAAW,WAAAI,CAAAA,CAAY,IAAA,CAAAC,EAAM,WAAA,CAAAC,CAAAA,CAAa,KAAAC,CAAAA,CAAM,GAAA,CAAAC,EAAK,OAAA,CAAAC,CAAQ,EAAmB,CAIhH,OACEC,eAAAA,CAJcH,CAAAA,CAAO,IAAM,KAAA,CAI1B,CACE,GAJgBA,CAAAA,CAAO,CAAE,KAAAA,CAAAA,CAAM,MAAA,CAAQ,SAAU,GAAA,CAAK,qBAAsB,EAAI,EAAC,CAKlF,QAASE,CAAAA,CACT,SAAA,CAAWf,EACT,mGAAA,CACA,uGAAA,CACA,+HAAA,CACAM,CACF,EAEC,QAAA,CAAA,CAAA,OAAOI,CAAAA,EAAe,SACrBH,cAAAA,CAAC,KAAA,CAAA,CAAI,UAAWP,CAAAA,CAAG,kBAAA,CAAoBU,CAAU,CAAA,CAAG,CAAA,CAEpDH,eAAC,KAAA,CAAA,CAAI,SAAA,CAAU,mBAAoB,QAAA,CAAAG,CAAAA,CAAW,EAGhDM,eAAAA,CAAC,KAAA,CAAA,CAAI,SAAA,CAAU,wHAAA,CACZ,UAAAL,CAAAA,EACCJ,cAAAA,CAACI,EAAA,CAAK,SAAA,CAAU,0IAA0I,CAAA,CAE5JJ,cAAAA,CAAC,MAAG,SAAA,CAAU,8DAAA,CAAgE,SAAAE,CAAAA,CAAK,CAAA,CACnFF,eAAC,GAAA,CAAA,CAAE,SAAA,CAAU,4BAA6B,QAAA,CAAAK,CAAAA,CAAY,CAAA,CAAA,CACxD,CAAA,CAECE,GACCP,cAAAA,CAAC,KAAA,CAAA,CAAI,UAAU,kMAAA,CACb,QAAA,CAAAS,gBAAC,MAAA,CAAA,CAAK,SAAA,CAAU,6HACb,QAAA,CAAA,CAAAF,CAAAA,CACDP,eAAC,KAAA,CAAA,CAAI,SAAA,CAAU,eAAe,IAAA,CAAK,MAAA,CAAO,OAAO,cAAA,CAAe,OAAA,CAAQ,WAAA,CACtE,QAAA,CAAAA,eAAC,MAAA,CAAA,CAAK,aAAA,CAAc,QAAQ,cAAA,CAAe,OAAA,CAAQ,YAAa,CAAA,CAAG,CAAA,CAAE,eAAe,CAAA,CACtF,CAAA,CAAA,CACF,EACF,CAAA,CAEFA,cAAAA,CAAC,OAAI,SAAA,CAAU,8IAAA,CAA+I,GAChK,CAEJ","file":"index.js","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\r\nimport { twMerge } from \"tailwind-merge\";\r\n\r\nexport function cn(...inputs: ClassValue[]) {\r\n  return twMerge(clsx(inputs));\r\n}\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport { cn } from \"../utils/cn\";\r\n\r\ninterface BentoCardProps {\r\n  name: string;\r\n  className?: string;\r\n  background?: React.ReactNode | string;\r\n  Icon?: React.ComponentType<{ className?: string }>;\r\n  description: string;\r\n  href?: string;\r\n  cta?: string;\r\n  onClick?: () => void;\r\n}\r\n\r\ninterface BentoGridProps {\r\n  children: React.ReactNode;\r\n  className?: string;\r\n}\r\n\r\nexport function BentoGrid({ children, className }: BentoGridProps) {\r\n  return <div className={cn(\"grid w-full auto-rows-[22rem] grid-cols-3 gap-4\", className)}>{children}</div>;\r\n}\r\n\r\nexport function BentoCard({ name, className, background, Icon, description, href, cta, onClick }: BentoCardProps) {\r\n  const Wrapper = href ? \"a\" : \"div\";\r\n  const wrapperProps = href ? { href, target: \"_blank\", rel: \"noopener noreferrer\" } : {};\r\n\r\n  return (\r\n    <Wrapper\r\n      {...wrapperProps}\r\n      onClick={onClick}\r\n      className={cn(\r\n        \"group relative col-span-3 flex flex-col justify-between overflow-hidden rounded-xl cursor-pointer\",\r\n        \"bg-white [box-shadow:0_0_0_1px_rgba(0,0,0,.03),0_2px_4px_rgba(0,0,0,.05),0_12px_24px_rgba(0,0,0,.05)]\",\r\n        \"transform-gpu dark:bg-black dark:[border:1px_solid_rgba(255,255,255,.1)] dark:[box-shadow:0_-20px_80px_-20px_#ffffff1f_inset]\",\r\n        className\r\n      )}\r\n    >\r\n      {typeof background === \"string\" ? (\r\n        <div className={cn(\"absolute inset-0\", background)} />\r\n      ) : (\r\n        <div className=\"absolute inset-0\">{background}</div>\r\n      )}\r\n\r\n      <div className=\"pointer-events-none z-10 flex transform-gpu flex-col gap-1 p-6 transition-all duration-300 group-hover:-translate-y-10\">\r\n        {Icon && (\r\n          <Icon className=\"h-12 w-12 origin-left transform-gpu text-neutral-700 transition-all duration-300 ease-in-out group-hover:scale-75 dark:text-neutral-300\" />\r\n        )}\r\n        <h3 className=\"text-xl font-semibold text-neutral-700 dark:text-neutral-300\">{name}</h3>\r\n        <p className=\"max-w-lg text-neutral-400\">{description}</p>\r\n      </div>\r\n\r\n      {cta && (\r\n        <div className=\"pointer-events-none absolute bottom-0 flex w-full translate-y-10 transform-gpu flex-row items-center p-4 opacity-0 transition-all duration-300 group-hover:translate-y-0 group-hover:opacity-100\">\r\n          <span className=\"pointer-events-auto ml-auto flex items-center gap-2 rounded-lg bg-black px-4 py-2 text-white dark:bg-white dark:text-black\">\r\n            {cta}\r\n            <svg className=\"ml-2 h-4 w-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n              <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M9 5l7 7-7 7\" />\r\n            </svg>\r\n          </span>\r\n        </div>\r\n      )}\r\n      <div className=\"pointer-events-none absolute inset-0 transform-gpu transition-all duration-300 group-hover:bg-black/[.03] group-hover:dark:bg-neutral-800/10\" />\r\n    </Wrapper>\r\n  );\r\n}\r\n\r\nexport type { BentoCardProps, BentoGridProps };\r\n"]}

package/dist/bento-grid/index.mjs

@@ -0,0 +1,2 @@
+import {clsx}from'clsx';import {twMerge}from'tailwind-merge';import {jsx,jsxs}from'react/jsx-runtime';function t(...r){return twMerge(clsx(r))}function h({children:r,className:a}){return jsx("div",{className:t("grid w-full auto-rows-[22rem] grid-cols-3 gap-4",a),children:r})}function k({name:r,className:a,background:o,Icon:i,description:p,href:n,cta:l,onClick:d}){return jsxs(n?"a":"div",{...n?{href:n,target:"_blank",rel:"noopener noreferrer"}:{},onClick:d,className:t("group relative col-span-3 flex flex-col justify-between overflow-hidden rounded-xl cursor-pointer","bg-white [box-shadow:0_0_0_1px_rgba(0,0,0,.03),0_2px_4px_rgba(0,0,0,.05),0_12px_24px_rgba(0,0,0,.05)]","transform-gpu dark:bg-black dark:[border:1px_solid_rgba(255,255,255,.1)] dark:[box-shadow:0_-20px_80px_-20px_#ffffff1f_inset]",a),children:[typeof o=="string"?jsx("div",{className:t("absolute inset-0",o)}):jsx("div",{className:"absolute inset-0",children:o}),jsxs("div",{className:"pointer-events-none z-10 flex transform-gpu flex-col gap-1 p-6 transition-all duration-300 group-hover:-translate-y-10",children:[i&&jsx(i,{className:"h-12 w-12 origin-left transform-gpu text-neutral-700 transition-all duration-300 ease-in-out group-hover:scale-75 dark:text-neutral-300"}),jsx("h3",{className:"text-xl font-semibold text-neutral-700 dark:text-neutral-300",children:r}),jsx("p",{className:"max-w-lg text-neutral-400",children:p})]}),l&&jsx("div",{className:"pointer-events-none absolute bottom-0 flex w-full translate-y-10 transform-gpu flex-row items-center p-4 opacity-0 transition-all duration-300 group-hover:translate-y-0 group-hover:opacity-100",children:jsxs("span",{className:"pointer-events-auto ml-auto flex items-center gap-2 rounded-lg bg-black px-4 py-2 text-white dark:bg-white dark:text-black",children:[l,jsx("svg",{className:"ml-2 h-4 w-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M9 5l7 7-7 7"})})]})}),jsx("div",{className:"pointer-events-none absolute inset-0 transform-gpu transition-all duration-300 group-hover:bg-black/[.03] group-hover:dark:bg-neutral-800/10"})]})}export{k as BentoCard,h as BentoGrid};//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.mjs.map

package/dist/bento-grid/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/utils/cn.ts","../../src/bento-grid/index.tsx"],"names":["cn","inputs","twMerge","clsx","BentoGrid","children","className","jsx","BentoCard","name","background","Icon","description","href","cta","onClick","jsxs"],"mappings":"sGAGO,SAASA,CAAAA,CAAAA,GAAMC,CAAAA,CAAsB,CAC1C,OAAOC,OAAAA,CAAQC,IAAAA,CAAKF,CAAM,CAAC,CAC7B,CCgBO,SAASG,CAAAA,CAAU,CAAE,QAAA,CAAAC,CAAAA,CAAU,UAAAC,CAAU,CAAA,CAAmB,CACjE,OAAOC,GAAAA,CAAC,OAAI,SAAA,CAAWP,CAAAA,CAAG,kDAAmDM,CAAS,CAAA,CAAI,SAAAD,CAAAA,CAAS,CACrG,CAEO,SAASG,EAAU,CAAE,IAAA,CAAAC,EAAM,SAAA,CAAAH,CAAAA,CAAW,WAAAI,CAAAA,CAAY,IAAA,CAAAC,EAAM,WAAA,CAAAC,CAAAA,CAAa,KAAAC,CAAAA,CAAM,GAAA,CAAAC,EAAK,OAAA,CAAAC,CAAQ,EAAmB,CAIhH,OACEC,IAAAA,CAJcH,CAAAA,CAAO,IAAM,KAAA,CAI1B,CACE,GAJgBA,CAAAA,CAAO,CAAE,KAAAA,CAAAA,CAAM,MAAA,CAAQ,SAAU,GAAA,CAAK,qBAAsB,EAAI,EAAC,CAKlF,QAASE,CAAAA,CACT,SAAA,CAAWf,EACT,mGAAA,CACA,uGAAA,CACA,+HAAA,CACAM,CACF,EAEC,QAAA,CAAA,CAAA,OAAOI,CAAAA,EAAe,SACrBH,GAAAA,CAAC,KAAA,CAAA,CAAI,UAAWP,CAAAA,CAAG,kBAAA,CAAoBU,CAAU,CAAA,CAAG,CAAA,CAEpDH,IAAC,KAAA,CAAA,CAAI,SAAA,CAAU,mBAAoB,QAAA,CAAAG,CAAAA,CAAW,EAGhDM,IAAAA,CAAC,KAAA,CAAA,CAAI,SAAA,CAAU,wHAAA,CACZ,UAAAL,CAAAA,EACCJ,GAAAA,CAACI,EAAA,CAAK,SAAA,CAAU,0IAA0I,CAAA,CAE5JJ,GAAAA,CAAC,MAAG,SAAA,CAAU,8DAAA,CAAgE,SAAAE,CAAAA,CAAK,CAAA,CACnFF,IAAC,GAAA,CAAA,CAAE,SAAA,CAAU,4BAA6B,QAAA,CAAAK,CAAAA,CAAY,CAAA,CAAA,CACxD,CAAA,CAECE,GACCP,GAAAA,CAAC,KAAA,CAAA,CAAI,UAAU,kMAAA,CACb,QAAA,CAAAS,KAAC,MAAA,CAAA,CAAK,SAAA,CAAU,6HACb,QAAA,CAAA,CAAAF,CAAAA,CACDP,IAAC,KAAA,CAAA,CAAI,SAAA,CAAU,eAAe,IAAA,CAAK,MAAA,CAAO,OAAO,cAAA,CAAe,OAAA,CAAQ,WAAA,CACtE,QAAA,CAAAA,IAAC,MAAA,CAAA,CAAK,aAAA,CAAc,QAAQ,cAAA,CAAe,OAAA,CAAQ,YAAa,CAAA,CAAG,CAAA,CAAE,eAAe,CAAA,CACtF,CAAA,CAAA,CACF,EACF,CAAA,CAEFA,GAAAA,CAAC,OAAI,SAAA,CAAU,8IAAA,CAA+I,GAChK,CAEJ","file":"index.mjs","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\r\nimport { twMerge } from \"tailwind-merge\";\r\n\r\nexport function cn(...inputs: ClassValue[]) {\r\n  return twMerge(clsx(inputs));\r\n}\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport { cn } from \"../utils/cn\";\r\n\r\ninterface BentoCardProps {\r\n  name: string;\r\n  className?: string;\r\n  background?: React.ReactNode | string;\r\n  Icon?: React.ComponentType<{ className?: string }>;\r\n  description: string;\r\n  href?: string;\r\n  cta?: string;\r\n  onClick?: () => void;\r\n}\r\n\r\ninterface BentoGridProps {\r\n  children: React.ReactNode;\r\n  className?: string;\r\n}\r\n\r\nexport function BentoGrid({ children, className }: BentoGridProps) {\r\n  return <div className={cn(\"grid w-full auto-rows-[22rem] grid-cols-3 gap-4\", className)}>{children}</div>;\r\n}\r\n\r\nexport function BentoCard({ name, className, background, Icon, description, href, cta, onClick }: BentoCardProps) {\r\n  const Wrapper = href ? \"a\" : \"div\";\r\n  const wrapperProps = href ? { href, target: \"_blank\", rel: \"noopener noreferrer\" } : {};\r\n\r\n  return (\r\n    <Wrapper\r\n      {...wrapperProps}\r\n      onClick={onClick}\r\n      className={cn(\r\n        \"group relative col-span-3 flex flex-col justify-between overflow-hidden rounded-xl cursor-pointer\",\r\n        \"bg-white [box-shadow:0_0_0_1px_rgba(0,0,0,.03),0_2px_4px_rgba(0,0,0,.05),0_12px_24px_rgba(0,0,0,.05)]\",\r\n        \"transform-gpu dark:bg-black dark:[border:1px_solid_rgba(255,255,255,.1)] dark:[box-shadow:0_-20px_80px_-20px_#ffffff1f_inset]\",\r\n        className\r\n      )}\r\n    >\r\n      {typeof background === \"string\" ? (\r\n        <div className={cn(\"absolute inset-0\", background)} />\r\n      ) : (\r\n        <div className=\"absolute inset-0\">{background}</div>\r\n      )}\r\n\r\n      <div className=\"pointer-events-none z-10 flex transform-gpu flex-col gap-1 p-6 transition-all duration-300 group-hover:-translate-y-10\">\r\n        {Icon && (\r\n          <Icon className=\"h-12 w-12 origin-left transform-gpu text-neutral-700 transition-all duration-300 ease-in-out group-hover:scale-75 dark:text-neutral-300\" />\r\n        )}\r\n        <h3 className=\"text-xl font-semibold text-neutral-700 dark:text-neutral-300\">{name}</h3>\r\n        <p className=\"max-w-lg text-neutral-400\">{description}</p>\r\n      </div>\r\n\r\n      {cta && (\r\n        <div className=\"pointer-events-none absolute bottom-0 flex w-full translate-y-10 transform-gpu flex-row items-center p-4 opacity-0 transition-all duration-300 group-hover:translate-y-0 group-hover:opacity-100\">\r\n          <span className=\"pointer-events-auto ml-auto flex items-center gap-2 rounded-lg bg-black px-4 py-2 text-white dark:bg-white dark:text-black\">\r\n            {cta}\r\n            <svg className=\"ml-2 h-4 w-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n              <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M9 5l7 7-7 7\" />\r\n            </svg>\r\n          </span>\r\n        </div>\r\n      )}\r\n      <div className=\"pointer-events-none absolute inset-0 transform-gpu transition-all duration-300 group-hover:bg-black/[.03] group-hover:dark:bg-neutral-800/10\" />\r\n    </Wrapper>\r\n  );\r\n}\r\n\r\nexport type { BentoCardProps, BentoGridProps };\r\n"]}

package/dist/card-stack/index.js

@@ -0,0 +1,2 @@
+'use strict';var react=require('react'),framerMotion=require('framer-motion'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),jsxRuntime=require('react/jsx-runtime');function p(...t){return tailwindMerge.twMerge(clsx.clsx(t))}var y=({item:t,index:e,totalCards:r,isExpanded:s})=>{let i=(r-1)*5,n=e*10-i,o=e*2,m=e*1.5,l=320,u=240,b=(l+(r-1)*(l-u))/2,g=e*(l-u)-b+l/2,f=e*5-(r-1)*2.5;return jsxRuntime.jsxs(framerMotion.motion.div,{initial:{x:n,y:o,rotate:m,scale:1},animate:{x:s?g:n,y:s?0:o,rotate:s?f:m,scale:1,zIndex:r-e},transition:{type:"spring",stiffness:350,damping:30,mass:.8},className:p("absolute inset-0 rounded-2xl p-6 w-full","bg-gradient-to-br from-white/40 via-neutral-50/30 to-neutral-100/20","dark:from-neutral-800/40 dark:via-neutral-900/30 dark:to-black/20","border border-white/20 dark:border-neutral-800/20","backdrop-blur-xl backdrop-saturate-150","shadow-[0_8px_20px_rgb(0,0,0,0.08)] dark:shadow-[0_8px_20px_rgb(0,0,0,0.3)]","transition-all duration-500 ease-out transform-gpu overflow-hidden"),style:{maxWidth:"320px",left:"50%",marginLeft:"-160px"},children:[jsxRuntime.jsx("div",{className:"absolute inset-1 rounded-xl bg-neutral-900/50 backdrop-blur-sm border border-neutral-200/50 dark:border-neutral-700/50"}),jsxRuntime.jsxs("div",{className:"relative z-10",children:[jsxRuntime.jsx("dl",{className:"mb-4 grid grid-cols-4 gap-2",children:t.specs.map(c=>jsxRuntime.jsxs("div",{className:"text-[10px] flex flex-col items-start",children:[jsxRuntime.jsx("dd",{className:"font-medium text-gray-500 dark:text-gray-400",children:c.value}),jsxRuntime.jsx("dt",{className:"text-white dark:text-gray-100",children:c.label})]},c.label))}),jsxRuntime.jsx("div",{className:"aspect-[16/11] w-full overflow-hidden rounded-lg bg-neutral-100 dark:bg-neutral-900 border border-neutral-200/50 dark:border-neutral-700/50",children:jsxRuntime.jsx("img",{src:t.image,alt:t.title,className:"object-cover w-full h-full",loading:"lazy"})}),jsxRuntime.jsxs("div",{className:"mt-4",children:[jsxRuntime.jsx("h2",{className:"text-3xl font-bold tracking-tight text-white",children:t.title}),jsxRuntime.jsx("span",{className:"block text-3xl font-semibold tracking-tight bg-gradient-to-r from-gray-400 via-gray-300 to-gray-500 bg-clip-text text-transparent",children:t.subtitle}),t.description&&jsxRuntime.jsx("p",{className:"mt-2 text-sm text-gray-500 dark:text-gray-400",children:t.description})]})]})]})};function P({items:t,className:e,defaultExpanded:r=false}){let[s,i]=react.useState(r);return jsxRuntime.jsx("button",{className:p("relative mx-auto cursor-pointer min-h-[440px] w-full max-w-[90vw] md:max-w-[1200px]","appearance-none bg-transparent border-0 p-0 flex items-center justify-center mb-8",e),onClick:()=>i(!s),"aria-label":"Toggle card stack",type:"button",children:t.map((n,o)=>jsxRuntime.jsx(y,{item:n,index:o,totalCards:t.length,isExpanded:s},n.id))})}exports.CardStack=P;//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/card-stack/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/utils/cn.ts","../../src/card-stack/index.tsx"],"names":["cn","inputs","twMerge","clsx","Card","item","index","totalCards","isExpanded","centerOffset","defaultX","defaultY","defaultRotate","cardWidth","cardOverlap","expandedCenterOffset","spreadX","spreadRotate","jsxs","motion","jsx","spec","CardStack","items","className","defaultExpanded","setIsExpanded","useState"],"mappings":"mLAGO,SAASA,CAAAA,CAAAA,GAAMC,CAAAA,CAAsB,CAC1C,OAAOC,qBAAAA,CAAQC,SAAAA,CAAKF,CAAM,CAAC,CAC7B,CCsBA,IAAMG,CAAAA,CAAO,CAAC,CAAE,IAAA,CAAAC,CAAAA,CAAM,KAAA,CAAAC,CAAAA,CAAO,UAAA,CAAAC,CAAAA,CAAY,UAAA,CAAAC,CAAW,IAAiB,CACnE,IAAMC,CAAAA,CAAAA,CAAgBF,CAAAA,CAAa,GAAK,CAAA,CAClCG,CAAAA,CAAWJ,CAAAA,CAAQ,EAAA,CAAKG,EACxBE,CAAAA,CAAWL,CAAAA,CAAQ,CAAA,CACnBM,CAAAA,CAAgBN,EAAQ,GAAA,CAExBO,CAAAA,CAAY,GAAA,CACZC,CAAAA,CAAc,IAEdC,CAAAA,CAAAA,CADqBF,CAAAA,CAAAA,CAAaN,CAAAA,CAAa,CAAA,GAAMM,EAAYC,CAAAA,CAAAA,EACrB,CAAA,CAE5CE,CAAAA,CAAUV,CAAAA,EAASO,EAAYC,CAAAA,CAAAA,CAAeC,CAAAA,CAAuBF,CAAAA,CAAY,CAAA,CACjFI,CAAAA,CAAeX,CAAAA,CAAQ,CAAA,CAAA,CAAKC,CAAAA,CAAa,GAAK,GAAA,CAEpD,OACEW,eAAAA,CAACC,mBAAAA,CAAO,IAAP,CACC,OAAA,CAAS,CAAE,CAAA,CAAGT,EAAU,CAAA,CAAGC,CAAAA,CAAU,MAAA,CAAQC,CAAAA,CAAe,MAAO,CAAE,CAAA,CACrE,OAAA,CAAS,CACP,EAAGJ,CAAAA,CAAaQ,CAAAA,CAAUN,CAAAA,CAC1B,CAAA,CAAGF,EAAa,CAAA,CAAIG,CAAAA,CACpB,MAAA,CAAQH,CAAAA,CAAaS,EAAeL,CAAAA,CACpC,KAAA,CAAO,CAAA,CACP,MAAA,CAAQL,EAAaD,CACvB,CAAA,CACA,UAAA,CAAY,CAAE,KAAM,QAAA,CAAU,SAAA,CAAW,GAAA,CAAK,OAAA,CAAS,GAAI,IAAA,CAAM,EAAI,CAAA,CACrE,SAAA,CAAWN,EACT,yCAAA,CACA,qEAAA,CACA,mEAAA,CACA,mDAAA,CACA,yCACA,6EAAA,CACA,oEACF,CAAA,CACA,KAAA,CAAO,CAAE,QAAA,CAAU,OAAA,CAAS,IAAA,CAAM,KAAA,CAAO,WAAY,QAAS,CAAA,CAE9D,QAAA,CAAA,CAAAoB,cAAAA,CAAC,OAAI,SAAA,CAAU,wHAAA,CAAyH,CAAA,CACxIF,eAAAA,CAAC,KAAA,CAAA,CAAI,SAAA,CAAU,eAAA,CACb,QAAA,CAAA,CAAAE,eAAC,IAAA,CAAA,CAAG,SAAA,CAAU,6BAAA,CACX,QAAA,CAAAf,EAAK,KAAA,CAAM,GAAA,CAAKgB,CAAAA,EACfH,eAAAA,CAAC,OAAqB,SAAA,CAAU,uCAAA,CAC9B,QAAA,CAAA,CAAAE,cAAAA,CAAC,MAAG,SAAA,CAAU,8CAAA,CAAgD,QAAA,CAAAC,CAAAA,CAAK,MAAM,CAAA,CACzED,cAAAA,CAAC,IAAA,CAAA,CAAG,SAAA,CAAU,gCAAiC,QAAA,CAAAC,CAAAA,CAAK,KAAA,CAAM,CAAA,CAAA,CAAA,CAFlDA,EAAK,KAGf,CACD,CAAA,CACH,CAAA,CACAD,eAAC,KAAA,CAAA,CAAI,SAAA,CAAU,6IAAA,CACb,QAAA,CAAAA,eAAC,KAAA,CAAA,CAAI,GAAA,CAAKf,CAAAA,CAAK,KAAA,CAAO,IAAKA,CAAAA,CAAK,KAAA,CAAO,SAAA,CAAU,4BAAA,CAA6B,QAAQ,MAAA,CAAO,CAAA,CAC/F,CAAA,CACAa,eAAAA,CAAC,OAAI,SAAA,CAAU,MAAA,CACb,QAAA,CAAA,CAAAE,cAAAA,CAAC,MAAG,SAAA,CAAU,8CAAA,CAAgD,QAAA,CAAAf,CAAAA,CAAK,MAAM,CAAA,CACzEe,cAAAA,CAAC,MAAA,CAAA,CAAK,SAAA,CAAU,oIACb,QAAA,CAAAf,CAAAA,CAAK,QAAA,CACR,CAAA,CACCA,CAAAA,CAAK,WAAA,EAAee,cAAAA,CAAC,GAAA,CAAA,CAAE,UAAU,+CAAA,CAAiD,QAAA,CAAAf,CAAAA,CAAK,WAAA,CAAY,GACtG,CAAA,CAAA,CACF,CAAA,CAAA,CACF,CAEJ,CAAA,CAQO,SAASiB,CAAAA,CAAU,CAAE,KAAA,CAAAC,CAAAA,CAAO,UAAAC,CAAAA,CAAW,eAAA,CAAAC,CAAAA,CAAkB,KAAM,EAAmB,CACvF,GAAM,CAACjB,CAAAA,CAAYkB,CAAa,CAAA,CAAIC,cAAAA,CAASF,CAAe,CAAA,CAE5D,OACEL,cAAAA,CAAC,QAAA,CAAA,CACC,SAAA,CAAWpB,CAAAA,CACT,sFACA,mFAAA,CACAwB,CACF,CAAA,CACA,OAAA,CAAS,IAAME,CAAAA,CAAc,CAAClB,CAAU,CAAA,CACxC,aAAW,mBAAA,CACX,IAAA,CAAK,QAAA,CAEJ,QAAA,CAAAe,EAAM,GAAA,CAAI,CAAClB,CAAAA,CAAMC,CAAAA,GAChBc,eAAChB,CAAAA,CAAA,CAAmB,IAAA,CAAMC,CAAAA,CAAM,MAAOC,CAAAA,CAAO,UAAA,CAAYiB,CAAAA,CAAM,MAAA,CAAQ,WAAYf,CAAAA,CAAAA,CAAzEH,CAAAA,CAAK,EAAgF,CACjG,EACH,CAEJ","file":"index.js","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\r\nimport { twMerge } from \"tailwind-merge\";\r\n\r\nexport function cn(...inputs: ClassValue[]) {\r\n  return twMerge(clsx(inputs));\r\n}\r\n","\"use client\";\r\n\r\nimport { useState } from \"react\";\r\nimport { motion } from \"framer-motion\";\r\nimport { cn } from \"../utils/cn\";\r\n\r\ninterface Specification {\r\n  label: string;\r\n  value: string;\r\n}\r\n\r\ninterface CardStackItem {\r\n  id: string;\r\n  title: string;\r\n  subtitle: string;\r\n  image: string;\r\n  specs: Specification[];\r\n  description?: string;\r\n}\r\n\r\ninterface CardProps {\r\n  item: CardStackItem;\r\n  index: number;\r\n  totalCards: number;\r\n  isExpanded: boolean;\r\n}\r\n\r\nconst Card = ({ item, index, totalCards, isExpanded }: CardProps) => {\r\n  const centerOffset = (totalCards - 1) * 5;\r\n  const defaultX = index * 10 - centerOffset;\r\n  const defaultY = index * 2;\r\n  const defaultRotate = index * 1.5;\r\n\r\n  const cardWidth = 320;\r\n  const cardOverlap = 240;\r\n  const totalExpandedWidth = cardWidth + (totalCards - 1) * (cardWidth - cardOverlap);\r\n  const expandedCenterOffset = totalExpandedWidth / 2;\r\n\r\n  const spreadX = index * (cardWidth - cardOverlap) - expandedCenterOffset + cardWidth / 2;\r\n  const spreadRotate = index * 5 - (totalCards - 1) * 2.5;\r\n\r\n  return (\r\n    <motion.div\r\n      initial={{ x: defaultX, y: defaultY, rotate: defaultRotate, scale: 1 }}\r\n      animate={{\r\n        x: isExpanded ? spreadX : defaultX,\r\n        y: isExpanded ? 0 : defaultY,\r\n        rotate: isExpanded ? spreadRotate : defaultRotate,\r\n        scale: 1,\r\n        zIndex: totalCards - index,\r\n      }}\r\n      transition={{ type: \"spring\", stiffness: 350, damping: 30, mass: 0.8 }}\r\n      className={cn(\r\n        \"absolute inset-0 rounded-2xl p-6 w-full\",\r\n        \"bg-gradient-to-br from-white/40 via-neutral-50/30 to-neutral-100/20\",\r\n        \"dark:from-neutral-800/40 dark:via-neutral-900/30 dark:to-black/20\",\r\n        \"border border-white/20 dark:border-neutral-800/20\",\r\n        \"backdrop-blur-xl backdrop-saturate-150\",\r\n        \"shadow-[0_8px_20px_rgb(0,0,0,0.08)] dark:shadow-[0_8px_20px_rgb(0,0,0,0.3)]\",\r\n        \"transition-all duration-500 ease-out transform-gpu overflow-hidden\"\r\n      )}\r\n      style={{ maxWidth: \"320px\", left: \"50%\", marginLeft: \"-160px\" }}\r\n    >\r\n      <div className=\"absolute inset-1 rounded-xl bg-neutral-900/50 backdrop-blur-sm border border-neutral-200/50 dark:border-neutral-700/50\" />\r\n      <div className=\"relative z-10\">\r\n        <dl className=\"mb-4 grid grid-cols-4 gap-2\">\r\n          {item.specs.map((spec) => (\r\n            <div key={spec.label} className=\"text-[10px] flex flex-col items-start\">\r\n              <dd className=\"font-medium text-gray-500 dark:text-gray-400\">{spec.value}</dd>\r\n              <dt className=\"text-white dark:text-gray-100\">{spec.label}</dt>\r\n            </div>\r\n          ))}\r\n        </dl>\r\n        <div className=\"aspect-[16/11] w-full overflow-hidden rounded-lg bg-neutral-100 dark:bg-neutral-900 border border-neutral-200/50 dark:border-neutral-700/50\">\r\n          <img src={item.image} alt={item.title} className=\"object-cover w-full h-full\" loading=\"lazy\" />\r\n        </div>\r\n        <div className=\"mt-4\">\r\n          <h2 className=\"text-3xl font-bold tracking-tight text-white\">{item.title}</h2>\r\n          <span className=\"block text-3xl font-semibold tracking-tight bg-gradient-to-r from-gray-400 via-gray-300 to-gray-500 bg-clip-text text-transparent\">\r\n            {item.subtitle}\r\n          </span>\r\n          {item.description && <p className=\"mt-2 text-sm text-gray-500 dark:text-gray-400\">{item.description}</p>}\r\n        </div>\r\n      </div>\r\n    </motion.div>\r\n  );\r\n};\r\n\r\ninterface CardStackProps {\r\n  items: CardStackItem[];\r\n  className?: string;\r\n  defaultExpanded?: boolean;\r\n}\r\n\r\nexport function CardStack({ items, className, defaultExpanded = false }: CardStackProps) {\r\n  const [isExpanded, setIsExpanded] = useState(defaultExpanded);\r\n\r\n  return (\r\n    <button\r\n      className={cn(\r\n        \"relative mx-auto cursor-pointer min-h-[440px] w-full max-w-[90vw] md:max-w-[1200px]\",\r\n        \"appearance-none bg-transparent border-0 p-0 flex items-center justify-center mb-8\",\r\n        className\r\n      )}\r\n      onClick={() => setIsExpanded(!isExpanded)}\r\n      aria-label=\"Toggle card stack\"\r\n      type=\"button\"\r\n    >\r\n      {items.map((item, index) => (\r\n        <Card key={item.id} item={item} index={index} totalCards={items.length} isExpanded={isExpanded} />\r\n      ))}\r\n    </button>\r\n  );\r\n}\r\n\r\nexport type { CardStackItem, Specification };\r\n"]}

package/dist/card-stack/index.mjs

@@ -0,0 +1,2 @@
+import {useState}from'react';import {motion}from'framer-motion';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';import {jsx,jsxs}from'react/jsx-runtime';function p(...t){return twMerge(clsx(t))}var y=({item:t,index:e,totalCards:r,isExpanded:s})=>{let i=(r-1)*5,n=e*10-i,o=e*2,m=e*1.5,l=320,u=240,b=(l+(r-1)*(l-u))/2,g=e*(l-u)-b+l/2,f=e*5-(r-1)*2.5;return jsxs(motion.div,{initial:{x:n,y:o,rotate:m,scale:1},animate:{x:s?g:n,y:s?0:o,rotate:s?f:m,scale:1,zIndex:r-e},transition:{type:"spring",stiffness:350,damping:30,mass:.8},className:p("absolute inset-0 rounded-2xl p-6 w-full","bg-gradient-to-br from-white/40 via-neutral-50/30 to-neutral-100/20","dark:from-neutral-800/40 dark:via-neutral-900/30 dark:to-black/20","border border-white/20 dark:border-neutral-800/20","backdrop-blur-xl backdrop-saturate-150","shadow-[0_8px_20px_rgb(0,0,0,0.08)] dark:shadow-[0_8px_20px_rgb(0,0,0,0.3)]","transition-all duration-500 ease-out transform-gpu overflow-hidden"),style:{maxWidth:"320px",left:"50%",marginLeft:"-160px"},children:[jsx("div",{className:"absolute inset-1 rounded-xl bg-neutral-900/50 backdrop-blur-sm border border-neutral-200/50 dark:border-neutral-700/50"}),jsxs("div",{className:"relative z-10",children:[jsx("dl",{className:"mb-4 grid grid-cols-4 gap-2",children:t.specs.map(c=>jsxs("div",{className:"text-[10px] flex flex-col items-start",children:[jsx("dd",{className:"font-medium text-gray-500 dark:text-gray-400",children:c.value}),jsx("dt",{className:"text-white dark:text-gray-100",children:c.label})]},c.label))}),jsx("div",{className:"aspect-[16/11] w-full overflow-hidden rounded-lg bg-neutral-100 dark:bg-neutral-900 border border-neutral-200/50 dark:border-neutral-700/50",children:jsx("img",{src:t.image,alt:t.title,className:"object-cover w-full h-full",loading:"lazy"})}),jsxs("div",{className:"mt-4",children:[jsx("h2",{className:"text-3xl font-bold tracking-tight text-white",children:t.title}),jsx("span",{className:"block text-3xl font-semibold tracking-tight bg-gradient-to-r from-gray-400 via-gray-300 to-gray-500 bg-clip-text text-transparent",children:t.subtitle}),t.description&&jsx("p",{className:"mt-2 text-sm text-gray-500 dark:text-gray-400",children:t.description})]})]})]})};function P({items:t,className:e,defaultExpanded:r=false}){let[s,i]=useState(r);return jsx("button",{className:p("relative mx-auto cursor-pointer min-h-[440px] w-full max-w-[90vw] md:max-w-[1200px]","appearance-none bg-transparent border-0 p-0 flex items-center justify-center mb-8",e),onClick:()=>i(!s),"aria-label":"Toggle card stack",type:"button",children:t.map((n,o)=>jsx(y,{item:n,index:o,totalCards:t.length,isExpanded:s},n.id))})}export{P as CardStack};//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.mjs.map

package/dist/card-stack/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/utils/cn.ts","../../src/card-stack/index.tsx"],"names":["cn","inputs","twMerge","clsx","Card","item","index","totalCards","isExpanded","centerOffset","defaultX","defaultY","defaultRotate","cardWidth","cardOverlap","expandedCenterOffset","spreadX","spreadRotate","jsxs","motion","jsx","spec","CardStack","items","className","defaultExpanded","setIsExpanded","useState"],"mappings":"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","file":"index.mjs","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\r\nimport { twMerge } from \"tailwind-merge\";\r\n\r\nexport function cn(...inputs: ClassValue[]) {\r\n  return twMerge(clsx(inputs));\r\n}\r\n","\"use client\";\r\n\r\nimport { useState } from \"react\";\r\nimport { motion } from \"framer-motion\";\r\nimport { cn } from \"../utils/cn\";\r\n\r\ninterface Specification {\r\n  label: string;\r\n  value: string;\r\n}\r\n\r\ninterface CardStackItem {\r\n  id: string;\r\n  title: string;\r\n  subtitle: string;\r\n  image: string;\r\n  specs: Specification[];\r\n  description?: string;\r\n}\r\n\r\ninterface CardProps {\r\n  item: CardStackItem;\r\n  index: number;\r\n  totalCards: number;\r\n  isExpanded: boolean;\r\n}\r\n\r\nconst Card = ({ item, index, totalCards, isExpanded }: CardProps) => {\r\n  const centerOffset = (totalCards - 1) * 5;\r\n  const defaultX = index * 10 - centerOffset;\r\n  const defaultY = index * 2;\r\n  const defaultRotate = index * 1.5;\r\n\r\n  const cardWidth = 320;\r\n  const cardOverlap = 240;\r\n  const totalExpandedWidth = cardWidth + (totalCards - 1) * (cardWidth - cardOverlap);\r\n  const expandedCenterOffset = totalExpandedWidth / 2;\r\n\r\n  const spreadX = index * (cardWidth - cardOverlap) - expandedCenterOffset + cardWidth / 2;\r\n  const spreadRotate = index * 5 - (totalCards - 1) * 2.5;\r\n\r\n  return (\r\n    <motion.div\r\n      initial={{ x: defaultX, y: defaultY, rotate: defaultRotate, scale: 1 }}\r\n      animate={{\r\n        x: isExpanded ? spreadX : defaultX,\r\n        y: isExpanded ? 0 : defaultY,\r\n        rotate: isExpanded ? spreadRotate : defaultRotate,\r\n        scale: 1,\r\n        zIndex: totalCards - index,\r\n      }}\r\n      transition={{ type: \"spring\", stiffness: 350, damping: 30, mass: 0.8 }}\r\n      className={cn(\r\n        \"absolute inset-0 rounded-2xl p-6 w-full\",\r\n        \"bg-gradient-to-br from-white/40 via-neutral-50/30 to-neutral-100/20\",\r\n        \"dark:from-neutral-800/40 dark:via-neutral-900/30 dark:to-black/20\",\r\n        \"border border-white/20 dark:border-neutral-800/20\",\r\n        \"backdrop-blur-xl backdrop-saturate-150\",\r\n        \"shadow-[0_8px_20px_rgb(0,0,0,0.08)] dark:shadow-[0_8px_20px_rgb(0,0,0,0.3)]\",\r\n        \"transition-all duration-500 ease-out transform-gpu overflow-hidden\"\r\n      )}\r\n      style={{ maxWidth: \"320px\", left: \"50%\", marginLeft: \"-160px\" }}\r\n    >\r\n      <div className=\"absolute inset-1 rounded-xl bg-neutral-900/50 backdrop-blur-sm border border-neutral-200/50 dark:border-neutral-700/50\" />\r\n      <div className=\"relative z-10\">\r\n        <dl className=\"mb-4 grid grid-cols-4 gap-2\">\r\n          {item.specs.map((spec) => (\r\n            <div key={spec.label} className=\"text-[10px] flex flex-col items-start\">\r\n              <dd className=\"font-medium text-gray-500 dark:text-gray-400\">{spec.value}</dd>\r\n              <dt className=\"text-white dark:text-gray-100\">{spec.label}</dt>\r\n            </div>\r\n          ))}\r\n        </dl>\r\n        <div className=\"aspect-[16/11] w-full overflow-hidden rounded-lg bg-neutral-100 dark:bg-neutral-900 border border-neutral-200/50 dark:border-neutral-700/50\">\r\n          <img src={item.image} alt={item.title} className=\"object-cover w-full h-full\" loading=\"lazy\" />\r\n        </div>\r\n        <div className=\"mt-4\">\r\n          <h2 className=\"text-3xl font-bold tracking-tight text-white\">{item.title}</h2>\r\n          <span className=\"block text-3xl font-semibold tracking-tight bg-gradient-to-r from-gray-400 via-gray-300 to-gray-500 bg-clip-text text-transparent\">\r\n            {item.subtitle}\r\n          </span>\r\n          {item.description && <p className=\"mt-2 text-sm text-gray-500 dark:text-gray-400\">{item.description}</p>}\r\n        </div>\r\n      </div>\r\n    </motion.div>\r\n  );\r\n};\r\n\r\ninterface CardStackProps {\r\n  items: CardStackItem[];\r\n  className?: string;\r\n  defaultExpanded?: boolean;\r\n}\r\n\r\nexport function CardStack({ items, className, defaultExpanded = false }: CardStackProps) {\r\n  const [isExpanded, setIsExpanded] = useState(defaultExpanded);\r\n\r\n  return (\r\n    <button\r\n      className={cn(\r\n        \"relative mx-auto cursor-pointer min-h-[440px] w-full max-w-[90vw] md:max-w-[1200px]\",\r\n        \"appearance-none bg-transparent border-0 p-0 flex items-center justify-center mb-8\",\r\n        className\r\n      )}\r\n      onClick={() => setIsExpanded(!isExpanded)}\r\n      aria-label=\"Toggle card stack\"\r\n      type=\"button\"\r\n    >\r\n      {items.map((item, index) => (\r\n        <Card key={item.id} item={item} index={index} totalCards={items.length} isExpanded={isExpanded} />\r\n      ))}\r\n    </button>\r\n  );\r\n}\r\n\r\nexport type { CardStackItem, Specification };\r\n"]}