@adaptabletools/adaptable-react-aggrid 12.1.8-canary.0 → 12.2.0-canary.1

package/base.css

@@ -1855,6 +1855,21 @@
   --ab-cmp-datepicker__font-size: var(--ab-font-size-2);
   --ab-cmp-datepicker__font-family: var(--ab__font-family);
   --ab-cmp-datepicker__cell-size: 30px; }
+:root {
+  --ab-cmp-toggle-button__background: #ccc;
+  --ab-cmp-toggle-button--active__background: var(--ab-color-success);
+  --ab-cmp-toggle-button__font-size: var(--ab-font-size-1);
+  --ab-cmp-toggle-button__color: var(--ab-color-text-on-primary);
+  --ab-cmp-toggle-button--checked__color: var(--ab-color-accentlight); }
+:root {
+  --ab-cmp-module-module-selector__tab-item__border: 1px solid var(--ab-color-primarydark);
+  --ab-cmp-module-module-selector__tab-item__border-radius: var(--ab__border-radius);
+  --ab-cmp-module-module-selector__tab-item__width: 160px;
+  --ab-cmp-module-module-selector__tab-item__header-input__color: var(--ab-color-text-on-primary);
+  --ab-cmp-module-module-selector__toolbar-item__border: 1px solid var(--ab-color-primary);
+  --ab-cmp-module-selector__unused-panel__border: 1px solid var(--ab-color-primarydark);
+  --ab-cmp-module-selector__unused-panel__border-radius: var(--ab__border-radius);
+  --ab-cmp-module-selector__unused-panel__background: var(--ab-color-defaultbackground); }
 :root {
   --ab-cmp-loader__background: var(--ab-color-primarydark);
   --ab-cmp-loader__border: var(--ab-color-text-on-primary);
@@ -1872,6 +1887,9 @@
   --ab-cmp-icon__fill: var(--ab-icon-fill);
   --ab-cmp-icon__height: 17px;
   --ab-cmp-icon__width: 17px; }
+:root {
+  --ab-cmp-listgroupitem__padding: var(--ab-space-2);
+  --ab-cmp-listgroupitem__margin: 0; }
 :root {
   --ab-cmp-wizard__padding: var(--ab-space-5);
   --ab-cmp-wizard__margin: var(--ab-space-1);
@@ -2189,11 +2207,18 @@
     color: var(--ab-cmp-dropdown__color) !important; }
 .ab-DropdownButton {
   position: relative;
+  overflow: visible;
+  outline: none;
   --ab-overlay-horizontal-align: left; }
 .ab-DropdownButton__list {
   text-align: start;
   padding: var(--ab-space-1) 0;
-  box-shadow: var(--ab-cmp-dropdownbutton-list__box-shadow); }
+  box-shadow: var(--ab-cmp-dropdownbutton-list__box-shadow);
+  overflow: auto;
+  border: var(--ab-cmp-dropdownbutton-list__border);
+  borderradius: var(--ab-cmp-dropdownbutton-list__border-radius);
+  zindex: var(--ab-cmp-dropdownbutton-list__z-index);
+  background: var(--ab-cmp-dropdownbutton-list__background); }
 .ab-DropdownButton__content {
   font-family: var(--ab__font-family);
   font-size: var(--ab-font-size-2);
@@ -2217,9 +2242,20 @@
 .ab-DropdownButton__separator td {
   border-bottom: var(--ab-cmp-dropdownbutton-list-separator__border); }
 .ab-EmptyContent {
-  text-align: center; }
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  font-size: var(--ab-font-size-3);
+  text-align: center;
+  padding: var(--ab-space-4); }
 .ab-EmptyContent p {
     color: var(--ab-color-text-on-primary); }
