@eleventheye/asui 2.7.0 → 2.7.1

package/dist/apptypes/ASUI.types.d.ts

@@ -207,15 +207,20 @@ export interface ASStyleOptions {
     $padding?: string;
     $margin?: string;
     $maxWidth?: number;
+    $maxWidthUnit?: string;
     $minWidth?: number;
+    $minWidthUnit?: string;
     $height?: number;
+    $heightUnit?: string;
     $width?: number;
+    $widthUnit?: string;
 }
 export interface ASNavBarStyleOptions extends ASStyleOptions {
     $displayModeOverride: ASDisplayMode;
     $mobileBreakpoint: number;
     $disableTransitionsBetweenDisplayModes: boolean;
     $hideNavArrowButtonsInDW: boolean;
+    $hideHorizontalScrollbarInDW: boolean;
 }
 export {};
 //# sourceMappingURL=ASUI.types.d.ts.map

package/dist/apptypes/ASUI.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ASUI.types.d.ts","sourceRoot":"","sources":["../../src/apptypes/ASUI.types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"ASUI.types.d.ts","sourceRoot":"","sources":["../../src/apptypes/ASUI.types.ts"],"names":[],"mappings":"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"}

package/dist/asnavbar/ASNavBar.d.ts

@@ -2,6 +2,8 @@ import React from 'react';
 import { ASNavBarStyleOptions } from '../apptypes/ASUI.types';
 import { ASNavBarProps } from './ASNavBar.types';
 export declare const defaultNavBarStyleOptions: ASNavBarStyleOptions;
+export declare const defaultNavBarDWStyleOptions: ASNavBarStyleOptions;
+export declare const defaultNavBarMWStyleOptions: ASNavBarStyleOptions;
 declare const ASNavBar: React.FC<ASNavBarProps>;
 export default ASNavBar;
 //# sourceMappingURL=ASNavBar.d.ts.map

