@medialane/ui 0.94.6 → 0.94.7

package/dist/components/action-button.cjs

@@ -100,7 +100,7 @@ function ActionButton({
       disabled,
       className: (0, import_cn.cn)(
         "ml-gbtn inline-flex items-center justify-center gap-2 font-semibold cursor-pointer whitespace-nowrap",
-        "bg-card text-foreground border-none relative disabled:opacity-40 disabled:pointer-events-none",
+        "bg-transparent text-foreground border-none relative disabled:opacity-40 disabled:pointer-events-none",
         sizeClass,
         className
       ),

package/dist/components/action-button.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/action-button.tsx"],"sourcesContent":["\"use client\";\n\nimport { cn } from \"../utils/cn.js\";\n\nconst ACTION_GRADIENTS: Record<string, [string, string, string]> = {\n  buy:     ['#3b7bff', '#8a5cf6', '#3b7bff'],\n  submit:  ['#d6359a', '#5b4ce6', '#d6359a'],\n  offer:   ['#f6608f', '#fb8b46', '#f6608f'],\n  remix:   ['#8a5cf6', '#f6608f', '#8a5cf6'],\n  license: ['#3b7bff', '#5b4ce6', '#3b7bff'],\n};\n\nconst ACTION_FOREGROUNDS: Record<string, string> = {\n  buy:     '#3b7bff',\n  submit:  '#5b4ce6',\n  offer:   '#fb7a32',\n  remix:   '#8a3ff0',\n  license: '#3b7bff',\n};\n\nconst TONE_GRADIENTS: Record<string, [string, string, string]> = {\n  blue:   ['#3b7bff', '#5b4ce6', '#3b7bff'],\n  indigo: ['#5b4ce6', '#8a5cf6', '#5b4ce6'],\n  purple: ['#8a5cf6', '#f6608f', '#8a5cf6'],\n  orange: ['#fb8b46', '#f6608f', '#fb8b46'],\n  red:    ['#ef5a5a', '#f6608f', '#ef5a5a'],\n  rose:   ['#f6608f', '#fb8b46', '#f6608f'],\n};\n\nconst TONE_FOREGROUNDS: Record<string, string> = {\n  blue:   '#2f6bff',\n  indigo: '#5b4ce6',\n  purple: '#8a3ff0',\n  orange: '#fb7a32',\n  red:    '#ef5a5a',\n  rose:   '#f6608f',\n};\n\nexport type ActionKey = keyof typeof ACTION_GRADIENTS;\nexport type ToneKey = keyof typeof TONE_GRADIENTS;\n\nexport interface ActionButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Semantic action — hue signals the action, never decorative. */\n  action?: ActionKey;\n  /** Tone — for secondary/owner actions. Ignored when action is set. */\n  tone?: ToneKey;\n  icon?: React.ReactNode;\n  /** Tall 54px variant for hero contexts. */\n  big?: boolean;\n  /** Ghost: no gradient border, muted surface fill. */\n  ghost?: boolean;\n  /**\n   * Inline help/info affordance, rendered next to the label via `renderHelp`\n   * — a render-prop rather than a built-in tooltip because this package\n   * can't depend on an app-specific tooltip primitive.\n   */\n  helpContent?: string;\n  renderHelp?: (content: string) => React.ReactNode;\n}\n\nexport function ActionButton({\n  action,\n  tone,\n  icon,\n  big,\n  ghost,\n  helpContent,\n  renderHelp,\n  disabled,\n  children,\n  className,\n  style,\n  ...rest\n}: ActionButtonProps) {\n  const sizeClass = big\n    ? \"h-[54px] px-5 rounded-[13px] text-[15px]\"\n    : \"h-[46px] px-5 rounded-[13px] text-sm\";\n\n  if (ghost) {\n    return (\n      <button\n        {...rest}\n        disabled={disabled}\n        className={cn(\n          \"inline-flex items-center justify-center gap-2 font-semibold cursor-pointer whitespace-nowrap\",\n          \"bg-muted text-foreground border-none disabled:opacity-50 disabled:pointer-events-none\",\n          sizeClass,\n          className,\n        )}\n        style={style}\n      >\n        {icon}{children}\n        {helpContent && renderHelp ? renderHelp(helpContent) : null}\n      </button>\n    );\n  }\n\n  const gradColors =\n    action ? ACTION_GRADIENTS[action] :\n    tone   ? TONE_GRADIENTS[tone] :\n    ACTION_GRADIENTS.buy;\n\n  const fg =\n    action ? ACTION_FOREGROUNDS[action] :\n    tone   ? TONE_FOREGROUNDS[tone] :\n    ACTION_FOREGROUNDS.buy;\n\n  const grad = `linear-gradient(115deg, ${gradColors.join(',')})`;\n\n  return (\n    <button\n      {...rest}\n      disabled={disabled}\n      className={cn(\n        \"ml-gbtn inline-flex items-center justify-center gap-2 font-semibold cursor-pointer whitespace-nowrap\",\n        \"bg-card text-foreground border-none relative disabled:opacity-40 disabled:pointer-events-none\",\n        sizeClass,\n        className,\n      )}\n      style={{ '--ml-grad': grad, ...style } as React.CSSProperties}\n    >\n      {icon && <span className=\"inline-flex\" style={{ color: fg }}>{icon}</span>}\n      {children}\n      {helpContent && renderHelp ? renderHelp(helpContent) : null}\n    </button>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAgFM;AA9EN,gBAAmB;AAEnB,MAAM,mBAA6D;AAAA,EACjE,KAAS,CAAC,WAAW,WAAW,SAAS;AAAA,EACzC,QAAS,CAAC,WAAW,WAAW,SAAS;AAAA,EACzC,OAAS,CAAC,WAAW,WAAW,SAAS;AAAA,EACzC,OAAS,CAAC,WAAW,WAAW,SAAS;AAAA,EACzC,SAAS,CAAC,WAAW,WAAW,SAAS;AAC3C;AAEA,MAAM,qBAA6C;AAAA,EACjD,KAAS;AAAA,EACT,QAAS;AAAA,EACT,OAAS;AAAA,EACT,OAAS;AAAA,EACT,SAAS;AACX;AAEA,MAAM,iBAA2D;AAAA,EAC/D,MAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,EACxC,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,EACxC,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,EACxC,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,EACxC,KAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,EACxC,MAAQ,CAAC,WAAW,WAAW,SAAS;AAC1C;AAEA,MAAM,mBAA2C;AAAA,EAC/C,MAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,KAAQ;AAAA,EACR,MAAQ;AACV;AAwBO,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAsB;AACpB,QAAM,YAAY,MACd,6CACA;AAEJ,MAAI,OAAO;AACT,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ;AAAA,QACA,eAAW;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QACA;AAAA,QAEC;AAAA;AAAA,UAAM;AAAA,UACN,eAAe,aAAa,WAAW,WAAW,IAAI;AAAA;AAAA;AAAA,IACzD;AAAA,EAEJ;AAEA,QAAM,aACJ,SAAS,iBAAiB,MAAM,IAChC,OAAS,eAAe,IAAI,IAC5B,iBAAiB;AAEnB,QAAM,KACJ,SAAS,mBAAmB,MAAM,IAClC,OAAS,iBAAiB,IAAI,IAC9B,mBAAmB;AAErB,QAAM,OAAO,2BAA2B,WAAW,KAAK,GAAG,CAAC;AAE5D,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA,eAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MACA,OAAO,EAAE,aAAa,MAAM,GAAG,MAAM;AAAA,MAEpC;AAAA,gBAAQ,4CAAC,UAAK,WAAU,eAAc,OAAO,EAAE,OAAO,GAAG,GAAI,gBAAK;AAAA,QAClE;AAAA,QACA,eAAe,aAAa,WAAW,WAAW,IAAI;AAAA;AAAA;AAAA,EACzD;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/components/action-button.tsx"],"sourcesContent":["\"use client\";\n\nimport { cn } from \"../utils/cn.js\";\n\nconst ACTION_GRADIENTS: Record<string, [string, string, string]> = {\n  buy:     ['#3b7bff', '#8a5cf6', '#3b7bff'],\n  submit:  ['#d6359a', '#5b4ce6', '#d6359a'],\n  offer:   ['#f6608f', '#fb8b46', '#f6608f'],\n  remix:   ['#8a5cf6', '#f6608f', '#8a5cf6'],\n  license: ['#3b7bff', '#5b4ce6', '#3b7bff'],\n};\n\nconst ACTION_FOREGROUNDS: Record<string, string> = {\n  buy:     '#3b7bff',\n  submit:  '#5b4ce6',\n  offer:   '#fb7a32',\n  remix:   '#8a3ff0',\n  license: '#3b7bff',\n};\n\nconst TONE_GRADIENTS: Record<string, [string, string, string]> = {\n  blue:   ['#3b7bff', '#5b4ce6', '#3b7bff'],\n  indigo: ['#5b4ce6', '#8a5cf6', '#5b4ce6'],\n  purple: ['#8a5cf6', '#f6608f', '#8a5cf6'],\n  orange: ['#fb8b46', '#f6608f', '#fb8b46'],\n  red:    ['#ef5a5a', '#f6608f', '#ef5a5a'],\n  rose:   ['#f6608f', '#fb8b46', '#f6608f'],\n};\n\nconst TONE_FOREGROUNDS: Record<string, string> = {\n  blue:   '#2f6bff',\n  indigo: '#5b4ce6',\n  purple: '#8a3ff0',\n  orange: '#fb7a32',\n  red:    '#ef5a5a',\n  rose:   '#f6608f',\n};\n\nexport type ActionKey = keyof typeof ACTION_GRADIENTS;\nexport type ToneKey = keyof typeof TONE_GRADIENTS;\n\nexport interface ActionButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Semantic action — hue signals the action, never decorative. */\n  action?: ActionKey;\n  /** Tone — for secondary/owner actions. Ignored when action is set. */\n  tone?: ToneKey;\n  icon?: React.ReactNode;\n  /** Tall 54px variant for hero contexts. */\n  big?: boolean;\n  /** Ghost: no gradient border, muted surface fill. */\n  ghost?: boolean;\n  /**\n   * Inline help/info affordance, rendered next to the label via `renderHelp`\n   * — a render-prop rather than a built-in tooltip because this package\n   * can't depend on an app-specific tooltip primitive.\n   */\n  helpContent?: string;\n  renderHelp?: (content: string) => React.ReactNode;\n}\n\nexport function ActionButton({\n  action,\n  tone,\n  icon,\n  big,\n  ghost,\n  helpContent,\n  renderHelp,\n  disabled,\n  children,\n  className,\n  style,\n  ...rest\n}: ActionButtonProps) {\n  const sizeClass = big\n    ? \"h-[54px] px-5 rounded-[13px] text-[15px]\"\n    : \"h-[46px] px-5 rounded-[13px] text-sm\";\n\n  if (ghost) {\n    return (\n      <button\n        {...rest}\n        disabled={disabled}\n        className={cn(\n          \"inline-flex items-center justify-center gap-2 font-semibold cursor-pointer whitespace-nowrap\",\n          \"bg-muted text-foreground border-none disabled:opacity-50 disabled:pointer-events-none\",\n          sizeClass,\n          className,\n        )}\n        style={style}\n      >\n        {icon}{children}\n        {helpContent && renderHelp ? renderHelp(helpContent) : null}\n      </button>\n    );\n  }\n\n  const gradColors =\n    action ? ACTION_GRADIENTS[action] :\n    tone   ? TONE_GRADIENTS[tone] :\n    ACTION_GRADIENTS.buy;\n\n  const fg =\n    action ? ACTION_FOREGROUNDS[action] :\n    tone   ? TONE_FOREGROUNDS[tone] :\n    ACTION_FOREGROUNDS.buy;\n\n  const grad = `linear-gradient(115deg, ${gradColors.join(',')})`;\n\n  return (\n    <button\n      {...rest}\n      disabled={disabled}\n      className={cn(\n        \"ml-gbtn inline-flex items-center justify-center gap-2 font-semibold cursor-pointer whitespace-nowrap\",\n        \"bg-transparent text-foreground border-none relative disabled:opacity-40 disabled:pointer-events-none\",\n        sizeClass,\n        className,\n      )}\n      style={{ '--ml-grad': grad, ...style } as React.CSSProperties}\n    >\n      {icon && <span className=\"inline-flex\" style={{ color: fg }}>{icon}</span>}\n      {children}\n      {helpContent && renderHelp ? renderHelp(helpContent) : null}\n    </button>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAgFM;AA9EN,gBAAmB;AAEnB,MAAM,mBAA6D;AAAA,EACjE,KAAS,CAAC,WAAW,WAAW,SAAS;AAAA,EACzC,QAAS,CAAC,WAAW,WAAW,SAAS;AAAA,EACzC,OAAS,CAAC,WAAW,WAAW,SAAS;AAAA,EACzC,OAAS,CAAC,WAAW,WAAW,SAAS;AAAA,EACzC,SAAS,CAAC,WAAW,WAAW,SAAS;AAC3C;AAEA,MAAM,qBAA6C;AAAA,EACjD,KAAS;AAAA,EACT,QAAS;AAAA,EACT,OAAS;AAAA,EACT,OAAS;AAAA,EACT,SAAS;AACX;AAEA,MAAM,iBAA2D;AAAA,EAC/D,MAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,EACxC,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,EACxC,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,EACxC,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,EACxC,KAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,EACxC,MAAQ,CAAC,WAAW,WAAW,SAAS;AAC1C;AAEA,MAAM,mBAA2C;AAAA,EAC/C,MAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,KAAQ;AAAA,EACR,MAAQ;AACV;AAwBO,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAsB;AACpB,QAAM,YAAY,MACd,6CACA;AAEJ,MAAI,OAAO;AACT,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ;AAAA,QACA,eAAW;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QACA;AAAA,QAEC;AAAA;AAAA,UAAM;AAAA,UACN,eAAe,aAAa,WAAW,WAAW,IAAI;AAAA;AAAA;AAAA,IACzD;AAAA,EAEJ;AAEA,QAAM,aACJ,SAAS,iBAAiB,MAAM,IAChC,OAAS,eAAe,IAAI,IAC5B,iBAAiB;AAEnB,QAAM,KACJ,SAAS,mBAAmB,MAAM,IAClC,OAAS,iBAAiB,IAAI,IAC9B,mBAAmB;AAErB,QAAM,OAAO,2BAA2B,WAAW,KAAK,GAAG,CAAC;AAE5D,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA,eAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MACA,OAAO,EAAE,aAAa,MAAM,GAAG,MAAM;AAAA,MAEpC;AAAA,gBAAQ,4CAAC,UAAK,WAAU,eAAc,OAAO,EAAE,OAAO,GAAG,GAAI,gBAAK;AAAA,QAClE;AAAA,QACA,eAAe,aAAa,WAAW,WAAW,IAAI;AAAA;AAAA;AAAA,EACzD;AAEJ;","names":[]}

package/dist/components/action-button.js

@@ -77,7 +77,7 @@ function ActionButton({
       disabled,
       className: cn(
         "ml-gbtn inline-flex items-center justify-center gap-2 font-semibold cursor-pointer whitespace-nowrap",
-        "bg-card text-foreground border-none relative disabled:opacity-40 disabled:pointer-events-none",
+        "bg-transparent text-foreground border-none relative disabled:opacity-40 disabled:pointer-events-none",
         sizeClass,
         className
       ),

package/dist/components/action-button.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/action-button.tsx"],"sourcesContent":["\"use client\";\n\nimport { cn } from \"../utils/cn.js\";\n\nconst ACTION_GRADIENTS: Record<string, [string, string, string]> = {\n  buy:     ['#3b7bff', '#8a5cf6', '#3b7bff'],\n  submit:  ['#d6359a', '#5b4ce6', '#d6359a'],\n  offer:   ['#f6608f', '#fb8b46', '#f6608f'],\n  remix:   ['#8a5cf6', '#f6608f', '#8a5cf6'],\n  license: ['#3b7bff', '#5b4ce6', '#3b7bff'],\n};\n\nconst ACTION_FOREGROUNDS: Record<string, string> = {\n  buy:     '#3b7bff',\n  submit:  '#5b4ce6',\n  offer:   '#fb7a32',\n  remix:   '#8a3ff0',\n  license: '#3b7bff',\n};\n\nconst TONE_GRADIENTS: Record<string, [string, string, string]> = {\n  blue:   ['#3b7bff', '#5b4ce6', '#3b7bff'],\n  indigo: ['#5b4ce6', '#8a5cf6', '#5b4ce6'],\n  purple: ['#8a5cf6', '#f6608f', '#8a5cf6'],\n  orange: ['#fb8b46', '#f6608f', '#fb8b46'],\n  red:    ['#ef5a5a', '#f6608f', '#ef5a5a'],\n  rose:   ['#f6608f', '#fb8b46', '#f6608f'],\n};\n\nconst TONE_FOREGROUNDS: Record<string, string> = {\n  blue:   '#2f6bff',\n  indigo: '#5b4ce6',\n  purple: '#8a3ff0',\n  orange: '#fb7a32',\n  red:    '#ef5a5a',\n  rose:   '#f6608f',\n};\n\nexport type ActionKey = keyof typeof ACTION_GRADIENTS;\nexport type ToneKey = keyof typeof TONE_GRADIENTS;\n\nexport interface ActionButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Semantic action — hue signals the action, never decorative. */\n  action?: ActionKey;\n  /** Tone — for secondary/owner actions. Ignored when action is set. */\n  tone?: ToneKey;\n  icon?: React.ReactNode;\n  /** Tall 54px variant for hero contexts. */\n  big?: boolean;\n  /** Ghost: no gradient border, muted surface fill. */\n  ghost?: boolean;\n  /**\n   * Inline help/info affordance, rendered next to the label via `renderHelp`\n   * — a render-prop rather than a built-in tooltip because this package\n   * can't depend on an app-specific tooltip primitive.\n   */\n  helpContent?: string;\n  renderHelp?: (content: string) => React.ReactNode;\n}\n\nexport function ActionButton({\n  action,\n  tone,\n  icon,\n  big,\n  ghost,\n  helpContent,\n  renderHelp,\n  disabled,\n  children,\n  className,\n  style,\n  ...rest\n}: ActionButtonProps) {\n  const sizeClass = big\n    ? \"h-[54px] px-5 rounded-[13px] text-[15px]\"\n    : \"h-[46px] px-5 rounded-[13px] text-sm\";\n\n  if (ghost) {\n    return (\n      <button\n        {...rest}\n        disabled={disabled}\n        className={cn(\n          \"inline-flex items-center justify-center gap-2 font-semibold cursor-pointer whitespace-nowrap\",\n          \"bg-muted text-foreground border-none disabled:opacity-50 disabled:pointer-events-none\",\n          sizeClass,\n          className,\n        )}\n        style={style}\n      >\n        {icon}{children}\n        {helpContent && renderHelp ? renderHelp(helpContent) : null}\n      </button>\n    );\n  }\n\n  const gradColors =\n    action ? ACTION_GRADIENTS[action] :\n    tone   ? TONE_GRADIENTS[tone] :\n    ACTION_GRADIENTS.buy;\n\n  const fg =\n    action ? ACTION_FOREGROUNDS[action] :\n    tone   ? TONE_FOREGROUNDS[tone] :\n    ACTION_FOREGROUNDS.buy;\n\n  const grad = `linear-gradient(115deg, ${gradColors.join(',')})`;\n\n  return (\n    <button\n      {...rest}\n      disabled={disabled}\n      className={cn(\n        \"ml-gbtn inline-flex items-center justify-center gap-2 font-semibold cursor-pointer whitespace-nowrap\",\n        \"bg-card text-foreground border-none relative disabled:opacity-40 disabled:pointer-events-none\",\n        sizeClass,\n        className,\n      )}\n      style={{ '--ml-grad': grad, ...style } as React.CSSProperties}\n    >\n      {icon && <span className=\"inline-flex\" style={{ color: fg }}>{icon}</span>}\n      {children}\n      {helpContent && renderHelp ? renderHelp(helpContent) : null}\n    </button>\n  );\n}\n"],"mappings":";AAgFM,SAyCS,KAzCT;AA9EN,SAAS,UAAU;AAEnB,MAAM,mBAA6D;AAAA,EACjE,KAAS,CAAC,WAAW,WAAW,SAAS;AAAA,EACzC,QAAS,CAAC,WAAW,WAAW,SAAS;AAAA,EACzC,OAAS,CAAC,WAAW,WAAW,SAAS;AAAA,EACzC,OAAS,CAAC,WAAW,WAAW,SAAS;AAAA,EACzC,SAAS,CAAC,WAAW,WAAW,SAAS;AAC3C;AAEA,MAAM,qBAA6C;AAAA,EACjD,KAAS;AAAA,EACT,QAAS;AAAA,EACT,OAAS;AAAA,EACT,OAAS;AAAA,EACT,SAAS;AACX;AAEA,MAAM,iBAA2D;AAAA,EAC/D,MAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,EACxC,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,EACxC,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,EACxC,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,EACxC,KAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,EACxC,MAAQ,CAAC,WAAW,WAAW,SAAS;AAC1C;AAEA,MAAM,mBAA2C;AAAA,EAC/C,MAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,KAAQ;AAAA,EACR,MAAQ;AACV;AAwBO,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAsB;AACpB,QAAM,YAAY,MACd,6CACA;AAEJ,MAAI,OAAO;AACT,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ;AAAA,QACA,WAAW;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QACA;AAAA,QAEC;AAAA;AAAA,UAAM;AAAA,UACN,eAAe,aAAa,WAAW,WAAW,IAAI;AAAA;AAAA;AAAA,IACzD;AAAA,EAEJ;AAEA,QAAM,aACJ,SAAS,iBAAiB,MAAM,IAChC,OAAS,eAAe,IAAI,IAC5B,iBAAiB;AAEnB,QAAM,KACJ,SAAS,mBAAmB,MAAM,IAClC,OAAS,iBAAiB,IAAI,IAC9B,mBAAmB;AAErB,QAAM,OAAO,2BAA2B,WAAW,KAAK,GAAG,CAAC;AAE5D,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MACA,OAAO,EAAE,aAAa,MAAM,GAAG,MAAM;AAAA,MAEpC;AAAA,gBAAQ,oBAAC,UAAK,WAAU,eAAc,OAAO,EAAE,OAAO,GAAG,GAAI,gBAAK;AAAA,QAClE;AAAA,QACA,eAAe,aAAa,WAAW,WAAW,IAAI;AAAA;AAAA;AAAA,EACzD;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/components/action-button.tsx"],"sourcesContent":["\"use client\";\n\nimport { cn } from \"../utils/cn.js\";\n\nconst ACTION_GRADIENTS: Record<string, [string, string, string]> = {\n  buy:     ['#3b7bff', '#8a5cf6', '#3b7bff'],\n  submit:  ['#d6359a', '#5b4ce6', '#d6359a'],\n  offer:   ['#f6608f', '#fb8b46', '#f6608f'],\n  remix:   ['#8a5cf6', '#f6608f', '#8a5cf6'],\n  license: ['#3b7bff', '#5b4ce6', '#3b7bff'],\n};\n\nconst ACTION_FOREGROUNDS: Record<string, string> = {\n  buy:     '#3b7bff',\n  submit:  '#5b4ce6',\n  offer:   '#fb7a32',\n  remix:   '#8a3ff0',\n  license: '#3b7bff',\n};\n\nconst TONE_GRADIENTS: Record<string, [string, string, string]> = {\n  blue:   ['#3b7bff', '#5b4ce6', '#3b7bff'],\n  indigo: ['#5b4ce6', '#8a5cf6', '#5b4ce6'],\n  purple: ['#8a5cf6', '#f6608f', '#8a5cf6'],\n  orange: ['#fb8b46', '#f6608f', '#fb8b46'],\n  red:    ['#ef5a5a', '#f6608f', '#ef5a5a'],\n  rose:   ['#f6608f', '#fb8b46', '#f6608f'],\n};\n\nconst TONE_FOREGROUNDS: Record<string, string> = {\n  blue:   '#2f6bff',\n  indigo: '#5b4ce6',\n  purple: '#8a3ff0',\n  orange: '#fb7a32',\n  red:    '#ef5a5a',\n  rose:   '#f6608f',\n};\n\nexport type ActionKey = keyof typeof ACTION_GRADIENTS;\nexport type ToneKey = keyof typeof TONE_GRADIENTS;\n\nexport interface ActionButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Semantic action — hue signals the action, never decorative. */\n  action?: ActionKey;\n  /** Tone — for secondary/owner actions. Ignored when action is set. */\n  tone?: ToneKey;\n  icon?: React.ReactNode;\n  /** Tall 54px variant for hero contexts. */\n  big?: boolean;\n  /** Ghost: no gradient border, muted surface fill. */\n  ghost?: boolean;\n  /**\n   * Inline help/info affordance, rendered next to the label via `renderHelp`\n   * — a render-prop rather than a built-in tooltip because this package\n   * can't depend on an app-specific tooltip primitive.\n   */\n  helpContent?: string;\n  renderHelp?: (content: string) => React.ReactNode;\n}\n\nexport function ActionButton({\n  action,\n  tone,\n  icon,\n  big,\n  ghost,\n  helpContent,\n  renderHelp,\n  disabled,\n  children,\n  className,\n  style,\n  ...rest\n}: ActionButtonProps) {\n  const sizeClass = big\n    ? \"h-[54px] px-5 rounded-[13px] text-[15px]\"\n    : \"h-[46px] px-5 rounded-[13px] text-sm\";\n\n  if (ghost) {\n    return (\n      <button\n        {...rest}\n        disabled={disabled}\n        className={cn(\n          \"inline-flex items-center justify-center gap-2 font-semibold cursor-pointer whitespace-nowrap\",\n          \"bg-muted text-foreground border-none disabled:opacity-50 disabled:pointer-events-none\",\n          sizeClass,\n          className,\n        )}\n        style={style}\n      >\n        {icon}{children}\n        {helpContent && renderHelp ? renderHelp(helpContent) : null}\n      </button>\n    );\n  }\n\n  const gradColors =\n    action ? ACTION_GRADIENTS[action] :\n    tone   ? TONE_GRADIENTS[tone] :\n    ACTION_GRADIENTS.buy;\n\n  const fg =\n    action ? ACTION_FOREGROUNDS[action] :\n    tone   ? TONE_FOREGROUNDS[tone] :\n    ACTION_FOREGROUNDS.buy;\n\n  const grad = `linear-gradient(115deg, ${gradColors.join(',')})`;\n\n  return (\n    <button\n      {...rest}\n      disabled={disabled}\n      className={cn(\n        \"ml-gbtn inline-flex items-center justify-center gap-2 font-semibold cursor-pointer whitespace-nowrap\",\n        \"bg-transparent text-foreground border-none relative disabled:opacity-40 disabled:pointer-events-none\",\n        sizeClass,\n        className,\n      )}\n      style={{ '--ml-grad': grad, ...style } as React.CSSProperties}\n    >\n      {icon && <span className=\"inline-flex\" style={{ color: fg }}>{icon}</span>}\n      {children}\n      {helpContent && renderHelp ? renderHelp(helpContent) : null}\n    </button>\n  );\n}\n"],"mappings":";AAgFM,SAyCS,KAzCT;AA9EN,SAAS,UAAU;AAEnB,MAAM,mBAA6D;AAAA,EACjE,KAAS,CAAC,WAAW,WAAW,SAAS;AAAA,EACzC,QAAS,CAAC,WAAW,WAAW,SAAS;AAAA,EACzC,OAAS,CAAC,WAAW,WAAW,SAAS;AAAA,EACzC,OAAS,CAAC,WAAW,WAAW,SAAS;AAAA,EACzC,SAAS,CAAC,WAAW,WAAW,SAAS;AAC3C;AAEA,MAAM,qBAA6C;AAAA,EACjD,KAAS;AAAA,EACT,QAAS;AAAA,EACT,OAAS;AAAA,EACT,OAAS;AAAA,EACT,SAAS;AACX;AAEA,MAAM,iBAA2D;AAAA,EAC/D,MAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,EACxC,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,EACxC,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,EACxC,QAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,EACxC,KAAQ,CAAC,WAAW,WAAW,SAAS;AAAA,EACxC,MAAQ,CAAC,WAAW,WAAW,SAAS;AAC1C;AAEA,MAAM,mBAA2C;AAAA,EAC/C,MAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,KAAQ;AAAA,EACR,MAAQ;AACV;AAwBO,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAsB;AACpB,QAAM,YAAY,MACd,6CACA;AAEJ,MAAI,OAAO;AACT,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ;AAAA,QACA,WAAW;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QACA;AAAA,QAEC;AAAA;AAAA,UAAM;AAAA,UACN,eAAe,aAAa,WAAW,WAAW,IAAI;AAAA;AAAA;AAAA,IACzD;AAAA,EAEJ;AAEA,QAAM,aACJ,SAAS,iBAAiB,MAAM,IAChC,OAAS,eAAe,IAAI,IAC5B,iBAAiB;AAEnB,QAAM,KACJ,SAAS,mBAAmB,MAAM,IAClC,OAAS,iBAAiB,IAAI,IAC9B,mBAAmB;AAErB,QAAM,OAAO,2BAA2B,WAAW,KAAK,GAAG,CAAC;AAE5D,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MACA,OAAO,EAAE,aAAa,MAAM,GAAG,MAAM;AAAA,MAEpC;AAAA,gBAAQ,oBAAC,UAAK,WAAU,eAAc,OAAO,EAAE,OAAO,GAAG,GAAI,gBAAK;AAAA,QAClE;AAAA,QACA,eAAe,aAAa,WAAW,WAAW,IAAI;AAAA;AAAA;AAAA,EACzD;AAEJ;","names":[]}

