@medialane/ui 0.100.1 → 0.101.0

package/dist/components/portfolio-chip-filter.cjs

@@ -37,7 +37,7 @@ var import_link = __toESM(require("next/link"), 1);
 var import_cn = require("../utils/cn.js");
 const CHIP_CLASS = "shrink-0 rounded-full px-3.5 py-1.5 text-sm whitespace-nowrap transition-colors border";
 const INACTIVE_CLASS = "bg-muted border-border/60 text-muted-foreground hover:text-foreground hover:border-border";
-const ACTIVE_CLASS = "bg-primary border-primary text-primary-foreground font-medium";
+const ACTIVE_CLASS = "bg-gradient-to-r from-brand-purple to-brand-orange border-transparent text-white font-bold";
 function PortfolioChipFilter({
   options,
   value,

package/dist/components/portfolio-chip-filter.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/portfolio-chip-filter.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport { cn } from \"../utils/cn.js\";\n\nexport interface PortfolioChipFilterOption {\n  key: string;\n  label: string;\n  /**\n   * When set, this chip is a direct navigation link rather than an in-page\n   * filter. It's marked active when `href` equals the current `value`\n   * (pass the current pathname as `value` for a location-aware nav bar).\n   */\n  href?: string;\n}\n\nexport interface PortfolioChipFilterProps {\n  options: PortfolioChipFilterOption[];\n  /** Selected filter key, or the current pathname when used for navigation. */\n  value: string;\n  onChange: (key: string) => void;\n  /** Suppress the auto-injected \"All\" chip — for pure navigation bars where every option already has an href. Default true. */\n  showAll?: boolean;\n  className?: string;\n}\n\nconst CHIP_CLASS =\n  \"shrink-0 rounded-full px-3.5 py-1.5 text-sm whitespace-nowrap transition-colors border\";\nconst INACTIVE_CLASS = \"bg-muted border-border/60 text-muted-foreground hover:text-foreground hover:border-border\";\nconst ACTIVE_CLASS = \"bg-primary border-primary text-primary-foreground font-medium\";\n\n/**\n * Horizontally-scrollable chip row — the portfolio section's sole\n * navigation mechanism (Instagram/YouTube-style chips), used both as an\n * in-page filter (chips with no `href`, toggled via `onChange`) and as\n * cross-page navigation (chips with `href`, highlighted active by matching\n * `value` against the current pathname).\n */\nexport function PortfolioChipFilter({\n  options,\n  value,\n  onChange,\n  showAll = true,\n  className,\n}: PortfolioChipFilterProps) {\n  const items = showAll ? [{ key: \"all\", label: \"All\" }, ...options] : options;\n\n  return (\n    <div\n      className={cn(\n        \"flex items-center gap-1.5 overflow-x-auto scrollbar-hide -mx-4 px-4 sm:-mx-6 sm:px-6 lg:-mx-8 lg:px-8\",\n        className,\n      )}\n    >\n      {items.map((item) =>\n        item.href ? (\n          <Link\n            key={item.key}\n            href={item.href}\n            className={cn(CHIP_CLASS, item.href === value ? ACTIVE_CLASS : INACTIVE_CLASS)}\n          >\n            {item.label}\n          </Link>\n        ) : (\n          <button\n            key={item.key}\n            type=\"button\"\n            onClick={() => onChange(item.key)}\n            className={cn(CHIP_CLASS, item.key === value ? ACTIVE_CLASS : INACTIVE_CLASS)}\n          >\n            {item.label}\n          </button>\n        ),\n      )}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAwDU;AAtDV,kBAAiB;AACjB,gBAAmB;AAuBnB,MAAM,aACJ;AACF,MAAM,iBAAiB;AACvB,MAAM,eAAe;AASd,SAAS,oBAAoB;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AACF,GAA6B;AAC3B,QAAM,QAAQ,UAAU,CAAC,EAAE,KAAK,OAAO,OAAO,MAAM,GAAG,GAAG,OAAO,IAAI;AAErE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAEC,gBAAM;AAAA,QAAI,CAAC,SACV,KAAK,OACH;AAAA,UAAC,YAAAA;AAAA,UAAA;AAAA,YAEC,MAAM,KAAK;AAAA,YACX,eAAW,cAAG,YAAY,KAAK,SAAS,QAAQ,eAAe,cAAc;AAAA,YAE5E,eAAK;AAAA;AAAA,UAJD,KAAK;AAAA,QAKZ,IAEA;AAAA,UAAC;AAAA;AAAA,YAEC,MAAK;AAAA,YACL,SAAS,MAAM,SAAS,KAAK,GAAG;AAAA,YAChC,eAAW,cAAG,YAAY,KAAK,QAAQ,QAAQ,eAAe,cAAc;AAAA,YAE3E,eAAK;AAAA;AAAA,UALD,KAAK;AAAA,QAMZ;AAAA,MAEJ;AAAA;AAAA,EACF;AAEJ;","names":["Link"]}
+{"version":3,"sources":["../../src/components/portfolio-chip-filter.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport { cn } from \"../utils/cn.js\";\n\nexport interface PortfolioChipFilterOption {\n  key: string;\n  label: string;\n  /**\n   * When set, this chip is a direct navigation link rather than an in-page\n   * filter. It's marked active when `href` equals the current `value`\n   * (pass the current pathname as `value` for a location-aware nav bar).\n   */\n  href?: string;\n}\n\nexport interface PortfolioChipFilterProps {\n  options: PortfolioChipFilterOption[];\n  /** Selected filter key, or the current pathname when used for navigation. */\n  value: string;\n  onChange: (key: string) => void;\n  /** Suppress the auto-injected \"All\" chip — for pure navigation bars where every option already has an href. Default true. */\n  showAll?: boolean;\n  className?: string;\n}\n\nconst CHIP_CLASS =\n  \"shrink-0 rounded-full px-3.5 py-1.5 text-sm whitespace-nowrap transition-colors border\";\nconst INACTIVE_CLASS = \"bg-muted border-border/60 text-muted-foreground hover:text-foreground hover:border-border\";\nconst ACTIVE_CLASS = \"bg-gradient-to-r from-brand-purple to-brand-orange border-transparent text-white font-bold\";\n\n/**\n * Horizontally-scrollable chip row — the portfolio section's sole\n * navigation mechanism (Instagram/YouTube-style chips), used both as an\n * in-page filter (chips with no `href`, toggled via `onChange`) and as\n * cross-page navigation (chips with `href`, highlighted active by matching\n * `value` against the current pathname).\n */\nexport function PortfolioChipFilter({\n  options,\n  value,\n  onChange,\n  showAll = true,\n  className,\n}: PortfolioChipFilterProps) {\n  const items = showAll ? [{ key: \"all\", label: \"All\" }, ...options] : options;\n\n  return (\n    <div\n      className={cn(\n        \"flex items-center gap-1.5 overflow-x-auto scrollbar-hide -mx-4 px-4 sm:-mx-6 sm:px-6 lg:-mx-8 lg:px-8\",\n        className,\n      )}\n    >\n      {items.map((item) =>\n        item.href ? (\n          <Link\n            key={item.key}\n            href={item.href}\n            className={cn(CHIP_CLASS, item.href === value ? ACTIVE_CLASS : INACTIVE_CLASS)}\n          >\n            {item.label}\n          </Link>\n        ) : (\n          <button\n            key={item.key}\n            type=\"button\"\n            onClick={() => onChange(item.key)}\n            className={cn(CHIP_CLASS, item.key === value ? ACTIVE_CLASS : INACTIVE_CLASS)}\n          >\n            {item.label}\n          </button>\n        ),\n      )}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAwDU;AAtDV,kBAAiB;AACjB,gBAAmB;AAuBnB,MAAM,aACJ;AACF,MAAM,iBAAiB;AACvB,MAAM,eAAe;AASd,SAAS,oBAAoB;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AACF,GAA6B;AAC3B,QAAM,QAAQ,UAAU,CAAC,EAAE,KAAK,OAAO,OAAO,MAAM,GAAG,GAAG,OAAO,IAAI;AAErE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAEC,gBAAM;AAAA,QAAI,CAAC,SACV,KAAK,OACH;AAAA,UAAC,YAAAA;AAAA,UAAA;AAAA,YAEC,MAAM,KAAK;AAAA,YACX,eAAW,cAAG,YAAY,KAAK,SAAS,QAAQ,eAAe,cAAc;AAAA,YAE5E,eAAK;AAAA;AAAA,UAJD,KAAK;AAAA,QAKZ,IAEA;AAAA,UAAC;AAAA;AAAA,YAEC,MAAK;AAAA,YACL,SAAS,MAAM,SAAS,KAAK,GAAG;AAAA,YAChC,eAAW,cAAG,YAAY,KAAK,QAAQ,QAAQ,eAAe,cAAc;AAAA,YAE3E,eAAK;AAAA;AAAA,UALD,KAAK;AAAA,QAMZ;AAAA,MAEJ;AAAA;AAAA,EACF;AAEJ;","names":["Link"]}

package/dist/components/portfolio-chip-filter.js

@@ -4,7 +4,7 @@ import Link from "next/link";
 import { cn } from "../utils/cn.js";
 const CHIP_CLASS = "shrink-0 rounded-full px-3.5 py-1.5 text-sm whitespace-nowrap transition-colors border";
 const INACTIVE_CLASS = "bg-muted border-border/60 text-muted-foreground hover:text-foreground hover:border-border";
-const ACTIVE_CLASS = "bg-primary border-primary text-primary-foreground font-medium";
+const ACTIVE_CLASS = "bg-gradient-to-r from-brand-purple to-brand-orange border-transparent text-white font-bold";
 function PortfolioChipFilter({
   options,
   value,

package/dist/components/portfolio-chip-filter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/portfolio-chip-filter.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport { cn } from \"../utils/cn.js\";\n\nexport interface PortfolioChipFilterOption {\n  key: string;\n  label: string;\n  /**\n   * When set, this chip is a direct navigation link rather than an in-page\n   * filter. It's marked active when `href` equals the current `value`\n   * (pass the current pathname as `value` for a location-aware nav bar).\n   */\n  href?: string;\n}\n\nexport interface PortfolioChipFilterProps {\n  options: PortfolioChipFilterOption[];\n  /** Selected filter key, or the current pathname when used for navigation. */\n  value: string;\n  onChange: (key: string) => void;\n  /** Suppress the auto-injected \"All\" chip — for pure navigation bars where every option already has an href. Default true. */\n  showAll?: boolean;\n  className?: string;\n}\n\nconst CHIP_CLASS =\n  \"shrink-0 rounded-full px-3.5 py-1.5 text-sm whitespace-nowrap transition-colors border\";\nconst INACTIVE_CLASS = \"bg-muted border-border/60 text-muted-foreground hover:text-foreground hover:border-border\";\nconst ACTIVE_CLASS = \"bg-primary border-primary text-primary-foreground font-medium\";\n\n/**\n * Horizontally-scrollable chip row — the portfolio section's sole\n * navigation mechanism (Instagram/YouTube-style chips), used both as an\n * in-page filter (chips with no `href`, toggled via `onChange`) and as\n * cross-page navigation (chips with `href`, highlighted active by matching\n * `value` against the current pathname).\n */\nexport function PortfolioChipFilter({\n  options,\n  value,\n  onChange,\n  showAll = true,\n  className,\n}: PortfolioChipFilterProps) {\n  const items = showAll ? [{ key: \"all\", label: \"All\" }, ...options] : options;\n\n  return (\n    <div\n      className={cn(\n        \"flex items-center gap-1.5 overflow-x-auto scrollbar-hide -mx-4 px-4 sm:-mx-6 sm:px-6 lg:-mx-8 lg:px-8\",\n        className,\n      )}\n    >\n      {items.map((item) =>\n        item.href ? (\n          <Link\n            key={item.key}\n            href={item.href}\n            className={cn(CHIP_CLASS, item.href === value ? ACTIVE_CLASS : INACTIVE_CLASS)}\n          >\n            {item.label}\n          </Link>\n        ) : (\n          <button\n            key={item.key}\n            type=\"button\"\n            onClick={() => onChange(item.key)}\n            className={cn(CHIP_CLASS, item.key === value ? ACTIVE_CLASS : INACTIVE_CLASS)}\n          >\n            {item.label}\n          </button>\n        ),\n      )}\n    </div>\n  );\n}\n"],"mappings":";AAwDU;AAtDV,OAAO,UAAU;AACjB,SAAS,UAAU;AAuBnB,MAAM,aACJ;AACF,MAAM,iBAAiB;AACvB,MAAM,eAAe;AASd,SAAS,oBAAoB;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AACF,GAA6B;AAC3B,QAAM,QAAQ,UAAU,CAAC,EAAE,KAAK,OAAO,OAAO,MAAM,GAAG,GAAG,OAAO,IAAI;AAErE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAEC,gBAAM;AAAA,QAAI,CAAC,SACV,KAAK,OACH;AAAA,UAAC;AAAA;AAAA,YAEC,MAAM,KAAK;AAAA,YACX,WAAW,GAAG,YAAY,KAAK,SAAS,QAAQ,eAAe,cAAc;AAAA,YAE5E,eAAK;AAAA;AAAA,UAJD,KAAK;AAAA,QAKZ,IAEA;AAAA,UAAC;AAAA;AAAA,YAEC,MAAK;AAAA,YACL,SAAS,MAAM,SAAS,KAAK,GAAG;AAAA,YAChC,WAAW,GAAG,YAAY,KAAK,QAAQ,QAAQ,eAAe,cAAc;AAAA,YAE3E,eAAK;AAAA;AAAA,UALD,KAAK;AAAA,QAMZ;AAAA,MAEJ;AAAA;AAAA,EACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/components/portfolio-chip-filter.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport { cn } from \"../utils/cn.js\";\n\nexport interface PortfolioChipFilterOption {\n  key: string;\n  label: string;\n  /**\n   * When set, this chip is a direct navigation link rather than an in-page\n   * filter. It's marked active when `href` equals the current `value`\n   * (pass the current pathname as `value` for a location-aware nav bar).\n   */\n  href?: string;\n}\n\nexport interface PortfolioChipFilterProps {\n  options: PortfolioChipFilterOption[];\n  /** Selected filter key, or the current pathname when used for navigation. */\n  value: string;\n  onChange: (key: string) => void;\n  /** Suppress the auto-injected \"All\" chip — for pure navigation bars where every option already has an href. Default true. */\n  showAll?: boolean;\n  className?: string;\n}\n\nconst CHIP_CLASS =\n  \"shrink-0 rounded-full px-3.5 py-1.5 text-sm whitespace-nowrap transition-colors border\";\nconst INACTIVE_CLASS = \"bg-muted border-border/60 text-muted-foreground hover:text-foreground hover:border-border\";\nconst ACTIVE_CLASS = \"bg-gradient-to-r from-brand-purple to-brand-orange border-transparent text-white font-bold\";\n\n/**\n * Horizontally-scrollable chip row — the portfolio section's sole\n * navigation mechanism (Instagram/YouTube-style chips), used both as an\n * in-page filter (chips with no `href`, toggled via `onChange`) and as\n * cross-page navigation (chips with `href`, highlighted active by matching\n * `value` against the current pathname).\n */\nexport function PortfolioChipFilter({\n  options,\n  value,\n  onChange,\n  showAll = true,\n  className,\n}: PortfolioChipFilterProps) {\n  const items = showAll ? [{ key: \"all\", label: \"All\" }, ...options] : options;\n\n  return (\n    <div\n      className={cn(\n        \"flex items-center gap-1.5 overflow-x-auto scrollbar-hide -mx-4 px-4 sm:-mx-6 sm:px-6 lg:-mx-8 lg:px-8\",\n        className,\n      )}\n    >\n      {items.map((item) =>\n        item.href ? (\n          <Link\n            key={item.key}\n            href={item.href}\n            className={cn(CHIP_CLASS, item.href === value ? ACTIVE_CLASS : INACTIVE_CLASS)}\n          >\n            {item.label}\n          </Link>\n        ) : (\n          <button\n            key={item.key}\n            type=\"button\"\n            onClick={() => onChange(item.key)}\n            className={cn(CHIP_CLASS, item.key === value ? ACTIVE_CLASS : INACTIVE_CLASS)}\n          >\n            {item.label}\n          </button>\n        ),\n      )}\n    </div>\n  );\n}\n"],"mappings":";AAwDU;AAtDV,OAAO,UAAU;AACjB,SAAS,UAAU;AAuBnB,MAAM,aACJ;AACF,MAAM,iBAAiB;AACvB,MAAM,eAAe;AASd,SAAS,oBAAoB;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AACF,GAA6B;AAC3B,QAAM,QAAQ,UAAU,CAAC,EAAE,KAAK,OAAO,OAAO,MAAM,GAAG,GAAG,OAAO,IAAI;AAErE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAEC,gBAAM;AAAA,QAAI,CAAC,SACV,KAAK,OACH;AAAA,UAAC;AAAA;AAAA,YAEC,MAAM,KAAK;AAAA,YACX,WAAW,GAAG,YAAY,KAAK,SAAS,QAAQ,eAAe,cAAc;AAAA,YAE5E,eAAK;AAAA;AAAA,UAJD,KAAK;AAAA,QAKZ,IAEA;AAAA,UAAC;AAAA;AAAA,YAEC,MAAK;AAAA,YACL,SAAS,MAAM,SAAS,KAAK,GAAG;AAAA,YAChC,WAAW,GAAG,YAAY,KAAK,QAAQ,QAAQ,eAAe,cAAc;AAAA,YAE3E,eAAK;AAAA;AAAA,UALD,KAAK;AAAA,QAMZ;AAAA,MAEJ;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/dist/components/portfolio-header.cjs

@@ -41,13 +41,13 @@ function PortfolioHeader({
   score,
   className
 }) {
-  const scoreChip = score && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "btn-border-animated p-[1.5px] rounded-full", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "rounded-full bg-card px-3.5 py-1.5 flex items-baseline gap-2 whitespace-nowrap", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-sm font-semibold text-foreground", children: score.levelName }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "text-xs text-muted-foreground tabular-nums", children: [
+  const scoreChip = score && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "rounded-full bg-gradient-to-r from-brand-purple to-brand-orange px-3.5 py-1.5 flex items-baseline gap-2 whitespace-nowrap text-white", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-sm font-bold", children: score.levelName }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "text-xs font-medium text-white/80 tabular-nums", children: [
       score.totalXp.toLocaleString(),
       " XP"
     ] })
