@ugurdemirel/landcraft 0.1.18 → 0.1.19

package/dist/cjs/components/Hero/Hero.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),i=require("react"),s=require("./variants/Split.cjs"),u=require("./variants/Centered.cjs"),c=require("./variants/Statement.cjs"),o=i.forwardRef(({variant:n="split",...e},t)=>n==="centered"?r.jsx(u.HeroCentered,{ref:t,...e}):n==="statement"?r.jsx(c.HeroStatement,{ref:t,...e}):r.jsx(s.HeroSplit,{ref:t,...e}));o.displayName="Hero";exports.Hero=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),i=require("react"),a=require("./variants/Split.cjs"),s=require("./variants/Centered.cjs"),u=require("./variants/Statement.cjs"),l=require("./variants/Parallax.cjs"),o=i.forwardRef(({variant:n="split",...e},r)=>n==="centered"?t.jsx(s.HeroCentered,{ref:r,...e}):n==="statement"?t.jsx(u.HeroStatement,{ref:r,...e}):n==="parallax"?t.jsx(l.HeroParallax,{ref:r,...e}):t.jsx(a.HeroSplit,{ref:r,...e}));o.displayName="Hero";exports.Hero=o;
 //# sourceMappingURL=Hero.cjs.map

package/dist/cjs/components/Hero/Hero.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Hero.cjs","sources":["../../../../src/components/Hero/Hero.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport type { HeroProps } from \"./types\";\nimport { HeroSplit } from \"./variants/Split\";\nimport { HeroCentered } from \"./variants/Centered\";\nimport { HeroStatement } from \"./variants/Statement\";\n\nexport const Hero = forwardRef<HTMLElement, HeroProps>(({ variant = \"split\", ...props }, ref) => {\n  if (variant === \"centered\") return <HeroCentered ref={ref} {...props} />;\n  if (variant === \"statement\") return <HeroStatement ref={ref} {...props} />;\n  return <HeroSplit ref={ref} {...props} />;\n});\nHero.displayName = \"Hero\";"],"names":["Hero","forwardRef","variant","props","ref","HeroCentered","HeroStatement","jsx","HeroSplit"],"mappings":"qPAMaA,EAAOC,EAAAA,WAAmC,CAAC,CAAE,QAAAC,EAAU,QAAS,GAAGC,CAAA,EAASC,IACnFF,IAAY,iBAAoBG,EAAAA,aAAA,CAAa,IAAAD,EAAW,GAAGD,EAAO,EAClED,IAAY,kBAAqBI,EAAAA,cAAA,CAAc,IAAAF,EAAW,GAAGD,EAAO,EACjEI,EAAAA,IAACC,EAAAA,UAAA,CAAU,IAAAJ,EAAW,GAAGD,CAAA,CAAO,CACxC,EACDH,EAAK,YAAc"}
+{"version":3,"file":"Hero.cjs","sources":["../../../../src/components/Hero/Hero.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport type { HeroProps } from \"./types\";\nimport { HeroSplit } from \"./variants/Split\";\nimport { HeroCentered } from \"./variants/Centered\";\nimport { HeroStatement } from \"./variants/Statement\";\nimport { HeroParallax } from \"./variants/Parallax\";\n\nexport const Hero = forwardRef<HTMLElement, HeroProps>(({ variant = \"split\", ...props }, ref) => {\n  if (variant === \"centered\") return <HeroCentered ref={ref} {...props} />;\n  if (variant === \"statement\") return <HeroStatement ref={ref} {...props} />;\n  if (variant === \"parallax\") return <HeroParallax ref={ref} {...props} />;\n  return <HeroSplit ref={ref} {...props} />;\n});\nHero.displayName = \"Hero\";"],"names":["Hero","forwardRef","variant","props","ref","HeroCentered","HeroStatement","HeroParallax","jsx","HeroSplit"],"mappings":"0RAOaA,EAAOC,EAAAA,WAAmC,CAAC,CAAE,QAAAC,EAAU,QAAS,GAAGC,CAAA,EAASC,IACnFF,IAAY,iBAAoBG,EAAAA,aAAA,CAAa,IAAAD,EAAW,GAAGD,EAAO,EAClED,IAAY,kBAAqBI,EAAAA,cAAA,CAAc,IAAAF,EAAW,GAAGD,EAAO,EACpED,IAAY,iBAAoBK,EAAAA,aAAA,CAAa,IAAAH,EAAW,GAAGD,EAAO,EAC/DK,EAAAA,IAACC,EAAAA,UAAA,CAAU,IAAAL,EAAW,GAAGD,CAAA,CAAO,CACxC,EACDH,EAAK,YAAc"}

package/dist/cjs/components/Hero/variants/Parallax.cjs

