@hh.ru/magritte-ui-floating-button 1.0.2 → 1.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/FloatingButton.js +1 -1
  2. package/index.css +125 -178
  3. package/package.json +6 -6
package/FloatingButton.js CHANGED
@@ -6,7 +6,7 @@ import { useServerEnv } from '@hh.ru/magritte-common-is-server-env';
6
6
  import { Loader } from '@hh.ru/magritte-ui-loader';
7
7
  import { Text } from '@hh.ru/magritte-ui-typography';
8
8
 
9
- var styles = {"button":"magritte-button___nL-Hn_1-0-2","loading":"magritte-loading___C0oPZ_1-0-2","postfix":"magritte-postfix___r0EZ6_1-0-2","icon":"magritte-icon___VpqJt_1-0-2","label":"magritte-label___EPgvj_1-0-2","border-radius":"magritte-border-radius___ObLLb_1-0-2","borderRadius":"magritte-border-radius___ObLLb_1-0-2","content":"magritte-content___JNpTZ_1-0-2","withLabel":"magritte-withLabel___3gZML_1-0-2","loader":"magritte-loader___EPezG_1-0-2","button_style-neutral":"magritte-button_style-neutral___bPUwu_1-0-2","buttonStyleNeutral":"magritte-button_style-neutral___bPUwu_1-0-2","button_style-inverse":"magritte-button_style-inverse___Xgf26_1-0-2","buttonStyleInverse":"magritte-button_style-inverse___Xgf26_1-0-2"};
9
+ var styles = {"button":"magritte-button___nL-Hn_1-0-3","loading":"magritte-loading___C0oPZ_1-0-3","postfix":"magritte-postfix___r0EZ6_1-0-3","icon":"magritte-icon___VpqJt_1-0-3","label":"magritte-label___EPgvj_1-0-3","border-radius":"magritte-border-radius___ObLLb_1-0-3","borderRadius":"magritte-border-radius___ObLLb_1-0-3","content":"magritte-content___JNpTZ_1-0-3","withLabel":"magritte-withLabel___3gZML_1-0-3","loader":"magritte-loader___EPezG_1-0-3","button_style-neutral":"magritte-button_style-neutral___bPUwu_1-0-3","buttonStyleNeutral":"magritte-button_style-neutral___bPUwu_1-0-3","button_style-inverse":"magritte-button_style-inverse___Xgf26_1-0-3","buttonStyleInverse":"magritte-button_style-inverse___Xgf26_1-0-3"};
10
10
 
