@hazelcast/ui 1.3.2-next.82 → 1.3.2-next.83

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 (14) hide show
  1. package/lib/Button.module.scss +8 -8
  2. package/lib/Calendar/Calendar.module.scss +1 -1
  3. package/lib/Carousel.module.scss +2 -2
  4. package/lib/ContextMenu.module.scss +1 -1
  5. package/lib/Pagination.module.scss +3 -2
  6. package/lib/SegmentedControl.module.scss +1 -1
  7. package/lib/Select/CheckableSelectField.module.scss +1 -1
  8. package/lib/Slider.module.scss +1 -1
  9. package/lib/Table/Header.module.scss +1 -1
  10. package/lib/Table/Row.module.scss +2 -2
  11. package/lib/Table/Table.module.scss +1 -1
  12. package/lib/Tabs/Tab.module.scss +9 -3
  13. package/lib/Terminal.module.scss +1 -1
  14. package/package.json +3 -3
package/lib/Button.module.scss CHANGED
@@ -57,7 +57,7 @@
57
57
  }
58
58
  }
59
59
 
60
- &:focus,
60
+ &:focus-visible,
61
61
  &.focus {
62
62
  // Do not remove outline for high-contrast modes
63
63
  // https://stackoverflow.com/a/52616313
@@ -100,7 +100,7 @@
100
100
 
101
101
  &:hover,
102
102
  &.hover,
103
- &:focus,
103
+ &:focus-visible,
104
104
  &.focus {
105
105
  @include buttonColor(c.$colorPrimaryLight);
106
106
  }
@@ -124,7 +124,7 @@
124
124
 
125
125
  &:hover,
126
126
  &.hover,
127
- &:focus,
127
+ &:focus-visible,
128
128
  &.focus {
129
129
  @include buttonColor(c.$colorErrorLight);
130
130
  }
@@ -148,7 +148,7 @@
148
148
 
149
149
  &:hover,
150
150
  &.hover,
151
- &:focus,
151
+ &:focus-visible,
152
152
  &.focus {
153
153
  @include buttonColor(c.$colorWarningLight);
154
154
  }
@@ -172,7 +172,7 @@
172
172
 
173
173
  &:hover,
174
174
  &.hover,
175
- &:focus,
175
+ &:focus-visible,
176
176
  &.focus {
177
177
  @include buttonColor(lighten(c.$colorBrand, 20%));
178
178
  }
@@ -196,7 +196,7 @@
196
196
 
197
197
  &:hover,
198
198
  &.hover,
199
- &:focus,
199
+ &:focus-visible,
200
200
  &.focus {
201
201
  @include buttonColor(lighten(c.$authPrimary, 10%));
202
202
  }
@@ -241,7 +241,7 @@
241
241
  &.hover,
242
242
  &:active,
243
243
  &.active,
244
- &:focus,
244
+ &:focus-visible,
245
245
  &.focus,
246
246
  &:disabled,
247
247
  &.disabled {
@@ -257,7 +257,7 @@
257
257
  &.hover,
258
258
  &:active,
259
259
  &.active,
260
- &:focus,
260
+ &:focus-visible,
261
261
  &.focus,
262
262
  &:disabled,
263
263
  &.disabled {
package/lib/Calendar/Calendar.module.scss CHANGED
@@ -125,7 +125,7 @@ $inputPadding: c.$grid * 3;
125
125
  color: c.$colorNeutral;
126
126
  }
127
127
 
128
- &:focus {
128
+ &:focus-visible {
129
129
  @include h.outlineSimple;
130
130
  }
131
131
 
package/lib/Carousel.module.scss CHANGED
@@ -22,7 +22,7 @@
22
22
  position: relative;
23
23
  height: 40px;
24
24
 
25
- &:focus {
25
+ &:focus-visible {
26
26
  @include h.outlineAround;
27
27
  }
28
28
  }
@@ -37,7 +37,7 @@
37
37
  align-items: center;
38
38
  padding: c.$grid * 1.5;
39
39
 
40
- &:focus {
40
+ &:focus-visible {
41
41
  @include h.outlineAround;
42
42
  }
43
43
  }
package/lib/ContextMenu.module.scss CHANGED
@@ -22,7 +22,7 @@
22
22
  border: none;
23
23
  text-align: left;
24
24
 
25
- &:focus {
25
+ &:focus-visible {
26
26
  @include h.outlineSimple;
27
27
  }
28
28
 
package/lib/Pagination.module.scss CHANGED
@@ -55,7 +55,7 @@
55
55
  border-color: c.$colorPrimary;
56
56
  }
57
57
 
58
- &:focus {
58
+ &:focus-visible {
59
59
  .outline {
60
60
  visibility: hidden;
61
61
  }
@@ -82,7 +82,8 @@
82
82
  border-color: c.$colorPrimary;
83
83
  }
84
84
 
85
- &:focus {
85
+ &:focus,
86
+ &:focus-visible {
86
87
  box-shadow: none;
87
88
  }
88
89
  }
package/lib/SegmentedControl.module.scss CHANGED
@@ -55,7 +55,7 @@
55
55
  color: c.$colorText;
56
56
  }
57
57
 
58
- &:focus {
58
+ &:focus-visible {
59
59
  // Do not remove outline for high-contrast modes
60
60
  // https://stackoverflow.com/a/52616313
61
61
  outline: c.$outlineWidth solid transparent;
package/lib/Select/CheckableSelectField.module.scss CHANGED
@@ -51,7 +51,7 @@
51
51
  margin-bottom: c.$grid * 2.5;
52
52
  overflow: hidden;
53
53
 
54
- &:focus {
54
+ &:focus-visible {
55
55
  @include h.outlineFormField;
56
56
  }
57
57
  }
package/lib/Slider.module.scss CHANGED
@@ -162,7 +162,7 @@ ul.markDescriptions {
162
162
  }
163
163
 
164
164
  &.focus,
165
- &:focus {
165
+ &:focus-visible {
166
166
  @include styleThumb {
167
167
  box-shadow: 0 0 0 c.$outlineWidth c.$colorAccessibilityOutline;
168
168
  }
package/lib/Table/Header.module.scss CHANGED
@@ -61,7 +61,7 @@
61
61
  &.sortable {
62
62
  cursor: pointer;
63
63
 
64
- &:focus {
64
+ &:focus-visible {
65
65
  // Do not remove outline for high-contrast modes
66
66
  // https://stackoverflow.com/a/52616313
67
67
  outline: c.$outlineWidth solid transparent;
package/lib/Table/Row.module.scss CHANGED
@@ -12,7 +12,7 @@
12
12
  &.clickable {
13
13
  cursor: pointer;
14
14
 
15
- &:focus {
15
+ &:focus-visible {
16
16
  @include h.outlineSimple;
17
17
 
18
18
  // Do not remove outline for high-contrast modes
@@ -36,7 +36,7 @@
36
36
  text-decoration: none;
37
37
  background-color: inherit;
38
38
 
39
- &:focus {
39
+ &:focus-visible {
40
40
  @include h.outlineSimple;
41
41
 
42
42
  // Do not remove outline for high-contrast modes
package/lib/Table/Table.module.scss CHANGED
@@ -15,7 +15,7 @@
15
15
  }
16
16
 
17
17
  .expander {
18
- &:focus {
18
+ &:focus-visible {
19
19
  @include h.outlineSimple;
20
20
  }
21
21
  }
package/lib/Tabs/Tab.module.scss CHANGED
@@ -10,7 +10,7 @@
10
10
  box-sizing: border-box;
11
11
  height: c.$grid * 10;
12
12
  min-width: c.$grid * 40;
13
- padding: 0 c.$grid * 5;
13
+ padding: c.$grid c.$grid * 5;
14
14
  border: none;
15
15
  border-bottom: 1px solid;
16
16
  border-color: c.$colorNeutralLight;
@@ -30,11 +30,17 @@
30
30
 
31
31
  &.selected {
32
32
  color: c.$colorPrimary;
33
- border-radius: none;
33
+ border-radius: 0;
34
34
  border-color: c.$colorPrimary;
35
35
  box-shadow: inset 0 -4px 0 0 c.$colorPrimary;
36
36
  }
37
37
 
38
+ &.selected:focus-visible {
39
+ border-color: c.$colorPrimary;
40
+ border-bottom-width: c.$grid;
41
+ padding-bottom: 0;
42
+ }
43
+
38
44
  &.fullWidth {
39
45
  flex: 1 1 auto;
40
46
  }
@@ -43,7 +49,7 @@
43
49
  color: c.$colorPrimary;
44
50
  }
45
51
 
46
- &:focus {
52
+ &:focus-visible {
47
53
  // Do not remove outline for high-contrast modes
48
54
  // https://stackoverflow.com/a/52616313
49
55
  outline: c.$outlineWidth solid transparent;
package/lib/Terminal.module.scss CHANGED
@@ -43,7 +43,7 @@
43
43
  border-bottom-color: c.$colorText;
44
44
  }
45
45
 
46
- &:focus,
46
+ &:focus-visible,
47
47
  &.focus {
48
48
  // Do not remove outline for high-contrast modes
49
49
  // https://stackoverflow.com/a/52616313
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hazelcast/ui",
3
- "version": "1.3.2-next.82+91ef0da",
3
+ "version": "1.3.2-next.83+e579567",
4
4
  "description": "Hazelcast design system components",
5
5
  "author": "",
6
6
  "homepage": "https://github.com/hazelcast/frontend-shared#readme",
@@ -75,7 +75,7 @@
75
75
  "use-deep-compare": "^1.1.0"
76
76
  },
77
77
  "devDependencies": {
78
- "@hazelcast/test-helpers": "^1.3.2-next.82+91ef0da",
78
+ "@hazelcast/test-helpers": "^1.3.1",
79
79
  "@storybook/addon-docs": "^6.5.16",
80
80
  "@storybook/addons": "^6.5.16",
81
81
  "@storybook/builder-webpack5": "^6.5.16",
@@ -116,5 +116,5 @@
116
116
  "react": "^17 || ^18",
117
117
  "react-dom": "^17 || ^18"
118
118
  },
119
- "gitHead": "91ef0da567b1e51ae2d285a5b6b980d0f4c82c77"
119
+ "gitHead": "e5795670fbd423a0c4bbad69effae20be2c643b2"
120
120
  }