@carbon/ibm-products 2.0.0-rc.10 → 2.0.0-rc.11

Sign up to get free protection for your applications and to get access to all the features.
Files changed (68) hide show
  1. package/css/index-full-carbon.css +102 -1
  2. package/css/index-full-carbon.css.map +1 -1
  3. package/css/index-full-carbon.min.css +2 -2
  4. package/css/index-full-carbon.min.css.map +1 -1
  5. package/css/index-without-carbon.css +102 -1
  6. package/css/index-without-carbon.css.map +1 -1
  7. package/css/index-without-carbon.min.css +2 -2
  8. package/css/index-without-carbon.min.css.map +1 -1
  9. package/css/index.css +93 -1
  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/DataSpreadsheet/DataSpreadsheet.js +1 -4
  14. package/es/components/DataSpreadsheet/utils/handleCellDeletion.js +6 -4
  15. package/es/components/Datagrid/Datagrid/Datagrid.js +7 -3
  16. package/es/components/Datagrid/Datagrid/DatagridContent.js +8 -3
  17. package/es/components/Datagrid/Datagrid/DatagridEmptyBody.js +17 -4
  18. package/es/components/Datagrid/Datagrid/DatagridRow.js +2 -10
  19. package/es/components/Datagrid/Datagrid/DatagridToolbar.js +22 -4
  20. package/es/components/Datagrid/Datagrid/DatagridVirtualBody.js +29 -8
  21. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +424 -0
  22. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterProvider.js +83 -0
  23. package/es/components/Datagrid/Datagrid/addons/Filtering/constants.js +20 -0
  24. package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useInitialStateFromFilters.js +22 -0
  25. package/es/components/Datagrid/Datagrid/addons/Filtering/index.js +7 -0
  26. package/es/components/Datagrid/Datagrid/addons/Filtering/utils.js +38 -0
  27. package/es/components/Datagrid/index.js +2 -1
  28. package/es/components/Datagrid/useFiltering.js +90 -0
  29. package/es/components/Datagrid/useParentDimensions.js +3 -1
  30. package/es/components/Datagrid/utils/DatagridActions.js +13 -26
  31. package/es/components/Datagrid/utils/getArgTypes.js +5 -0
  32. package/es/components/Datagrid/utils/getInlineEditColumns.js +6 -1
  33. package/es/components/Datagrid/utils/makeData.js +24 -16
  34. package/es/components/FilterSummary/FilterSummary.js +54 -0
  35. package/es/components/FilterSummary/index.js +7 -0
  36. package/lib/components/DataSpreadsheet/DataSpreadsheet.js +1 -4
  37. package/lib/components/DataSpreadsheet/utils/handleCellDeletion.js +6 -4
  38. package/lib/components/Datagrid/Datagrid/Datagrid.js +8 -3
  39. package/lib/components/Datagrid/Datagrid/DatagridContent.js +8 -3
  40. package/lib/components/Datagrid/Datagrid/DatagridEmptyBody.js +17 -4
  41. package/lib/components/Datagrid/Datagrid/DatagridRow.js +2 -19
  42. package/lib/components/Datagrid/Datagrid/DatagridToolbar.js +24 -3
  43. package/lib/components/Datagrid/Datagrid/DatagridVirtualBody.js +31 -8
  44. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +443 -0
  45. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterProvider.js +104 -0
  46. package/lib/components/Datagrid/Datagrid/addons/Filtering/constants.js +35 -0
  47. package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useInitialStateFromFilters.js +33 -0
  48. package/lib/components/Datagrid/Datagrid/addons/Filtering/index.js +15 -0
  49. package/lib/components/Datagrid/Datagrid/addons/Filtering/utils.js +47 -0
  50. package/lib/components/Datagrid/index.js +9 -1
  51. package/lib/components/Datagrid/useFiltering.js +94 -0
  52. package/lib/components/Datagrid/useParentDimensions.js +3 -1
  53. package/lib/components/Datagrid/utils/DatagridActions.js +13 -25
  54. package/lib/components/Datagrid/utils/getArgTypes.js +5 -0
  55. package/lib/components/Datagrid/utils/getInlineEditColumns.js +6 -1
  56. package/lib/components/Datagrid/utils/makeData.js +26 -18
  57. package/lib/components/FilterSummary/FilterSummary.js +72 -0
  58. package/lib/components/FilterSummary/index.js +15 -0
  59. package/package.json +2 -2
  60. package/scss/components/Datagrid/_datagrid.scss +0 -1
  61. package/scss/components/Datagrid/_storybook-styles.scss +12 -0
  62. package/scss/components/Datagrid/styles/_datagrid.scss +18 -0
  63. package/scss/components/Datagrid/styles/_index.scss +1 -0
  64. package/scss/components/Datagrid/styles/addons/_FilterFlyout.scss +87 -0
  65. package/scss/components/FilterSummary/_filter-summary.scss +20 -0
  66. package/scss/components/FilterSummary/_index.scss +10 -0
  67. package/scss/components/FilterSummary/_storybook-styles.scss +14 -0
  68. package/scss/components/_index.scss +1 -0
@@ -4078,6 +4078,15 @@
4078
4078
  letter-spacing: var(--cds-productive-heading-03-letter-spacing, 0);
4079
4079
  }
4080
4080
 
