@carbon/charts 1.18.0 → 1.19.1

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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@carbon/charts",
3
- "version": "1.18.0",
3
+ "version": "1.19.1",
4
4
  "description": "Carbon Charts component library",
5
5
  "type": "module",
6
6
  "module": "./dist/index.mjs",
@@ -106,11 +106,11 @@
106
106
  "prettier": "^3.3.2",
107
107
  "publint": "^0.2.8",
108
108
  "resize-observer-polyfill": "^1.5.1",
109
- "sass": "^1.77.6",
109
+ "sass": "^1.77.8",
110
110
  "typescript": "^5.5.3",
111
111
  "vite": "^5.3.3",
112
112
  "vite-plugin-dts": "^3.9.1",
113
- "vitest": "^2.0.1"
113
+ "vitest": "^2.0.2"
114
114
  },
115
115
  "publishConfig": {
116
116
  "access": "public"
@@ -159,5 +159,5 @@
159
159
  "url": "https://github.com/theiliad"
160
160
  }
161
161
  ],
162
- "gitHead": "5606e47fd995595d401ee435f9707f1a08444ef2"
162
+ "gitHead": "cdd36122a14dd0ad1aab44607e8cc2397b6c5f48"
163
163
  }
@@ -31,10 +31,6 @@
31
31
  }
32
32
 
33
33
  .#{globals.$prefix}--overflow-menu-options__option {
