Hot-fix: Make ScrollBox Type Defaults to 'vertical' (#218)

* Hot-fix: Make ScrollBox Type Defaults to 'vertical'

* Fix list type and button event type

* More type fixes

Author: bbazukun123

src/ScrollBox.ts

@@ -940,7 +940,9 @@ export class ScrollBox extends Container
 
     protected get isVertical(): boolean
     {
-        return this.options.type === 'vertical';
+        const type = this.options.type ?? 'vertical';
+
+        return type === 'vertical';
     }
 
     protected get isHorizontal(): boolean
@@ -950,8 +952,6 @@ export class ScrollBox extends Container
 
     protected get isBidirectional(): boolean
     {
-        const type = this.options.type ?? 'bidirectional';
-
-        return type === 'bidirectional';
+        return this.options.type === 'bidirectional';
     }
 }

src/stories/list/ListSprite.stories.ts

@@ -11,7 +11,7 @@ import { preload } from '../utils/loader';
 import { action } from '@storybook/addon-actions';
 
 const args = {
-    type: LIST_TYPE.reverse(),
+    type: LIST_TYPE,
     fontColor: '#000000',
     elementsMargin: 29,
     itemsAmount: 12,

src/stories/scrollBox/ScrollBoxDynamicDimensions.stories.ts

@@ -12,7 +12,7 @@ const args = {
     fontColor: '#000000',
     backgroundColor: '#F5E3A9',
     itemsAmount: 100,
-    type: [...LIST_TYPE],
+    type: [null, ...LIST_TYPE],
 };
 
 export const UseDynamicDimensions: StoryFn<typeof args & { type: ListType }> = (

src/stories/scrollBox/ScrollBoxGraphics.stories.ts

@@ -23,7 +23,7 @@ const args = {
     disableEasing: false,
     globalScroll: true,
     shiftScroll: false,
-    type: LIST_TYPE.reverse(),
+    type: [null, ...LIST_TYPE],
     innerListWidth: 1000,
     onPress: action('Button pressed'),
 };

src/stories/scrollBox/ScrollBoxProximity.stories.ts

@@ -20,7 +20,7 @@ const args = {
     elementsWidth: 300,
     elementsHeight: 80,
     itemsAmount: 100,
-    type: [...LIST_TYPE],
+    type: [null, ...LIST_TYPE],
     fadeSpeed: 0.5,
 };
 

src/stories/switcher/Switcher.stories.ts

@@ -1,7 +1,7 @@
 import { PixiStory, StoryFn } from '@pixi/storybook-renderer';
 import { Switcher } from '../../Switcher';
 import { centerElement } from '../../utils/helpers/resize';
-import { BUTTON_EVENTS } from '../../utils/HelpTypes';
+import { BUTTON_EVENTS, ButtonEvent } from '../../utils/HelpTypes';
 import { argTypes, getDefaultArgs } from '../utils/argTypes';
 import { preload } from '../utils/loader';
 import { action } from '@storybook/addon-actions';
@@ -15,9 +15,9 @@ const args = {
 
 export const Sprites: StoryFn<
     typeof args & {
-    triggerEvent1: string;
-    triggerEvent2: string;
-    triggerEvent3: string;
+    triggerEvent1: ButtonEvent;
+    triggerEvent2: ButtonEvent;
+    triggerEvent3: ButtonEvent;
 }
 > = ({ action, triggerEvent1, triggerEvent2, triggerEvent3 }, context) =>
     new PixiStory<typeof args>({

src/utils/HelpTypes.ts

@@ -10,7 +10,7 @@ export interface DragObject extends Container
     dragGlobalStart: Point;
 }
 
-export const BUTTON_EVENTS = ['onPress', 'onDown', 'onUp', 'onHover', 'onOut', 'onUpOut'];
+export const BUTTON_EVENTS = ['onPress', 'onDown', 'onUp', 'onHover', 'onOut', 'onUpOut'] as const;
 
 export type ButtonEvent = (typeof BUTTON_EVENTS)[number];
 
@@ -25,5 +25,5 @@ export type Padding =
         bottom?: number;
     };
 
-export const LIST_TYPE = ['vertical', 'horizontal', 'bidirectional'];
+export const LIST_TYPE = ['vertical', 'horizontal', 'bidirectional'] as const;