package/dist/components/gradient-button.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/gradient-button.tsx"],"sourcesContent":["\"use client\";\n\nimport { cn } from \"../utils/cn.js\";\n\nexport interface GradientButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Tall 54px variant for hero contexts (onboarding, primary page CTAs). */\n  big?: boolean;\n  /** Outer wrapper class (the `.btn-border-animated` ring) — rarely needed. */\n  wrapperClassName?: string;\n}\n\n/**\n * The full-spectrum animated-gradient CTA — `.btn-border-animated` as a 1px\n * wrapper around a transparent-fill button, so the ring reads as a solid,\n * continuously shifting brand-gradient fill (blue → purple → rose → orange).\n * This is the primary-action treatment used across medialane.io/starknet.medialane.io\n * (e.g. \"Connect wallet\", \"Buy now\") — previously hand-copied per call site;\n * this component is the single source.\n *\n * For the secondary animated-border treatment (a neutral `bg-card` fill with\n * only the border animated), use `ActionButton` instead.\n */\nexport function GradientButton({ big, children, className, wrapperClassName, ...rest }: GradientButtonProps) {\n  const sizeClass = big\n    ? \"h-[54px] px-5 rounded-[15px] text-[15px]\"\n    : \"h-12 px-5 rounded-[11px] text-sm\";\n\n  return (\n    <div className={cn(\"btn-border-animated w-full p-[1px]\", big ? \"rounded-2xl\" : \"rounded-xl\", wrapperClassName)}>\n      <button\n        {...rest}\n        className={cn(\n          \"inline-flex w-full items-center justify-center gap-2 whitespace-nowrap font-semibold text-white\",\n          \"border-none bg-transparent transition-all hover:brightness-110 active:scale-[0.98]\",\n          sizeClass,\n          className,\n        )}\n      >\n        {children}\n      </button>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA6BM;AA3BN,gBAAmB;AAoBZ,SAAS,eAAe,EAAE,KAAK,UAAU,WAAW,kBAAkB,GAAG,KAAK,GAAwB;AAC3G,QAAM,YAAY,MACd,6CACA;AAEJ,SACE,4CAAC,SAAI,eAAW,cAAG,sCAAsC,MAAM,gBAAgB,cAAc,gBAAgB,GAC3G;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,eAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,EACH,GACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/components/gradient-button.tsx"],"sourcesContent":["\"use client\";\n\nimport { cn } from \"../utils/cn.js\";\n\nexport interface GradientButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Tall 54px variant for hero contexts (onboarding, primary page CTAs). */\n  big?: boolean;\n  /** Outer wrapper class (the `.btn-border-animated` ring) — rarely needed. */\n  wrapperClassName?: string;\n}\n\n/**\n * The full-spectrum animated-gradient CTA — `.btn-border-animated` as a 1px\n * wrapper around a transparent-fill button, so the ring reads as a solid,\n * continuously shifting brand-gradient fill (blue → purple → rose → orange).\n * This is the primary-action treatment used across medialane.io/starknet.medialane.io\n * (e.g. \"Connect wallet\", \"Buy now\") — previously hand-copied per call site;\n * this component is the single source.\n *\n * For the secondary animated-border treatment (transparent fill, only the\n * per-action gradient border and colored icon/text), use `ActionButton` instead.\n */\nexport function GradientButton({ big, children, className, wrapperClassName, ...rest }: GradientButtonProps) {\n  const sizeClass = big\n    ? \"h-[54px] px-5 rounded-[15px] text-[15px]\"\n    : \"h-12 px-5 rounded-[11px] text-sm\";\n\n  return (\n    <div className={cn(\"btn-border-animated w-full p-[1px]\", big ? \"rounded-2xl\" : \"rounded-xl\", wrapperClassName)}>\n      <button\n        {...rest}\n        className={cn(\n          \"inline-flex w-full items-center justify-center gap-2 whitespace-nowrap font-semibold text-white\",\n          \"border-none bg-transparent transition-all hover:brightness-110 active:scale-[0.98]\",\n          sizeClass,\n          className,\n        )}\n      >\n        {children}\n      </button>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA6BM;AA3BN,gBAAmB;AAoBZ,SAAS,eAAe,EAAE,KAAK,UAAU,WAAW,kBAAkB,GAAG,KAAK,GAAwB;AAC3G,QAAM,YAAY,MACd,6CACA;AAEJ,SACE,4CAAC,SAAI,eAAW,cAAG,sCAAsC,MAAM,gBAAgB,cAAc,gBAAgB,GAC3G;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,eAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,EACH,GACF;AAEJ;","names":[]}