-  ] }) });
+  ] });
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: (0, import_cn.cn)("flex items-center justify-between gap-4", className), children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "min-w-0", children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs font-medium text-muted-foreground", children: "Portfolio" }),
@@ -56,7 +56,7 @@ function PortfolioHeader({
         {
           address,
           chars: 6,
-          className: "text-xl font-bold tracking-tight text-foreground"
+          className: "text-2xl sm:text-3xl font-black tracking-tight text-foreground"
         }
       )
     ] }),

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/portfolio-header.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport { cn } from \"../utils/cn.js\";\nimport { AddressDisplay } from \"./address-display.js\";\n\nexport interface PortfolioHeaderScore {\n  /** Journey level name (\"Starter\", \"Explorer\", …) — no numeric level shown. */\n  levelName: string;\n  totalXp: number;\n  /** Where the score chip links (\"/rewards\"). */\n  href?: string;\n}\n\nexport interface PortfolioHeaderProps {\n  address: string;\n  score?: PortfolioHeaderScore | null;\n  className?: string;\n}\n\n/**\n * Portfolio identity header: the address as a real page title (no generic\n * gradient/avatar element — there's no profile data to lead with, and a\n * placeholder gradient mark isn't the answer), with the rewards journey\n * chip alongside it.\n */\nexport function PortfolioHeader({\n  address,\n  score,\n  className,\n}: PortfolioHeaderProps) {\n  const scoreChip = score && (\n    <div className=\"btn-border-animated p-[1.5px] rounded-full\">\n      <div className=\"rounded-full bg-card px-3.5 py-1.5 flex items-baseline gap-2 whitespace-nowrap\">\n        <span className=\"text-sm font-semibold text-foreground\">\n          {score.levelName}\n        </span>\n        <span className=\"text-xs text-muted-foreground tabular-nums\">\n          {score.totalXp.toLocaleString()} XP\n        </span>\n      </div>\n    </div>\n  );\n\n  return (\n    <div className={cn(\"flex items-center justify-between gap-4\", className)}>\n      <div className=\"min-w-0\">\n        <p className=\"text-xs font-medium text-muted-foreground\">\n          Portfolio\n        </p>\n        <AddressDisplay\n          address={address}\n          chars={6}\n          className=\"text-xl font-bold tracking-tight text-foreground\"\n        />\n      </div>\n      {score?.href ? (\n        <Link href={score.href} className=\"shrink-0 active:opacity-80\">\n          {scoreChip}\n        </Link>\n      ) : (\n        <div className=\"shrink-0\">{scoreChip}</div>\n      )}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAkCQ;AAhCR,kBAAiB;AACjB,gBAAmB;AACnB,6BAA+B;AAsBxB,SAAS,gBAAgB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AACF,GAAyB;AACvB,QAAM,YAAY,SAChB,4CAAC,SAAI,WAAU,8CACb,uDAAC,SAAI,WAAU,kFACb;AAAA,gDAAC,UAAK,WAAU,yCACb,gBAAM,WACT;AAAA,IACA,6CAAC,UAAK,WAAU,8CACb;AAAA,YAAM,QAAQ,eAAe;AAAA,MAAE;AAAA,OAClC;AAAA,KACF,GACF;AAGF,SACE,6CAAC,SAAI,eAAW,cAAG,2CAA2C,SAAS,GACrE;AAAA,iDAAC,SAAI,WAAU,WACb;AAAA,kDAAC,OAAE,WAAU,6CAA4C,uBAEzD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,OAAO;AAAA,UACP,WAAU;AAAA;AAAA,MACZ;AAAA,OACF;AAAA,IACC,OAAO,OACN,4CAAC,YAAAA,SAAA,EAAK,MAAM,MAAM,MAAM,WAAU,8BAC/B,qBACH,IAEA,4CAAC,SAAI,WAAU,YAAY,qBAAU;AAAA,KAEzC;AAEJ;","names":["Link"]}
+{"version":3,"sources":["../../src/components/portfolio-header.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport { cn } from \"../utils/cn.js\";\nimport { AddressDisplay } from \"./address-display.js\";\n\nexport interface PortfolioHeaderScore {\n  /** Journey level name (\"Starter\", \"Explorer\", …) — no numeric level shown. */\n  levelName: string;\n  totalXp: number;\n  /** Where the score chip links (\"/rewards\"). */\n  href?: string;\n}\n\nexport interface PortfolioHeaderProps {\n  address: string;\n  score?: PortfolioHeaderScore | null;\n  className?: string;\n}\n\n/**\n * Portfolio identity header: the address as a real page title (no generic\n * gradient/avatar element — there's no profile data to lead with, and a\n * placeholder gradient mark isn't the answer), with the rewards journey\n * chip alongside it.\n */\nexport function PortfolioHeader({\n  address,\n  score,\n  className,\n}: PortfolioHeaderProps) {\n  const scoreChip = score && (\n    <div className=\"rounded-full bg-gradient-to-r from-brand-purple to-brand-orange px-3.5 py-1.5 flex items-baseline gap-2 whitespace-nowrap text-white\">\n      <span className=\"text-sm font-bold\">\n        {score.levelName}\n      </span>\n      <span className=\"text-xs font-medium text-white/80 tabular-nums\">\n        {score.totalXp.toLocaleString()} XP\n      </span>\n    </div>\n  );\n\n  return (\n    <div className={cn(\"flex items-center justify-between gap-4\", className)}>\n      <div className=\"min-w-0\">\n        <p className=\"text-xs font-medium text-muted-foreground\">\n          Portfolio\n        </p>\n        <AddressDisplay\n          address={address}\n          chars={6}\n          className=\"text-2xl sm:text-3xl font-black tracking-tight text-foreground\"\n        />\n      </div>\n      {score?.href ? (\n        <Link href={score.href} className=\"shrink-0 active:opacity-80\">\n          {scoreChip}\n        </Link>\n      ) : (\n        <div className=\"shrink-0\">{scoreChip}</div>\n      )}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAiCM;AA/BN,kBAAiB;AACjB,gBAAmB;AACnB,6BAA+B;AAsBxB,SAAS,gBAAgB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AACF,GAAyB;AACvB,QAAM,YAAY,SAChB,6CAAC,SAAI,WAAU,wIACb;AAAA,gDAAC,UAAK,WAAU,qBACb,gBAAM,WACT;AAAA,IACA,6CAAC,UAAK,WAAU,kDACb;AAAA,YAAM,QAAQ,eAAe;AAAA,MAAE;AAAA,OAClC;AAAA,KACF;AAGF,SACE,6CAAC,SAAI,eAAW,cAAG,2CAA2C,SAAS,GACrE;AAAA,iDAAC,SAAI,WAAU,WACb;AAAA,kDAAC,OAAE,WAAU,6CAA4C,uBAEzD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,OAAO;AAAA,UACP,WAAU;AAAA;AAAA,MACZ;AAAA,OACF;AAAA,IACC,OAAO,OACN,4CAAC,YAAAA,SAAA,EAAK,MAAM,MAAM,MAAM,WAAU,8BAC/B,qBACH,IAEA,4CAAC,SAAI,WAAU,YAAY,qBAAU;AAAA,KAEzC;AAEJ;","names":["Link"]}

package/dist/components/portfolio-header.js

@@ -8,13 +8,13 @@ function PortfolioHeader({
   score,
   className
 }) {
-  const scoreChip = score && /* @__PURE__ */ jsx("div", { className: "btn-border-animated p-[1.5px] rounded-full", children: /* @__PURE__ */ jsxs("div", { className: "rounded-full bg-card px-3.5 py-1.5 flex items-baseline gap-2 whitespace-nowrap", children: [
-    /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold text-foreground", children: score.levelName }),
-    /* @__PURE__ */ jsxs("span", { className: "text-xs text-muted-foreground tabular-nums", children: [
+  const scoreChip = score && /* @__PURE__ */ jsxs("div", { className: "rounded-full bg-gradient-to-r from-brand-purple to-brand-orange px-3.5 py-1.5 flex items-baseline gap-2 whitespace-nowrap text-white", children: [
+    /* @__PURE__ */ jsx("span", { className: "text-sm font-bold", children: score.levelName }),
+    /* @__PURE__ */ jsxs("span", { className: "text-xs font-medium text-white/80 tabular-nums", children: [
       score.totalXp.toLocaleString(),
       " XP"
     ] })
-  ] }) });
+  ] });
   return /* @__PURE__ */ jsxs("div", { className: cn("flex items-center justify-between gap-4", className), children: [
     /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
       /* @__PURE__ */ jsx("p", { className: "text-xs font-medium text-muted-foreground", children: "Portfolio" }),
@@ -23,7 +23,7 @@ function PortfolioHeader({
         {
           address,
           chars: 6,
-          className: "text-xl font-bold tracking-tight text-foreground"
+          className: "text-2xl sm:text-3xl font-black tracking-tight text-foreground"
         }
       )
     ] }),

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/portfolio-header.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport { cn } from \"../utils/cn.js\";\nimport { AddressDisplay } from \"./address-display.js\";\n\nexport interface PortfolioHeaderScore {\n  /** Journey level name (\"Starter\", \"Explorer\", …) — no numeric level shown. */\n  levelName: string;\n  totalXp: number;\n  /** Where the score chip links (\"/rewards\"). */\n  href?: string;\n}\n\nexport interface PortfolioHeaderProps {\n  address: string;\n  score?: PortfolioHeaderScore | null;\n  className?: string;\n}\n\n/**\n * Portfolio identity header: the address as a real page title (no generic\n * gradient/avatar element — there's no profile data to lead with, and a\n * placeholder gradient mark isn't the answer), with the rewards journey\n * chip alongside it.\n */\nexport function PortfolioHeader({\n  address,\n  score,\n  className,\n}: PortfolioHeaderProps) {\n  const scoreChip = score && (\n    <div className=\"btn-border-animated p-[1.5px] rounded-full\">\n      <div className=\"rounded-full bg-card px-3.5 py-1.5 flex items-baseline gap-2 whitespace-nowrap\">\n        <span className=\"text-sm font-semibold text-foreground\">\n          {score.levelName}\n        </span>\n        <span className=\"text-xs text-muted-foreground tabular-nums\">\n          {score.totalXp.toLocaleString()} XP\n        </span>\n      </div>\n    </div>\n  );\n\n  return (\n    <div className={cn(\"flex items-center justify-between gap-4\", className)}>\n      <div className=\"min-w-0\">\n        <p className=\"text-xs font-medium text-muted-foreground\">\n          Portfolio\n        </p>\n        <AddressDisplay\n          address={address}\n          chars={6}\n          className=\"text-xl font-bold tracking-tight text-foreground\"\n        />\n      </div>\n      {score?.href ? (\n        <Link href={score.href} className=\"shrink-0 active:opacity-80\">\n          {scoreChip}\n        </Link>\n      ) : (\n        <div className=\"shrink-0\">{scoreChip}</div>\n      )}\n    </div>\n  );\n}\n"],"mappings":";AAkCQ,cAGA,YAHA;AAhCR,OAAO,UAAU;AACjB,SAAS,UAAU;AACnB,SAAS,sBAAsB;AAsBxB,SAAS,gBAAgB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AACF,GAAyB;AACvB,QAAM,YAAY,SAChB,oBAAC,SAAI,WAAU,8CACb,+BAAC,SAAI,WAAU,kFACb;AAAA,wBAAC,UAAK,WAAU,yCACb,gBAAM,WACT;AAAA,IACA,qBAAC,UAAK,WAAU,8CACb;AAAA,YAAM,QAAQ,eAAe;AAAA,MAAE;AAAA,OAClC;AAAA,KACF,GACF;AAGF,SACE,qBAAC,SAAI,WAAW,GAAG,2CAA2C,SAAS,GACrE;AAAA,yBAAC,SAAI,WAAU,WACb;AAAA,0BAAC,OAAE,WAAU,6CAA4C,uBAEzD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,OAAO;AAAA,UACP,WAAU;AAAA;AAAA,MACZ;AAAA,OACF;AAAA,IACC,OAAO,OACN,oBAAC,QAAK,MAAM,MAAM,MAAM,WAAU,8BAC/B,qBACH,IAEA,oBAAC,SAAI,WAAU,YAAY,qBAAU;AAAA,KAEzC;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/components/portfolio-header.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport { cn } from \"../utils/cn.js\";\nimport { AddressDisplay } from \"./address-display.js\";\n\nexport interface PortfolioHeaderScore {\n  /** Journey level name (\"Starter\", \"Explorer\", …) — no numeric level shown. */\n  levelName: string;\n  totalXp: number;\n  /** Where the score chip links (\"/rewards\"). */\n  href?: string;\n}\n\nexport interface PortfolioHeaderProps {\n  address: string;\n  score?: PortfolioHeaderScore | null;\n  className?: string;\n}\n\n/**\n * Portfolio identity header: the address as a real page title (no generic\n * gradient/avatar element — there's no profile data to lead with, and a\n * placeholder gradient mark isn't the answer), with the rewards journey\n * chip alongside it.\n */\nexport function PortfolioHeader({\n  address,\n  score,\n  className,\n}: PortfolioHeaderProps) {\n  const scoreChip = score && (\n    <div className=\"rounded-full bg-gradient-to-r from-brand-purple to-brand-orange px-3.5 py-1.5 flex items-baseline gap-2 whitespace-nowrap text-white\">\n      <span className=\"text-sm font-bold\">\n        {score.levelName}\n      </span>\n      <span className=\"text-xs font-medium text-white/80 tabular-nums\">\n        {score.totalXp.toLocaleString()} XP\n      </span>\n    </div>\n  );\n\n  return (\n    <div className={cn(\"flex items-center justify-between gap-4\", className)}>\n      <div className=\"min-w-0\">\n        <p className=\"text-xs font-medium text-muted-foreground\">\n          Portfolio\n        </p>\n        <AddressDisplay\n          address={address}\n          chars={6}\n          className=\"text-2xl sm:text-3xl font-black tracking-tight text-foreground\"\n        />\n      </div>\n      {score?.href ? (\n        <Link href={score.href} className=\"shrink-0 active:opacity-80\">\n          {scoreChip}\n        </Link>\n      ) : (\n        <div className=\"shrink-0\">{scoreChip}</div>\n      )}\n    </div>\n  );\n}\n"],"mappings":";AAiCM,cAGA,YAHA;AA/BN,OAAO,UAAU;AACjB,SAAS,UAAU;AACnB,SAAS,sBAAsB;AAsBxB,SAAS,gBAAgB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AACF,GAAyB;AACvB,QAAM,YAAY,SAChB,qBAAC,SAAI,WAAU,wIACb;AAAA,wBAAC,UAAK,WAAU,qBACb,gBAAM,WACT;AAAA,IACA,qBAAC,UAAK,WAAU,kDACb;AAAA,YAAM,QAAQ,eAAe;AAAA,MAAE;AAAA,OAClC;AAAA,KACF;AAGF,SACE,qBAAC,SAAI,WAAW,GAAG,2CAA2C,SAAS,GACrE;AAAA,yBAAC,SAAI,WAAU,WACb;AAAA,0BAAC,OAAE,WAAU,6CAA4C,uBAEzD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,OAAO;AAAA,UACP,WAAU;AAAA;AAAA,MACZ;AAAA,OACF;AAAA,IACC,OAAO,OACN,oBAAC,QAAK,MAAM,MAAM,MAAM,WAAU,8BAC/B,qBACH,IAEA,oBAAC,SAAI,WAAU,YAAY,qBAAU;AAAA,KAEzC;AAEJ;","names":[]}

package/dist/components/rewards/badge-catalog.cjs

@@ -0,0 +1,49 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var badge_catalog_exports = {};
+__export(badge_catalog_exports, {
+  BadgeCatalog: () => BadgeCatalog
+});
+module.exports = __toCommonJS(badge_catalog_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_cn = require("../../utils/cn.js");
+var import_badge_shelf = require("./badge-shelf.js");
+const CATEGORY_LABELS = {
+  creator: "Creator",
+  collector: "Collector",
+  community: "Community"
+};
+function BadgeCatalog({ badges, className }) {
+  const categories = [...new Set(badges.map((b) => b.category))];
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: (0, import_cn.cn)("space-y-8", className), children: categories.map((cat) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm font-black uppercase tracking-wide text-foreground/50", children: CATEGORY_LABELS[cat] ?? cat }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3", children: badges.filter((b) => b.category === cat).map((badge) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-3 rounded-2xl bg-foreground/[0.04] p-4", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "flex h-10 w-10 items-center justify-center rounded-xl shrink-0 bg-gradient-to-br from-brand-orange to-brand-maeve", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_badge_shelf.BadgeIcon, { name: badge.icon, color: "#ffffff", className: "h-5 w-5" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "min-w-0", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm font-bold", children: badge.name }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs text-foreground/60 truncate", children: badge.description })
+      ] })
+    ] }, badge.key)) })
+  ] }, cat)) });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  BadgeCatalog
+});
+//# sourceMappingURL=badge-catalog.cjs.map