+.ab-EmptyContent__wrapper {
+  position: relative;
+  width: 100%;
+  height: 100%; }
 .ab-ErrorBox {
   padding: var(--ab-cmp-error-box__padding);
   border-radius: var(--ab-cmp-error-box__border-radius);
@@ -2790,12 +2826,6 @@ input[type='number'].ab-Input:hover::-webkit-inner-spin-button:active {
       display: none; }
 .ab-Datepicker-Overlay .rdp.rdp-with_weeknumber .rdp-row td:nth-child(8) {
       display: table-cell; }
-:root {
-  --ab-cmp-toggle-button__background: #ccc;
-  --ab-cmp-toggle-button--active__background: var(--ab-color-success);
-  --ab-cmp-toggle-button__font-size: var(--ab-font-size-1);
-  --ab-cmp-toggle-button__color: var(--ab-color-text-on-primary);
-  --ab-cmp-toggle-button--checked__color: var(--ab-color-accentlight); }
 .ab-ToggleButton {
   position: relative;
   display: inline-block;
@@ -2901,6 +2931,43 @@ input[type='number'].ab-Input:hover::-webkit-inner-spin-button:active {
   display: inline-flex;
   font-size: var(--ab-cmp-Tag__font-size);
   max-width: 100%; }
+.ab-ModuleSelector__TabItem {
+  display: flex;
+  flex-direction: column;
+  box-sizing: border-box;
+  margin-right: var(--ab-space-2);
+  width: var(--ab-cmp-module-module-selector__tab-item__width);
+  border: var(--ab-cmp-module-module-selector__tab-item__border);
+  border-radius: var(--ab-cmp-module-module-selector__tab-item__border-radius); }
+.ab-ModuleSelector__TabItem__header {
+  display: flex;
+  align-items: center;
+  padding: var(--ab-space-1);
+  border-bottom: var(--ab-cmp-module-module-selector__tab-item__border); }
+.ab-ModuleSelector__TabItem__header-input {
+  flex: 1;
+  width: 100%;
+  margin-left: var(--ab-space-1);
+  margin-right: var(--ab-space-1);
+  align-self: stretch;
+  background: transparent;
+  border: none;
+  color: var(--ab-cmp-module-module-selector__tab-item__header-input__color); }
+.ab-ModuleSelector__ToolbarList {
+  flex: 1;
+  padding: 4px;
+  padding-bottom: 0;
+  min-height: 200px; }
+.ab-ModuleSelector__ToolbarItem {
+  border: var(--ab-cmp-module-module-selector__toolbar-item__border);
+  padding-left: var(--ab-space-1);
+  margin-bottom: var(--ab-space-1); }
+.ab-ModuleSelector__UnusedPanel {
+  margin-bottom: var(--ab-space-2);
+  padding-bottom: var(--ab-space-1);
+  border: var(--ab-cmp-module-selector__unused-panel__border);
+  border-radius: var(--ab-cmp-module-selector__unused-panel__border-radius);
+  background-color: var(--ab-cmp-module-selector__unused-panel__background); }
 .ab-AdaptableOptions {
   background: var(--ab-cmp-adaptable-options__background-color); }
 .ab-GridOptions {
@@ -2916,6 +2983,9 @@ input[type='number'].ab-Input:hover::-webkit-inner-spin-button:active {
   background: var(--ab-cmp-listgroupitem--odd__background);
   color: var(--ab-cmp-listgroupitem--odd__color); }
 .ab-AdaptableObjectRow {
+  align-items: center;
+  padding: var(--ab-cmp-listgroupitem__padding);
+  margin: var(--ab-cmp-listgroupitem__margin);
   background: var(--ab-cmp-listgroupitem__background);
   color: var(--ab-cmp-listgroupitem__color);
   border-radius: var(--ab-cmp-listgroupitem__border-radius); }
@@ -2970,17 +3040,21 @@ html.ab--theme-dark .ab-ListBoxFilterForm--aggrid-style {
   left: 50%;
   bottom: -10px;
   transform: translate3d(-5px, 0px, 0px); }
-.ab-nocode-wizard {
+.ab-NocodeWizard {
   padding: var(--ab-cmp-wizard__padding);
   margin: var(--ab-cmp-wizard__margin);
   background: var(--ab-cmp-wizard__background);
   color: var(--ab-cmp-wizard__color);
   height: 100%; }
-.ab-nocode-wizard,
-  .ab-nocode-wizard *,
-  .ab-nocode-wizard *:before,
-  .ab-nocode-wizard *:after {
+.ab-NocodeWizard,
+  .ab-NocodeWizard *,
+  .ab-NocodeWizard *:before,
+  .ab-NocodeWizard *:after {
     box-sizing: border-box; }
+.ab-NocodeWizardFormBox {
+  border: 1px solid var(--ab-color-primarydark);
+  border-radius: var(--ab__border-radius);
+  background-color: var(--ab-color-defaultbackground); }
 .ab-AvailableDropZone .placeholder,
 .ab-SelectedDropZone .placeholder {
   width: 100%; }
@@ -3089,18 +3163,20 @@ html.ab--theme-dark .ab-ListBoxFilterForm--aggrid-style {
 .ab-Adaptable-Popup--settings-popup .ab-Adaptable-Popup__Body {
     padding: var(--ab-cmp-adaptable-popup--settings__padding);
     min-width: 0; }
+.ab-Adaptable-Popup__Panel {
+  width: 100%; }
 .ab-Adaptable-Popup__Panel__Header {
-  display: flex;
-  padding: 0 var(--ab-cmp-adaptable-popup-panel__padding);
-  margin-bottom: var(--ab-cmp-adaptable-popup-panel__margin-bottom);
-  margin-top: var(--ab-cmp-adaptable-popup-panel__margin-top); }
+    display: flex;
+    padding: 0 var(--ab-cmp-adaptable-popup-panel__padding);
+    margin-bottom: var(--ab-cmp-adaptable-popup-panel__margin-bottom);
+    margin-top: var(--ab-cmp-adaptable-popup-panel__margin-top); }
 .ab-Adaptable-Popup__Panel__Header__Title {
-    font-size: var(--ab-cmp-adaptable-popup-panel-title__font-size); }
+      font-size: var(--ab-cmp-adaptable-popup-panel-title__font-size); }
 .ab-Adaptable-Popup__Panel__Body {
-  padding: var(--ab-cmp-adaptable-popup-panel-body__padding);
-  flex: 1 1 0;
-  min-height: 0;
-  overflow: auto; }
+    padding: var(--ab-cmp-adaptable-popup-panel-body__padding);
+    flex: 1 1 0;
+    min-height: 0;
+    overflow: auto; }
 .ab-Adaptable-Popup--window .ab-Adaptable-Popup__TopBar {
   cursor: move; }
 .ab-Adaptable-Popup--window.ab-Adaptable-Popup--action-popup .ab-Panel__header {
@@ -3200,6 +3276,24 @@ button.ab-StatusBar__SubPanel:hover {
   --ab-cmp-adaptable-permitted-values-selector__border: 1px solid var(--ab-color-primarydark);
   --ab-cmp-adaptable-permitted-values-selector__background-color: var(--ab-color-defaultbackground);
   --ab-cmp-adaptable-permitted-values-selector__padding: var(--ab-space-1); }
+.ab-ValueSelector {
+  overflow: hidden; }
+.ab-ValueSelector__option {
+    border-radius: 'var(--ab__border-radius)'; }
+.ab-ValueSelector__show-selected-only-checkbox {
+    position: sticky;
+    top: 0;
+    z-index: 10000; }
+.ab-ValueSelector__show-selected-only-checkbox__text {
+    position: absolute;
+    top: 2px;
+    right: 4px;
+    overflow: hidden;
+    border-radius: var(--ab__border-radius);
+    margin-right: var(--ab-space-1);
+    margin-top: var(--ab-space-1);
+    padding: 0 var(--ab-space-2);
+    font-size: var(--ab-font-size-2); }
 .ab-alert--error {
   background: var(--ab-color-error); }
 .ab-alert--success {

package/index.css

@@ -2544,6 +2544,23 @@ template {
   --ab-cmp-datepicker__font-family: var(--ab__font-family);
   --ab-cmp-datepicker__cell-size: 30px; }
 
+:root {
+  --ab-cmp-toggle-button__background: #ccc;
+  --ab-cmp-toggle-button--active__background: var(--ab-color-success);
+  --ab-cmp-toggle-button__font-size: var(--ab-font-size-1);
+  --ab-cmp-toggle-button__color: var(--ab-color-text-on-primary);
+  --ab-cmp-toggle-button--checked__color: var(--ab-color-accentlight); }
+
+:root {
+  --ab-cmp-module-module-selector__tab-item__border: 1px solid var(--ab-color-primarydark);
+  --ab-cmp-module-module-selector__tab-item__border-radius: var(--ab__border-radius);
+  --ab-cmp-module-module-selector__tab-item__width: 160px;
+  --ab-cmp-module-module-selector__tab-item__header-input__color: var(--ab-color-text-on-primary);
+  --ab-cmp-module-module-selector__toolbar-item__border: 1px solid var(--ab-color-primary);
+  --ab-cmp-module-selector__unused-panel__border: 1px solid var(--ab-color-primarydark);
+  --ab-cmp-module-selector__unused-panel__border-radius: var(--ab__border-radius);
+  --ab-cmp-module-selector__unused-panel__background: var(--ab-color-defaultbackground); }
+
 :root {
   --ab-cmp-loader__background: var(--ab-color-primarydark);
   --ab-cmp-loader__border: var(--ab-color-text-on-primary);
@@ -2564,6 +2581,10 @@ template {
   --ab-cmp-icon__height: 17px;
   --ab-cmp-icon__width: 17px; }
 
+:root {
+  --ab-cmp-listgroupitem__padding: var(--ab-space-2);
+  --ab-cmp-listgroupitem__margin: 0; }
+
 :root {
   --ab-cmp-wizard__padding: var(--ab-space-5);
   --ab-cmp-wizard__margin: var(--ab-space-1);
@@ -2934,12 +2955,19 @@ template {
 
 .ab-DropdownButton {
   position: relative;
+  overflow: visible;
+  outline: none;
   --ab-overlay-horizontal-align: left; }
 
 .ab-DropdownButton__list {
   text-align: start;
   padding: var(--ab-space-1) 0;
-  box-shadow: var(--ab-cmp-dropdownbutton-list__box-shadow); }
+  box-shadow: var(--ab-cmp-dropdownbutton-list__box-shadow);
+  overflow: auto;
+  border: var(--ab-cmp-dropdownbutton-list__border);
+  borderradius: var(--ab-cmp-dropdownbutton-list__border-radius);
+  zindex: var(--ab-cmp-dropdownbutton-list__z-index);
+  background: var(--ab-cmp-dropdownbutton-list__background); }
 
 .ab-DropdownButton__content {
   font-family: var(--ab__font-family);
@@ -2971,11 +2999,23 @@ template {
   border-bottom: var(--ab-cmp-dropdownbutton-list-separator__border); }
 
 .ab-EmptyContent {
-  text-align: center; }
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  font-size: var(--ab-font-size-3);
+  text-align: center;
+  padding: var(--ab-space-4); }
 
 .ab-EmptyContent p {
     color: var(--ab-color-text-on-primary); }
 
+.ab-EmptyContent__wrapper {
+  position: relative;
+  width: 100%;
+  height: 100%; }
+
 .ab-ErrorBox {
   padding: var(--ab-cmp-error-box__padding);
   border-radius: var(--ab-cmp-error-box__border-radius);
@@ -3692,13 +3732,6 @@ input[type='number'].ab-Input:hover::-webkit-inner-spin-button:active {
 .ab-Datepicker-Overlay .rdp.rdp-with_weeknumber .rdp-row td:nth-child(8) {
       display: table-cell; }
 
-:root {
-  --ab-cmp-toggle-button__background: #ccc;
-  --ab-cmp-toggle-button--active__background: var(--ab-color-success);
-  --ab-cmp-toggle-button__font-size: var(--ab-font-size-1);
-  --ab-cmp-toggle-button__color: var(--ab-color-text-on-primary);
-  --ab-cmp-toggle-button--checked__color: var(--ab-color-accentlight); }
-
 .ab-ToggleButton {
   position: relative;
   display: inline-block;
@@ -3825,6 +3858,49 @@ input[type='number'].ab-Input:hover::-webkit-inner-spin-button:active {
   font-size: var(--ab-cmp-Tag__font-size);
   max-width: 100%; }
 
+.ab-ModuleSelector__TabItem {
+  display: flex;
+  flex-direction: column;
+  box-sizing: border-box;
+  margin-right: var(--ab-space-2);
+  width: var(--ab-cmp-module-module-selector__tab-item__width);
+  border: var(--ab-cmp-module-module-selector__tab-item__border);
+  border-radius: var(--ab-cmp-module-module-selector__tab-item__border-radius); }
+
+.ab-ModuleSelector__TabItem__header {
+  display: flex;
+  align-items: center;
+  padding: var(--ab-space-1);
+  border-bottom: var(--ab-cmp-module-module-selector__tab-item__border); }
+
+.ab-ModuleSelector__TabItem__header-input {
+  flex: 1;
+  width: 100%;
+  margin-left: var(--ab-space-1);
+  margin-right: var(--ab-space-1);
+  align-self: stretch;
+  background: transparent;
+  border: none;
+  color: var(--ab-cmp-module-module-selector__tab-item__header-input__color); }
+
+.ab-ModuleSelector__ToolbarList {
+  flex: 1;
+  padding: 4px;
+  padding-bottom: 0;
+  min-height: 200px; }
+
+.ab-ModuleSelector__ToolbarItem {
+  border: var(--ab-cmp-module-module-selector__toolbar-item__border);
+  padding-left: var(--ab-space-1);
+  margin-bottom: var(--ab-space-1); }
+
+.ab-ModuleSelector__UnusedPanel {
+  margin-bottom: var(--ab-space-2);
+  padding-bottom: var(--ab-space-1);
+  border: var(--ab-cmp-module-selector__unused-panel__border);
+  border-radius: var(--ab-cmp-module-selector__unused-panel__border-radius);
+  background-color: var(--ab-cmp-module-selector__unused-panel__background); }
+
 .ab-AdaptableOptions {
   background: var(--ab-cmp-adaptable-options__background-color); }
 
@@ -3846,6 +3922,9 @@ input[type='number'].ab-Input:hover::-webkit-inner-spin-button:active {
   color: var(--ab-cmp-listgroupitem--odd__color); }
 
 .ab-AdaptableObjectRow {
+  align-items: center;
+  padding: var(--ab-cmp-listgroupitem__padding);
+  margin: var(--ab-cmp-listgroupitem__margin);
   background: var(--ab-cmp-listgroupitem__background);
   color: var(--ab-cmp-listgroupitem__color);
   border-radius: var(--ab-cmp-listgroupitem__border-radius); }
@@ -3912,19 +3991,24 @@ html.ab--theme-dark .ab-ListBoxFilterForm--aggrid-style {
   bottom: -10px;
   transform: translate3d(-5px, 0px, 0px); }
 
-.ab-nocode-wizard {
+.ab-NocodeWizard {
   padding: var(--ab-cmp-wizard__padding);
   margin: var(--ab-cmp-wizard__margin);
   background: var(--ab-cmp-wizard__background);
   color: var(--ab-cmp-wizard__color);
   height: 100%; }
 
-.ab-nocode-wizard,
-  .ab-nocode-wizard *,
-  .ab-nocode-wizard *:before,
-  .ab-nocode-wizard *:after {
+.ab-NocodeWizard,
+  .ab-NocodeWizard *,
+  .ab-NocodeWizard *:before,
+  .ab-NocodeWizard *:after {
     box-sizing: border-box; }
 
+.ab-NocodeWizardFormBox {
+  border: 1px solid var(--ab-color-primarydark);
+  border-radius: var(--ab__border-radius);
+  background-color: var(--ab-color-defaultbackground); }
+
 .ab-AvailableDropZone .placeholder,
 .ab-SelectedDropZone .placeholder {
   width: 100%; }
@@ -4065,20 +4149,23 @@ html.ab--theme-dark .ab-ListBoxFilterForm--aggrid-style {
     padding: var(--ab-cmp-adaptable-popup--settings__padding);
     min-width: 0; }
 
+.ab-Adaptable-Popup__Panel {
+  width: 100%; }
+
 .ab-Adaptable-Popup__Panel__Header {
-  display: flex;
-  padding: 0 var(--ab-cmp-adaptable-popup-panel__padding);
-  margin-bottom: var(--ab-cmp-adaptable-popup-panel__margin-bottom);
-  margin-top: var(--ab-cmp-adaptable-popup-panel__margin-top); }
+    display: flex;
+    padding: 0 var(--ab-cmp-adaptable-popup-panel__padding);
+    margin-bottom: var(--ab-cmp-adaptable-popup-panel__margin-bottom);
+    margin-top: var(--ab-cmp-adaptable-popup-panel__margin-top); }
 
 .ab-Adaptable-Popup__Panel__Header__Title {
-    font-size: var(--ab-cmp-adaptable-popup-panel-title__font-size); }
+      font-size: var(--ab-cmp-adaptable-popup-panel-title__font-size); }
 
 .ab-Adaptable-Popup__Panel__Body {
-  padding: var(--ab-cmp-adaptable-popup-panel-body__padding);
-  flex: 1 1 0;
-  min-height: 0;
-  overflow: auto; }
+    padding: var(--ab-cmp-adaptable-popup-panel-body__padding);
+    flex: 1 1 0;
+    min-height: 0;
+    overflow: auto; }
 
 .ab-Adaptable-Popup--window .ab-Adaptable-Popup__TopBar {
   cursor: move; }
@@ -4211,6 +4298,28 @@ button.ab-StatusBar__SubPanel:hover {
   --ab-cmp-adaptable-permitted-values-selector__background-color: var(--ab-color-defaultbackground);
   --ab-cmp-adaptable-permitted-values-selector__padding: var(--ab-space-1); }
 
+.ab-ValueSelector {
+  overflow: hidden; }
+
+.ab-ValueSelector__option {
+    border-radius: 'var(--ab__border-radius)'; }
+
+.ab-ValueSelector__show-selected-only-checkbox {
+    position: sticky;
+    top: 0;
+    z-index: 10000; }
+
+.ab-ValueSelector__show-selected-only-checkbox__text {
+    position: absolute;
+    top: 2px;
+    right: 4px;
+    overflow: hidden;
+    border-radius: var(--ab__border-radius);
+    margin-right: var(--ab-space-1);
+    margin-top: var(--ab-space-1);
+    padding: 0 var(--ab-space-2);
+    font-size: var(--ab-font-size-2); }
+
 .ab-alert--error {
   background: var(--ab-color-error); }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adaptabletools/adaptable-react-aggrid",
-  "version": "12.1.8-canary.0",
+  "version": "12.2.0-canary.1",
   "description": "React version of AdapTable - the powerful AG Grid add-on that provides all the rich functionality that advanced users expect from their DataGrids and Data Tables",
   "keywords": [],
   "license": "contact sales@adaptabletools.com for details",
@@ -19,7 +19,7 @@
   },
   "dependencies": {
     "tslib": "^2.0.0",
-    "@adaptabletools/adaptable": "12.1.8-canary.0"
+    "@adaptabletools/adaptable": "12.2.0-canary.1"
   },
   "peerDependencies": {
     "@ag-grid-community/all-modules": ">=27.3.0",