@salutejs/plasma-new-hope 0.76.6-canary.1188.8780100396.0 → 0.76.6-canary.1190.8779486510.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (3) hide show
  1. package/package.json +4 -4
  2. package/styled-components/cjs/examples/plasma_b2c/components/Radiobox/Radiobox.stories.tsx +43 -37
  3. package/styled-components/es/examples/plasma_b2c/components/Radiobox/Radiobox.stories.tsx +43 -37
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salutejs/plasma-new-hope",
3
- "version": "0.76.6-canary.1188.8780100396.0",
3
+ "version": "0.76.6-canary.1190.8779486510.0",
4
4
  "description": "Salute Design System blueprint",
5
5
  "main": "cjs/index.js",
6
6
  "module": "es/index.js",
@@ -68,7 +68,7 @@
68
68
  "@rollup/plugin-babel": "^6.0.3",
69
69
  "@rollup/plugin-commonjs": "^25.0.4",
70
70
  "@rollup/plugin-node-resolve": "^15.1.0",
71
- "@salutejs/plasma-sb-utils": "0.156.2-dev.0",
71
+ "@salutejs/plasma-sb-utils": "0.156.3-canary.1190.8779486510.0",
72
72
  "@storybook/addon-docs": "^7.6.17",
73
73
  "@storybook/addon-essentials": "^7.6.17",
74
74
  "@storybook/addons": "^7.6.17",
@@ -97,10 +97,10 @@
97
97
  "@linaria/core": "5.0.2",
98
98
  "@linaria/react": "5.0.3",
99
99
  "@popperjs/core": "2.11.8",
100
- "@salutejs/plasma-core": "1.158.1-dev.0",
100
+ "@salutejs/plasma-core": "1.158.2-canary.1190.8779486510.0",
101
101
  "focus-visible": "5.2.0",
102
102
  "react-popper": "2.3.0",
103
103
  "storeon": "3.1.5"
104
104
  },
105
- "gitHead": "0ff503f5d5c700fbf01c442321924793568bd3d4"
105
+ "gitHead": "126ffe6f51422492a4e5ea9be35bc685adee83ca"
106
106
  }
package/styled-components/cjs/examples/plasma_b2c/components/Radiobox/Radiobox.stories.tsx CHANGED
@@ -51,56 +51,61 @@ const items = [
51
51
  { langName, value: 'elixir', label: 'Elixir', disabled: true },
52
52
  ];
53
53
 
