@carbon/ibm-products 2.38.0 → 2.39.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (103) hide show
  1. package/css/index-full-carbon.css +227 -0
  2. package/css/index-full-carbon.css.map +1 -1
  3. package/css/index-full-carbon.min.css +1 -1
  4. package/css/index-full-carbon.min.css.map +1 -1
  5. package/css/index-without-carbon.css +227 -0
  6. package/css/index-without-carbon.css.map +1 -1
  7. package/css/index-without-carbon.min.css +1 -1
  8. package/css/index-without-carbon.min.css.map +1 -1
  9. package/css/index.css +227 -0
  10. package/css/index.css.map +1 -1
  11. package/css/index.min.css +1 -1
  12. package/css/index.min.css.map +1 -1
  13. package/es/components/Card/Card.js +50 -9
  14. package/es/components/Card/CardFooter.d.ts +5 -1
  15. package/es/components/Card/CardFooter.js +11 -1
  16. package/es/components/Carousel/Carousel.d.ts +6 -2
  17. package/es/components/Checklist/Checklist.d.ts +100 -2
  18. package/es/components/Checklist/Checklist.js +9 -5
  19. package/es/components/Checklist/Checklist.types.d.ts +19 -0
  20. package/es/components/Checklist/Checklist.types.js +22 -0
  21. package/es/components/Checklist/ChecklistChart.d.ts +5 -1
  22. package/es/components/Checklist/ChecklistChart.js +9 -4
  23. package/es/components/Checklist/ChecklistIcon.d.ts +5 -1
  24. package/es/components/Checklist/ChecklistIcon.js +9 -4
  25. package/es/components/CoachmarkButton/CoachmarkButton.d.ts +19 -2
  26. package/es/components/CoachmarkOverlayElements/CoachmarkOverlayElements.d.ts +46 -2
  27. package/es/components/CoachmarkOverlayElements/CoachmarkOverlayElements.js +5 -4
  28. package/es/components/CreateInfluencer/CreateInfluencer.d.ts +55 -17
  29. package/es/components/DataSpreadsheet/DataSpreadsheet.d.ts +67 -2
  30. package/es/components/DataSpreadsheet/DataSpreadsheet.js +48 -27
  31. package/es/components/DataSpreadsheet/DataSpreadsheetBody.d.ts +139 -2
  32. package/es/components/DataSpreadsheet/DataSpreadsheetBody.js +46 -31
  33. package/es/components/DataSpreadsheet/DataSpreadsheetHeader.d.ts +89 -2
  34. package/es/components/DataSpreadsheet/DataSpreadsheetHeader.js +34 -25
  35. package/es/components/DataSpreadsheet/types/index.d.ts +30 -0
  36. package/es/components/GetStartedCard/GetStartedCard.d.ts +5 -0
  37. package/es/components/GetStartedCard/GetStartedCard.js +82 -0
  38. package/es/components/GetStartedCard/index.d.ts +1 -0
  39. package/es/components/Guidebanner/Guidebanner.js +2 -2
  40. package/es/components/NotificationsPanel/NotificationsPanel.d.ts +162 -1
  41. package/es/components/NotificationsPanel/NotificationsPanel.js +10 -10
  42. package/es/components/SidePanel/SidePanel.js +1 -1
  43. package/es/components/TagOverflow/TagOverflow.d.ts +5 -0
  44. package/es/components/TagOverflow/TagOverflow.js +153 -29
  45. package/es/components/TagOverflow/TagOverflowModal.d.ts +29 -0
  46. package/es/components/TagOverflow/TagOverflowModal.js +112 -0
  47. package/es/components/TagOverflow/TagOverflowPopover.d.ts +2 -0
  48. package/es/components/TagOverflow/TagOverflowPopover.js +135 -0
  49. package/es/components/index.d.ts +1 -0
  50. package/es/global/js/package-settings.d.ts +1 -0
  51. package/es/global/js/package-settings.js +1 -0
  52. package/es/index.js +1 -0
  53. package/es/settings.d.ts +1 -0
  54. package/lib/components/Card/Card.js +50 -9
  55. package/lib/components/Card/CardFooter.d.ts +5 -1
  56. package/lib/components/Card/CardFooter.js +11 -1
  57. package/lib/components/Carousel/Carousel.d.ts +6 -2
  58. package/lib/components/Checklist/Checklist.d.ts +100 -2
  59. package/lib/components/Checklist/Checklist.js +9 -5
  60. package/lib/components/Checklist/Checklist.types.d.ts +19 -0
  61. package/lib/components/Checklist/Checklist.types.js +27 -0
  62. package/lib/components/Checklist/ChecklistChart.d.ts +5 -1
  63. package/lib/components/Checklist/ChecklistChart.js +14 -9
  64. package/lib/components/Checklist/ChecklistIcon.d.ts +5 -1
  65. package/lib/components/Checklist/ChecklistIcon.js +9 -4
  66. package/lib/components/CoachmarkButton/CoachmarkButton.d.ts +19 -2
  67. package/lib/components/CoachmarkOverlayElements/CoachmarkOverlayElements.d.ts +46 -2
  68. package/lib/components/CoachmarkOverlayElements/CoachmarkOverlayElements.js +5 -4
  69. package/lib/components/CreateInfluencer/CreateInfluencer.d.ts +55 -17
  70. package/lib/components/DataSpreadsheet/DataSpreadsheet.d.ts +67 -2
  71. package/lib/components/DataSpreadsheet/DataSpreadsheet.js +48 -27
  72. package/lib/components/DataSpreadsheet/DataSpreadsheetBody.d.ts +139 -2
  73. package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js +46 -31
  74. package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.d.ts +89 -2
  75. package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.js +34 -25
  76. package/lib/components/DataSpreadsheet/types/index.d.ts +30 -0
  77. package/lib/components/GetStartedCard/GetStartedCard.d.ts +5 -0
  78. package/lib/components/GetStartedCard/GetStartedCard.js +88 -0
  79. package/lib/components/GetStartedCard/index.d.ts +1 -0
  80. package/lib/components/Guidebanner/Guidebanner.js +2 -2
  81. package/lib/components/NotificationsPanel/NotificationsPanel.d.ts +162 -1
  82. package/lib/components/NotificationsPanel/NotificationsPanel.js +10 -10
  83. package/lib/components/SidePanel/SidePanel.js +1 -1
  84. package/lib/components/TagOverflow/TagOverflow.d.ts +5 -0
  85. package/lib/components/TagOverflow/TagOverflow.js +154 -28
  86. package/lib/components/TagOverflow/TagOverflowModal.d.ts +29 -0
  87. package/lib/components/TagOverflow/TagOverflowModal.js +121 -0
  88. package/lib/components/TagOverflow/TagOverflowPopover.d.ts +2 -0
  89. package/lib/components/TagOverflow/TagOverflowPopover.js +144 -0
  90. package/lib/components/index.d.ts +1 -0
  91. package/lib/global/js/package-settings.d.ts +1 -0
  92. package/lib/global/js/package-settings.js +1 -0
  93. package/lib/index.js +5 -0
  94. package/lib/settings.d.ts +1 -0
  95. package/package.json +3 -3
  96. package/scss/components/GetStartedCard/_carbon-imports.scss +9 -0
  97. package/scss/components/GetStartedCard/_get-started-card.scss +135 -0
  98. package/scss/components/GetStartedCard/_index-with-carbon.scss +9 -0
  99. package/scss/components/GetStartedCard/_index.scss +8 -0
  100. package/scss/components/TagOverflow/_tag-overflow.scss +157 -0
  101. package/scss/components/_index-with-carbon.scss +1 -0
  102. package/scss/components/_index.scss +1 -0
  103. package/telemetry.yml +23 -16