4081
+ .c4p--filter-summary {
4082
+ display: flex;
4083
+ width: 100%;
4084
+ align-items: center;
4085
+ padding: 0.5rem;
4086
+ border-top: 1px solid var(--cds-border-subtle-01, #e0e0e0);
4087
+ background: var(--cds-layer-01, #f4f4f4);
4088
+ }
4089
+
4081
4090
  .c4p--http-errors .c4p--http-errors__content {
4082
4091
  position: fixed;
4083
4092
  z-index: 2;
@@ -10681,6 +10690,7 @@ button.c4p--add-select__global-filter-toggle--open {
10681
10690
 
10682
10691
  .c4p--datagrid .cds--data-table--selected:not(.c4p--datagrid__active-row)::before {
10683
10692
  position: absolute;
10693
+ top: 0;
10684
10694
  left: 0;
10685
10695
  width: 0.25rem;
10686
10696
  height: 100%;
@@ -10730,6 +10740,23 @@ button.c4p--add-select__global-filter-toggle--open {
10730
10740
  justify-content: center;
10731
10741
  }
10732
10742
 
10743
+ .c4p--datagrid__virtual-scrollbar::-webkit-scrollbar {
10744
+ width: 10px;
10745
+ height: 7px;
10746
+ }
10747
+
10748
+ .c4p--datagrid__virtual-scrollbar::-webkit-scrollbar-track {
10749
+ background: var(--cds-layer);
10750
+ }
10751
+
10752
+ .c4p--datagrid__virtual-scrollbar::-webkit-scrollbar-thumb {
10753
+ border-radius: 5px;
10754
+ }
10755
+
10756
+ .c4p--datagrid__virtualScrollContainer {
10757
+ width: 100%;
10758
+ }
10759
+
10733
10760
  .cds--body--with-modal-open .c4p--datagrid__grid-container {
10734
10761
  overflow: hidden;
10735
10762
  height: 100vh;
@@ -11125,6 +11152,81 @@ button.c4p--add-select__global-filter-toggle--open {
11125
11152
  left: -4px;
11126
11153
  }
11127
11154
 
11155
+ /*
11156
+ * Licensed Materials - Property of IBM
11157
+ * 5724-Q36
11158
+ * (c) Copyright IBM Corp. 2022
11159
+ * US Government Users Restricted Rights - Use, duplication or disclosure
11160
+ * restricted by GSA ADP Schedule Contract with IBM Corp.
11161
+ */
11162
+ .c4p--datagrid-filter-flyout__container {
11163
+ position: relative;
11164
+ }
11165
+
11166
+ .c4p--datagrid-filter-flyout {
11167
+ position: absolute;
11168
+ top: 3rem;
11169
+ right: 0;
11170
+ display: none;
11171
+ width: 40.125rem;
11172
+ background-color: var(--cds-layer-02, #ffffff);
11173
+ box-shadow: 0 1px 0.5rem 0 rgba(0, 0, 0, 0.25);
11174
+ }
11175
+
11176
+ .c4p--datagrid-filter-flyout--open {
11177
+ display: grid;
11178
+ }
11179
+
11180
+ .c4p--datagrid-filter-flyout--batch {
11181
+ min-height: 21.625rem;
11182
+ grid-template-rows: 1fr 3rem;
11183
+ }
11184
+
11185
+ .c4p--datagrid-filter-flyout--instant {
11186
+ min-height: 17.625rem;
11187
+ grid-template-rows: 1fr;
11188
+ }
11189
+
11190
+ .c4p--datagrid-filter-flyout__inner-container {
11191
+ padding: 1rem 1rem 3rem 1rem;
11192
+ }
11193
+
11194
+ .c4p--datagrid-filter-flyout__inner-container::before {
11195
+ position: absolute;
11196
+ top: -0.4375rem;
11197
+ right: 1px;
11198
+ display: block;
11199
+ width: 2.875rem;
11200
+ height: 0.9375rem;
11201
+ background-color: var(--cds-layer-02, #ffffff);
11202
+ content: "";
11203
+ }
11204
+
11205
+ .c4p--datagrid-filter-flyout__title {
11206
+ display: block;
11207
+ font-size: var(--cds-heading-compact-01-font-size, 0.875rem);
11208
+ font-weight: var(--cds-heading-compact-01-font-weight, 600);
11209
+ line-height: var(--cds-heading-compact-01-line-height, 1.28572);
11210
+ letter-spacing: var(--cds-heading-compact-01-letter-spacing, 0.16px);
11211
+ margin-bottom: 1.5rem;
11212
+ }
11213
+
11214
+ .c4p--datagrid-filter-flyout__filters {
11215
+ display: grid;
11216
+ gap: 1rem 2rem;
11217
+ grid-template-columns: 1fr 1fr;
11218
+ }
11219
+
11220
+ .c4p--datagrid-filter-flyout__trigger--open.cds--btn.cds--btn--icon-only {
11221
+ position: relative;
11222
+ background-color: var(--cds-layer-02, #ffffff);
11223
+ box-shadow: 0 1px 0.5rem 0 rgba(0, 0, 0, 0.25);
11224
+ }
11225
+
11226
+ .c4p--datagrid-filter-flyout .cds--fieldset {
11227
+ margin-bottom: 0;
11228
+ }
11229
+
11128
11230
  /*
11129
11231
  * Licensed Materials - Property of IBM
11130
11232
  * 5724-Q36
@@ -11661,7 +11763,6 @@ svg.c4p--datagrid__draggable-handleStyle.disable {
11661
11763
 
11662
11764
  .c4p--datagrid__datagridWrap-simple {
11663
11765
  display: flex;
11664
- overflow: hidden;
11665
11766
  width: 100%;
11666
11767
  height: 100%;
11667
11768
  flex-direction: column;