diff --git a/README.md b/README.md index 4a0ec05..cc59bb3 100644 --- a/README.md +++ b/README.md @@ -98,8 +98,8 @@ Name | Type | Required | Default value | Description { width?: number; height?: number; - screenLayout?: { - layout: xs | sm | md | lg | xl; + screenLayout: { + layout: xs | sm | md | lg | xl | undefined; isXs: boolean; isSm: boolean; diff --git a/src/constants/defaultScreenLayout.ts b/src/constants/defaultScreenLayout.ts new file mode 100644 index 0000000..d393ce0 --- /dev/null +++ b/src/constants/defaultScreenLayout.ts @@ -0,0 +1,28 @@ +import { ScreenLayout } from '../interfaces'; + +/** + * Default screen layout. + */ +const defaultScreenLayout: ScreenLayout = { + layout: undefined, + + isXs: false, + isSm: false, + isMd: false, + isLg: false, + isXl: false, + + isXsOrBelow: false, + isSmOrBelow: false, + isMdOrBelow: false, + isLgOrBelow: false, + isXlOrBelow: false, + + isXsOrAbove: false, + isSmOrAbove: false, + isMdOrAbove: false, + isLgOrAbove: false, + isXlOrAbove: false, +}; + +export default defaultScreenLayout; diff --git a/src/interfaces/index.ts b/src/interfaces/index.ts index cb1bf89..7d71200 100644 --- a/src/interfaces/index.ts +++ b/src/interfaces/index.ts @@ -32,7 +32,7 @@ export interface GetCurrentLayoutOptions { * Result for getCurrentLayout. */ export interface ScreenLayout { - layout: LayoutEnum; + layout?: LayoutEnum; isXs: boolean; isSm: boolean; @@ -67,7 +67,7 @@ export interface GetWindowSizeOptions { export interface GetWindowSizeResult { width?: number; height?: number; - screenLayout?: ScreenLayout; + screenLayout: ScreenLayout; } /** diff --git a/src/utils/getCurrentLayout.ts b/src/utils/getCurrentLayout.ts index a7f4593..f37366f 100644 --- a/src/utils/getCurrentLayout.ts +++ b/src/utils/getCurrentLayout.ts @@ -1,31 +1,7 @@ import { GetCurrentLayoutOptions, ScreenLayout } from '../interfaces'; +import defaultScreenLayout from '../constants/defaultScreenLayout'; import LayoutEnum from '../constants/layoutEnum'; -/** - * Default return options. - */ -const defaultReturn: ScreenLayout = { - layout: LayoutEnum.xs, - - isXs: false, - isSm: false, - isMd: false, - isLg: false, - isXl: false, - - isXsOrBelow: false, - isSmOrBelow: false, - isMdOrBelow: false, - isLgOrBelow: false, - isXlOrBelow: false, - - isXsOrAbove: false, - isSmOrAbove: false, - isMdOrAbove: false, - isLgOrAbove: false, - isXlOrAbove: false, -}; - /** * Returns the current layout. * @param param0 options @@ -36,7 +12,7 @@ const getCurrentLayout = ({ }: GetCurrentLayoutOptions): ScreenLayout => { if (width <= breakpoints.sm) { return { - ...defaultReturn, + ...defaultScreenLayout, // Current layout layout: LayoutEnum.xs, @@ -58,7 +34,7 @@ const getCurrentLayout = ({ if (width < breakpoints.md) { return { - ...defaultReturn, + ...defaultScreenLayout, // Current layout layout: LayoutEnum.sm, @@ -80,7 +56,7 @@ const getCurrentLayout = ({ if (width < breakpoints.lg) { return { - ...defaultReturn, + ...defaultScreenLayout, // Current layout layout: LayoutEnum.md, @@ -102,7 +78,7 @@ const getCurrentLayout = ({ if (width < breakpoints.xl) { return { - ...defaultReturn, + ...defaultScreenLayout, // Current layout layout: LayoutEnum.lg, @@ -123,7 +99,7 @@ const getCurrentLayout = ({ } return { - ...defaultReturn, + ...defaultScreenLayout, // Current layout layout: LayoutEnum.xl, diff --git a/src/utils/getWindowSize.ts b/src/utils/getWindowSize.ts index ba29241..7b82ee3 100644 --- a/src/utils/getWindowSize.ts +++ b/src/utils/getWindowSize.ts @@ -1,4 +1,5 @@ import { GetWindowSizeResult, GetWindowSizeOptions } from '../interfaces'; +import defaultScreenLayout from '../constants/defaultScreenLayout'; import getCurrentLayout from './getCurrentLayout'; /** @@ -14,7 +15,7 @@ const getWindowSize = ({ return { width: undefined, height: undefined, - screenLayout: undefined, + screenLayout: defaultScreenLayout, }; }