@gearbox-protocol/ui-kit 3.14.0-next.28 → 3.14.0-next.29

package/dist/cjs/components/layout/app-header/app-header.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),j=require("react"),s=require("../../app-bar/app-bar.cjs"),i=require("../../base-link/base-link.cjs"),c=require("../../navbar-logo/navbar-logo.cjs"),b=require("../../../utils/cn.cjs"),o=require("../../../utils/static.cjs");function S(t){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const r=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(a,n,r.get?r:{enumerable:!0,get:()=>t[n]})}}return a.default=t,Object.freeze(a)}const N=S(j);function L({href:t}){return e.jsx(i.BaseLink,{size:"unset",variant:"unset",color:"main",href:t,className:"inline-flex",children:e.jsx(c.NavBarLogo,{src:o.getStatic("/logo/logo_monochrome_white.png"),srcSet:`${o.getStatic("/logo/logo_monochrome_white.png")} 1x, ${o.getStatic("/logo/logo_monochrome_white@2x.png")} 2x, ${o.getStatic("/logo/logo_monochrome_white@2x.png")} 3x`,alt:"Logo",style:{height:"32px"},className:"w-auto cursor-pointer"})})}function w({href:t}){return e.jsx(i.BaseLink,{size:"unset",variant:"unset",color:"main",href:t,className:"inline-flex",children:e.jsx(c.NavBarLogo,{src:o.getStatic("/logo/sign_monochrome_white.png"),srcSet:`${o.getStatic("/logo/sign_monochrome_white.png")} 1x, ${o.getStatic("/logo/sign_monochrome_white@2x.png")} 2x, ${o.getStatic("/logo/sign_monochrome_white@2x.png")} 3x`,alt:"Logo",style:{height:"34px",marginLeft:"4px",marginTop:"4px"},className:"w-auto cursor-pointer"})})}const l=N.forwardRef(({homeHref:t="/",desktopLogo:a,mobileLogo:n,mobileMenu:r,tabs:g,actions:p,wallet:d,leftTestId:m,centerTestId:u,rightTestId:h,className:x,..._},f)=>e.jsxs(s.AppBar,{ref:f,className:b.cn("!h-14 md:px-4 lg:px-10",x),..._,children:[e.jsxs(s.AppBarSidePanel,{"data-testid":m,children:[r&&e.jsx("div",{className:"block lg:hidden",children:r}),e.jsx("div",{className:"hidden lg:block",children:a??e.jsx(L,{href:t})}),e.jsx("div",{className:"block lg:hidden",children:n??e.jsx(w,{href:t})})]}),e.jsx(s.AppBarCenter,{"data-testid":u,className:"md:px-0 lg:px-3",children:e.jsx(s.AppBarCenterContent,{className:"md:hidden lg:block",children:g})}),e.jsxs(s.AppBarSidePanel,{"data-testid":h,className:"ml-auto",children:[p,d]})]}));l.displayName="AppHeader";exports.AppHeader=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),b=require("react"),s=require("../../app-bar/app-bar.cjs"),i=require("../../base-link/base-link.cjs"),c=require("../../navbar-logo/navbar-logo.cjs"),S=require("../../../utils/cn.cjs"),o=require("../../../utils/static.cjs");function N(t){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const r=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(a,n,r.get?r:{enumerable:!0,get:()=>t[n]})}}return a.default=t,Object.freeze(a)}const L=N(b);function w({href:t}){return e.jsx(i.BaseLink,{size:"unset",variant:"unset",color:"main",href:t,className:"inline-flex",children:e.jsx(c.NavBarLogo,{src:o.getStatic("/logo/logo_monochrome_white.png"),srcSet:`${o.getStatic("/logo/logo_monochrome_white.png")} 1x, ${o.getStatic("/logo/logo_monochrome_white@2x.png")} 2x, ${o.getStatic("/logo/logo_monochrome_white@2x.png")} 3x`,alt:"Logo",style:{height:"32px"},className:"w-auto cursor-pointer"})})}function v({href:t}){return e.jsx(i.BaseLink,{size:"unset",variant:"unset",color:"main",href:t,className:"inline-flex",children:e.jsx(c.NavBarLogo,{src:o.getStatic("/logo/sign_monochrome_white.png"),srcSet:`${o.getStatic("/logo/sign_monochrome_white.png")} 1x, ${o.getStatic("/logo/sign_monochrome_white@2x.png")} 2x, ${o.getStatic("/logo/sign_monochrome_white@2x.png")} 3x`,alt:"Logo",style:{height:"34px",marginLeft:"4px",marginTop:"4px"},className:"w-auto cursor-pointer"})})}const l=L.forwardRef(({homeHref:t="/",desktopLogo:a,mobileLogo:n,mobileMenu:r,tabs:g,actions:p,wallet:d,extraMenu:m,leftTestId:u,centerTestId:h,rightTestId:x,className:_,...f},j)=>e.jsxs(s.AppBar,{ref:j,className:S.cn("!h-14 md:px-4 lg:px-10",_),...f,children:[e.jsxs(s.AppBarSidePanel,{"data-testid":u,children:[r&&e.jsx("div",{className:"block lg:hidden",children:r}),e.jsx("div",{className:"hidden lg:block",children:a??e.jsx(w,{href:t})}),e.jsx("div",{className:"block lg:hidden",children:n??e.jsx(v,{href:t})})]}),e.jsx(s.AppBarCenter,{"data-testid":h,className:"md:px-0 lg:px-3",children:e.jsx(s.AppBarCenterContent,{className:"md:hidden lg:block",children:g})}),e.jsxs(s.AppBarSidePanel,{"data-testid":x,className:"ml-auto",children:[p,d,m]})]}));l.displayName="AppHeader";exports.AppHeader=l;

