@carbon/web-components 2.19.0 → 2.20.0-rc.0

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 (123) hide show
  1. package/dist/16-0c880364.js +2 -2
  2. package/dist/16-1d873b4f.js +2 -2
  3. package/dist/16-2b64eac7.js +2 -2
  4. package/dist/16-4e56fae5.js +2 -2
  5. package/dist/16-66567a49.js +2 -2
  6. package/dist/16-678c0d5c.js +2 -2
  7. package/dist/16-9501e226.js +2 -2
  8. package/dist/16-a75c4181.js +2 -2
  9. package/dist/16-d83d40a3.js +2 -2
  10. package/dist/20-fd76427e.js +2 -2
  11. package/dist/accordion.min.js +2 -2
  12. package/dist/ai-label.min.js +3 -3
  13. package/dist/ai-skeleton.min.js +2 -2
  14. package/dist/breadcrumb.min.js +2 -2
  15. package/dist/button-7c58436e.js +2 -2
  16. package/dist/button-set-9c90b997.js +2 -2
  17. package/dist/button-skeleton-c4243201.js +2 -2
  18. package/dist/button.min.js +2 -2
  19. package/dist/carbon-element-017b212d.js +2 -2
  20. package/dist/chat-button.min.js +2 -2
  21. package/dist/checkbox-b2df3049.js +2 -2
  22. package/dist/checkbox-skeleton-1328750d.js +2 -2
  23. package/dist/checkbox.min.js +2 -2
  24. package/dist/class-map-f136ab55.js +2 -2
  25. package/dist/code-snippet.min.js +3 -3
  26. package/dist/collection-helpers-8b117611.js +2 -2
  27. package/dist/combo-box.min.js +3 -3
  28. package/dist/content-switcher-item-b836be1f.js +2 -2
  29. package/dist/content-switcher.min.js +3 -3
  30. package/dist/{copy-button-79f26bdb.js → copy-button-019b4375.js} +3 -3
  31. package/dist/copy-button.min.js +3 -3
  32. package/dist/data-table.min.js +2 -2
  33. package/dist/date-picker.min.js +2 -2
  34. package/dist/directive-e2d48b9c.js +2 -2
  35. package/dist/dropdown-item-883bbca6.js +168 -0
  36. package/dist/dropdown.min.js +5 -5
  37. package/dist/file-uploader.min.js +2 -2
  38. package/dist/floating-menu-a018a2a8.js +2 -2
  39. package/dist/floating-menu.min.js +2 -2
  40. package/dist/focus-a50a0482.js +2 -2
  41. package/dist/form-group.min.js +2 -2
  42. package/dist/form.min.js +2 -2
  43. package/dist/host-listener-69c546a1.js +2 -2
  44. package/dist/{icon-button-34e04d73.js → icon-button-3c7e5c61.js} +4 -4
  45. package/dist/icon-button.min.js +3 -3
  46. package/dist/if-defined-7d77967b.js +2 -2
  47. package/dist/if-non-empty-09760ce1.js +2 -2
  48. package/dist/inline-loading.min.js +2 -2
  49. package/dist/layer-9301724c.js +2 -2
  50. package/dist/layer.min.js +2 -2
  51. package/dist/link-374604e9.js +2 -2
  52. package/dist/link.min.js +2 -2
  53. package/dist/list.min.js +2 -2
  54. package/dist/loading-eeaae2cd.js +2 -2
  55. package/dist/loading-icon-f5bdc4f0.js +2 -2
  56. package/dist/loading.min.js +2 -2
  57. package/dist/modal-label-73edbe7e.js +2 -2
  58. package/dist/modal.min.js +2 -2
  59. package/dist/multi-select.min.js +10 -10
  60. package/dist/notification.min.js +2 -2
  61. package/dist/number-input.min.js +2 -2
  62. package/dist/on-8707857f.js +2 -2
  63. package/dist/overflow-menu.min.js +3 -3
  64. package/dist/pagination.min.js +2 -2
  65. package/dist/{popover-content-00cf67b1.js → popover-content-f8458b22.js} +5 -5
  66. package/dist/popover-controller-c3634b83.js +2 -2
  67. package/dist/popover.min.js +3 -3
  68. package/dist/progress-bar.min.js +2 -2
  69. package/dist/progress-indicator.min.js +2 -2
  70. package/dist/property-8bf17a69.js +2 -2
  71. package/dist/query-602de8af.js +2 -2
  72. package/dist/query-assigned-elements-1bd68a6e.js +2 -2
  73. package/dist/radio-button-skeleton-d5ff09cd.js +2 -2
  74. package/dist/radio-button.min.js +2 -2
  75. package/dist/radio-group-manager-9b128b9b.js +2 -2
  76. package/dist/search-c95e7521.js +2 -2
  77. package/dist/search.min.js +2 -2
  78. package/dist/select-d373eb74.js +2 -2
  79. package/dist/select.min.js +2 -2
  80. package/dist/settings-1096a273.js +2 -2
  81. package/dist/shared-enums-562e6b51.js +2 -2
  82. package/dist/side-panel.min.js +3 -3
  83. package/dist/skeleton-icon-62527238.js +2 -2
  84. package/dist/skeleton-icon.min.js +2 -2
  85. package/dist/skeleton-placeholder-2abb8043.js +2 -2
  86. package/dist/skeleton-placeholder.min.js +2 -2
  87. package/dist/skeleton-text-408000d4.js +2 -2
  88. package/dist/skeleton-text.min.js +2 -2
  89. package/dist/skip-to-content.min.js +2 -2
  90. package/dist/slider.min.js +2 -2
  91. package/dist/slug.min.js +3 -3
  92. package/dist/spread-c3902148.js +2 -2
  93. package/dist/stack.min.js +2 -2
  94. package/dist/state-16f7c070.js +2 -2
  95. package/dist/structured-list.min.js +2 -2
  96. package/dist/tabs.min.js +2 -2
  97. package/dist/tag.min.js +8 -8
  98. package/dist/tearsheet.min.js +2 -2
  99. package/dist/text-input-57cf461e.js +2 -2
  100. package/dist/text-input.min.js +2 -2
  101. package/dist/textarea.min.js +2 -2
  102. package/dist/tile.min.js +3 -3
  103. package/dist/toggle-tip.min.js +3 -3
  104. package/dist/toggle.min.js +2 -2
  105. package/dist/{toggletip-5ce7c82e.js → toggletip-2686c94e.js} +6 -6
  106. package/dist/{tooltip-content-d167e372.js → tooltip-content-8c7333b6.js} +7 -7
  107. package/dist/tooltip.min.js +3 -3
  108. package/dist/ui-shell.min.js +2 -2
  109. package/dist/validity-45b7794a.js +2 -2
  110. package/es/components/ai-label/ai-label.scss.js +1 -1
  111. package/es/components/combo-box/combo-box.scss.js +1 -1
  112. package/es/components/dropdown/dropdown.scss.js +1 -1
  113. package/es/components/icon-button/icon-button.scss.js +1 -1
  114. package/es/components/multi-select/multi-select.scss.js +1 -1
  115. package/es/components/popover/popover.scss.js +1 -1
  116. package/es/components/slug/slug.scss.js +1 -1
  117. package/es/components/tag/tag.scss.js +1 -1
  118. package/es/components/tile/tile.scss.js +1 -1
  119. package/es/components/toggle-tip/toggletip.scss.js +1 -1
  120. package/es/components/tooltip/tooltip.scss.js +1 -1
  121. package/package.json +3 -3
  122. package/scss/components/popover/popover.scss +146 -0
  123. package/dist/dropdown-item-f4b845f3.js +0 -168
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@carbon/web-components",
3
3
  "description": "Web components for the Carbon Design System",