package/dist/asnavbar/ASNavBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ASNavBar.d.ts","sourceRoot":"","sources":["../../src/asnavbar/ASNavBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAE3D,OAAO,EAAE,oBAAoB,EAA8B,MAAM,wBAAwB,CAAC;AAG1F,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAKjD,eAAO,MAAM,yBAAyB,EAAE,oBAKvC,CAAC;AAEF,QAAA,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAuFrC,CAAC;AAEF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"ASNavBar.d.ts","sourceRoot":"","sources":["../../src/asnavbar/ASNavBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAE3D,OAAO,EAAE,oBAAoB,EAA8B,MAAM,wBAAwB,CAAC;AAG1F,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAKjD,eAAO,MAAM,yBAAyB,EAAE,oBAYvC,CAAC;AAEF,eAAO,MAAM,2BAA2B,EAAE,oBAYzC,CAAC;AAEF,eAAO,MAAM,2BAA2B,EAAE,oBAUzC,CAAC;AAEF,QAAA,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAuFrC,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/dist/asnavbar/ASNavBar.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.defaultNavBarStyleOptions = void 0;
+exports.defaultNavBarMWStyleOptions = exports.defaultNavBarDWStyleOptions = exports.defaultNavBarStyleOptions = void 0;
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
@@ -16,8 +16,39 @@ exports.defaultNavBarStyleOptions = {
     $disableTransitionsBetweenDisplayModes: false,
     $mobileBreakpoint: 768,
     $hideNavArrowButtonsInDW: false,
+    $hideHorizontalScrollbarInDW: true,
+    $gap: 0,
+    $borderRadius: 6,
+    $padding: '0',
+    $margin: '0 auto',
+    $maxWidth: 100,
+    $maxWidthUnit: '%',
 };
-const ASNavBar = ({ className = '', navItems = [], selectedItemId = '', onItemSelected = () => undefined, theme = astheme_1.default, size = ASUI_types_1.ComponentSize.Medium, styleOptions = { ...exports.defaultNavBarStyleOptions }, }) => {
+exports.defaultNavBarDWStyleOptions = {
+    $displayModeOverride: ASUI_types_1.DisplayMode.None,
+    $disableTransitionsBetweenDisplayModes: false,
+    $mobileBreakpoint: 768,
+    $hideNavArrowButtonsInDW: false,
+    $hideHorizontalScrollbarInDW: true,
+    $gap: 30,
+    $borderRadius: 6,
+    $padding: '0 44px',
+    $margin: '0 auto',
+    $minWidth: 300,
+    $minWidthUnit: 'px',
+};
+exports.defaultNavBarMWStyleOptions = {
+    $displayModeOverride: ASUI_types_1.DisplayMode.None,
+    $disableTransitionsBetweenDisplayModes: false,
+    $mobileBreakpoint: 768,
+    $hideNavArrowButtonsInDW: false,
+    $hideHorizontalScrollbarInDW: true,
+    $maxWidth: 300,
+    $maxWidthUnit: 'px',
+    $borderRadius: 6,
+    $padding: '0 4px',
+};
+const ASNavBar = ({ className = '', navItems = [], selectedItemId = '', onItemSelected = () => undefined, theme = astheme_1.default, size = ASUI_types_1.ComponentSize.Medium, styleOptions = { ...exports.defaultNavBarStyleOptions }, dwStyleOptions = { ...exports.defaultNavBarDWStyleOptions }, mwStyleOptions = { ...exports.defaultNavBarMWStyleOptions }, }) => {
     const visitedCountRef = (0, react_1.useRef)(0);
     const [navBarComponentId] = (0, react_1.useState)(`asnavbar-${(0, uuid_1.v4)()}`);
     const [isMobile, setIsMobile] = (0, react_1.useState)(false);
@@ -25,7 +56,7 @@ const ASNavBar = ({ className = '', navItems = [], selectedItemId = '', onItemSe
     const { $mobileBreakpoint, $disableTransitionsBetweenDisplayModes, $displayModeOverride, $hideNavArrowButtonsInDW } = styleOptions;
     (0, react_1.useEffect)(() => {
         const screenSize = (0, screenSizeHelpers_1.getScreenSize)();
-        console.log(`Screen size detected: ${screenSize}`);
+        console.info(`Screen size detected: ${screenSize}`);
     }, []);
     (0, react_1.useEffect)(() => {
         setSelectedId(selectedItemId);
@@ -40,7 +71,6 @@ const ASNavBar = ({ className = '', navItems = [], selectedItemId = '', onItemSe
             return;
         }
         visitedCountRef.current += 1;
-        console.log(`Initializing display mode, visited count: ${visitedCountRef.current}`);
         window.addEventListener('resize', () => {
             const width = window.innerWidth;
             setIsMobile(width < $mobileBreakpoint);
@@ -57,6 +87,6 @@ const ASNavBar = ({ className = '', navItems = [], selectedItemId = '', onItemSe
         setSelectedId(itemId);
         onItemSelected(itemId);
     };
-    return ((0, jsx_runtime_1.jsx)(styles_1.ASNavBarStyled, { id: navBarComponentId, theme: theme, ...styleOptions, children: isMobile ? ((0, jsx_runtime_1.jsx)(mobile_1.default, { id: `asnavbar-mw-${(0, uuid_1.v4)()}`, className: className, navItems: navItems, selectedItemId: selectedId, onItemSelected: onItemSelectedHandler, theme: theme, size: size, styleOptions: styleOptions })) : ((0, jsx_runtime_1.jsx)(desktop_1.default, { id: `asnavbar-dw-${(0, uuid_1.v4)()}`, className: className, navItems: navItems, selectedItemId: selectedId, onItemSelected: onItemSelectedHandler, theme: theme, size: size, styleOptions: styleOptions })) }));
+    return ((0, jsx_runtime_1.jsx)(styles_1.ASNavBarStyled, { id: navBarComponentId, theme: theme, ...styleOptions, children: isMobile ? ((0, jsx_runtime_1.jsx)(mobile_1.default, { id: `asnavbar-mw-${(0, uuid_1.v4)()}`, className: className, navItems: navItems, selectedItemId: selectedId, onItemSelected: onItemSelectedHandler, theme: theme, size: size, styleOptions: mwStyleOptions })) : ((0, jsx_runtime_1.jsx)(desktop_1.default, { id: `asnavbar-dw-${(0, uuid_1.v4)()}`, className: className, navItems: navItems, selectedItemId: selectedId, onItemSelected: onItemSelectedHandler, theme: theme, size: size, styleOptions: dwStyleOptions })) }));
 };
 exports.default = ASNavBar;

package/dist/asnavbar/ASNavBar.types.d.ts

@@ -29,6 +29,8 @@ export type ASNavBarOwnProps = {
     navItems?: ASNavBarItemType[];
     size?: ASComponentSize;
     styleOptions?: ASNavBarStyleOptions;
+    dwStyleOptions?: ASNavBarStyleOptions;
+    mwStyleOptions?: ASNavBarStyleOptions;
 };
 export type ASNavBarProps = PropsWithChildren<ASNavBarOwnProps>;
 //# sourceMappingURL=ASNavBar.types.d.ts.map

package/dist/asnavbar/ASNavBar.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ASNavBar.types.d.ts","sourceRoot":"","sources":["../../src/asnavbar/ASNavBar.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,EAAE,eAAe,EAAE,oBAAoB,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAE7E,MAAM,MAAM,gBAAgB,GAAG;IAC7B,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,IAAI,CAAC,EAAE,eAAe,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjE,aAAa,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,cAAc,KAAK,IAAI,CAAC;CAC/D,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,QAAQ,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC9B,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,YAAY,CAAC,EAAE,oBAAoB,CAAC;CACrC,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,iBAAiB,CAAC,gBAAgB,CAAC,CAAC"}
+{"version":3,"file":"ASNavBar.types.d.ts","sourceRoot":"","sources":["../../src/asnavbar/ASNavBar.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,EAAE,eAAe,EAAE,oBAAoB,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAE7E,MAAM,MAAM,gBAAgB,GAAG;IAC7B,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,IAAI,CAAC,EAAE,eAAe,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjE,aAAa,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,cAAc,KAAK,IAAI,CAAC;CAC/D,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,QAAQ,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC9B,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,YAAY,CAAC,EAAE,oBAAoB,CAAC;IACpC,cAAc,CAAC,EAAE,oBAAoB,CAAC;IACtC,cAAc,CAAC,EAAE,oBAAoB,CAAC;CACvC,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,iBAAiB,CAAC,gBAAgB,CAAC,CAAC"}

package/dist/asnavbar/desktop/ASNavBarDW.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ASNavBarDW.d.ts","sourceRoot":"","sources":["../../../src/asnavbar/desktop/ASNavBarDW.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwE,MAAM,OAAO,CAAC;AAI7F,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAQ9D,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA8HvC,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"ASNavBarDW.d.ts","sourceRoot":"","sources":["../../../src/asnavbar/desktop/ASNavBarDW.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwE,MAAM,OAAO,CAAC;AAI7F,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAQ9D,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA4HvC,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/asnavbar/desktop/ASNavBarDW.js

@@ -82,7 +82,6 @@ const ASNavBarDW = ({ id = `asnavbar-dw-${(0, uuid_1.v4)()}`, className = '', na
     };
     const onItemResizedHandler = (itemId, item) => slideHighlightToSelectedItem(item, itemId);
     const isSelected = (itemId) => selected === itemId;
-    console.log(`What is inside styleOptions? ${styleOptions}`, styleOptions);
     return ((0, jsx_runtime_1.jsxs)(styles_1.ASNavBarDWStyled, { id: id, ref: navBarRef, className: `${className} ${size}`, theme: theme, ...styleOptions, children: [(0, jsx_runtime_1.jsx)(styles_1.ASSelectedBoxStyled, { ref: navBarHighlightBoxRef, theme: theme }), (0, jsx_runtime_1.jsx)(styles_1.ASScrollContainerStyled, { children: navItems.map((item, index) => ((0, jsx_runtime_1.jsx)(navbaritem_1.default, { theme: theme, itemId: item.itemId, selected: isSelected(item.itemId), displayText: item.displayText, icon: item.icon, onItemResized: onItemResizedHandler, onItemClick: onItemSelectedHandler, size: size }, `key_${index}_${item.itemId}`))) }), (0, jsx_runtime_1.jsx)(navbararrowbuttons_1.default, { onArrowButtonClicked: scrollToDirection, className: styles_1.ASNavButtonsDWContainer, theme: theme, size: size, totalItemCount: totalItemCount, selectedIndex: selectedIndex, styleOptions: styleOptions })] }));
 };
 exports.default = ASNavBarDW;

package/dist/asnavbar/desktop/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/asnavbar/desktop/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AAGpE,UAAU,mBAAmB;IAC3B,KAAK,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAsBD,eAAO,MAAM,gBAAgB,wPAoB5B,CAAC;AAEF,UAAU,8BAA8B;IACtC,KAAK,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,eAAO,MAAM,mBAAmB,qQAa/B,CAAC;AAEF,UAAU,uBAAuB;IAC/B,KAAK,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AACD,eAAO,MAAM,kBAAkB,4PAuC9B,CAAC;AAEF,UAAU,wBAAwB;IAChC,KAAK,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,cAAc,GAAG,EAAE,CAAC;IACpC,SAAS,CAAC,EAAE,OAAO,CAAC;CAKrB;AAED,eAAO,MAAM,mBAAmB,6PAiB/B,CAAC;AAEF,eAAO,MAAM,uBAAuB,6NAInC,CAAC;AAEF,eAAO,MAAM,uBAAuB,wPAYnC,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/asnavbar/desktop/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AAGpE,UAAU,mBAAmB;IAC3B,KAAK,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAsBD,eAAO,MAAM,gBAAgB,wPAmB5B,CAAC;AAEF,UAAU,8BAA8B;IACtC,KAAK,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,eAAO,MAAM,mBAAmB,qQAc/B,CAAC;AAEF,UAAU,uBAAuB;IAC/B,KAAK,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AACD,eAAO,MAAM,kBAAkB,4PAuC9B,CAAC;AAEF,UAAU,wBAAwB;IAChC,KAAK,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,cAAc,GAAG,EAAE,CAAC;IACpC,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,mBAAmB,6PAiB/B,CAAC;AAEF,eAAO,MAAM,uBAAuB,6NAInC,CAAC;AAEF,eAAO,MAAM,uBAAuB,wPAYnC,CAAC"}

package/dist/asnavbar/desktop/styles.js

@@ -14,13 +14,13 @@ const dimensionsForSizes = (0, styled_components_1.css) `
   &.ASMedium {
     height: 40px;
     font-size: 1.7rem;
-    font-weight: 500;
+    font-weight: 400;
   }
 
   &.ASLarge {
     height: 50px;
     font-size: 2.1rem;
-    font-weight: 600;
+    font-weight: 500;
   }
 `;
 exports.ASNavBarDWStyled = styled_components_1.default.div `
@@ -33,7 +33,6 @@ exports.ASNavBarDWStyled = styled_components_1.default.div `
   gap: ${({ $gap = 30 }) => $gap}px;
   width: fit-content;
   grid-row: 1;
-
   min-width: ${({ $minWidth = 300 }) => $minWidth}px;
   padding: ${({ $padding = '0 44px' }) => $padding};
   border-radius: ${({ $borderRadius = 6 }) => $borderRadius}px;
@@ -51,7 +50,8 @@ exports.ASSelectedBoxStyled = styled_components_1.default.span `
   background-color: ${({ theme }) => theme.navbar.navBarSelectedBoxBackgroundColor};
   z-index: 0;
   left: 0;
-  transition: all 0.3s ease-in-out 0.1s allow-discrete;
+  will-change: width, transform;
+  transition: all 0.25s ease-in-out 0.1s allow-discrete;
 
   @starting-style {
     z-index: 0;

package/dist/asnavbar/mobile/ASNavBarMW.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ASNavBarMW.d.ts","sourceRoot":"","sources":["../../../src/asnavbar/mobile/ASNavBarMW.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoE,MAAM,OAAO,CAAC;AAMzF,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAalD,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA0KvC,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"ASNavBarMW.d.ts","sourceRoot":"","sources":["../../../src/asnavbar/mobile/ASNavBarMW.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoE,MAAM,OAAO,CAAC;AAOzF,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAalD,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA0KvC,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/asnavbar/mobile/ASNavBarMW.js

@@ -8,10 +8,11 @@ const ASUI_types_1 = require("../../apptypes/ASUI.types");
 const asmodal_1 = tslib_1.__importDefault(require("../../asmodal"));
 const astheme_1 = tslib_1.__importDefault(require("../../astheme"));
 const icons_1 = require("../../icons");
+const ASNavBar_1 = require("../ASNavBar");
 const navbarpickpanel_1 = tslib_1.__importDefault(require("../navbarpickpanel"));
 const styles_1 = require("./styles");
 const INIT_VALUE = (0, uuid_1.v4)();
-const ASNavBarMW = ({ id = `asnavbar-mw-${(0, uuid_1.v4)()}`, className = '', navItems = [], selectedItemId = '', onItemSelected = () => undefined, theme = astheme_1.default, size = ASUI_types_1.ComponentSize.Medium, styleOptions: options = {}, }) => {
+const ASNavBarMW = ({ id = `asnavbar-mw-${(0, uuid_1.v4)()}`, className = '', navItems = [], selectedItemId = '', onItemSelected = () => undefined, theme = astheme_1.default, size = ASUI_types_1.ComponentSize.Medium, styleOptions = ASNavBar_1.defaultNavBarMWStyleOptions, }) => {
     const scrollContainerRef = (0, react_1.useRef)(null);
     const selectedItemIdRef = (0, react_1.useRef)(INIT_VALUE);
     const navBarRef = (0, react_1.useRef)(null);
@@ -47,7 +48,6 @@ const ASNavBarMW = ({ id = `asnavbar-mw-${(0, uuid_1.v4)()}`, className = '', na
     (0, react_1.useEffect)(() => {
         if (selectedItemIdRef.current === selected)
             return;
-        console.log(`🟢 NEW ITEM SELECTED ${selected}`);
         selectedItemIdRef.current = selected;
         onItemSelected(selected);
     }, [selected]);
@@ -93,6 +93,6 @@ const ASNavBarMW = ({ id = `asnavbar-mw-${(0, uuid_1.v4)()}`, className = '', na
             }
         }
     };
-    return ((0, jsx_runtime_1.jsxs)(styles_1.ASNavBarMWStyled, { id: id, ref: navBarRef, className: `${className} ${size}`, theme: theme, ...options, children: [(0, jsx_runtime_1.jsx)(styles_1.ASSelectedBoxMWStyled, { ref: navBarHighlightBoxRef, theme: theme }), (0, jsx_runtime_1.jsx)(styles_1.ScrollableNavBarItems, { id: "ScrollableNavBarItems", ref: scrollContainerRef, onScrollEnd: onScrollEndedHandler, children: navItems.map((item, index) => ((0, jsx_runtime_1.jsx)(styles_1.ASNavBarItemMWStyled, { theme: theme, itemId: item.itemId, selected: isSelected(item.itemId), displayText: item.displayText, icon: item.icon, size: size, title: item.displayText, onItemClick: () => setShowSelectionPanel(true) }, `key_${index}_${item.itemId}`))) }), (0, jsx_runtime_1.jsxs)(styles_1.NavButtonsContainer, { children: [(0, jsx_runtime_1.jsx)(styles_1.ASIconButtonStyled, { role: "button", icon: icons_1.ArrowLeftIcon, onMouseOver: (e) => { }, onClick: selectPrev, theme: theme, size: size, disabled: selectedIndex <= 0, id: "LeftButtonId", iconSize: size === ASUI_types_1.ComponentSize.Large ? 32 : size === ASUI_types_1.ComponentSize.Medium ? 28 : 24, fillColor: theme.button.buttonIconColor }), (0, jsx_runtime_1.jsx)(styles_1.ASIconButtonStyled, { icon: icons_1.ArrowRightIcon, id: "RightButtonId", iconSize: size === ASUI_types_1.ComponentSize.Large ? 32 : size === ASUI_types_1.ComponentSize.Medium ? 28 : 24, size: size, fillColor: theme.button.buttonIconColor, disabled: selectedIndex >= navItems.length - 1, onClick: selectNext })] }), (0, jsx_runtime_1.jsx)(asmodal_1.default, { isOpen: showSelectionPanel, onBackdropClick: () => setShowSelectionPanel(false), className: className, children: (0, jsx_runtime_1.jsx)(navbarpickpanel_1.default, { theme: theme, size: size, className: className, navItems: navItems, selectedId: selected, selectedIndex: selectedIndex, onItemSelected: onNavBarItemPickedHandler }) })] }));
+    return ((0, jsx_runtime_1.jsxs)(styles_1.ASNavBarMWStyled, { id: id, ref: navBarRef, className: `${className} ${size}`, theme: theme, ...styleOptions, children: [(0, jsx_runtime_1.jsx)(styles_1.ASSelectedBoxMWStyled, { ref: navBarHighlightBoxRef, theme: theme }), (0, jsx_runtime_1.jsx)(styles_1.ScrollableNavBarItems, { id: "ScrollableNavBarItems", ref: scrollContainerRef, onScrollEnd: onScrollEndedHandler, children: navItems.map((item, index) => ((0, jsx_runtime_1.jsx)(styles_1.ASNavBarItemMWStyled, { theme: theme, itemId: item.itemId, selected: isSelected(item.itemId), displayText: item.displayText, icon: item.icon, size: size, title: item.displayText, onItemClick: () => setShowSelectionPanel(true) }, `key_${index}_${item.itemId}`))) }), (0, jsx_runtime_1.jsxs)(styles_1.NavButtonsContainer, { ...styleOptions, children: [(0, jsx_runtime_1.jsx)(styles_1.ASIconButtonStyled, { role: "button", icon: icons_1.ArrowLeftIcon, onMouseOver: (e) => { }, onClick: selectPrev, theme: theme, size: size, disabled: selectedIndex <= 0, id: "LeftButtonId", iconSize: size === ASUI_types_1.ComponentSize.Large ? 32 : size === ASUI_types_1.ComponentSize.Medium ? 28 : 24, fillColor: theme.button.buttonIconColor }), (0, jsx_runtime_1.jsx)(styles_1.ASIconButtonStyled, { icon: icons_1.ArrowRightIcon, id: "RightButtonId", iconSize: size === ASUI_types_1.ComponentSize.Large ? 32 : size === ASUI_types_1.ComponentSize.Medium ? 28 : 24, size: size, fillColor: theme.button.buttonIconColor, disabled: selectedIndex >= navItems.length - 1, onClick: selectNext })] }), (0, jsx_runtime_1.jsx)(asmodal_1.default, { isOpen: showSelectionPanel, onBackdropClick: () => setShowSelectionPanel(false), className: className, children: (0, jsx_runtime_1.jsx)(navbarpickpanel_1.default, { theme: theme, size: size, className: className, navItems: navItems, selectedId: selected, selectedIndex: selectedIndex, onItemSelected: onNavBarItemPickedHandler }) })] }));
 };
 exports.default = ASNavBarMW;

package/dist/asnavbar/mobile/styles.d.ts

@@ -1,4 +1,4 @@
-import { ASComponentSize, ASTheme } from '../../apptypes/ASUI.types';
+import { ASComponentSize, ASNavBarStyleOptions, ASTheme } from '../../apptypes/ASUI.types';
 interface ASNavBarIconButtonStyledProps {
     theme: ASTheme;
     $mobileMode?: boolean;
@@ -28,10 +28,13 @@ interface ASNavBarSelectedBoxStyledProps {
     theme: ASTheme;
     $mobileMode?: boolean;
     $height?: number;
+    $heightUnit?: string;
+    $width?: number;
+    $widthUnit?: string;
     $borderRadius?: number;
 }
 export declare const ASSelectedBoxMWStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, ASNavBarSelectedBoxStyledProps>> & string;
-interface ASNavBarStyledProps {
+interface ASNavBarStyledProps extends ASNavBarStyleOptions {
     theme: ASTheme;
     $mobileMode?: boolean;
     $gap?: number;

package/dist/asnavbar/mobile/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/asnavbar/mobile/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,OAAO,EAAiB,MAAM,2BAA2B,CAAC;AA2BpF,UAAU,6BAA6B;IACrC,KAAK,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,eAAe,CAAC;CACxB;AAED,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;wJAM9B,CAAC;AAEF,eAAO,MAAM,oBAAoB,sQAQhC,CAAC;AACF,eAAO,MAAM,qBAAqB,sQASjC,CAAC;AAEF,UAAU,8BAA8B;IACtC,KAAK,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AACD,eAAO,MAAM,qBAAqB,qQAgBjC,CAAC;AAEF,UAAU,mBAAmB;IAC3B,KAAK,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AACD,eAAO,MAAM,mBAAmB,wPAgC/B,CAAC;AAEF,UAAU,uBAAuB;IAC/B,KAAK,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AACD,eAAO,MAAM,oBAAoB,iUAuDhC,CAAC;AAEF,eAAO,MAAM,qBAAqB,6NA0BjC,CAAC;AAEF,eAAO,MAAM,gBAAgB,wPA4C5B,CAAC;AAEF,UAAU,wBAAwB;IAChC,KAAK,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,mBAAmB,6PAiB/B,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/asnavbar/mobile/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,oBAAoB,EAAE,OAAO,EAAiB,MAAM,2BAA2B,CAAC;AA+C1G,UAAU,6BAA6B;IACrC,KAAK,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,eAAe,CAAC;CACxB;AAED,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;wJAM9B,CAAC;AAEF,eAAO,MAAM,oBAAoB,sQAQhC,CAAC;AAEF,eAAO,MAAM,qBAAqB,sQASjC,CAAC;AAEF,UAAU,8BAA8B;IACtC,KAAK,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AACD,eAAO,MAAM,qBAAqB,qQAgBjC,CAAC;AAEF,UAAU,mBAAoB,SAAQ,oBAAoB;IACxD,KAAK,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,eAAO,MAAM,mBAAmB,wPA0B/B,CAAC;AAEF,UAAU,uBAAuB;IAC/B,KAAK,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AACD,eAAO,MAAM,oBAAoB,iUAuDhC,CAAC;AAEF,eAAO,MAAM,qBAAqB,6NA0BjC,CAAC;AAEF,eAAO,MAAM,gBAAgB,wPA+B5B,CAAC;AAEF,UAAU,wBAAwB;IAChC,KAAK,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,mBAAmB,6PAiB/B,CAAC"}

package/dist/asnavbar/mobile/styles.js

@@ -28,6 +28,25 @@ const getNavControlButtonStyle = (0, styled_components_1.css) `
     }
   }
 `;
+const dimensionsForSizes = (0, styled_components_1.css) `
+  &.ASSmall {
+    height: 30px;
+    font-size: 1.3rem;
+    font-weight: 400;
+  }
+
+  &.ASMedium {
+    height: 40px;
+    font-size: 1.7rem;
+    font-weight: 400;
+  }
+
+  &.ASLarge {
+    height: 50px;
+    font-size: 2.1rem;
+    font-weight: 500;
+  }
+`;
 exports.ASIconButtonStyled = (0, styled_components_1.default)(ASIconButton_1.default) `
   margin: ${({ size = ASUI_types_1.ComponentSize.Medium }) => size === ASUI_types_1.ComponentSize.Small ? '0 10px' : size === ASUI_types_1.ComponentSize.Large ? '0 -1px' : '0 3px'};
   z-index: 1;
@@ -54,15 +73,15 @@ exports.NavControlRightButton = (0, styled_components_1.default)(icons_1.ArrowRi
 `;
 exports.ASSelectedBoxMWStyled = styled_components_1.default.span `
   position: absolute;
-  height: 85%;
-  width: 200px;
+  height: ${({ $height = 85, $heightUnit = '%' }) => `${$height}${$heightUnit}`};
+  width: ${({ $width = 200, $widthUnit = 'px' }) => `${$width}${$widthUnit}`};
   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%);
   border-radius: ${({ $borderRadius = 4 }) => $borderRadius}px;
   background-color: ${({ theme }) => theme.navbar.navBarSelectedBoxBackgroundColor};
   z-index: 0;
-  transition: all 0.3s ease-in-out 0.1s allow-discrete;
+  transition: all 0.3s ease-in-out 0.05s allow-discrete;
 
   @starting-style {
     z-index: 0;
@@ -80,8 +99,6 @@ exports.NavButtonsContainer = styled_components_1.default.div `
 
   &.ASSmall {
     height: 30px;
-    font-size: 1.3rem;
-    font-weight: 400;
     > ${exports.ASSelectedBoxMWStyled} {
       height: 80%;
     }
@@ -89,14 +106,10 @@ exports.NavButtonsContainer = styled_components_1.default.div `
 
   &.ASMedium {
     height: 40px;
-    font-size: 1.7rem;
-    font-weight: 500;
   }
 
   &.ASLarge {
     height: 50px;
-    font-size: 2.1rem;
-    font-weight: 600;
     > ${exports.ASSelectedBoxMWStyled} {
       height: 90%;
     }
@@ -126,12 +139,12 @@ exports.ASNavBarItemMWStyled = (0, styled_components_1.default)(navbaritem_1.def
 
   &.ASMedium {
     font-size: 1.7rem;
-    font-weight: 500;
+    font-weight: 400;
   }
 
   &.ASLarge {
     font-size: 2.1rem;
-    font-weight: 600;
+    font-weight: 500;
   }
 
   ${({ $selected = false, theme = astheme_1.default }) => $selected
@@ -190,8 +203,11 @@ exports.ASNavBarMWStyled = styled_components_1.default.div `
   justify-content: flex-start;
   flex-wrap: nowrap;
   flex-direction: row;
-  width: -webkit-fill-available;
-  max-width: 300px;
+  width: 100%;
+  @supports (width: -webkit-fill-available) {
+    width: -webkit-fill-available;
+  }
+  max-width: max-width: ${({ $maxWidth = 300, $maxWidthUnit = 'px' }) => `${$maxWidth}${$maxWidthUnit}`};
   border-radius: ${({ $borderRadius = 6 }) => $borderRadius}px;
   background-color: ${({ theme }) => theme.navbar.navBarBackgroundColor};
   padding: ${({ $padding = '0 4px' }) => $padding};
@@ -210,23 +226,7 @@ exports.ASNavBarMWStyled = styled_components_1.default.div `
     }
   }
 
-  &.ASSmall {
-    height: 30px;
-    font-size: 1.3rem;
-    font-weight: 400;
-  }
-
-  &.ASMedium {
-    height: 40px;
-    font-size: 1.7rem;
-    font-weight: 500;
-  }
-
-  &.ASLarge {
-    height: 50px;
-    font-size: 2.1rem;
-    font-weight: 600;
-  }
+  ${dimensionsForSizes}
 `;
 exports.ASNavBarItemPadding = styled_components_1.default.div `
   padding: 0 4px;

package/dist/asnavbar/navbaritem/styles.js

@@ -37,12 +37,12 @@ exports.ASNavBarItemStyled = styled_components_1.default.div `
 
   &.ASMedium {
     font-size: 1.7rem;
-    font-weight: 500;
+    font-weight: 400;
   }
 
   &.ASLarge {
     font-size: 2.1rem;
-    font-weight: 600;
+    font-weight: 500;
   }
 
   ${({ $selected = false, theme = astheme_1.default }) => $selected

package/dist/asnavbar/navbarpickpanelitem/styles.js

@@ -31,12 +31,12 @@ exports.ASNavBarPickPanelItemStyled = styled_components_1.default.div `
 
   &.ASMedium {
     font-size: 1.7rem;
-    font-weight: 500;
+    font-weight: 400;
   }
 
   &.ASLarge {
     font-size: 2.1rem;
-    font-weight: 600;
+    font-weight: 500;
   }
 
   ${({ $selected = false, theme = astheme_1.default }) => $selected

package/dist/asnavbar/styles.d.ts

@@ -1,11 +1,9 @@
-import { ASTheme } from '../apptypes/ASUI.types';
-interface ASNavBarStyledProps {
+import { ASNavBarStyleOptions, ASTheme } from '../apptypes/ASUI.types';
+interface ASNavBarStyledProps extends ASNavBarStyleOptions {
     theme: ASTheme;
     $mobileMode?: boolean;
     $gap?: number;
     $maxWidth?: number;
-    $borderRadius?: number;
-    $padding?: string;
 }
 export declare const ASNavBarStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, ASNavBarStyledProps>> & string;
 interface ASNavBarItemPaddingProps {

package/dist/asnavbar/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/asnavbar/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAGjD,UAAU,mBAAmB;IAC3B,KAAK,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AA6BD,eAAO,MAAM,cAAc,wPAkD1B,CAAC;AAEF,UAAU,wBAAwB;IAChC,KAAK,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,0BAA0B,6PAgBtC,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/asnavbar/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAGvE,UAAU,mBAAoB,SAAQ,oBAAoB;IACxD,KAAK,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAwCD,eAAO,MAAM,cAAc,wPAoC1B,CAAC;AAEF,UAAU,wBAAwB;IAChC,KAAK,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,0BAA0B,6PAgBtC,CAAC"}

package/dist/asnavbar/styles.js

@@ -4,7 +4,7 @@ exports.ASNavBarLeadingIconPadding = exports.ASNavBarStyled = void 0;
 const tslib_1 = require("tslib");
 const styled_components_1 = tslib_1.__importStar(require("styled-components"));
 const astheme_1 = tslib_1.__importDefault(require("../astheme"));
-const ScrollBarConfig = (0, styled_components_1.css) `
+const ShowScrollBarConfig = (0, styled_components_1.css) `
   /* Chrome, Edge, and Safari */
   &::-webkit-scrollbar {
     width: 1px;
@@ -30,6 +30,16 @@ const ScrollBarConfig = (0, styled_components_1.css) `
   scrollbar-color: #ffda3f transparent; // thumb color, track color
   scrollbar-width: thinner;
 `;
+const HideScrollBarConfig = (0, styled_components_1.css) `
+  /* Hide scrollbar for Chrome, Safari and Opera */
+  &::-webkit-scrollbar {
+    display: none;
+  }
+
+  /* Hide scrollbar for IE, Edge and Firefox */
+  -ms-overflow-style: none; /* IE and Edge */
+  scrollbar-width: none; /* Firefox */
+`;
 exports.ASNavBarStyled = styled_components_1.default.div `
   anchor-name: --navbarAnchor;
   display: grid;
@@ -47,7 +57,7 @@ exports.ASNavBarStyled = styled_components_1.default.div `
   flex-wrap: nowrap;
   position: relative;
   overflow-x: auto;
-  margin: 0 auto;
+  margin: ${({ $margin = '0 auto' }) => $margin};
   padding: ${({ $padding = '0' }) => $padding};
   border-radius: ${({ $borderRadius = 6 }) => $borderRadius}px;
   background-color: ${({ theme }) => theme.navbar.navBarBackgroundColor};
@@ -56,7 +66,7 @@ exports.ASNavBarStyled = styled_components_1.default.div `
   width: 100%;
   @supports (width: -webkit-fill-available) {
     width: -webkit-fill-available;
-    max-width: ${({ $maxWidth }) => ($maxWidth ? $maxWidth + 'px' : '100%')};
+    max-width: ${({ $maxWidth = 100, $maxWidthUnit = '%' }) => `${$maxWidth}${$maxWidthUnit}`};
   }
 
   @media screen and (max-width: 768px) {
@@ -64,22 +74,7 @@ exports.ASNavBarStyled = styled_components_1.default.div `
     width: 100%;
   }
 
-  @media screen and (max-width: 1024px) {
-    max-width: 800px;
-    // width: 100%;
-  }
-
-  // @media screen and (max-width: 1440px) {
-  // max-width: 1024px;
-  // width: 100%;
-  // }
-
-  // @media screen and (max-width: 1920px) {
-  // max-width: 1440px;
-  // width: 100%;
-  // }
-
-  ${ScrollBarConfig}
+  ${({ $hideHorizontalScrollbarInDW = true }) => $hideHorizontalScrollbarInDW ? HideScrollBarConfig : ShowScrollBarConfig};
 `;
 exports.ASNavBarLeadingIconPadding = styled_components_1.default.div `
   padding: 0 4px;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eleventheye/asui",
-  "version": "2.7.0",
+  "version": "2.7.1",
   "private": false,
   "description": "AS UI React Library by eleventheye (another one!)",
   "keywords": [