[UIK-5136][slider] rewrite component to TS#2918
Conversation
036c37b to
c160d60
Compare
<!--- Provide a general summary of your changes in the Title above --> ## Motivation and Context <!--- Why is this change required? What problem does it solve? --> <!--- If it fixes an open issue, please link to the issue here. --> ## How has this been tested? <!--- Please describe in detail how you tested your changes. --> <!--- For example: --> <!--- I have added unit tests --> <!--- I have added Voice Over tests --> <!--- Code cannot be tested automatically so I have tested it only manually --> ## Screenshots (if appropriate): ## Types of changes <!--- What types of changes does your code introduce? Put an `x` in all the boxes that apply: --> - [ ] Bug fix (non-breaking change which fixes an issue). - [ ] New feature (non-breaking change which adds functionality). - [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected). - [ ] Nice improve. ## Checklist: <!--- Go over all the following points, and put an `x` in all the boxes that apply. --> <!--- If you're unsure about any of these, don't hesitate to ask. We're here to help! --> - [ ] I have updated the documentation accordingly. - [ ] I have added new tests on added of fixed functionality.
4f4da4f to
cc6f594
Compare
| const delayArr = this.asProps.animationsDisabled ? [0, 0] : propToArray(this.asProps.delay); | ||
| const delay = this.asProps.visible ? delayArr[0] : delayArr[1]; | ||
| const duration = this.asProps.animationsDisabled ? 0 : this.asProps.duration + 100; | ||
| let { duration } = this.asProps; |
There was a problem hiding this comment.
@ilyabrower please take a look at this logic, hope it's correct.
There was a problem hiding this comment.
I'm not sure about duration[1] - duration[0]. I think, if this is array, it works like delay - for show and hide.
So, you can do the same as for delay for the duration:
const durationArr = animationsDisabled ? [0, 0] : propToArray(this.asProps.duration);
const duration = visible ? durationArr[0] + 100 : durationArr[1] + 100;
| defaultVisibleFilters: [], | ||
| }; | ||
| defaultVisibleFilters: [] as AddFilterDefaultProps['defaultVisibleFilters'], | ||
| } as const; |
There was a problem hiding this comment.
? maybe
static defaultProps: AddFilterDefaultProps = {
i18n: localizedMessages,
locale: 'en',
defaultVisibleFilters: [],
};
| > { | ||
| static displayName = 'Animation'; | ||
| static style = style; | ||
| static defaultProps = { |
There was a problem hiding this comment.
what do you think about set type here instead of as const ?
It's a really big object and maybe it will be easy to see the problem right here instead of in createComponent function....
| const delayArr = this.asProps.animationsDisabled ? [0, 0] : propToArray(this.asProps.delay); | ||
| const delay = this.asProps.visible ? delayArr[0] : delayArr[1]; | ||
| const duration = this.asProps.animationsDisabled ? 0 : this.asProps.duration + 100; | ||
| let { duration } = this.asProps; |
There was a problem hiding this comment.
I'm not sure about duration[1] - duration[0]. I think, if this is array, it works like delay - for show and hide.
So, you can do the same as for delay for the duration:
const durationArr = animationsDisabled ? [0, 0] : propToArray(this.asProps.duration);
const duration = visible ? durationArr[0] + 100 : durationArr[1] + 100;
| // @ts-nocheck | ||
| import { createBaseComponent, sstyled } from '@semcore/core'; | ||
| import { createBaseComponent, type Intergalactic } from '@semcore/core'; | ||
| import { sstyled } from '@semcore/core'; |
There was a problem hiding this comment.
all in one import, I think
| @@ -1,4 +1,5 @@ | |||
| import { createBaseComponent, sstyled } from '@semcore/core'; | |||
| import { createBaseComponent, type Intergalactic } from '@semcore/core'; | |||
| import { sstyled } from '@semcore/core'; | |||
| > { | ||
| static displayName = 'FeaturePopover'; | ||
| static style = style; | ||
| static defaultProps = { |
| static defaultProps = { | ||
| defaultValue: null, | ||
| }; | ||
| defaultValue: '', |
| static style = style; | ||
|
|
||
| sliderRef = React.createRef(null); | ||
| sliderRef = React.createRef() as React.MutableRefObject<HTMLButtonElement | null>; |
There was a problem hiding this comment.
I removed as and handleRef and manually set ref in render...
| if (value > max) value = max; | ||
| if (value < min) value = min; | ||
| if (max !== undefined && value > max) value = max; | ||
| if (min !== undefined && value < min) value = min; |
There was a problem hiding this comment.
I removed unnecessary checks
| const result = index + min; | ||
|
|
||
| if (min !== undefined && index < min) return min; | ||
| if (max !== undefined && result > max) return max; |
Changelog
@semcore/slider
Fixed
NSSlidernamespace.Motivation and Context
Rewrite component to TS. Deprecate atomic types in favor of namespaces. Nothing changed in how component works. (I hope :D)
How has this been tested?
Screenshots (if appropriate):
Types of changes
Checklist: