Releases: pedro-lb/use-window-size-hook
Releases Β· pedro-lb/use-window-size-hook
1.1.22
1.1.2
π Improvements
- π
Added more layout disposition options under
screenLayout
returned byuseWindowSize
! Refer to the readme:
useWindowSize result
{
width?: number;
height?: number;
screenLayout?: {
layout: xs | sm | md | lg | xl;
isXs: boolean;
isSm: boolean;
isMd: boolean;
isLg: boolean;
isXl: boolean;
isXsOrBelow: boolean;
isSmOrBelow: boolean;
isMdOrBelow: boolean;
isLgOrBelow: boolean;
isXlOrBelow: boolean;
isXsOrAbove: boolean;
isSmOrAbove: boolean;
isMdOrAbove: boolean;
isLgOrAbove: boolean;
isXlOrAbove: boolean;
};
}
1.1.1
1.1.0
β οΈ Breaking changes
useWindowSize
options have changed! We now have the ability to override breakpoints and other settings. Refer to the README:
Name | Type | Required | Default value | Description |
---|---|---|---|---|
useDebounce |
boolean |
optional | true |
Defines if the callback is going to be executed when the user finishes resizing the screen or not |
debounceTimeMs |
number |
optional | 200 |
Debounce time to check when the user finishes resizing the screen |
breakpoints |
ScreenBreakpoints |
optional | Check types below | Defines the breakpoints to be used, you can override and choose your own |
- The value returned by
useWindowSize
has changed:screenLayout
now is an object that contains multiple properties:
{
width?: number;
height?: number;
screenLayout?: {
layout: xs | sm | md | lg | xl;
isXsOrBelow: boolean;
isSmOrBelow: boolean;
isMdOrBelow: boolean;
isLgOrBelow: boolean;
isXlOrBelow: boolean;
};
}
π Improvements
-
π The whole library was rewritten using
TypeScript
! -
π You can now set
debounceTimeMs
on the options (defaults to 200ms) -
π You can now override breakpoints used to determine the current layout!