bynana-ui 1.6.2 → 1.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/action-search-bar/index.js +17 -0
- package/dist/action-search-bar/index.js.map +1 -0
- package/dist/action-search-bar/index.mjs +17 -0
- package/dist/action-search-bar/index.mjs.map +1 -0
- package/dist/ai-bar/index.js +19 -0
- package/dist/ai-bar/index.js.map +1 -0
- package/dist/ai-bar/index.mjs +19 -0
- package/dist/ai-bar/index.mjs.map +1 -0
- package/dist/ai-loading/index.js +2 -0
- package/dist/ai-loading/index.js.map +1 -0
- package/dist/ai-loading/index.mjs +2 -0
- package/dist/ai-loading/index.mjs.map +1 -0
- package/dist/ai-prompt/index.js +17 -0
- package/dist/ai-prompt/index.js.map +1 -0
- package/dist/ai-prompt/index.mjs +17 -0
- package/dist/ai-prompt/index.mjs.map +1 -0
- package/dist/ai-text-loading/index.js +2 -0
- package/dist/ai-text-loading/index.js.map +1 -0
- package/dist/ai-text-loading/index.mjs +2 -0
- package/dist/ai-text-loading/index.mjs.map +1 -0
- package/dist/ai-voice/index.js +3 -0
- package/dist/ai-voice/index.js.map +1 -0
- package/dist/ai-voice/index.mjs +3 -0
- package/dist/ai-voice/index.mjs.map +1 -0
- package/dist/aurora/index.js +2 -0
- package/dist/aurora/index.js.map +1 -0
- package/dist/aurora/index.mjs +2 -0
- package/dist/aurora/index.mjs.map +1 -0
- package/dist/background-paths/index.js +2 -0
- package/dist/background-paths/index.js.map +1 -0
- package/dist/background-paths/index.mjs +2 -0
- package/dist/background-paths/index.mjs.map +1 -0
- package/dist/elastic-search/index.js +17 -0
- package/dist/elastic-search/index.js.map +1 -0
- package/dist/elastic-search/index.mjs +17 -0
- package/dist/elastic-search/index.mjs.map +1 -0
- package/dist/faqs-accordion/index.js +16 -0
- package/dist/faqs-accordion/index.js.map +1 -0
- package/dist/faqs-accordion/index.mjs +16 -0
- package/dist/faqs-accordion/index.mjs.map +1 -0
- package/dist/faqs-grid/index.js +2 -0
- package/dist/faqs-grid/index.js.map +1 -0
- package/dist/faqs-grid/index.mjs +2 -0
- package/dist/faqs-grid/index.mjs.map +1 -0
- package/dist/floating-paths/index.js +2 -0
- package/dist/floating-paths/index.js.map +1 -0
- package/dist/floating-paths/index.mjs +2 -0
- package/dist/floating-paths/index.mjs.map +1 -0
- package/dist/folder/index.js +2 -0
- package/dist/folder/index.js.map +1 -0
- package/dist/folder/index.mjs +2 -0
- package/dist/folder/index.mjs.map +1 -0
- package/dist/footer-complex/index.js +2 -0
- package/dist/footer-complex/index.js.map +1 -0
- package/dist/footer-complex/index.mjs +2 -0
- package/dist/footer-complex/index.mjs.map +1 -0
- package/dist/footer-simple/index.js +2 -0
- package/dist/footer-simple/index.js.map +1 -0
- package/dist/footer-simple/index.mjs +2 -0
- package/dist/footer-simple/index.mjs.map +1 -0
- package/dist/glare-hover/index.js +32 -0
- package/dist/glare-hover/index.js.map +1 -0
- package/dist/glare-hover/index.mjs +32 -0
- package/dist/glare-hover/index.mjs.map +1 -0
- package/dist/hero-grid/index.js +16 -0
- package/dist/hero-grid/index.js.map +1 -0
- package/dist/hero-grid/index.mjs +16 -0
- package/dist/hero-grid/index.mjs.map +1 -0
- package/dist/hero-showcase/index.js +17 -0
- package/dist/hero-showcase/index.js.map +1 -0
- package/dist/hero-showcase/index.mjs +17 -0
- package/dist/hero-showcase/index.mjs.map +1 -0
- package/dist/index.js +85 -13
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +85 -13
- package/dist/index.mjs.map +1 -1
- package/dist/job-listing/index.js +19 -0
- package/dist/job-listing/index.js.map +1 -0
- package/dist/job-listing/index.mjs +19 -0
- package/dist/job-listing/index.mjs.map +1 -0
- package/dist/logo-cloud/index.js +14 -0
- package/dist/logo-cloud/index.js.map +1 -0
- package/dist/logo-cloud/index.mjs +14 -0
- package/dist/logo-cloud/index.mjs.map +1 -0
- package/dist/logo-loop/index.js +2 -0
- package/dist/logo-loop/index.js.map +1 -0
- package/dist/logo-loop/index.mjs +2 -0
- package/dist/logo-loop/index.mjs.map +1 -0
- package/dist/magnet/index.js +2 -0
- package/dist/magnet/index.js.map +1 -0
- package/dist/magnet/index.mjs +2 -0
- package/dist/magnet/index.mjs.map +1 -0
- package/dist/magnet-lines/index.js +2 -0
- package/dist/magnet-lines/index.js.map +1 -0
- package/dist/magnet-lines/index.mjs +2 -0
- package/dist/magnet-lines/index.mjs.map +1 -0
- package/dist/pricing-modern/index.js +16 -0
- package/dist/pricing-modern/index.js.map +1 -0
- package/dist/pricing-modern/index.mjs +16 -0
- package/dist/pricing-modern/index.mjs.map +1 -0
- package/dist/scroll-float/index.js +2 -0
- package/dist/scroll-float/index.js.map +1 -0
- package/dist/scroll-float/index.mjs +2 -0
- package/dist/scroll-float/index.mjs.map +1 -0
- package/dist/scroll-reveal/index.js +2 -0
- package/dist/scroll-reveal/index.js.map +1 -0
- package/dist/scroll-reveal/index.mjs +2 -0
- package/dist/scroll-reveal/index.mjs.map +1 -0
- package/dist/scroll-stack/index.js +2 -0
- package/dist/scroll-stack/index.js.map +1 -0
- package/dist/scroll-stack/index.mjs +2 -0
- package/dist/scroll-stack/index.mjs.map +1 -0
- package/dist/squares/index.js +2 -0
- package/dist/squares/index.js.map +1 -0
- package/dist/squares/index.mjs +2 -0
- package/dist/squares/index.mjs.map +1 -0
- package/dist/team-carousel/index.js +17 -0
- package/dist/team-carousel/index.js.map +1 -0
- package/dist/team-carousel/index.mjs +17 -0
- package/dist/team-carousel/index.mjs.map +1 -0
- package/dist/team-selector/index.js +3 -0
- package/dist/team-selector/index.js.map +1 -0
- package/dist/team-selector/index.mjs +3 -0
- package/dist/team-selector/index.mjs.map +1 -0
- package/dist/testimonials-grid/index.js +17 -0
- package/dist/testimonials-grid/index.js.map +1 -0
- package/dist/testimonials-grid/index.mjs +17 -0
- package/dist/testimonials-grid/index.mjs.map +1 -0
- package/dist/testimonials-simple/index.js +3 -0
- package/dist/testimonials-simple/index.js.map +1 -0
- package/dist/testimonials-simple/index.mjs +3 -0
- package/dist/testimonials-simple/index.mjs.map +1 -0
- package/dist/testimonials-stars/index.js +3 -0
- package/dist/testimonials-stars/index.js.map +1 -0
- package/dist/testimonials-stars/index.mjs +3 -0
- package/dist/testimonials-stars/index.mjs.map +1 -0
- package/dist/text-type/index.js +2 -0
- package/dist/text-type/index.js.map +1 -0
- package/dist/text-type/index.mjs +2 -0
- package/dist/text-type/index.mjs.map +1 -0
- package/dist/threads/index.js +2 -0
- package/dist/threads/index.js.map +1 -0
- package/dist/threads/index.mjs +2 -0
- package/dist/threads/index.mjs.map +1 -0
- package/dist/tooltip-interactive/index.js +2 -0
- package/dist/tooltip-interactive/index.js.map +1 -0
- package/dist/tooltip-interactive/index.mjs +2 -0
- package/dist/tooltip-interactive/index.mjs.map +1 -0
- package/dist/tooltip-magnetic/index.js +2 -0
- package/dist/tooltip-magnetic/index.js.map +1 -0
- package/dist/tooltip-magnetic/index.mjs +2 -0
- package/dist/tooltip-magnetic/index.mjs.map +1 -0
- package/dist/tooltip-rich/index.js +2 -0
- package/dist/tooltip-rich/index.js.map +1 -0
- package/dist/tooltip-rich/index.mjs +2 -0
- package/dist/tooltip-rich/index.mjs.map +1 -0
- package/dist/waves/index.js +2 -0
- package/dist/waves/index.js.map +1 -0
- package/dist/waves/index.mjs +2 -0
- package/dist/waves/index.mjs.map +1 -0
- package/package.json +41 -2
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../node_modules/shared/src/utils.ts","../../../../node_modules/lucide-react/src/defaultAttributes.ts","../../../../node_modules/lucide-react/src/Icon.ts","../../../../node_modules/lucide-react/src/createLucideIcon.ts","../../../../node_modules/lucide-react/src/icons/check.ts","../../src/pricing-modern/index.tsx"],"names":["toKebabCase","string","toCamelCase","match","p1","p2","toPascalCase","camelCase","mergeClasses","classes","className","index","array","hasA11yProp","props","prop","defaultAttributes","Icon","forwardRef","color","size","strokeWidth","absoluteStrokeWidth","children","iconNode","rest","ref","createElement","tag","attrs","createLucideIcon","iconName","Component","__iconNode","Check","PricingModern","title","description","plans","isAnnual","setIsAnnual","useState","jsx","jsxs","plan","feature","pricing_modern_default"],"mappings":"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","file":"index.mjs","sourcesContent":["import { CamelToPascal } from './utility-types';\n\n/**\n * Converts string to kebab case\n *\n * @param {string} string\n * @returns {string} A kebabized string\n */\nexport const toKebabCase = (string: string) =>\n string.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();\n\n/**\n * Converts string to camel case\n *\n * @param {string} string\n * @returns {string} A camelized string\n */\nexport const toCamelCase = <T extends string>(string: T) =>\n string.replace(/^([A-Z])|[\\s-_]+(\\w)/g, (match, p1, p2) =>\n p2 ? p2.toUpperCase() : p1.toLowerCase(),\n );\n\n/**\n * Converts string to pascal case\n *\n * @param {string} string\n * @returns {string} A pascalized string\n */\nexport const toPascalCase = <T extends string>(string: T): CamelToPascal<T> => {\n const camelCase = toCamelCase(string);\n\n return (camelCase.charAt(0).toUpperCase() + camelCase.slice(1)) as CamelToPascal<T>;\n};\n\n/**\n * Merges classes into a single string\n *\n * @param {array} classes\n * @returns {string} A string of classes\n */\nexport const mergeClasses = <ClassType = string | undefined | null>(...classes: ClassType[]) =>\n classes\n .filter((className, index, array) => {\n return (\n Boolean(className) &&\n (className as string).trim() !== '' &&\n array.indexOf(className) === index\n );\n })\n .join(' ')\n .trim();\n\n/**\n * Is empty string\n *\n * @param {unknown} value\n * @returns {boolean} Whether the value is an empty string\n */\nexport const isEmptyString = (value: unknown): boolean => value === '';\n\n/**\n * Check if a component has an accessibility prop\n *\n * @param {object} props\n * @returns {boolean} Whether the component has an accessibility prop\n */\nexport const hasA11yProp = (props: Record<string, any>) => {\n for (const prop in props) {\n if (prop.startsWith('aria-') || prop === 'role' || prop === 'title') {\n return true;\n }\n }\n};\n","export default {\n xmlns: 'http://www.w3.org/2000/svg',\n width: 24,\n height: 24,\n viewBox: '0 0 24 24',\n fill: 'none',\n stroke: 'currentColor',\n strokeWidth: 2,\n strokeLinecap: 'round',\n strokeLinejoin: 'round',\n};\n","import { createElement, forwardRef } from 'react';\nimport defaultAttributes from './defaultAttributes';\nimport { IconNode, LucideProps } from './types';\nimport { mergeClasses, hasA11yProp } from '@lucide/shared';\n\ninterface IconComponentProps extends LucideProps {\n iconNode: IconNode;\n}\n\n/**\n * Lucide icon component\n *\n * @component Icon\n * @param {object} props\n * @param {string} props.color - The color of the icon\n * @param {number} props.size - The size of the icon\n * @param {number} props.strokeWidth - The stroke width of the icon\n * @param {boolean} props.absoluteStrokeWidth - Whether to use absolute stroke width\n * @param {string} props.className - The class name of the icon\n * @param {IconNode} props.children - The children of the icon\n * @param {IconNode} props.iconNode - The icon node of the icon\n *\n * @returns {ForwardRefExoticComponent} LucideIcon\n */\nconst Icon = forwardRef<SVGSVGElement, IconComponentProps>(\n (\n {\n color = 'currentColor',\n size = 24,\n strokeWidth = 2,\n absoluteStrokeWidth,\n className = '',\n children,\n iconNode,\n ...rest\n },\n ref,\n ) =>\n createElement(\n 'svg',\n {\n ref,\n ...defaultAttributes,\n width: size,\n height: size,\n stroke: color,\n strokeWidth: absoluteStrokeWidth ? (Number(strokeWidth) * 24) / Number(size) : strokeWidth,\n className: mergeClasses('lucide', className),\n ...(!children && !hasA11yProp(rest) && { 'aria-hidden': 'true' }),\n ...rest,\n },\n [\n ...iconNode.map(([tag, attrs]) => createElement(tag, attrs)),\n ...(Array.isArray(children) ? children : [children]),\n ],\n ),\n);\n\nexport default Icon;\n","import { createElement, forwardRef } from 'react';\nimport { mergeClasses, toKebabCase, toPascalCase } from '@lucide/shared';\nimport { IconNode, LucideProps } from './types';\nimport Icon from './Icon';\n\n/**\n * Create a Lucide icon component\n * @param {string} iconName\n * @param {array} iconNode\n * @returns {ForwardRefExoticComponent} LucideIcon\n */\nconst createLucideIcon = (iconName: string, iconNode: IconNode) => {\n const Component = forwardRef<SVGSVGElement, LucideProps>(({ className, ...props }, ref) =>\n createElement(Icon, {\n ref,\n iconNode,\n className: mergeClasses(\n `lucide-${toKebabCase(toPascalCase(iconName))}`,\n `lucide-${iconName}`,\n className,\n ),\n ...props,\n }),\n );\n\n Component.displayName = toPascalCase(iconName);\n\n return Component;\n};\n\nexport default createLucideIcon;\n","import createLucideIcon from '../createLucideIcon';\nimport { IconNode } from '../types';\n\nexport const __iconNode: IconNode = [['path', { d: 'M20 6 9 17l-5-5', key: '1gmf2c' }]];\n\n/**\n * @component @name Check\n * @description Lucide SVG icon component, renders SVG Element with children.\n *\n * @preview  - https://lucide.dev/icons/check\n * @see https://lucide.dev/guide/packages/lucide-react - Documentation\n *\n * @param {Object} props - Lucide icons props and any valid SVG attribute\n * @returns {JSX.Element} JSX Element\n *\n */\nconst Check = createLucideIcon('check', __iconNode);\n\nexport default Check;\n","\"use client\";\r\n\r\nimport { useState } from \"react\";\r\nimport { Check } from \"lucide-react\";\r\n\r\ninterface PricingPlan {\r\n name: string;\r\n price: { monthly: number; annually: number } | \"custom\";\r\n description: string;\r\n features: string[];\r\n featured?: boolean;\r\n buttonText?: string;\r\n}\r\n\r\ninterface PricingModernProps {\r\n title?: string;\r\n description?: string;\r\n plans?: PricingPlan[];\r\n className?: string;\r\n}\r\n\r\nexport function PricingModern({\r\n title = \"Choose your perfect plan\",\r\n description = \"Modern pricing plans designed for teams of all sizes.\",\r\n plans = [\r\n {\r\n name: \"Basic\",\r\n price: { monthly: 15, annually: 10 },\r\n description: \"Perfect for startups\",\r\n features: [\"1 Project\", \"Email Support\", \"Core Features\", \"Basic Analytics\"],\r\n },\r\n {\r\n name: \"Pro\",\r\n price: { monthly: 35, annually: 25 },\r\n description: \"Best for teams\",\r\n features: [\"Unlimited Projects\", \"Priority Support\", \"Team Collaboration\", \"Advanced Analytics\"],\r\n featured: true,\r\n },\r\n {\r\n name: \"Enterprise\",\r\n price: \"custom\",\r\n description: \"Tailored solutions\",\r\n features: [\"Everything in Pro\", \"Dedicated Manager\", \"Custom Integrations\", \"SLA & Support\"],\r\n buttonText: \"Contact Sales\",\r\n },\r\n ],\r\n className = \"\",\r\n}: PricingModernProps) {\r\n const [isAnnual, setIsAnnual] = useState(true);\r\n\r\n return (\r\n <section className={`py-16 md:py-32 ${className}`}>\r\n <div className=\"mx-auto max-w-5xl px-6\">\r\n <div className=\"mx-auto max-w-2xl text-center\">\r\n <h2 className=\"text-3xl font-bold md:text-4xl lg:text-5xl\">{title}</h2>\r\n <p className=\"text-muted-foreground mx-auto mt-4 max-w-xl text-lg\">{description}</p>\r\n\r\n <div className=\"my-12\">\r\n <div className=\"relative mx-auto grid w-fit grid-cols-2 rounded-full border p-1\">\r\n <div\r\n className={`pointer-events-none absolute inset-1 w-1/2 rounded-full bg-primary transition-transform duration-500 ${\r\n isAnnual ? \"translate-x-full\" : \"translate-x-0\"\r\n }`}\r\n />\r\n <button\r\n onClick={() => setIsAnnual(false)}\r\n className={`relative h-8 w-24 rounded-full text-sm ${!isAnnual ? \"text-primary-foreground font-medium\" : \"\"}`}\r\n >\r\n Monthly\r\n </button>\r\n <button\r\n onClick={() => setIsAnnual(true)}\r\n className={`relative h-8 w-24 rounded-full text-sm ${isAnnual ? \"text-primary-foreground font-medium\" : \"\"}`}\r\n >\r\n Annually\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div className=\"grid grid-cols-1 gap-6 md:grid-cols-3\">\r\n {plans.map((plan) => (\r\n <div\r\n key={plan.name}\r\n className={`relative flex flex-col rounded-2xl border p-8 ${\r\n plan.featured ? \"border-2 border-primary\" : \"\"\r\n }`}\r\n >\r\n {plan.featured && (\r\n <div className=\"absolute top-0 right-0 bg-primary text-primary-foreground rounded-full px-2 py-1 text-xs font-bold m-4\">\r\n Most Popular\r\n </div>\r\n )}\r\n\r\n <h3 className=\"mb-4 text-2xl font-bold\">{plan.name}</h3>\r\n\r\n <div className=\"mb-6\">\r\n <span className=\"text-3xl font-semibold\">\r\n {plan.price === \"custom\"\r\n ? \"Custom\"\r\n : `${isAnnual ? plan.price.annually : plan.price.monthly}€`}\r\n </span>\r\n <span className=\"text-muted-foreground mx-2\">•</span>\r\n <span className=\"text-muted-foreground\">{plan.description}</span>\r\n </div>\r\n\r\n <button className=\"bg-primary text-primary-foreground hover:bg-primary/90 mb-6 h-10 w-full rounded-md px-4 py-2 text-sm font-medium\">\r\n {plan.buttonText || \"Get Started\"}\r\n </button>\r\n\r\n <ul className=\"space-y-3\">\r\n {plan.features.map((feature) => (\r\n <li key={feature} className=\"flex items-center gap-3 text-sm\">\r\n <div className=\"flex h-4 w-4 items-center justify-center rounded-full bg-primary\">\r\n <Check className=\"h-2 w-2 text-primary-foreground\" />\r\n </div>\r\n {feature}\r\n </li>\r\n ))}\r\n </ul>\r\n </div>\r\n ))}\r\n </div>\r\n </div>\r\n </section>\r\n );\r\n}\r\n\r\nexport default PricingModern;\r\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
'use strict';Object.defineProperty(exports,'__esModule',{value:true});var react=require('react'),jsxRuntime=require('react/jsx-runtime');function d({children:o,offset:n=50,duration:s=.6,className:c=""}){let e=react.useRef(null),[r,i]=react.useState(false);return react.useEffect(()=>{let t=new IntersectionObserver(([l])=>{l.isIntersecting&&(i(true),t.disconnect());},{threshold:.1});return e.current&&t.observe(e.current),()=>t.disconnect()},[]),jsxRuntime.jsx("div",{ref:e,className:c,style:{transform:r?"translateY(0)":`translateY(${n}px)`,opacity:r?1:0,transition:`transform ${s}s ease-out, opacity ${s}s ease-out`},children:o})}var v=d;exports.ScrollFloat=d;exports.default=v;//# sourceMappingURL=index.js.map
|
|
2
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/scroll-float/index.tsx"],"names":["ScrollFloat","children","offset","duration","className","ref","useRef","isVisible","setIsVisible","useState","useEffect","observer","entry","jsx","scroll_float_default"],"mappings":"yIAWO,SAASA,CAAAA,CAAY,CAC1B,QAAA,CAAAC,CAAAA,CACA,MAAA,CAAAC,CAAAA,CAAS,EAAA,CACT,QAAA,CAAAC,EAAW,EAAA,CACX,SAAA,CAAAC,CAAAA,CAAY,EACd,CAAA,CAAqB,CACnB,IAAMC,CAAAA,CAAMC,YAAAA,CAAuB,IAAI,CAAA,CACjC,CAACC,CAAAA,CAAWC,CAAY,CAAA,CAAIC,cAAAA,CAAS,KAAK,CAAA,CAEhD,OAAAC,eAAAA,CAAU,IAAM,CACd,IAAMC,CAAAA,CAAW,IAAI,oBAAA,CACnB,CAAC,CAACC,CAAK,CAAA,GAAM,CACPA,CAAAA,CAAM,cAAA,GACRJ,CAAAA,CAAa,IAAI,EACjBG,CAAAA,CAAS,UAAA,EAAW,EAExB,CAAA,CACA,CAAE,SAAA,CAAW,EAAI,CACnB,CAAA,CAEA,OAAIN,CAAAA,CAAI,OAAA,EACNM,CAAAA,CAAS,QAAQN,CAAAA,CAAI,OAAO,CAAA,CAGvB,IAAMM,CAAAA,CAAS,UAAA,EACxB,CAAA,CAAG,EAAE,CAAA,CAGHE,cAAAA,CAAC,KAAA,CAAA,CACC,GAAA,CAAKR,EACL,SAAA,CAAWD,CAAAA,CACX,KAAA,CAAO,CACL,SAAA,CAAWG,CAAAA,CAAY,gBAAkB,CAAA,WAAA,EAAcL,CAAM,CAAA,GAAA,CAAA,CAC7D,OAAA,CAASK,CAAAA,CAAY,CAAA,CAAI,EACzB,UAAA,CAAY,CAAA,UAAA,EAAaJ,CAAQ,CAAA,oBAAA,EAAuBA,CAAQ,CAAA,UAAA,CAClE,CAAA,CAEC,QAAA,CAAAF,CAAAA,CACH,CAEJ,CAEA,IAAOa,CAAAA,CAAQd","file":"index.js","sourcesContent":["\"use client\";\r\n\r\nimport { useEffect, useRef, useState, ReactNode } from \"react\";\r\n\r\ninterface ScrollFloatProps {\r\n children: ReactNode;\r\n offset?: number;\r\n duration?: number;\r\n className?: string;\r\n}\r\n\r\nexport function ScrollFloat({\r\n children,\r\n offset = 50,\r\n duration = 0.6,\r\n className = \"\",\r\n}: ScrollFloatProps) {\r\n const ref = useRef<HTMLDivElement>(null);\r\n const [isVisible, setIsVisible] = useState(false);\r\n\r\n useEffect(() => {\r\n const observer = new IntersectionObserver(\r\n ([entry]) => {\r\n if (entry.isIntersecting) {\r\n setIsVisible(true);\r\n observer.disconnect();\r\n }\r\n },\r\n { threshold: 0.1 }\r\n );\r\n\r\n if (ref.current) {\r\n observer.observe(ref.current);\r\n }\r\n\r\n return () => observer.disconnect();\r\n }, []);\r\n\r\n return (\r\n <div\r\n ref={ref}\r\n className={className}\r\n style={{\r\n transform: isVisible ? \"translateY(0)\" : `translateY(${offset}px)`,\r\n opacity: isVisible ? 1 : 0,\r\n transition: `transform ${duration}s ease-out, opacity ${duration}s ease-out`,\r\n }}\r\n >\r\n {children}\r\n </div>\r\n );\r\n}\r\n\r\nexport default ScrollFloat;\r\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import {useRef,useState,useEffect}from'react';import {jsx}from'react/jsx-runtime';function d({children:o,offset:n=50,duration:s=.6,className:c=""}){let e=useRef(null),[r,i]=useState(false);return useEffect(()=>{let t=new IntersectionObserver(([l])=>{l.isIntersecting&&(i(true),t.disconnect());},{threshold:.1});return e.current&&t.observe(e.current),()=>t.disconnect()},[]),jsx("div",{ref:e,className:c,style:{transform:r?"translateY(0)":`translateY(${n}px)`,opacity:r?1:0,transition:`transform ${s}s ease-out, opacity ${s}s ease-out`},children:o})}var v=d;export{d as ScrollFloat,v as default};//# sourceMappingURL=index.mjs.map
|
|
2
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/scroll-float/index.tsx"],"names":["ScrollFloat","children","offset","duration","className","ref","useRef","isVisible","setIsVisible","useState","useEffect","observer","entry","jsx","scroll_float_default"],"mappings":"kFAWO,SAASA,CAAAA,CAAY,CAC1B,QAAA,CAAAC,CAAAA,CACA,MAAA,CAAAC,CAAAA,CAAS,EAAA,CACT,QAAA,CAAAC,EAAW,EAAA,CACX,SAAA,CAAAC,CAAAA,CAAY,EACd,CAAA,CAAqB,CACnB,IAAMC,CAAAA,CAAMC,MAAAA,CAAuB,IAAI,CAAA,CACjC,CAACC,CAAAA,CAAWC,CAAY,CAAA,CAAIC,QAAAA,CAAS,KAAK,CAAA,CAEhD,OAAAC,SAAAA,CAAU,IAAM,CACd,IAAMC,CAAAA,CAAW,IAAI,oBAAA,CACnB,CAAC,CAACC,CAAK,CAAA,GAAM,CACPA,CAAAA,CAAM,cAAA,GACRJ,CAAAA,CAAa,IAAI,EACjBG,CAAAA,CAAS,UAAA,EAAW,EAExB,CAAA,CACA,CAAE,SAAA,CAAW,EAAI,CACnB,CAAA,CAEA,OAAIN,CAAAA,CAAI,OAAA,EACNM,CAAAA,CAAS,QAAQN,CAAAA,CAAI,OAAO,CAAA,CAGvB,IAAMM,CAAAA,CAAS,UAAA,EACxB,CAAA,CAAG,EAAE,CAAA,CAGHE,GAAAA,CAAC,KAAA,CAAA,CACC,GAAA,CAAKR,EACL,SAAA,CAAWD,CAAAA,CACX,KAAA,CAAO,CACL,SAAA,CAAWG,CAAAA,CAAY,gBAAkB,CAAA,WAAA,EAAcL,CAAM,CAAA,GAAA,CAAA,CAC7D,OAAA,CAASK,CAAAA,CAAY,CAAA,CAAI,EACzB,UAAA,CAAY,CAAA,UAAA,EAAaJ,CAAQ,CAAA,oBAAA,EAAuBA,CAAQ,CAAA,UAAA,CAClE,CAAA,CAEC,QAAA,CAAAF,CAAAA,CACH,CAEJ,CAEA,IAAOa,CAAAA,CAAQd","file":"index.mjs","sourcesContent":["\"use client\";\r\n\r\nimport { useEffect, useRef, useState, ReactNode } from \"react\";\r\n\r\ninterface ScrollFloatProps {\r\n children: ReactNode;\r\n offset?: number;\r\n duration?: number;\r\n className?: string;\r\n}\r\n\r\nexport function ScrollFloat({\r\n children,\r\n offset = 50,\r\n duration = 0.6,\r\n className = \"\",\r\n}: ScrollFloatProps) {\r\n const ref = useRef<HTMLDivElement>(null);\r\n const [isVisible, setIsVisible] = useState(false);\r\n\r\n useEffect(() => {\r\n const observer = new IntersectionObserver(\r\n ([entry]) => {\r\n if (entry.isIntersecting) {\r\n setIsVisible(true);\r\n observer.disconnect();\r\n }\r\n },\r\n { threshold: 0.1 }\r\n );\r\n\r\n if (ref.current) {\r\n observer.observe(ref.current);\r\n }\r\n\r\n return () => observer.disconnect();\r\n }, []);\r\n\r\n return (\r\n <div\r\n ref={ref}\r\n className={className}\r\n style={{\r\n transform: isVisible ? \"translateY(0)\" : `translateY(${offset}px)`,\r\n opacity: isVisible ? 1 : 0,\r\n transition: `transform ${duration}s ease-out, opacity ${duration}s ease-out`,\r\n }}\r\n >\r\n {children}\r\n </div>\r\n );\r\n}\r\n\r\nexport default ScrollFloat;\r\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
'use strict';Object.defineProperty(exports,'__esModule',{value:true});var react=require('react'),jsxRuntime=require('react/jsx-runtime');function d({children:o,direction:l="up",distance:e=30,duration:s=.6,delay:n=0,className:c=""}){let r=react.useRef(null),[a,i]=react.useState(false);return react.useEffect(()=>{let t=new IntersectionObserver(([u])=>{u.isIntersecting&&(i(true),t.disconnect());},{threshold:.1});return r.current&&t.observe(r.current),()=>t.disconnect()},[]),jsxRuntime.jsx("div",{ref:r,className:c,style:{transform:(()=>{if(a)return "translate(0, 0)";switch(l){case "up":return `translateY(${e}px)`;case "down":return `translateY(-${e}px)`;case "left":return `translateX(${e}px)`;case "right":return `translateX(-${e}px)`;default:return `translateY(${e}px)`}})(),opacity:a?1:0,transition:`transform ${s}s ease-out ${n}s, opacity ${s}s ease-out ${n}s`},children:o})}var h=d;exports.ScrollReveal=d;exports.default=h;//# sourceMappingURL=index.js.map
|
|
2
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/scroll-reveal/index.tsx"],"names":["ScrollReveal","children","direction","distance","duration","delay","className","ref","useRef","isVisible","setIsVisible","useState","useEffect","observer","entry","jsx","scroll_reveal_default"],"mappings":"yIAaO,SAASA,CAAAA,CAAa,CAC3B,QAAA,CAAAC,CAAAA,CACA,UAAAC,CAAAA,CAAY,IAAA,CACZ,QAAA,CAAAC,CAAAA,CAAW,GACX,QAAA,CAAAC,CAAAA,CAAW,EAAA,CACX,KAAA,CAAAC,EAAQ,CAAA,CACR,SAAA,CAAAC,CAAAA,CAAY,EACd,EAAsB,CACpB,IAAMC,CAAAA,CAAMC,YAAAA,CAAuB,IAAI,CAAA,CACjC,CAACC,CAAAA,CAAWC,CAAY,EAAIC,cAAAA,CAAS,KAAK,CAAA,CAEhD,OAAAC,gBAAU,IAAM,CACd,IAAMC,CAAAA,CAAW,IAAI,oBAAA,CACnB,CAAC,CAACC,CAAK,IAAM,CACPA,CAAAA,CAAM,cAAA,GACRJ,CAAAA,CAAa,IAAI,CAAA,CACjBG,CAAAA,CAAS,UAAA,EAAW,EAExB,EACA,CAAE,SAAA,CAAW,EAAI,CACnB,EAEA,OAAIN,CAAAA,CAAI,OAAA,EACNM,CAAAA,CAAS,QAAQN,CAAAA,CAAI,OAAO,CAAA,CAGvB,IAAMM,EAAS,UAAA,EACxB,CAAA,CAAG,EAAE,CAAA,CAmBHE,cAAAA,CAAC,KAAA,CAAA,CACC,GAAA,CAAKR,EACL,SAAA,CAAWD,CAAAA,CACX,KAAA,CAAO,CACL,WArBe,IAAM,CACzB,GAAIG,CAAAA,CAAW,OAAO,iBAAA,CACtB,OAAQP,CAAAA,EACN,KAAK,IAAA,CACH,OAAO,CAAA,WAAA,EAAcC,CAAQ,MAC/B,KAAK,MAAA,CACH,OAAO,CAAA,YAAA,EAAeA,CAAQ,CAAA,GAAA,CAAA,CAChC,KAAK,MAAA,CACH,OAAO,cAAcA,CAAQ,CAAA,GAAA,CAAA,CAC/B,KAAK,OAAA,CACH,OAAO,CAAA,YAAA,EAAeA,CAAQ,CAAA,GAAA,CAAA,CAChC,QACE,OAAO,CAAA,WAAA,EAAcA,CAAQ,CAAA,GAAA,CACjC,CACF,IAO8B,CACxB,OAAA,CAASM,CAAAA,CAAY,CAAA,CAAI,EACzB,UAAA,CAAY,CAAA,UAAA,EAAaL,CAAQ,CAAA,WAAA,EAAcC,CAAK,CAAA,WAAA,EAAcD,CAAQ,CAAA,WAAA,EAAcC,CAAK,GAC/F,CAAA,CAEC,QAAA,CAAAJ,EACH,CAEJ,KAEOe,CAAAA,CAAQhB","file":"index.js","sourcesContent":["\"use client\";\r\n\r\nimport { useEffect, useRef, useState, ReactNode } from \"react\";\r\n\r\ninterface ScrollRevealProps {\r\n children: ReactNode;\r\n direction?: \"up\" | \"down\" | \"left\" | \"right\";\r\n distance?: number;\r\n duration?: number;\r\n delay?: number;\r\n className?: string;\r\n}\r\n\r\nexport function ScrollReveal({\r\n children,\r\n direction = \"up\",\r\n distance = 30,\r\n duration = 0.6,\r\n delay = 0,\r\n className = \"\",\r\n}: ScrollRevealProps) {\r\n const ref = useRef<HTMLDivElement>(null);\r\n const [isVisible, setIsVisible] = useState(false);\r\n\r\n useEffect(() => {\r\n const observer = new IntersectionObserver(\r\n ([entry]) => {\r\n if (entry.isIntersecting) {\r\n setIsVisible(true);\r\n observer.disconnect();\r\n }\r\n },\r\n { threshold: 0.1 }\r\n );\r\n\r\n if (ref.current) {\r\n observer.observe(ref.current);\r\n }\r\n\r\n return () => observer.disconnect();\r\n }, []);\r\n\r\n const getTransform = () => {\r\n if (isVisible) return \"translate(0, 0)\";\r\n switch (direction) {\r\n case \"up\":\r\n return `translateY(${distance}px)`;\r\n case \"down\":\r\n return `translateY(-${distance}px)`;\r\n case \"left\":\r\n return `translateX(${distance}px)`;\r\n case \"right\":\r\n return `translateX(-${distance}px)`;\r\n default:\r\n return `translateY(${distance}px)`;\r\n }\r\n };\r\n\r\n return (\r\n <div\r\n ref={ref}\r\n className={className}\r\n style={{\r\n transform: getTransform(),\r\n opacity: isVisible ? 1 : 0,\r\n transition: `transform ${duration}s ease-out ${delay}s, opacity ${duration}s ease-out ${delay}s`,\r\n }}\r\n >\r\n {children}\r\n </div>\r\n );\r\n}\r\n\r\nexport default ScrollReveal;\r\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import {useRef,useState,useEffect}from'react';import {jsx}from'react/jsx-runtime';function d({children:o,direction:l="up",distance:e=30,duration:s=.6,delay:n=0,className:c=""}){let r=useRef(null),[a,i]=useState(false);return useEffect(()=>{let t=new IntersectionObserver(([u])=>{u.isIntersecting&&(i(true),t.disconnect());},{threshold:.1});return r.current&&t.observe(r.current),()=>t.disconnect()},[]),jsx("div",{ref:r,className:c,style:{transform:(()=>{if(a)return "translate(0, 0)";switch(l){case "up":return `translateY(${e}px)`;case "down":return `translateY(-${e}px)`;case "left":return `translateX(${e}px)`;case "right":return `translateX(-${e}px)`;default:return `translateY(${e}px)`}})(),opacity:a?1:0,transition:`transform ${s}s ease-out ${n}s, opacity ${s}s ease-out ${n}s`},children:o})}var h=d;export{d as ScrollReveal,h as default};//# sourceMappingURL=index.mjs.map
|
|
2
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/scroll-reveal/index.tsx"],"names":["ScrollReveal","children","direction","distance","duration","delay","className","ref","useRef","isVisible","setIsVisible","useState","useEffect","observer","entry","jsx","scroll_reveal_default"],"mappings":"kFAaO,SAASA,CAAAA,CAAa,CAC3B,QAAA,CAAAC,CAAAA,CACA,UAAAC,CAAAA,CAAY,IAAA,CACZ,QAAA,CAAAC,CAAAA,CAAW,GACX,QAAA,CAAAC,CAAAA,CAAW,EAAA,CACX,KAAA,CAAAC,EAAQ,CAAA,CACR,SAAA,CAAAC,CAAAA,CAAY,EACd,EAAsB,CACpB,IAAMC,CAAAA,CAAMC,MAAAA,CAAuB,IAAI,CAAA,CACjC,CAACC,CAAAA,CAAWC,CAAY,EAAIC,QAAAA,CAAS,KAAK,CAAA,CAEhD,OAAAC,UAAU,IAAM,CACd,IAAMC,CAAAA,CAAW,IAAI,oBAAA,CACnB,CAAC,CAACC,CAAK,IAAM,CACPA,CAAAA,CAAM,cAAA,GACRJ,CAAAA,CAAa,IAAI,CAAA,CACjBG,CAAAA,CAAS,UAAA,EAAW,EAExB,EACA,CAAE,SAAA,CAAW,EAAI,CACnB,EAEA,OAAIN,CAAAA,CAAI,OAAA,EACNM,CAAAA,CAAS,QAAQN,CAAAA,CAAI,OAAO,CAAA,CAGvB,IAAMM,EAAS,UAAA,EACxB,CAAA,CAAG,EAAE,CAAA,CAmBHE,GAAAA,CAAC,KAAA,CAAA,CACC,GAAA,CAAKR,EACL,SAAA,CAAWD,CAAAA,CACX,KAAA,CAAO,CACL,WArBe,IAAM,CACzB,GAAIG,CAAAA,CAAW,OAAO,iBAAA,CACtB,OAAQP,CAAAA,EACN,KAAK,IAAA,CACH,OAAO,CAAA,WAAA,EAAcC,CAAQ,MAC/B,KAAK,MAAA,CACH,OAAO,CAAA,YAAA,EAAeA,CAAQ,CAAA,GAAA,CAAA,CAChC,KAAK,MAAA,CACH,OAAO,cAAcA,CAAQ,CAAA,GAAA,CAAA,CAC/B,KAAK,OAAA,CACH,OAAO,CAAA,YAAA,EAAeA,CAAQ,CAAA,GAAA,CAAA,CAChC,QACE,OAAO,CAAA,WAAA,EAAcA,CAAQ,CAAA,GAAA,CACjC,CACF,IAO8B,CACxB,OAAA,CAASM,CAAAA,CAAY,CAAA,CAAI,EACzB,UAAA,CAAY,CAAA,UAAA,EAAaL,CAAQ,CAAA,WAAA,EAAcC,CAAK,CAAA,WAAA,EAAcD,CAAQ,CAAA,WAAA,EAAcC,CAAK,GAC/F,CAAA,CAEC,QAAA,CAAAJ,EACH,CAEJ,KAEOe,CAAAA,CAAQhB","file":"index.mjs","sourcesContent":["\"use client\";\r\n\r\nimport { useEffect, useRef, useState, ReactNode } from \"react\";\r\n\r\ninterface ScrollRevealProps {\r\n children: ReactNode;\r\n direction?: \"up\" | \"down\" | \"left\" | \"right\";\r\n distance?: number;\r\n duration?: number;\r\n delay?: number;\r\n className?: string;\r\n}\r\n\r\nexport function ScrollReveal({\r\n children,\r\n direction = \"up\",\r\n distance = 30,\r\n duration = 0.6,\r\n delay = 0,\r\n className = \"\",\r\n}: ScrollRevealProps) {\r\n const ref = useRef<HTMLDivElement>(null);\r\n const [isVisible, setIsVisible] = useState(false);\r\n\r\n useEffect(() => {\r\n const observer = new IntersectionObserver(\r\n ([entry]) => {\r\n if (entry.isIntersecting) {\r\n setIsVisible(true);\r\n observer.disconnect();\r\n }\r\n },\r\n { threshold: 0.1 }\r\n );\r\n\r\n if (ref.current) {\r\n observer.observe(ref.current);\r\n }\r\n\r\n return () => observer.disconnect();\r\n }, []);\r\n\r\n const getTransform = () => {\r\n if (isVisible) return \"translate(0, 0)\";\r\n switch (direction) {\r\n case \"up\":\r\n return `translateY(${distance}px)`;\r\n case \"down\":\r\n return `translateY(-${distance}px)`;\r\n case \"left\":\r\n return `translateX(${distance}px)`;\r\n case \"right\":\r\n return `translateX(-${distance}px)`;\r\n default:\r\n return `translateY(${distance}px)`;\r\n }\r\n };\r\n\r\n return (\r\n <div\r\n ref={ref}\r\n className={className}\r\n style={{\r\n transform: getTransform(),\r\n opacity: isVisible ? 1 : 0,\r\n transition: `transform ${duration}s ease-out ${delay}s, opacity ${duration}s ease-out ${delay}s`,\r\n }}\r\n >\r\n {children}\r\n </div>\r\n );\r\n}\r\n\r\nexport default ScrollReveal;\r\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
'use strict';Object.defineProperty(exports,'__esModule',{value:true});var react=require('react'),jsxRuntime=require('react/jsx-runtime');function d({children:c,stagger:r=.1,className:a=""}){let s=react.useRef(null),[n,i]=react.useState(false);return react.useEffect(()=>{let e=new IntersectionObserver(([t])=>{t.isIntersecting&&(i(true),e.disconnect());},{threshold:.1});return s.current&&e.observe(s.current),()=>e.disconnect()},[]),jsxRuntime.jsx("div",{ref:s,className:a,children:c.map((e,t)=>jsxRuntime.jsx("div",{style:{transform:n?"translateY(0)":"translateY(30px)",opacity:n?1:0,transition:`transform 0.6s ease-out ${t*r}s, opacity 0.6s ease-out ${t*r}s`},children:e},t))})}var v=d;exports.ScrollStack=d;exports.default=v;//# sourceMappingURL=index.js.map
|
|
2
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/scroll-stack/index.tsx"],"names":["ScrollStack","children","stagger","className","ref","useRef","isVisible","setIsVisible","useState","useEffect","observer","entry","jsx","child","index","scroll_stack_default"],"mappings":"yIAUO,SAASA,CAAAA,CAAY,CAAE,SAAAC,CAAAA,CAAU,OAAA,CAAAC,CAAAA,CAAU,EAAA,CAAK,SAAA,CAAAC,CAAAA,CAAY,EAAG,CAAA,CAAqB,CACzF,IAAMC,CAAAA,CAAMC,YAAAA,CAAuB,IAAI,CAAA,CACjC,CAACC,CAAAA,CAAWC,CAAY,CAAA,CAAIC,cAAAA,CAAS,KAAK,CAAA,CAEhD,OAAAC,eAAAA,CAAU,IAAM,CACd,IAAMC,CAAAA,CAAW,IAAI,oBAAA,CACnB,CAAC,CAACC,CAAK,CAAA,GAAM,CACPA,CAAAA,CAAM,cAAA,GACRJ,CAAAA,CAAa,IAAI,CAAA,CACjBG,CAAAA,CAAS,UAAA,EAAW,EAExB,CAAA,CACA,CAAE,SAAA,CAAW,EAAI,CACnB,CAAA,CAEA,OAAIN,CAAAA,CAAI,OAAA,EACNM,CAAAA,CAAS,OAAA,CAAQN,CAAAA,CAAI,OAAO,CAAA,CAGvB,IAAMM,CAAAA,CAAS,UAAA,EACxB,CAAA,CAAG,EAAE,CAAA,CAGHE,cAAAA,CAAC,KAAA,CAAA,CAAI,GAAA,CAAKR,CAAAA,CAAK,SAAA,CAAWD,CAAAA,CACvB,QAAA,CAAAF,CAAAA,CAAS,GAAA,CAAI,CAACY,CAAAA,CAAOC,CAAAA,GACpBF,eAAC,KAAA,CAAA,CAEC,KAAA,CAAO,CACL,SAAA,CAAWN,CAAAA,CAAY,eAAA,CAAkB,kBAAA,CACzC,OAAA,CAASA,CAAAA,CAAY,CAAA,CAAI,CAAA,CACzB,UAAA,CAAY,CAAA,wBAAA,EAA2BQ,CAAAA,CAAQZ,CAAO,CAAA,yBAAA,EAA4BY,CAAAA,CAAQZ,CAAO,CAAA,CAAA,CACnG,CAAA,CAEC,QAAA,CAAAW,CAAAA,CAAAA,CAPIC,CAQP,CACD,CAAA,CACH,CAEJ,CAEA,IAAOC,CAAAA,CAAQf","file":"index.js","sourcesContent":["\"use client\";\r\n\r\nimport { useEffect, useRef, useState, ReactNode } from \"react\";\r\n\r\ninterface ScrollStackProps {\r\n children: ReactNode[];\r\n stagger?: number;\r\n className?: string;\r\n}\r\n\r\nexport function ScrollStack({ children, stagger = 0.1, className = \"\" }: ScrollStackProps) {\r\n const ref = useRef<HTMLDivElement>(null);\r\n const [isVisible, setIsVisible] = useState(false);\r\n\r\n useEffect(() => {\r\n const observer = new IntersectionObserver(\r\n ([entry]) => {\r\n if (entry.isIntersecting) {\r\n setIsVisible(true);\r\n observer.disconnect();\r\n }\r\n },\r\n { threshold: 0.1 }\r\n );\r\n\r\n if (ref.current) {\r\n observer.observe(ref.current);\r\n }\r\n\r\n return () => observer.disconnect();\r\n }, []);\r\n\r\n return (\r\n <div ref={ref} className={className}>\r\n {children.map((child, index) => (\r\n <div\r\n key={index}\r\n style={{\r\n transform: isVisible ? \"translateY(0)\" : \"translateY(30px)\",\r\n opacity: isVisible ? 1 : 0,\r\n transition: `transform 0.6s ease-out ${index * stagger}s, opacity 0.6s ease-out ${index * stagger}s`,\r\n }}\r\n >\r\n {child}\r\n </div>\r\n ))}\r\n </div>\r\n );\r\n}\r\n\r\nexport default ScrollStack;\r\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import {useRef,useState,useEffect}from'react';import {jsx}from'react/jsx-runtime';function d({children:c,stagger:r=.1,className:a=""}){let s=useRef(null),[n,i]=useState(false);return useEffect(()=>{let e=new IntersectionObserver(([t])=>{t.isIntersecting&&(i(true),e.disconnect());},{threshold:.1});return s.current&&e.observe(s.current),()=>e.disconnect()},[]),jsx("div",{ref:s,className:a,children:c.map((e,t)=>jsx("div",{style:{transform:n?"translateY(0)":"translateY(30px)",opacity:n?1:0,transition:`transform 0.6s ease-out ${t*r}s, opacity 0.6s ease-out ${t*r}s`},children:e},t))})}var v=d;export{d as ScrollStack,v as default};//# sourceMappingURL=index.mjs.map
|
|
2
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/scroll-stack/index.tsx"],"names":["ScrollStack","children","stagger","className","ref","useRef","isVisible","setIsVisible","useState","useEffect","observer","entry","jsx","child","index","scroll_stack_default"],"mappings":"kFAUO,SAASA,CAAAA,CAAY,CAAE,SAAAC,CAAAA,CAAU,OAAA,CAAAC,CAAAA,CAAU,EAAA,CAAK,SAAA,CAAAC,CAAAA,CAAY,EAAG,CAAA,CAAqB,CACzF,IAAMC,CAAAA,CAAMC,MAAAA,CAAuB,IAAI,CAAA,CACjC,CAACC,CAAAA,CAAWC,CAAY,CAAA,CAAIC,QAAAA,CAAS,KAAK,CAAA,CAEhD,OAAAC,SAAAA,CAAU,IAAM,CACd,IAAMC,CAAAA,CAAW,IAAI,oBAAA,CACnB,CAAC,CAACC,CAAK,CAAA,GAAM,CACPA,CAAAA,CAAM,cAAA,GACRJ,CAAAA,CAAa,IAAI,CAAA,CACjBG,CAAAA,CAAS,UAAA,EAAW,EAExB,CAAA,CACA,CAAE,SAAA,CAAW,EAAI,CACnB,CAAA,CAEA,OAAIN,CAAAA,CAAI,OAAA,EACNM,CAAAA,CAAS,OAAA,CAAQN,CAAAA,CAAI,OAAO,CAAA,CAGvB,IAAMM,CAAAA,CAAS,UAAA,EACxB,CAAA,CAAG,EAAE,CAAA,CAGHE,GAAAA,CAAC,KAAA,CAAA,CAAI,GAAA,CAAKR,CAAAA,CAAK,SAAA,CAAWD,CAAAA,CACvB,QAAA,CAAAF,CAAAA,CAAS,GAAA,CAAI,CAACY,CAAAA,CAAOC,CAAAA,GACpBF,IAAC,KAAA,CAAA,CAEC,KAAA,CAAO,CACL,SAAA,CAAWN,CAAAA,CAAY,eAAA,CAAkB,kBAAA,CACzC,OAAA,CAASA,CAAAA,CAAY,CAAA,CAAI,CAAA,CACzB,UAAA,CAAY,CAAA,wBAAA,EAA2BQ,CAAAA,CAAQZ,CAAO,CAAA,yBAAA,EAA4BY,CAAAA,CAAQZ,CAAO,CAAA,CAAA,CACnG,CAAA,CAEC,QAAA,CAAAW,CAAAA,CAAAA,CAPIC,CAQP,CACD,CAAA,CACH,CAEJ,CAEA,IAAOC,CAAAA,CAAQf","file":"index.mjs","sourcesContent":["\"use client\";\r\n\r\nimport { useEffect, useRef, useState, ReactNode } from \"react\";\r\n\r\ninterface ScrollStackProps {\r\n children: ReactNode[];\r\n stagger?: number;\r\n className?: string;\r\n}\r\n\r\nexport function ScrollStack({ children, stagger = 0.1, className = \"\" }: ScrollStackProps) {\r\n const ref = useRef<HTMLDivElement>(null);\r\n const [isVisible, setIsVisible] = useState(false);\r\n\r\n useEffect(() => {\r\n const observer = new IntersectionObserver(\r\n ([entry]) => {\r\n if (entry.isIntersecting) {\r\n setIsVisible(true);\r\n observer.disconnect();\r\n }\r\n },\r\n { threshold: 0.1 }\r\n );\r\n\r\n if (ref.current) {\r\n observer.observe(ref.current);\r\n }\r\n\r\n return () => observer.disconnect();\r\n }, []);\r\n\r\n return (\r\n <div ref={ref} className={className}>\r\n {children.map((child, index) => (\r\n <div\r\n key={index}\r\n style={{\r\n transform: isVisible ? \"translateY(0)\" : \"translateY(30px)\",\r\n opacity: isVisible ? 1 : 0,\r\n transition: `transform 0.6s ease-out ${index * stagger}s, opacity 0.6s ease-out ${index * stagger}s`,\r\n }}\r\n >\r\n {child}\r\n </div>\r\n ))}\r\n </div>\r\n );\r\n}\r\n\r\nexport default ScrollStack;\r\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
'use strict';Object.defineProperty(exports,'__esModule',{value:true});var react=require('react'),jsxRuntime=require('react/jsx-runtime');function k({direction:v="right",speed:i=1,borderColor:x="#999",squareSize:t=40,hoverFillColor:y="#222",className:p=""}){let g=react.useRef(null),f=react.useRef(null),n=react.useRef({x:0,y:0}),s=react.useRef(null);return react.useEffect(()=>{let r=g.current;if(!r)return;let o=r.getContext("2d"),d=()=>{r.width=r.offsetWidth,r.height=r.offsetHeight;};window.addEventListener("resize",d),d();let E=()=>{if(!o)return;o.clearRect(0,0,r.width,r.height);let e=Math.floor(n.current.x/t)*t,u=Math.floor(n.current.y/t)*t;for(let c=e;c<r.width+t;c+=t)for(let l=u;l<r.height+t;l+=t){let a=c-n.current.x%t,h=l-n.current.y%t;s.current&&Math.floor((c-e)/t)===s.current.x&&Math.floor((l-u)/t)===s.current.y&&(o.fillStyle=y,o.fillRect(a,h,t,t)),o.strokeStyle=x,o.strokeRect(a,h,t,t);}},M=()=>{let e=Math.max(i,.1);switch(v){case "right":n.current.x=(n.current.x-e+t)%t;break;case "left":n.current.x=(n.current.x+e+t)%t;break;case "up":n.current.y=(n.current.y+e+t)%t;break;case "down":n.current.y=(n.current.y-e+t)%t;break;case "diagonal":n.current.x=(n.current.x-e+t)%t,n.current.y=(n.current.y-e+t)%t;break}E(),f.current=requestAnimationFrame(M);},w=e=>{let u=r.getBoundingClientRect(),c=e.clientX-u.left,l=e.clientY-u.top,a=Math.floor(n.current.x/t)*t,h=Math.floor(n.current.y/t)*t;s.current={x:Math.floor((c+n.current.x-a)/t),y:Math.floor((l+n.current.y-h)/t)};},b=()=>{s.current=null;};return r.addEventListener("mousemove",w),r.addEventListener("mouseleave",b),f.current=requestAnimationFrame(M),()=>{window.removeEventListener("resize",d),f.current&&cancelAnimationFrame(f.current),r.removeEventListener("mousemove",w),r.removeEventListener("mouseleave",b);}},[v,i,x,y,t]),jsxRuntime.jsx("canvas",{ref:g,className:`w-full h-full ${p}`})}var Y=k;exports.Squares=k;exports.default=Y;//# sourceMappingURL=index.js.map
|
|
2
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/squares/index.tsx"],"names":["Squares","direction","speed","borderColor","squareSize","hoverFillColor","className","canvasRef","useRef","requestRef","gridOffset","hoveredSquare","useEffect","canvas","ctx","resizeCanvas","drawGrid","startX","startY","x","y","squareX","squareY","updateAnimation","effectiveSpeed","handleMouseMove","event","rect","mouseX","mouseY","handleMouseLeave","jsx","squares_default"],"mappings":"yIAaO,SAASA,CAAAA,CAAQ,CACtB,UAAAC,CAAAA,CAAY,OAAA,CACZ,MAAAC,CAAAA,CAAQ,CAAA,CACR,YAAAC,CAAAA,CAAc,MAAA,CACd,UAAA,CAAAC,CAAAA,CAAa,EAAA,CACb,cAAA,CAAAC,EAAiB,MAAA,CACjB,SAAA,CAAAC,EAAY,EACd,CAAA,CAAiB,CACf,IAAMC,CAAAA,CAAYC,YAAAA,CAA0B,IAAI,CAAA,CAC1CC,CAAAA,CAAaD,aAAsB,IAAI,CAAA,CACvCE,EAAaF,YAAAA,CAAO,CAAE,EAAG,CAAA,CAAG,CAAA,CAAG,CAAE,CAAC,CAAA,CAClCG,CAAAA,CAAgBH,aAAwC,IAAI,CAAA,CAElE,OAAAI,eAAAA,CAAU,IAAM,CACd,IAAMC,CAAAA,CAASN,CAAAA,CAAU,OAAA,CACzB,GAAI,CAACM,EAAQ,OACb,IAAMC,EAAMD,CAAAA,CAAO,UAAA,CAAW,IAAI,CAAA,CAE5BE,CAAAA,CAAe,IAAM,CACzBF,CAAAA,CAAO,KAAA,CAAQA,EAAO,WAAA,CACtBA,CAAAA,CAAO,OAASA,CAAAA,CAAO,aACzB,EAEA,MAAA,CAAO,gBAAA,CAAiB,QAAA,CAAUE,CAAY,CAAA,CAC9CA,CAAAA,GAEA,IAAMC,CAAAA,CAAW,IAAM,CACrB,GAAI,CAACF,EAAK,OACVA,CAAAA,CAAI,SAAA,CAAU,CAAA,CAAG,CAAA,CAAGD,CAAAA,CAAO,MAAOA,CAAAA,CAAO,MAAM,EAE/C,IAAMI,CAAAA,CAAS,KAAK,KAAA,CAAMP,CAAAA,CAAW,OAAA,CAAQ,CAAA,CAAIN,CAAU,CAAA,CAAIA,EACzDc,CAAAA,CAAS,IAAA,CAAK,MAAMR,CAAAA,CAAW,OAAA,CAAQ,EAAIN,CAAU,CAAA,CAAIA,CAAAA,CAE/D,IAAA,IAASe,CAAAA,CAAIF,CAAAA,CAAQE,EAAIN,CAAAA,CAAO,KAAA,CAAQT,EAAYe,CAAAA,EAAKf,CAAAA,CACvD,QAASgB,CAAAA,CAAIF,CAAAA,CAAQE,CAAAA,CAAIP,CAAAA,CAAO,MAAA,CAAST,CAAAA,CAAYgB,GAAKhB,CAAAA,CAAY,CACpE,IAAMiB,CAAAA,CAAUF,CAAAA,CAAKT,CAAAA,CAAW,QAAQ,CAAA,CAAIN,CAAAA,CACtCkB,CAAAA,CAAUF,CAAAA,CAAKV,CAAAA,CAAW,OAAA,CAAQ,EAAIN,CAAAA,CAG1CO,CAAAA,CAAc,SACd,IAAA,CAAK,KAAA,CAAA,CAAOQ,EAAIF,CAAAA,EAAUb,CAAU,CAAA,GAAMO,CAAAA,CAAc,OAAA,CAAQ,CAAA,EAChE,KAAK,KAAA,CAAA,CAAOS,CAAAA,CAAIF,GAAUd,CAAU,CAAA,GAAMO,EAAc,OAAA,CAAQ,CAAA,GAEhEG,CAAAA,CAAI,SAAA,CAAYT,CAAAA,CAChBS,CAAAA,CAAI,SAASO,CAAAA,CAASC,CAAAA,CAASlB,EAAYA,CAAU,CAAA,CAAA,CAGvDU,EAAI,WAAA,CAAcX,CAAAA,CAClBW,CAAAA,CAAI,UAAA,CAAWO,CAAAA,CAASC,CAAAA,CAASlB,EAAYA,CAAU,EACzD,CAEJ,CAAA,CAEMmB,CAAAA,CAAkB,IAAM,CAC5B,IAAMC,CAAAA,CAAiB,IAAA,CAAK,GAAA,CAAItB,CAAAA,CAAO,EAAG,EAC1C,OAAQD,CAAAA,EACN,KAAK,OAAA,CACHS,EAAW,OAAA,CAAQ,CAAA,CAAA,CAAKA,CAAAA,CAAW,OAAA,CAAQ,CAAA,CAAIc,CAAAA,CAAiBpB,GAAcA,CAAAA,CAC9E,MACF,KAAK,MAAA,CACHM,CAAAA,CAAW,QAAQ,CAAA,CAAA,CAAKA,CAAAA,CAAW,OAAA,CAAQ,CAAA,CAAIc,CAAAA,CAAiBpB,CAAAA,EAAcA,EAC9E,MACF,KAAK,KACHM,CAAAA,CAAW,OAAA,CAAQ,GAAKA,CAAAA,CAAW,OAAA,CAAQ,CAAA,CAAIc,CAAAA,CAAiBpB,CAAAA,EAAcA,CAAAA,CAC9E,MACF,KAAK,MAAA,CACHM,CAAAA,CAAW,OAAA,CAAQ,CAAA,CAAA,CAAKA,CAAAA,CAAW,QAAQ,CAAA,CAAIc,CAAAA,CAAiBpB,CAAAA,EAAcA,CAAAA,CAC9E,MACF,KAAK,WACHM,CAAAA,CAAW,OAAA,CAAQ,GAAKA,CAAAA,CAAW,OAAA,CAAQ,EAAIc,CAAAA,CAAiBpB,CAAAA,EAAcA,CAAAA,CAC9EM,CAAAA,CAAW,OAAA,CAAQ,CAAA,CAAA,CAAKA,EAAW,OAAA,CAAQ,CAAA,CAAIc,EAAiBpB,CAAAA,EAAcA,CAAAA,CAC9E,KACJ,CAEAY,CAAAA,EAAS,CACTP,CAAAA,CAAW,OAAA,CAAU,qBAAA,CAAsBc,CAAe,EAC5D,CAAA,CAEME,EAAmBC,CAAAA,EAAsB,CAC7C,IAAMC,CAAAA,CAAOd,CAAAA,CAAO,qBAAA,EAAsB,CACpCe,CAAAA,CAASF,CAAAA,CAAM,QAAUC,CAAAA,CAAK,IAAA,CAC9BE,CAAAA,CAASH,CAAAA,CAAM,OAAA,CAAUC,CAAAA,CAAK,IAE9BV,CAAAA,CAAS,IAAA,CAAK,KAAA,CAAMP,CAAAA,CAAW,OAAA,CAAQ,CAAA,CAAIN,CAAU,CAAA,CAAIA,CAAAA,CACzDc,EAAS,IAAA,CAAK,KAAA,CAAMR,EAAW,OAAA,CAAQ,CAAA,CAAIN,CAAU,CAAA,CAAIA,CAAAA,CAE/DO,CAAAA,CAAc,QAAU,CACtB,CAAA,CAAG,KAAK,KAAA,CAAA,CAAOiB,CAAAA,CAASlB,EAAW,OAAA,CAAQ,CAAA,CAAIO,CAAAA,EAAUb,CAAU,CAAA,CACnE,CAAA,CAAG,KAAK,KAAA,CAAA,CAAOyB,CAAAA,CAASnB,EAAW,OAAA,CAAQ,CAAA,CAAIQ,GAAUd,CAAU,CACrE,EACF,CAAA,CAEM0B,CAAAA,CAAmB,IAAM,CAC7BnB,CAAAA,CAAc,OAAA,CAAU,KAC1B,CAAA,CAEA,OAAAE,CAAAA,CAAO,iBAAiB,WAAA,CAAaY,CAAe,CAAA,CACpDZ,CAAAA,CAAO,gBAAA,CAAiB,YAAA,CAAciB,CAAgB,CAAA,CACtDrB,CAAAA,CAAW,QAAU,qBAAA,CAAsBc,CAAe,EAEnD,IAAM,CACX,MAAA,CAAO,mBAAA,CAAoB,QAAA,CAAUR,CAAY,EAC7CN,CAAAA,CAAW,OAAA,EAAS,qBAAqBA,CAAAA,CAAW,OAAO,EAC/DI,CAAAA,CAAO,mBAAA,CAAoB,WAAA,CAAaY,CAAe,CAAA,CACvDZ,CAAAA,CAAO,oBAAoB,YAAA,CAAciB,CAAgB,EAC3D,CACF,CAAA,CAAG,CAAC7B,CAAAA,CAAWC,CAAAA,CAAOC,CAAAA,CAAaE,CAAAA,CAAgBD,CAAU,CAAC,EAEvD2B,cAAAA,CAAC,QAAA,CAAA,CAAO,GAAA,CAAKxB,CAAAA,CAAW,SAAA,CAAW,CAAA,cAAA,EAAiBD,CAAS,CAAA,CAAA,CAAI,CAC1E,CAEA,IAAO0B,CAAAA,CAAQhC","file":"index.js","sourcesContent":["\"use client\";\r\n\r\nimport { useRef, useEffect } from \"react\";\r\n\r\ninterface SquaresProps {\r\n direction?: \"diagonal\" | \"up\" | \"right\" | \"down\" | \"left\";\r\n speed?: number;\r\n borderColor?: string;\r\n squareSize?: number;\r\n hoverFillColor?: string;\r\n className?: string;\r\n}\r\n\r\nexport function Squares({\r\n direction = \"right\",\r\n speed = 1,\r\n borderColor = \"#999\",\r\n squareSize = 40,\r\n hoverFillColor = \"#222\",\r\n className = \"\",\r\n}: SquaresProps) {\r\n const canvasRef = useRef<HTMLCanvasElement>(null);\r\n const requestRef = useRef<number | null>(null);\r\n const gridOffset = useRef({ x: 0, y: 0 });\r\n const hoveredSquare = useRef<{ x: number; y: number } | null>(null);\r\n\r\n useEffect(() => {\r\n const canvas = canvasRef.current;\r\n if (!canvas) return;\r\n const ctx = canvas.getContext(\"2d\");\r\n\r\n const resizeCanvas = () => {\r\n canvas.width = canvas.offsetWidth;\r\n canvas.height = canvas.offsetHeight;\r\n };\r\n\r\n window.addEventListener(\"resize\", resizeCanvas);\r\n resizeCanvas();\r\n\r\n const drawGrid = () => {\r\n if (!ctx) return;\r\n ctx.clearRect(0, 0, canvas.width, canvas.height);\r\n\r\n const startX = Math.floor(gridOffset.current.x / squareSize) * squareSize;\r\n const startY = Math.floor(gridOffset.current.y / squareSize) * squareSize;\r\n\r\n for (let x = startX; x < canvas.width + squareSize; x += squareSize) {\r\n for (let y = startY; y < canvas.height + squareSize; y += squareSize) {\r\n const squareX = x - (gridOffset.current.x % squareSize);\r\n const squareY = y - (gridOffset.current.y % squareSize);\r\n\r\n if (\r\n hoveredSquare.current &&\r\n Math.floor((x - startX) / squareSize) === hoveredSquare.current.x &&\r\n Math.floor((y - startY) / squareSize) === hoveredSquare.current.y\r\n ) {\r\n ctx.fillStyle = hoverFillColor;\r\n ctx.fillRect(squareX, squareY, squareSize, squareSize);\r\n }\r\n\r\n ctx.strokeStyle = borderColor;\r\n ctx.strokeRect(squareX, squareY, squareSize, squareSize);\r\n }\r\n }\r\n };\r\n\r\n const updateAnimation = () => {\r\n const effectiveSpeed = Math.max(speed, 0.1);\r\n switch (direction) {\r\n case \"right\":\r\n gridOffset.current.x = (gridOffset.current.x - effectiveSpeed + squareSize) % squareSize;\r\n break;\r\n case \"left\":\r\n gridOffset.current.x = (gridOffset.current.x + effectiveSpeed + squareSize) % squareSize;\r\n break;\r\n case \"up\":\r\n gridOffset.current.y = (gridOffset.current.y + effectiveSpeed + squareSize) % squareSize;\r\n break;\r\n case \"down\":\r\n gridOffset.current.y = (gridOffset.current.y - effectiveSpeed + squareSize) % squareSize;\r\n break;\r\n case \"diagonal\":\r\n gridOffset.current.x = (gridOffset.current.x - effectiveSpeed + squareSize) % squareSize;\r\n gridOffset.current.y = (gridOffset.current.y - effectiveSpeed + squareSize) % squareSize;\r\n break;\r\n }\r\n\r\n drawGrid();\r\n requestRef.current = requestAnimationFrame(updateAnimation);\r\n };\r\n\r\n const handleMouseMove = (event: MouseEvent) => {\r\n const rect = canvas.getBoundingClientRect();\r\n const mouseX = event.clientX - rect.left;\r\n const mouseY = event.clientY - rect.top;\r\n\r\n const startX = Math.floor(gridOffset.current.x / squareSize) * squareSize;\r\n const startY = Math.floor(gridOffset.current.y / squareSize) * squareSize;\r\n\r\n hoveredSquare.current = {\r\n x: Math.floor((mouseX + gridOffset.current.x - startX) / squareSize),\r\n y: Math.floor((mouseY + gridOffset.current.y - startY) / squareSize),\r\n };\r\n };\r\n\r\n const handleMouseLeave = () => {\r\n hoveredSquare.current = null;\r\n };\r\n\r\n canvas.addEventListener(\"mousemove\", handleMouseMove);\r\n canvas.addEventListener(\"mouseleave\", handleMouseLeave);\r\n requestRef.current = requestAnimationFrame(updateAnimation);\r\n\r\n return () => {\r\n window.removeEventListener(\"resize\", resizeCanvas);\r\n if (requestRef.current) cancelAnimationFrame(requestRef.current);\r\n canvas.removeEventListener(\"mousemove\", handleMouseMove);\r\n canvas.removeEventListener(\"mouseleave\", handleMouseLeave);\r\n };\r\n }, [direction, speed, borderColor, hoverFillColor, squareSize]);\r\n\r\n return <canvas ref={canvasRef} className={`w-full h-full ${className}`} />;\r\n}\r\n\r\nexport default Squares;\r\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import {useRef,useEffect}from'react';import {jsx}from'react/jsx-runtime';function k({direction:v="right",speed:i=1,borderColor:x="#999",squareSize:t=40,hoverFillColor:y="#222",className:p=""}){let g=useRef(null),f=useRef(null),n=useRef({x:0,y:0}),s=useRef(null);return useEffect(()=>{let r=g.current;if(!r)return;let o=r.getContext("2d"),d=()=>{r.width=r.offsetWidth,r.height=r.offsetHeight;};window.addEventListener("resize",d),d();let E=()=>{if(!o)return;o.clearRect(0,0,r.width,r.height);let e=Math.floor(n.current.x/t)*t,u=Math.floor(n.current.y/t)*t;for(let c=e;c<r.width+t;c+=t)for(let l=u;l<r.height+t;l+=t){let a=c-n.current.x%t,h=l-n.current.y%t;s.current&&Math.floor((c-e)/t)===s.current.x&&Math.floor((l-u)/t)===s.current.y&&(o.fillStyle=y,o.fillRect(a,h,t,t)),o.strokeStyle=x,o.strokeRect(a,h,t,t);}},M=()=>{let e=Math.max(i,.1);switch(v){case "right":n.current.x=(n.current.x-e+t)%t;break;case "left":n.current.x=(n.current.x+e+t)%t;break;case "up":n.current.y=(n.current.y+e+t)%t;break;case "down":n.current.y=(n.current.y-e+t)%t;break;case "diagonal":n.current.x=(n.current.x-e+t)%t,n.current.y=(n.current.y-e+t)%t;break}E(),f.current=requestAnimationFrame(M);},w=e=>{let u=r.getBoundingClientRect(),c=e.clientX-u.left,l=e.clientY-u.top,a=Math.floor(n.current.x/t)*t,h=Math.floor(n.current.y/t)*t;s.current={x:Math.floor((c+n.current.x-a)/t),y:Math.floor((l+n.current.y-h)/t)};},b=()=>{s.current=null;};return r.addEventListener("mousemove",w),r.addEventListener("mouseleave",b),f.current=requestAnimationFrame(M),()=>{window.removeEventListener("resize",d),f.current&&cancelAnimationFrame(f.current),r.removeEventListener("mousemove",w),r.removeEventListener("mouseleave",b);}},[v,i,x,y,t]),jsx("canvas",{ref:g,className:`w-full h-full ${p}`})}var Y=k;export{k as Squares,Y as default};//# sourceMappingURL=index.mjs.map
|
|
2
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/squares/index.tsx"],"names":["Squares","direction","speed","borderColor","squareSize","hoverFillColor","className","canvasRef","useRef","requestRef","gridOffset","hoveredSquare","useEffect","canvas","ctx","resizeCanvas","drawGrid","startX","startY","x","y","squareX","squareY","updateAnimation","effectiveSpeed","handleMouseMove","event","rect","mouseX","mouseY","handleMouseLeave","jsx","squares_default"],"mappings":"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","file":"index.mjs","sourcesContent":["\"use client\";\r\n\r\nimport { useRef, useEffect } from \"react\";\r\n\r\ninterface SquaresProps {\r\n direction?: \"diagonal\" | \"up\" | \"right\" | \"down\" | \"left\";\r\n speed?: number;\r\n borderColor?: string;\r\n squareSize?: number;\r\n hoverFillColor?: string;\r\n className?: string;\r\n}\r\n\r\nexport function Squares({\r\n direction = \"right\",\r\n speed = 1,\r\n borderColor = \"#999\",\r\n squareSize = 40,\r\n hoverFillColor = \"#222\",\r\n className = \"\",\r\n}: SquaresProps) {\r\n const canvasRef = useRef<HTMLCanvasElement>(null);\r\n const requestRef = useRef<number | null>(null);\r\n const gridOffset = useRef({ x: 0, y: 0 });\r\n const hoveredSquare = useRef<{ x: number; y: number } | null>(null);\r\n\r\n useEffect(() => {\r\n const canvas = canvasRef.current;\r\n if (!canvas) return;\r\n const ctx = canvas.getContext(\"2d\");\r\n\r\n const resizeCanvas = () => {\r\n canvas.width = canvas.offsetWidth;\r\n canvas.height = canvas.offsetHeight;\r\n };\r\n\r\n window.addEventListener(\"resize\", resizeCanvas);\r\n resizeCanvas();\r\n\r\n const drawGrid = () => {\r\n if (!ctx) return;\r\n ctx.clearRect(0, 0, canvas.width, canvas.height);\r\n\r\n const startX = Math.floor(gridOffset.current.x / squareSize) * squareSize;\r\n const startY = Math.floor(gridOffset.current.y / squareSize) * squareSize;\r\n\r\n for (let x = startX; x < canvas.width + squareSize; x += squareSize) {\r\n for (let y = startY; y < canvas.height + squareSize; y += squareSize) {\r\n const squareX = x - (gridOffset.current.x % squareSize);\r\n const squareY = y - (gridOffset.current.y % squareSize);\r\n\r\n if (\r\n hoveredSquare.current &&\r\n Math.floor((x - startX) / squareSize) === hoveredSquare.current.x &&\r\n Math.floor((y - startY) / squareSize) === hoveredSquare.current.y\r\n ) {\r\n ctx.fillStyle = hoverFillColor;\r\n ctx.fillRect(squareX, squareY, squareSize, squareSize);\r\n }\r\n\r\n ctx.strokeStyle = borderColor;\r\n ctx.strokeRect(squareX, squareY, squareSize, squareSize);\r\n }\r\n }\r\n };\r\n\r\n const updateAnimation = () => {\r\n const effectiveSpeed = Math.max(speed, 0.1);\r\n switch (direction) {\r\n case \"right\":\r\n gridOffset.current.x = (gridOffset.current.x - effectiveSpeed + squareSize) % squareSize;\r\n break;\r\n case \"left\":\r\n gridOffset.current.x = (gridOffset.current.x + effectiveSpeed + squareSize) % squareSize;\r\n break;\r\n case \"up\":\r\n gridOffset.current.y = (gridOffset.current.y + effectiveSpeed + squareSize) % squareSize;\r\n break;\r\n case \"down\":\r\n gridOffset.current.y = (gridOffset.current.y - effectiveSpeed + squareSize) % squareSize;\r\n break;\r\n case \"diagonal\":\r\n gridOffset.current.x = (gridOffset.current.x - effectiveSpeed + squareSize) % squareSize;\r\n gridOffset.current.y = (gridOffset.current.y - effectiveSpeed + squareSize) % squareSize;\r\n break;\r\n }\r\n\r\n drawGrid();\r\n requestRef.current = requestAnimationFrame(updateAnimation);\r\n };\r\n\r\n const handleMouseMove = (event: MouseEvent) => {\r\n const rect = canvas.getBoundingClientRect();\r\n const mouseX = event.clientX - rect.left;\r\n const mouseY = event.clientY - rect.top;\r\n\r\n const startX = Math.floor(gridOffset.current.x / squareSize) * squareSize;\r\n const startY = Math.floor(gridOffset.current.y / squareSize) * squareSize;\r\n\r\n hoveredSquare.current = {\r\n x: Math.floor((mouseX + gridOffset.current.x - startX) / squareSize),\r\n y: Math.floor((mouseY + gridOffset.current.y - startY) / squareSize),\r\n };\r\n };\r\n\r\n const handleMouseLeave = () => {\r\n hoveredSquare.current = null;\r\n };\r\n\r\n canvas.addEventListener(\"mousemove\", handleMouseMove);\r\n canvas.addEventListener(\"mouseleave\", handleMouseLeave);\r\n requestRef.current = requestAnimationFrame(updateAnimation);\r\n\r\n return () => {\r\n window.removeEventListener(\"resize\", resizeCanvas);\r\n if (requestRef.current) cancelAnimationFrame(requestRef.current);\r\n canvas.removeEventListener(\"mousemove\", handleMouseMove);\r\n canvas.removeEventListener(\"mouseleave\", handleMouseLeave);\r\n };\r\n }, [direction, speed, borderColor, hoverFillColor, squareSize]);\r\n\r\n return <canvas ref={canvasRef} className={`w-full h-full ${className}`} />;\r\n}\r\n\r\nexport default Squares;\r\n"]}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
'use strict';Object.defineProperty(exports,'__esModule',{value:true});var react=require('react'),jsxRuntime=require('react/jsx-runtime');var h=e=>e.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase(),D=e=>e.replace(/^([A-Z])|[\s-_]+(\w)/g,(a,l,u)=>u?u.toUpperCase():l.toLowerCase()),S=e=>{let a=D(e);return a.charAt(0).toUpperCase()+a.slice(1)},m=(...e)=>e.filter((a,l,u)=>!!a&&a.trim()!==""&&u.indexOf(a)===l).join(" ").trim(),g=e=>{for(let a in e)if(a.startsWith("aria-")||a==="role"||a==="title")return true};var w={xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"};var P=react.forwardRef(({color:e="currentColor",size:a=24,strokeWidth:l=2,absoluteStrokeWidth:u,className:s="",children:d,iconNode:i,...c},r)=>react.createElement("svg",{ref:r,...w,width:a,height:a,stroke:e,strokeWidth:u?Number(l)*24/Number(a):l,className:m("lucide",s),...!d&&!g(c)&&{"aria-hidden":"true"},...c},[...i.map(([n,x])=>react.createElement(n,x)),...Array.isArray(d)?d:[d]]));var I=(e,a)=>{let l=react.forwardRef(({className:u,...s},d)=>react.createElement(P,{ref:d,iconNode:a,className:m(`lucide-${h(S(e))}`,`lucide-${e}`,u),...s}));return l.displayName=S(e),l};var T=[["path",{d:"m15 18-6-6 6-6",key:"1wnfg3"}]],p=I("chevron-left",T);var q=[["path",{d:"m9 18 6-6-6-6",key:"mthhwq"}]],L=I("chevron-right",q);function b({title:e="Tech Pioneers",subtitle:a="building the future",description:l="We bring together brilliant developers and innovators.",members:u=[{name:"Emily Rodriguez",role:"Product Manager",experience:"6+ years",avatar:"https://i.pravatar.cc/160?img=1"},{name:"Mollie Hall",role:"CTO",experience:"12+ years",avatar:"https://i.pravatar.cc/160?img=2"},{name:"Alec Whitten",role:"UX Researcher",experience:"5+ years",avatar:"https://i.pravatar.cc/160?img=3"}],className:s=""}){let[d,i]=react.useState(0),[c,r]=react.useState(true),n=3;react.useEffect(()=>{if(!c)return;let o=setInterval(()=>{i(C=>(C+1)%Math.max(1,u.length-n+1));},5e3);return ()=>clearInterval(o)},[u.length,c]);let x=()=>{let o=Math.max(0,u.length-n);d>=o||(i(C=>Math.min(C+1,o)),r(false),setTimeout(()=>r(true),1500));},B=()=>{d<=0||(i(o=>Math.max(o-1,0)),r(false),setTimeout(()=>r(true),1500));};return jsxRuntime.jsx("section",{className:`overflow-hidden py-32 ${s}`,children:jsxRuntime.jsxs("div",{className:"mx-auto max-w-5xl px-8 lg:px-0",children:[jsxRuntime.jsxs("div",{children:[jsxRuntime.jsxs("h2",{className:"text-5xl font-medium md:text-6xl",children:[e," ",jsxRuntime.jsx("br",{}),jsxRuntime.jsx("span",{className:"text-muted-foreground",children:a})]}),jsxRuntime.jsx("p",{className:"text-muted-foreground mt-6 max-w-md",children:l})]}),jsxRuntime.jsxs("div",{className:"relative",children:[jsxRuntime.jsxs("div",{className:"mt-4 hidden items-center justify-end gap-4 md:flex",children:[jsxRuntime.jsx("button",{onClick:B,disabled:d===0,className:"flex h-11 w-11 items-center justify-center rounded-full border hover:bg-accent disabled:opacity-50",children:jsxRuntime.jsx(p,{className:"h-5 w-5"})}),jsxRuntime.jsx("button",{onClick:x,disabled:d>=u.length-n,className:"flex h-11 w-11 items-center justify-center rounded-full border hover:bg-accent disabled:opacity-50",children:jsxRuntime.jsx(L,{className:"h-5 w-5"})})]}),jsxRuntime.jsx("div",{className:"mt-16 overflow-hidden",children:jsxRuntime.jsx("div",{className:"flex gap-4 transition-transform duration-500",style:{transform:`translateX(-${d*304}px)`},children:u.map(o=>jsxRuntime.jsxs("div",{className:"w-72 flex-shrink-0 rounded-2xl border p-7 text-center",children:[jsxRuntime.jsx("img",{src:o.avatar,alt:o.name,className:"mx-auto h-20 w-20 rounded-full border"}),jsxRuntime.jsxs("div",{className:"mt-6",children:[jsxRuntime.jsx("p",{className:"text-lg font-medium",children:o.name}),jsxRuntime.jsx("p",{className:"text-muted-foreground text-sm",children:o.role})]}),jsxRuntime.jsx("div",{className:"my-6 h-px bg-border"}),jsxRuntime.jsx("p",{className:"text-muted-foreground text-sm",children:o.experience})]},o.name))})})]})]})})}var aa=b;/*! Bundled license information:
|
|
2
|
+
|
|
3
|
+
lucide-react/dist/esm/shared/src/utils.js:
|
|
4
|
+
lucide-react/dist/esm/defaultAttributes.js:
|
|
5
|
+
lucide-react/dist/esm/Icon.js:
|
|
6
|
+
lucide-react/dist/esm/createLucideIcon.js:
|
|
7
|
+
lucide-react/dist/esm/icons/chevron-left.js:
|
|
8
|
+
lucide-react/dist/esm/icons/chevron-right.js:
|
|
9
|
+
lucide-react/dist/esm/lucide-react.js:
|
|
10
|
+
(**
|
|
11
|
+
* @license lucide-react v0.545.0 - ISC
|
|
12
|
+
*
|
|
13
|
+
* This source code is licensed under the ISC license.
|
|
14
|
+
* See the LICENSE file in the root directory of this source tree.
|
|
15
|
+
*)
|
|
16
|
+
*/exports.TeamCarousel=b;exports.default=aa;//# sourceMappingURL=index.js.map
|
|
17
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../node_modules/shared/src/utils.ts","../../../../node_modules/lucide-react/src/defaultAttributes.ts","../../../../node_modules/lucide-react/src/Icon.ts","../../../../node_modules/lucide-react/src/createLucideIcon.ts","../../../../node_modules/lucide-react/src/icons/chevron-left.ts","../../../../node_modules/lucide-react/src/icons/chevron-right.ts","../../src/team-carousel/index.tsx"],"names":["toKebabCase","string","toCamelCase","match","p1","p2","toPascalCase","camelCase","mergeClasses","classes","className","index","array","hasA11yProp","props","prop","defaultAttributes","Icon","forwardRef","color","size","strokeWidth","absoluteStrokeWidth","children","iconNode","rest","ref","createElement","tag","attrs","createLucideIcon","iconName","Component","__iconNode","ChevronLeft","ChevronRight","TeamCarousel","title","subtitle","description","members","currentIndex","setCurrentIndex","useState","isAutoPlaying","setIsAutoPlaying","cardsPerView","useEffect","interval","prev","nextSlide","maxIndex","prevSlide","jsx","jsxs","member","team_carousel_default"],"mappings":"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","file":"index.js","sourcesContent":["import { CamelToPascal } from './utility-types';\n\n/**\n * Converts string to kebab case\n *\n * @param {string} string\n * @returns {string} A kebabized string\n */\nexport const toKebabCase = (string: string) =>\n string.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();\n\n/**\n * Converts string to camel case\n *\n * @param {string} string\n * @returns {string} A camelized string\n */\nexport const toCamelCase = <T extends string>(string: T) =>\n string.replace(/^([A-Z])|[\\s-_]+(\\w)/g, (match, p1, p2) =>\n p2 ? p2.toUpperCase() : p1.toLowerCase(),\n );\n\n/**\n * Converts string to pascal case\n *\n * @param {string} string\n * @returns {string} A pascalized string\n */\nexport const toPascalCase = <T extends string>(string: T): CamelToPascal<T> => {\n const camelCase = toCamelCase(string);\n\n return (camelCase.charAt(0).toUpperCase() + camelCase.slice(1)) as CamelToPascal<T>;\n};\n\n/**\n * Merges classes into a single string\n *\n * @param {array} classes\n * @returns {string} A string of classes\n */\nexport const mergeClasses = <ClassType = string | undefined | null>(...classes: ClassType[]) =>\n classes\n .filter((className, index, array) => {\n return (\n Boolean(className) &&\n (className as string).trim() !== '' &&\n array.indexOf(className) === index\n );\n })\n .join(' ')\n .trim();\n\n/**\n * Is empty string\n *\n * @param {unknown} value\n * @returns {boolean} Whether the value is an empty string\n */\nexport const isEmptyString = (value: unknown): boolean => value === '';\n\n/**\n * Check if a component has an accessibility prop\n *\n * @param {object} props\n * @returns {boolean} Whether the component has an accessibility prop\n */\nexport const hasA11yProp = (props: Record<string, any>) => {\n for (const prop in props) {\n if (prop.startsWith('aria-') || prop === 'role' || prop === 'title') {\n return true;\n }\n }\n};\n","export default {\n xmlns: 'http://www.w3.org/2000/svg',\n width: 24,\n height: 24,\n viewBox: '0 0 24 24',\n fill: 'none',\n stroke: 'currentColor',\n strokeWidth: 2,\n strokeLinecap: 'round',\n strokeLinejoin: 'round',\n};\n","import { createElement, forwardRef } from 'react';\nimport defaultAttributes from './defaultAttributes';\nimport { IconNode, LucideProps } from './types';\nimport { mergeClasses, hasA11yProp } from '@lucide/shared';\n\ninterface IconComponentProps extends LucideProps {\n iconNode: IconNode;\n}\n\n/**\n * Lucide icon component\n *\n * @component Icon\n * @param {object} props\n * @param {string} props.color - The color of the icon\n * @param {number} props.size - The size of the icon\n * @param {number} props.strokeWidth - The stroke width of the icon\n * @param {boolean} props.absoluteStrokeWidth - Whether to use absolute stroke width\n * @param {string} props.className - The class name of the icon\n * @param {IconNode} props.children - The children of the icon\n * @param {IconNode} props.iconNode - The icon node of the icon\n *\n * @returns {ForwardRefExoticComponent} LucideIcon\n */\nconst Icon = forwardRef<SVGSVGElement, IconComponentProps>(\n (\n {\n color = 'currentColor',\n size = 24,\n strokeWidth = 2,\n absoluteStrokeWidth,\n className = '',\n children,\n iconNode,\n ...rest\n },\n ref,\n ) =>\n createElement(\n 'svg',\n {\n ref,\n ...defaultAttributes,\n width: size,\n height: size,\n stroke: color,\n strokeWidth: absoluteStrokeWidth ? (Number(strokeWidth) * 24) / Number(size) : strokeWidth,\n className: mergeClasses('lucide', className),\n ...(!children && !hasA11yProp(rest) && { 'aria-hidden': 'true' }),\n ...rest,\n },\n [\n ...iconNode.map(([tag, attrs]) => createElement(tag, attrs)),\n ...(Array.isArray(children) ? children : [children]),\n ],\n ),\n);\n\nexport default Icon;\n","import { createElement, forwardRef } from 'react';\nimport { mergeClasses, toKebabCase, toPascalCase } from '@lucide/shared';\nimport { IconNode, LucideProps } from './types';\nimport Icon from './Icon';\n\n/**\n * Create a Lucide icon component\n * @param {string} iconName\n * @param {array} iconNode\n * @returns {ForwardRefExoticComponent} LucideIcon\n */\nconst createLucideIcon = (iconName: string, iconNode: IconNode) => {\n const Component = forwardRef<SVGSVGElement, LucideProps>(({ className, ...props }, ref) =>\n createElement(Icon, {\n ref,\n iconNode,\n className: mergeClasses(\n `lucide-${toKebabCase(toPascalCase(iconName))}`,\n `lucide-${iconName}`,\n className,\n ),\n ...props,\n }),\n );\n\n Component.displayName = toPascalCase(iconName);\n\n return Component;\n};\n\nexport default createLucideIcon;\n","import createLucideIcon from '../createLucideIcon';\nimport { IconNode } from '../types';\n\nexport const __iconNode: IconNode = [['path', { d: 'm15 18-6-6 6-6', key: '1wnfg3' }]];\n\n/**\n * @component @name ChevronLeft\n * @description Lucide SVG icon component, renders SVG Element with children.\n *\n * @preview  - https://lucide.dev/icons/chevron-left\n * @see https://lucide.dev/guide/packages/lucide-react - Documentation\n *\n * @param {Object} props - Lucide icons props and any valid SVG attribute\n * @returns {JSX.Element} JSX Element\n *\n */\nconst ChevronLeft = createLucideIcon('chevron-left', __iconNode);\n\nexport default ChevronLeft;\n","import createLucideIcon from '../createLucideIcon';\nimport { IconNode } from '../types';\n\nexport const __iconNode: IconNode = [['path', { d: 'm9 18 6-6-6-6', key: 'mthhwq' }]];\n\n/**\n * @component @name ChevronRight\n * @description Lucide SVG icon component, renders SVG Element with children.\n *\n * @preview  - https://lucide.dev/icons/chevron-right\n * @see https://lucide.dev/guide/packages/lucide-react - Documentation\n *\n * @param {Object} props - Lucide icons props and any valid SVG attribute\n * @returns {JSX.Element} JSX Element\n *\n */\nconst ChevronRight = createLucideIcon('chevron-right', __iconNode);\n\nexport default ChevronRight;\n","\"use client\";\r\n\r\nimport { useEffect, useState } from \"react\";\r\nimport { ChevronLeft, ChevronRight } from \"lucide-react\";\r\n\r\ninterface TeamMember {\r\n name: string;\r\n role: string;\r\n experience: string;\r\n avatar: string;\r\n}\r\n\r\ninterface TeamCarouselProps {\r\n title?: string;\r\n subtitle?: string;\r\n description?: string;\r\n members?: TeamMember[];\r\n className?: string;\r\n}\r\n\r\nexport function TeamCarousel({\r\n title = \"Tech Pioneers\",\r\n subtitle = \"building the future\",\r\n description = \"We bring together brilliant developers and innovators.\",\r\n members = [\r\n {\r\n name: \"Emily Rodriguez\",\r\n role: \"Product Manager\",\r\n experience: \"6+ years\",\r\n avatar: \"https://i.pravatar.cc/160?img=1\",\r\n },\r\n {\r\n name: \"Mollie Hall\",\r\n role: \"CTO\",\r\n experience: \"12+ years\",\r\n avatar: \"https://i.pravatar.cc/160?img=2\",\r\n },\r\n {\r\n name: \"Alec Whitten\",\r\n role: \"UX Researcher\",\r\n experience: \"5+ years\",\r\n avatar: \"https://i.pravatar.cc/160?img=3\",\r\n },\r\n ],\r\n className = \"\",\r\n}: TeamCarouselProps) {\r\n const [currentIndex, setCurrentIndex] = useState(0);\r\n const [isAutoPlaying, setIsAutoPlaying] = useState(true);\r\n const cardsPerView = 3;\r\n\r\n useEffect(() => {\r\n if (!isAutoPlaying) return;\r\n\r\n const interval = setInterval(() => {\r\n setCurrentIndex((prev) => (prev + 1) % Math.max(1, members.length - cardsPerView + 1));\r\n }, 5000);\r\n\r\n return () => clearInterval(interval);\r\n }, [members.length, isAutoPlaying]);\r\n\r\n const nextSlide = () => {\r\n const maxIndex = Math.max(0, members.length - cardsPerView);\r\n if (currentIndex >= maxIndex) return;\r\n setCurrentIndex((prev) => Math.min(prev + 1, maxIndex));\r\n setIsAutoPlaying(false);\r\n setTimeout(() => setIsAutoPlaying(true), 1500);\r\n };\r\n\r\n const prevSlide = () => {\r\n if (currentIndex <= 0) return;\r\n setCurrentIndex((prev) => Math.max(prev - 1, 0));\r\n setIsAutoPlaying(false);\r\n setTimeout(() => setIsAutoPlaying(true), 1500);\r\n };\r\n\r\n return (\r\n <section className={`overflow-hidden py-32 ${className}`}>\r\n <div className=\"mx-auto max-w-5xl px-8 lg:px-0\">\r\n <div>\r\n <h2 className=\"text-5xl font-medium md:text-6xl\">\r\n {title} <br />\r\n <span className=\"text-muted-foreground\">{subtitle}</span>\r\n </h2>\r\n <p className=\"text-muted-foreground mt-6 max-w-md\">{description}</p>\r\n </div>\r\n\r\n <div className=\"relative\">\r\n <div className=\"mt-4 hidden items-center justify-end gap-4 md:flex\">\r\n <button\r\n onClick={prevSlide}\r\n disabled={currentIndex === 0}\r\n className=\"flex h-11 w-11 items-center justify-center rounded-full border hover:bg-accent disabled:opacity-50\"\r\n >\r\n <ChevronLeft className=\"h-5 w-5\" />\r\n </button>\r\n <button\r\n onClick={nextSlide}\r\n disabled={currentIndex >= members.length - cardsPerView}\r\n className=\"flex h-11 w-11 items-center justify-center rounded-full border hover:bg-accent disabled:opacity-50\"\r\n >\r\n <ChevronRight className=\"h-5 w-5\" />\r\n </button>\r\n </div>\r\n\r\n <div className=\"mt-16 overflow-hidden\">\r\n <div\r\n className=\"flex gap-4 transition-transform duration-500\"\r\n style={{ transform: `translateX(-${currentIndex * 304}px)` }}\r\n >\r\n {members.map((member) => (\r\n <div key={member.name} className=\"w-72 flex-shrink-0 rounded-2xl border p-7 text-center\">\r\n <img\r\n src={member.avatar}\r\n alt={member.name}\r\n className=\"mx-auto h-20 w-20 rounded-full border\"\r\n />\r\n <div className=\"mt-6\">\r\n <p className=\"text-lg font-medium\">{member.name}</p>\r\n <p className=\"text-muted-foreground text-sm\">{member.role}</p>\r\n </div>\r\n <div className=\"my-6 h-px bg-border\" />\r\n <p className=\"text-muted-foreground text-sm\">{member.experience}</p>\r\n </div>\r\n ))}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </section>\r\n );\r\n}\r\n\r\nexport default TeamCarousel;\r\n"]}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import {forwardRef,createElement,useState,useEffect}from'react';import {jsx,jsxs}from'react/jsx-runtime';var h=e=>e.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase(),D=e=>e.replace(/^([A-Z])|[\s-_]+(\w)/g,(a,l,u)=>u?u.toUpperCase():l.toLowerCase()),S=e=>{let a=D(e);return a.charAt(0).toUpperCase()+a.slice(1)},m=(...e)=>e.filter((a,l,u)=>!!a&&a.trim()!==""&&u.indexOf(a)===l).join(" ").trim(),g=e=>{for(let a in e)if(a.startsWith("aria-")||a==="role"||a==="title")return true};var w={xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"};var P=forwardRef(({color:e="currentColor",size:a=24,strokeWidth:l=2,absoluteStrokeWidth:u,className:s="",children:d,iconNode:i,...c},r)=>createElement("svg",{ref:r,...w,width:a,height:a,stroke:e,strokeWidth:u?Number(l)*24/Number(a):l,className:m("lucide",s),...!d&&!g(c)&&{"aria-hidden":"true"},...c},[...i.map(([n,x])=>createElement(n,x)),...Array.isArray(d)?d:[d]]));var I=(e,a)=>{let l=forwardRef(({className:u,...s},d)=>createElement(P,{ref:d,iconNode:a,className:m(`lucide-${h(S(e))}`,`lucide-${e}`,u),...s}));return l.displayName=S(e),l};var T=[["path",{d:"m15 18-6-6 6-6",key:"1wnfg3"}]],p=I("chevron-left",T);var q=[["path",{d:"m9 18 6-6-6-6",key:"mthhwq"}]],L=I("chevron-right",q);function b({title:e="Tech Pioneers",subtitle:a="building the future",description:l="We bring together brilliant developers and innovators.",members:u=[{name:"Emily Rodriguez",role:"Product Manager",experience:"6+ years",avatar:"https://i.pravatar.cc/160?img=1"},{name:"Mollie Hall",role:"CTO",experience:"12+ years",avatar:"https://i.pravatar.cc/160?img=2"},{name:"Alec Whitten",role:"UX Researcher",experience:"5+ years",avatar:"https://i.pravatar.cc/160?img=3"}],className:s=""}){let[d,i]=useState(0),[c,r]=useState(true),n=3;useEffect(()=>{if(!c)return;let o=setInterval(()=>{i(C=>(C+1)%Math.max(1,u.length-n+1));},5e3);return ()=>clearInterval(o)},[u.length,c]);let x=()=>{let o=Math.max(0,u.length-n);d>=o||(i(C=>Math.min(C+1,o)),r(false),setTimeout(()=>r(true),1500));},B=()=>{d<=0||(i(o=>Math.max(o-1,0)),r(false),setTimeout(()=>r(true),1500));};return jsx("section",{className:`overflow-hidden py-32 ${s}`,children:jsxs("div",{className:"mx-auto max-w-5xl px-8 lg:px-0",children:[jsxs("div",{children:[jsxs("h2",{className:"text-5xl font-medium md:text-6xl",children:[e," ",jsx("br",{}),jsx("span",{className:"text-muted-foreground",children:a})]}),jsx("p",{className:"text-muted-foreground mt-6 max-w-md",children:l})]}),jsxs("div",{className:"relative",children:[jsxs("div",{className:"mt-4 hidden items-center justify-end gap-4 md:flex",children:[jsx("button",{onClick:B,disabled:d===0,className:"flex h-11 w-11 items-center justify-center rounded-full border hover:bg-accent disabled:opacity-50",children:jsx(p,{className:"h-5 w-5"})}),jsx("button",{onClick:x,disabled:d>=u.length-n,className:"flex h-11 w-11 items-center justify-center rounded-full border hover:bg-accent disabled:opacity-50",children:jsx(L,{className:"h-5 w-5"})})]}),jsx("div",{className:"mt-16 overflow-hidden",children:jsx("div",{className:"flex gap-4 transition-transform duration-500",style:{transform:`translateX(-${d*304}px)`},children:u.map(o=>jsxs("div",{className:"w-72 flex-shrink-0 rounded-2xl border p-7 text-center",children:[jsx("img",{src:o.avatar,alt:o.name,className:"mx-auto h-20 w-20 rounded-full border"}),jsxs("div",{className:"mt-6",children:[jsx("p",{className:"text-lg font-medium",children:o.name}),jsx("p",{className:"text-muted-foreground text-sm",children:o.role})]}),jsx("div",{className:"my-6 h-px bg-border"}),jsx("p",{className:"text-muted-foreground text-sm",children:o.experience})]},o.name))})})]})]})})}var aa=b;/*! Bundled license information:
|
|
2
|
+
|
|
3
|
+
lucide-react/dist/esm/shared/src/utils.js:
|
|
4
|
+
lucide-react/dist/esm/defaultAttributes.js:
|
|
5
|
+
lucide-react/dist/esm/Icon.js:
|
|
6
|
+
lucide-react/dist/esm/createLucideIcon.js:
|
|
7
|
+
lucide-react/dist/esm/icons/chevron-left.js:
|
|
8
|
+
lucide-react/dist/esm/icons/chevron-right.js:
|
|
9
|
+
lucide-react/dist/esm/lucide-react.js:
|
|
10
|
+
(**
|
|
11
|
+
* @license lucide-react v0.545.0 - ISC
|
|
12
|
+
*
|
|
13
|
+
* This source code is licensed under the ISC license.
|
|
14
|
+
* See the LICENSE file in the root directory of this source tree.
|
|
15
|
+
*)
|
|
16
|
+
*/export{b as TeamCarousel,aa as default};//# sourceMappingURL=index.mjs.map
|
|
17
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../node_modules/shared/src/utils.ts","../../../../node_modules/lucide-react/src/defaultAttributes.ts","../../../../node_modules/lucide-react/src/Icon.ts","../../../../node_modules/lucide-react/src/createLucideIcon.ts","../../../../node_modules/lucide-react/src/icons/chevron-left.ts","../../../../node_modules/lucide-react/src/icons/chevron-right.ts","../../src/team-carousel/index.tsx"],"names":["toKebabCase","string","toCamelCase","match","p1","p2","toPascalCase","camelCase","mergeClasses","classes","className","index","array","hasA11yProp","props","prop","defaultAttributes","Icon","forwardRef","color","size","strokeWidth","absoluteStrokeWidth","children","iconNode","rest","ref","createElement","tag","attrs","createLucideIcon","iconName","Component","__iconNode","ChevronLeft","ChevronRight","TeamCarousel","title","subtitle","description","members","currentIndex","setCurrentIndex","useState","isAutoPlaying","setIsAutoPlaying","cardsPerView","useEffect","interval","prev","nextSlide","maxIndex","prevSlide","jsx","jsxs","member","team_carousel_default"],"mappings":"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","file":"index.mjs","sourcesContent":["import { CamelToPascal } from './utility-types';\n\n/**\n * Converts string to kebab case\n *\n * @param {string} string\n * @returns {string} A kebabized string\n */\nexport const toKebabCase = (string: string) =>\n string.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();\n\n/**\n * Converts string to camel case\n *\n * @param {string} string\n * @returns {string} A camelized string\n */\nexport const toCamelCase = <T extends string>(string: T) =>\n string.replace(/^([A-Z])|[\\s-_]+(\\w)/g, (match, p1, p2) =>\n p2 ? p2.toUpperCase() : p1.toLowerCase(),\n );\n\n/**\n * Converts string to pascal case\n *\n * @param {string} string\n * @returns {string} A pascalized string\n */\nexport const toPascalCase = <T extends string>(string: T): CamelToPascal<T> => {\n const camelCase = toCamelCase(string);\n\n return (camelCase.charAt(0).toUpperCase() + camelCase.slice(1)) as CamelToPascal<T>;\n};\n\n/**\n * Merges classes into a single string\n *\n * @param {array} classes\n * @returns {string} A string of classes\n */\nexport const mergeClasses = <ClassType = string | undefined | null>(...classes: ClassType[]) =>\n classes\n .filter((className, index, array) => {\n return (\n Boolean(className) &&\n (className as string).trim() !== '' &&\n array.indexOf(className) === index\n );\n })\n .join(' ')\n .trim();\n\n/**\n * Is empty string\n *\n * @param {unknown} value\n * @returns {boolean} Whether the value is an empty string\n */\nexport const isEmptyString = (value: unknown): boolean => value === '';\n\n/**\n * Check if a component has an accessibility prop\n *\n * @param {object} props\n * @returns {boolean} Whether the component has an accessibility prop\n */\nexport const hasA11yProp = (props: Record<string, any>) => {\n for (const prop in props) {\n if (prop.startsWith('aria-') || prop === 'role' || prop === 'title') {\n return true;\n }\n }\n};\n","export default {\n xmlns: 'http://www.w3.org/2000/svg',\n width: 24,\n height: 24,\n viewBox: '0 0 24 24',\n fill: 'none',\n stroke: 'currentColor',\n strokeWidth: 2,\n strokeLinecap: 'round',\n strokeLinejoin: 'round',\n};\n","import { createElement, forwardRef } from 'react';\nimport defaultAttributes from './defaultAttributes';\nimport { IconNode, LucideProps } from './types';\nimport { mergeClasses, hasA11yProp } from '@lucide/shared';\n\ninterface IconComponentProps extends LucideProps {\n iconNode: IconNode;\n}\n\n/**\n * Lucide icon component\n *\n * @component Icon\n * @param {object} props\n * @param {string} props.color - The color of the icon\n * @param {number} props.size - The size of the icon\n * @param {number} props.strokeWidth - The stroke width of the icon\n * @param {boolean} props.absoluteStrokeWidth - Whether to use absolute stroke width\n * @param {string} props.className - The class name of the icon\n * @param {IconNode} props.children - The children of the icon\n * @param {IconNode} props.iconNode - The icon node of the icon\n *\n * @returns {ForwardRefExoticComponent} LucideIcon\n */\nconst Icon = forwardRef<SVGSVGElement, IconComponentProps>(\n (\n {\n color = 'currentColor',\n size = 24,\n strokeWidth = 2,\n absoluteStrokeWidth,\n className = '',\n children,\n iconNode,\n ...rest\n },\n ref,\n ) =>\n createElement(\n 'svg',\n {\n ref,\n ...defaultAttributes,\n width: size,\n height: size,\n stroke: color,\n strokeWidth: absoluteStrokeWidth ? (Number(strokeWidth) * 24) / Number(size) : strokeWidth,\n className: mergeClasses('lucide', className),\n ...(!children && !hasA11yProp(rest) && { 'aria-hidden': 'true' }),\n ...rest,\n },\n [\n ...iconNode.map(([tag, attrs]) => createElement(tag, attrs)),\n ...(Array.isArray(children) ? children : [children]),\n ],\n ),\n);\n\nexport default Icon;\n","import { createElement, forwardRef } from 'react';\nimport { mergeClasses, toKebabCase, toPascalCase } from '@lucide/shared';\nimport { IconNode, LucideProps } from './types';\nimport Icon from './Icon';\n\n/**\n * Create a Lucide icon component\n * @param {string} iconName\n * @param {array} iconNode\n * @returns {ForwardRefExoticComponent} LucideIcon\n */\nconst createLucideIcon = (iconName: string, iconNode: IconNode) => {\n const Component = forwardRef<SVGSVGElement, LucideProps>(({ className, ...props }, ref) =>\n createElement(Icon, {\n ref,\n iconNode,\n className: mergeClasses(\n `lucide-${toKebabCase(toPascalCase(iconName))}`,\n `lucide-${iconName}`,\n className,\n ),\n ...props,\n }),\n );\n\n Component.displayName = toPascalCase(iconName);\n\n return Component;\n};\n\nexport default createLucideIcon;\n","import createLucideIcon from '../createLucideIcon';\nimport { IconNode } from '../types';\n\nexport const __iconNode: IconNode = [['path', { d: 'm15 18-6-6 6-6', key: '1wnfg3' }]];\n\n/**\n * @component @name ChevronLeft\n * @description Lucide SVG icon component, renders SVG Element with children.\n *\n * @preview  - https://lucide.dev/icons/chevron-left\n * @see https://lucide.dev/guide/packages/lucide-react - Documentation\n *\n * @param {Object} props - Lucide icons props and any valid SVG attribute\n * @returns {JSX.Element} JSX Element\n *\n */\nconst ChevronLeft = createLucideIcon('chevron-left', __iconNode);\n\nexport default ChevronLeft;\n","import createLucideIcon from '../createLucideIcon';\nimport { IconNode } from '../types';\n\nexport const __iconNode: IconNode = [['path', { d: 'm9 18 6-6-6-6', key: 'mthhwq' }]];\n\n/**\n * @component @name ChevronRight\n * @description Lucide SVG icon component, renders SVG Element with children.\n *\n * @preview  - https://lucide.dev/icons/chevron-right\n * @see https://lucide.dev/guide/packages/lucide-react - Documentation\n *\n * @param {Object} props - Lucide icons props and any valid SVG attribute\n * @returns {JSX.Element} JSX Element\n *\n */\nconst ChevronRight = createLucideIcon('chevron-right', __iconNode);\n\nexport default ChevronRight;\n","\"use client\";\r\n\r\nimport { useEffect, useState } from \"react\";\r\nimport { ChevronLeft, ChevronRight } from \"lucide-react\";\r\n\r\ninterface TeamMember {\r\n name: string;\r\n role: string;\r\n experience: string;\r\n avatar: string;\r\n}\r\n\r\ninterface TeamCarouselProps {\r\n title?: string;\r\n subtitle?: string;\r\n description?: string;\r\n members?: TeamMember[];\r\n className?: string;\r\n}\r\n\r\nexport function TeamCarousel({\r\n title = \"Tech Pioneers\",\r\n subtitle = \"building the future\",\r\n description = \"We bring together brilliant developers and innovators.\",\r\n members = [\r\n {\r\n name: \"Emily Rodriguez\",\r\n role: \"Product Manager\",\r\n experience: \"6+ years\",\r\n avatar: \"https://i.pravatar.cc/160?img=1\",\r\n },\r\n {\r\n name: \"Mollie Hall\",\r\n role: \"CTO\",\r\n experience: \"12+ years\",\r\n avatar: \"https://i.pravatar.cc/160?img=2\",\r\n },\r\n {\r\n name: \"Alec Whitten\",\r\n role: \"UX Researcher\",\r\n experience: \"5+ years\",\r\n avatar: \"https://i.pravatar.cc/160?img=3\",\r\n },\r\n ],\r\n className = \"\",\r\n}: TeamCarouselProps) {\r\n const [currentIndex, setCurrentIndex] = useState(0);\r\n const [isAutoPlaying, setIsAutoPlaying] = useState(true);\r\n const cardsPerView = 3;\r\n\r\n useEffect(() => {\r\n if (!isAutoPlaying) return;\r\n\r\n const interval = setInterval(() => {\r\n setCurrentIndex((prev) => (prev + 1) % Math.max(1, members.length - cardsPerView + 1));\r\n }, 5000);\r\n\r\n return () => clearInterval(interval);\r\n }, [members.length, isAutoPlaying]);\r\n\r\n const nextSlide = () => {\r\n const maxIndex = Math.max(0, members.length - cardsPerView);\r\n if (currentIndex >= maxIndex) return;\r\n setCurrentIndex((prev) => Math.min(prev + 1, maxIndex));\r\n setIsAutoPlaying(false);\r\n setTimeout(() => setIsAutoPlaying(true), 1500);\r\n };\r\n\r\n const prevSlide = () => {\r\n if (currentIndex <= 0) return;\r\n setCurrentIndex((prev) => Math.max(prev - 1, 0));\r\n setIsAutoPlaying(false);\r\n setTimeout(() => setIsAutoPlaying(true), 1500);\r\n };\r\n\r\n return (\r\n <section className={`overflow-hidden py-32 ${className}`}>\r\n <div className=\"mx-auto max-w-5xl px-8 lg:px-0\">\r\n <div>\r\n <h2 className=\"text-5xl font-medium md:text-6xl\">\r\n {title} <br />\r\n <span className=\"text-muted-foreground\">{subtitle}</span>\r\n </h2>\r\n <p className=\"text-muted-foreground mt-6 max-w-md\">{description}</p>\r\n </div>\r\n\r\n <div className=\"relative\">\r\n <div className=\"mt-4 hidden items-center justify-end gap-4 md:flex\">\r\n <button\r\n onClick={prevSlide}\r\n disabled={currentIndex === 0}\r\n className=\"flex h-11 w-11 items-center justify-center rounded-full border hover:bg-accent disabled:opacity-50\"\r\n >\r\n <ChevronLeft className=\"h-5 w-5\" />\r\n </button>\r\n <button\r\n onClick={nextSlide}\r\n disabled={currentIndex >= members.length - cardsPerView}\r\n className=\"flex h-11 w-11 items-center justify-center rounded-full border hover:bg-accent disabled:opacity-50\"\r\n >\r\n <ChevronRight className=\"h-5 w-5\" />\r\n </button>\r\n </div>\r\n\r\n <div className=\"mt-16 overflow-hidden\">\r\n <div\r\n className=\"flex gap-4 transition-transform duration-500\"\r\n style={{ transform: `translateX(-${currentIndex * 304}px)` }}\r\n >\r\n {members.map((member) => (\r\n <div key={member.name} className=\"w-72 flex-shrink-0 rounded-2xl border p-7 text-center\">\r\n <img\r\n src={member.avatar}\r\n alt={member.name}\r\n className=\"mx-auto h-20 w-20 rounded-full border\"\r\n />\r\n <div className=\"mt-6\">\r\n <p className=\"text-lg font-medium\">{member.name}</p>\r\n <p className=\"text-muted-foreground text-sm\">{member.role}</p>\r\n </div>\r\n <div className=\"my-6 h-px bg-border\" />\r\n <p className=\"text-muted-foreground text-sm\">{member.experience}</p>\r\n </div>\r\n ))}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </section>\r\n );\r\n}\r\n\r\nexport default TeamCarousel;\r\n"]}
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
'use strict';Object.defineProperty(exports,'__esModule',{value:true});var framerMotion=require('framer-motion'),react=require('react'),jsxRuntime=require('react/jsx-runtime');var x=4,w=[{id:"member-1",avatarUrl:"https://i.pravatar.cc/150?img=1",name:"Team Member 1"},{id:"member-2",avatarUrl:"https://i.pravatar.cc/150?img=2",name:"Team Member 2"},{id:"member-3",avatarUrl:"https://i.pravatar.cc/150?img=3",name:"Team Member 3"},{id:"member-4",avatarUrl:"https://i.pravatar.cc/150?img=4",name:"Team Member 4"}],r={container:{initial:{opacity:0,y:20},animate:{opacity:1,y:0},exit:{opacity:0,y:-20}},avatar:{initial:{opacity:0,scale:.8},animate:{opacity:1,scale:1,transition:{duration:.3}},exit:{opacity:0,scale:.8,transition:{duration:.15}}},vibration:{initial:{x:0},animate:{x:[-5,5,-5,5,0],transition:{duration:.3}}},number:{initial:{scale:.8,opacity:0},animate:{scale:1,opacity:1,transition:{type:"spring",stiffness:400,damping:25}}}};function T({defaultValue:g=1,onChange:o,className:z="",members:h=w,maxSize:s=x}){let[t,c]=react.useState(g),[l,m]=react.useState(false),d=e=>{if(e.preventDefault(),t<s){let a=t+1;c(a),o?.(a);}else u();},b=e=>{if(e.preventDefault(),t>1){let a=t-1;c(a),o?.(a);}else u();},u=()=>{m(true),setTimeout(()=>m(false),300);},f=(e,a)=>{(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),a==="increment"?d(e):b(e));},y=()=>h.slice(0,t).map((e,a)=>jsxRuntime.jsx(framerMotion.motion.div,{variants:r.avatar,initial:"initial",animate:"animate",exit:"exit",className:"flex items-center justify-center",style:{zIndex:t-a,marginLeft:a===0?0:-24},children:jsxRuntime.jsx("img",{src:e.avatarUrl,width:96,height:96,alt:e.name,className:"rounded-full object-cover w-24 h-24 shadow-lg bg-gradient-to-b from-white/5 to-white/20 dark:from-white/5 dark:to-black/20 backdrop-blur-sm hover:shadow-xl transition-all duration-300 border border-white/10 dark:border-white/5"})},e.id));return jsxRuntime.jsx(framerMotion.motion.div,{variants:r.container,initial:"initial",animate:"animate",exit:"exit",className:`flex w-full flex-col items-center justify-center gap-8 ${z}`,children:jsxRuntime.jsxs("fieldset",{className:"w-full",children:[jsxRuntime.jsx("legend",{className:"sr-only",children:"Team size selector"}),jsxRuntime.jsx("div",{className:"relative h-24 w-full flex justify-center",children:jsxRuntime.jsx(framerMotion.AnimatePresence,{mode:"popLayout",children:y()})}),jsxRuntime.jsxs(framerMotion.motion.div,{variants:l?r.vibration:void 0,initial:"initial",animate:l?"animate":"initial",className:"flex items-center justify-center gap-8 mt-8",children:[jsxRuntime.jsx("button",{type:"button",onClick:b,onKeyDown:e=>f(e,"decrement"),disabled:t<=1,"aria-label":"Decrease team size",className:"h-12 w-12 rounded-full bg-gradient-to-b from-white to-zinc-50 dark:from-zinc-800 dark:to-zinc-900 border border-zinc-200/80 dark:border-zinc-700/80 shadow-md hover:shadow-lg hover:border-zinc-300 dark:hover:border-zinc-600 active:from-zinc-50 active:to-zinc-100 dark:active:from-zinc-900 dark:active:to-zinc-800 text-zinc-900 dark:text-zinc-100 disabled:opacity-40 disabled:cursor-not-allowed transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-zinc-500/30 dark:focus-visible:ring-zinc-400/30 focus-visible:ring-offset-2",children:jsxRuntime.jsx("span",{className:"text-2xl font-medium select-none",children:"-"})}),jsxRuntime.jsx(framerMotion.motion.output,{variants:r.number,initial:"initial",animate:"animate",className:"text-2xl font-medium bg-clip-text text-transparent bg-gradient-to-b from-zinc-800 to-zinc-600 dark:from-zinc-200 dark:to-zinc-400 select-none","aria-label":`Current team size: ${t}`,children:t},t),jsxRuntime.jsx("button",{type:"button",onClick:d,onKeyDown:e=>f(e,"increment"),disabled:t>=s,"aria-label":"Increase team size",className:"h-12 w-12 rounded-full bg-gradient-to-b from-white to-zinc-50 dark:from-zinc-800 dark:to-zinc-900 border border-zinc-200/80 dark:border-zinc-700/80 shadow-md hover:shadow-lg hover:border-zinc-300 dark:hover:border-zinc-600 active:from-zinc-50 active:to-zinc-100 dark:active:from-zinc-900 dark:active:to-zinc-800 text-zinc-900 dark:text-zinc-100 disabled:opacity-40 disabled:cursor-not-allowed transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-zinc-500/30 dark:focus-visible:ring-zinc-400/30 focus-visible:ring-offset-2",children:jsxRuntime.jsx("span",{className:"text-2xl font-medium select-none",children:"+"})})]})]})})}var E=T;
|
|
2
|
+
exports.TeamSelector=T;exports.default=E;//# sourceMappingURL=index.js.map
|
|
3
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/team-selector/index.tsx"],"names":["MAX_TEAM_SIZE","DEFAULT_TEAM_MEMBERS","animations","TeamSelector","defaultValue","onChange","className","members","maxSize","peopleCount","setPeopleCount","useState","isVibrating","setIsVibrating","handleIncrement","newCount","triggerVibration","handleDecrement","handleKeyDown","action","renderAvatars","member","index","jsx","motion","jsxs","AnimatePresence","team_selector_default"],"mappings":"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","file":"index.js","sourcesContent":["\"use client\";\r\n\r\nimport { AnimatePresence, motion, type Variants } from \"framer-motion\";\r\nimport { useState } from \"react\";\r\n\r\nconst MAX_TEAM_SIZE = 4;\r\n\r\ninterface TeamMember {\r\n id: string;\r\n avatarUrl: string;\r\n name: string;\r\n}\r\n\r\nconst DEFAULT_TEAM_MEMBERS: TeamMember[] = [\r\n {\r\n id: \"member-1\",\r\n avatarUrl: \"https://i.pravatar.cc/150?img=1\",\r\n name: \"Team Member 1\",\r\n },\r\n {\r\n id: \"member-2\",\r\n avatarUrl: \"https://i.pravatar.cc/150?img=2\",\r\n name: \"Team Member 2\",\r\n },\r\n {\r\n id: \"member-3\",\r\n avatarUrl: \"https://i.pravatar.cc/150?img=3\",\r\n name: \"Team Member 3\",\r\n },\r\n {\r\n id: \"member-4\",\r\n avatarUrl: \"https://i.pravatar.cc/150?img=4\",\r\n name: \"Team Member 4\",\r\n },\r\n];\r\n\r\nconst animations = {\r\n container: {\r\n initial: { opacity: 0, y: 20 },\r\n animate: { opacity: 1, y: 0 },\r\n exit: { opacity: 0, y: -20 },\r\n } satisfies Variants,\r\n avatar: {\r\n initial: { opacity: 0, scale: 0.8 },\r\n animate: {\r\n opacity: 1,\r\n scale: 1,\r\n transition: { duration: 0.3 },\r\n },\r\n exit: {\r\n opacity: 0,\r\n scale: 0.8,\r\n transition: { duration: 0.15 },\r\n },\r\n } satisfies Variants,\r\n vibration: {\r\n initial: { x: 0 },\r\n animate: {\r\n x: [-5, 5, -5, 5, 0],\r\n transition: { duration: 0.3 },\r\n },\r\n } satisfies Variants,\r\n number: {\r\n initial: { scale: 0.8, opacity: 0 },\r\n animate: {\r\n scale: 1,\r\n opacity: 1,\r\n transition: {\r\n type: \"spring\",\r\n stiffness: 400,\r\n damping: 25,\r\n },\r\n },\r\n } satisfies Variants,\r\n};\r\n\r\nexport interface TeamSelectorProps {\r\n defaultValue?: number;\r\n onChange?: (size: number) => void;\r\n className?: string;\r\n members?: TeamMember[];\r\n maxSize?: number;\r\n}\r\n\r\nexport function TeamSelector({\r\n defaultValue = 1,\r\n onChange,\r\n className = \"\",\r\n members = DEFAULT_TEAM_MEMBERS,\r\n maxSize = MAX_TEAM_SIZE,\r\n}: TeamSelectorProps) {\r\n const [peopleCount, setPeopleCount] = useState(defaultValue);\r\n const [isVibrating, setIsVibrating] = useState(false);\r\n\r\n const handleIncrement = (e: React.MouseEvent | React.KeyboardEvent) => {\r\n e.preventDefault();\r\n if (peopleCount < maxSize) {\r\n const newCount = peopleCount + 1;\r\n setPeopleCount(newCount);\r\n onChange?.(newCount);\r\n } else {\r\n triggerVibration();\r\n }\r\n };\r\n\r\n const handleDecrement = (e: React.MouseEvent | React.KeyboardEvent) => {\r\n e.preventDefault();\r\n if (peopleCount > 1) {\r\n const newCount = peopleCount - 1;\r\n setPeopleCount(newCount);\r\n onChange?.(newCount);\r\n } else {\r\n triggerVibration();\r\n }\r\n };\r\n\r\n const triggerVibration = () => {\r\n setIsVibrating(true);\r\n setTimeout(() => setIsVibrating(false), 300);\r\n };\r\n\r\n const handleKeyDown = (\r\n e: React.KeyboardEvent,\r\n action: \"increment\" | \"decrement\"\r\n ) => {\r\n if (e.key === \"Enter\" || e.key === \" \") {\r\n e.preventDefault();\r\n action === \"increment\" ? handleIncrement(e) : handleDecrement(e);\r\n }\r\n };\r\n\r\n const renderAvatars = () =>\r\n members.slice(0, peopleCount).map((member, index) => (\r\n <motion.div\r\n key={member.id}\r\n variants={animations.avatar}\r\n initial=\"initial\"\r\n animate=\"animate\"\r\n exit=\"exit\"\r\n className=\"flex items-center justify-center\"\r\n style={{\r\n zIndex: peopleCount - index,\r\n marginLeft: index === 0 ? 0 : -24,\r\n }}\r\n >\r\n <img\r\n src={member.avatarUrl}\r\n width={96}\r\n height={96}\r\n alt={member.name}\r\n className=\"rounded-full object-cover w-24 h-24 shadow-lg bg-gradient-to-b from-white/5 to-white/20 dark:from-white/5 dark:to-black/20 backdrop-blur-sm hover:shadow-xl transition-all duration-300 border border-white/10 dark:border-white/5\"\r\n />\r\n </motion.div>\r\n ));\r\n\r\n return (\r\n <motion.div\r\n variants={animations.container}\r\n initial=\"initial\"\r\n animate=\"animate\"\r\n exit=\"exit\"\r\n className={`flex w-full flex-col items-center justify-center gap-8 ${className}`}\r\n >\r\n <fieldset className=\"w-full\">\r\n <legend className=\"sr-only\">Team size selector</legend>\r\n <div className=\"relative h-24 w-full flex justify-center\">\r\n <AnimatePresence mode=\"popLayout\">{renderAvatars()}</AnimatePresence>\r\n </div>\r\n\r\n <motion.div\r\n variants={isVibrating ? animations.vibration : undefined}\r\n initial=\"initial\"\r\n animate={isVibrating ? \"animate\" : \"initial\"}\r\n className=\"flex items-center justify-center gap-8 mt-8\"\r\n >\r\n <button\r\n type=\"button\"\r\n onClick={handleDecrement}\r\n onKeyDown={(e) => handleKeyDown(e, \"decrement\")}\r\n disabled={peopleCount <= 1}\r\n aria-label=\"Decrease team size\"\r\n className=\"h-12 w-12 rounded-full bg-gradient-to-b from-white to-zinc-50 dark:from-zinc-800 dark:to-zinc-900 border border-zinc-200/80 dark:border-zinc-700/80 shadow-md hover:shadow-lg hover:border-zinc-300 dark:hover:border-zinc-600 active:from-zinc-50 active:to-zinc-100 dark:active:from-zinc-900 dark:active:to-zinc-800 text-zinc-900 dark:text-zinc-100 disabled:opacity-40 disabled:cursor-not-allowed transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-zinc-500/30 dark:focus-visible:ring-zinc-400/30 focus-visible:ring-offset-2\"\r\n >\r\n <span className=\"text-2xl font-medium select-none\">-</span>\r\n </button>\r\n\r\n <motion.output\r\n key={peopleCount}\r\n variants={animations.number}\r\n initial=\"initial\"\r\n animate=\"animate\"\r\n className=\"text-2xl font-medium bg-clip-text text-transparent bg-gradient-to-b from-zinc-800 to-zinc-600 dark:from-zinc-200 dark:to-zinc-400 select-none\"\r\n aria-label={`Current team size: ${peopleCount}`}\r\n >\r\n {peopleCount}\r\n </motion.output>\r\n\r\n <button\r\n type=\"button\"\r\n onClick={handleIncrement}\r\n onKeyDown={(e) => handleKeyDown(e, \"increment\")}\r\n disabled={peopleCount >= maxSize}\r\n aria-label=\"Increase team size\"\r\n className=\"h-12 w-12 rounded-full bg-gradient-to-b from-white to-zinc-50 dark:from-zinc-800 dark:to-zinc-900 border border-zinc-200/80 dark:border-zinc-700/80 shadow-md hover:shadow-lg hover:border-zinc-300 dark:hover:border-zinc-600 active:from-zinc-50 active:to-zinc-100 dark:active:from-zinc-900 dark:active:to-zinc-800 text-zinc-900 dark:text-zinc-100 disabled:opacity-40 disabled:cursor-not-allowed transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-zinc-500/30 dark:focus-visible:ring-zinc-400/30 focus-visible:ring-offset-2\"\r\n >\r\n <span className=\"text-2xl font-medium select-none\">+</span>\r\n </button>\r\n </motion.div>\r\n </fieldset>\r\n </motion.div>\r\n );\r\n}\r\n\r\nexport default TeamSelector;\r\n"]}
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import {motion,AnimatePresence}from'framer-motion';import {useState}from'react';import {jsx,jsxs}from'react/jsx-runtime';var x=4,w=[{id:"member-1",avatarUrl:"https://i.pravatar.cc/150?img=1",name:"Team Member 1"},{id:"member-2",avatarUrl:"https://i.pravatar.cc/150?img=2",name:"Team Member 2"},{id:"member-3",avatarUrl:"https://i.pravatar.cc/150?img=3",name:"Team Member 3"},{id:"member-4",avatarUrl:"https://i.pravatar.cc/150?img=4",name:"Team Member 4"}],r={container:{initial:{opacity:0,y:20},animate:{opacity:1,y:0},exit:{opacity:0,y:-20}},avatar:{initial:{opacity:0,scale:.8},animate:{opacity:1,scale:1,transition:{duration:.3}},exit:{opacity:0,scale:.8,transition:{duration:.15}}},vibration:{initial:{x:0},animate:{x:[-5,5,-5,5,0],transition:{duration:.3}}},number:{initial:{scale:.8,opacity:0},animate:{scale:1,opacity:1,transition:{type:"spring",stiffness:400,damping:25}}}};function T({defaultValue:g=1,onChange:o,className:z="",members:h=w,maxSize:s=x}){let[t,c]=useState(g),[l,m]=useState(false),d=e=>{if(e.preventDefault(),t<s){let a=t+1;c(a),o?.(a);}else u();},b=e=>{if(e.preventDefault(),t>1){let a=t-1;c(a),o?.(a);}else u();},u=()=>{m(true),setTimeout(()=>m(false),300);},f=(e,a)=>{(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),a==="increment"?d(e):b(e));},y=()=>h.slice(0,t).map((e,a)=>jsx(motion.div,{variants:r.avatar,initial:"initial",animate:"animate",exit:"exit",className:"flex items-center justify-center",style:{zIndex:t-a,marginLeft:a===0?0:-24},children:jsx("img",{src:e.avatarUrl,width:96,height:96,alt:e.name,className:"rounded-full object-cover w-24 h-24 shadow-lg bg-gradient-to-b from-white/5 to-white/20 dark:from-white/5 dark:to-black/20 backdrop-blur-sm hover:shadow-xl transition-all duration-300 border border-white/10 dark:border-white/5"})},e.id));return jsx(motion.div,{variants:r.container,initial:"initial",animate:"animate",exit:"exit",className:`flex w-full flex-col items-center justify-center gap-8 ${z}`,children:jsxs("fieldset",{className:"w-full",children:[jsx("legend",{className:"sr-only",children:"Team size selector"}),jsx("div",{className:"relative h-24 w-full flex justify-center",children:jsx(AnimatePresence,{mode:"popLayout",children:y()})}),jsxs(motion.div,{variants:l?r.vibration:void 0,initial:"initial",animate:l?"animate":"initial",className:"flex items-center justify-center gap-8 mt-8",children:[jsx("button",{type:"button",onClick:b,onKeyDown:e=>f(e,"decrement"),disabled:t<=1,"aria-label":"Decrease team size",className:"h-12 w-12 rounded-full bg-gradient-to-b from-white to-zinc-50 dark:from-zinc-800 dark:to-zinc-900 border border-zinc-200/80 dark:border-zinc-700/80 shadow-md hover:shadow-lg hover:border-zinc-300 dark:hover:border-zinc-600 active:from-zinc-50 active:to-zinc-100 dark:active:from-zinc-900 dark:active:to-zinc-800 text-zinc-900 dark:text-zinc-100 disabled:opacity-40 disabled:cursor-not-allowed transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-zinc-500/30 dark:focus-visible:ring-zinc-400/30 focus-visible:ring-offset-2",children:jsx("span",{className:"text-2xl font-medium select-none",children:"-"})}),jsx(motion.output,{variants:r.number,initial:"initial",animate:"animate",className:"text-2xl font-medium bg-clip-text text-transparent bg-gradient-to-b from-zinc-800 to-zinc-600 dark:from-zinc-200 dark:to-zinc-400 select-none","aria-label":`Current team size: ${t}`,children:t},t),jsx("button",{type:"button",onClick:d,onKeyDown:e=>f(e,"increment"),disabled:t>=s,"aria-label":"Increase team size",className:"h-12 w-12 rounded-full bg-gradient-to-b from-white to-zinc-50 dark:from-zinc-800 dark:to-zinc-900 border border-zinc-200/80 dark:border-zinc-700/80 shadow-md hover:shadow-lg hover:border-zinc-300 dark:hover:border-zinc-600 active:from-zinc-50 active:to-zinc-100 dark:active:from-zinc-900 dark:active:to-zinc-800 text-zinc-900 dark:text-zinc-100 disabled:opacity-40 disabled:cursor-not-allowed transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-zinc-500/30 dark:focus-visible:ring-zinc-400/30 focus-visible:ring-offset-2",children:jsx("span",{className:"text-2xl font-medium select-none",children:"+"})})]})]})})}var E=T;
|
|
2
|
+
export{T as TeamSelector,E as default};//# sourceMappingURL=index.mjs.map
|
|
3
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/team-selector/index.tsx"],"names":["MAX_TEAM_SIZE","DEFAULT_TEAM_MEMBERS","animations","TeamSelector","defaultValue","onChange","className","members","maxSize","peopleCount","setPeopleCount","useState","isVibrating","setIsVibrating","handleIncrement","newCount","triggerVibration","handleDecrement","handleKeyDown","action","renderAvatars","member","index","jsx","motion","jsxs","AnimatePresence","team_selector_default"],"mappings":"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","file":"index.mjs","sourcesContent":["\"use client\";\r\n\r\nimport { AnimatePresence, motion, type Variants } from \"framer-motion\";\r\nimport { useState } from \"react\";\r\n\r\nconst MAX_TEAM_SIZE = 4;\r\n\r\ninterface TeamMember {\r\n id: string;\r\n avatarUrl: string;\r\n name: string;\r\n}\r\n\r\nconst DEFAULT_TEAM_MEMBERS: TeamMember[] = [\r\n {\r\n id: \"member-1\",\r\n avatarUrl: \"https://i.pravatar.cc/150?img=1\",\r\n name: \"Team Member 1\",\r\n },\r\n {\r\n id: \"member-2\",\r\n avatarUrl: \"https://i.pravatar.cc/150?img=2\",\r\n name: \"Team Member 2\",\r\n },\r\n {\r\n id: \"member-3\",\r\n avatarUrl: \"https://i.pravatar.cc/150?img=3\",\r\n name: \"Team Member 3\",\r\n },\r\n {\r\n id: \"member-4\",\r\n avatarUrl: \"https://i.pravatar.cc/150?img=4\",\r\n name: \"Team Member 4\",\r\n },\r\n];\r\n\r\nconst animations = {\r\n container: {\r\n initial: { opacity: 0, y: 20 },\r\n animate: { opacity: 1, y: 0 },\r\n exit: { opacity: 0, y: -20 },\r\n } satisfies Variants,\r\n avatar: {\r\n initial: { opacity: 0, scale: 0.8 },\r\n animate: {\r\n opacity: 1,\r\n scale: 1,\r\n transition: { duration: 0.3 },\r\n },\r\n exit: {\r\n opacity: 0,\r\n scale: 0.8,\r\n transition: { duration: 0.15 },\r\n },\r\n } satisfies Variants,\r\n vibration: {\r\n initial: { x: 0 },\r\n animate: {\r\n x: [-5, 5, -5, 5, 0],\r\n transition: { duration: 0.3 },\r\n },\r\n } satisfies Variants,\r\n number: {\r\n initial: { scale: 0.8, opacity: 0 },\r\n animate: {\r\n scale: 1,\r\n opacity: 1,\r\n transition: {\r\n type: \"spring\",\r\n stiffness: 400,\r\n damping: 25,\r\n },\r\n },\r\n } satisfies Variants,\r\n};\r\n\r\nexport interface TeamSelectorProps {\r\n defaultValue?: number;\r\n onChange?: (size: number) => void;\r\n className?: string;\r\n members?: TeamMember[];\r\n maxSize?: number;\r\n}\r\n\r\nexport function TeamSelector({\r\n defaultValue = 1,\r\n onChange,\r\n className = \"\",\r\n members = DEFAULT_TEAM_MEMBERS,\r\n maxSize = MAX_TEAM_SIZE,\r\n}: TeamSelectorProps) {\r\n const [peopleCount, setPeopleCount] = useState(defaultValue);\r\n const [isVibrating, setIsVibrating] = useState(false);\r\n\r\n const handleIncrement = (e: React.MouseEvent | React.KeyboardEvent) => {\r\n e.preventDefault();\r\n if (peopleCount < maxSize) {\r\n const newCount = peopleCount + 1;\r\n setPeopleCount(newCount);\r\n onChange?.(newCount);\r\n } else {\r\n triggerVibration();\r\n }\r\n };\r\n\r\n const handleDecrement = (e: React.MouseEvent | React.KeyboardEvent) => {\r\n e.preventDefault();\r\n if (peopleCount > 1) {\r\n const newCount = peopleCount - 1;\r\n setPeopleCount(newCount);\r\n onChange?.(newCount);\r\n } else {\r\n triggerVibration();\r\n }\r\n };\r\n\r\n const triggerVibration = () => {\r\n setIsVibrating(true);\r\n setTimeout(() => setIsVibrating(false), 300);\r\n };\r\n\r\n const handleKeyDown = (\r\n e: React.KeyboardEvent,\r\n action: \"increment\" | \"decrement\"\r\n ) => {\r\n if (e.key === \"Enter\" || e.key === \" \") {\r\n e.preventDefault();\r\n action === \"increment\" ? handleIncrement(e) : handleDecrement(e);\r\n }\r\n };\r\n\r\n const renderAvatars = () =>\r\n members.slice(0, peopleCount).map((member, index) => (\r\n <motion.div\r\n key={member.id}\r\n variants={animations.avatar}\r\n initial=\"initial\"\r\n animate=\"animate\"\r\n exit=\"exit\"\r\n className=\"flex items-center justify-center\"\r\n style={{\r\n zIndex: peopleCount - index,\r\n marginLeft: index === 0 ? 0 : -24,\r\n }}\r\n >\r\n <img\r\n src={member.avatarUrl}\r\n width={96}\r\n height={96}\r\n alt={member.name}\r\n className=\"rounded-full object-cover w-24 h-24 shadow-lg bg-gradient-to-b from-white/5 to-white/20 dark:from-white/5 dark:to-black/20 backdrop-blur-sm hover:shadow-xl transition-all duration-300 border border-white/10 dark:border-white/5\"\r\n />\r\n </motion.div>\r\n ));\r\n\r\n return (\r\n <motion.div\r\n variants={animations.container}\r\n initial=\"initial\"\r\n animate=\"animate\"\r\n exit=\"exit\"\r\n className={`flex w-full flex-col items-center justify-center gap-8 ${className}`}\r\n >\r\n <fieldset className=\"w-full\">\r\n <legend className=\"sr-only\">Team size selector</legend>\r\n <div className=\"relative h-24 w-full flex justify-center\">\r\n <AnimatePresence mode=\"popLayout\">{renderAvatars()}</AnimatePresence>\r\n </div>\r\n\r\n <motion.div\r\n variants={isVibrating ? animations.vibration : undefined}\r\n initial=\"initial\"\r\n animate={isVibrating ? \"animate\" : \"initial\"}\r\n className=\"flex items-center justify-center gap-8 mt-8\"\r\n >\r\n <button\r\n type=\"button\"\r\n onClick={handleDecrement}\r\n onKeyDown={(e) => handleKeyDown(e, \"decrement\")}\r\n disabled={peopleCount <= 1}\r\n aria-label=\"Decrease team size\"\r\n className=\"h-12 w-12 rounded-full bg-gradient-to-b from-white to-zinc-50 dark:from-zinc-800 dark:to-zinc-900 border border-zinc-200/80 dark:border-zinc-700/80 shadow-md hover:shadow-lg hover:border-zinc-300 dark:hover:border-zinc-600 active:from-zinc-50 active:to-zinc-100 dark:active:from-zinc-900 dark:active:to-zinc-800 text-zinc-900 dark:text-zinc-100 disabled:opacity-40 disabled:cursor-not-allowed transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-zinc-500/30 dark:focus-visible:ring-zinc-400/30 focus-visible:ring-offset-2\"\r\n >\r\n <span className=\"text-2xl font-medium select-none\">-</span>\r\n </button>\r\n\r\n <motion.output\r\n key={peopleCount}\r\n variants={animations.number}\r\n initial=\"initial\"\r\n animate=\"animate\"\r\n className=\"text-2xl font-medium bg-clip-text text-transparent bg-gradient-to-b from-zinc-800 to-zinc-600 dark:from-zinc-200 dark:to-zinc-400 select-none\"\r\n aria-label={`Current team size: ${peopleCount}`}\r\n >\r\n {peopleCount}\r\n </motion.output>\r\n\r\n <button\r\n type=\"button\"\r\n onClick={handleIncrement}\r\n onKeyDown={(e) => handleKeyDown(e, \"increment\")}\r\n disabled={peopleCount >= maxSize}\r\n aria-label=\"Increase team size\"\r\n className=\"h-12 w-12 rounded-full bg-gradient-to-b from-white to-zinc-50 dark:from-zinc-800 dark:to-zinc-900 border border-zinc-200/80 dark:border-zinc-700/80 shadow-md hover:shadow-lg hover:border-zinc-300 dark:hover:border-zinc-600 active:from-zinc-50 active:to-zinc-100 dark:active:from-zinc-900 dark:active:to-zinc-800 text-zinc-900 dark:text-zinc-100 disabled:opacity-40 disabled:cursor-not-allowed transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-zinc-500/30 dark:focus-visible:ring-zinc-400/30 focus-visible:ring-offset-2\"\r\n >\r\n <span className=\"text-2xl font-medium select-none\">+</span>\r\n </button>\r\n </motion.div>\r\n </fieldset>\r\n </motion.div>\r\n );\r\n}\r\n\r\nexport default TeamSelector;\r\n"]}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
'use strict';Object.defineProperty(exports,'__esModule',{value:true});var react=require('react'),jsxRuntime=require('react/jsx-runtime');var C=e=>e.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase(),k=e=>e.replace(/^([A-Z])|[\s-_]+(\w)/g,(a,t,d)=>d?d.toUpperCase():t.toLowerCase()),x=e=>{let a=k(e);return a.charAt(0).toUpperCase()+a.slice(1)},p=(...e)=>e.filter((a,t,d)=>!!a&&a.trim()!==""&&d.indexOf(a)===t).join(" ").trim(),S=e=>{for(let a in e)if(a.startsWith("aria-")||a==="role"||a==="title")return true};var h={xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"};var w=react.forwardRef(({color:e="currentColor",size:a=24,strokeWidth:t=2,absoluteStrokeWidth:d,className:s="",children:l,iconNode:n,...r},m)=>react.createElement("svg",{ref:m,...h,width:a,height:a,stroke:e,strokeWidth:d?Number(t)*24/Number(a):t,className:p("lucide",s),...!l&&!S(r)&&{"aria-hidden":"true"},...r},[...n.map(([u,I])=>react.createElement(u,I)),...Array.isArray(l)?l:[l]]));var L=(e,a)=>{let t=react.forwardRef(({className:d,...s},l)=>react.createElement(w,{ref:l,iconNode:a,className:p(`lucide-${C(x(e))}`,`lucide-${e}`,d),...s}));return t.displayName=x(e),t};var D=[["path",{d:"m15 18-6-6 6-6",key:"1wnfg3"}]],i=L("chevron-left",D);var F=[["path",{d:"m9 18 6-6-6-6",key:"mthhwq"}]],c=L("chevron-right",F);function q({title:e="What Developers Say",description:a="See what developers are saying about their experience.",testimonials:t=[{content:"This has revolutionized how we build user interfaces.",avatar:"https://i.pravatar.cc/150?img=1",name:"Eduardo Calvo",role:"CEO & Founder"},{content:"The design system is incredibly well thought out.",avatar:"https://i.pravatar.cc/150?img=2",name:"Drew Cano",role:"Head of Design"},{content:"Best UI library I've used. Excellent TypeScript support.",avatar:"https://i.pravatar.cc/150?img=3",name:"Marcus Johnson",role:"Lead Developer"}],autoplay:d=false,className:s=""}){let[l,n]=react.useState(0),r=react.useCallback(()=>{n(u=>(u+1)%t.length);},[t.length]),m=()=>{n(u=>(u-1+t.length)%t.length);};return react.useEffect(()=>{if(d){let u=setInterval(r,5e3);return ()=>clearInterval(u)}},[d,r]),jsxRuntime.jsx("div",{className:`py-24 ${s}`,children:jsxRuntime.jsx("div",{className:"container mx-auto max-w-6xl px-6",children:jsxRuntime.jsxs("div",{className:"grid grid-cols-1 gap-8 lg:grid-cols-2 lg:gap-12",children:[jsxRuntime.jsxs("div",{className:"flex flex-col justify-center",children:[jsxRuntime.jsx("h2",{className:"mb-4 text-4xl font-semibold",children:e}),jsxRuntime.jsx("p",{className:"text-muted-foreground text-lg",children:a})]}),jsxRuntime.jsxs("div",{className:"relative flex flex-col items-end",children:[jsxRuntime.jsxs("div",{className:"mb-4 flex gap-2",children:[jsxRuntime.jsx("button",{onClick:m,className:"flex h-8 w-8 items-center justify-center rounded-full border hover:bg-accent",children:jsxRuntime.jsx(i,{className:"h-5 w-5"})}),jsxRuntime.jsx("button",{onClick:r,className:"flex h-8 w-8 items-center justify-center rounded-full border hover:bg-accent",children:jsxRuntime.jsx(c,{className:"h-5 w-5"})})]}),jsxRuntime.jsx("div",{className:"relative h-full w-full max-w-md",children:t.map((u,I)=>jsxRuntime.jsx("div",{className:`absolute inset-0 transition-all duration-400 ${I===l?"opacity-100 scale-100 z-10":"opacity-0 scale-95 z-0"}`,children:jsxRuntime.jsxs("div",{className:"rounded-2xl border px-6 py-6 shadow-lg",children:[jsxRuntime.jsx("p",{className:"mb-6 text-lg",children:u.content}),jsxRuntime.jsxs("div",{className:"flex items-center gap-3",children:[jsxRuntime.jsx("img",{src:u.avatar,alt:u.name,className:"size-8 rounded-full border object-cover"}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("div",{className:"font-semibold",children:u.name}),jsxRuntime.jsx("span",{className:"text-muted-foreground text-sm",children:u.role})]})]})]})},u.name))})]})]})})})}var $=q;/*! Bundled license information:
|
|
2
|
+
|
|
3
|
+
lucide-react/dist/esm/shared/src/utils.js:
|
|
4
|
+
lucide-react/dist/esm/defaultAttributes.js:
|
|
5
|
+
lucide-react/dist/esm/Icon.js:
|
|
6
|
+
lucide-react/dist/esm/createLucideIcon.js:
|
|
7
|
+
lucide-react/dist/esm/icons/chevron-left.js:
|
|
8
|
+
lucide-react/dist/esm/icons/chevron-right.js:
|
|
9
|
+
lucide-react/dist/esm/lucide-react.js:
|
|
10
|
+
(**
|
|
11
|
+
* @license lucide-react v0.545.0 - ISC
|
|
12
|
+
*
|
|
13
|
+
* This source code is licensed under the ISC license.
|
|
14
|
+
* See the LICENSE file in the root directory of this source tree.
|
|
15
|
+
*)
|
|
16
|
+
*/exports.TestimonialsGrid=q;exports.default=$;//# sourceMappingURL=index.js.map
|
|
17
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../node_modules/shared/src/utils.ts","../../../../node_modules/lucide-react/src/defaultAttributes.ts","../../../../node_modules/lucide-react/src/Icon.ts","../../../../node_modules/lucide-react/src/createLucideIcon.ts","../../../../node_modules/lucide-react/src/icons/chevron-left.ts","../../../../node_modules/lucide-react/src/icons/chevron-right.ts","../../src/testimonials-grid/index.tsx"],"names":["toKebabCase","string","toCamelCase","match","p1","p2","toPascalCase","camelCase","mergeClasses","classes","className","index","array","hasA11yProp","props","prop","defaultAttributes","Icon","forwardRef","color","size","strokeWidth","absoluteStrokeWidth","children","iconNode","rest","ref","createElement","tag","attrs","createLucideIcon","iconName","Component","__iconNode","ChevronLeft","ChevronRight","TestimonialsGrid","title","description","testimonials","autoplay","active","setActive","useState","handleNext","useCallback","prev","handlePrev","useEffect","interval","jsx","jsxs","testimonial","testimonials_grid_default"],"mappings":"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","file":"index.js","sourcesContent":["import { CamelToPascal } from './utility-types';\n\n/**\n * Converts string to kebab case\n *\n * @param {string} string\n * @returns {string} A kebabized string\n */\nexport const toKebabCase = (string: string) =>\n string.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();\n\n/**\n * Converts string to camel case\n *\n * @param {string} string\n * @returns {string} A camelized string\n */\nexport const toCamelCase = <T extends string>(string: T) =>\n string.replace(/^([A-Z])|[\\s-_]+(\\w)/g, (match, p1, p2) =>\n p2 ? p2.toUpperCase() : p1.toLowerCase(),\n );\n\n/**\n * Converts string to pascal case\n *\n * @param {string} string\n * @returns {string} A pascalized string\n */\nexport const toPascalCase = <T extends string>(string: T): CamelToPascal<T> => {\n const camelCase = toCamelCase(string);\n\n return (camelCase.charAt(0).toUpperCase() + camelCase.slice(1)) as CamelToPascal<T>;\n};\n\n/**\n * Merges classes into a single string\n *\n * @param {array} classes\n * @returns {string} A string of classes\n */\nexport const mergeClasses = <ClassType = string | undefined | null>(...classes: ClassType[]) =>\n classes\n .filter((className, index, array) => {\n return (\n Boolean(className) &&\n (className as string).trim() !== '' &&\n array.indexOf(className) === index\n );\n })\n .join(' ')\n .trim();\n\n/**\n * Is empty string\n *\n * @param {unknown} value\n * @returns {boolean} Whether the value is an empty string\n */\nexport const isEmptyString = (value: unknown): boolean => value === '';\n\n/**\n * Check if a component has an accessibility prop\n *\n * @param {object} props\n * @returns {boolean} Whether the component has an accessibility prop\n */\nexport const hasA11yProp = (props: Record<string, any>) => {\n for (const prop in props) {\n if (prop.startsWith('aria-') || prop === 'role' || prop === 'title') {\n return true;\n }\n }\n};\n","export default {\n xmlns: 'http://www.w3.org/2000/svg',\n width: 24,\n height: 24,\n viewBox: '0 0 24 24',\n fill: 'none',\n stroke: 'currentColor',\n strokeWidth: 2,\n strokeLinecap: 'round',\n strokeLinejoin: 'round',\n};\n","import { createElement, forwardRef } from 'react';\nimport defaultAttributes from './defaultAttributes';\nimport { IconNode, LucideProps } from './types';\nimport { mergeClasses, hasA11yProp } from '@lucide/shared';\n\ninterface IconComponentProps extends LucideProps {\n iconNode: IconNode;\n}\n\n/**\n * Lucide icon component\n *\n * @component Icon\n * @param {object} props\n * @param {string} props.color - The color of the icon\n * @param {number} props.size - The size of the icon\n * @param {number} props.strokeWidth - The stroke width of the icon\n * @param {boolean} props.absoluteStrokeWidth - Whether to use absolute stroke width\n * @param {string} props.className - The class name of the icon\n * @param {IconNode} props.children - The children of the icon\n * @param {IconNode} props.iconNode - The icon node of the icon\n *\n * @returns {ForwardRefExoticComponent} LucideIcon\n */\nconst Icon = forwardRef<SVGSVGElement, IconComponentProps>(\n (\n {\n color = 'currentColor',\n size = 24,\n strokeWidth = 2,\n absoluteStrokeWidth,\n className = '',\n children,\n iconNode,\n ...rest\n },\n ref,\n ) =>\n createElement(\n 'svg',\n {\n ref,\n ...defaultAttributes,\n width: size,\n height: size,\n stroke: color,\n strokeWidth: absoluteStrokeWidth ? (Number(strokeWidth) * 24) / Number(size) : strokeWidth,\n className: mergeClasses('lucide', className),\n ...(!children && !hasA11yProp(rest) && { 'aria-hidden': 'true' }),\n ...rest,\n },\n [\n ...iconNode.map(([tag, attrs]) => createElement(tag, attrs)),\n ...(Array.isArray(children) ? children : [children]),\n ],\n ),\n);\n\nexport default Icon;\n","import { createElement, forwardRef } from 'react';\nimport { mergeClasses, toKebabCase, toPascalCase } from '@lucide/shared';\nimport { IconNode, LucideProps } from './types';\nimport Icon from './Icon';\n\n/**\n * Create a Lucide icon component\n * @param {string} iconName\n * @param {array} iconNode\n * @returns {ForwardRefExoticComponent} LucideIcon\n */\nconst createLucideIcon = (iconName: string, iconNode: IconNode) => {\n const Component = forwardRef<SVGSVGElement, LucideProps>(({ className, ...props }, ref) =>\n createElement(Icon, {\n ref,\n iconNode,\n className: mergeClasses(\n `lucide-${toKebabCase(toPascalCase(iconName))}`,\n `lucide-${iconName}`,\n className,\n ),\n ...props,\n }),\n );\n\n Component.displayName = toPascalCase(iconName);\n\n return Component;\n};\n\nexport default createLucideIcon;\n","import createLucideIcon from '../createLucideIcon';\nimport { IconNode } from '../types';\n\nexport const __iconNode: IconNode = [['path', { d: 'm15 18-6-6 6-6', key: '1wnfg3' }]];\n\n/**\n * @component @name ChevronLeft\n * @description Lucide SVG icon component, renders SVG Element with children.\n *\n * @preview  - https://lucide.dev/icons/chevron-left\n * @see https://lucide.dev/guide/packages/lucide-react - Documentation\n *\n * @param {Object} props - Lucide icons props and any valid SVG attribute\n * @returns {JSX.Element} JSX Element\n *\n */\nconst ChevronLeft = createLucideIcon('chevron-left', __iconNode);\n\nexport default ChevronLeft;\n","import createLucideIcon from '../createLucideIcon';\nimport { IconNode } from '../types';\n\nexport const __iconNode: IconNode = [['path', { d: 'm9 18 6-6-6-6', key: 'mthhwq' }]];\n\n/**\n * @component @name ChevronRight\n * @description Lucide SVG icon component, renders SVG Element with children.\n *\n * @preview  - https://lucide.dev/icons/chevron-right\n * @see https://lucide.dev/guide/packages/lucide-react - Documentation\n *\n * @param {Object} props - Lucide icons props and any valid SVG attribute\n * @returns {JSX.Element} JSX Element\n *\n */\nconst ChevronRight = createLucideIcon('chevron-right', __iconNode);\n\nexport default ChevronRight;\n","\"use client\";\r\n\r\nimport { useCallback, useEffect, useState } from \"react\";\r\nimport { ChevronLeft, ChevronRight } from \"lucide-react\";\r\n\r\ninterface Testimonial {\r\n content: string;\r\n avatar: string;\r\n name: string;\r\n role: string;\r\n}\r\n\r\ninterface TestimonialsGridProps {\r\n title?: string;\r\n description?: string;\r\n testimonials?: Testimonial[];\r\n autoplay?: boolean;\r\n className?: string;\r\n}\r\n\r\nexport function TestimonialsGrid({\r\n title = \"What Developers Say\",\r\n description = \"See what developers are saying about their experience.\",\r\n testimonials = [\r\n {\r\n content: \"This has revolutionized how we build user interfaces.\",\r\n avatar: \"https://i.pravatar.cc/150?img=1\",\r\n name: \"Eduardo Calvo\",\r\n role: \"CEO & Founder\",\r\n },\r\n {\r\n content: \"The design system is incredibly well thought out.\",\r\n avatar: \"https://i.pravatar.cc/150?img=2\",\r\n name: \"Drew Cano\",\r\n role: \"Head of Design\",\r\n },\r\n {\r\n content: \"Best UI library I've used. Excellent TypeScript support.\",\r\n avatar: \"https://i.pravatar.cc/150?img=3\",\r\n name: \"Marcus Johnson\",\r\n role: \"Lead Developer\",\r\n },\r\n ],\r\n autoplay = false,\r\n className = \"\",\r\n}: TestimonialsGridProps) {\r\n const [active, setActive] = useState(0);\r\n\r\n const handleNext = useCallback(() => {\r\n setActive((prev) => (prev + 1) % testimonials.length);\r\n }, [testimonials.length]);\r\n\r\n const handlePrev = () => {\r\n setActive((prev) => (prev - 1 + testimonials.length) % testimonials.length);\r\n };\r\n\r\n useEffect(() => {\r\n if (autoplay) {\r\n const interval = setInterval(handleNext, 5000);\r\n return () => clearInterval(interval);\r\n }\r\n }, [autoplay, handleNext]);\r\n\r\n return (\r\n <div className={`py-24 ${className}`}>\r\n <div className=\"container mx-auto max-w-6xl px-6\">\r\n <div className=\"grid grid-cols-1 gap-8 lg:grid-cols-2 lg:gap-12\">\r\n <div className=\"flex flex-col justify-center\">\r\n <h2 className=\"mb-4 text-4xl font-semibold\">{title}</h2>\r\n <p className=\"text-muted-foreground text-lg\">{description}</p>\r\n </div>\r\n\r\n <div className=\"relative flex flex-col items-end\">\r\n <div className=\"mb-4 flex gap-2\">\r\n <button\r\n onClick={handlePrev}\r\n className=\"flex h-8 w-8 items-center justify-center rounded-full border hover:bg-accent\"\r\n >\r\n <ChevronLeft className=\"h-5 w-5\" />\r\n </button>\r\n <button\r\n onClick={handleNext}\r\n className=\"flex h-8 w-8 items-center justify-center rounded-full border hover:bg-accent\"\r\n >\r\n <ChevronRight className=\"h-5 w-5\" />\r\n </button>\r\n </div>\r\n\r\n <div className=\"relative h-full w-full max-w-md\">\r\n {testimonials.map((testimonial, index) => (\r\n <div\r\n key={testimonial.name}\r\n className={`absolute inset-0 transition-all duration-400 ${\r\n index === active ? \"opacity-100 scale-100 z-10\" : \"opacity-0 scale-95 z-0\"\r\n }`}\r\n >\r\n <div className=\"rounded-2xl border px-6 py-6 shadow-lg\">\r\n <p className=\"mb-6 text-lg\">{testimonial.content}</p>\r\n <div className=\"flex items-center gap-3\">\r\n <img\r\n src={testimonial.avatar}\r\n alt={testimonial.name}\r\n className=\"size-8 rounded-full border object-cover\"\r\n />\r\n <div>\r\n <div className=\"font-semibold\">{testimonial.name}</div>\r\n <span className=\"text-muted-foreground text-sm\">{testimonial.role}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n ))}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nexport default TestimonialsGrid;\r\n"]}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import {forwardRef,createElement,useState,useCallback,useEffect}from'react';import {jsx,jsxs}from'react/jsx-runtime';var C=e=>e.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase(),k=e=>e.replace(/^([A-Z])|[\s-_]+(\w)/g,(a,t,d)=>d?d.toUpperCase():t.toLowerCase()),x=e=>{let a=k(e);return a.charAt(0).toUpperCase()+a.slice(1)},p=(...e)=>e.filter((a,t,d)=>!!a&&a.trim()!==""&&d.indexOf(a)===t).join(" ").trim(),S=e=>{for(let a in e)if(a.startsWith("aria-")||a==="role"||a==="title")return true};var h={xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"};var w=forwardRef(({color:e="currentColor",size:a=24,strokeWidth:t=2,absoluteStrokeWidth:d,className:s="",children:l,iconNode:n,...r},m)=>createElement("svg",{ref:m,...h,width:a,height:a,stroke:e,strokeWidth:d?Number(t)*24/Number(a):t,className:p("lucide",s),...!l&&!S(r)&&{"aria-hidden":"true"},...r},[...n.map(([u,I])=>createElement(u,I)),...Array.isArray(l)?l:[l]]));var L=(e,a)=>{let t=forwardRef(({className:d,...s},l)=>createElement(w,{ref:l,iconNode:a,className:p(`lucide-${C(x(e))}`,`lucide-${e}`,d),...s}));return t.displayName=x(e),t};var D=[["path",{d:"m15 18-6-6 6-6",key:"1wnfg3"}]],i=L("chevron-left",D);var F=[["path",{d:"m9 18 6-6-6-6",key:"mthhwq"}]],c=L("chevron-right",F);function q({title:e="What Developers Say",description:a="See what developers are saying about their experience.",testimonials:t=[{content:"This has revolutionized how we build user interfaces.",avatar:"https://i.pravatar.cc/150?img=1",name:"Eduardo Calvo",role:"CEO & Founder"},{content:"The design system is incredibly well thought out.",avatar:"https://i.pravatar.cc/150?img=2",name:"Drew Cano",role:"Head of Design"},{content:"Best UI library I've used. Excellent TypeScript support.",avatar:"https://i.pravatar.cc/150?img=3",name:"Marcus Johnson",role:"Lead Developer"}],autoplay:d=false,className:s=""}){let[l,n]=useState(0),r=useCallback(()=>{n(u=>(u+1)%t.length);},[t.length]),m=()=>{n(u=>(u-1+t.length)%t.length);};return useEffect(()=>{if(d){let u=setInterval(r,5e3);return ()=>clearInterval(u)}},[d,r]),jsx("div",{className:`py-24 ${s}`,children:jsx("div",{className:"container mx-auto max-w-6xl px-6",children:jsxs("div",{className:"grid grid-cols-1 gap-8 lg:grid-cols-2 lg:gap-12",children:[jsxs("div",{className:"flex flex-col justify-center",children:[jsx("h2",{className:"mb-4 text-4xl font-semibold",children:e}),jsx("p",{className:"text-muted-foreground text-lg",children:a})]}),jsxs("div",{className:"relative flex flex-col items-end",children:[jsxs("div",{className:"mb-4 flex gap-2",children:[jsx("button",{onClick:m,className:"flex h-8 w-8 items-center justify-center rounded-full border hover:bg-accent",children:jsx(i,{className:"h-5 w-5"})}),jsx("button",{onClick:r,className:"flex h-8 w-8 items-center justify-center rounded-full border hover:bg-accent",children:jsx(c,{className:"h-5 w-5"})})]}),jsx("div",{className:"relative h-full w-full max-w-md",children:t.map((u,I)=>jsx("div",{className:`absolute inset-0 transition-all duration-400 ${I===l?"opacity-100 scale-100 z-10":"opacity-0 scale-95 z-0"}`,children:jsxs("div",{className:"rounded-2xl border px-6 py-6 shadow-lg",children:[jsx("p",{className:"mb-6 text-lg",children:u.content}),jsxs("div",{className:"flex items-center gap-3",children:[jsx("img",{src:u.avatar,alt:u.name,className:"size-8 rounded-full border object-cover"}),jsxs("div",{children:[jsx("div",{className:"font-semibold",children:u.name}),jsx("span",{className:"text-muted-foreground text-sm",children:u.role})]})]})]})},u.name))})]})]})})})}var $=q;/*! Bundled license information:
|
|
2
|
+
|
|
3
|
+
lucide-react/dist/esm/shared/src/utils.js:
|
|
4
|
+
lucide-react/dist/esm/defaultAttributes.js:
|
|
5
|
+
lucide-react/dist/esm/Icon.js:
|
|
6
|
+
lucide-react/dist/esm/createLucideIcon.js:
|
|
7
|
+
lucide-react/dist/esm/icons/chevron-left.js:
|
|
8
|
+
lucide-react/dist/esm/icons/chevron-right.js:
|
|
9
|
+
lucide-react/dist/esm/lucide-react.js:
|
|
10
|
+
(**
|
|
11
|
+
* @license lucide-react v0.545.0 - ISC
|
|
12
|
+
*
|
|
13
|
+
* This source code is licensed under the ISC license.
|
|
14
|
+
* See the LICENSE file in the root directory of this source tree.
|
|
15
|
+
*)
|
|
16
|
+
*/export{q as TestimonialsGrid,$ as default};//# sourceMappingURL=index.mjs.map
|
|
17
|
+
//# sourceMappingURL=index.mjs.map
|