rothzerg-ui 0.1.20 → 0.1.21

package/dist/blocks/hero/Hero.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("../../utils/cn.cjs");;/* empty css           */const m=require("../../components/rows/Rows.cjs"),i=require("../../components/text/Text.cjs"),t=require("../../components/columns/Columns.cjs");function x({variant:r="centered",eyebrow:s,title:h,description:n,actions:c,socialProof:a,media:o,showGrid:d=!1,showGradient:_=!0,className:u}){return e.jsxs("section",{className:l.cn("rz-hero",`rz-hero--${r}`,u),children:[d&&e.jsx("div",{className:"rz-hero__bg-grid","aria-hidden":"true"}),_&&e.jsx("div",{className:"rz-hero__bg-gradient","aria-hidden":"true"}),e.jsxs("div",{className:"rz-hero__container",children:[e.jsxs(m.Rows,{className:"rz-hero__content",children:[s&&e.jsx(i.Text,{as:"span",className:"rz-hero__eyebrow",children:s}),e.jsx(i.Text,{as:"h1",className:"rz-hero__title",children:h}),n&&e.jsx(i.Text,{as:"p",className:"rz-hero__description",children:n}),c&&e.jsx(t.Columns,{className:"rz-hero__actions",children:c}),a&&e.jsx(t.Columns,{className:"rz-hero__social-proof",children:a})]}),r==="split"&&o&&e.jsx("div",{className:"rz-hero__media",children:o})]})]})}function j({children:r,className:s}){return e.jsx("span",{className:l.cn("rz-hero__title-highlight",s),children:r})}exports.Hero=x;exports.HeroHighlight=j;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("../../utils/cn.cjs");;/* empty css           */const g=require("../../components/rows/Rows.cjs"),o=require("../../components/text/Text.cjs"),d=require("../../components/columns/Columns.cjs");function z({variant:r="centered",eyebrow:s,title:p,description:a,actions:l,stats:c,socialProof:h,media:n,showGrid:t=!1,showGradient:_=!0,className:m}){const u=r==="split"||r==="mobile-app",x=r==="mobile-app"&&_;return e.jsxs("section",{className:i.cn("rz-hero",`rz-hero--${r}`,m),children:[t&&r!=="mobile-app"&&e.jsx("div",{className:"rz-hero__bg-grid","aria-hidden":"true"}),_&&r!=="mobile-app"&&e.jsx("div",{className:"rz-hero__bg-gradient","aria-hidden":"true"}),x&&e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"rz-hero__bg-app rz-hero__bg-app--glow-a","aria-hidden":"true"}),e.jsx("div",{className:"rz-hero__bg-app rz-hero__bg-app--glow-b","aria-hidden":"true"}),e.jsx("div",{className:"rz-hero__bg-app rz-hero__bg-app--mesh","aria-hidden":"true"})]}),e.jsxs("div",{className:"rz-hero__container",children:[e.jsxs(g.Rows,{className:"rz-hero__content",children:[s&&e.jsxs(o.Text,{as:"span",className:i.cn("rz-hero__eyebrow",r==="mobile-app"&&"rz-hero__eyebrow--pill"),children:[r==="mobile-app"&&e.jsx("span",{className:"rz-hero__eyebrow-dot","aria-hidden":"true"}),s]}),e.jsx(o.Text,{as:"h1",className:"rz-hero__title",children:p}),a&&e.jsx(o.Text,{as:"p",className:"rz-hero__description",children:a}),l&&e.jsx(d.Columns,{className:"rz-hero__actions",children:l}),r==="mobile-app"&&c&&e.jsx("div",{className:"rz-hero__stats",children:c}),h&&e.jsx(d.Columns,{className:"rz-hero__social-proof",children:h})]}),u&&n&&e.jsx("div",{className:"rz-hero__media",children:n})]})]})}function b({children:r,className:s}){return e.jsx("span",{className:i.cn("rz-hero__title-highlight",s),children:r})}exports.Hero=z;exports.HeroHighlight=b;

package/dist/blocks/hero/Hero.d.ts