11
11
  const FloatingButton = (props) => {
12
12
  const { Element = 'button', style = 'neutral', disabled, borderRadius, icon: IconComponent, postfix, loading, host, children, className, inlineStyle, } = props;
package/index.css CHANGED
@@ -1,124 +1,71 @@
1
1
  :root{
2
- --magritte-color-component-button-background-neutral-v23-2-1:#000000;
3
- --magritte-color-component-button-background-inverse-v23-2-1:#ffffff;
4
- --magritte-color-component-button-background-state-neutral-disabled-v23-2-1:#DCE3EB;
5
- --magritte-color-component-button-background-state-neutral-hovered-v23-2-1:#343c43;
6
- --magritte-color-component-button-background-state-neutral-pressed-v23-2-1:#000000;
7
- --magritte-color-component-button-background-state-neutral-focused-v23-2-1:#000000;
8
- --magritte-color-component-button-background-state-inverse-hovered-v23-2-1:#EEF1F7;
9
- --magritte-color-component-button-background-state-inverse-pressed-v23-2-1:#ffffff;
10
- --magritte-color-component-button-background-state-inverse-focused-v23-2-1:#ffffff;
11
- --magritte-color-component-button-background-state-inverse-disabled-v23-2-1:#ffffff;
12
- --magritte-color-component-button-text-neutral-v23-2-1:#ffffff;
13
- --magritte-color-component-button-text-inverse-v23-2-1:#0d1115;
14
- --magritte-color-component-button-icon-neutral-v23-2-1:#ffffff;
15
- --magritte-color-component-button-icon-inverse-v23-2-1:#0d1115;
16
- --magritte-color-component-button-loader-icon-neutral-v23-2-1:#ffffff;
17
- --magritte-color-component-button-loader-icon-inverse-v23-2-1:#000000;
18
- --magritte-color-component-button-text-state-neutral-disabled-v23-2-1:#8293a2;
19
- --magritte-color-component-button-text-state-inverse-disabled-v23-2-1:#8da0b0;
20
- --magritte-color-component-button-icon-state-neutral-disabled-v23-2-1:#8293a2;
21
- --magritte-color-component-button-icon-state-inverse-disabled-v23-2-1:#8da0b0;
22
- --magritte-color-component-button-stroke-state-neutral-focused-accessible-v23-2-1:#0070ff7a;
23
- --magritte-color-component-button-stroke-state-inverse-focused-accessible-v23-2-1:#a4c9fe7a;
24
- --magritte-color-component-button-postfix-text-neutral-v23-2-1:#AABBCA;
25
- --magritte-color-component-button-postfix-text-inverse-v23-2-1:#0d1115;
26
- --magritte-color-component-button-postfix-text-state-neutral-disabled-v23-2-1:#AABBCA;
27
- --magritte-color-component-button-postfix-text-state-inverse-disabled-v23-2-1:#96aabb;
28
- --magritte-shadow-level-2-color-v23-2-1:#7090b03d;
29
- --magritte-shadow-level-2-x-v23-2-1:0px;
30
- --magritte-shadow-level-2-y-v23-2-1:8px;
31
- --magritte-shadow-level-2-blur-v23-2-1:16px;
32
- --magritte-shadow-level-2-spread-v23-2-1:0px;
33
- --magritte-shadow-level-1-color-v23-2-1:#7090b029;
34
- --magritte-shadow-level-1-x-v23-2-1:0px;
35
- --magritte-shadow-level-1-y-v23-2-1:4px;
36
- --magritte-shadow-level-1-blur-v23-2-1:12px;
37
- --magritte-shadow-level-1-spread-v23-2-1:0px;
38
- }
39
-
40
- :root{
41
- --magritte-semantic-border-width-tab-focused-v23-2-1:4px;
2
+ --magritte-color-component-button-background-neutral-v23-2-2:#000000;
3
+ --magritte-color-component-button-background-inverse-v23-2-2:#ffffff;
4
+ --magritte-color-component-button-background-state-neutral-disabled-v23-2-2:#DCE3EB;
5
+ --magritte-color-component-button-background-state-neutral-hovered-v23-2-2:#343c43;
6
+ --magritte-color-component-button-background-state-neutral-pressed-v23-2-2:#000000;
7
+ --magritte-color-component-button-background-state-neutral-focused-v23-2-2:#000000;
8
+ --magritte-color-component-button-background-state-inverse-hovered-v23-2-2:#EEF1F7;
9
+ --magritte-color-component-button-background-state-inverse-pressed-v23-2-2:#ffffff;
10
+ --magritte-color-component-button-background-state-inverse-focused-v23-2-2:#ffffff;
11
+ --magritte-color-component-button-background-state-inverse-disabled-v23-2-2:#ffffff;
12
+ --magritte-color-component-button-text-neutral-v23-2-2:#ffffff;
13
+ --magritte-color-component-button-text-inverse-v23-2-2:#0d1115;
14
+ --magritte-color-component-button-icon-neutral-v23-2-2:#ffffff;
15
+ --magritte-color-component-button-icon-inverse-v23-2-2:#0d1115;
16
+ --magritte-color-component-button-loader-icon-neutral-v23-2-2:#ffffff;
17
+ --magritte-color-component-button-loader-icon-inverse-v23-2-2:#000000;
18
+ --magritte-color-component-button-text-state-neutral-disabled-v23-2-2:#8293a2;
19
+ --magritte-color-component-button-text-state-inverse-disabled-v23-2-2:#8da0b0;
20
+ --magritte-color-component-button-icon-state-neutral-disabled-v23-2-2:#8293a2;
21
+ --magritte-color-component-button-icon-state-inverse-disabled-v23-2-2:#8da0b0;
22
+ --magritte-color-component-button-stroke-state-neutral-focused-accessible-v23-2-2:#0070ff7a;
23
+ --magritte-color-component-button-stroke-state-inverse-focused-accessible-v23-2-2:#a4c9fe7a;
24
+ --magritte-color-component-button-postfix-text-neutral-v23-2-2:#AABBCA;
25
+ --magritte-color-component-button-postfix-text-inverse-v23-2-2:#0d1115;
26
+ --magritte-color-component-button-postfix-text-state-neutral-disabled-v23-2-2:#AABBCA;
27
+ --magritte-color-component-button-postfix-text-state-inverse-disabled-v23-2-2:#96aabb;
28
+ --magritte-shadow-level-2-color-v23-2-2:#7090b03d;
29
+ --magritte-shadow-level-2-x-v23-2-2:0px;
30
+ --magritte-shadow-level-2-y-v23-2-2:8px;
31
+ --magritte-shadow-level-2-blur-v23-2-2:16px;
32
+ --magritte-shadow-level-2-spread-v23-2-2:0px;
33
+ --magritte-shadow-level-1-color-v23-2-2:#7090b029;
34
+ --magritte-shadow-level-1-x-v23-2-2:0px;
35
+ --magritte-shadow-level-1-y-v23-2-2:4px;
36
+ --magritte-shadow-level-1-blur-v23-2-2:12px;
37
+ --magritte-shadow-level-1-spread-v23-2-2:0px;
42
38
  }
43
39
 
44
40
  .magritte-night-theme{
45
- --magritte-color-component-button-background-neutral-v23-2-1:#ffffff;
46
- --magritte-color-component-button-background-inverse-v23-2-1:#303030;
47
- --magritte-color-component-button-background-state-neutral-disabled-v23-2-1:#303030;
48
- --magritte-color-component-button-background-state-inverse-disabled-v23-2-1:#262626;
49
- --magritte-color-component-button-background-state-neutral-hovered-v23-2-1:#F1F1F1;
50
- --magritte-color-component-button-background-state-neutral-pressed-v23-2-1:#ffffff;
51
- --magritte-color-component-button-background-state-neutral-focused-v23-2-1:#ffffff;
52
- --magritte-color-component-button-background-state-inverse-hovered-v23-2-1:#3B3B3B;
53
- --magritte-color-component-button-background-state-inverse-pressed-v23-2-1:#303030;
54
- --magritte-color-component-button-background-state-inverse-focused-v23-2-1:#303030;
55
- --magritte-color-component-button-text-neutral-v23-2-1:#000000;
56
- --magritte-color-component-button-text-inverse-v23-2-1:#ffffff;
57
- --magritte-color-component-button-text-state-neutral-disabled-v23-2-1:#848484;
58
- --magritte-color-component-button-text-state-inverse-disabled-v23-2-1:#848484;
59
- --magritte-color-component-button-icon-state-neutral-disabled-v23-2-1:#848484;
60
- --magritte-color-component-button-icon-state-inverse-disabled-v23-2-1:#848484;
61
- --magritte-color-component-button-stroke-state-neutral-focused-accessible-v23-2-1:#0070ff7a;
62
- --magritte-color-component-button-stroke-state-inverse-focused-accessible-v23-2-1:#a4c9fe7a;
63
- --magritte-color-component-button-icon-neutral-v23-2-1:#000000;
64
- --magritte-color-component-button-icon-inverse-v23-2-1:#ffffff;
65
- --magritte-color-component-button-loader-icon-neutral-v23-2-1:#000000;
66
- --magritte-color-component-button-loader-icon-inverse-v23-2-1:#ffffff;
67
- --magritte-color-component-button-postfix-text-neutral-v23-2-1:#ABABAB;
68
- --magritte-color-component-button-postfix-text-inverse-v23-2-1:#ABABAB;
69
- --magritte-color-component-button-postfix-text-state-neutral-disabled-v23-2-1:#535353;
70
- --magritte-color-component-button-postfix-text-state-inverse-disabled-v23-2-1:#535353;
71
- --magritte-shadow-level-2-color-v23-2-1:#0000003d;
72
- --magritte-shadow-level-2-x-v23-2-1:0px;
73
- --magritte-shadow-level-2-y-v23-2-1:8px;
74
- --magritte-shadow-level-2-blur-v23-2-1:16px;
75
- --magritte-shadow-level-2-spread-v23-2-1:0px;
76
- --magritte-shadow-level-1-color-v23-2-1:#00000029;
77
- --magritte-shadow-level-1-x-v23-2-1:0px;
78
- --magritte-shadow-level-1-y-v23-2-1:4px;
79
- --magritte-shadow-level-1-blur-v23-2-1:12px;
80
- --magritte-shadow-level-1-spread-v23-2-1:0px;
81
- }
82
-
83
- .magritte-zp-day-theme{
84
- --magritte-color-component-button-background-neutral-v23-2-1:#000000;
85
- --magritte-color-component-button-background-inverse-v23-2-1:#ffffff;
86
- --magritte-color-component-button-background-state-neutral-disabled-v23-2-1:#DCE3EB;
87
- --magritte-color-component-button-background-state-inverse-disabled-v23-2-1:#ffffff;
88
- --magritte-color-component-button-background-state-neutral-hovered-v23-2-1:#343c43;
89
- --magritte-color-component-button-background-state-neutral-pressed-v23-2-1:#000000;
90
- --magritte-color-component-button-background-state-neutral-focused-v23-2-1:#000000;
91
- --magritte-color-component-button-background-state-inverse-hovered-v23-2-1:#EEF1F7;
92
- --magritte-color-component-button-background-state-inverse-pressed-v23-2-1:#ffffff;
93
- --magritte-color-component-button-background-state-inverse-focused-v23-2-1:#ffffff;
94
- --magritte-color-component-button-text-neutral-v23-2-1:#ffffff;
95
- --magritte-color-component-button-text-inverse-v23-2-1:#0d1115;
96
- --magritte-color-component-button-icon-neutral-v23-2-1:#ffffff;
97
- --magritte-color-component-button-icon-inverse-v23-2-1:#0d1115;
98
- --magritte-color-component-button-loader-icon-neutral-v23-2-1:#ffffff;
99
- --magritte-color-component-button-loader-icon-inverse-v23-2-1:#000000;
100
- --magritte-color-component-button-text-state-neutral-disabled-v23-2-1:#8293a2;
101
- --magritte-color-component-button-text-state-inverse-disabled-v23-2-1:#8da0b0;
102
- --magritte-color-component-button-icon-state-neutral-disabled-v23-2-1:#8293a2;
103
- --magritte-color-component-button-icon-state-inverse-disabled-v23-2-1:#8da0b0;
104
- --magritte-color-component-button-stroke-state-neutral-focused-accessible-v23-2-1:#0070ff7a;
105
- --magritte-color-component-button-stroke-state-inverse-focused-accessible-v23-2-1:#a4c9fe7a;
106
- --magritte-color-component-button-postfix-text-neutral-v23-2-1:#AABBCA;
107
- --magritte-color-component-button-postfix-text-inverse-v23-2-1:#0d1115;
108
- --magritte-color-component-button-postfix-text-state-neutral-disabled-v23-2-1:#AABBCA;
109
- --magritte-color-component-button-postfix-text-state-inverse-disabled-v23-2-1:#96aabb;
110
- --magritte-shadow-level-2-color-v23-2-1:#7090b03d;
111
- --magritte-shadow-level-2-x-v23-2-1:0px;
112
- --magritte-shadow-level-2-y-v23-2-1:8px;
113
- --magritte-shadow-level-2-blur-v23-2-1:16px;
114
- --magritte-shadow-level-2-spread-v23-2-1:0px;
115
- --magritte-shadow-level-1-color-v23-2-1:#7090b029;
116
- --magritte-shadow-level-1-x-v23-2-1:0px;
117
- --magritte-shadow-level-1-y-v23-2-1:4px;
118
- --magritte-shadow-level-1-blur-v23-2-1:12px;
119
- --magritte-shadow-level-1-spread-v23-2-1:0px;
120
- }
121
- .magritte-button___nL-Hn_1-0-2{
41
+ --magritte-color-component-button-background-neutral-v23-2-2:#ffffff;
42
+ --magritte-color-component-button-background-inverse-v23-2-2:#303030;
43
+ --magritte-color-component-button-background-state-neutral-disabled-v23-2-2:#303030;
44
+ --magritte-color-component-button-background-state-inverse-disabled-v23-2-2:#262626;
45
+ --magritte-color-component-button-background-state-neutral-hovered-v23-2-2:#F1F1F1;
46
+ --magritte-color-component-button-background-state-neutral-pressed-v23-2-2:#ffffff;
47
+ --magritte-color-component-button-background-state-neutral-focused-v23-2-2:#ffffff;
48
+ --magritte-color-component-button-background-state-inverse-hovered-v23-2-2:#3B3B3B;
49
+ --magritte-color-component-button-background-state-inverse-pressed-v23-2-2:#303030;
50
+ --magritte-color-component-button-background-state-inverse-focused-v23-2-2:#303030;
51
+ --magritte-color-component-button-text-neutral-v23-2-2:#000000;
52
+ --magritte-color-component-button-text-inverse-v23-2-2:#ffffff;
53
+ --magritte-color-component-button-text-state-neutral-disabled-v23-2-2:#848484;
54
+ --magritte-color-component-button-text-state-inverse-disabled-v23-2-2:#848484;
55
+ --magritte-color-component-button-icon-state-neutral-disabled-v23-2-2:#848484;
56
+ --magritte-color-component-button-icon-state-inverse-disabled-v23-2-2:#848484;
57
+ --magritte-color-component-button-icon-neutral-v23-2-2:#000000;
58
+ --magritte-color-component-button-icon-inverse-v23-2-2:#ffffff;
59
+ --magritte-color-component-button-loader-icon-neutral-v23-2-2:#000000;
60
+ --magritte-color-component-button-loader-icon-inverse-v23-2-2:#ffffff;
61
+ --magritte-color-component-button-postfix-text-neutral-v23-2-2:#ABABAB;
62
+ --magritte-color-component-button-postfix-text-inverse-v23-2-2:#ABABAB;
63
+ --magritte-color-component-button-postfix-text-state-neutral-disabled-v23-2-2:#535353;
64
+ --magritte-color-component-button-postfix-text-state-inverse-disabled-v23-2-2:#535353;
65
+ --magritte-shadow-level-2-color-v23-2-2:#0000003d;
66
+ --magritte-shadow-level-1-color-v23-2-2:#00000029;
67
+ }
68
+ .magritte-button___nL-Hn_1-0-3{
122
69
  display:inline-block;
123
70
  padding:12px;
124
71
  border-radius:24px;
@@ -127,48 +74,48 @@
127
74
  bottom:20px;
128
75
  }
129
76
  @media (min-width: 1020px){
130
- body.magritte-old-layout .magritte-button___nL-Hn_1-0-2{
77
+ body.magritte-old-layout .magritte-button___nL-Hn_1-0-3{
131
78
  right:36px;
132
79
  bottom:32px;
133
80
  }
134
81
  }
135
82
  @media (min-width: 1024px){
136
- body:not(.magritte-old-layout) .magritte-button___nL-Hn_1-0-2{
83
+ body:not(.magritte-old-layout) .magritte-button___nL-Hn_1-0-3{
137
84
  right:36px;
138
85
  bottom:32px;
139
86
  }
140
87
  }
141
- .magritte-button___nL-Hn_1-0-2:disabled,
142
- .magritte-button___nL-Hn_1-0-2.magritte-loading___C0oPZ_1-0-2{
88
+ .magritte-button___nL-Hn_1-0-3:disabled,
89
+ .magritte-button___nL-Hn_1-0-3.magritte-loading___C0oPZ_1-0-3{
143
90
  pointer-events:none;
144
91
  cursor:not-allowed;
145
92
  }
146
- .magritte-loading___C0oPZ_1-0-2 .magritte-postfix___r0EZ6_1-0-2,
147
- .magritte-loading___C0oPZ_1-0-2 .magritte-icon___VpqJt_1-0-2,
148
- .magritte-loading___C0oPZ_1-0-2 .magritte-label___EPgvj_1-0-2{
93
+ .magritte-loading___C0oPZ_1-0-3 .magritte-postfix___r0EZ6_1-0-3,
94
+ .magritte-loading___C0oPZ_1-0-3 .magritte-icon___VpqJt_1-0-3,
95
+ .magritte-loading___C0oPZ_1-0-3 .magritte-label___EPgvj_1-0-3{
149
96
  visibility:hidden;
150
97
  }
151
- .magritte-border-radius___ObLLb_1-0-2{
98
+ .magritte-border-radius___ObLLb_1-0-3{
152
99
  border-radius:12px;
153
100
  }
154
- .magritte-content___JNpTZ_1-0-2{
101
+ .magritte-content___JNpTZ_1-0-3{
155
102
  display:flex;
156
103
  position:relative;
157
104
  }
158
- .magritte-withLabel___3gZML_1-0-2 .magritte-icon___VpqJt_1-0-2{
105
+ .magritte-withLabel___3gZML_1-0-3 .magritte-icon___VpqJt_1-0-3{
159
106
  padding-left:4px;
160
107
  }
161
- .magritte-label___EPgvj_1-0-2{
108
+ .magritte-label___EPgvj_1-0-3{
162
109
  padding:1px 4px;
163
110
  }
164
- .magritte-postfix___r0EZ6_1-0-2{
111
+ .magritte-postfix___r0EZ6_1-0-3{
165
112
  padding:1px 4px;
166
113
  }
167
- .magritte-icon___VpqJt_1-0-2 + .magritte-label___EPgvj_1-0-2,
168
- .magritte-icon___VpqJt_1-0-2 + .magritte-postfix___r0EZ6_1-0-2{
114
+ .magritte-icon___VpqJt_1-0-3 + .magritte-label___EPgvj_1-0-3,
115
+ .magritte-icon___VpqJt_1-0-3 + .magritte-postfix___r0EZ6_1-0-3{
169
116
  padding-left:8px;
170
117
  }
171
- .magritte-loader___EPezG_1-0-2{
118
+ .magritte-loader___EPezG_1-0-3{
172
119
  position:absolute;
173
120
  left:50%;
174
121
  top:50%;
@@ -176,73 +123,73 @@
176
123
  line-height:0;
177
124
  overflow:hidden;
178
125
  }
179
- .magritte-button_style-neutral___bPUwu_1-0-2{
180
- background:var(--magritte-color-component-button-background-neutral-v23-2-1);
181
- --magritte-ui-text-color-override:var(--magritte-color-component-button-text-neutral-v23-2-1);
182
- --magritte-ui-icon-color-override:var(--magritte-color-component-button-icon-neutral-v23-2-1);
183
- box-shadow:var(--magritte-shadow-level-2-x-v23-2-1) var(--magritte-shadow-level-2-y-v23-2-1) var(--magritte-shadow-level-2-blur-v23-2-1) var(--magritte-shadow-level-2-spread-v23-2-1) var(--magritte-shadow-level-2-color-v23-2-1);
184
- --magritte-ui-loader-color-override:var(--magritte-color-component-button-loader-icon-neutral-v23-2-1);
126
+ .magritte-button_style-neutral___bPUwu_1-0-3{
127
+ background:var(--magritte-color-component-button-background-neutral-v23-2-2);
128
+ --magritte-ui-text-color-override:var(--magritte-color-component-button-text-neutral-v23-2-2);
129
+ --magritte-ui-icon-color-override:var(--magritte-color-component-button-icon-neutral-v23-2-2);
130
+ box-shadow:var(--magritte-shadow-level-2-x-v23-2-2) var(--magritte-shadow-level-2-y-v23-2-2) var(--magritte-shadow-level-2-blur-v23-2-2) var(--magritte-shadow-level-2-spread-v23-2-2) var(--magritte-shadow-level-2-color-v23-2-2);
131
+ --magritte-ui-loader-color-override:var(--magritte-color-component-button-loader-icon-neutral-v23-2-2);
185
132
  }
186
- .magritte-button_style-neutral___bPUwu_1-0-2 .magritte-postfix___r0EZ6_1-0-2{
187
- --magritte-ui-text-color-override:var(--magritte-color-component-button-postfix-text-neutral-v23-2-1);
133
+ .magritte-button_style-neutral___bPUwu_1-0-3 .magritte-postfix___r0EZ6_1-0-3{
134
+ --magritte-ui-text-color-override:var(--magritte-color-component-button-postfix-text-neutral-v23-2-2);
188
135
  }
189
- .magritte-button_style-neutral___bPUwu_1-0-2.focus-visible{
190
- outline:var(--magritte-semantic-border-width-tab-focused-v23-2-1) solid var(--magritte-color-component-button-stroke-state-neutral-focused-accessible-v23-2-1);
191
- background:var(--magritte-color-component-button-background-state-neutral-focused-v23-2-1);
136
+ .magritte-button_style-neutral___bPUwu_1-0-3.focus-visible{
137
+ outline:4px solid var(--magritte-color-component-button-stroke-state-neutral-focused-accessible-v23-2-2);
138
+ background:var(--magritte-color-component-button-background-state-neutral-focused-v23-2-2);
192
139
  }
193
- .magritte-button_style-neutral___bPUwu_1-0-2:not(:disabled):active{
194
- background:var(--magritte-color-component-button-background-state-neutral-pressed-v23-2-1);
140
+ .magritte-button_style-neutral___bPUwu_1-0-3:not(:disabled):active{
141
+ background:var(--magritte-color-component-button-background-state-neutral-pressed-v23-2-2);
195
142
  }
196
- .magritte-button_style-neutral___bPUwu_1-0-2:disabled{
197
- background:var(--magritte-color-component-button-background-state-neutral-disabled-v23-2-1);
198
- --magritte-ui-text-color-override:var(--magritte-color-component-button-text-state-neutral-disabled-v23-2-1);
199
- --magritte-ui-icon-color-override:var(--magritte-color-component-button-icon-state-neutral-disabled-v23-2-1);
143
+ .magritte-button_style-neutral___bPUwu_1-0-3:disabled{
144
+ background:var(--magritte-color-component-button-background-state-neutral-disabled-v23-2-2);
145
+ --magritte-ui-text-color-override:var(--magritte-color-component-button-text-state-neutral-disabled-v23-2-2);
146
+ --magritte-ui-icon-color-override:var(--magritte-color-component-button-icon-state-neutral-disabled-v23-2-2);
200
147
  }
201
- .magritte-button_style-neutral___bPUwu_1-0-2:disabled .magritte-postfix___r0EZ6_1-0-2{
202
- --magritte-ui-text-color-override:var(--magritte-color-component-button-postfix-text-state-neutral-disabled-v23-2-1);
148
+ .magritte-button_style-neutral___bPUwu_1-0-3:disabled .magritte-postfix___r0EZ6_1-0-3{
149
+ --magritte-ui-text-color-override:var(--magritte-color-component-button-postfix-text-state-neutral-disabled-v23-2-2);
203
150
  }
204
151
  @media (min-width: 1020px){
205
- body.magritte-old-layout .magritte-button_style-neutral___bPUwu_1-0-2:hover:not(:active):not(:disabled):not([aria-disabled='true']){
206
- background:var(--magritte-color-component-button-background-state-neutral-hovered-v23-2-1);
152
+ body.magritte-old-layout .magritte-button_style-neutral___bPUwu_1-0-3:hover:not(:active):not(:disabled):not([aria-disabled='true']){
153
+ background:var(--magritte-color-component-button-background-state-neutral-hovered-v23-2-2);
207
154
  }
208
155
  }
209
156
  @media (min-width: 1024px){
210
- body:not(.magritte-old-layout) .magritte-button_style-neutral___bPUwu_1-0-2:hover:not(:active):not(:disabled):not([aria-disabled='true']){
211
- background:var(--magritte-color-component-button-background-state-neutral-hovered-v23-2-1);
157
+ body:not(.magritte-old-layout) .magritte-button_style-neutral___bPUwu_1-0-3:hover:not(:active):not(:disabled):not([aria-disabled='true']){
158
+ background:var(--magritte-color-component-button-background-state-neutral-hovered-v23-2-2);
212
159
  }
213
160
  }
214
- .magritte-button_style-inverse___Xgf26_1-0-2{
215
- background:var(--magritte-color-component-button-background-inverse-v23-2-1);
216
- --magritte-ui-text-color-override:var(--magritte-color-component-button-text-inverse-v23-2-1);
217
- --magritte-ui-icon-color-override:var(--magritte-color-component-button-icon-inverse-v23-2-1);
218
- box-shadow:var(--magritte-shadow-level-1-x-v23-2-1) var(--magritte-shadow-level-1-y-v23-2-1) var(--magritte-shadow-level-1-blur-v23-2-1) var(--magritte-shadow-level-1-spread-v23-2-1) var(--magritte-shadow-level-1-color-v23-2-1);
219
- --magritte-ui-loader-color-override:var(--magritte-color-component-button-loader-icon-inverse-v23-2-1);
161
+ .magritte-button_style-inverse___Xgf26_1-0-3{
162
+ background:var(--magritte-color-component-button-background-inverse-v23-2-2);
163
+ --magritte-ui-text-color-override:var(--magritte-color-component-button-text-inverse-v23-2-2);
164
+ --magritte-ui-icon-color-override:var(--magritte-color-component-button-icon-inverse-v23-2-2);
165
+ box-shadow:var(--magritte-shadow-level-1-x-v23-2-2) var(--magritte-shadow-level-1-y-v23-2-2) var(--magritte-shadow-level-1-blur-v23-2-2) var(--magritte-shadow-level-1-spread-v23-2-2) var(--magritte-shadow-level-1-color-v23-2-2);
166
+ --magritte-ui-loader-color-override:var(--magritte-color-component-button-loader-icon-inverse-v23-2-2);
220
167
  }
221
- .magritte-button_style-inverse___Xgf26_1-0-2 .magritte-postfix___r0EZ6_1-0-2{
222
- --magritte-ui-text-color-override:var(--magritte-color-component-button-postfix-text-inverse-v23-2-1);
168
+ .magritte-button_style-inverse___Xgf26_1-0-3 .magritte-postfix___r0EZ6_1-0-3{
169
+ --magritte-ui-text-color-override:var(--magritte-color-component-button-postfix-text-inverse-v23-2-2);
223
170
  }
224
- .magritte-button_style-inverse___Xgf26_1-0-2.focus-visible{
225
- outline:var(--magritte-semantic-border-width-tab-focused-v23-2-1) solid var(--magritte-color-component-button-stroke-state-inverse-focused-accessible-v23-2-1);
226
- background:var(--magritte-color-component-button-background-state-inverse-focused-v23-2-1);
171
+ .magritte-button_style-inverse___Xgf26_1-0-3.focus-visible{
172
+ outline:4px solid var(--magritte-color-component-button-stroke-state-inverse-focused-accessible-v23-2-2);
173
+ background:var(--magritte-color-component-button-background-state-inverse-focused-v23-2-2);
227
174
  }
228
- .magritte-button_style-inverse___Xgf26_1-0-2:not(:disabled):active{
229
- background:var(--magritte-color-component-button-background-state-inverse-pressed-v23-2-1);
175
+ .magritte-button_style-inverse___Xgf26_1-0-3:not(:disabled):active{
176
+ background:var(--magritte-color-component-button-background-state-inverse-pressed-v23-2-2);
230
177
  }
231
- .magritte-button_style-inverse___Xgf26_1-0-2:disabled{
232
- background:var(--magritte-color-component-button-background-state-inverse-disabled-v23-2-1);
233
- --magritte-ui-text-color-override:var(--magritte-color-component-button-text-state-inverse-disabled-v23-2-1);
234
- --magritte-ui-icon-color-override:var(--magritte-color-component-button-icon-state-inverse-disabled-v23-2-1);
178
+ .magritte-button_style-inverse___Xgf26_1-0-3:disabled{
179
+ background:var(--magritte-color-component-button-background-state-inverse-disabled-v23-2-2);
180
+ --magritte-ui-text-color-override:var(--magritte-color-component-button-text-state-inverse-disabled-v23-2-2);
181
+ --magritte-ui-icon-color-override:var(--magritte-color-component-button-icon-state-inverse-disabled-v23-2-2);
235
182
  }
236
- .magritte-button_style-inverse___Xgf26_1-0-2:disabled .magritte-postfix___r0EZ6_1-0-2{
237
- --magritte-ui-text-color-override:var(--magritte-color-component-button-postfix-text-state-inverse-disabled-v23-2-1);
183
+ .magritte-button_style-inverse___Xgf26_1-0-3:disabled .magritte-postfix___r0EZ6_1-0-3{
184
+ --magritte-ui-text-color-override:var(--magritte-color-component-button-postfix-text-state-inverse-disabled-v23-2-2);
238
185
  }
239
186
  @media (min-width: 1020px){
240
- body.magritte-old-layout .magritte-button_style-inverse___Xgf26_1-0-2:hover:not(:active):not(:disabled):not([aria-disabled='true']){
241
- background:var(--magritte-color-component-button-background-state-inverse-hovered-v23-2-1);
187
+ body.magritte-old-layout .magritte-button_style-inverse___Xgf26_1-0-3:hover:not(:active):not(:disabled):not([aria-disabled='true']){
188
+ background:var(--magritte-color-component-button-background-state-inverse-hovered-v23-2-2);
242
189
  }
243
190
  }
244
191
  @media (min-width: 1024px){
245
- body:not(.magritte-old-layout) .magritte-button_style-inverse___Xgf26_1-0-2:hover:not(:active):not(:disabled):not([aria-disabled='true']){
246
- background:var(--magritte-color-component-button-background-state-inverse-hovered-v23-2-1);
192
+ body:not(.magritte-old-layout) .magritte-button_style-inverse___Xgf26_1-0-3:hover:not(:active):not(:disabled):not([aria-disabled='true']){
193
+ background:var(--magritte-color-component-button-background-state-inverse-hovered-v23-2-2);
247
194
  }
248
195
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hh.ru/magritte-ui-floating-button",
3
- "version": "1.0.2",
3
+ "version": "1.0.3",
4
4
  "main": "index.js",
5
5
  "types": "index.d.ts",
6
6
  "sideEffects": [
@@ -20,12 +20,12 @@
20
20
  },
21
21
  "dependencies": {
22
22
  "@hh.ru/magritte-common-is-server-env": "1.0.7",
23
- "@hh.ru/magritte-design-tokens": "23.2.1",
23
+ "@hh.ru/magritte-design-tokens": "23.2.2",
24
24
  "@hh.ru/magritte-types": "5.0.4",
25
- "@hh.ru/magritte-ui-badge": "3.1.3",
25
+ "@hh.ru/magritte-ui-badge": "3.1.4",
26
26
  "@hh.ru/magritte-ui-breakpoint": "6.0.1",
27
- "@hh.ru/magritte-ui-loader": "2.0.7",
28
- "@hh.ru/magritte-ui-typography": "4.2.2"
27
+ "@hh.ru/magritte-ui-loader": "2.0.8",
28
+ "@hh.ru/magritte-ui-typography": "4.2.3"
29
29
  },
30
30
  "peerDependencies": {
31
31
  "classnames": ">=2.3.2",
@@ -35,5 +35,5 @@
35
35
  "publishConfig": {
36
36
  "access": "public"
37
37
  },
38
- "gitHead": "18a4c9f53b8572077ce0fba28266865c1b619cee"
38
+ "gitHead": "b2ab15b73592666625ff3b84e10f3cc1bcee9cbc"
39
39
  }