@medialane/ui 0.125.6 → 0.126.0

package/dist/components/{portfolio-overview.cjs → portfolio-section-grid.cjs}

@@ -17,16 +17,16 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var portfolio_overview_exports = {};
-__export(portfolio_overview_exports, {
-  PortfolioOverview: () => PortfolioOverview
+var portfolio_section_grid_exports = {};
+__export(portfolio_section_grid_exports, {
+  PortfolioSectionGrid: () => PortfolioSectionGrid
 });
-module.exports = __toCommonJS(portfolio_overview_exports);
+module.exports = __toCommonJS(portfolio_section_grid_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_cn = require("../utils/cn.js");
-var import_portfolio_bento_tile = require("./portfolio-bento-tile.js");
-function PortfolioOverview({
-  tiles,
+var import_portfolio_section = require("./portfolio-section.js");
+function PortfolioSectionGrid({
+  sections,
   isEmpty,
   emptyState,
   className
@@ -34,35 +34,30 @@ function PortfolioOverview({
   if (isEmpty) {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className, children: emptyState });
   }
-  const populatedTiles = tiles.filter((t) => !t.isEmpty);
+  const populated = sections.filter((s) => !s.isEmpty);
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "div",
     {
       className: (0, import_cn.cn)(
-        // True masonry: a CSS multi-column container. Each tile keeps its
-        // own natural height and flows into whichever column is currently
-        // shortest — unlike a grid, nothing stretches to match a taller
-        // sibling in the same row, which is what real (unevenly-sized)
-        // portfolio content needs. "wide" tiles opt out via column-span:
-        // all (set on PortfolioBentoTile itself, not here).
-        "columns-1 sm:columns-2 lg:columns-3 gap-4",
+        "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 items-start",
         className
       ),
-      children: populatedTiles.map((tile) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        import_portfolio_bento_tile.PortfolioBentoTile,
+      children: populated.map((section) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_portfolio_section.PortfolioSection,
         {
-          title: tile.title,
-          href: tile.href,
-          size: tile.size,
-          children: tile.content
+          title: section.title,
+          href: section.href,
+          color: section.color,
+          size: section.size,
+          children: section.content
         },
-        tile.key
+        section.key
       ))
     }
   );
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  PortfolioOverview
+  PortfolioSectionGrid
 });
-//# sourceMappingURL=portfolio-overview.cjs.map
+//# sourceMappingURL=portfolio-section-grid.cjs.map

package/dist/components/portfolio-section-grid.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/portfolio-section-grid.tsx"],"sourcesContent":["\"use client\";\n\nimport { cn } from \"../utils/cn.js\";\nimport {\n  PortfolioSection,\n  type PortfolioSectionProps,\n} from \"./portfolio-section.js\";\n\nexport interface PortfolioSectionConfig {\n  key: string;\n  title: string;\n  href: string;\n  color?: PortfolioSectionProps[\"color\"];\n  size?: PortfolioSectionProps[\"size\"];\n\n  isEmpty?: boolean;\n  content: React.ReactNode;\n}\n\nexport interface PortfolioSectionGridProps {\n  sections: PortfolioSectionConfig[];\n\n  isEmpty?: boolean;\n  emptyState?: React.ReactNode;\n  className?: string;\n}\n\nexport function PortfolioSectionGrid({\n  sections,\n  isEmpty,\n  emptyState,\n  className,\n}: PortfolioSectionGridProps) {\n  if (isEmpty) {\n    return <div className={className}>{emptyState}</div>;\n  }\n\n  const populated = sections.filter((s) => !s.isEmpty);\n\n  return (\n    <div\n      className={cn(\n        \"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 items-start\",\n        className,\n      )}\n    >\n      {populated.map((section) => (\n        <PortfolioSection\n          key={section.key}\n          title={section.title}\n          href={section.href}\n          color={section.color}\n          size={section.size}\n        >\n          {section.content}\n        </PortfolioSection>\n      ))}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAkCW;AAhCX,gBAAmB;AACnB,+BAGO;AAqBA,SAAS,qBAAqB;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA8B;AAC5B,MAAI,SAAS;AACX,WAAO,4CAAC,SAAI,WAAuB,sBAAW;AAAA,EAChD;AAEA,QAAM,YAAY,SAAS,OAAO,CAAC,MAAM,CAAC,EAAE,OAAO;AAEnD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAEC,oBAAU,IAAI,CAAC,YACd;AAAA,QAAC;AAAA;AAAA,UAEC,OAAO,QAAQ;AAAA,UACf,MAAM,QAAQ;AAAA,UACd,OAAO,QAAQ;AAAA,UACf,MAAM,QAAQ;AAAA,UAEb,kBAAQ;AAAA;AAAA,QANJ,QAAQ;AAAA,MAOf,CACD;AAAA;AAAA,EACH;AAEJ;","names":[]}

package/dist/components/portfolio-section-grid.d.cts

@@ -0,0 +1,21 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { PortfolioSectionProps } from './portfolio-section.cjs';
+
+interface PortfolioSectionConfig {
+    key: string;
+    title: string;
+    href: string;
+    color?: PortfolioSectionProps["color"];
+    size?: PortfolioSectionProps["size"];
+    isEmpty?: boolean;
+    content: React.ReactNode;
+}
+interface PortfolioSectionGridProps {
+    sections: PortfolioSectionConfig[];
+    isEmpty?: boolean;
+    emptyState?: React.ReactNode;
+    className?: string;
+}
+declare function PortfolioSectionGrid({ sections, isEmpty, emptyState, className, }: PortfolioSectionGridProps): react_jsx_runtime.JSX.Element;
+
+export { type PortfolioSectionConfig, PortfolioSectionGrid, type PortfolioSectionGridProps };

package/dist/components/portfolio-section-grid.d.ts

@@ -0,0 +1,21 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { PortfolioSectionProps } from './portfolio-section.js';
+
+interface PortfolioSectionConfig {
+    key: string;
+    title: string;
+    href: string;
+    color?: PortfolioSectionProps["color"];
+    size?: PortfolioSectionProps["size"];
+    isEmpty?: boolean;
+    content: React.ReactNode;
+}
+interface PortfolioSectionGridProps {
+    sections: PortfolioSectionConfig[];
+    isEmpty?: boolean;
+    emptyState?: React.ReactNode;
+    className?: string;
+}
+declare function PortfolioSectionGrid({ sections, isEmpty, emptyState, className, }: PortfolioSectionGridProps): react_jsx_runtime.JSX.Element;
+
+export { type PortfolioSectionConfig, PortfolioSectionGrid, type PortfolioSectionGridProps };

package/dist/components/portfolio-section-grid.js

@@ -0,0 +1,41 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { cn } from "../utils/cn.js";
+import {
+  PortfolioSection
+} from "./portfolio-section.js";
+function PortfolioSectionGrid({
+  sections,
+  isEmpty,
+  emptyState,
+  className
+}) {
+  if (isEmpty) {
+    return /* @__PURE__ */ jsx("div", { className, children: emptyState });
+  }
+  const populated = sections.filter((s) => !s.isEmpty);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 items-start",
+        className
+      ),
+      children: populated.map((section) => /* @__PURE__ */ jsx(
+        PortfolioSection,
+        {
+          title: section.title,
+          href: section.href,
+          color: section.color,
+          size: section.size,
+          children: section.content
+        },
+        section.key
+      ))
+    }
+  );
+}
+export {
+  PortfolioSectionGrid
+};
+//# sourceMappingURL=portfolio-section-grid.js.map

package/dist/components/portfolio-section-grid.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/portfolio-section-grid.tsx"],"sourcesContent":["\"use client\";\n\nimport { cn } from \"../utils/cn.js\";\nimport {\n  PortfolioSection,\n  type PortfolioSectionProps,\n} from \"./portfolio-section.js\";\n\nexport interface PortfolioSectionConfig {\n  key: string;\n  title: string;\n  href: string;\n  color?: PortfolioSectionProps[\"color\"];\n  size?: PortfolioSectionProps[\"size\"];\n\n  isEmpty?: boolean;\n  content: React.ReactNode;\n}\n\nexport interface PortfolioSectionGridProps {\n  sections: PortfolioSectionConfig[];\n\n  isEmpty?: boolean;\n  emptyState?: React.ReactNode;\n  className?: string;\n}\n\nexport function PortfolioSectionGrid({\n  sections,\n  isEmpty,\n  emptyState,\n  className,\n}: PortfolioSectionGridProps) {\n  if (isEmpty) {\n    return <div className={className}>{emptyState}</div>;\n  }\n\n  const populated = sections.filter((s) => !s.isEmpty);\n\n  return (\n    <div\n      className={cn(\n        \"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 items-start\",\n        className,\n      )}\n    >\n      {populated.map((section) => (\n        <PortfolioSection\n          key={section.key}\n          title={section.title}\n          href={section.href}\n          color={section.color}\n          size={section.size}\n        >\n          {section.content}\n        </PortfolioSection>\n      ))}\n    </div>\n  );\n}\n"],"mappings":";AAkCW;AAhCX,SAAS,UAAU;AACnB;AAAA,EACE;AAAA,OAEK;AAqBA,SAAS,qBAAqB;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA8B;AAC5B,MAAI,SAAS;AACX,WAAO,oBAAC,SAAI,WAAuB,sBAAW;AAAA,EAChD;AAEA,QAAM,YAAY,SAAS,OAAO,CAAC,MAAM,CAAC,EAAE,OAAO;AAEnD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAEC,oBAAU,IAAI,CAAC,YACd;AAAA,QAAC;AAAA;AAAA,UAEC,OAAO,QAAQ;AAAA,UACf,MAAM,QAAQ;AAAA,UACd,OAAO,QAAQ;AAAA,UACf,MAAM,QAAQ;AAAA,UAEb,kBAAQ;AAAA;AAAA,QANJ,QAAQ;AAAA,MAOf,CACD;AAAA;AAAA,EACH;AAEJ;","names":[]}

package/dist/components/{portfolio-bento-tile.cjs → portfolio-section.cjs}