54
- const StoryDefault = ({ label, description, name, ...props }: RadioboxProps) => {
54
+ const StoryDefault = (props: RadioboxProps) => {
55
55
  const value = 0;
56
56
  const [checked, setChecked] = useState(true);
57
57
 
58
58
  return (
59
- <Radiobox
60
- name={name}
61
- value={value}
62
- singleLine
63
- label={label}
64
- description={description}
65
- checked={checked}
66
- onChange={(event) => {
67
- event.persist();
68
-
69
- setChecked(event.target.checked);
70
- onChange(event);
71
- }}
72
- onFocus={onFocus}
73
- onBlur={onBlur}
74
- {...props}
75
- />
59
+ <>
60
+ <Radiobox
61
+ name="item.name"
62
+ value={value}
63
+ singleLine
64
+ label="Label"
65
+ description="Description"
66
+ checked={checked}
67
+ onChange={(event) => {
68
+ event.persist();
69
+
70
+ setChecked(event.target.checked);
71
+ onChange(event);
72
+ }}
73
+ onFocus={onFocus}
74
+ onBlur={onBlur}
75
+ {...props}
76
+ />
77
+ <Radiobox
78
+ name="item.name"
79
+ value={value}
80
+ singleLine
81
+ label="Label looooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooonger"
82
+ description="Description looooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooonger"
83
+ checked={checked}
84
+ onChange={(event) => {
85
+ event.persist();
86
+
87
+ setChecked(event.target.checked);
88
+ onChange(event);
89
+ }}
90
+ onFocus={onFocus}
91
+ onBlur={onBlur}
92
+ {...props}
93
+ />
94
+ </>
76
95
  );
77
96
  };
78
97
 
79
98
  export const Default: StoryObj<RadioboxProps> = {
80
- args: {
81
- label: 'Это label',
82
- description: 'Это описание',
83
- name: 'default',
84
- },
85
- render: (args) => <StoryDefault {...args} />,
86
- };
87
-
88
- export const LongText: StoryObj<RadioboxProps> = {
89
- args: {
90
- label: 'Ооооооооооооооооооооочень длинный label',
91
- description: 'Ооооооооооооооооооооочень длинный description',
92
- name: 'long',
93
- },
94
99
  render: (args) => <StoryDefault {...args} />,
95
100
  };
96
101
 
97
- const StoryRadioGroup = () => {
102
+ const StoryComplex = (props: RadioboxProps) => {
98
103
  const [value, setValue] = useState('c');
99
104
 
100
105
  return (
101
- <RadioGroup aria-labelledby="radiogroup-title-id">
106
+ <RadioGroup>
102
107
  <div id="radiogroup-title-id" style={{ margin: '1rem 0', fontWeight: '600' }}>
103
- Выберите язык программирования для изучения.
108
+ Radiogroup Title
104
109
  </div>
105
110
  {items.map((item) => (
106
111
  <Radiobox
@@ -117,12 +122,13 @@ const StoryRadioGroup = () => {
117
122
  }}
118
123
  onFocus={onFocus}
119
124
  onBlur={onBlur}
125
+ {...props}
120
126
  />
121
127
  ))}
122
128
  </RadioGroup>
123
129
  );
124
130
  };
125
131
 
126
- export const ExampleRadioGroup: StoryObj<RadioboxProps> = {
127
- render: () => <StoryRadioGroup />,
132
+ export const Complex: StoryObj<RadioboxProps> = {
133
+ render: (args) => <StoryComplex {...args} />,
128
134
  };
package/styled-components/es/examples/plasma_b2c/components/Radiobox/Radiobox.stories.tsx CHANGED
@@ -51,56 +51,61 @@ const items = [
51
51
  { langName, value: 'elixir', label: 'Elixir', disabled: true },
52
52
  ];
53
53
 
54
- const StoryDefault = ({ label, description, name, ...props }: RadioboxProps) => {
54
+ const StoryDefault = (props: RadioboxProps) => {
55
55
  const value = 0;
56
56
  const [checked, setChecked] = useState(true);
57
57
 
58
58
  return (
59
- <Radiobox
60
- name={name}
61
- value={value}
62
- singleLine
63
- label={label}
64
- description={description}
65
- checked={checked}
66
- onChange={(event) => {
67
- event.persist();
68
-
69
- setChecked(event.target.checked);
70
- onChange(event);
71
- }}
72
- onFocus={onFocus}
73
- onBlur={onBlur}
74
- {...props}
75
- />
59
+ <>
60
+ <Radiobox
61
+ name="item.name"
62
+ value={value}
63
+ singleLine
64
+ label="Label"
65
+ description="Description"
66
+ checked={checked}
67
+ onChange={(event) => {
68
+ event.persist();
69
+
70
+ setChecked(event.target.checked);
71
+ onChange(event);
72
+ }}
73
+ onFocus={onFocus}
74
+ onBlur={onBlur}
75
+ {...props}
76
+ />
77
+ <Radiobox
78
+ name="item.name"
79
+ value={value}
80
+ singleLine
81
+ label="Label looooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooonger"
82
+ description="Description looooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooonger"
83
+ checked={checked}
84
+ onChange={(event) => {
85
+ event.persist();
86
+
87
+ setChecked(event.target.checked);
88
+ onChange(event);
89
+ }}
90
+ onFocus={onFocus}
91
+ onBlur={onBlur}
92
+ {...props}
93
+ />
94
+ </>
76
95
  );
77
96
  };
78
97
 
79
98
  export const Default: StoryObj<RadioboxProps> = {
80
- args: {
81
- label: 'Это label',
82
- description: 'Это описание',
83
- name: 'default',
84
- },
85
- render: (args) => <StoryDefault {...args} />,
86
- };
87
-
88
- export const LongText: StoryObj<RadioboxProps> = {
89
- args: {
90
- label: 'Ооооооооооооооооооооочень длинный label',
91
- description: 'Ооооооооооооооооооооочень длинный description',
92
- name: 'long',
93
- },
94
99
  render: (args) => <StoryDefault {...args} />,
95
100
  };
96
101
 
97
- const StoryRadioGroup = () => {
102
+ const StoryComplex = (props: RadioboxProps) => {
98
103
  const [value, setValue] = useState('c');
99
104
 
100
105
  return (
101
- <RadioGroup aria-labelledby="radiogroup-title-id">
106
+ <RadioGroup>
102
107
  <div id="radiogroup-title-id" style={{ margin: '1rem 0', fontWeight: '600' }}>
103
- Выберите язык программирования для изучения.
108
+ Radiogroup Title
104
109
  </div>
105
110
  {items.map((item) => (
106
111
  <Radiobox
@@ -117,12 +122,13 @@ const StoryRadioGroup = () => {
117
122
  }}
118
123
  onFocus={onFocus}
119
124
  onBlur={onBlur}
125
+ {...props}
120
126
  />
121
127
  ))}
122
128
  </RadioGroup>
123
129
  );
124
130
  };
125
131
 
126
- export const ExampleRadioGroup: StoryObj<RadioboxProps> = {
127
- render: () => <StoryRadioGroup />,
132
+ export const Complex: StoryObj<RadioboxProps> = {
133
+ render: (args) => <StoryComplex {...args} />,
128
134
  };