package/dist/components/rewards/badge-catalog.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/rewards/badge-catalog.tsx"],"sourcesContent":["import { cn } from \"../../utils/cn.js\";\nimport { BadgeIcon } from \"./badge-shelf.js\";\n\nexport interface BadgeCatalogBadge {\n  key: string;\n  name: string;\n  description: string;\n  icon: string;\n  color: string;\n  category: string;\n}\n\nexport interface BadgeCatalogProps {\n  badges: BadgeCatalogBadge[];\n  className?: string;\n}\n\nconst CATEGORY_LABELS: Record<string, string> = {\n  creator: \"Creator\",\n  collector: \"Collector\",\n  community: \"Community\",\n};\n\n/** Full badge catalog, grouped by category — \"what's achievable,\" not\n *  \"what you've done\" (no earned/locked state; that's BadgeShelf's job on\n *  /rewards, which stays exactly as-is for the viewer's own progress).\n *  Groups render in whatever categories are actually present in the data,\n *  not a hardcoded list — new categories show up automatically. */\nexport function BadgeCatalog({ badges, className }: BadgeCatalogProps) {\n  const categories = [...new Set(badges.map((b) => b.category))];\n\n  return (\n    <div className={cn(\"space-y-8\", className)}>\n      {categories.map((cat) => (\n        <div key={cat} className=\"space-y-3\">\n          <p className=\"text-sm font-black uppercase tracking-wide text-foreground/50\">\n            {CATEGORY_LABELS[cat] ?? cat}\n          </p>\n          <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-3\">\n            {badges\n              .filter((b) => b.category === cat)\n              .map((badge) => (\n                <div key={badge.key} className=\"flex items-center gap-3 rounded-2xl bg-foreground/[0.04] p-4\">\n                  <span className=\"flex h-10 w-10 items-center justify-center rounded-xl shrink-0 bg-gradient-to-br from-brand-orange to-brand-maeve\">\n                    <BadgeIcon name={badge.icon} color=\"#ffffff\" className=\"h-5 w-5\" />\n                  </span>\n                  <div className=\"min-w-0\">\n                    <p className=\"text-sm font-bold\">{badge.name}</p>\n                    <p className=\"text-xs text-foreground/60 truncate\">{badge.description}</p>\n                  </div>\n                </div>\n              ))}\n          </div>\n        </div>\n      ))}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAmCU;AAnCV,gBAAmB;AACnB,yBAA0B;AAgB1B,MAAM,kBAA0C;AAAA,EAC9C,SAAS;AAAA,EACT,WAAW;AAAA,EACX,WAAW;AACb;AAOO,SAAS,aAAa,EAAE,QAAQ,UAAU,GAAsB;AACrE,QAAM,aAAa,CAAC,GAAG,IAAI,IAAI,OAAO,IAAI,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;AAE7D,SACE,4CAAC,SAAI,eAAW,cAAG,aAAa,SAAS,GACtC,qBAAW,IAAI,CAAC,QACf,6CAAC,SAAc,WAAU,aACvB;AAAA,gDAAC,OAAE,WAAU,iEACV,0BAAgB,GAAG,KAAK,KAC3B;AAAA,IACA,4CAAC,SAAI,WAAU,yCACZ,iBACE,OAAO,CAAC,MAAM,EAAE,aAAa,GAAG,EAChC,IAAI,CAAC,UACJ,6CAAC,SAAoB,WAAU,gEAC7B;AAAA,kDAAC,UAAK,WAAU,qHACd,sDAAC,gCAAU,MAAM,MAAM,MAAM,OAAM,WAAU,WAAU,WAAU,GACnE;AAAA,MACA,6CAAC,SAAI,WAAU,WACb;AAAA,oDAAC,OAAE,WAAU,qBAAqB,gBAAM,MAAK;AAAA,QAC7C,4CAAC,OAAE,WAAU,uCAAuC,gBAAM,aAAY;AAAA,SACxE;AAAA,SAPQ,MAAM,GAQhB,CACD,GACL;AAAA,OAlBQ,GAmBV,CACD,GACH;AAEJ;","names":[]}