package/dist/components/gradient-button.d.cts

@@ -14,8 +14,8 @@ interface GradientButtonProps extends React.ButtonHTMLAttributes<HTMLButtonEleme
  * (e.g. "Connect wallet", "Buy now") — previously hand-copied per call site;
  * this component is the single source.
  *
- * For the secondary animated-border treatment (a neutral `bg-card` fill with
- * only the border animated), use `ActionButton` instead.
+ * For the secondary animated-border treatment (transparent fill, only the
+ * per-action gradient border and colored icon/text), use `ActionButton` instead.
  */
 declare function GradientButton({ big, children, className, wrapperClassName, ...rest }: GradientButtonProps): react_jsx_runtime.JSX.Element;
 

package/dist/components/gradient-button.d.ts

@@ -14,8 +14,8 @@ interface GradientButtonProps extends React.ButtonHTMLAttributes<HTMLButtonEleme
  * (e.g. "Connect wallet", "Buy now") — previously hand-copied per call site;
  * this component is the single source.
  *
- * For the secondary animated-border treatment (a neutral `bg-card` fill with
- * only the border animated), use `ActionButton` instead.
+ * For the secondary animated-border treatment (transparent fill, only the
+ * per-action gradient border and colored icon/text), use `ActionButton` instead.
  */
 declare function GradientButton({ big, children, className, wrapperClassName, ...rest }: GradientButtonProps): react_jsx_runtime.JSX.Element;
 

