@0xsquid/ui 2.4.6 → 2.4.7

package/dist/cjs/index.js

@@ -18895,10 +18895,10 @@ function ModalContentDivider() {
 }
 
 function NavigationBar(_a) {
-    var { title, displayBackButton = false, logoUrl, transparent = false, displayButtonShadows = false, onBackButtonClick, actions, isLoading = false, subtitle } = _a, props = __rest$1(_a, ["title", "displayBackButton", "logoUrl", "transparent", "displayButtonShadows", "onBackButtonClick", "actions", "isLoading", "subtitle"]);
+    var { title, displayBackButton = false, logoUrl, transparent = false, displayButtonShadows = false, onBackButtonClick, actions, isLoading = false, subtitle, paddingRight = 0 } = _a, props = __rest$1(_a, ["title", "displayBackButton", "logoUrl", "transparent", "displayButtonShadows", "onBackButtonClick", "actions", "isLoading", "subtitle", "paddingRight"]);
     return (jsxRuntime.jsxs("nav", Object.assign({}, props, { className: cn("tw-flex tw-max-h-[120px] tw-flex-row-reverse tw-text-grey-300 mobile-xs-height:tw-flex-col", transparent ? "tw-bg-transparent" : "tw-bg-grey-900", props.className), children: [jsxRuntime.jsxs("div", { className: cn("tw-flex tw-h-squid-xxl tw-items-center tw-justify-end tw-gap-x-squid-xs tw-pl-squid-m", displayBackButton
                     ? "tw-w-full tw-pr-squid-xs mobile-xs-height:tw-pr-squid-m"
-                    : "tw-pr-squid-m mobile-lg:tw-pl-squid-l", !title && "tw-w-full mobile-xs-height:tw-w-[unset]"), children: [displayBackButton ? (jsxRuntime.jsx(Button$1, { className: displayButtonShadows
+                    : "tw-pr-squid-m mobile-lg:tw-pl-squid-l", !title && "tw-w-full mobile-xs-height:tw-w-[unset]"), style: { paddingRight: paddingRight ? `${paddingRight}px` : undefined }, children: [displayBackButton ? (jsxRuntime.jsx(Button$1, { className: displayButtonShadows
                             ? "group-data-[squid-theme-type=dark]:tw-shadow-elevation-dark-2 group-data-[squid-theme-type=light]:tw-shadow-elevation-light-2"
                             : undefined, variant: "tertiary", size: "md", isLoading: isLoading, icon: jsxRuntime.jsx(ArrowLeftIcon, {}), onClick: onBackButtonClick })) : null, logoUrl ? (jsxRuntime.jsx("img", { src: logoUrl, className: "tw-h-squid-xl tw-min-w-squid-xl" })) : null, jsxRuntime.jsx("span", { className: "tw-flex tw-flex-1 tw-items-center tw-justify-end tw-gap-squid-xxs", children: actions === null || actions === void 0 ? void 0 : actions.map((action) => {
                             var _a;

package/dist/cjs/types/components/layout/NavigationBar.d.ts

@@ -18,6 +18,7 @@ interface NavigationBarProps extends React.ComponentProps<"nav"> {
     actions?: ActionButton[];
     isLoading?: boolean;
     subtitle?: string;
+    paddingRight?: number;
 }
-export declare function NavigationBar({ title, displayBackButton, logoUrl, transparent, displayButtonShadows, onBackButtonClick, actions, isLoading, subtitle, ...props }: NavigationBarProps): import("react/jsx-runtime").JSX.Element;
+export declare function NavigationBar({ title, displayBackButton, logoUrl, transparent, displayButtonShadows, onBackButtonClick, actions, isLoading, subtitle, paddingRight, ...props }: NavigationBarProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/cjs/types/stories/layout/NavigationBar.stories.d.ts

@@ -17,3 +17,4 @@ export declare const AllProps: Story;
 export declare const Loading: Story;
 export declare const LoadingAndSubtitle: Story;
 export declare const Transparent: Story;
+export declare const ActionsWithPadding: Story;

package/dist/esm/index.js

@@ -18875,10 +18875,10 @@ function ModalContentDivider() {
 }
 
 function NavigationBar(_a) {
-    var { title, displayBackButton = false, logoUrl, transparent = false, displayButtonShadows = false, onBackButtonClick, actions, isLoading = false, subtitle } = _a, props = __rest$1(_a, ["title", "displayBackButton", "logoUrl", "transparent", "displayButtonShadows", "onBackButtonClick", "actions", "isLoading", "subtitle"]);
+    var { title, displayBackButton = false, logoUrl, transparent = false, displayButtonShadows = false, onBackButtonClick, actions, isLoading = false, subtitle, paddingRight = 0 } = _a, props = __rest$1(_a, ["title", "displayBackButton", "logoUrl", "transparent", "displayButtonShadows", "onBackButtonClick", "actions", "isLoading", "subtitle", "paddingRight"]);
     return (jsxs("nav", Object.assign({}, props, { className: cn("tw-flex tw-max-h-[120px] tw-flex-row-reverse tw-text-grey-300 mobile-xs-height:tw-flex-col", transparent ? "tw-bg-transparent" : "tw-bg-grey-900", props.className), children: [jsxs("div", { className: cn("tw-flex tw-h-squid-xxl tw-items-center tw-justify-end tw-gap-x-squid-xs tw-pl-squid-m", displayBackButton
                     ? "tw-w-full tw-pr-squid-xs mobile-xs-height:tw-pr-squid-m"
-                    : "tw-pr-squid-m mobile-lg:tw-pl-squid-l", !title && "tw-w-full mobile-xs-height:tw-w-[unset]"), children: [displayBackButton ? (jsx(Button$1, { className: displayButtonShadows
+                    : "tw-pr-squid-m mobile-lg:tw-pl-squid-l", !title && "tw-w-full mobile-xs-height:tw-w-[unset]"), style: { paddingRight: paddingRight ? `${paddingRight}px` : undefined }, children: [displayBackButton ? (jsx(Button$1, { className: displayButtonShadows
                             ? "group-data-[squid-theme-type=dark]:tw-shadow-elevation-dark-2 group-data-[squid-theme-type=light]:tw-shadow-elevation-light-2"
                             : undefined, variant: "tertiary", size: "md", isLoading: isLoading, icon: jsx(ArrowLeftIcon, {}), onClick: onBackButtonClick })) : null, logoUrl ? (jsx("img", { src: logoUrl, className: "tw-h-squid-xl tw-min-w-squid-xl" })) : null, jsx("span", { className: "tw-flex tw-flex-1 tw-items-center tw-justify-end tw-gap-squid-xxs", children: actions === null || actions === void 0 ? void 0 : actions.map((action) => {
                             var _a;

package/dist/esm/types/components/layout/NavigationBar.d.ts

@@ -18,6 +18,7 @@ interface NavigationBarProps extends React.ComponentProps<"nav"> {
     actions?: ActionButton[];
     isLoading?: boolean;
     subtitle?: string;
+    paddingRight?: number;
 }
-export declare function NavigationBar({ title, displayBackButton, logoUrl, transparent, displayButtonShadows, onBackButtonClick, actions, isLoading, subtitle, ...props }: NavigationBarProps): import("react/jsx-runtime").JSX.Element;
+export declare function NavigationBar({ title, displayBackButton, logoUrl, transparent, displayButtonShadows, onBackButtonClick, actions, isLoading, subtitle, paddingRight, ...props }: NavigationBarProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/esm/types/stories/layout/NavigationBar.stories.d.ts

@@ -17,3 +17,4 @@ export declare const AllProps: Story;
 export declare const Loading: Story;
 export declare const LoadingAndSubtitle: Story;
 export declare const Transparent: Story;
+export declare const ActionsWithPadding: Story;

package/dist/index.d.ts

@@ -1609,8 +1609,9 @@ interface NavigationBarProps extends React.ComponentProps<"nav"> {
     actions?: ActionButton[];
     isLoading?: boolean;
     subtitle?: string;
+    paddingRight?: number;
 }
-declare function NavigationBar({ title, displayBackButton, logoUrl, transparent, displayButtonShadows, onBackButtonClick, actions, isLoading, subtitle, ...props }: NavigationBarProps): react_jsx_runtime.JSX.Element;
+declare function NavigationBar({ title, displayBackButton, logoUrl, transparent, displayButtonShadows, onBackButtonClick, actions, isLoading, subtitle, paddingRight, ...props }: NavigationBarProps): react_jsx_runtime.JSX.Element;
 
 declare function PipeSeparator(props: ComponentProps<"div">): react_jsx_runtime.JSX.Element;
 

package/package.json

@@ -5,7 +5,7 @@
     "url": "git+https://github.com/0xsquid/squid-ui.git"
   },
   "description": "Squid's UI components",
-  "version": "2.4.6",
+  "version": "2.4.7",
   "author": "",
   "license": "MIT",
   "resolutions": {