package/dist/components/rewards/badge-catalog.d.cts

@@ -0,0 +1,22 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface BadgeCatalogBadge {
+    key: string;
+    name: string;
+    description: string;
+    icon: string;
+    color: string;
+    category: string;
+}
+interface BadgeCatalogProps {
+    badges: BadgeCatalogBadge[];
+    className?: string;
+}
+/** Full badge catalog, grouped by category — "what's achievable," not
+ *  "what you've done" (no earned/locked state; that's BadgeShelf's job on
+ *  /rewards, which stays exactly as-is for the viewer's own progress).
+ *  Groups render in whatever categories are actually present in the data,
+ *  not a hardcoded list — new categories show up automatically. */
+declare function BadgeCatalog({ badges, className }: BadgeCatalogProps): react_jsx_runtime.JSX.Element;
+
+export { BadgeCatalog, type BadgeCatalogBadge, type BadgeCatalogProps };

package/dist/components/rewards/badge-catalog.d.ts

@@ -0,0 +1,22 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface BadgeCatalogBadge {
+    key: string;
+    name: string;
+    description: string;
+    icon: string;
+    color: string;
+    category: string;
+}
+interface BadgeCatalogProps {
+    badges: BadgeCatalogBadge[];
+    className?: string;
+}
+/** Full badge catalog, grouped by category — "what's achievable," not
+ *  "what you've done" (no earned/locked state; that's BadgeShelf's job on
+ *  /rewards, which stays exactly as-is for the viewer's own progress).
+ *  Groups render in whatever categories are actually present in the data,
+ *  not a hardcoded list — new categories show up automatically. */
+declare function BadgeCatalog({ badges, className }: BadgeCatalogProps): react_jsx_runtime.JSX.Element;
+
+export { BadgeCatalog, type BadgeCatalogBadge, type BadgeCatalogProps };