@@ -0,0 +1,3 @@
+"use client";
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),a=require("react"),i=require("../../../utils/cn.cjs"),u=require("../parts.cjs"),D=18,F=5,P=.7;function C(r,d,l){d.current=r,typeof l=="function"?l(r):l&&(l.current=r)}function _(r){return{x:(r.x-50)*4,y:(r.y-50)*4}}const N=a.forwardRef(({className:r,eyebrow:d,title:l,description:x,primaryAction:f,secondaryAction:m,meta:h,media:p,logos:w=[],id:M,...T},E)=>{const y=a.useRef(null),[b,j]=a.useState({x:0,y:0}),[R,$]=a.useState(!1),[o,v]=a.useState(!1);a.useEffect(()=>{var s;if(typeof window.matchMedia!="function")return;const e=window.matchMedia("(prefers-reduced-motion: reduce)"),n=()=>v(e.matches);return v(e.matches),(s=e.addEventListener)==null||s.call(e,"change",n),()=>{var c;return(c=e.removeEventListener)==null?void 0:c.call(e,"change",n)}},[]),a.useEffect(()=>{if(o)return;const e=requestAnimationFrame(()=>$(!0));return()=>cancelAnimationFrame(e)},[o]);const L=e=>{if(o)return;const n=y.current;if(!n)return;const s=n.getBoundingClientRect();j({x:((e.clientX-s.left)/s.width-.5)*2,y:((e.clientY-s.top)/s.height-.5)*2})},S=()=>j({x:0,y:0}),g=R||o;return t.jsxs("section",{ref:e=>C(e,y,E),id:M,onMouseMove:L,onMouseLeave:S,className:i.cn("relative w-full overflow-hidden border-b border-border bg-background",r),...T,children:[w.map((e,n)=>{const s=e.depth??D,c=_(e),A=`translate(calc(-50% + ${c.x}px), calc(-50% + ${c.y}px)) scale(0.6)`,H="translate(-50%, -50%)",O=o?"translate(0px, 0px)":`translate(${b.x*s}px, ${b.y*s}px)`;return t.jsx("div",{"aria-hidden":!0,"data-logo":e.label,className:"pointer-events-none absolute z-10 hidden transition-[transform,opacity] duration-700 ease-out md:block",style:{left:`${e.x}%`,top:`${e.y}%`,transform:g?H:A,opacity:g?1:0,transitionDelay:`${n*90}ms`},children:t.jsx("div",{className:"transition-transform duration-200 ease-out",style:{transform:O},children:t.jsx("div",{className:"flex h-16 w-16 items-center justify-center rounded-2xl border border-border bg-surface shadow-raised",style:o?void 0:{animation:`hero-float ${F}s ease-in-out infinite`,animationDelay:`-${n*P}s`},children:e.icon})})},e.label)}),t.jsxs("div",{className:i.cn(u.heroContainer,"relative z-20 pt-24 pb-20 text-center sm:pt-32 sm:pb-24"),children:[t.jsx(u.HeroEyebrow,{eyebrow:d}),t.jsx("h1",{className:i.cn(u.heroTitleBase,"mt-7 max-w-4xl text-5xl leading-[1.04] sm:text-6xl lg:text-7xl"),children:l}),x?t.jsx("p",{className:"mx-auto mt-7 max-w-xl text-pretty leading-relaxed text-muted-foreground sm:text-lg",children:x}):null,f||m?t.jsx("div",{className:"mt-10 justify-center",children:t.jsx(u.HeroActions,{primaryAction:f,secondaryAction:m})}):null,h?t.jsx("ul",{className:"mt-14 flex flex-wrap items-center justify-center gap-x-9 gap-y-3",children:h.map((e,n)=>t.jsxs("li",{className:i.cn("flex items-center gap-2 text-sm text-muted-foreground",n>0&&"sm:border-l sm:border-border sm:pl-9"),children:[e.icon?t.jsx("span",{className:"text-foreground/35",children:e.icon}):null,e.label]},e.label))}):null,p?t.jsx("div",{className:"mt-16 w-full",children:p}):null]})]})});N.displayName="HeroParallax";exports.HeroParallax=N;
+//# sourceMappingURL=Parallax.cjs.map