package/css/index.css CHANGED
@@ -22225,9 +22225,18 @@ th.c4p--datagrid__select-all-toggle-on.button {
22225
22225
  width: 100%;
22226
22226
  min-width: 6rem;
22227
22227
  align-items: center;
22228
+ justify-content: flex-start;
22228
22229
  white-space: nowrap;
22229
22230
  }
22230
22231
 
22232
+ .c4p--tag-overflow--align-end {
22233
+ justify-content: flex-end;
22234
+ }
22235
+
22236
+ .c4p--tag-overflow--align-center {
22237
+ justify-content: center;
22238
+ }
22239
+
22231
22240
  .c4p--tag-overflow--multiline {
22232
22241
  flex-wrap: wrap;
22233
22242
  }
@@ -22253,6 +22262,119 @@ th.c4p--datagrid__select-all-toggle-on.button {
22253
22262
  max-width: 3rem;
22254
22263
  }
22255
22264
 
22265
+ .c4p--tag-overflow-popover {
22266
+ display: inline-block;
22267
+ vertical-align: bottom;
22268
+ }
22269
+ .c4p--tag-overflow-popover .cds--tag.cds--tag--interactive {
22270
+ border: 0;
22271
+ }
22272
+ .c4p--tag-overflow-popover .cds--popover .cds--popover-content {
22273
+ padding: 1rem;
22274
+ }
22275
+
22276
+ .c4p--tag-overflow-popover--hidden {
22277
+ overflow: hidden;
22278
+ max-width: 0;
22279
+ visibility: hidden;
22280
+ }
22281
+
22282
+ .c4p--tag-overflow-popover__el.c4p--tag-overflow-popover__el {
22283
+ min-width: initial;
22284
+ text-align: left;
22285
+ }
22286
+ .c4p--tag-overflow-popover__el .c4p--tag-overflow-popover__trigger {
22287
+ font-family: inherit;
22288
+ }
22289
+ .c4p--tag-overflow-popover__el .c4p--tag-overflow-popover__show-all-tags-link.cds--link:visited {
22290
+ display: inline-block;
22291
+ margin: 0.5rem 0 0.25rem;
22292
+ color: var(--cds-link-inverse, #78a9ff);
22293
+ }
22294
+ .c4p--tag-overflow-popover__el .cds--link:active,
22295
+ .c4p--tag-overflow-popover__el .cds--link:active:visited,
22296
+ .c4p--tag-overflow-popover__el .cds--link:active:visited:hover {
22297
+ color: var(--cds-text-inverse, #ffffff);
22298
+ }
22299
+ .c4p--tag-overflow-popover__el .c4p--tag-overflow-popover__tag-list {
22300
+ display: flex;
22301
+ flex-direction: column;
22302
+ }
22303
+ .c4p--tag-overflow-popover__el .c4p--tag-overflow-popover__show-all-tags-link {
22304
+ margin-top: 0.5rem;
22305
+ color: var(--cds-link-inverse, #78a9ff);
22306
+ }
22307
+ .c4p--tag-overflow-popover__el .c4p--tag-overflow-popover__tag-item.c4p--tag-overflow-popover__tag-item--tag .cds--tag {
22308
+ background-color: var(--cds-background-inverse-hover, #474747);
22309
+ }
22310
+ .c4p--tag-overflow-popover__el .c4p--tag-overflow-popover__tag-item.c4p--tag-overflow-popover__tag-item--default,
22311
+ .c4p--tag-overflow-popover__el .c4p--tag-overflow-popover__tag-item.c4p--tag-overflow-popover__tag-item--default .cds--tag {
22312
+ font-size: var(--cds-body-compact-01-font-size, 0.875rem);
22313
+ font-weight: var(--cds-body-compact-01-font-weight, 400);
22314
+ line-height: var(--cds-body-compact-01-line-height, 1.28572);
22315
+ letter-spacing: var(--cds-body-compact-01-letter-spacing, 0.16px);
22316
+ display: block;
22317
+ overflow: hidden;
22318
+ min-width: initial;
22319
+ min-height: initial;
22320
+ padding: 0;
22321
+ border-radius: 0;
22322
+ margin: 0;
22323
+ background-color: inherit;
22324
+ color: inherit;
22325
+ text-overflow: ellipsis;
22326
+ white-space: nowrap;
22327
+ }
22328
+ .c4p--tag-overflow-popover__el .c4p--tag-overflow-popover__tag .cds--tag__close-icon {
22329
+ padding: 0;
22330
+ }
22331
+ .c4p--tag-overflow-popover__el .c4p--tag-overflow-popover__tag .cds--tag--high-contrast {
22332
+ background-color: var(--cds-background, #ffffff);
22333
+ color: var(--cds-text-primary, #161616);
22334
+ }
22335
+ .c4p--tag-overflow-popover__el .c4p--tag-overflow-popover__tag .cds--tag__close-icon:hover {
22336
+ background-color: var(--cds-background-hover, rgba(141, 141, 141, 0.12));
22337
+ }
22338
+ .c4p--tag-overflow-popover__el .c4p--tag-overflow-popover__tag .cds--tag__close-icon:focus {
22339
+ box-shadow: inset 0 0 0 0.125rem var(--cds-focus, #0f62fe);
22340
+ }
22341
+
22342
+ .c4p--tag-overflow-modal.c4p--tag-overflow-modal {
22343
+ text-align: initial;
22344
+ white-space: initial;
22345
+ }
22346
+ @media (min-width: 42rem) {
22347
+ .c4p--tag-overflow-modal .c4p--tag-overflow-modal__container {
22348
+ height: 90%;
22349
+ max-height: 450px;
22350
+ }
22351
+ }
22352
+ .c4p--tag-overflow-modal .c4p--tag-overflow-modal__search {
22353
+ margin-top: 1rem;
22354
+ margin-bottom: 0;
22355
+ }
22356
+ .c4p--tag-overflow-modal.c4p--tag-overflow-modal .c4p--tag-overflow-modal__fade {
22357
+ position: relative;
22358
+ margin-right: 1rem;
22359
+ margin-left: 1rem;
22360
+ }
22361
+ .c4p--tag-overflow-modal .c4p--tag-overflow-modal__body {
22362
+ padding-bottom: 1.5rem;
22363
+ }
22364
+ .c4p--tag-overflow-modal .c4p--tag-overflow-modal__header {
22365
+ padding-right: 0;
22366
+ margin-right: 1rem;
22367
+ }
22368
+ .c4p--tag-overflow-modal.c4p--tag-overflow-modal .c4p--tag-overflow-modal__fade::after {
22369
+ position: absolute;
22370
+ top: calc(-1 * 5rem);
22371
+ left: 0;
22372
+ width: 100%;
22373
+ height: 2rem;
22374
+ background: linear-gradient(to bottom, transparent, var(--cds-layer-01, #f4f4f4));
22375
+ content: "";
22376
+ }
22377
+
22256
22378
  .cds--accordion--flush .cds--accordion__title {
22257
22379
  margin-inline-start: 0;
22258
22380
  }
@@ -23364,4 +23486,109 @@ c4p--condition-builder__condition-builder-item-time {
23364
23486
  flex-direction: row;
23365
23487
  }
23366
23488
 
23489
+ /* stylelint-disable carbon/layout-token-use */
23490
+ /* stylelint-disable max-nesting-depth */
23491
+ .c4p--card__get-started {
23492
+ border-width: 1px;
23493
+ border-style: solid;
23494
+ background: linear-gradient(to bottom, #491d8b 40%, #6929c4);
23495
+ border-image: linear-gradient(to bottom, #8a3ffc, #a56eff) 1;
23496
+ color: var(--cds-text-on-color, #ffffff);
23497
+ }
23498
+ .c4p--card__get-started:hover {
23499
+ background: linear-gradient(#7c3dd6, #7c3dd6);
23500
+ }
23501
+ .c4p--card__get-started:focus {
23502
+ border: 2px solid var(--cds-focus, #0f62fe);
23503
+ outline: 1px solid var(--cds-focus-inset, #ffffff);
23504
+ outline-offset: -3px;
23505
+ }
23506
+ .c4p--card__get-started .c4p--card__sequence {
23507
+ font-size: var(--cds-heading-05-font-size, 2rem);
23508
+ font-weight: var(--cds-heading-05-font-weight, 400);
23509
+ line-height: var(--cds-heading-05-line-height, 1.25);
23510
+ letter-spacing: var(--cds-heading-05-letter-spacing, 0);
23511
+ padding-top: 1rem;
23512
+ padding-left: 1rem;
23513
+ }
23514
+ .c4p--card__get-started .c4p--card__status {
23515
+ position: absolute;
23516
+ z-index: 2;
23517
+ top: 1rem;
23518
+ right: 1rem;
23519
+ }
23520
+ .c4p--card__get-started .c4p--card__header-body-container {
23521
+ display: flex;
23522
+ }
23523
+ .c4p--card__get-started .c4p--card__header {
23524
+ padding-right: 3rem;
23525
+ }
23526
+ @media (max-width: 65.98rem) {
23527
+ .c4p--card__get-started .c4p--card__header {
23528
+ padding-bottom: 0;
23529
+ }
23530
+ }
23531
+ @media (max-width: 65.98rem) {
23532
+ .c4p--card__get-started .c4p--card__body {
23533
+ padding: 0;
23534
+ }
23535
+ }
23536
+ .c4p--card__get-started .c4p--card__media {
23537
+ align-content: center;
23538
+ }
23539
+ @media (max-width: 65.98rem) {
23540
+ .c4p--card__get-started .c4p--card__media {
23541
+ display: none;
23542
+ }
23543
+ }
23544
+ .c4p--card__get-started .c4p--card__pictogram ~ .c4p--card__content-container .c4p--card__media {
23545
+ /* stylelint-disable-next-line function-no-unknown */
23546
+ margin-top: -3.125rem;
23547
+ margin-bottom: -3rem;
23548
+ }
23549
+ .c4p--card__get-started .c4p--card__sequence ~ .c4p--card__content-container .c4p--card__media {
23550
+ /* stylelint-disable-next-line function-no-unknown */
23551
+ margin-top: -3.5rem;
23552
+ margin-bottom: -3rem;
23553
+ }
23554
+ .c4p--card__get-started .c4p--card__actions {
23555
+ padding: 1rem;
23556
+ gap: 0.75rem;
23557
+ font-size: var(--cds-label-01-font-size, 0.75rem);
23558
+ font-weight: var(--cds-label-01-font-weight, 400);
23559
+ line-height: var(--cds-label-01-line-height, 1.33333);
23560
+ letter-spacing: var(--cds-label-01-letter-spacing, 0.32px);
23561
+ }
23562
+ .c4p--card__get-started .c4p--card__actions .c4p--card__icon {
23563
+ display: flex;
23564
+ padding: 0;
23565
+ margin-right: 0;
23566
+ }
23567
+ .c4p--card__get-started .c4p--card__actions .c4p--card__icon svg {
23568
+ margin-right: 0.25rem;
23569
+ }
23570
+ .c4p--card__get-started .c4p--card__actions .c4p--card__icon:hover {
23571
+ background: none;
23572
+ }
23573
+ .c4p--card__get-started .c4p--card__footer {
23574
+ position: relative;
23575
+ z-index: 1;
23576
+ justify-content: space-between;
23577
+ border: none;
23578
+ }
23579
+ .c4p--card__get-started .c4p--card__footer .c4p--card__action-icon {
23580
+ display: flex;
23581
+ align-self: center;
23582
+ padding-right: 1rem;
23583
+ }
23584
+
23585
+ .c4p--card__disabled:focus,
23586
+ .c4p--card__disabled:hover,
23587
+ .c4p--card__disabled {
23588
+ border: 1px solid var(--cds-border-disabled, #c6c6c6);
23589
+ background: var(--cds-layer-02, #ffffff);
23590
+ color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
23591
+ cursor: default;
23592
+ }
23593
+
23367
23594
  /*# sourceMappingURL=index.css.map */