package/dist/components/rewards/badge-catalog.js

@@ -0,0 +1,25 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "../../utils/cn.js";
+import { BadgeIcon } from "./badge-shelf.js";
+const CATEGORY_LABELS = {
+  creator: "Creator",
+  collector: "Collector",
+  community: "Community"
+};
+function BadgeCatalog({ badges, className }) {
+  const categories = [...new Set(badges.map((b) => b.category))];
+  return /* @__PURE__ */ jsx("div", { className: cn("space-y-8", className), children: categories.map((cat) => /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+    /* @__PURE__ */ jsx("p", { className: "text-sm font-black uppercase tracking-wide text-foreground/50", children: CATEGORY_LABELS[cat] ?? cat }),
+    /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3", children: badges.filter((b) => b.category === cat).map((badge) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 rounded-2xl bg-foreground/[0.04] p-4", children: [
+      /* @__PURE__ */ jsx("span", { className: "flex h-10 w-10 items-center justify-center rounded-xl shrink-0 bg-gradient-to-br from-brand-orange to-brand-maeve", children: /* @__PURE__ */ jsx(BadgeIcon, { name: badge.icon, color: "#ffffff", className: "h-5 w-5" }) }),
+      /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+        /* @__PURE__ */ jsx("p", { className: "text-sm font-bold", children: badge.name }),
+        /* @__PURE__ */ jsx("p", { className: "text-xs text-foreground/60 truncate", children: badge.description })
+      ] })
+    ] }, badge.key)) })
+  ] }, cat)) });
+}
+export {
+  BadgeCatalog
+};
+//# sourceMappingURL=badge-catalog.js.map

package/dist/components/rewards/badge-catalog.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/rewards/badge-catalog.tsx"],"sourcesContent":["import { cn } from \"../../utils/cn.js\";\nimport { BadgeIcon } from \"./badge-shelf.js\";\n\nexport interface BadgeCatalogBadge {\n  key: string;\n  name: string;\n  description: string;\n  icon: string;\n  color: string;\n  category: string;\n}\n\nexport interface BadgeCatalogProps {\n  badges: BadgeCatalogBadge[];\n  className?: string;\n}\n\nconst CATEGORY_LABELS: Record<string, string> = {\n  creator: \"Creator\",\n  collector: \"Collector\",\n  community: \"Community\",\n};\n\n/** Full badge catalog, grouped by category — \"what's achievable,\" not\n *  \"what you've done\" (no earned/locked state; that's BadgeShelf's job on\n *  /rewards, which stays exactly as-is for the viewer's own progress).\n *  Groups render in whatever categories are actually present in the data,\n *  not a hardcoded list — new categories show up automatically. */\nexport function BadgeCatalog({ badges, className }: BadgeCatalogProps) {\n  const categories = [...new Set(badges.map((b) => b.category))];\n\n  return (\n    <div className={cn(\"space-y-8\", className)}>\n      {categories.map((cat) => (\n        <div key={cat} className=\"space-y-3\">\n          <p className=\"text-sm font-black uppercase tracking-wide text-foreground/50\">\n            {CATEGORY_LABELS[cat] ?? cat}\n          </p>\n          <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-3\">\n            {badges\n              .filter((b) => b.category === cat)\n              .map((badge) => (\n                <div key={badge.key} className=\"flex items-center gap-3 rounded-2xl bg-foreground/[0.04] p-4\">\n                  <span className=\"flex h-10 w-10 items-center justify-center rounded-xl shrink-0 bg-gradient-to-br from-brand-orange to-brand-maeve\">\n                    <BadgeIcon name={badge.icon} color=\"#ffffff\" className=\"h-5 w-5\" />\n                  </span>\n                  <div className=\"min-w-0\">\n                    <p className=\"text-sm font-bold\">{badge.name}</p>\n                    <p className=\"text-xs text-foreground/60 truncate\">{badge.description}</p>\n                  </div>\n                </div>\n              ))}\n          </div>\n        </div>\n      ))}\n    </div>\n  );\n}\n"],"mappings":"AAmCU,cAWQ,YAXR;AAnCV,SAAS,UAAU;AACnB,SAAS,iBAAiB;AAgB1B,MAAM,kBAA0C;AAAA,EAC9C,SAAS;AAAA,EACT,WAAW;AAAA,EACX,WAAW;AACb;AAOO,SAAS,aAAa,EAAE,QAAQ,UAAU,GAAsB;AACrE,QAAM,aAAa,CAAC,GAAG,IAAI,IAAI,OAAO,IAAI,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;AAE7D,SACE,oBAAC,SAAI,WAAW,GAAG,aAAa,SAAS,GACtC,qBAAW,IAAI,CAAC,QACf,qBAAC,SAAc,WAAU,aACvB;AAAA,wBAAC,OAAE,WAAU,iEACV,0BAAgB,GAAG,KAAK,KAC3B;AAAA,IACA,oBAAC,SAAI,WAAU,yCACZ,iBACE,OAAO,CAAC,MAAM,EAAE,aAAa,GAAG,EAChC,IAAI,CAAC,UACJ,qBAAC,SAAoB,WAAU,gEAC7B;AAAA,0BAAC,UAAK,WAAU,qHACd,8BAAC,aAAU,MAAM,MAAM,MAAM,OAAM,WAAU,WAAU,WAAU,GACnE;AAAA,MACA,qBAAC,SAAI,WAAU,WACb;AAAA,4BAAC,OAAE,WAAU,qBAAqB,gBAAM,MAAK;AAAA,QAC7C,oBAAC,OAAE,WAAU,uCAAuC,gBAAM,aAAY;AAAA,SACxE;AAAA,SAPQ,MAAM,GAQhB,CACD,GACL;AAAA,OAlBQ,GAmBV,CACD,GACH;AAEJ;","names":[]}