package/dist/cjs/components/Hero/variants/Parallax.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Parallax.cjs","sources":["../../../../../src/components/Hero/variants/Parallax.tsx"],"sourcesContent":["\"use client\";\nimport {\n  forwardRef,\n  useEffect,\n  useRef,\n  useState,\n  type ForwardedRef,\n  type MouseEvent,\n  type MutableRefObject,\n} from \"react\";\nimport { cn } from \"../../../utils/cn\";\nimport { HeroActions, HeroEyebrow, heroContainer, heroTitleBase } from \"../parts\";\nimport type { HeroLogo, HeroProps } from \"../types\";\n\nconst DEFAULT_DEPTH = 18;\nconst FLOAT_DURATION = 5; // seconds per breathing cycle\nconst FLOAT_STAGGER = 0.7; // seconds of desync between consecutive tiles\n\nfunction setSectionRef(\n  node: HTMLElement | null,\n  localRef: MutableRefObject<HTMLElement | null>,\n  forwarded: ForwardedRef<HTMLElement>,\n) {\n  localRef.current = node;\n  if (typeof forwarded === \"function\") forwarded(node);\n  else if (forwarded) (forwarded as MutableRefObject<HTMLElement | null>).current = node;\n}\n\nfunction tileEntryOffset(logo: HeroLogo) {\n  // Push the tile further out from the centre along the line it already sits on,\n  // so it appears to fly in from off-screen.\n  return { x: (logo.x - 50) * 4, y: (logo.y - 50) * 4 };\n}\n\n/** Parallax — centred copy with floating logo tiles that react to the mouse. */\nexport const HeroParallax = forwardRef<HTMLElement, HeroProps>(\n  (\n    { className, eyebrow, title, description, primaryAction, secondaryAction, meta, media, logos = [], id, ...props },\n    ref,\n  ) => {\n    const sectionRef = useRef<HTMLElement | null>(null);\n    const [offset, setOffset] = useState({ x: 0, y: 0 });\n    const [entered, setEntered] = useState(false);\n    const [reduceMotion, setReduceMotion] = useState(false);\n\n    useEffect(() => {\n      if (typeof window.matchMedia !== \"function\") return;\n      const mq = window.matchMedia(\"(prefers-reduced-motion: reduce)\");\n      const onChange = () => setReduceMotion(mq.matches);\n      setReduceMotion(mq.matches);\n      mq.addEventListener?.(\"change\", onChange);\n      return () => mq.removeEventListener?.(\"change\", onChange);\n    }, []);\n\n    useEffect(() => {\n      if (reduceMotion) return;\n      const raf = requestAnimationFrame(() => setEntered(true));\n      return () => cancelAnimationFrame(raf);\n    }, [reduceMotion]);\n\n    const handleMouseMove = (e: MouseEvent<HTMLElement>) => {\n      if (reduceMotion) return;\n      const el = sectionRef.current;\n      if (!el) return;\n      const rect = el.getBoundingClientRect();\n      setOffset({\n        x: ((e.clientX - rect.left) / rect.width - 0.5) * 2,\n        y: ((e.clientY - rect.top) / rect.height - 0.5) * 2,\n      });\n    };\n\n    const handleMouseLeave = () => setOffset({ x: 0, y: 0 });\n\n    const showResting = entered || reduceMotion;\n\n    return (\n      <section\n        ref={(node) => setSectionRef(node, sectionRef, ref)}\n        id={id}\n        onMouseMove={handleMouseMove}\n        onMouseLeave={handleMouseLeave}\n        className={cn(\"relative w-full overflow-hidden border-b border-border bg-background\", className)}\n        {...props}\n      >\n        {logos.map((logo, i) => {\n          const depth = logo.depth ?? DEFAULT_DEPTH;\n          const entry = tileEntryOffset(logo);\n          const entryTransform = `translate(calc(-50% + ${entry.x}px), calc(-50% + ${entry.y}px)) scale(0.6)`;\n          const restingTransform = \"translate(-50%, -50%)\";\n          const parallaxTransform = reduceMotion\n            ? \"translate(0px, 0px)\"\n            : `translate(${offset.x * depth}px, ${offset.y * depth}px)`;\n\n          return (\n            <div\n              key={logo.label}\n              aria-hidden\n              data-logo={logo.label}\n              className=\"pointer-events-none absolute z-10 hidden transition-[transform,opacity] duration-700 ease-out md:block\"\n              style={{\n                left: `${logo.x}%`,\n                top: `${logo.y}%`,\n                transform: showResting ? restingTransform : entryTransform,\n                opacity: showResting ? 1 : 0,\n                transitionDelay: `${i * 90}ms`,\n              }}\n            >\n              <div\n                className=\"transition-transform duration-200 ease-out\"\n                style={{ transform: parallaxTransform }}\n              >\n                <div\n                  className=\"flex h-16 w-16 items-center justify-center rounded-2xl border border-border bg-surface shadow-raised\"\n                  style={\n                    reduceMotion\n                      ? undefined\n                      : {\n                          animation: `hero-float ${FLOAT_DURATION}s ease-in-out infinite`,\n                          animationDelay: `-${i * FLOAT_STAGGER}s`,\n                        }\n                  }\n                >\n                  {logo.icon}\n                </div>\n              </div>\n            </div>\n          );\n        })}\n\n        <div className={cn(heroContainer, \"relative z-20 pt-24 pb-20 text-center sm:pt-32 sm:pb-24\")}>\n          <HeroEyebrow eyebrow={eyebrow} />\n          <h1 className={cn(heroTitleBase, \"mt-7 max-w-4xl text-5xl leading-[1.04] sm:text-6xl lg:text-7xl\")}>\n            {title}\n          </h1>\n          {description ? (\n            <p className=\"mx-auto mt-7 max-w-xl text-pretty leading-relaxed text-muted-foreground sm:text-lg\">\n              {description}\n            </p>\n          ) : null}\n          {primaryAction || secondaryAction ? (\n            <div className=\"mt-10 justify-center\">\n              <HeroActions primaryAction={primaryAction} secondaryAction={secondaryAction} />\n            </div>\n          ) : null}\n          {meta ? (\n            <ul className=\"mt-14 flex flex-wrap items-center justify-center gap-x-9 gap-y-3\">\n              {meta.map((m, i) => (\n                <li\n                  key={m.label}\n                  className={cn(\n                    \"flex items-center gap-2 text-sm text-muted-foreground\",\n                    i > 0 && \"sm:border-l sm:border-border sm:pl-9\",\n                  )}\n                >\n                  {m.icon ? <span className=\"text-foreground/35\">{m.icon}</span> : null}\n                  {m.label}\n                </li>\n              ))}\n            </ul>\n          ) : null}\n          {media ? <div className=\"mt-16 w-full\">{media}</div> : null}\n        </div>\n      </section>\n    );\n  },\n);\nHeroParallax.displayName = \"HeroParallax\";\n"],"names":["DEFAULT_DEPTH","FLOAT_DURATION","FLOAT_STAGGER","setSectionRef","node","localRef","forwarded","tileEntryOffset","logo","HeroParallax","forwardRef","className","eyebrow","title","description","primaryAction","secondaryAction","meta","media","logos","id","props","ref","sectionRef","useRef","offset","setOffset","useState","entered","setEntered","reduceMotion","setReduceMotion","useEffect","mq","onChange","_a","raf","handleMouseMove","el","rect","handleMouseLeave","showResting","jsxs","cn","i","depth","entry","entryTransform","restingTransform","parallaxTransform","jsx","heroContainer","HeroEyebrow","heroTitleBase","HeroActions","m"],"mappings":"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"}