package/dist/esm/components/layout/app-header/app-header.js

@@ -1,11 +1,11 @@
 import { jsxs as n, jsx as o } from "react/jsx-runtime";
-import * as N from "react";
-import { AppBar as w, AppBarSidePanel as i, AppBarCenter as L, AppBarCenterContent as k } from "../../app-bar/app-bar.js";
+import * as w from "react";
+import { AppBar as L, AppBarSidePanel as i, AppBarCenter as k, AppBarCenterContent as v } from "../../app-bar/app-bar.js";
 import { BaseLink as a } from "../../base-link/base-link.js";
 import { NavBarLogo as l } from "../../navbar-logo/navbar-logo.js";
-import { cn as v } from "../../../utils/cn.js";
+import { cn as A } from "../../../utils/cn.js";
 import { getStatic as e } from "../../../utils/static.js";
-function A({ href: r }) {
+function B({ href: r }) {
   return /* @__PURE__ */ o(
     a,
     {
@@ -31,7 +31,7 @@ function A({ href: r }) {
     }
   );
 }
-function B({ href: r }) {
+function $({ href: r }) {
   return /* @__PURE__ */ o(
     a,
     {
@@ -57,7 +57,7 @@ function B({ href: r }) {
     }
   );
 }
-const $ = N.forwardRef(
+const b = w.forwardRef(
   ({
     homeHref: r = "/",
     desktopLogo: s,
@@ -66,33 +66,35 @@ const $ = N.forwardRef(
     tabs: c,
     actions: p,
     wallet: g,
-    leftTestId: h,
-    centerTestId: d,
-    rightTestId: x,
-    className: f,
-    ..._
-  }, u) => /* @__PURE__ */ n(
-    w,
+    extraMenu: h,
+    leftTestId: d,
+    centerTestId: x,
+    rightTestId: f,
+    className: _,
+    ...u
+  }, N) => /* @__PURE__ */ n(
+    L,
     {
-      ref: u,
-      className: v("!h-14 md:px-4 lg:px-10", f),
-      ..._,
+      ref: N,
+      className: A("!h-14 md:px-4 lg:px-10", _),
+      ...u,
       children: [
-        /* @__PURE__ */ n(i, { "data-testid": h, children: [
+        /* @__PURE__ */ n(i, { "data-testid": d, children: [
           t && /* @__PURE__ */ o("div", { className: "block lg:hidden", children: t }),
-          /* @__PURE__ */ o("div", { className: "hidden lg:block", children: s ?? /* @__PURE__ */ o(A, { href: r }) }),
-          /* @__PURE__ */ o("div", { className: "block lg:hidden", children: m ?? /* @__PURE__ */ o(B, { href: r }) })
+          /* @__PURE__ */ o("div", { className: "hidden lg:block", children: s ?? /* @__PURE__ */ o(B, { href: r }) }),
+          /* @__PURE__ */ o("div", { className: "block lg:hidden", children: m ?? /* @__PURE__ */ o($, { href: r }) })
         ] }),
-        /* @__PURE__ */ o(L, { "data-testid": d, className: "md:px-0 lg:px-3", children: /* @__PURE__ */ o(k, { className: "md:hidden lg:block", children: c }) }),
-        /* @__PURE__ */ n(i, { "data-testid": x, className: "ml-auto", children: [
+        /* @__PURE__ */ o(k, { "data-testid": x, className: "md:px-0 lg:px-3", children: /* @__PURE__ */ o(v, { className: "md:hidden lg:block", children: c }) }),
+        /* @__PURE__ */ n(i, { "data-testid": f, className: "ml-auto", children: [
           p,
-          g
+          g,
+          h
         ] })
       ]
     }
   )
 );
-$.displayName = "AppHeader";
+b.displayName = "AppHeader";
 export {
-  $ as AppHeader
+  b as AppHeader
 };

package/dist/types/components/layout/app-header/app-header.d.ts

@@ -30,6 +30,10 @@ export interface AppHeaderProps extends React.HTMLAttributes<HTMLElement> {
      * Wallet / connect button area, rendered on the right.
      */
     wallet?: React.ReactNode;
+    /**
+     * Optional dots menu placed after the wallet (e.g. settings, docs links).
+     */
+    extraMenu?: React.ReactNode;
     /**
      * Optional `data-testid` applied to the left side panel.
      */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gearbox-protocol/ui-kit",
-  "version": "3.14.0-next.28",
+  "version": "3.14.0-next.29",
   "description": "Internal UI components",
   "repository": {
     "type": "git",