@@ -27,18 +27,27 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var portfolio_bento_tile_exports = {};
-__export(portfolio_bento_tile_exports, {
-  PortfolioBentoTile: () => PortfolioBentoTile
+var portfolio_section_exports = {};
+__export(portfolio_section_exports, {
+  PortfolioSection: () => PortfolioSection
 });
-module.exports = __toCommonJS(portfolio_bento_tile_exports);
+module.exports = __toCommonJS(portfolio_section_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_link = __toESM(require("next/link"), 1);
 var import_lucide_react = require("lucide-react");
 var import_cn = require("../utils/cn.js");
-function PortfolioBentoTile({
+const BORDER_BY_COLOR = {
+  blue: "border-brand-blue/40",
+  purple: "border-brand-purple/40",
+  rose: "border-brand-rose/40",
+  orange: "border-brand-orange/40",
+  maeve: "border-brand-maeve/40",
+  navy: "border-brand-navy/40"
+};
+function PortfolioSection({
   title,
   href,
+  color = "purple",
   size = "default",
   children,
   className
@@ -47,13 +56,13 @@ function PortfolioBentoTile({
     "section",
     {
       className: (0, import_cn.cn)(
-        "rounded-2xl bg-foreground/[0.04] min-w-0 transition-colors hover:bg-foreground/[0.07]",
-        "mb-4 break-inside-avoid",
-        size === "wide" && "[column-span:all]",
+        "rounded-2xl border min-w-0",
+        BORDER_BY_COLOR[color],
+        size === "wide" && "sm:col-span-2 lg:col-span-3",
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between gap-3 px-4 pt-4 pb-3", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between gap-3 px-5 pt-5 pb-3", children: [
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { className: "text-sm font-black text-foreground tracking-tight", children: title }),
           /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
             import_link.default,
@@ -67,13 +76,13 @@ function PortfolioBentoTile({
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "px-4 pb-4", children })
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "px-5 pb-5", children })
       ]
     }
   );
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  PortfolioBentoTile
+  PortfolioSection
 });
-//# sourceMappingURL=portfolio-bento-tile.cjs.map
+//# sourceMappingURL=portfolio-section.cjs.map

package/dist/components/portfolio-section.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/portfolio-section.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport { ArrowRight } from \"lucide-react\";\nimport { cn } from \"../utils/cn.js\";\n\nexport type PortfolioSectionColor =\n  | \"blue\"\n  | \"purple\"\n  | \"rose\"\n  | \"orange\"\n  | \"maeve\"\n  | \"navy\";\n\nconst BORDER_BY_COLOR: Record<PortfolioSectionColor, string> = {\n  blue: \"border-brand-blue/40\",\n  purple: \"border-brand-purple/40\",\n  rose: \"border-brand-rose/40\",\n  orange: \"border-brand-orange/40\",\n  maeve: \"border-brand-maeve/40\",\n  navy: \"border-brand-navy/40\",\n};\n\nexport interface PortfolioSectionProps {\n  title: string;\n  href: string;\n\n  /** Which brand color accents this section's hairline border. */\n  color?: PortfolioSectionColor;\n\n  /** \"default\" sits in the grid alongside its siblings; \"wide\" spans the\n   * full row instead — for list-like content (e.g. Activity) that reads\n   * better edge-to-edge than column-width. */\n  size?: \"default\" | \"wide\";\n  children: React.ReactNode;\n  className?: string;\n}\n\nexport function PortfolioSection({\n  title,\n  href,\n  color = \"purple\",\n  size = \"default\",\n  children,\n  className,\n}: PortfolioSectionProps) {\n  return (\n    <section\n      className={cn(\n        \"rounded-2xl border min-w-0\",\n        BORDER_BY_COLOR[color],\n        size === \"wide\" && \"sm:col-span-2 lg:col-span-3\",\n        className,\n      )}\n    >\n      <div className=\"flex items-center justify-between gap-3 px-5 pt-5 pb-3\">\n        <h2 className=\"text-sm font-black text-foreground tracking-tight\">\n          {title}\n        </h2>\n        <Link\n          href={href}\n          className=\"inline-flex items-center gap-1 text-xs font-medium text-muted-foreground hover:text-foreground transition-colors\"\n        >\n          See all\n          <ArrowRight className=\"h-3 w-3\" />\n        </Link>\n      </div>\n      <div className=\"px-5 pb-5\">{children}</div>\n    </section>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAwDQ;AAtDR,kBAAiB;AACjB,0BAA2B;AAC3B,gBAAmB;AAUnB,MAAM,kBAAyD;AAAA,EAC7D,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,MAAM;AACR;AAiBO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,OAAO;AAAA,EACP;AAAA,EACA;AACF,GAA0B;AACxB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW;AAAA,QACT;AAAA,QACA,gBAAgB,KAAK;AAAA,QACrB,SAAS,UAAU;AAAA,QACnB;AAAA,MACF;AAAA,MAEA;AAAA,qDAAC,SAAI,WAAU,0DACb;AAAA,sDAAC,QAAG,WAAU,qDACX,iBACH;AAAA,UACA;AAAA,YAAC,YAAAA;AAAA,YAAA;AAAA,cACC;AAAA,cACA,WAAU;AAAA,cACX;AAAA;AAAA,gBAEC,4CAAC,kCAAW,WAAU,WAAU;AAAA;AAAA;AAAA,UAClC;AAAA,WACF;AAAA,QACA,4CAAC,SAAI,WAAU,aAAa,UAAS;AAAA;AAAA;AAAA,EACvC;AAEJ;","names":["Link"]}

package/dist/components/portfolio-section.d.cts

@@ -0,0 +1,18 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+type PortfolioSectionColor = "blue" | "purple" | "rose" | "orange" | "maeve" | "navy";
+interface PortfolioSectionProps {
+    title: string;
+    href: string;
+    /** Which brand color accents this section's hairline border. */
+    color?: PortfolioSectionColor;
+    /** "default" sits in the grid alongside its siblings; "wide" spans the
+     * full row instead — for list-like content (e.g. Activity) that reads
+     * better edge-to-edge than column-width. */
+    size?: "default" | "wide";
+    children: React.ReactNode;
+    className?: string;
+}
+declare function PortfolioSection({ title, href, color, size, children, className, }: PortfolioSectionProps): react_jsx_runtime.JSX.Element;
+
+export { PortfolioSection, type PortfolioSectionColor, type PortfolioSectionProps };

package/dist/components/portfolio-section.d.ts

@@ -0,0 +1,18 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+type PortfolioSectionColor = "blue" | "purple" | "rose" | "orange" | "maeve" | "navy";
+interface PortfolioSectionProps {
+    title: string;
+    href: string;
+    /** Which brand color accents this section's hairline border. */
+    color?: PortfolioSectionColor;
+    /** "default" sits in the grid alongside its siblings; "wide" spans the
+     * full row instead — for list-like content (e.g. Activity) that reads
+     * better edge-to-edge than column-width. */
+    size?: "default" | "wide";
+    children: React.ReactNode;
+    className?: string;
+}
+declare function PortfolioSection({ title, href, color, size, children, className, }: PortfolioSectionProps): react_jsx_runtime.JSX.Element;
+
+export { PortfolioSection, type PortfolioSectionColor, type PortfolioSectionProps };

package/dist/components/{portfolio-bento-tile.js → portfolio-section.js}

@@ -3,9 +3,18 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import Link from "next/link";
 import { ArrowRight } from "lucide-react";
 import { cn } from "../utils/cn.js";
-function PortfolioBentoTile({
+const BORDER_BY_COLOR = {
+  blue: "border-brand-blue/40",
+  purple: "border-brand-purple/40",
+  rose: "border-brand-rose/40",
+  orange: "border-brand-orange/40",
+  maeve: "border-brand-maeve/40",
+  navy: "border-brand-navy/40"
+};
+function PortfolioSection({
   title,
   href,
+  color = "purple",
   size = "default",
   children,
   className
@@ -14,13 +23,13 @@ function PortfolioBentoTile({
     "section",
     {
       className: cn(
-        "rounded-2xl bg-foreground/[0.04] min-w-0 transition-colors hover:bg-foreground/[0.07]",
-        "mb-4 break-inside-avoid",
-        size === "wide" && "[column-span:all]",
+        "rounded-2xl border min-w-0",
+        BORDER_BY_COLOR[color],
+        size === "wide" && "sm:col-span-2 lg:col-span-3",
         className
       ),
       children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 px-4 pt-4 pb-3", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 px-5 pt-5 pb-3", children: [
           /* @__PURE__ */ jsx("h2", { className: "text-sm font-black text-foreground tracking-tight", children: title }),
           /* @__PURE__ */ jsxs(
             Link,
@@ -34,12 +43,12 @@ function PortfolioBentoTile({
             }
           )
         ] }),
-        /* @__PURE__ */ jsx("div", { className: "px-4 pb-4", children })
+        /* @__PURE__ */ jsx("div", { className: "px-5 pb-5", children })
       ]
     }
   );
 }
 export {
-  PortfolioBentoTile
+  PortfolioSection
 };
-//# sourceMappingURL=portfolio-bento-tile.js.map
+//# sourceMappingURL=portfolio-section.js.map

package/dist/components/portfolio-section.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/portfolio-section.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport { ArrowRight } from \"lucide-react\";\nimport { cn } from \"../utils/cn.js\";\n\nexport type PortfolioSectionColor =\n  | \"blue\"\n  | \"purple\"\n  | \"rose\"\n  | \"orange\"\n  | \"maeve\"\n  | \"navy\";\n\nconst BORDER_BY_COLOR: Record<PortfolioSectionColor, string> = {\n  blue: \"border-brand-blue/40\",\n  purple: \"border-brand-purple/40\",\n  rose: \"border-brand-rose/40\",\n  orange: \"border-brand-orange/40\",\n  maeve: \"border-brand-maeve/40\",\n  navy: \"border-brand-navy/40\",\n};\n\nexport interface PortfolioSectionProps {\n  title: string;\n  href: string;\n\n  /** Which brand color accents this section's hairline border. */\n  color?: PortfolioSectionColor;\n\n  /** \"default\" sits in the grid alongside its siblings; \"wide\" spans the\n   * full row instead — for list-like content (e.g. Activity) that reads\n   * better edge-to-edge than column-width. */\n  size?: \"default\" | \"wide\";\n  children: React.ReactNode;\n  className?: string;\n}\n\nexport function PortfolioSection({\n  title,\n  href,\n  color = \"purple\",\n  size = \"default\",\n  children,\n  className,\n}: PortfolioSectionProps) {\n  return (\n    <section\n      className={cn(\n        \"rounded-2xl border min-w-0\",\n        BORDER_BY_COLOR[color],\n        size === \"wide\" && \"sm:col-span-2 lg:col-span-3\",\n        className,\n      )}\n    >\n      <div className=\"flex items-center justify-between gap-3 px-5 pt-5 pb-3\">\n        <h2 className=\"text-sm font-black text-foreground tracking-tight\">\n          {title}\n        </h2>\n        <Link\n          href={href}\n          className=\"inline-flex items-center gap-1 text-xs font-medium text-muted-foreground hover:text-foreground transition-colors\"\n        >\n          See all\n          <ArrowRight className=\"h-3 w-3\" />\n        </Link>\n      </div>\n      <div className=\"px-5 pb-5\">{children}</div>\n    </section>\n  );\n}\n"],"mappings":";AAwDQ,cAGA,YAHA;AAtDR,OAAO,UAAU;AACjB,SAAS,kBAAkB;AAC3B,SAAS,UAAU;AAUnB,MAAM,kBAAyD;AAAA,EAC7D,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,MAAM;AACR;AAiBO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,OAAO;AAAA,EACP;AAAA,EACA;AACF,GAA0B;AACxB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,gBAAgB,KAAK;AAAA,QACrB,SAAS,UAAU;AAAA,QACnB;AAAA,MACF;AAAA,MAEA;AAAA,6BAAC,SAAI,WAAU,0DACb;AAAA,8BAAC,QAAG,WAAU,qDACX,iBACH;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA,WAAU;AAAA,cACX;AAAA;AAAA,gBAEC,oBAAC,cAAW,WAAU,WAAU;AAAA;AAAA;AAAA,UAClC;AAAA,WACF;AAAA,QACA,oBAAC,SAAI,WAAU,aAAa,UAAS;AAAA;AAAA;AAAA,EACvC;AAEJ;","names":[]}

package/dist/components/{community-rewards-section.cjs → rewards-section.cjs}

@@ -27,63 +27,49 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var community_rewards_section_exports = {};
-__export(community_rewards_section_exports, {
-  CommunityRewardsSection: () => CommunityRewardsSection
+var rewards_section_exports = {};
+__export(rewards_section_exports, {
+  RewardsSection: () => RewardsSection
 });
-module.exports = __toCommonJS(community_rewards_section_exports);
+module.exports = __toCommonJS(rewards_section_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_link = __toESM(require("next/link"), 1);
 var import_lucide_react = require("lucide-react");
-const steps = [
+const pillars = [
   {
-    icon: import_lucide_react.PenLine,
-    label: "Create or trade",
-    detail: "Mint, license, or sell IP on Medialane."
+    icon: import_lucide_react.Zap,
+    label: "XP",
+    detail: "Earned for every mint, trade, and connection you make."
   },
   {
-    icon: import_lucide_react.TrendingUp,
-    label: "Earn a share",
-    detail: "Every action grows your standing in the pool."
+    icon: import_lucide_react.Coins,
+    label: "Creator's Fund",
+    detail: "Your XP grows your share of the shared pool."
   },
   {
     icon: import_lucide_react.Gift,
-    label: "Claim each round",
-    detail: "Your share is yours to claim, on-chain."
+    label: "Airdrop",
+    detail: "Claim your share on-chain, every round."
   }
 ];
-function CommunityRewardsSection({ rewardsHref, airdropHref }) {
+function RewardsSection({ rewardsHref }) {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "rounded-2xl p-[1.5px] bg-gradient-to-r from-brand-orange to-brand-maeve", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("section", { className: "rounded-[15px] bg-background px-7 py-8 sm:px-9", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col lg:flex-row lg:items-center gap-8 lg:gap-14", children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex-1 min-w-0", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-xs font-bold uppercase tracking-widest text-brand-maeve", children: "Creator's Fund" }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { className: "mt-4 text-2xl font-bold tracking-tight leading-tight", children: "How it works" }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mt-1.5 text-sm text-muted-foreground leading-relaxed max-w-lg", children: "A share of what Medialane earns is set aside in one public wallet and shared back with the people creating and trading here \u2014 the more you do, the bigger your share, every round." }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "mt-7 flex flex-wrap items-center gap-x-6 gap-y-3", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-          import_link.default,
-          {
-            href: rewardsHref,
-            className: "inline-flex items-center gap-1.5 text-sm font-semibold text-foreground hover:text-brand-maeve transition-colors",
-            children: [
-              "See your rewards",
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ArrowRight, { className: "h-3.5 w-3.5" })
-            ]
-          }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-          import_link.default,
-          {
-            href: airdropHref,
-            className: "inline-flex items-center gap-1.5 text-sm font-semibold text-muted-foreground hover:text-foreground transition-colors",
-            children: [
-              "How the fund works",
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ArrowRight, { className: "h-3.5 w-3.5" })
-            ]
-          }
-        )
-      ] })
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { className: "text-2xl sm:text-3xl font-bold tracking-tight leading-tight text-foreground", children: "Rewards" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mt-2 text-sm text-muted-foreground leading-relaxed max-w-md", children: "Every action earns XP. Active members receive a growing share of the Creator's Fund, claimed as an airdrop each round." }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        import_link.default,
+        {
+          href: rewardsHref,
+          className: "mt-6 inline-flex items-center justify-center gap-2 rounded-xl bg-gradient-to-r from-brand-orange to-brand-maeve px-6 py-3 text-sm font-semibold text-white transition-all hover:brightness-110 active:scale-[0.98]",
+          children: [
+            "View your rewards",
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ArrowRight, { className: "h-4 w-4" })
+          ]
+        }
+      )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex flex-col gap-4 lg:w-[300px] shrink-0 lg:border-l lg:border-border lg:pl-10", children: steps.map(({ icon: Icon, label, detail }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-start gap-3.5", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex flex-col gap-4 lg:w-[300px] shrink-0 lg:border-l lg:border-border lg:pl-10", children: pillars.map(({ icon: Icon, label, detail }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-start gap-3.5", children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex h-9 w-9 items-center justify-center rounded-lg bg-gradient-to-br from-brand-orange/15 to-brand-maeve/15 text-brand-maeve shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, { className: "h-4 w-4" }) }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "min-w-0", children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm font-semibold text-foreground", children: label }),
@@ -94,6 +80,6 @@ function CommunityRewardsSection({ rewardsHref, airdropHref }) {
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  CommunityRewardsSection
+  RewardsSection
 });
-//# sourceMappingURL=community-rewards-section.cjs.map
+//# sourceMappingURL=rewards-section.cjs.map

package/dist/components/rewards-section.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/rewards-section.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport { ArrowRight, Zap, Coins, Gift } from \"lucide-react\";\n\nexport interface RewardsSectionProps {\n  rewardsHref: string;\n}\n\nconst pillars = [\n  {\n    icon: Zap,\n    label: \"XP\",\n    detail: \"Earned for every mint, trade, and connection you make.\",\n  },\n  {\n    icon: Coins,\n    label: \"Creator's Fund\",\n    detail: \"Your XP grows your share of the shared pool.\",\n  },\n  {\n    icon: Gift,\n    label: \"Airdrop\",\n    detail: \"Claim your share on-chain, every round.\",\n  },\n];\n\nexport function RewardsSection({ rewardsHref }: RewardsSectionProps) {\n  return (\n    <div className=\"rounded-2xl p-[1.5px] bg-gradient-to-r from-brand-orange to-brand-maeve\">\n      <section className=\"rounded-[15px] bg-background px-7 py-8 sm:px-9\">\n        <div className=\"flex flex-col lg:flex-row lg:items-center gap-8 lg:gap-14\">\n          <div className=\"flex-1 min-w-0\">\n            <h2 className=\"text-2xl sm:text-3xl font-bold tracking-tight leading-tight text-foreground\">\n              Rewards\n            </h2>\n            <p className=\"mt-2 text-sm text-muted-foreground leading-relaxed max-w-md\">\n              Every action earns XP. Active members receive a growing share of the\n              Creator&apos;s Fund, claimed as an airdrop each round.\n            </p>\n\n            <Link\n              href={rewardsHref}\n              className=\"mt-6 inline-flex items-center justify-center gap-2 rounded-xl bg-gradient-to-r from-brand-orange to-brand-maeve px-6 py-3 text-sm font-semibold text-white transition-all hover:brightness-110 active:scale-[0.98]\"\n            >\n              View your rewards\n              <ArrowRight className=\"h-4 w-4\" />\n            </Link>\n          </div>\n\n          <div className=\"flex flex-col gap-4 lg:w-[300px] shrink-0 lg:border-l lg:border-border lg:pl-10\">\n            {pillars.map(({ icon: Icon, label, detail }) => (\n              <div key={label} className=\"flex items-start gap-3.5\">\n                <div className=\"flex h-9 w-9 items-center justify-center rounded-lg bg-gradient-to-br from-brand-orange/15 to-brand-maeve/15 text-brand-maeve shrink-0\">\n                  <Icon className=\"h-4 w-4\" />\n                </div>\n                <div className=\"min-w-0\">\n                  <p className=\"text-sm font-semibold text-foreground\">{label}</p>\n                  <p className=\"text-xs text-muted-foreground leading-relaxed\">{detail}</p>\n                </div>\n              </div>\n            ))}\n          </div>\n        </div>\n      </section>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAiCY;AA/BZ,kBAAiB;AACjB,0BAA6C;AAM7C,MAAM,UAAU;AAAA,EACd;AAAA,IACE,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,EACV;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,EACV;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,EACV;AACF;AAEO,SAAS,eAAe,EAAE,YAAY,GAAwB;AACnE,SACE,4CAAC,SAAI,WAAU,2EACb,sDAAC,aAAQ,WAAU,kDACjB,uDAAC,SAAI,WAAU,6DACb;AAAA,iDAAC,SAAI,WAAU,kBACb;AAAA,kDAAC,QAAG,WAAU,+EAA8E,qBAE5F;AAAA,MACA,4CAAC,OAAE,WAAU,+DAA8D,oIAG3E;AAAA,MAEA;AAAA,QAAC,YAAAA;AAAA,QAAA;AAAA,UACC,MAAM;AAAA,UACN,WAAU;AAAA,UACX;AAAA;AAAA,YAEC,4CAAC,kCAAW,WAAU,WAAU;AAAA;AAAA;AAAA,MAClC;AAAA,OACF;AAAA,IAEA,4CAAC,SAAI,WAAU,mFACZ,kBAAQ,IAAI,CAAC,EAAE,MAAM,MAAM,OAAO,OAAO,MACxC,6CAAC,SAAgB,WAAU,4BACzB;AAAA,kDAAC,SAAI,WAAU,0IACb,sDAAC,QAAK,WAAU,WAAU,GAC5B;AAAA,MACA,6CAAC,SAAI,WAAU,WACb;AAAA,oDAAC,OAAE,WAAU,yCAAyC,iBAAM;AAAA,QAC5D,4CAAC,OAAE,WAAU,iDAAiD,kBAAO;AAAA,SACvE;AAAA,SAPQ,KAQV,CACD,GACH;AAAA,KACF,GACF,GACF;AAEJ;","names":["Link"]}