package/dist/es/components/Hero/Hero.js

@@ -2,10 +2,11 @@ import { jsx as t } from "react/jsx-runtime";
 import { forwardRef as m } from "react";
 import { HeroSplit as i } from "./variants/Split.js";
 import { HeroCentered as f } from "./variants/Centered.js";
-import { HeroStatement as n } from "./variants/Statement.js";
-const p = m(({ variant: o = "split", ...r }, e) => o === "centered" ? /* @__PURE__ */ t(f, { ref: e, ...r }) : o === "statement" ? /* @__PURE__ */ t(n, { ref: e, ...r }) : /* @__PURE__ */ t(i, { ref: e, ...r }));
-p.displayName = "Hero";
+import { HeroStatement as a } from "./variants/Statement.js";
+import { HeroParallax as l } from "./variants/Parallax.js";
+const n = m(({ variant: o = "split", ...r }, e) => o === "centered" ? /* @__PURE__ */ t(f, { ref: e, ...r }) : o === "statement" ? /* @__PURE__ */ t(a, { ref: e, ...r }) : o === "parallax" ? /* @__PURE__ */ t(l, { ref: e, ...r }) : /* @__PURE__ */ t(i, { ref: e, ...r }));
+n.displayName = "Hero";
 export {
-  p as Hero
+  n as Hero
 };
 //# sourceMappingURL=Hero.js.map

package/dist/es/components/Hero/Hero.js.map

@@ -1 +1 @@
-{"version":3,"file":"Hero.js","sources":["../../../../src/components/Hero/Hero.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport type { HeroProps } from \"./types\";\nimport { HeroSplit } from \"./variants/Split\";\nimport { HeroCentered } from \"./variants/Centered\";\nimport { HeroStatement } from \"./variants/Statement\";\n\nexport const Hero = forwardRef<HTMLElement, HeroProps>(({ variant = \"split\", ...props }, ref) => {\n  if (variant === \"centered\") return <HeroCentered ref={ref} {...props} />;\n  if (variant === \"statement\") return <HeroStatement ref={ref} {...props} />;\n  return <HeroSplit ref={ref} {...props} />;\n});\nHero.displayName = \"Hero\";"],"names":["Hero","forwardRef","variant","props","ref","HeroCentered","HeroStatement","jsx","HeroSplit"],"mappings":";;;;;AAMO,MAAMA,IAAOC,EAAmC,CAAC,EAAE,SAAAC,IAAU,SAAS,GAAGC,EAAA,GAASC,MACnFF,MAAY,+BAAoBG,GAAA,EAAa,KAAAD,GAAW,GAAGD,GAAO,IAClED,MAAY,gCAAqBI,GAAA,EAAc,KAAAF,GAAW,GAAGD,GAAO,IACjE,gBAAAI,EAACC,GAAA,EAAU,KAAAJ,GAAW,GAAGD,EAAA,CAAO,CACxC;AACDH,EAAK,cAAc;"}
+{"version":3,"file":"Hero.js","sources":["../../../../src/components/Hero/Hero.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport type { HeroProps } from \"./types\";\nimport { HeroSplit } from \"./variants/Split\";\nimport { HeroCentered } from \"./variants/Centered\";\nimport { HeroStatement } from \"./variants/Statement\";\nimport { HeroParallax } from \"./variants/Parallax\";\n\nexport const Hero = forwardRef<HTMLElement, HeroProps>(({ variant = \"split\", ...props }, ref) => {\n  if (variant === \"centered\") return <HeroCentered ref={ref} {...props} />;\n  if (variant === \"statement\") return <HeroStatement ref={ref} {...props} />;\n  if (variant === \"parallax\") return <HeroParallax ref={ref} {...props} />;\n  return <HeroSplit ref={ref} {...props} />;\n});\nHero.displayName = \"Hero\";"],"names":["Hero","forwardRef","variant","props","ref","HeroCentered","HeroStatement","HeroParallax","jsx","HeroSplit"],"mappings":";;;;;;AAOO,MAAMA,IAAOC,EAAmC,CAAC,EAAE,SAAAC,IAAU,SAAS,GAAGC,EAAA,GAASC,MACnFF,MAAY,+BAAoBG,GAAA,EAAa,KAAAD,GAAW,GAAGD,GAAO,IAClED,MAAY,gCAAqBI,GAAA,EAAc,KAAAF,GAAW,GAAGD,GAAO,IACpED,MAAY,+BAAoBK,GAAA,EAAa,KAAAH,GAAW,GAAGD,GAAO,IAC/D,gBAAAK,EAACC,GAAA,EAAU,KAAAL,GAAW,GAAGD,EAAA,CAAO,CACxC;AACDH,EAAK,cAAc;"}

