fix(html): fix toolbar scrolling position

telerik · Jan 23, 2025 · e8459c0 · e8459c0
1 parent 334e3ee
commit e8459c0
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 5 deletions.
diff --git a/packages/html/src/toolbar/tests/toolbar-fill-modes.tsx b/packages/html/src/toolbar/tests/toolbar-fill-modes.tsx
@@ -52,7 +52,7 @@ export default () =>(
                     </section>
                     <span className="k-colspan-all k-col-span-full">{fillMode} with overlay</span>
                     <section className="k-colspan-all k-col-span-full">
-                      <ToolbarScrollableButtonsHidden fillMode={fillMode}>
+                      <ToolbarScrollableButtonsHidden scrollingPosition="both" fillMode={fillMode}>
                           <Button icon="arrow-rotate-ccw" fillMode={fillMode}></Button>
                           <Button icon="arrow-rotate-cw" fillMode={fillMode}></Button>
                           <ToolbarSeparator></ToolbarSeparator>

diff --git a/packages/html/src/toolbar/tests/toolbar-scrollable-buttons-hidden.tsx b/packages/html/src/toolbar/tests/toolbar-scrollable-buttons-hidden.tsx
@@ -17,12 +17,12 @@ export default () =>(
 
             <span className="k-colspan-all k-col-span-full">Toolbar Hidden Buttons Scroll Middle</span>
             <section className="k-colspan-all k-col-span-full">
-                <ToolbarScrollableButtonsHidden scrollingPosition={null} />
+                <ToolbarScrollableButtonsHidden scrollingPosition="both" />
             </section>
 
             <span className="k-colspan-all k-col-span-full">Toolbar Hidden Buttons Scroll Middle RTL</span>
             <section className="k-colspan-all k-col-span-full" dir="rtl">
-                <ToolbarScrollableButtonsHidden scrollingPosition={null} />
+                <ToolbarScrollableButtonsHidden scrollingPosition="both" />
             </section>
 
         </div>

diff --git a/packages/html/src/toolbar/toolbar.spec.tsx b/packages/html/src/toolbar/toolbar.spec.tsx
@@ -29,7 +29,7 @@ export type KendoToolbarProps = KendoToolbarOptions & {
     resizable?: boolean;
     scrollable?: boolean;
     scrollButtons?: 'hidden' | 'start' | 'end' | 'around';
-    scrollingPosition?: 'start' | 'end';
+    scrollingPosition?: 'start' | 'end' | 'both';
     section?: boolean;
 };
 
@@ -192,7 +192,7 @@ export const Toolbar = (
                     [`${TOOLBAR_CLASSNAME}-resizable`]: resizable,
                     [`${TOOLBAR_CLASSNAME}-scrollable`]: scrollable,
                     [`${TOOLBAR_CLASSNAME}-scrollable-overlay`]: (scrollable && scrollButtons === 'hidden'),
-                    [`${TOOLBAR_CLASSNAME}-scrollable-${scrollingPosition}`]: scrollingPosition,
+                    [`${TOOLBAR_CLASSNAME}-scrollable-${scrollingPosition}`]: scrollingPosition && scrollingPosition !== 'both',
                     [`${TOOLBAR_CLASSNAME}-section`]: section,
                 }
             )}