package/dist/components/rewards-section.d.cts

@@ -0,0 +1,8 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface RewardsSectionProps {
+    rewardsHref: string;
+}
+declare function RewardsSection({ rewardsHref }: RewardsSectionProps): react_jsx_runtime.JSX.Element;
+
+export { RewardsSection, type RewardsSectionProps };

package/dist/components/rewards-section.d.ts

@@ -0,0 +1,8 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface RewardsSectionProps {
+    rewardsHref: string;
+}
+declare function RewardsSection({ rewardsHref }: RewardsSectionProps): react_jsx_runtime.JSX.Element;
+
+export { RewardsSection, type RewardsSectionProps };

package/dist/components/rewards-section.js

@@ -0,0 +1,51 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import Link from "next/link";
+import { ArrowRight, Zap, Coins, Gift } from "lucide-react";
+const pillars = [
+  {
+    icon: Zap,
+    label: "XP",
+    detail: "Earned for every mint, trade, and connection you make."
+  },
+  {
+    icon: Coins,
+    label: "Creator's Fund",
+    detail: "Your XP grows your share of the shared pool."
+  },
+  {
+    icon: Gift,
+    label: "Airdrop",
+    detail: "Claim your share on-chain, every round."
+  }
+];
+function RewardsSection({ rewardsHref }) {
+  return /* @__PURE__ */ jsx("div", { className: "rounded-2xl p-[1.5px] bg-gradient-to-r from-brand-orange to-brand-maeve", children: /* @__PURE__ */ jsx("section", { className: "rounded-[15px] bg-background px-7 py-8 sm:px-9", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col lg:flex-row lg:items-center gap-8 lg:gap-14", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+      /* @__PURE__ */ jsx("h2", { className: "text-2xl sm:text-3xl font-bold tracking-tight leading-tight text-foreground", children: "Rewards" }),
+      /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-muted-foreground leading-relaxed max-w-md", children: "Every action earns XP. Active members receive a growing share of the Creator's Fund, claimed as an airdrop each round." }),
+      /* @__PURE__ */ jsxs(
+        Link,
+        {
+          href: rewardsHref,
+          className: "mt-6 inline-flex items-center justify-center gap-2 rounded-xl bg-gradient-to-r from-brand-orange to-brand-maeve px-6 py-3 text-sm font-semibold text-white transition-all hover:brightness-110 active:scale-[0.98]",
+          children: [
+            "View your rewards",
+            /* @__PURE__ */ jsx(ArrowRight, { className: "h-4 w-4" })
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-4 lg:w-[300px] shrink-0 lg:border-l lg:border-border lg:pl-10", children: pillars.map(({ icon: Icon, label, detail }) => /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3.5", children: [
+      /* @__PURE__ */ jsx("div", { className: "flex h-9 w-9 items-center justify-center rounded-lg bg-gradient-to-br from-brand-orange/15 to-brand-maeve/15 text-brand-maeve shrink-0", children: /* @__PURE__ */ jsx(Icon, { className: "h-4 w-4" }) }),
+      /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+        /* @__PURE__ */ jsx("p", { className: "text-sm font-semibold text-foreground", children: label }),
+        /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground leading-relaxed", children: detail })
+      ] })
+    ] }, label)) })
+  ] }) }) });
+}
+export {
+  RewardsSection
+};
+//# sourceMappingURL=rewards-section.js.map