package/dist/es/components/Hero/variants/Parallax.js

@@ -0,0 +1,116 @@
+"use client";
+import { jsxs as d, jsx as t } from "react/jsx-runtime";
+import { forwardRef as O, useRef as C, useState as u, useEffect as w } from "react";
+import { cn as i } from "../../../utils/cn.js";
+import { HeroEyebrow as P, heroTitleBase as S, HeroActions as _, heroContainer as k } from "../parts.js";
+const z = 18, B = 5, G = 0.7;
+function U(s, c, a) {
+  c.current = s, typeof a == "function" ? a(s) : a && (a.current = s);
+}
+function I(s) {
+  return { x: (s.x - 50) * 4, y: (s.y - 50) * 4 };
+}
+const X = O(
+  ({ className: s, eyebrow: c, title: a, description: f, primaryAction: m, secondaryAction: x, meta: h, media: p, logos: M = [], id: T, ...E }, R) => {
+    const y = C(null), [b, v] = u({ x: 0, y: 0 }), [$, L] = u(!1), [o, g] = u(!1);
+    w(() => {
+      var r;
+      if (typeof window.matchMedia != "function") return;
+      const e = window.matchMedia("(prefers-reduced-motion: reduce)"), n = () => g(e.matches);
+      return g(e.matches), (r = e.addEventListener) == null || r.call(e, "change", n), () => {
+        var l;
+        return (l = e.removeEventListener) == null ? void 0 : l.call(e, "change", n);
+      };
+    }, []), w(() => {
+      if (o) return;
+      const e = requestAnimationFrame(() => L(!0));
+      return () => cancelAnimationFrame(e);
+    }, [o]);
+    const A = (e) => {
+      if (o) return;
+      const n = y.current;
+      if (!n) return;
+      const r = n.getBoundingClientRect();
+      v({
+        x: ((e.clientX - r.left) / r.width - 0.5) * 2,
+        y: ((e.clientY - r.top) / r.height - 0.5) * 2
+      });
+    }, j = () => v({ x: 0, y: 0 }), N = $ || o;
+    return /* @__PURE__ */ d(
+      "section",
+      {
+        ref: (e) => U(e, y, R),
+        id: T,
+        onMouseMove: A,
+        onMouseLeave: j,
+        className: i("relative w-full overflow-hidden border-b border-border bg-background", s),
+        ...E,
+        children: [
+          M.map((e, n) => {
+            const r = e.depth ?? z, l = I(e), D = `translate(calc(-50% + ${l.x}px), calc(-50% + ${l.y}px)) scale(0.6)`, F = "translate(-50%, -50%)", H = o ? "translate(0px, 0px)" : `translate(${b.x * r}px, ${b.y * r}px)`;
+            return /* @__PURE__ */ t(
+              "div",
+              {
+                "aria-hidden": !0,
+                "data-logo": e.label,
+                className: "pointer-events-none absolute z-10 hidden transition-[transform,opacity] duration-700 ease-out md:block",
+                style: {
+                  left: `${e.x}%`,
+                  top: `${e.y}%`,
+                  transform: N ? F : D,
+                  opacity: N ? 1 : 0,
+                  transitionDelay: `${n * 90}ms`
+                },
+                children: /* @__PURE__ */ t(
+                  "div",
+                  {
+                    className: "transition-transform duration-200 ease-out",
+                    style: { transform: H },
+                    children: /* @__PURE__ */ t(
+                      "div",
+                      {
+                        className: "flex h-16 w-16 items-center justify-center rounded-2xl border border-border bg-surface shadow-raised",
+                        style: o ? void 0 : {
+                          animation: `hero-float ${B}s ease-in-out infinite`,
+                          animationDelay: `-${n * G}s`
+                        },
+                        children: e.icon
+                      }
+                    )
+                  }
+                )
+              },
+              e.label
+            );
+          }),
+          /* @__PURE__ */ d("div", { className: i(k, "relative z-20 pt-24 pb-20 text-center sm:pt-32 sm:pb-24"), children: [
+            /* @__PURE__ */ t(P, { eyebrow: c }),
+            /* @__PURE__ */ t("h1", { className: i(S, "mt-7 max-w-4xl text-5xl leading-[1.04] sm:text-6xl lg:text-7xl"), children: a }),
+            f ? /* @__PURE__ */ t("p", { className: "mx-auto mt-7 max-w-xl text-pretty leading-relaxed text-muted-foreground sm:text-lg", children: f }) : null,
+            m || x ? /* @__PURE__ */ t("div", { className: "mt-10 justify-center", children: /* @__PURE__ */ t(_, { primaryAction: m, secondaryAction: x }) }) : null,
+            h ? /* @__PURE__ */ t("ul", { className: "mt-14 flex flex-wrap items-center justify-center gap-x-9 gap-y-3", children: h.map((e, n) => /* @__PURE__ */ d(
+              "li",
+              {
+                className: i(
+                  "flex items-center gap-2 text-sm text-muted-foreground",
+                  n > 0 && "sm:border-l sm:border-border sm:pl-9"
+                ),
+                children: [
+                  e.icon ? /* @__PURE__ */ t("span", { className: "text-foreground/35", children: e.icon }) : null,
+                  e.label
+                ]
+              },
+              e.label
+            )) }) : null,
+            p ? /* @__PURE__ */ t("div", { className: "mt-16 w-full", children: p }) : null
+          ] })
+        ]
+      }
+    );
+  }
+);
+X.displayName = "HeroParallax";
+export {
+  X as HeroParallax
+};
+//# sourceMappingURL=Parallax.js.map