package/dist/components/rewards/level-badge.cjs

@@ -23,31 +23,22 @@ __export(level_badge_exports, {
 module.exports = __toCommonJS(level_badge_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_cn = require("../../utils/cn.js");
-function LevelBadge({ level, name, badgeColor, size = "md", className }) {
+function LevelBadge({ level, name, size = "md", className }) {
   const sizeClasses = {
-    sm: "h-5 px-1.5 gap-1 text-2xs",
-    md: "h-6 px-2 gap-1.5 text-xs",
-    lg: "h-8 px-3 gap-2 text-sm"
+    sm: "h-5 px-2.5 text-2xs",
+    md: "h-6 px-3 text-xs",
+    lg: "h-8 px-4 text-sm"
   };
-  const dotSizes = {
-    sm: "h-1.5 w-1.5",
-    md: "h-2 w-2",
-    lg: "h-2.5 w-2.5"
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "span",
     {
       title: `Level ${level}`,
       className: (0, import_cn.cn)(
-        "inline-flex items-center rounded-full border font-semibold tracking-tight whitespace-nowrap",
+        "inline-flex items-center rounded-full font-bold tracking-tight whitespace-nowrap text-white bg-gradient-to-r from-brand-orange to-brand-maeve",
         sizeClasses[size],
         className
       ),
-      style: { borderColor: `${badgeColor}60`, backgroundColor: `${badgeColor}18`, color: badgeColor },
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_cn.cn)("rounded-full shrink-0", dotSizes[size]), style: { backgroundColor: badgeColor } }),
-        name
-      ]
+      children: name
     }
   );
 }

package/dist/components/rewards/level-badge.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/rewards/level-badge.tsx"],"sourcesContent":["import { cn } from \"../../utils/cn.js\";\n\nexport interface LevelBadgeProps {\n  level: number;\n  name: string;\n  badgeColor: string;\n  size?: \"sm\" | \"md\" | \"lg\";\n  className?: string;\n}\n\n/** Color-coded level chip — shows the level's title only (\"Voyager\"), not\n *  the raw number (\"Lv.6 Voyager\" read as UI noise). The level is still\n *  available on hover via the native title tooltip. Pure presentation — the\n *  consuming app supplies level data from the rewards API. */\nexport function LevelBadge({ level, name, badgeColor, size = \"md\", className }: LevelBadgeProps) {\n  const sizeClasses = {\n    sm: \"h-5 px-1.5 gap-1 text-2xs\",\n    md: \"h-6 px-2 gap-1.5 text-xs\",\n    lg: \"h-8 px-3 gap-2 text-sm\",\n  };\n\n  const dotSizes = {\n    sm: \"h-1.5 w-1.5\",\n    md: \"h-2 w-2\",\n    lg: \"h-2.5 w-2.5\",\n  };\n\n  return (\n    <span\n      title={`Level ${level}`}\n      className={cn(\n        \"inline-flex items-center rounded-full border font-semibold tracking-tight whitespace-nowrap\",\n        sizeClasses[size],\n        className\n      )}\n      style={{ borderColor: `${badgeColor}60`, backgroundColor: `${badgeColor}18`, color: badgeColor }}\n    >\n      <span className={cn(\"rounded-full shrink-0\", dotSizes[size])} style={{ backgroundColor: badgeColor }} />\n      {name}\n    </span>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA4BI;AA5BJ,gBAAmB;AAcZ,SAAS,WAAW,EAAE,OAAO,MAAM,YAAY,OAAO,MAAM,UAAU,GAAoB;AAC/F,QAAM,cAAc;AAAA,IAClB,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AAEA,QAAM,WAAW;AAAA,IACf,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,SAAS,KAAK;AAAA,MACrB,eAAW;AAAA,QACT;AAAA,QACA,YAAY,IAAI;AAAA,QAChB;AAAA,MACF;AAAA,MACA,OAAO,EAAE,aAAa,GAAG,UAAU,MAAM,iBAAiB,GAAG,UAAU,MAAM,OAAO,WAAW;AAAA,MAE/F;AAAA,oDAAC,UAAK,eAAW,cAAG,yBAAyB,SAAS,IAAI,CAAC,GAAG,OAAO,EAAE,iBAAiB,WAAW,GAAG;AAAA,QACrG;AAAA;AAAA;AAAA,EACH;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/components/rewards/level-badge.tsx"],"sourcesContent":["import { cn } from \"../../utils/cn.js\";\n\nexport interface LevelBadgeProps {\n  level: number;\n  name: string;\n  /** Kept for interface consistency with other rewards components that do\n   *  use per-level color (XpProgress, LevelUpCelebration, JourneyPath) —\n   *  this component intentionally ignores it in favor of one signature\n   *  brand gradient across every level, not 20+ flat per-level colors. */\n  badgeColor: string;\n  size?: \"sm\" | \"md\" | \"lg\";\n  className?: string;\n}\n\n/** Level chip — shows the level's title only (\"Voyager\"), not the raw\n *  number (\"Lv.6 Voyager\" read as UI noise). The level is still available\n *  on hover via the native title tooltip. One signature orange->maeve\n *  gradient fill, white text — vivid and consistent regardless of level,\n *  rather than a washed-out per-level tint. Pure presentation — the\n *  consuming app supplies level data from the rewards API. */\nexport function LevelBadge({ level, name, size = \"md\", className }: LevelBadgeProps) {\n  const sizeClasses = {\n    sm: \"h-5 px-2.5 text-2xs\",\n    md: \"h-6 px-3 text-xs\",\n    lg: \"h-8 px-4 text-sm\",\n  };\n\n  return (\n    <span\n      title={`Level ${level}`}\n      className={cn(\n        \"inline-flex items-center rounded-full font-bold tracking-tight whitespace-nowrap text-white bg-gradient-to-r from-brand-orange to-brand-maeve\",\n        sizeClasses[size],\n        className\n      )}\n    >\n      {name}\n    </span>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA4BI;AA5BJ,gBAAmB;AAoBZ,SAAS,WAAW,EAAE,OAAO,MAAM,OAAO,MAAM,UAAU,GAAoB;AACnF,QAAM,cAAc;AAAA,IAClB,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,SAAS,KAAK;AAAA,MACrB,eAAW;AAAA,QACT;AAAA,QACA,YAAY,IAAI;AAAA,QAChB;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;","names":[]}

package/dist/components/rewards/level-badge.d.cts

@@ -3,14 +3,20 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 interface LevelBadgeProps {
     level: number;
     name: string;
+    /** Kept for interface consistency with other rewards components that do
+     *  use per-level color (XpProgress, LevelUpCelebration, JourneyPath) —
+     *  this component intentionally ignores it in favor of one signature
+     *  brand gradient across every level, not 20+ flat per-level colors. */
     badgeColor: string;
     size?: "sm" | "md" | "lg";
     className?: string;
 }
-/** Color-coded level chip — shows the level's title only ("Voyager"), not
- *  the raw number ("Lv.6 Voyager" read as UI noise). The level is still
- *  available on hover via the native title tooltip. Pure presentation — the
+/** Level chip — shows the level's title only ("Voyager"), not the raw
+ *  number ("Lv.6 Voyager" read as UI noise). The level is still available
+ *  on hover via the native title tooltip. One signature orange->maeve
+ *  gradient fill, white text — vivid and consistent regardless of level,
+ *  rather than a washed-out per-level tint. Pure presentation — the
  *  consuming app supplies level data from the rewards API. */
-declare function LevelBadge({ level, name, badgeColor, size, className }: LevelBadgeProps): react_jsx_runtime.JSX.Element;
+declare function LevelBadge({ level, name, size, className }: LevelBadgeProps): react_jsx_runtime.JSX.Element;
 
 export { LevelBadge, type LevelBadgeProps };

package/dist/components/rewards/level-badge.d.ts

@@ -3,14 +3,20 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 interface LevelBadgeProps {
     level: number;
     name: string;
+    /** Kept for interface consistency with other rewards components that do
+     *  use per-level color (XpProgress, LevelUpCelebration, JourneyPath) —
+     *  this component intentionally ignores it in favor of one signature
+     *  brand gradient across every level, not 20+ flat per-level colors. */
     badgeColor: string;
     size?: "sm" | "md" | "lg";
     className?: string;
 }
-/** Color-coded level chip — shows the level's title only ("Voyager"), not
- *  the raw number ("Lv.6 Voyager" read as UI noise). The level is still
- *  available on hover via the native title tooltip. Pure presentation — the
+/** Level chip — shows the level's title only ("Voyager"), not the raw
+ *  number ("Lv.6 Voyager" read as UI noise). The level is still available
+ *  on hover via the native title tooltip. One signature orange->maeve
+ *  gradient fill, white text — vivid and consistent regardless of level,
+ *  rather than a washed-out per-level tint. Pure presentation — the
  *  consuming app supplies level data from the rewards API. */