package/dist/components/gradient-button.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/gradient-button.tsx"],"sourcesContent":["\"use client\";\n\nimport { cn } from \"../utils/cn.js\";\n\nexport interface GradientButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Tall 54px variant for hero contexts (onboarding, primary page CTAs). */\n  big?: boolean;\n  /** Outer wrapper class (the `.btn-border-animated` ring) — rarely needed. */\n  wrapperClassName?: string;\n}\n\n/**\n * The full-spectrum animated-gradient CTA — `.btn-border-animated` as a 1px\n * wrapper around a transparent-fill button, so the ring reads as a solid,\n * continuously shifting brand-gradient fill (blue → purple → rose → orange).\n * This is the primary-action treatment used across medialane.io/starknet.medialane.io\n * (e.g. \"Connect wallet\", \"Buy now\") — previously hand-copied per call site;\n * this component is the single source.\n *\n * For the secondary animated-border treatment (a neutral `bg-card` fill with\n * only the border animated), use `ActionButton` instead.\n */\nexport function GradientButton({ big, children, className, wrapperClassName, ...rest }: GradientButtonProps) {\n  const sizeClass = big\n    ? \"h-[54px] px-5 rounded-[15px] text-[15px]\"\n    : \"h-12 px-5 rounded-[11px] text-sm\";\n\n  return (\n    <div className={cn(\"btn-border-animated w-full p-[1px]\", big ? \"rounded-2xl\" : \"rounded-xl\", wrapperClassName)}>\n      <button\n        {...rest}\n        className={cn(\n          \"inline-flex w-full items-center justify-center gap-2 whitespace-nowrap font-semibold text-white\",\n          \"border-none bg-transparent transition-all hover:brightness-110 active:scale-[0.98]\",\n          sizeClass,\n          className,\n        )}\n      >\n        {children}\n      </button>\n    </div>\n  );\n}\n"],"mappings":";AA6BM;AA3BN,SAAS,UAAU;AAoBZ,SAAS,eAAe,EAAE,KAAK,UAAU,WAAW,kBAAkB,GAAG,KAAK,GAAwB;AAC3G,QAAM,YAAY,MACd,6CACA;AAEJ,SACE,oBAAC,SAAI,WAAW,GAAG,sCAAsC,MAAM,gBAAgB,cAAc,gBAAgB,GAC3G;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,EACH,GACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/components/gradient-button.tsx"],"sourcesContent":["\"use client\";\n\nimport { cn } from \"../utils/cn.js\";\n\nexport interface GradientButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Tall 54px variant for hero contexts (onboarding, primary page CTAs). */\n  big?: boolean;\n  /** Outer wrapper class (the `.btn-border-animated` ring) — rarely needed. */\n  wrapperClassName?: string;\n}\n\n/**\n * The full-spectrum animated-gradient CTA — `.btn-border-animated` as a 1px\n * wrapper around a transparent-fill button, so the ring reads as a solid,\n * continuously shifting brand-gradient fill (blue → purple → rose → orange).\n * This is the primary-action treatment used across medialane.io/starknet.medialane.io\n * (e.g. \"Connect wallet\", \"Buy now\") — previously hand-copied per call site;\n * this component is the single source.\n *\n * For the secondary animated-border treatment (transparent fill, only the\n * per-action gradient border and colored icon/text), use `ActionButton` instead.\n */\nexport function GradientButton({ big, children, className, wrapperClassName, ...rest }: GradientButtonProps) {\n  const sizeClass = big\n    ? \"h-[54px] px-5 rounded-[15px] text-[15px]\"\n    : \"h-12 px-5 rounded-[11px] text-sm\";\n\n  return (\n    <div className={cn(\"btn-border-animated w-full p-[1px]\", big ? \"rounded-2xl\" : \"rounded-xl\", wrapperClassName)}>\n      <button\n        {...rest}\n        className={cn(\n          \"inline-flex w-full items-center justify-center gap-2 whitespace-nowrap font-semibold text-white\",\n          \"border-none bg-transparent transition-all hover:brightness-110 active:scale-[0.98]\",\n          sizeClass,\n          className,\n        )}\n      >\n        {children}\n      </button>\n    </div>\n  );\n}\n"],"mappings":";AA6BM;AA3BN,SAAS,UAAU;AAoBZ,SAAS,eAAe,EAAE,KAAK,UAAU,WAAW,kBAAkB,GAAG,KAAK,GAAwB;AAC3G,QAAM,YAAY,MACd,6CACA;AAEJ,SACE,oBAAC,SAAI,WAAW,GAAG,sCAAsC,MAAM,gBAAgB,cAAc,gBAAgB,GAC3G;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,EACH,GACF;AAEJ;","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@medialane/ui",
-  "version": "0.94.6",
+  "version": "0.94.7",
   "description": "Shared UI components for Medialane apps",
   "type": "module",
   "sideEffects": false,