package/dist/es/components/Hero/variants/Parallax.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Parallax.js","sources":["../../../../../src/components/Hero/variants/Parallax.tsx"],"sourcesContent":["\"use client\";\nimport {\n  forwardRef,\n  useEffect,\n  useRef,\n  useState,\n  type ForwardedRef,\n  type MouseEvent,\n  type MutableRefObject,\n} from \"react\";\nimport { cn } from \"../../../utils/cn\";\nimport { HeroActions, HeroEyebrow, heroContainer, heroTitleBase } from \"../parts\";\nimport type { HeroLogo, HeroProps } from \"../types\";\n\nconst DEFAULT_DEPTH = 18;\nconst FLOAT_DURATION = 5; // seconds per breathing cycle\nconst FLOAT_STAGGER = 0.7; // seconds of desync between consecutive tiles\n\nfunction setSectionRef(\n  node: HTMLElement | null,\n  localRef: MutableRefObject<HTMLElement | null>,\n  forwarded: ForwardedRef<HTMLElement>,\n) {\n  localRef.current = node;\n  if (typeof forwarded === \"function\") forwarded(node);\n  else if (forwarded) (forwarded as MutableRefObject<HTMLElement | null>).current = node;\n}\n\nfunction tileEntryOffset(logo: HeroLogo) {\n  // Push the tile further out from the centre along the line it already sits on,\n  // so it appears to fly in from off-screen.\n  return { x: (logo.x - 50) * 4, y: (logo.y - 50) * 4 };\n}\n\n/** Parallax — centred copy with floating logo tiles that react to the mouse. */\nexport const HeroParallax = forwardRef<HTMLElement, HeroProps>(\n  (\n    { className, eyebrow, title, description, primaryAction, secondaryAction, meta, media, logos = [], id, ...props },\n    ref,\n  ) => {\n    const sectionRef = useRef<HTMLElement | null>(null);\n    const [offset, setOffset] = useState({ x: 0, y: 0 });\n    const [entered, setEntered] = useState(false);\n    const [reduceMotion, setReduceMotion] = useState(false);\n\n    useEffect(() => {\n      if (typeof window.matchMedia !== \"function\") return;\n      const mq = window.matchMedia(\"(prefers-reduced-motion: reduce)\");\n      const onChange = () => setReduceMotion(mq.matches);\n      setReduceMotion(mq.matches);\n      mq.addEventListener?.(\"change\", onChange);\n      return () => mq.removeEventListener?.(\"change\", onChange);\n    }, []);\n\n    useEffect(() => {\n      if (reduceMotion) return;\n      const raf = requestAnimationFrame(() => setEntered(true));\n      return () => cancelAnimationFrame(raf);\n    }, [reduceMotion]);\n\n    const handleMouseMove = (e: MouseEvent<HTMLElement>) => {\n      if (reduceMotion) return;\n      const el = sectionRef.current;\n      if (!el) return;\n      const rect = el.getBoundingClientRect();\n      setOffset({\n        x: ((e.clientX - rect.left) / rect.width - 0.5) * 2,\n        y: ((e.clientY - rect.top) / rect.height - 0.5) * 2,\n      });\n    };\n\n    const handleMouseLeave = () => setOffset({ x: 0, y: 0 });\n\n    const showResting = entered || reduceMotion;\n\n    return (\n      <section\n        ref={(node) => setSectionRef(node, sectionRef, ref)}\n        id={id}\n        onMouseMove={handleMouseMove}\n        onMouseLeave={handleMouseLeave}\n        className={cn(\"relative w-full overflow-hidden border-b border-border bg-background\", className)}\n        {...props}\n      >\n        {logos.map((logo, i) => {\n          const depth = logo.depth ?? DEFAULT_DEPTH;\n          const entry = tileEntryOffset(logo);\n          const entryTransform = `translate(calc(-50% + ${entry.x}px), calc(-50% + ${entry.y}px)) scale(0.6)`;\n          const restingTransform = \"translate(-50%, -50%)\";\n          const parallaxTransform = reduceMotion\n            ? \"translate(0px, 0px)\"\n            : `translate(${offset.x * depth}px, ${offset.y * depth}px)`;\n\n          return (\n            <div\n              key={logo.label}\n              aria-hidden\n              data-logo={logo.label}\n              className=\"pointer-events-none absolute z-10 hidden transition-[transform,opacity] duration-700 ease-out md:block\"\n              style={{\n                left: `${logo.x}%`,\n                top: `${logo.y}%`,\n                transform: showResting ? restingTransform : entryTransform,\n                opacity: showResting ? 1 : 0,\n                transitionDelay: `${i * 90}ms`,\n              }}\n            >\n              <div\n                className=\"transition-transform duration-200 ease-out\"\n                style={{ transform: parallaxTransform }}\n              >\n                <div\n                  className=\"flex h-16 w-16 items-center justify-center rounded-2xl border border-border bg-surface shadow-raised\"\n                  style={\n                    reduceMotion\n                      ? undefined\n                      : {\n                          animation: `hero-float ${FLOAT_DURATION}s ease-in-out infinite`,\n                          animationDelay: `-${i * FLOAT_STAGGER}s`,\n                        }\n                  }\n                >\n                  {logo.icon}\n                </div>\n              </div>\n            </div>\n          );\n        })}\n\n        <div className={cn(heroContainer, \"relative z-20 pt-24 pb-20 text-center sm:pt-32 sm:pb-24\")}>\n          <HeroEyebrow eyebrow={eyebrow} />\n          <h1 className={cn(heroTitleBase, \"mt-7 max-w-4xl text-5xl leading-[1.04] sm:text-6xl lg:text-7xl\")}>\n            {title}\n          </h1>\n          {description ? (\n            <p className=\"mx-auto mt-7 max-w-xl text-pretty leading-relaxed text-muted-foreground sm:text-lg\">\n              {description}\n            </p>\n          ) : null}\n          {primaryAction || secondaryAction ? (\n            <div className=\"mt-10 justify-center\">\n              <HeroActions primaryAction={primaryAction} secondaryAction={secondaryAction} />\n            </div>\n          ) : null}\n          {meta ? (\n            <ul className=\"mt-14 flex flex-wrap items-center justify-center gap-x-9 gap-y-3\">\n              {meta.map((m, i) => (\n                <li\n                  key={m.label}\n                  className={cn(\n                    \"flex items-center gap-2 text-sm text-muted-foreground\",\n                    i > 0 && \"sm:border-l sm:border-border sm:pl-9\",\n                  )}\n                >\n                  {m.icon ? <span className=\"text-foreground/35\">{m.icon}</span> : null}\n                  {m.label}\n                </li>\n              ))}\n            </ul>\n          ) : null}\n          {media ? <div className=\"mt-16 w-full\">{media}</div> : null}\n        </div>\n      </section>\n    );\n  },\n);\nHeroParallax.displayName = \"HeroParallax\";\n"],"names":["DEFAULT_DEPTH","FLOAT_DURATION","FLOAT_STAGGER","setSectionRef","node","localRef","forwarded","tileEntryOffset","logo","HeroParallax","forwardRef","className","eyebrow","title","description","primaryAction","secondaryAction","meta","media","logos","id","props","ref","sectionRef","useRef","offset","setOffset","useState","entered","setEntered","reduceMotion","setReduceMotion","useEffect","mq","onChange","_a","raf","handleMouseMove","el","rect","handleMouseLeave","showResting","jsxs","cn","i","depth","entry","entryTransform","restingTransform","parallaxTransform","jsx","heroContainer","HeroEyebrow","heroTitleBase","HeroActions","m"],"mappings":"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"}