-declare function LevelBadge({ level, name, badgeColor, size, className }: LevelBadgeProps): react_jsx_runtime.JSX.Element;
+declare function LevelBadge({ level, name, size, className }: LevelBadgeProps): react_jsx_runtime.JSX.Element;
 
 export { LevelBadge, type LevelBadgeProps };

package/dist/components/rewards/level-badge.js

@@ -1,30 +1,21 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 import { cn } from "../../utils/cn.js";
-function LevelBadge({ level, name, badgeColor, size = "md", className }) {
+function LevelBadge({ level, name, size = "md", className }) {
   const sizeClasses = {
-    sm: "h-5 px-1.5 gap-1 text-2xs",
-    md: "h-6 px-2 gap-1.5 text-xs",
-    lg: "h-8 px-3 gap-2 text-sm"
+    sm: "h-5 px-2.5 text-2xs",
+    md: "h-6 px-3 text-xs",
+    lg: "h-8 px-4 text-sm"
   };
-  const dotSizes = {
-    sm: "h-1.5 w-1.5",
-    md: "h-2 w-2",
-    lg: "h-2.5 w-2.5"
-  };
-  return /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(
     "span",
     {
       title: `Level ${level}`,
       className: cn(
-        "inline-flex items-center rounded-full border font-semibold tracking-tight whitespace-nowrap",
+        "inline-flex items-center rounded-full font-bold tracking-tight whitespace-nowrap text-white bg-gradient-to-r from-brand-orange to-brand-maeve",
         sizeClasses[size],
         className
       ),
-      style: { borderColor: `${badgeColor}60`, backgroundColor: `${badgeColor}18`, color: badgeColor },
-      children: [
-        /* @__PURE__ */ jsx("span", { className: cn("rounded-full shrink-0", dotSizes[size]), style: { backgroundColor: badgeColor } }),
-        name
-      ]
+      children: name
     }
   );
 }

package/dist/components/rewards/level-badge.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/rewards/level-badge.tsx"],"sourcesContent":["import { cn } from \"../../utils/cn.js\";\n\nexport interface LevelBadgeProps {\n  level: number;\n  name: string;\n  badgeColor: string;\n  size?: \"sm\" | \"md\" | \"lg\";\n  className?: string;\n}\n\n/** Color-coded level chip — shows the level's title only (\"Voyager\"), not\n *  the raw number (\"Lv.6 Voyager\" read as UI noise). The level is still\n *  available on hover via the native title tooltip. Pure presentation — the\n *  consuming app supplies level data from the rewards API. */\nexport function LevelBadge({ level, name, badgeColor, size = \"md\", className }: LevelBadgeProps) {\n  const sizeClasses = {\n    sm: \"h-5 px-1.5 gap-1 text-2xs\",\n    md: \"h-6 px-2 gap-1.5 text-xs\",\n    lg: \"h-8 px-3 gap-2 text-sm\",\n  };\n\n  const dotSizes = {\n    sm: \"h-1.5 w-1.5\",\n    md: \"h-2 w-2\",\n    lg: \"h-2.5 w-2.5\",\n  };\n\n  return (\n    <span\n      title={`Level ${level}`}\n      className={cn(\n        \"inline-flex items-center rounded-full border font-semibold tracking-tight whitespace-nowrap\",\n        sizeClasses[size],\n        className\n      )}\n      style={{ borderColor: `${badgeColor}60`, backgroundColor: `${badgeColor}18`, color: badgeColor }}\n    >\n      <span className={cn(\"rounded-full shrink-0\", dotSizes[size])} style={{ backgroundColor: badgeColor }} />\n      {name}\n    </span>\n  );\n}\n"],"mappings":"AA4BI,SASE,KATF;AA5BJ,SAAS,UAAU;AAcZ,SAAS,WAAW,EAAE,OAAO,MAAM,YAAY,OAAO,MAAM,UAAU,GAAoB;AAC/F,QAAM,cAAc;AAAA,IAClB,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AAEA,QAAM,WAAW;AAAA,IACf,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,SAAS,KAAK;AAAA,MACrB,WAAW;AAAA,QACT;AAAA,QACA,YAAY,IAAI;AAAA,QAChB;AAAA,MACF;AAAA,MACA,OAAO,EAAE,aAAa,GAAG,UAAU,MAAM,iBAAiB,GAAG,UAAU,MAAM,OAAO,WAAW;AAAA,MAE/F;AAAA,4BAAC,UAAK,WAAW,GAAG,yBAAyB,SAAS,IAAI,CAAC,GAAG,OAAO,EAAE,iBAAiB,WAAW,GAAG;AAAA,QACrG;AAAA;AAAA;AAAA,EACH;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/components/rewards/level-badge.tsx"],"sourcesContent":["import { cn } from \"../../utils/cn.js\";\n\nexport interface LevelBadgeProps {\n  level: number;\n  name: string;\n  /** Kept for interface consistency with other rewards components that do\n   *  use per-level color (XpProgress, LevelUpCelebration, JourneyPath) —\n   *  this component intentionally ignores it in favor of one signature\n   *  brand gradient across every level, not 20+ flat per-level colors. */\n  badgeColor: string;\n  size?: \"sm\" | \"md\" | \"lg\";\n  className?: string;\n}\n\n/** Level chip — shows the level's title only (\"Voyager\"), not the raw\n *  number (\"Lv.6 Voyager\" read as UI noise). The level is still available\n *  on hover via the native title tooltip. One signature orange->maeve\n *  gradient fill, white text — vivid and consistent regardless of level,\n *  rather than a washed-out per-level tint. Pure presentation — the\n *  consuming app supplies level data from the rewards API. */\nexport function LevelBadge({ level, name, size = \"md\", className }: LevelBadgeProps) {\n  const sizeClasses = {\n    sm: \"h-5 px-2.5 text-2xs\",\n    md: \"h-6 px-3 text-xs\",\n    lg: \"h-8 px-4 text-sm\",\n  };\n\n  return (\n    <span\n      title={`Level ${level}`}\n      className={cn(\n        \"inline-flex items-center rounded-full font-bold tracking-tight whitespace-nowrap text-white bg-gradient-to-r from-brand-orange to-brand-maeve\",\n        sizeClasses[size],\n        className\n      )}\n    >\n      {name}\n    </span>\n  );\n}\n"],"mappings":"AA4BI;AA5BJ,SAAS,UAAU;AAoBZ,SAAS,WAAW,EAAE,OAAO,MAAM,OAAO,MAAM,UAAU,GAAoB;AACnF,QAAM,cAAc;AAAA,IAClB,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,SAAS,KAAK;AAAA,MACrB,WAAW;AAAA,QACT;AAAA,QACA,YAAY,IAAI;AAAA,QAChB;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;","names":[]}

package/dist/components/rewards/level-journey-list.cjs

@@ -0,0 +1,52 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var level_journey_list_exports = {};
+__export(level_journey_list_exports, {
+  LevelJourneyList: () => LevelJourneyList
+});
+module.exports = __toCommonJS(level_journey_list_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_cn = require("../../utils/cn.js");
+function LevelJourneyList({ levels, className }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ol", { className: (0, import_cn.cn)("divide-y divide-foreground/[0.06]", className), children: levels.map((l, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("li", { className: "flex items-start gap-4 py-4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "flex items-center gap-1.5 w-8 shrink-0 pt-0.5", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-xs font-bold text-foreground/30 tabular-nums", children: l.level }),
+      (i + 1) % 10 === 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "span",
+        {
+          "aria-hidden": true,
+          className: "h-1.5 w-1.5 rounded-full bg-gradient-to-r from-brand-orange to-brand-maeve"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex-1 min-w-0", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-base font-bold", children: l.name }),
+      l.description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm text-foreground/60 mt-0.5 leading-relaxed", children: l.description })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "text-sm font-black tabular-nums text-foreground/70 shrink-0", children: [
+      l.xpRequired.toLocaleString(),
+      " XP"
+    ] })
+  ] }, l.level)) });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  LevelJourneyList
+});
+//# sourceMappingURL=level-journey-list.cjs.map

