@carbon/ibm-products 2.22.0 → 2.23.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.
- package/README.md +2 -1
- package/css/index-full-carbon.css +32 -110
- package/css/index-full-carbon.css.map +1 -1
- package/css/index-full-carbon.min.css +1 -1
- package/css/index-full-carbon.min.css.map +1 -1
- package/css/index-without-carbon-released-only.css +32 -94
- package/css/index-without-carbon-released-only.css.map +1 -1
- package/css/index-without-carbon-released-only.min.css +1 -1
- package/css/index-without-carbon-released-only.min.css.map +1 -1
- package/css/index-without-carbon.css +32 -110
- package/css/index-without-carbon.css.map +1 -1
- package/css/index-without-carbon.min.css +1 -1
- package/css/index-without-carbon.min.css.map +1 -1
- package/css/index.css +32 -110
- package/css/index.css.map +1 -1
- package/css/index.min.css +1 -1
- package/css/index.min.css.map +1 -1
- package/es/components/Datagrid/Datagrid/DatagridHeaderRow.js +14 -4
- package/es/components/Datagrid/Datagrid/addons/Slug/ColumnHeaderSlug.js +26 -0
- package/es/components/Datagrid/useDefaultStringRenderer.js +3 -3
- package/es/components/Datagrid/useSortableColumns.js +15 -5
- package/es/components/FilterSummary/FilterSummary.js +100 -19
- package/es/components/TagSet/TagSet.js +11 -3
- package/es/global/js/hooks/useResizeObserver.js +2 -2
- package/lib/components/Datagrid/Datagrid/DatagridHeaderRow.js +14 -4
- package/lib/components/Datagrid/Datagrid/addons/Slug/ColumnHeaderSlug.js +36 -0
- package/lib/components/Datagrid/useDefaultStringRenderer.js +3 -3
- package/lib/components/Datagrid/useSortableColumns.js +15 -5
- package/lib/components/FilterSummary/FilterSummary.js +103 -23
- package/lib/components/TagSet/TagSet.js +11 -3
- package/lib/global/js/hooks/useResizeObserver.js +2 -2
- package/package.json +3 -3
- package/scss/components/CreateSidePanel/_create-side-panel.scss +1 -38
- package/scss/components/Datagrid/styles/_datagrid.scss +15 -0
- package/scss/components/EditSidePanel/_edit-side-panel.scss +0 -18
- package/scss/components/FilterSummary/_filter-summary.scss +22 -1
package/README.md
CHANGED
@@ -244,6 +244,7 @@ and
|
|
244
244
|
<!-- ALL-CONTRIBUTORS-LIST:END -->
|
245
245
|
|
246
246
|
## <picture><source height="20" width="20" media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/ibm-telemetry/telemetry-js/main/docs/images/ibm-telemetry-dark.svg"><source height="20" width="20" media="(prefers-color-scheme: light)" srcset="https://raw.githubusercontent.com/ibm-telemetry/telemetry-js/main/docs/images/ibm-telemetry-light.svg"><img height="20" width="20" alt="IBM Telemetry" src="https://raw.githubusercontent.com/ibm-telemetry/telemetry-js/main/docs/images/ibm-telemetry-light.svg"></picture> IBM Telemetry
|
247
|
+
|
247
248
|
This package uses IBM Telemetry to collect metrics data. By installing this
|
248
249
|
package as a dependency you are agreeing to telemetry collection. To opt out,
|
249
250
|
see
|
@@ -256,4 +257,4 @@ For more information on the data being collected, please see the
|
|
256
257
|
Licensed under the
|
257
258
|
[Apache-2.0 License](https://github.com/carbon-design-system/ibm-products/blob/master/LICENSE).
|
258
259
|
|
259
|
-
[](https://www.netlify.com)
|
260
|
+
[](https://www.netlify.com)
|
@@ -2771,76 +2771,6 @@ p.c4p--about-modal__copyright-text:first-child {
|
|
2771
2771
|
padding-right: calc(20% - 1rem);
|
2772
2772
|
}
|
2773
2773
|
|
2774
|
-
.c4p--create-side-panel.c4p--side-panel__container--xs .c4p--side-panel__title-text {
|
2775
|
-
width: calc(16rem - 1rem);
|
2776
|
-
padding-right: calc(16rem * 0.2 - 1rem);
|
2777
|
-
margin-bottom: 0.25rem;
|
2778
|
-
}
|
2779
|
-
|
2780
|
-
.c4p--create-side-panel.c4p--side-panel__container--xs .c4p--side-panel__subtitle-text {
|
2781
|
-
width: calc(16rem - 1rem);
|
2782
|
-
padding-right: calc(16rem * 0.2 - 1rem);
|
2783
|
-
padding-bottom: 1rem;
|
2784
|
-
border-bottom: 1px solid var(--cds-layer-accent-01, #e0e0e0);
|
2785
|
-
color: var(--cds-text-secondary, #525252);
|
2786
|
-
}
|
2787
|
-
|
2788
|
-
.c4p--create-side-panel.c4p--side-panel__container--sm .c4p--side-panel__title-text {
|
2789
|
-
width: calc(20rem - 1rem);
|
2790
|
-
padding-right: calc(20rem * 0.2 - 1rem);
|
2791
|
-
margin-bottom: 0.25rem;
|
2792
|
-
}
|
2793
|
-
|
2794
|
-
.c4p--create-side-panel.c4p--side-panel__container--sm .c4p--side-panel__subtitle-text {
|
2795
|
-
width: calc(20rem - 1rem);
|
2796
|
-
padding-right: calc(20rem * 0.2 - 1rem);
|
2797
|
-
padding-bottom: 1rem;
|
2798
|
-
border-bottom: 1px solid var(--cds-layer-accent-01, #e0e0e0);
|
2799
|
-
color: var(--cds-text-secondary, #525252);
|
2800
|
-
}
|
2801
|
-
|
2802
|
-
.c4p--create-side-panel.c4p--side-panel__container--md .c4p--side-panel__title-text {
|
2803
|
-
width: calc(30rem - 1rem);
|
2804
|
-
padding-right: calc(30rem * 0.2 - 1rem);
|
2805
|
-
margin-bottom: 0.25rem;
|
2806
|
-
}
|
2807
|
-
|
2808
|
-
.c4p--create-side-panel.c4p--side-panel__container--md .c4p--side-panel__subtitle-text {
|
2809
|
-
width: calc(30rem - 1rem);
|
2810
|
-
padding-right: calc(30rem * 0.2 - 1rem);
|
2811
|
-
padding-bottom: 1rem;
|
2812
|
-
border-bottom: 1px solid var(--cds-layer-accent-01, #e0e0e0);
|
2813
|
-
color: var(--cds-text-secondary, #525252);
|
2814
|
-
}
|
2815
|
-
|
2816
|
-
.c4p--create-side-panel.c4p--side-panel__container--lg .c4p--side-panel__title-text {
|
2817
|
-
width: calc(40rem - 1rem);
|
2818
|
-
padding-right: calc(40rem * 0.2 - 1rem);
|
2819
|
-
margin-bottom: 0.25rem;
|
2820
|
-
}
|
2821
|
-
|
2822
|
-
.c4p--create-side-panel.c4p--side-panel__container--lg .c4p--side-panel__subtitle-text {
|
2823
|
-
width: calc(40rem - 1rem);
|
2824
|
-
padding-right: calc(40rem * 0.2 - 1rem);
|
2825
|
-
padding-bottom: 1rem;
|
2826
|
-
border-bottom: 1px solid var(--cds-layer-accent-01, #e0e0e0);
|
2827
|
-
color: var(--cds-text-secondary, #525252);
|
2828
|
-
}
|
2829
|
-
|
2830
|
-
.c4p--create-side-panel.c4p--side-panel__container--2xl .c4p--side-panel__title-text {
|
2831
|
-
width: calc(40rem 75% - 1rem);
|
2832
|
-
padding-right: calc(40rem 75% * 0.2 - 1rem);
|
2833
|
-
margin-bottom: 0.25rem;
|
2834
|
-
}
|
2835
|
-
|
2836
|
-
.c4p--create-side-panel.c4p--side-panel__container--2xl .c4p--side-panel__subtitle-text {
|
2837
|
-
width: calc(40rem 75% - 1rem);
|
2838
|
-
padding-right: calc(40rem 75% * 0.2 - 1rem);
|
2839
|
-
padding-bottom: 1rem;
|
2840
|
-
border-bottom: 1px solid var(--cds-layer-accent-01, #e0e0e0);
|
2841
|
-
color: var(--cds-text-secondary, #525252);
|
2842
|
-
}
|
2843
|
-
|
2844
2774
|
.cds--form.c4p--create-side-panel__form {
|
2845
2775
|
padding-top: 1rem;
|
2846
2776
|
}
|
@@ -2872,32 +2802,10 @@ p.c4p--about-modal__copyright-text:first-child {
|
|
2872
2802
|
display: none;
|
2873
2803
|
}
|
2874
2804
|
|
2875
|
-
.c4p--create-side-
|
2876
|
-
font-size: var(--cds-heading-03-font-size, 1.25rem);
|
2877
|
-
font-weight: var(--cds-heading-03-font-weight, 400);
|
2878
|
-
line-height: var(--cds-heading-03-line-height, 1.4);
|
2879
|
-
letter-spacing: var(--cds-heading-03-letter-spacing, 0);
|
2880
|
-
margin-bottom: 0.25rem;
|
2881
|
-
}
|
2882
|
-
|
2883
|
-
.c4p--create-side-panel__subtitle {
|
2884
|
-
font-size: var(--cds-body-compact-01-font-size, 0.875rem);
|
2885
|
-
font-weight: var(--cds-body-compact-01-font-weight, 400);
|
2886
|
-
line-height: var(--cds-body-compact-01-line-height, 1.28572);
|
2887
|
-
letter-spacing: var(--cds-body-compact-01-letter-spacing, 0.16px);
|
2888
|
-
margin-bottom: 0.5rem;
|
2805
|
+
.c4p--create-side-panel .c4p--side-panel__subtitle-text {
|
2889
2806
|
color: var(--cds-text-secondary, #525252);
|
2890
2807
|
}
|
2891
2808
|
|
2892
|
-
.c4p--side-panel .c4p--create-side-panel__actions-container {
|
2893
|
-
position: absolute;
|
2894
|
-
z-index: 4;
|
2895
|
-
right: 0;
|
2896
|
-
bottom: 0;
|
2897
|
-
width: 100%;
|
2898
|
-
margin-bottom: 0;
|
2899
|
-
}
|
2900
|
-
|
2901
2809
|
.c4p--tearsheet.c4p--tearsheet {
|
2902
2810
|
z-index: 9001;
|
2903
2811
|
align-items: flex-end;
|
@@ -3602,16 +3510,34 @@ p.c4p--about-modal__copyright-text:first-child {
|
|
3602
3510
|
width: 100%;
|
3603
3511
|
/* stylelint-disable-next-line -- to-rem carbon replacement for rem */
|
3604
3512
|
height: 3rem;
|
3605
|
-
align-items:
|
3513
|
+
align-items: start;
|
3606
3514
|
padding: 0.5rem;
|
3607
3515
|
border-top: 1px solid var(--cds-border-subtle-01, #c6c6c6);
|
3608
3516
|
background: var(--cds-layer-01, #f4f4f4);
|
3609
3517
|
}
|
3518
|
+
.c4p--filter-summary.c4p--filter-summary__expanded {
|
3519
|
+
height: fit-content;
|
3520
|
+
}
|
3610
3521
|
|
3611
3522
|
.c4p--filter-summary .c4p--tag-set.c4p--tag-set.c4p--filter-summary__clear-button-inline {
|
3612
3523
|
width: auto;
|
3613
3524
|
}
|
3614
3525
|
|
3526
|
+
.c4p--filter-summary__view-all--wrapper {
|
3527
|
+
position: absolute;
|
3528
|
+
top: 0.5rem;
|
3529
|
+
right: 0;
|
3530
|
+
}
|
3531
|
+
|
3532
|
+
.c4p--filter-summary__expanded .c4p--filter-summary__clear-all-button.cds--btn {
|
3533
|
+
margin-right: 2rem;
|
3534
|
+
}
|
3535
|
+
|
3536
|
+
.c4p--filter-summary__view-all--wrapper .c4p--filter-summary__view-all--chevron-multiline {
|
3537
|
+
transform: rotate(180deg);
|
3538
|
+
transition: transform 70ms cubic-bezier(0.2, 0, 0.38, 0.9);
|
3539
|
+
}
|
3540
|
+
|
3615
3541
|
.c4p--http-errors .c4p--http-errors__content {
|
3616
3542
|
position: fixed;
|
3617
3543
|
z-index: 2;
|
@@ -8920,22 +8846,6 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
8920
8846
|
.c4p--edit-side-panel.c4p--side-panel .cds--btn.c4p--side-panel__close-button {
|
8921
8847
|
display: none;
|
8922
8848
|
}
|
8923
|
-
.c4p--edit-side-panel .c4p--side-panel .c4p--edit-side-panel__actions-container {
|
8924
|
-
position: absolute;
|
8925
|
-
z-index: 4;
|
8926
|
-
bottom: 0;
|
8927
|
-
left: 0;
|
8928
|
-
width: 100%;
|
8929
|
-
margin-bottom: 0;
|
8930
|
-
}
|
8931
|
-
.c4p--edit-side-panel .c4p--edit-side-panel__actions-container {
|
8932
|
-
position: absolute;
|
8933
|
-
z-index: 4;
|
8934
|
-
right: 0;
|
8935
|
-
bottom: 0;
|
8936
|
-
width: 100%;
|
8937
|
-
margin-bottom: 0;
|
8938
|
-
}
|
8939
8849
|
|
8940
8850
|
.c4p--options-tile {
|
8941
8851
|
position: relative;
|
@@ -9639,6 +9549,15 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
9639
9549
|
background-color: var(--cds-background, #ffffff);
|
9640
9550
|
}
|
9641
9551
|
|
9552
|
+
.c4p--datagrid th.c4p--datagrid__with-slug {
|
9553
|
+
background-image: linear-gradient(180deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 100%, transparent 100%);
|
9554
|
+
border-block-end-color: var(--cds-ai-border-strong, #4589ff);
|
9555
|
+
}
|
9556
|
+
|
9557
|
+
.c4p--datagrid th.c4p--datagrid__with-slug .cds--slug {
|
9558
|
+
margin-left: 0.5rem;
|
9559
|
+
}
|
9560
|
+
|
9642
9561
|
.c4p--datagrid__grid-container {
|
9643
9562
|
display: block;
|
9644
9563
|
width: 100%;
|
@@ -9710,6 +9629,9 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
9710
9629
|
-webkit-line-clamp: 2;
|
9711
9630
|
white-space: initial;
|
9712
9631
|
}
|
9632
|
+
.c4p--datagrid__grid-container .c4p--datagrid__defaultStringRenderer.c4p--datagrid__defaultStringRenderer--slug {
|
9633
|
+
width: fit-content;
|
9634
|
+
}
|
9713
9635
|
.c4p--datagrid__grid-container .c4p--datagrid__expanded-row {
|
9714
9636
|
display: flex;
|
9715
9637
|
overflow: hidden;
|