package/dist/index.d.ts

@@ -328,6 +328,22 @@ export declare const Globe: (props: IconProps) => JSX_2.Element;
 
 export declare const Hero: ForwardRefExoticComponent<HeroProps & RefAttributes<HTMLElement>>;
 
+/** A floating logo tile for the `parallax` hero variant. */
+export declare interface HeroLogo {
+    /** Accessible name for the tile (used for the label/aria). */
+    label: string;
+    /** Logo/icon node rendered inside the tile. */
+    icon: ReactNode;
+    /** Horizontal position as a percentage (0–100) of the hero width. */
+    x: number;
+    /** Vertical position as a percentage (0–100) of the hero height. */
+    y: number;
+    /** Parallax travel in px per unit of mouse offset. Higher moves more. */
+    depth?: number;
+    /** Optional icon accent color. */
+    accent?: string;
+}
+
 export declare interface HeroMeta {
     label: string;
     icon?: ReactNode;
@@ -343,9 +359,11 @@ export declare interface HeroProps extends Omit<HTMLAttributes<HTMLElement>, "ti
     media?: ReactNode;
     /** Small trust/status row shown under the copy or CTAs. */
     meta?: HeroMeta[];
+    /** Floating logo tiles with a mouse parallax effect (`parallax` variant). */
+    logos?: HeroLogo[];
 }
 
