@carbon/ibm-products 1.8.0 → 1.9.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/css/index-full-carbon.css +82 -9
- package/css/index-full-carbon.css.map +1 -1
- package/css/index-full-carbon.min.css +3 -3
- package/css/index-full-carbon.min.css.map +1 -1
- package/css/index-without-carbon-released-only.css +1 -2
- 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 +82 -9
- package/css/index-without-carbon.css.map +1 -1
- package/css/index-without-carbon.min.css +3 -3
- package/css/index-without-carbon.min.css.map +1 -1
- package/css/index.css +82 -9
- package/css/index.css.map +1 -1
- package/css/index.min.css +3 -3
- package/css/index.min.css.map +1 -1
- package/es/components/AddSelect/AddSelect.js +104 -16
- package/es/components/AddSelect/AddSelectBreadcrumbs.js +4 -4
- package/es/components/AddSelect/AddSelectColumn.js +21 -0
- package/es/components/AddSelect/AddSelectList.js +67 -8
- package/es/components/AddSelect/AddSelectSidebar.js +7 -1
- package/es/components/DataSpreadsheet/DataSpreadsheet.js +42 -2
- package/es/components/DataSpreadsheet/DataSpreadsheetBody.js +194 -10
- package/es/components/DataSpreadsheet/createActiveCellFn.js +1 -1
- package/es/components/DataSpreadsheet/createCellSelectionArea.js +45 -0
- package/es/components/InlineEdit/InlineEdit.js +23 -13
- package/es/global/js/utils/DisplayBox.js +31 -0
- package/es/global/js/utils/deepCloneObject.js +26 -0
- package/lib/components/AddSelect/AddSelect.js +102 -15
- package/lib/components/AddSelect/AddSelectBreadcrumbs.js +2 -3
- package/lib/components/AddSelect/AddSelectColumn.js +37 -0
- package/lib/components/AddSelect/AddSelectList.js +65 -8
- package/lib/components/AddSelect/AddSelectSidebar.js +7 -1
- package/lib/components/DataSpreadsheet/DataSpreadsheet.js +42 -2
- package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js +198 -10
- package/lib/components/DataSpreadsheet/createActiveCellFn.js +1 -1
- package/lib/components/DataSpreadsheet/createCellSelectionArea.js +56 -0
- package/lib/components/InlineEdit/InlineEdit.js +23 -13
- package/lib/global/js/utils/DisplayBox.js +46 -0
- package/lib/global/js/utils/deepCloneObject.js +37 -0
- package/package.json +8 -8
- package/scss/components/ActionBar/_storybook-styles.scss +8 -0
- package/scss/components/ActionSet/_storybook-styles.scss +1 -3
- package/scss/components/AddSelect/_add-select.scss +58 -2
- package/scss/components/BreadcrumbWithOverflow/_storybook-styles.scss +8 -0
- package/scss/components/ButtonSetWithOverflow/_storybook-styles.scss +8 -0
- package/scss/components/DataSpreadsheet/_data-spreadsheet.scss +18 -0
- package/scss/components/InlineEdit/_inline-edit.scss +11 -4
- package/scss/components/InlineEdit/_storybook-styles.scss +1 -0
- package/scss/components/TagSet/_storybook-styles.scss +8 -0
- package/scss/components/Tearsheet/_tearsheet.scss +1 -2
- package/scss/global/styles/_display-box.scss +62 -0
@@ -13936,8 +13936,7 @@ a.bx--side-nav__link--current::before {
|
|
13936
13936
|
margin: 0;
|
13937
13937
|
}
|
13938
13938
|
.c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__header--with-close-icon {
|
13939
|
-
padding-right: var(--cds-spacing-
|
13940
|
-
margin-right: var(--cds-spacing-09, 3rem);
|
13939
|
+
padding-right: var(--cds-spacing-10, 4rem);
|
13941
13940
|
}
|
13942
13941
|
.c4p--tearsheet .c4p--tearsheet__header-content {
|
13943
13942
|
display: flex;
|
@@ -16641,6 +16640,18 @@ a.bx--side-nav__link--current::before {
|
|
16641
16640
|
align-items: center;
|
16642
16641
|
justify-content: space-between;
|
16643
16642
|
}
|
16643
|
+
.c4p--add-select__selections-cell-title {
|
16644
|
+
display: block;
|
16645
|
+
color: var(--cds-text-01, #161616);
|
16646
|
+
}
|
16647
|
+
.c4p--add-select__selections-cell-subtitle {
|
16648
|
+
font-size: var(--cds-label-01-font-size, 0.75rem);
|
16649
|
+
font-weight: var(--cds-label-01-font-weight, 400);
|
16650
|
+
line-height: var(--cds-label-01-line-height, 1.33333);
|
16651
|
+
letter-spacing: var(--cds-label-01-letter-spacing, 0.32px);
|
16652
|
+
display: block;
|
16653
|
+
color: var(--cds-text-02, #525252);
|
16654
|
+
}
|
16644
16655
|
|
16645
16656
|
.c4p--add-select__sidebar-header {
|
16646
16657
|
display: flex;
|
@@ -16658,6 +16669,17 @@ a.bx--side-nav__link--current::before {
|
|
16658
16669
|
margin-right: var(--cds-spacing-03, 0.5rem);
|
16659
16670
|
}
|
16660
16671
|
|
16672
|
+
.c4p--add-select__sidebar-selected-item-title {
|
16673
|
+
color: var(--cds-text-01, #161616);
|
16674
|
+
}
|
16675
|
+
.c4p--add-select__sidebar-selected-item-subtitle {
|
16676
|
+
font-size: var(--cds-label-01-font-size, 0.75rem);
|
16677
|
+
font-weight: var(--cds-label-01-font-weight, 400);
|
16678
|
+
line-height: var(--cds-label-01-line-height, 1.33333);
|
16679
|
+
letter-spacing: var(--cds-label-01-letter-spacing, 0.32px);
|
16680
|
+
color: var(--cds-text-02, #525252);
|
16681
|
+
}
|
16682
|
+
|
16661
16683
|
.c4p--add-select__sidebar-body {
|
16662
16684
|
padding: var(--cds-spacing-05, 1rem);
|
16663
16685
|
}
|
@@ -16667,6 +16689,8 @@ a.bx--side-nav__link--current::before {
|
|
16667
16689
|
font-weight: var(--cds-label-01-font-weight, 400);
|
16668
16690
|
line-height: var(--cds-label-01-line-height, 1.33333);
|
16669
16691
|
letter-spacing: var(--cds-label-01-letter-spacing, 0.32px);
|
16692
|
+
margin-bottom: var(--cds-spacing-03, 0.5rem);
|
16693
|
+
color: var(--cds-text-02, #525252);
|
16670
16694
|
}
|
16671
16695
|
|
16672
16696
|
.c4p--add-select .c4p--add-select__sidebar-item-body {
|
@@ -16674,7 +16698,7 @@ a.bx--side-nav__link--current::before {
|
|
16674
16698
|
font-weight: var(--cds-body-long-01-font-weight, 400);
|
16675
16699
|
line-height: var(--cds-body-long-01-line-height, 1.42857);
|
16676
16700
|
letter-spacing: var(--cds-body-long-01-letter-spacing, 0.16px);
|
16677
|
-
margin-bottom: var(--cds-spacing-
|
16701
|
+
margin-bottom: var(--cds-spacing-05, 1rem);
|
16678
16702
|
}
|
16679
16703
|
|
16680
16704
|
.c4p--add-select .c4p--add-select__sidebar-item-remove-button:hover {
|
@@ -16687,11 +16711,29 @@ a.bx--side-nav__link--current::before {
|
|
16687
16711
|
justify-content: space-between;
|
16688
16712
|
}
|
16689
16713
|
|
16714
|
+
.c4p--add-select__columns {
|
16715
|
+
display: flex;
|
16716
|
+
flex-direction: row;
|
16717
|
+
}
|
16718
|
+
|
16719
|
+
.c4p--add-select__columns .c4p--add-select__selections-cell {
|
16720
|
+
padding: 0 var(--cds-spacing-05, 1rem) !important;
|
16721
|
+
}
|
16722
|
+
|
16723
|
+
.c4p--add-select__column {
|
16724
|
+
padding: var(--cds-spacing-05, 1rem);
|
16725
|
+
border-right: var(--cds-ui-03, #e0e0e0);
|
16726
|
+
}
|
16727
|
+
|
16690
16728
|
.c4p--add-select .c4p--tearsheet .c4p--tearsheet__influencer {
|
16691
16729
|
max-width: 29rem;
|
16692
16730
|
flex: 0 0 50%;
|
16693
16731
|
}
|
16694
16732
|
|
16733
|
+
.c4p--add-select .c4p--tearsheet__header-description {
|
16734
|
+
color: var(--cds-text-02, #525252);
|
16735
|
+
}
|
16736
|
+
|
16695
16737
|
.c4p--add-select .c4p--add-select__items-label {
|
16696
16738
|
font-size: var(--cds-productive-heading-01-font-size, 0.875rem);
|
16697
16739
|
font-weight: var(--cds-productive-heading-01-font-weight, 600);
|
@@ -16707,6 +16749,10 @@ a.bx--side-nav__link--current::before {
|
|
16707
16749
|
padding-bottom: var(--cds-spacing-05, 1rem);
|
16708
16750
|
}
|
16709
16751
|
|
16752
|
+
.c4p--add-select .bx--radio-button__appearance {
|
16753
|
+
margin: 0 var(--cds-spacing-05, 1rem) 0 0;
|
16754
|
+
}
|
16755
|
+
|
16710
16756
|
.c4p--add-select .bx--radio-button-wrapper .bx--radio-button__label {
|
16711
16757
|
justify-content: left;
|
16712
16758
|
}
|
@@ -16715,13 +16761,17 @@ a.bx--side-nav__link--current::before {
|
|
16715
16761
|
cursor: pointer;
|
16716
16762
|
}
|
16717
16763
|
|
16718
|
-
.bx--accordion__item:hover .c4p--add-select__sidebar-accordion-title button {
|
16764
|
+
.c4p--add-select .bx--accordion__item:hover .c4p--add-select__sidebar-accordion-title button {
|
16719
16765
|
opacity: 1;
|
16720
16766
|
}
|
16721
|
-
.bx--accordion__item .c4p--add-select__sidebar-accordion-title button {
|
16767
|
+
.c4p--add-select .bx--accordion__item .c4p--add-select__sidebar-accordion-title button {
|
16722
16768
|
opacity: 0;
|
16723
16769
|
}
|
16724
16770
|
|
16771
|
+
.c4p--add-select .bx--checkbox-label-text {
|
16772
|
+
padding-left: var(--cds-spacing-05, 1rem);
|
16773
|
+
}
|
16774
|
+
|
16725
16775
|
/* stylelint-disable-line no-invalid-position-at-import-rule */
|
16726
16776
|
/* stylelint-disable-line no-invalid-position-at-import-rule */
|
16727
16777
|
/* stylelint-disable-line no-invalid-position-at-import-rule */
|
@@ -22892,11 +22942,16 @@ a.bx--side-nav__link--current::before {
|
|
22892
22942
|
box-shadow: initial;
|
22893
22943
|
outline: initial;
|
22894
22944
|
}
|
22895
|
-
|
22896
|
-
|
22897
|
-
|
22945
|
+
@media (hover: hover) {
|
22946
|
+
.c4p--inline-edit .c4p--inline-edit__edit {
|
22947
|
+
opacity: 0;
|
22948
|
+
transition: opacity 70ms cubic-bezier(0, 0, 0.38, 0.9);
|
22949
|
+
}
|
22950
|
+
.c4p--inline-edit:hover .c4p--inline-edit__edit {
|
22951
|
+
opacity: 1;
|
22952
|
+
}
|
22898
22953
|
}
|
22899
|
-
.c4p--inline-edit
|
22954
|
+
.c4p--inline-edit .c4p--inline-edit__edit--always-visible {
|
22900
22955
|
opacity: 1;
|
22901
22956
|
}
|
22902
22957
|
.c4p--inline-edit .c4p--inline-edit__validation-icon {
|
@@ -22985,6 +23040,7 @@ a.bx--side-nav__link--current::before {
|
|
22985
23040
|
}
|
22986
23041
|
.c4p--data-spreadsheet .c4p--data-spreadsheet__active-cell--highlight {
|
22987
23042
|
position: absolute;
|
23043
|
+
z-index: 2;
|
22988
23044
|
border: var(--cds-spacing-01, 0.125rem) solid var(--cds-interactive-01, #0f62fe);
|
22989
23045
|
background-color: transparent;
|
22990
23046
|
}
|
@@ -22992,6 +23048,23 @@ a.bx--side-nav__link--current::before {
|
|
22992
23048
|
border: var(--cds-spacing-01, 0.125rem) solid var(--cds-interactive-01, #0f62fe);
|
22993
23049
|
outline: 0;
|
22994
23050
|
}
|
23051
|
+
.c4p--data-spreadsheet .c4p--data-spreadsheet__selection-area--element {
|
23052
|
+
position: absolute;
|
23053
|
+
z-index: 2;
|
23054
|
+
border: 1px solid var(--cds-interactive-01, #0f62fe);
|
23055
|
+
pointer-events: none;
|
23056
|
+
}
|
23057
|
+
.c4p--data-spreadsheet .c4p--data-spreadsheet__selection-area--element::before {
|
23058
|
+
position: absolute;
|
23059
|
+
top: 0;
|
23060
|
+
left: 0;
|
23061
|
+
display: block;
|
23062
|
+
width: 100%;
|
23063
|
+
height: 100%;
|
23064
|
+
background-color: var(--cds-interactive-01, #0f62fe);
|
23065
|
+
content: "";
|
23066
|
+
opacity: 0.25;
|
23067
|
+
}
|
22995
23068
|
|
22996
23069
|
/* stylelint-disable-line no-invalid-position-at-import-rule */
|
22997
23070
|
/* stylelint-disable-line no-invalid-position-at-import-rule */
|