package/dist/components/rewards/level-journey-list.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/rewards/level-journey-list.tsx"],"sourcesContent":["import { cn } from \"../../utils/cn.js\";\n\nexport interface LevelJourneyListLevel {\n  level: number;\n  name: string;\n  xpRequired: number;\n  description: string | null;\n}\n\nexport interface LevelJourneyListProps {\n  levels: LevelJourneyListLevel[];\n  className?: string;\n}\n\n/** The full level ladder as a vertical showcase list — not the old\n *  horizontal chip rail, which doesn't scale past a handful of items and\n *  was built for a dashboard strip, not a 50-row standalone page. No\n *  current-level state: this is the system-wide view, not \"where am I.\"\n *  Every 10th level gets a small gradient marker as a milestone cue;\n *  colors are otherwise uniform (one signature identity, not 50 flat\n *  per-level colors) — badgeColor is deliberately not consumed here. */\nexport function LevelJourneyList({ levels, className }: LevelJourneyListProps) {\n  return (\n    <ol className={cn(\"divide-y divide-foreground/[0.06]\", className)}>\n      {levels.map((l, i) => (\n        <li key={l.level} className=\"flex items-start gap-4 py-4\">\n          <span className=\"flex items-center gap-1.5 w-8 shrink-0 pt-0.5\">\n            <span className=\"text-xs font-bold text-foreground/30 tabular-nums\">{l.level}</span>\n            {(i + 1) % 10 === 0 && (\n              <span\n                aria-hidden\n                className=\"h-1.5 w-1.5 rounded-full bg-gradient-to-r from-brand-orange to-brand-maeve\"\n              />\n            )}\n          </span>\n          <div className=\"flex-1 min-w-0\">\n            <p className=\"text-base font-bold\">{l.name}</p>\n            {l.description && (\n              <p className=\"text-sm text-foreground/60 mt-0.5 leading-relaxed\">{l.description}</p>\n            )}\n          </div>\n          <span className=\"text-sm font-black tabular-nums text-foreground/70 shrink-0\">\n            {l.xpRequired.toLocaleString()} XP\n          </span>\n        </li>\n      ))}\n    </ol>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA0BU;AA1BV,gBAAmB;AAqBZ,SAAS,iBAAiB,EAAE,QAAQ,UAAU,GAA0B;AAC7E,SACE,4CAAC,QAAG,eAAW,cAAG,qCAAqC,SAAS,GAC7D,iBAAO,IAAI,CAAC,GAAG,MACd,6CAAC,QAAiB,WAAU,+BAC1B;AAAA,iDAAC,UAAK,WAAU,iDACd;AAAA,kDAAC,UAAK,WAAU,qDAAqD,YAAE,OAAM;AAAA,OAC3E,IAAI,KAAK,OAAO,KAChB;AAAA,QAAC;AAAA;AAAA,UACC,eAAW;AAAA,UACX,WAAU;AAAA;AAAA,MACZ;AAAA,OAEJ;AAAA,IACA,6CAAC,SAAI,WAAU,kBACb;AAAA,kDAAC,OAAE,WAAU,uBAAuB,YAAE,MAAK;AAAA,MAC1C,EAAE,eACD,4CAAC,OAAE,WAAU,qDAAqD,YAAE,aAAY;AAAA,OAEpF;AAAA,IACA,6CAAC,UAAK,WAAU,+DACb;AAAA,QAAE,WAAW,eAAe;AAAA,MAAE;AAAA,OACjC;AAAA,OAlBO,EAAE,KAmBX,CACD,GACH;AAEJ;","names":[]}

package/dist/components/rewards/level-journey-list.d.cts

@@ -0,0 +1,22 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface LevelJourneyListLevel {
+    level: number;
+    name: string;
+    xpRequired: number;
+    description: string | null;
+}
+interface LevelJourneyListProps {
+    levels: LevelJourneyListLevel[];
+    className?: string;
+}
+/** The full level ladder as a vertical showcase list — not the old
+ *  horizontal chip rail, which doesn't scale past a handful of items and
+ *  was built for a dashboard strip, not a 50-row standalone page. No
+ *  current-level state: this is the system-wide view, not "where am I."
+ *  Every 10th level gets a small gradient marker as a milestone cue;
+ *  colors are otherwise uniform (one signature identity, not 50 flat
+ *  per-level colors) — badgeColor is deliberately not consumed here. */
+declare function LevelJourneyList({ levels, className }: LevelJourneyListProps): react_jsx_runtime.JSX.Element;
+
+export { LevelJourneyList, type LevelJourneyListLevel, type LevelJourneyListProps };

package/dist/components/rewards/level-journey-list.d.ts

@@ -0,0 +1,22 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface LevelJourneyListLevel {
+    level: number;
+    name: string;
+    xpRequired: number;
+    description: string | null;
+}
+interface LevelJourneyListProps {
+    levels: LevelJourneyListLevel[];
+    className?: string;
+}
+/** The full level ladder as a vertical showcase list — not the old
+ *  horizontal chip rail, which doesn't scale past a handful of items and
+ *  was built for a dashboard strip, not a 50-row standalone page. No
+ *  current-level state: this is the system-wide view, not "where am I."
+ *  Every 10th level gets a small gradient marker as a milestone cue;
+ *  colors are otherwise uniform (one signature identity, not 50 flat
+ *  per-level colors) — badgeColor is deliberately not consumed here. */
+declare function LevelJourneyList({ levels, className }: LevelJourneyListProps): react_jsx_runtime.JSX.Element;
+
+export { LevelJourneyList, type LevelJourneyListLevel, type LevelJourneyListProps };

package/dist/components/rewards/level-journey-list.js

@@ -0,0 +1,28 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "../../utils/cn.js";
+function LevelJourneyList({ levels, className }) {
+  return /* @__PURE__ */ jsx("ol", { className: cn("divide-y divide-foreground/[0.06]", className), children: levels.map((l, i) => /* @__PURE__ */ jsxs("li", { className: "flex items-start gap-4 py-4", children: [
+    /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1.5 w-8 shrink-0 pt-0.5", children: [
+      /* @__PURE__ */ jsx("span", { className: "text-xs font-bold text-foreground/30 tabular-nums", children: l.level }),
+      (i + 1) % 10 === 0 && /* @__PURE__ */ jsx(
+        "span",
+        {
+          "aria-hidden": true,
+          className: "h-1.5 w-1.5 rounded-full bg-gradient-to-r from-brand-orange to-brand-maeve"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+      /* @__PURE__ */ jsx("p", { className: "text-base font-bold", children: l.name }),
+      l.description && /* @__PURE__ */ jsx("p", { className: "text-sm text-foreground/60 mt-0.5 leading-relaxed", children: l.description })
+    ] }),
+    /* @__PURE__ */ jsxs("span", { className: "text-sm font-black tabular-nums text-foreground/70 shrink-0", children: [
+      l.xpRequired.toLocaleString(),
+      " XP"
+    ] })
+  ] }, l.level)) });
+}
+export {
+  LevelJourneyList
+};
+//# sourceMappingURL=level-journey-list.js.map

package/dist/components/rewards/level-journey-list.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/rewards/level-journey-list.tsx"],"sourcesContent":["import { cn } from \"../../utils/cn.js\";\n\nexport interface LevelJourneyListLevel {\n  level: number;\n  name: string;\n  xpRequired: number;\n  description: string | null;\n}\n\nexport interface LevelJourneyListProps {\n  levels: LevelJourneyListLevel[];\n  className?: string;\n}\n\n/** The full level ladder as a vertical showcase list — not the old\n *  horizontal chip rail, which doesn't scale past a handful of items and\n *  was built for a dashboard strip, not a 50-row standalone page. No\n *  current-level state: this is the system-wide view, not \"where am I.\"\n *  Every 10th level gets a small gradient marker as a milestone cue;\n *  colors are otherwise uniform (one signature identity, not 50 flat\n *  per-level colors) — badgeColor is deliberately not consumed here. */\nexport function LevelJourneyList({ levels, className }: LevelJourneyListProps) {\n  return (\n    <ol className={cn(\"divide-y divide-foreground/[0.06]\", className)}>\n      {levels.map((l, i) => (\n        <li key={l.level} className=\"flex items-start gap-4 py-4\">\n          <span className=\"flex items-center gap-1.5 w-8 shrink-0 pt-0.5\">\n            <span className=\"text-xs font-bold text-foreground/30 tabular-nums\">{l.level}</span>\n            {(i + 1) % 10 === 0 && (\n              <span\n                aria-hidden\n                className=\"h-1.5 w-1.5 rounded-full bg-gradient-to-r from-brand-orange to-brand-maeve\"\n              />\n            )}\n          </span>\n          <div className=\"flex-1 min-w-0\">\n            <p className=\"text-base font-bold\">{l.name}</p>\n            {l.description && (\n              <p className=\"text-sm text-foreground/60 mt-0.5 leading-relaxed\">{l.description}</p>\n            )}\n          </div>\n          <span className=\"text-sm font-black tabular-nums text-foreground/70 shrink-0\">\n            {l.xpRequired.toLocaleString()} XP\n          </span>\n        </li>\n      ))}\n    </ol>\n  );\n}\n"],"mappings":"AA0BU,SACE,KADF;AA1BV,SAAS,UAAU;AAqBZ,SAAS,iBAAiB,EAAE,QAAQ,UAAU,GAA0B;AAC7E,SACE,oBAAC,QAAG,WAAW,GAAG,qCAAqC,SAAS,GAC7D,iBAAO,IAAI,CAAC,GAAG,MACd,qBAAC,QAAiB,WAAU,+BAC1B;AAAA,yBAAC,UAAK,WAAU,iDACd;AAAA,0BAAC,UAAK,WAAU,qDAAqD,YAAE,OAAM;AAAA,OAC3E,IAAI,KAAK,OAAO,KAChB;AAAA,QAAC;AAAA;AAAA,UACC,eAAW;AAAA,UACX,WAAU;AAAA;AAAA,MACZ;AAAA,OAEJ;AAAA,IACA,qBAAC,SAAI,WAAU,kBACb;AAAA,0BAAC,OAAE,WAAU,uBAAuB,YAAE,MAAK;AAAA,MAC1C,EAAE,eACD,oBAAC,OAAE,WAAU,qDAAqD,YAAE,aAAY;AAAA,OAEpF;AAAA,IACA,qBAAC,UAAK,WAAU,+DACb;AAAA,QAAE,WAAW,eAAe;AAAA,MAAE;AAAA,OACjC;AAAA,OAlBO,EAAE,KAmBX,CACD,GACH;AAEJ;","names":[]}