-declare type HeroVariant = "split" | "centered" | "statement";
+declare type HeroVariant = "split" | "centered" | "statement" | "parallax";
 
 /**
  * Minimal 1.5px stroke icon set (Lucide/Heroicons inspired).

package/dist/styles.css

@@ -64,6 +64,8 @@
     --radius-xl: 1.125rem;
     --radius-2xl: 1.5rem;
     --radius-3xl: 2rem;
+    --ease-out: cubic-bezier(0, 0, 0.2, 1);
+    --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
     --blur-md: 12px;
     --blur-2xl: 40px;
     --default-transition-duration: 150ms;
@@ -319,6 +321,12 @@
   .left-7 {
     left: calc(var(--spacing) * 7);
   }
+  .z-10 {
+    z-index: 10;
+  }
+  .z-20 {
+    z-index: 20;
+  }
   .z-50 {
     z-index: 50;
   }
@@ -1797,6 +1805,9 @@
   .w-12 {
     width: calc(var(--spacing) * 12);
   }
+  .w-16 {
+    width: calc(var(--spacing) * 16);
+  }
   .w-28 {
     width: calc(var(--spacing) * 28);
   }
@@ -2878,6 +2889,11 @@
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
     transition-duration: var(--tw-duration, var(--default-transition-duration));
   }
+  .transition-\[transform\,opacity\] {
+    transition-property: transform,opacity;
+    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+    transition-duration: var(--tw-duration, var(--default-transition-duration));
+  }
   .transition-all {
     transition-property: all;
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
@@ -2905,6 +2921,18 @@
     --tw-duration: 300ms;
     transition-duration: 300ms;
   }
+  .duration-700 {
+    --tw-duration: 700ms;
+    transition-duration: 700ms;
+  }
+  .ease-in-out {
+    --tw-ease: var(--ease-in-out);
+    transition-timing-function: var(--ease-in-out);
+  }
+  .ease-out {
+    --tw-ease: var(--ease-out);
+    transition-timing-function: var(--ease-out);
+  }
   .prose-neutral {
     --tw-prose-body: oklch(37.1% 0 none);
     --tw-prose-headings: oklch(20.5% 0 none);
@@ -3317,6 +3345,9 @@
     }
   }
   @media (width >= 48rem) {
+    .md\:block {
+      display: block;
+    }
     .md\:flex {
       display: flex;
     }
@@ -3529,6 +3560,14 @@
     transform: translateX(-50%);
   }
 }
+@keyframes hero-float {
+  0%, 100% {
+    transform: translateY(0);
+  }
+  50% {
+    transform: translateY(-7px);
+  }
+}
 .modal-anim {
   transition: opacity 150ms ease, transform 150ms ease, overlay 150ms ease allow-discrete, display 150ms ease allow-discrete;
 }
@@ -3817,6 +3856,10 @@
   syntax: "*";
   inherits: false;
 }
+@property --tw-ease {
+  syntax: "*";
+  inherits: false;
+}
 @layer properties {
   @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
     *, ::before, ::after, ::backdrop {
@@ -3877,6 +3920,7 @@
       --tw-backdrop-saturate: initial;
       --tw-backdrop-sepia: initial;
       --tw-duration: initial;
+      --tw-ease: initial;
     }
   }
 }

package/dist/theme.css

@@ -199,6 +199,17 @@
   }
 }
 
+/* Gentle vertical "breathing" drift for floating hero logo tiles. */
+@keyframes hero-float {
+  0%,
+  100% {
+    transform: translateY(0);
+  }
+  50% {
+    transform: translateY(-7px);
+  }
+}
+
 /* ── Popover-based Modal (dialog) ────────────────────────── */
 
 .modal-anim {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ugurdemirel/landcraft",
-  "version": "0.1.18",
+  "version": "0.1.19",
   "publishConfig": {
     "access": "public"
   },