4
- "version": "2.19.0",
4
+ "version": "2.20.0-rc.0",
5
5
  "license": "Apache-2.0",
6
6
  "main": "es/index.js",
7
7
  "module": "es/index.js",
@@ -67,7 +67,7 @@
67
67
  "wca": "web-component-analyzer analyze src --outFile custom-elements.json"
68
68
  },
69
69
  "dependencies": {
70
- "@carbon/styles": "^1.71.0",
70
+ "@carbon/styles": "^1.72.0-rc.0",
71
71
  "@floating-ui/dom": "^1.6.3",
72
72
  "@ibm/telemetry-js": "^1.5.0",
73
73
  "flatpickr": "4.6.13",
@@ -138,5 +138,5 @@
138
138
  }
139
139
  ]
140
140
  },
141
- "gitHead": "4e89908b4bbb6b1c34543cb56f551f242a27d609"
141
+ "gitHead": "7b6d921583ff275baace5baa66da9d9b31740fa8"
142
142
  }
package/scss/components/popover/popover.scss CHANGED
@@ -109,6 +109,17 @@ $popover-caret-height: custom-property.get-var(
109
109
  }
110
110
  }
111
111
 
112
+ // rtl
113
+ :host(#{$prefix}-tooltip-content:dir(rtl)[align^='bottom']:not([autoalign])),
114
+ :host(#{$prefix}-popover-content:dir(rtl)[align^='bottom']:not([autoalign])),
115
+ :host(#{$prefix}-toggletip:dir(rtl)[alignment^='bottom']:not([autoalign])),
116
+ :host(#{$prefix}-ai-label:dir(rtl)[alignment^='bottom']:not([autoalign])),
117
+ :host(#{$prefix}-slug:dir(rtl)[alignment^='bottom']:not([autoalign])) {
118
+ .#{$prefix}--popover-caret {
119
+ transform: translate(50%, $popover-offset);
120
+ }
121
+ }
122
+
112
123
  :host(#{$prefix}-ai-label[alignment^='bottom']:not([autoalign]))
113
124
  .#{$prefix}--popover-caret,
114
125
  :host(#{$prefix}-slug[alignment^='bottom']:not([autoalign]))
@@ -128,6 +139,17 @@ $popover-caret-height: custom-property.get-var(
128
139
  }
129
140
  }
130
141
 
142
+ // rtl
143
+ :host(#{$prefix}-tooltip-content:dir(rtl)[align='bottom']:not([autoalign])),
144
+ :host(#{$prefix}-popover-content:dir(rtl)[align='bottom']:not([autoalign])),
145
+ :host(#{$prefix}-toggletip:dir(rtl)[alignment='bottom']:not([autoalign])),
146
+ :host(#{$prefix}-ai-label:dir(rtl)[alignment='bottom']:not([autoalign])),
147
+ :host(#{$prefix}-slug:dir(rtl)[alignment='bottom']:not([autoalign])) {
148
+ .#{$prefix}--popover-content {
149
+ transform: translate(50%, calc(100% + $popover-offset));
150
+ }
151
+ }
152
+
131
153
  :host(#{$prefix}-tooltip-content[align='bottom-left']:not([autoalign])),
132
154
  :host(#{$prefix}-popover-content[align='bottom-left']:not([autoalign])),
133
155
  :host(#{$prefix}-toggletip[alignment='bottom-left']:not([autoalign])),
@@ -143,6 +165,22 @@ $popover-caret-height: custom-property.get-var(
143
165
  }
144
166
  }
145
167
 
168
+ // rtl
169
+ :host(
170
+ #{$prefix}-tooltip-content:dir(rtl)[align='bottom-left']:not([autoalign])
171
+ ),
172
+ :host(
173
+ #{$prefix}-popover-content:dir(rtl)[align='bottom-left']:not([autoalign])
174
+ ),
175
+ :host(#{$prefix}-toggletip:dir(rtl)[alignment='bottom-left']:not([autoalign])),
176
+ :host(#{$prefix}-ai-label:dir(rtl)[alignment='bottom-left']:not([autoalign])),
177
+ :host(#{$prefix}-slug:dir(rtl)[alignment='bottom-left']:not([autoalign])) {
178
+ .#{$prefix}--popover-content {
179
+ inset-inline-end: 0;
180
+ inset-inline-start: initial;
181
+ }
182
+ }
183
+
146
184
  :host(#{$prefix}-tooltip-content[align='bottom-right']:not([autoalign])),
147
185
  :host(#{$prefix}-popover-content[align='bottom-right']:not([autoalign])),
148
186
  :host(#{$prefix}-toggletip[alignment='bottom-right']:not([autoalign])),
@@ -155,6 +193,21 @@ $popover-caret-height: custom-property.get-var(
155
193
  }
156
194
  }
157
195
 
196
+ // rtl
197
+ :host(
198
+ #{$prefix}-tooltip-content:dir(rtl)[align='bottom-right']:not([autoalign])
199
+ ),
200
+ :host(
201
+ #{$prefix}-popover-content:dir(rtl)[align='bottom-right']:not([autoalign])
202
+ ),
203
+ :host(#{$prefix}-toggletip:dir(rtl)[alignment='bottom-right']:not([autoalign])),
204
+ :host(#{$prefix}-ai-label:dir(rtl)[alignment='bottom-right']:not([autoalign])),
205
+ :host(#{$prefix}-slug:dir(rtl)[alignment='bottom-right']:not([autoalign])) {
206
+ .#{$prefix}--popover-content {
207
+ inset-inline-start: 0;
208
+ }
209
+ }
210
+
158
211
  :host(#{$prefix}-tooltip-content[align^='left']:not([autoalign])),
159
212
  :host(#{$prefix}-popover-content[align^='left']:not([autoalign])),
160
213
  :host(#{$prefix}-toggletip[alignment^='left']:not([autoalign])),
@@ -170,6 +223,18 @@ $popover-caret-height: custom-property.get-var(
170
223
  }
171
224
  }
172
225
 
226
+ // rtl
227
+ :host(#{$prefix}-tooltip-content:dir(rtl)[align^='left']:not([autoalign])),
228
+ :host(#{$prefix}-popover-content:dir(rtl)[align^='left']:not([autoalign])),
229
+ :host(#{$prefix}-toggletip:dir(rtl)[alignment^='left']:not([autoalign])),
230
+ :host(#{$prefix}-ai-label:dir(rtl)[alignment^='left']:not([autoalign])),
231
+ :host(#{$prefix}-slug:dir(rtl)[alignment^='left']:not([autoalign])) {
232
+ .#{$prefix}--popover-caret {
233
+ inset-inline-end: initial;
234
+ inset-inline-start: 100%;
235
+ }
236
+ }
237
+
173
238
  :host(#{$prefix}-tooltip-content[align='left']:not([autoalign])),
174
239
  :host(#{$prefix}-popover-content[align='left']:not([autoalign])),
175
240
  :host(#{$prefix}-toggletip[alignment='left']:not([autoalign])),
@@ -218,6 +283,18 @@ $popover-caret-height: custom-property.get-var(
218
283
  }
219
284
  }
220
285
 
286
+ // rtl
287
+ :host(#{$prefix}-tooltip-content:dir(rtl)[align^='left']:not([autoalign])),
288
+ :host(#{$prefix}-popover-content:dir(rtl)[align^='left']:not([autoalign])),
289
+ :host(#{$prefix}-toggletip:dir(rtl)[alignment^='left']:not([autoalign])),
290
+ :host(#{$prefix}-ai-label:dir(rtl)[alignment^='left']:not([autoalign])),
291
+ :host(#{$prefix}-slug:dir(rtl)[alignment^='left']:not([autoalign])) {
292
+ .#{$prefix}--popover-content {
293
+ inset-inline-end: initial;
294
+ inset-inline-start: 100%;
295
+ }
296
+ }
297
+
221
298
  :host(#{$prefix}-tooltip-content[align^='right']:not([autoalign])),
222
299
  :host(#{$prefix}-popover-content[align^='right']:not([autoalign])),
223
300
  :host(#{$prefix}-toggletip[alignment^='right']:not([autoalign])),
@@ -233,6 +310,18 @@ $popover-caret-height: custom-property.get-var(
233
310
  }
234
311
  }
235
312
 
313
+ // rtl
314
+ :host(#{$prefix}-tooltip-content:dir(rtl)[align^='right']:not([autoalign])),
315
+ :host(#{$prefix}-popover-content:dir(rtl)[align^='right']:not([autoalign])),
316
+ :host(#{$prefix}-toggletip:dir(rtl)[alignment^='right']:not([autoalign])),
317
+ :host(#{$prefix}-ai-label:dir(rtl)[alignment^='right']:not([autoalign])),
318
+ :host(#{$prefix}-slug:dir(rtl)[alignment^='right']:not([autoalign])) {
319
+ .#{$prefix}--popover-caret {
320
+ inset-inline-end: 100%;
321
+ inset-inline-start: initial;
322
+ }
323
+ }
324
+
236
325
  :host(#{$prefix}-tooltip-content[align='right']:not([autoalign])),
237
326
  :host(#{$prefix}-popover-content[align='right']:not([autoalign])),
238
327
  :host(#{$prefix}-toggletip[alignment='right']:not([autoalign])),
@@ -274,6 +363,18 @@ $popover-caret-height: custom-property.get-var(
274
363
  }
275
364
  }
276
365
 
366
+ // rtl
367
+ :host(#{$prefix}-tooltip-content:dir(rtl)[align^='right']:not([autoalign])),
368
+ :host(#{$prefix}-popover-content:dir(rtl)[align^='right']:not([autoalign])),
369
+ :host(#{$prefix}-toggletip:dir(rtl)[alignment^='right']:not([autoalign])),
370
+ :host(#{$prefix}-ai-label:dir(rtl)[alignment^='right']:not([autoalign])),
371
+ :host(#{$prefix}-slug:dir(rtl)[alignment^='right']:not([autoalign])) {
372
+ .#{$prefix}--popover-content {
373
+ inset-inline-end: 100%;
374
+ inset-inline-start: initial;
375
+ }
376
+ }
377
+
277
378
  :host(#{$prefix}-tooltip-content[align^='top']:not([autoalign])),
278
379
  :host(#{$prefix}-popover-content[align^='top']:not([autoalign])),
279
380
  :host(#{$prefix}-toggletip[alignment^='top']:not([autoalign])),
@@ -289,6 +390,17 @@ $popover-caret-height: custom-property.get-var(
289
390
  }
290
391
  }
291
392
 
393
+ // rtl
394
+ :host(#{$prefix}-tooltip-content:dir(rtl)[align^='top']:not([autoalign])),
395
+ :host(#{$prefix}-popover-content:dir(rtl)[align^='top']:not([autoalign])),
396
+ :host(#{$prefix}-toggletip:dir(rtl)[alignment^='top']:not([autoalign])),
397
+ :host(#{$prefix}-ai-label:dir(rtl)[alignment^='top']:not([autoalign])),
398
+ :host(#{$prefix}-slug:dir(rtl)[alignment^='top']:not([autoalign])) {
399
+ .#{$prefix}--popover-caret {
400
+ transform: translate(50%, calc(-1 * $popover-offset));
401
+ }
402
+ }
403
+
292
404
  :host(#{$prefix}-tooltip-content[align='top']:not([autoalign])),
293
405
  :host(#{$prefix}-popover-content[align='top']:not([autoalign])),
294
406
  :host(#{$prefix}-toggletip[alignment='top']:not([autoalign])),
@@ -301,6 +413,17 @@ $popover-caret-height: custom-property.get-var(
301
413
  }
302
414
  }
303
415
 
416
+ // rtl
417
+ :host(#{$prefix}-tooltip-content:dir(rtl)[align='top']:not([autoalign])),
418
+ :host(#{$prefix}-popover-content:dir(rtl)[align='top']:not([autoalign])),
419
+ :host(#{$prefix}-toggletip:dir(rtl)[alignment='top']:not([autoalign])),
420
+ :host(#{$prefix}-ai-label:dir(rtl)[alignment='top']:not([autoalign])),
421
+ :host(#{$prefix}-slug[alignment='top']:not([autoalign])) {
422
+ .#{$prefix}--popover-content {
423
+ transform: translate(50%, calc(-100% - $popover-offset));
424
+ }
425
+ }
426
+
304
427
  :host(#{$prefix}-tooltip-content[align='top-left']:not([autoalign])),
305
428
  :host(#{$prefix}-popover-content[align='top-left']:not([autoalign])),
306
429
  :host(#{$prefix}-toggletip[alignment='top-left']:not([autoalign])),
@@ -316,6 +439,18 @@ $popover-caret-height: custom-property.get-var(
316
439
  }
317
440
  }
318
441
 
442
+ // rtl
443
+ :host(#{$prefix}-tooltip-content:dir(rtl)[align='top-left']:not([autoalign])),
444
+ :host(#{$prefix}-popover-content:dir(rtl)[align='top-left']:not([autoalign])),
445
+ :host(#{$prefix}-toggletip:dir(rtl)[alignment='top-left']:not([autoalign])),
446
+ :host(#{$prefix}-ai-label:dir(rtl)[alignment='top-left']:not([autoalign])),
447
+ :host(#{$prefix}-slug[alignment='top-left']:not([autoalign])) {
448
+ .#{$prefix}--popover-content {
449
+ inset-inline-end: 0;
450
+ inset-inline-start: initial;
451
+ }
452
+ }
453
+
319
454
  :host(#{$prefix}-tooltip-content[align='top-right']:not([autoalign])),
320
455
  :host(#{$prefix}-popover-content[align='top-right']:not([autoalign])),
321
456
  :host(#{$prefix}-toggletip[alignment='top-right']:not([autoalign])),
@@ -328,6 +463,17 @@ $popover-caret-height: custom-property.get-var(
328
463
  }
329
464
  }
330
465
 
466
+ // rtl
467
+ :host(#{$prefix}-tooltip-content:dir(rtl)[align='top-right']:not([autoalign])),
468
+ :host(#{$prefix}-popover-content:dir(rtl)[align='top-right']:not([autoalign])),
469
+ :host(#{$prefix}-toggletip:dir(rtl)[alignment='top-right']:not([autoalign])),
470
+ :host(#{$prefix}-ai-label:dir(rtl)[alignment='top-right']:not([autoalign])),
471
+ :host(#{$prefix}-slug[alignment='top-right']:not([autoalign])) {
472
+ .#{$prefix}--popover-content {
473
+ inset-inline-start: 0;
474
+ }
475
+ }
476
+
331
477
  :host(#{$prefix}-toggletip[autoalign]),
332
478
  :host(#{$prefix}-tooltip-content[autoalign]),
333
479
  :host(#{$prefix}-popover-content[autoalign]) {