@salutejs/plasma-new-hope 0.156.0-canary.1451.11071589632.0 → 0.156.0-canary.1452.11101408453.0
Sign up to get free protection for your applications and to get access to all the features.
- package/cjs/components/Slider/Slider.css +14 -12
- package/cjs/components/Slider/Slider.js +9 -1
- package/cjs/components/Slider/Slider.js.map +1 -1
- package/cjs/components/Slider/Slider.tokens.js +15 -3
- package/cjs/components/Slider/Slider.tokens.js.map +1 -1
- package/cjs/components/Slider/components/Double/Double.css +7 -7
- package/cjs/components/Slider/components/Double/Double.js +14 -9
- package/cjs/components/Slider/components/Double/Double.js.map +1 -1
- package/cjs/components/Slider/components/Single/Single.css +13 -13
- package/cjs/components/Slider/components/Single/Single.js +53 -30
- package/cjs/components/Slider/components/Single/Single.js.map +1 -1
- package/cjs/components/Slider/components/Single/Single.styles.js +4 -4
- package/cjs/components/Slider/components/Single/Single.styles.js.map +1 -1
- package/cjs/components/Slider/components/Single/Single.styles_fdps5r.css +6 -0
- package/cjs/components/Slider/components/SliderBase/SliderBase.css +4 -4
- package/cjs/components/Slider/components/SliderBase/SliderBase.js +27 -12
- package/cjs/components/Slider/components/SliderBase/SliderBase.js.map +1 -1
- package/cjs/components/Slider/components/SliderBase/SliderBase.styles.js +7 -7
- package/cjs/components/Slider/components/SliderBase/SliderBase.styles.js.map +1 -1
- package/cjs/components/Slider/components/SliderBase/SliderBase.styles_1g9fv8o.css +4 -0
- package/cjs/components/Slider/ui/Handler/Handler.css +3 -3
- package/cjs/components/Slider/ui/Handler/Handler.js +38 -32
- package/cjs/components/Slider/ui/Handler/Handler.js.map +1 -1
- package/cjs/components/Slider/ui/Handler/Handler.styles.js +17 -7
- package/cjs/components/Slider/ui/Handler/Handler.styles.js.map +1 -1
- package/cjs/components/Slider/ui/Handler/Handler.styles_xinbde.css +2 -0
- package/cjs/components/Slider/ui/Thumb/Thumb.css +1 -1
- package/cjs/components/Slider/ui/Thumb/Thumb.js +3 -2
- package/cjs/components/Slider/ui/Thumb/Thumb.js.map +1 -1
- package/cjs/components/Slider/ui/Thumb/Thumb.styles.js +1 -1
- package/cjs/components/Slider/ui/Thumb/Thumb.styles.js.map +1 -1
- package/cjs/components/Slider/ui/Thumb/Thumb.styles_wjaol4.css +1 -0
- package/cjs/components/Slider/utils/index.js +28 -10
- package/cjs/components/Slider/utils/index.js.map +1 -1
- package/cjs/components/Slider/variations/_view/base.js +1 -1
- package/cjs/components/Slider/variations/_view/base.js.map +1 -1
- package/cjs/components/Slider/variations/_view/base_1s3f6q8.css +1 -0
- package/cjs/components/TextArea/TextArea.js +15 -21
- package/cjs/components/TextArea/TextArea.js.map +1 -1
- package/cjs/components/TextArea/TextArea.tokens.js +2 -15
- package/cjs/components/TextArea/TextArea.tokens.js.map +1 -1
- package/cjs/components/TextArea/variations/_view/base.js +1 -1
- package/cjs/components/TextArea/variations/_view/base.js.map +1 -1
- package/cjs/components/TextArea/variations/_view/base_8npjyq.css +1 -0
- package/cjs/index.css +15 -15
- package/cjs/utils/index.js.map +1 -1
- package/emotion/cjs/components/Slider/Slider.js +9 -1
- package/emotion/cjs/components/Slider/Slider.tokens.js +15 -3
- package/emotion/cjs/components/Slider/components/Double/Double.js +10 -5
- package/emotion/cjs/components/Slider/components/Single/Single.js +53 -30
- package/emotion/cjs/components/Slider/components/Single/Single.styles.js +18 -9
- package/emotion/cjs/components/Slider/components/SliderBase/SliderBase.js +27 -12
- package/emotion/cjs/components/Slider/components/SliderBase/SliderBase.styles.js +9 -9
- package/emotion/cjs/components/Slider/ui/Handler/Handler.js +41 -32
- package/emotion/cjs/components/Slider/ui/Handler/Handler.styles.js +9 -15
- package/emotion/cjs/components/Slider/ui/Thumb/Thumb.js +3 -2
- package/emotion/cjs/components/Slider/ui/Thumb/Thumb.styles.js +3 -3
- package/emotion/cjs/components/Slider/utils/index.js +28 -10
- package/emotion/cjs/components/Slider/variations/_view/base.js +2 -1
- package/emotion/cjs/components/TextArea/TextArea.js +16 -22
- package/emotion/cjs/components/TextArea/TextArea.template-doc.mdx +0 -29
- package/emotion/cjs/components/TextArea/TextArea.tokens.js +2 -15
- package/emotion/cjs/components/TextArea/variations/_view/base.js +2 -2
- package/emotion/cjs/examples/plasma_b2c/components/Slider/Slider.config.js +7 -7
- package/emotion/cjs/examples/plasma_b2c/components/Slider/Slider.stories.tsx +71 -9
- package/emotion/cjs/examples/plasma_b2c/components/TextArea/TextArea.config.js +9 -12
- package/emotion/cjs/examples/plasma_b2c/components/TextArea/TextArea.stories.tsx +10 -17
- package/emotion/cjs/examples/plasma_web/components/Slider/Slider.config.js +7 -7
- package/emotion/cjs/examples/plasma_web/components/Slider/Slider.stories.tsx +73 -10
- package/emotion/cjs/examples/plasma_web/components/TextArea/TextArea.config.js +9 -12
- package/emotion/cjs/examples/plasma_web/components/TextArea/TextArea.stories.tsx +11 -17
- package/emotion/es/components/Slider/Slider.js +9 -1
- package/emotion/es/components/Slider/Slider.tokens.js +15 -3
- package/emotion/es/components/Slider/components/Double/Double.js +10 -5
- package/emotion/es/components/Slider/components/Single/Single.js +54 -31
- package/emotion/es/components/Slider/components/Single/Single.styles.js +17 -8
- package/emotion/es/components/Slider/components/SliderBase/SliderBase.js +27 -12
- package/emotion/es/components/Slider/components/SliderBase/SliderBase.styles.js +10 -10
- package/emotion/es/components/Slider/ui/Handler/Handler.js +40 -30
- package/emotion/es/components/Slider/ui/Handler/Handler.styles.js +10 -16
- package/emotion/es/components/Slider/ui/Thumb/Thumb.js +3 -2
- package/emotion/es/components/Slider/ui/Thumb/Thumb.styles.js +3 -3
- package/emotion/es/components/Slider/utils/index.js +28 -10
- package/emotion/es/components/Slider/variations/_view/base.js +2 -1
- package/emotion/es/components/TextArea/TextArea.js +14 -20
- package/emotion/es/components/TextArea/TextArea.template-doc.mdx +0 -29
- package/emotion/es/components/TextArea/TextArea.tokens.js +2 -15
- package/emotion/es/components/TextArea/variations/_view/base.js +2 -2
- package/emotion/es/examples/plasma_b2c/components/Slider/Slider.config.js +7 -7
- package/emotion/es/examples/plasma_b2c/components/Slider/Slider.stories.tsx +71 -9
- package/emotion/es/examples/plasma_b2c/components/TextArea/TextArea.config.js +9 -12
- package/emotion/es/examples/plasma_b2c/components/TextArea/TextArea.stories.tsx +10 -17
- package/emotion/es/examples/plasma_web/components/Slider/Slider.config.js +7 -7
- package/emotion/es/examples/plasma_web/components/Slider/Slider.stories.tsx +73 -10
- package/emotion/es/examples/plasma_web/components/TextArea/TextArea.config.js +9 -12
- package/emotion/es/examples/plasma_web/components/TextArea/TextArea.stories.tsx +11 -17
- package/es/components/Slider/Slider.css +14 -12
- package/es/components/Slider/Slider.js +9 -1
- package/es/components/Slider/Slider.js.map +1 -1
- package/es/components/Slider/Slider.tokens.js +15 -3
- package/es/components/Slider/Slider.tokens.js.map +1 -1
- package/es/components/Slider/components/Double/Double.css +7 -7
- package/es/components/Slider/components/Double/Double.js +10 -5
- package/es/components/Slider/components/Double/Double.js.map +1 -1
- package/es/components/Slider/components/Single/Single.css +13 -13
- package/es/components/Slider/components/Single/Single.js +54 -31
- package/es/components/Slider/components/Single/Single.js.map +1 -1
- package/es/components/Slider/components/Single/Single.styles.js +4 -4
- package/es/components/Slider/components/Single/Single.styles.js.map +1 -1
- package/es/components/Slider/components/Single/Single.styles_fdps5r.css +6 -0
- package/es/components/Slider/components/SliderBase/SliderBase.css +4 -4
- package/es/components/Slider/components/SliderBase/SliderBase.js +27 -12
- package/es/components/Slider/components/SliderBase/SliderBase.js.map +1 -1
- package/es/components/Slider/components/SliderBase/SliderBase.styles.js +7 -7
- package/es/components/Slider/components/SliderBase/SliderBase.styles.js.map +1 -1
- package/es/components/Slider/components/SliderBase/SliderBase.styles_1g9fv8o.css +4 -0
- package/es/components/Slider/ui/Handler/Handler.css +3 -3
- package/es/components/Slider/ui/Handler/Handler.js +37 -31
- package/es/components/Slider/ui/Handler/Handler.js.map +1 -1
- package/es/components/Slider/ui/Handler/Handler.styles.js +17 -7
- package/es/components/Slider/ui/Handler/Handler.styles.js.map +1 -1
- package/es/components/Slider/ui/Handler/Handler.styles_xinbde.css +2 -0
- package/es/components/Slider/ui/Thumb/Thumb.css +1 -1
- package/es/components/Slider/ui/Thumb/Thumb.js +3 -2
- package/es/components/Slider/ui/Thumb/Thumb.js.map +1 -1
- package/es/components/Slider/ui/Thumb/Thumb.styles.js +1 -1
- package/es/components/Slider/ui/Thumb/Thumb.styles.js.map +1 -1
- package/es/components/Slider/ui/Thumb/Thumb.styles_wjaol4.css +1 -0
- package/es/components/Slider/utils/index.js +28 -10
- package/es/components/Slider/utils/index.js.map +1 -1
- package/es/components/Slider/variations/_view/base.js +1 -1
- package/es/components/Slider/variations/_view/base.js.map +1 -1
- package/es/components/Slider/variations/_view/base_1s3f6q8.css +1 -0
- package/es/components/TextArea/TextArea.js +15 -21
- package/es/components/TextArea/TextArea.js.map +1 -1
- package/es/components/TextArea/TextArea.tokens.js +2 -15
- package/es/components/TextArea/TextArea.tokens.js.map +1 -1
- package/es/components/TextArea/variations/_view/base.js +1 -1
- package/es/components/TextArea/variations/_view/base.js.map +1 -1
- package/es/components/TextArea/variations/_view/base_8npjyq.css +1 -0
- package/es/index.css +15 -15
- package/es/utils/index.js.map +1 -1
- package/package.json +2 -2
- package/styled-components/cjs/components/Slider/Slider.js +9 -1
- package/styled-components/cjs/components/Slider/Slider.tokens.js +15 -3
- package/styled-components/cjs/components/Slider/components/Double/Double.js +10 -5
- package/styled-components/cjs/components/Slider/components/Single/Single.js +53 -30
- package/styled-components/cjs/components/Slider/components/Single/Single.styles.js +4 -4
- package/styled-components/cjs/components/Slider/components/SliderBase/SliderBase.js +27 -12
- package/styled-components/cjs/components/Slider/components/SliderBase/SliderBase.styles.js +6 -6
- package/styled-components/cjs/components/Slider/ui/Handler/Handler.js +41 -32
- package/styled-components/cjs/components/Slider/ui/Handler/Handler.styles.js +7 -4
- package/styled-components/cjs/components/Slider/ui/Thumb/Thumb.js +3 -2
- package/styled-components/cjs/components/Slider/ui/Thumb/Thumb.styles.js +2 -2
- package/styled-components/cjs/components/Slider/utils/index.js +28 -10
- package/styled-components/cjs/components/Slider/variations/_view/base.js +2 -1
- package/styled-components/cjs/components/TextArea/TextArea.js +15 -21
- package/styled-components/cjs/components/TextArea/TextArea.template-doc.mdx +0 -29
- package/styled-components/cjs/components/TextArea/TextArea.tokens.js +2 -15
- package/styled-components/cjs/components/TextArea/variations/_view/base.js +1 -1
- package/styled-components/cjs/examples/plasma_b2c/components/Slider/Slider.config.js +3 -3
- package/styled-components/cjs/examples/plasma_b2c/components/Slider/Slider.stories.tsx +71 -9
- package/styled-components/cjs/examples/plasma_b2c/components/TextArea/TextArea.config.js +9 -12
- package/styled-components/cjs/examples/plasma_b2c/components/TextArea/TextArea.stories.tsx +10 -17
- package/styled-components/cjs/examples/plasma_web/components/Slider/Slider.config.js +3 -3
- package/styled-components/cjs/examples/plasma_web/components/Slider/Slider.stories.tsx +73 -10
- package/styled-components/cjs/examples/plasma_web/components/TextArea/TextArea.config.js +8 -11
- package/styled-components/cjs/examples/plasma_web/components/TextArea/TextArea.stories.tsx +11 -17
- package/styled-components/es/components/Slider/Slider.js +9 -1
- package/styled-components/es/components/Slider/Slider.tokens.js +15 -3
- package/styled-components/es/components/Slider/components/Double/Double.js +10 -5
- package/styled-components/es/components/Slider/components/Single/Single.js +54 -31
- package/styled-components/es/components/Slider/components/Single/Single.styles.js +3 -3
- package/styled-components/es/components/Slider/components/SliderBase/SliderBase.js +27 -12
- package/styled-components/es/components/Slider/components/SliderBase/SliderBase.styles.js +7 -7
- package/styled-components/es/components/Slider/ui/Handler/Handler.js +40 -30
- package/styled-components/es/components/Slider/ui/Handler/Handler.styles.js +8 -5
- package/styled-components/es/components/Slider/ui/Thumb/Thumb.js +3 -2
- package/styled-components/es/components/Slider/ui/Thumb/Thumb.styles.js +2 -2
- package/styled-components/es/components/Slider/utils/index.js +28 -10
- package/styled-components/es/components/Slider/variations/_view/base.js +2 -1
- package/styled-components/es/components/TextArea/TextArea.js +13 -19
- package/styled-components/es/components/TextArea/TextArea.template-doc.mdx +0 -29
- package/styled-components/es/components/TextArea/TextArea.tokens.js +2 -15
- package/styled-components/es/components/TextArea/variations/_view/base.js +1 -1
- package/styled-components/es/examples/plasma_b2c/components/Slider/Slider.config.js +3 -3
- package/styled-components/es/examples/plasma_b2c/components/Slider/Slider.stories.tsx +71 -9
- package/styled-components/es/examples/plasma_b2c/components/TextArea/TextArea.config.js +9 -12
- package/styled-components/es/examples/plasma_b2c/components/TextArea/TextArea.stories.tsx +10 -17
- package/styled-components/es/examples/plasma_web/components/Slider/Slider.config.js +3 -3
- package/styled-components/es/examples/plasma_web/components/Slider/Slider.stories.tsx +73 -10
- package/styled-components/es/examples/plasma_web/components/TextArea/TextArea.config.js +8 -11
- package/styled-components/es/examples/plasma_web/components/TextArea/TextArea.stories.tsx +11 -17
- package/types/components/Slider/Slider.d.ts.map +1 -1
- package/types/components/Slider/Slider.tokens.d.ts +14 -2
- package/types/components/Slider/Slider.tokens.d.ts.map +1 -1
- package/types/components/Slider/components/Double/Double.d.ts.map +1 -1
- package/types/components/Slider/components/Double/Double.types.d.ts +2 -0
- package/types/components/Slider/components/Double/Double.types.d.ts.map +1 -1
- package/types/components/Slider/components/Single/Single.d.ts.map +1 -1
- package/types/components/Slider/components/Single/Single.styles.d.ts +1 -1
- package/types/components/Slider/components/Single/Single.styles.d.ts.map +1 -1
- package/types/components/Slider/components/Single/Single.types.d.ts +26 -1
- package/types/components/Slider/components/Single/Single.types.d.ts.map +1 -1
- package/types/components/Slider/components/SliderBase/SliderBase.d.ts.map +1 -1
- package/types/components/Slider/components/SliderBase/SliderBase.styles.d.ts +1 -1
- package/types/components/Slider/components/SliderBase/SliderBase.styles.d.ts.map +1 -1
- package/types/components/Slider/components/SliderBase/SliderBase.types.d.ts +1 -0
- package/types/components/Slider/components/SliderBase/SliderBase.types.d.ts.map +1 -1
- package/types/components/Slider/ui/Handler/Handler.d.ts.map +1 -1
- package/types/components/Slider/ui/Handler/Handler.styles.d.ts +6 -2
- package/types/components/Slider/ui/Handler/Handler.styles.d.ts.map +1 -1
- package/types/components/Slider/ui/Handler/Handler.types.d.ts +4 -1
- package/types/components/Slider/ui/Handler/Handler.types.d.ts.map +1 -1
- package/types/components/Slider/ui/Thumb/Thumb.d.ts +1 -1
- package/types/components/Slider/ui/Thumb/Thumb.d.ts.map +1 -1
- package/types/components/Slider/ui/Thumb/Thumb.styles.d.ts.map +1 -1
- package/types/components/Slider/ui/Thumb/Thumb.types.d.ts +1 -0
- package/types/components/Slider/ui/Thumb/Thumb.types.d.ts.map +1 -1
- package/types/components/Slider/utils/index.d.ts +26 -8
- package/types/components/Slider/utils/index.d.ts.map +1 -1
- package/types/components/Slider/variations/_view/base.d.ts.map +1 -1
- package/types/components/TextArea/TextArea.d.ts +0 -4
- package/types/components/TextArea/TextArea.d.ts.map +1 -1
- package/types/components/TextArea/TextArea.tokens.d.ts +0 -13
- package/types/components/TextArea/TextArea.tokens.d.ts.map +1 -1
- package/types/components/TextArea/TextArea.types.d.ts +3 -15
- package/types/components/TextArea/TextArea.types.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Slider/Slider.config.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/TextArea/TextArea.config.d.ts +0 -3
- package/types/examples/plasma_b2c/components/TextArea/TextArea.config.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/TextArea/TextArea.d.ts +0 -81
- package/types/examples/plasma_b2c/components/TextArea/TextArea.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Slider/Slider.config.d.ts.map +1 -1
- package/types/examples/plasma_web/components/TextArea/TextArea.config.d.ts +0 -3
- package/types/examples/plasma_web/components/TextArea/TextArea.config.d.ts.map +1 -1
- package/types/examples/plasma_web/components/TextArea/TextArea.d.ts +0 -81
- package/types/examples/plasma_web/components/TextArea/TextArea.d.ts.map +1 -1
- package/types/utils/index.d.ts +1 -1
- package/types/utils/index.d.ts.map +1 -1
- package/cjs/components/Slider/components/Single/Single.styles_1r9f1e0.css +0 -6
- package/cjs/components/Slider/components/SliderBase/SliderBase.styles_7is2ll.css +0 -4
- package/cjs/components/Slider/ui/Handler/Handler.styles_8crx5z.css +0 -2
- package/cjs/components/Slider/ui/Thumb/Thumb.styles_4w4gzn.css +0 -1
- package/cjs/components/Slider/variations/_view/base_x642ct.css +0 -1
- package/cjs/components/TextArea/variations/_clear/base.js +0 -9
- package/cjs/components/TextArea/variations/_clear/base.js.map +0 -1
- package/cjs/components/TextArea/variations/_clear/base_193g3al.css +0 -1
- package/cjs/components/TextArea/variations/_view/base_d83rii.css +0 -1
- package/emotion/cjs/components/TextArea/variations/_clear/base.js +0 -10
- package/emotion/es/components/TextArea/variations/_clear/base.js +0 -4
- package/es/components/Slider/components/Single/Single.styles_1r9f1e0.css +0 -6
- package/es/components/Slider/components/SliderBase/SliderBase.styles_7is2ll.css +0 -4
- package/es/components/Slider/ui/Handler/Handler.styles_8crx5z.css +0 -2
- package/es/components/Slider/ui/Thumb/Thumb.styles_4w4gzn.css +0 -1
- package/es/components/Slider/variations/_view/base_x642ct.css +0 -1
- package/es/components/TextArea/variations/_clear/base.js +0 -5
- package/es/components/TextArea/variations/_clear/base.js.map +0 -1
- package/es/components/TextArea/variations/_clear/base_193g3al.css +0 -1
- package/es/components/TextArea/variations/_view/base_d83rii.css +0 -1
- package/styled-components/cjs/components/TextArea/variations/_clear/base.js +0 -10
- package/styled-components/es/components/TextArea/variations/_clear/base.js +0 -4
- package/types/components/TextArea/variations/_clear/base.d.ts +0 -2
- package/types/components/TextArea/variations/_clear/base.d.ts.map +0 -1
@@ -3,18 +3,23 @@ import type { ComponentProps } from 'react';
|
|
3
3
|
import styled from 'styled-components';
|
4
4
|
import { disableProps } from '@salutejs/plasma-sb-utils';
|
5
5
|
import type { StoryObj, Meta } from '@storybook/react';
|
6
|
+
import { action } from '@storybook/addon-actions';
|
6
7
|
|
8
|
+
import { IconMic } from '../../../../components/_Icon';
|
7
9
|
import { WithTheme } from '../../../_helpers';
|
8
10
|
|
9
11
|
import { Slider } from './Slider';
|
10
12
|
|
11
13
|
const sizes = ['l', 'm', 's'];
|
14
|
+
const pointerSizes = ['s', 'l', 'none'];
|
12
15
|
const views = ['default', 'accent', 'gradient'];
|
16
|
+
const labelAligns = ['center', 'left', 'right', 'none'];
|
13
17
|
const labelPlacements = ['outer', 'inner'];
|
14
18
|
const rangeValuesPlacement = ['outer', 'inner'];
|
19
|
+
const orientations: Array<string> = ['vertical', 'horizontal'];
|
15
20
|
|
16
21
|
const meta: Meta<typeof Slider> = {
|
17
|
-
title: '
|
22
|
+
title: 'plasma_b2c/Slider',
|
18
23
|
component: Slider,
|
19
24
|
decorators: [WithTheme],
|
20
25
|
argTypes: {
|
@@ -30,6 +35,18 @@ const meta: Meta<typeof Slider> = {
|
|
30
35
|
type: 'inline-radio',
|
31
36
|
},
|
32
37
|
},
|
38
|
+
pointerSize: {
|
39
|
+
options: pointerSizes,
|
40
|
+
control: {
|
41
|
+
type: 'inline-radio',
|
42
|
+
},
|
43
|
+
},
|
44
|
+
orientation: {
|
45
|
+
options: orientations,
|
46
|
+
control: {
|
47
|
+
type: 'select',
|
48
|
+
},
|
49
|
+
},
|
33
50
|
...disableProps([
|
34
51
|
'value',
|
35
52
|
'onChangeCommitted',
|
@@ -51,8 +68,9 @@ type StorySingleProps = StoryProps;
|
|
51
68
|
type StorySingle = StoryObj<StorySingleProps>;
|
52
69
|
type StoryDouble = StoryObj<StoryProps>;
|
53
70
|
|
54
|
-
const SliderWrapper = styled.div
|
55
|
-
width: 25rem;
|
71
|
+
const SliderWrapper = styled.div<{ isVertical?: boolean }>`
|
72
|
+
width: ${({ isVertical }) => (isVertical ? 'auto' : '25rem')};
|
73
|
+
height: ${({ isVertical }) => (isVertical ? '25rem' : 'auto')};
|
56
74
|
`;
|
57
75
|
|
58
76
|
const StoryDefault = (args: StorySingleProps) => {
|
@@ -66,41 +84,86 @@ const StoryDefault = (args: StorySingleProps) => {
|
|
66
84
|
setValue(values);
|
67
85
|
};
|
68
86
|
|
87
|
+
const { hasIcon, showIcon, orientation, labelPlacement, labelVerticalPlacement, ...rest } = args;
|
88
|
+
const isVertical = orientation === 'vertical';
|
89
|
+
|
69
90
|
return (
|
70
|
-
<SliderWrapper>
|
71
|
-
<Slider
|
91
|
+
<SliderWrapper isVertical={isVertical}>
|
92
|
+
<Slider
|
93
|
+
value={value}
|
94
|
+
orientation={orientation}
|
95
|
+
labelPlacement={labelPlacement}
|
96
|
+
labelContent={showIcon ? <IconMic size={rest.size === 's' ? 'xs' : 's'} /> : null}
|
97
|
+
onChangeCommitted={onChangeCommittedHandle}
|
98
|
+
onChange={onChangeHandle}
|
99
|
+
{...rest}
|
100
|
+
/>
|
72
101
|
</SliderWrapper>
|
73
102
|
);
|
74
103
|
};
|
75
104
|
|
76
105
|
export const Default: StorySingle = {
|
77
106
|
argTypes: {
|
107
|
+
labelAlign: {
|
108
|
+
options: labelAligns,
|
109
|
+
control: {
|
110
|
+
type: 'inline-radio',
|
111
|
+
},
|
112
|
+
if: { arg: 'orientation', eq: 'vertical' },
|
113
|
+
},
|
78
114
|
labelPlacement: {
|
79
115
|
options: labelPlacements,
|
80
116
|
control: {
|
81
117
|
type: 'inline-radio',
|
82
118
|
},
|
119
|
+
if: { arg: 'orientation', eq: 'horizontal' },
|
120
|
+
},
|
121
|
+
labelReversed: {
|
122
|
+
control: {
|
123
|
+
type: 'boolean',
|
124
|
+
expanded: true,
|
125
|
+
},
|
126
|
+
if: { arg: 'orientation', eq: 'orientation' },
|
83
127
|
},
|
84
128
|
rangeValuesPlacement: {
|
85
129
|
options: rangeValuesPlacement,
|
86
130
|
control: {
|
87
131
|
type: 'inline-radio',
|
88
132
|
},
|
133
|
+
if: { arg: 'orientation', eq: 'horizontal' },
|
134
|
+
},
|
135
|
+
orientation: {
|
136
|
+
options: orientations,
|
137
|
+
control: {
|
138
|
+
type: 'select',
|
139
|
+
},
|
140
|
+
},
|
141
|
+
reversed: {
|
142
|
+
control: {
|
143
|
+
type: 'boolean',
|
144
|
+
},
|
145
|
+
if: { arg: 'orientation', eq: 'vertical' },
|
89
146
|
},
|
90
147
|
},
|
91
148
|
args: {
|
92
149
|
view: 'default',
|
93
150
|
size: 'm',
|
151
|
+
pointerSize: 's',
|
94
152
|
min: 0,
|
95
153
|
max: 100,
|
96
|
-
|
97
|
-
ariaLabel: 'Цена
|
154
|
+
orientation: 'horizontal',
|
155
|
+
ariaLabel: 'Цена микрофона',
|
98
156
|
multipleStepSize: 10,
|
99
|
-
label: 'Цена
|
157
|
+
label: 'Цена микрофона',
|
100
158
|
labelPlacement: 'outer',
|
159
|
+
labelAlign: 'center',
|
101
160
|
rangeValuesPlacement: 'outer',
|
102
|
-
|
161
|
+
showScale: true,
|
103
162
|
showCurrentValue: false,
|
163
|
+
showIcon: true,
|
164
|
+
reversed: false,
|
165
|
+
labelReversed: false,
|
166
|
+
disabled: false,
|
104
167
|
},
|
105
168
|
render: (args) => <StoryDefault {...args} />,
|
106
169
|
};
|
@@ -140,7 +203,7 @@ const StoryMultipleValues = (args: StoryProps) => {
|
|
140
203
|
};
|
141
204
|
|
142
205
|
return (
|
143
|
-
<SliderWrapper>
|
206
|
+
<SliderWrapper isVertical={args.orientation === 'vertical'}>
|
144
207
|
<Slider
|
145
208
|
value={value}
|
146
209
|
onKeyDownTextField={onKeyDownTextField}
|