package/dist/components/rewards-section.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/rewards-section.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport { ArrowRight, Zap, Coins, Gift } from \"lucide-react\";\n\nexport interface RewardsSectionProps {\n  rewardsHref: string;\n}\n\nconst pillars = [\n  {\n    icon: Zap,\n    label: \"XP\",\n    detail: \"Earned for every mint, trade, and connection you make.\",\n  },\n  {\n    icon: Coins,\n    label: \"Creator's Fund\",\n    detail: \"Your XP grows your share of the shared pool.\",\n  },\n  {\n    icon: Gift,\n    label: \"Airdrop\",\n    detail: \"Claim your share on-chain, every round.\",\n  },\n];\n\nexport function RewardsSection({ rewardsHref }: RewardsSectionProps) {\n  return (\n    <div className=\"rounded-2xl p-[1.5px] bg-gradient-to-r from-brand-orange to-brand-maeve\">\n      <section className=\"rounded-[15px] bg-background px-7 py-8 sm:px-9\">\n        <div className=\"flex flex-col lg:flex-row lg:items-center gap-8 lg:gap-14\">\n          <div className=\"flex-1 min-w-0\">\n            <h2 className=\"text-2xl sm:text-3xl font-bold tracking-tight leading-tight text-foreground\">\n              Rewards\n            </h2>\n            <p className=\"mt-2 text-sm text-muted-foreground leading-relaxed max-w-md\">\n              Every action earns XP. Active members receive a growing share of the\n              Creator&apos;s Fund, claimed as an airdrop each round.\n            </p>\n\n            <Link\n              href={rewardsHref}\n              className=\"mt-6 inline-flex items-center justify-center gap-2 rounded-xl bg-gradient-to-r from-brand-orange to-brand-maeve px-6 py-3 text-sm font-semibold text-white transition-all hover:brightness-110 active:scale-[0.98]\"\n            >\n              View your rewards\n              <ArrowRight className=\"h-4 w-4\" />\n            </Link>\n          </div>\n\n          <div className=\"flex flex-col gap-4 lg:w-[300px] shrink-0 lg:border-l lg:border-border lg:pl-10\">\n            {pillars.map(({ icon: Icon, label, detail }) => (\n              <div key={label} className=\"flex items-start gap-3.5\">\n                <div className=\"flex h-9 w-9 items-center justify-center rounded-lg bg-gradient-to-br from-brand-orange/15 to-brand-maeve/15 text-brand-maeve shrink-0\">\n                  <Icon className=\"h-4 w-4\" />\n                </div>\n                <div className=\"min-w-0\">\n                  <p className=\"text-sm font-semibold text-foreground\">{label}</p>\n                  <p className=\"text-xs text-muted-foreground leading-relaxed\">{detail}</p>\n                </div>\n              </div>\n            ))}\n          </div>\n        </div>\n      </section>\n    </div>\n  );\n}\n"],"mappings":";AAiCY,cAQA,YARA;AA/BZ,OAAO,UAAU;AACjB,SAAS,YAAY,KAAK,OAAO,YAAY;AAM7C,MAAM,UAAU;AAAA,EACd;AAAA,IACE,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,EACV;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,EACV;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,EACV;AACF;AAEO,SAAS,eAAe,EAAE,YAAY,GAAwB;AACnE,SACE,oBAAC,SAAI,WAAU,2EACb,8BAAC,aAAQ,WAAU,kDACjB,+BAAC,SAAI,WAAU,6DACb;AAAA,yBAAC,SAAI,WAAU,kBACb;AAAA,0BAAC,QAAG,WAAU,+EAA8E,qBAE5F;AAAA,MACA,oBAAC,OAAE,WAAU,+DAA8D,oIAG3E;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,MAAM;AAAA,UACN,WAAU;AAAA,UACX;AAAA;AAAA,YAEC,oBAAC,cAAW,WAAU,WAAU;AAAA;AAAA;AAAA,MAClC;AAAA,OACF;AAAA,IAEA,oBAAC,SAAI,WAAU,mFACZ,kBAAQ,IAAI,CAAC,EAAE,MAAM,MAAM,OAAO,OAAO,MACxC,qBAAC,SAAgB,WAAU,4BACzB;AAAA,0BAAC,SAAI,WAAU,0IACb,8BAAC,QAAK,WAAU,WAAU,GAC5B;AAAA,MACA,qBAAC,SAAI,WAAU,WACb;AAAA,4BAAC,OAAE,WAAU,yCAAyC,iBAAM;AAAA,QAC5D,oBAAC,OAAE,WAAU,iDAAiD,kBAAO;AAAA,SACvE;AAAA,SAPQ,KAQV,CACD,GACH;AAAA,KACF,GACF,GACF;AAEJ;","names":[]}

package/dist/index.cjs

@@ -78,9 +78,7 @@ __export(index_exports, {
   CollectionFiltersTrigger: () => import_collection_filters.CollectionFiltersTrigger,
   CollectionHeroBanner: () => import_collection_hero_banner.CollectionHeroBanner,
   CollectionTraitsTab: () => import_collection_traits_tab.CollectionTraitsTab,
-  CommunityRewardsSection: () => import_community_rewards_section.CommunityRewardsSection,
   CreationRecord: () => import_creation_record.CreationRecord,
-  CreatorAirdropBanner: () => import_creator_airdrop_banner.CreatorAirdropBanner,
   CreatorAnalytics: () => import_creator_analytics.CreatorAnalytics,
   CreatorChip: () => import_creator_chip.CreatorChip,
   CreatorScoreInline: () => import_creator_score_inline.CreatorScoreInline,
@@ -193,13 +191,14 @@ __export(index_exports, {
   PopoverContent: () => import_popover.PopoverContent,
   PopoverTrigger: () => import_popover.PopoverTrigger,
   PortfolioActivity: () => import_portfolio_activity.PortfolioActivity,
-  PortfolioBentoTile: () => import_portfolio_bento_tile.PortfolioBentoTile,
   PortfolioChipFilter: () => import_portfolio_chip_filter.PortfolioChipFilter,
   PortfolioHeader: () => import_portfolio_header.PortfolioHeader,
-  PortfolioOverview: () => import_portfolio_overview.PortfolioOverview,
+  PortfolioSection: () => import_portfolio_section.PortfolioSection,
+  PortfolioSectionGrid: () => import_portfolio_section_grid.PortfolioSectionGrid,
   PriceHistoryChart: () => import_price_history_chart.PriceHistoryChart,
   QUERY_PREFIX: () => import_query_keys.QUERY_PREFIX,
   RemixesTab: () => import_remixes_tab.RemixesTab,
+  RewardsSection: () => import_rewards_section.RewardsSection,
   SERVICE_HUES: () => import_launchpad_services.SERVICE_HUES,
   SOCIAL_PLATFORM_META: () => import_ip_templates.SOCIAL_PLATFORM_META,
   SORT_OPTIONS: () => import_collection_filters.SORT_OPTIONS,
@@ -382,9 +381,9 @@ var import_launchpad_services2 = require("./data/launchpad-services.js");
 var import_nav_command_menu = require("./components/nav-command-menu.js");
 var import_nav_shell = require("./components/nav-shell.js");
 var import_portfolio_header = require("./components/portfolio-header.js");
-var import_portfolio_overview = require("./components/portfolio-overview.js");
+var import_portfolio_section_grid = require("./components/portfolio-section-grid.js");
 var import_portfolio_counts = require("./utils/portfolio-counts.js");
-var import_portfolio_bento_tile = require("./components/portfolio-bento-tile.js");
+var import_portfolio_section = require("./components/portfolio-section.js");
 var import_portfolio_chip_filter = require("./components/portfolio-chip-filter.js");
 var import_service_header = require("./components/service-header.js");
 var import_claim_rail = require("./components/claim-rail.js");
@@ -400,8 +399,7 @@ var import_badge_catalog = require("./components/rewards/badge-catalog.js");
 var import_xp_toast_content = require("./components/rewards/xp-toast-content.js");
 var import_reward_toast = require("./components/rewards/reward-toast.js");
 var import_load_more_sentinel = require("./components/load-more-sentinel.js");
-var import_community_rewards_section = require("./components/community-rewards-section.js");
-var import_creator_airdrop_banner = require("./components/creator-airdrop-banner.js");
+var import_rewards_section = require("./components/rewards-section.js");
 var import_action_button = require("./components/action-button.js");
 var import_gradient_button = require("./components/gradient-button.js");
 var import_coin_launch_preview = require("./components/coin-launch-preview.js");
@@ -527,9 +525,7 @@ var import_dialog = require("./components/dialog.js");
   CollectionFiltersTrigger,
   CollectionHeroBanner,
   CollectionTraitsTab,
-  CommunityRewardsSection,
   CreationRecord,
-  CreatorAirdropBanner,
   CreatorAnalytics,
   CreatorChip,
   CreatorScoreInline,
@@ -642,13 +638,14 @@ var import_dialog = require("./components/dialog.js");
   PopoverContent,
   PopoverTrigger,
   PortfolioActivity,
-  PortfolioBentoTile,
   PortfolioChipFilter,
   PortfolioHeader,
-  PortfolioOverview,
+  PortfolioSection,
+  PortfolioSectionGrid,
   PriceHistoryChart,
   QUERY_PREFIX,
   RemixesTab,
+  RewardsSection,
   SERVICE_HUES,
   SOCIAL_PLATFORM_META,
   SORT_OPTIONS,