34
- &:hover {
35
- background-color: var(--#{globals.$prefix}-layer-hover);
36
- }
37
-
38
34
  box-sizing: border-box;
39
35
  border: 0;
40
36
  margin: 0;
@@ -49,12 +45,11 @@
49
45
  inline-size: 100%;
50
46
  transition: background-color 0.11s cubic-bezier(0, 0, 0.38, 0.9);
51
47
 
52
- .#{globals.$prefix}--overflow-menu-options__btn {
53
- &:focus {
54
- outline: 2px solid var(--cds-focus, #0f62fe);
55
- outline-offset: -2px;
56
- }
48
+ &:hover {
49
+ background-color: var(--#{globals.$prefix}-layer-hover);
50
+ }
57
51
 
52
+ .#{globals.$prefix}--overflow-menu-options__btn {
58
53
  font-size: var(--#{globals.$prefix}-body-compact-01-font-size, 0.875rem);
59
54
  font-weight: var(--#{globals.$prefix}-body-compact-01-font-weight, 400);
60
55
  line-height: var(--#{globals.$prefix}-body-compact-01-line-height, 1.28572);
@@ -78,6 +73,10 @@
78
73
  outline 0.11s cubic-bezier(0, 0, 0.38, 0.9),
79
74
  background-color 0.11s cubic-bezier(0, 0, 0.38, 0.9),
80
75
  color 0.11s cubic-bezier(0, 0, 0.38, 0.9);
76
+ &:focus {
77
+ outline: 2px solid var(--cds-focus, #0f62fe);
78
+ outline-offset: -2px;
79
+ }
81
80
  }
82
81
 
83
82
  *,
@@ -108,23 +107,6 @@
108
107
  .#{globals.$prefix}--overflow-menu__trigger {
109
108
  width: 2rem;
110
109
  height: 2rem;
111
-
112
- &:hover {
113
- background-color: var(--#{globals.$prefix}-layer-hover);
114
- }
115
-
116
- &:focus {
117
- outline: 2px solid var(--cds-focus, #0f62fe);
118
- outline-offset: -2px;
119
- }
120
-
121
- *,
122
- ::before,
123
- ::after {
124
- box-sizing: inherit;
125
- }
126
-
127
- // align-items: center;
128
110
  appearance: none;
129
111
  background: none;
130
112
  block-size: 2.5rem;
@@ -149,6 +131,21 @@
149
131
  background-color 110ms cubic-bezier(0, 0, 0.38, 0.9);
150
132
  vertical-align: baseline;
151
133
 
134
+ &:hover {
135
+ background-color: var(--#{globals.$prefix}-layer-hover);
136
+ }
137
+
138
+ &:focus {
139
+ outline: 2px solid var(--cds-focus, #0f62fe);
140
+ outline-offset: -2px;
141
+ }
142
+
143
+ *,
144
+ ::before,
145
+ ::after {
146
+ box-sizing: inherit;
147
+ }
148
+
152
149
  > :first-child {
153
150
  margin-block-start: 0;
154
151
  }
@@ -43,22 +43,6 @@
43
43
  }
44
44
 
45
45
  .#{globals.$prefix}--modal-container {
46
- @media (min-width: 42rem) {
47
- position: static;
48
- width: 84%;
49
- height: auto;
50
- max-height: 90%;
51
- }
52
-
53
- @media (min-width: 66rem) {
54
- width: 60%;
55
- max-height: 84%;
56
- }
57
-
58
- @media (min-width: 82rem) {
59
- width: 48%;
60
- }
61
-
62
46
  position: fixed;
63
47
  top: 0;
64
48
  display: grid;
@@ -75,6 +59,22 @@
75
59
  transform-origin: top center;
76
60
  transition: transform 0.24s cubic-bezier(0.4, 0.14, 1, 1);
77
61
 
62
+ @media (min-width: 42rem) {
63
+ position: static;
64
+ width: 84%;
65
+ height: auto;
66
+ max-height: 90%;
67
+ }
68
+
69
+ @media (min-width: 66rem) {
70
+ width: 60%;
71
+ max-height: 84%;
72
+ }
73
+
74
+ @media (min-width: 82rem) {
75
+ width: 48%;
76
+ }
77
+
78
78
  .#{globals.$prefix}--modal-header {
79
79
  padding-top: 1rem;
80
80
  padding-right: 3rem;
@@ -127,15 +127,6 @@
127
127
  }
128
128
 
129
129
  .#{globals.$prefix}--modal-close {
130
- &:hover {
131
- background-color: var(--#{globals.$prefix}-layer-hover);
132
- }
133
-
134
- &:focus {
135
- border-color: var(--cds-focus, #0f62fe);
136
- outline: none;
137
- }
138
-
139
130
  position: absolute;
140
131
  z-index: 2;
141
132
  top: 0;
@@ -154,6 +145,15 @@
154
145
  border-radius: 0;
155
146
  font-family: inherit;
156
147
 
148
+ &:hover {
149
+ background-color: var(--#{globals.$prefix}-layer-hover);
150
+ }
151
+
152
+ &:focus {
153
+ border-color: var(--cds-focus, #0f62fe);
154
+ outline: none;
155
+ }
156
+
157
157
  &__icon {
158
158
  width: 1.25rem;
159
159
  height: 1.25rem;
@@ -221,15 +221,15 @@
221
221
  width: 100%;
222
222
 
223
223
  tr {
224
- &:hover {
225
- background: var(--#{globals.$prefix}-layer-hover) !important;
226
- }
227
-
228
224
  transition: background-color 70ms cubic-bezier(0, 0, 0.38, 0.9);
229
225
  width: 100;
230
226
  height: 3rem;
231
227
  border: none;
232
228
 
229
+ &:hover {
230
+ background: var(--#{globals.$prefix}-layer-hover) !important;
231
+ }
232
+
233
233
  td {
234
234
  transition: background-color 70ms cubic-bezier(0, 0, 0.38, 0.9);
235
235
  padding-right: 1rem;
@@ -327,6 +327,12 @@
327
327
  }
328
328
 
329
329
  .#{globals.$prefix}--btn--primary {
330
+ border-width: 1px;
331
+ border-style: solid;
332
+ border-color: transparent;
333
+ background-color: var(--#{globals.$prefix}-button-primary, #0f62fe);
334
+ color: var(--#{globals.$prefix}-text-on-color, #ffffff);
335
+
330
336
  &:hover {
331
337
  color: var(--#{globals.$prefix}-text-on-color, #ffffff);
332
338
  background-color: var(--#{globals.$prefix}-button-primary-hover, #0050e6);
@@ -338,12 +344,6 @@
338
344
  inset 0 0 0 1px var(--cds-button-focus-color, var(--cds-focus, #0f62fe)),
339
345
  inset 0 0 0 2px var(--cds-background, #ffffff);
340
346
  }
341
-
342
- border-width: 1px;
343
- border-style: solid;
344
- border-color: transparent;
345
- background-color: var(--#{globals.$prefix}-button-primary, #0f62fe);
346
- color: var(--#{globals.$prefix}-text-on-color, #ffffff);
347
347
  }
348
348
  }
349
349
  }