@@ -1,7 +1,7 @@
 import { default as React } from 'react';
 export interface HeroProps {
     /** Layout variant */
-    variant?: 'centered' | 'split';
+    variant?: 'centered' | 'split' | 'mobile-app';
     /** Small label above the title */
     eyebrow?: React.ReactNode;
     /** Main headline. Use <HeroHighlight> to color part of it. */
@@ -10,9 +10,11 @@ export interface HeroProps {
     description?: React.ReactNode;
     /** Primary + secondary CTA buttons */
     actions?: React.ReactNode;
+    /** Metrics row (e.g. 200+ plans). Shown when `variant` is `mobile-app`. */
+    stats?: React.ReactNode;
     /** Social proof (e.g. avatar group + "X teams trust us") */
     socialProof?: React.ReactNode;
-    /** Image or component in the split layout's right column */
+    /** Image or component in the split / mobile-app layout's second column */
     media?: React.ReactNode;
     /** Show decorative grid background */
     showGrid?: boolean;
@@ -23,7 +25,7 @@ export interface HeroProps {
 /**
  * Hero
  *
- * A full-page hero section with centered or split layouts.
+ * A full-page hero section with centered, split, or mobile-app (marketing + device) layouts.
  * Compose with `HeroHighlight` for colored headline accents.
  *
  * @example
@@ -36,7 +38,7 @@ export interface HeroProps {
  *   showGrid
  * />
  */
-export declare function Hero({ variant, eyebrow, title, description, actions, socialProof, media, showGrid, showGradient, className, }: HeroProps): import("react/jsx-runtime").JSX.Element;
+export declare function Hero({ variant, eyebrow, title, description, actions, stats, socialProof, media, showGrid, showGradient, className, }: HeroProps): import("react/jsx-runtime").JSX.Element;
 /** Highlight a portion of the hero title with the primary color */
 export declare function HeroHighlight({ children, className }: {
     children: React.ReactNode;

package/dist/blocks/hero/Hero.js

@@ -1,40 +1,58 @@
-import { jsxs as i, jsx as r } from "react/jsx-runtime";
-import { cn as t } from "../../utils/cn.js";
+import { jsxs as o, jsx as e, Fragment as N } from "react/jsx-runtime";
+import { cn as s } from "../../utils/cn.js";
 /* empty css         */
-import { Rows as p } from "../../components/rows/Rows.js";
-import { Text as a } from "../../components/text/Text.js";
-import { Columns as n } from "../../components/columns/Columns.js";
-function H({
-  variant: e = "centered",
-  eyebrow: s,
-  title: m,
-  description: o,
+import { Rows as u } from "../../components/rows/Rows.js";
+import { Text as i } from "../../components/text/Text.js";
+import { Columns as d } from "../../components/columns/Columns.js";
+function y({
+  variant: r = "centered",
+  eyebrow: a,
+  title: n,
+  description: l,
   actions: h,
-  socialProof: c,
-  media: l,
-  showGrid: _ = !1,
-  showGradient: d = !0,
+  stats: p,
+  socialProof: _,
+  media: c,
+  showGrid: t = !1,
+  showGradient: m = !0,
   className: z
 }) {
-  return /* @__PURE__ */ i("section", { className: t("rz-hero", `rz-hero--${e}`, z), children: [
-    _ && /* @__PURE__ */ r("div", { className: "rz-hero__bg-grid", "aria-hidden": "true" }),
-    d && /* @__PURE__ */ r("div", { className: "rz-hero__bg-gradient", "aria-hidden": "true" }),
-    /* @__PURE__ */ i("div", { className: "rz-hero__container", children: [
-      /* @__PURE__ */ i(p, { className: "rz-hero__content", children: [
-        s && /* @__PURE__ */ r(a, { as: "span", className: "rz-hero__eyebrow", children: s }),
-        /* @__PURE__ */ r(a, { as: "h1", className: "rz-hero__title", children: m }),
-        o && /* @__PURE__ */ r(a, { as: "p", className: "rz-hero__description", children: o }),
-        h && /* @__PURE__ */ r(n, { className: "rz-hero__actions", children: h }),
-        c && /* @__PURE__ */ r(n, { className: "rz-hero__social-proof", children: c })
+  const b = r === "split" || r === "mobile-app", g = r === "mobile-app" && m;
+  return /* @__PURE__ */ o("section", { className: s("rz-hero", `rz-hero--${r}`, z), children: [
+    t && r !== "mobile-app" && /* @__PURE__ */ e("div", { className: "rz-hero__bg-grid", "aria-hidden": "true" }),
+    m && r !== "mobile-app" && /* @__PURE__ */ e("div", { className: "rz-hero__bg-gradient", "aria-hidden": "true" }),
+    g && /* @__PURE__ */ o(N, { children: [
+      /* @__PURE__ */ e("div", { className: "rz-hero__bg-app rz-hero__bg-app--glow-a", "aria-hidden": "true" }),
+      /* @__PURE__ */ e("div", { className: "rz-hero__bg-app rz-hero__bg-app--glow-b", "aria-hidden": "true" }),
+      /* @__PURE__ */ e("div", { className: "rz-hero__bg-app rz-hero__bg-app--mesh", "aria-hidden": "true" })
+    ] }),
+    /* @__PURE__ */ o("div", { className: "rz-hero__container", children: [
+      /* @__PURE__ */ o(u, { className: "rz-hero__content", children: [
+        a && /* @__PURE__ */ o(
+          i,
+          {
+            as: "span",
+            className: s("rz-hero__eyebrow", r === "mobile-app" && "rz-hero__eyebrow--pill"),
+            children: [
+              r === "mobile-app" && /* @__PURE__ */ e("span", { className: "rz-hero__eyebrow-dot", "aria-hidden": "true" }),
+              a
+            ]
+          }
+        ),
+        /* @__PURE__ */ e(i, { as: "h1", className: "rz-hero__title", children: n }),
+        l && /* @__PURE__ */ e(i, { as: "p", className: "rz-hero__description", children: l }),
+        h && /* @__PURE__ */ e(d, { className: "rz-hero__actions", children: h }),
+        r === "mobile-app" && p && /* @__PURE__ */ e("div", { className: "rz-hero__stats", children: p }),
+        _ && /* @__PURE__ */ e(d, { className: "rz-hero__social-proof", children: _ })
       ] }),
-      e === "split" && l && /* @__PURE__ */ r("div", { className: "rz-hero__media", children: l })
+      b && c && /* @__PURE__ */ e("div", { className: "rz-hero__media", children: c })
     ] })
   ] });
 }
-function b({ children: e, className: s }) {
-  return /* @__PURE__ */ r("span", { className: t("rz-hero__title-highlight", s), children: e });
+function A({ children: r, className: a }) {
+  return /* @__PURE__ */ e("span", { className: s("rz-hero__title-highlight", a), children: r });
 }
 export {
-  H as Hero,
-  b as HeroHighlight
+  y as Hero,
+  A as HeroHighlight
 };