@refinitiv-ui/efx-grid 0.0.0-dev.12023565035.1

package/lib/grid/themes/base.less

@@ -0,0 +1,137 @@
+
+:host {
+	--grid-header-height                            : @grid-header-height;
+	--grid-row-height                               : @grid-row-height;
+	--grid-guideline-color                          : @scheme-color-primary;
+	--theme-name                                    : @theme-name;
+
+	.grid-vscroll, .grid-hscroll {
+		// .ie-scrollbars();
+		.mozilla-scrollbars();
+	}
+
+	// More custom theme that has to be done via css selector
+	.cell input,
+	.cell textarea,
+	.cell select,
+	.cell button,
+	ef-checkbox,
+	input[type=checkbox] {
+	  margin: 0;
+	}
+	select, button, input[type=text] { // Todo: force every thing in cells to have max size not exceed row height.
+	  max-height: calc(var(--grid-row-height) - 6px);
+	}
+	select {
+	  width: 100%;
+	}
+	.cell button {
+	  min-width: unset;
+	}
+  
+	.title input[type=search] {
+	  width: 100%;
+	  background-color: @grid-row-background-color;
+	  max-height: calc(var(--grid-row-height) - 6px);
+	}
+  
+	.grid-pane, .cell, .editing, .sorting, .filter-input, .folder {
+	  .touch-action();
+	}
+	.tr-lg .cell {
+	  // for ie
+	  padding: @grid-cell-padding;
+	  // for modern browser
+	  padding: var(--grid-cell-padding, @grid-cell-padding);
+	}
+  
+	// Sorted column text color
+	.tr-grid .title .sorting,
+	.tr-grid .title .sorting:hover,
+	.tr-grid .title .cell.sorting:hover {
+	  color: @grid-row-active-text-color;
+	}
+  
+	// grid-theme
+	
+	--global-focus-bordercolor       : @grid-row-focus-border-color;
+  
+	--scrollbar-bgcolor              : @scrollbar-track-background-color;
+  
+	--button-txtcolor                : @button-text-color;
+	--button-border-color            : @button-border-color;
+	--button-bgcolor                 : @button-background-color;
+	--button-bgoverlay-1             : transparent;
+	--button-bgoverlay-2             : transparent;
+	--button-hover-txtcolor          : @button-hover-text-color;
+	--button-hover-bgcolor           : @button-hover-background-color;
+  
+	--input-txtcolor                 : @input-text-color;
+	--input-selection-txtcolor       : @global-text-selection-color;
+	--input-selection-bgcolor        : @global-text-selection-background;
+  
+	--grid-bordercolor               : @grid-border-color;
+  
+	// Column title
+	--grid-title-bgcolor             : @grid-header-background-color;
+	--grid-title-txtcolor            : @grid-header-text-color;
+	--grid-title-hover-txtcolor      : @grid-header-text-color;
+	--grid-title-sort-icon-color     : @scheme-color-secondary;
+  
+	// Row group header
+	--grid-header-bgcolor            : @grid-header-background-color;
+	--grid-header-txtcolor           : @grid-header-text-color;
+	
+	// Column collapsing
+	--grid-column-grouped-bgcolor    : @grid-header-background-color;
+  
+	// Intentionally use invalidColor cause we need css to malformat
+	// And then no border rendered cause css malformat
+	--grid-column-active-border-color: @grid-column-active-border-color; // invalid color
+  
+	--grid-row-txtcolor              : @grid-row-text-color;
+	--grid-row-bgcolor               : @grid-row-background-color;
+	--grid-alt-row-bgcolor           : @grid-row-alternate-background-color;
+  
+	--grid-active-txtcolor           : @grid-row-active-text-color;
+	--grid-active-bordercolor        : @grid-row-focus-border-color;
+	--grid-active-bgcolor            : @input-background-color;
+  
+	--grid-highlight-txtcolor        : @grid-row-hover-text-color;
+	--grid-highlight-bgcolor         : @grid-row-hover-background-color;
+  
+	--grid-selection-bgcolor         : @grid-row-active-background-color;
+  
+	--grid-guideline-bgcolor         : @scheme-color-primary;
+	--grid-dragbox-bordercolor       : @control-border-color;
+	--grid-column-separator-bgcolor  : @grid-border-color;
+  
+  
+	// cgrid-theme
+  
+	--global-txtcolor                : @grid-row-text-color;
+	--global-hover-txtcolor          : @grid-row-hover-text-color;
+	--global-active-txtcolor         : @grid-row-active-text-color;
+	--global-bordercolor             : @grid-border-color;
+  
+	--field-bgcolor-a                : @grid-row-background-color;
+	--field-txtcolor-a               : @grid-row-text-color;
+  
+	// Popup
+	--popup-boxshadow                : 0 0 10px fade(@dataviz-color-black, 50%);
+	--popup-overlay-modal-bgcolor    : fade(@dataviz-color-black, 50%);
+  
+	// List
+	--list-item-separator-bordercolor: @separator-color;
+	--list-item-hover-bgcolor        : @grid-row-hover-background-color;
+	--list-matched-txtcolor          : @scheme-color-primary;
+  
+	// Pager UI
+	--pager-ui-bgcolor               : @grid-header-background-color;
+  
+	// Loading mask
+	--loading-mask-color             : @overlay-background-color;
+}
+  
+.webkit-scrollbars();
+  

package/lib/grid/themes/ds/dark/efx-grid.js

@@ -0,0 +1,4 @@
+import './imports/native-elements.js';
+
+
+dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'efx-grid', styles: 'select{-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;font-size:12px;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-block;position:relative;vertical-align:middle;background:#141e29;color:#c0cadb;border:1px solid #75808c}select:focus{background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#6d84ff}button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:4px;background-color:#232d38;color:#fff;border:1px solid #424c58;height:24px;box-shadow:0 0 0 0 rgba(20,30,41,.08);padding:0 12px;outline:0;font-family:inherit;font-size:12px;font-weight:400;min-width:60px;margin:1px 0;transition:120ms;text-align:center;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;vertical-align:bottom;position:relative;overflow:hidden}button[cta]{background-color:#6d84ff;color:#141e29;border-color:transparent;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}button[toggles]{background-color:#232d38;color:#fff;border-color:#424c58;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}button[toggles][active]{background-color:#fff;color:#141e29;border-color:transparent;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}textarea{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;color:#c0cadb;border-radius:0;background-color:#141e29;text-overflow:ellipsis;border:1px solid #75808c;resize:none;line-height:1.2;padding:calc((24px - 1px * 2 - 1em * 1.2)/ 2) 8px}textarea[disabled]{color:rgba(192,202,219,.5);border:1px solid rgba(117,128,140,.5)}textarea[type=number]{padding-right:0}textarea[warning]{border:1px solid #ffbe42}textarea[warning][disabled]{color:rgba(192,202,219,.5);border:1px solid rgba(255,190,66,.5)}textarea[error],textarea[error][warning]{border:1px solid #ff5540}textarea[error][disabled],textarea[error][warning][disabled]{color:rgba(192,202,219,.5);border:1px solid rgba(255,85,64,.5)}textarea ::-ms-clear{display:none}textarea[cols]{width:auto}textarea[rows]{height:auto}textarea:focus{background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#6d84ff}a{text-decoration:none;color:#bdc6ff}a:active{color:#b0b8ed}a:focus{outline:0}a:hover{text-decoration:underline;text-decoration-color:#6d84ff;color:#8ea0ff;text-decoration-color:#8ea0ff}a:visited,a[alt]:visited{color:#424c58}a[alt]{color:#bdc6ff}a[alt]:hover{color:#8ea0ff}input{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0;font-weight:400;text-align:left}input::-webkit-clear-button,input::-webkit-inner-spin-button,input::-webkit-search-cancel-button,input::-webkit-search-decoration{-webkit-appearance:none}input[type=button],input[type=submit]{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:4px;background-color:#232d38;color:#fff;border:1px solid #424c58;height:24px;box-shadow:0 0 0 0 rgba(20,30,41,.08);padding:0 12px;outline:0;font-family:inherit;font-size:12px;font-weight:400;min-width:60px;margin:1px 0;transition:120ms;text-align:center;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;vertical-align:bottom;position:relative;overflow:hidden}input[type=button][cta],input[type=submit][cta]{background-color:#6d84ff;color:#141e29;border-color:transparent;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}input[type=button][toggles],input[type=submit][toggles]{background-color:#232d38;color:#fff;border-color:#424c58;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}input[type=button][toggles][active],input[type=submit][toggles][active]{background-color:#fff;color:#141e29;border-color:transparent;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}@media (-ms-high-contrast:none),(pointer:fine){button:focus:not([focused]),button[cta]:focus:not([focused]),button[cta][focused=visible],button[focused=visible],button[toggles]:focus:not([focused]),button[toggles][active]:focus:not([focused]),button[toggles][active][focused=visible],button[toggles][focused=visible],input[type=button]:focus:not([focused]),input[type=button][cta]:focus:not([focused]),input[type=button][cta][focused=visible],input[type=button][focused=visible],input[type=button][toggles]:focus:not([focused]),input[type=button][toggles][active]:focus:not([focused]),input[type=button][toggles][active][focused=visible],input[type=button][toggles][focused=visible],input[type=submit]:focus:not([focused]),input[type=submit][cta]:focus:not([focused]),input[type=submit][cta][focused=visible],input[type=submit][focused=visible],input[type=submit][toggles]:focus:not([focused]),input[type=submit][toggles][active]:focus:not([focused]),input[type=submit][toggles][active][focused=visible],input[type=submit][toggles][focused=visible]{background-color:#232d38;color:#fff;box-shadow:0 0 0 2px #141e29,0 0 0 4px #5572ff;border-color:#424c58;outline:0}button:hover,button[cta]:hover,button[toggles]:hover,button[toggles][active]:hover,input[type=button]:hover,input[type=button][cta]:hover,input[type=button][toggles]:hover,input[type=button][toggles][active]:hover,input[type=submit]:hover,input[type=submit][cta]:hover,input[type=submit][toggles]:hover,input[type=submit][toggles][active]:hover{background-color:#323c48;color:#fff;box-shadow:0 0 0 0 rgba(20,30,41,.08)}button:hover:not(:focus),button[cta]:hover:not(:focus),button[toggles]:hover:not(:focus),button[toggles][active]:hover:not(:focus),input[type=button]:hover:not(:focus),input[type=button][cta]:hover:not(:focus),input[type=button][toggles]:hover:not(:focus),input[type=button][toggles][active]:hover:not(:focus),input[type=submit]:hover:not(:focus),input[type=submit][cta]:hover:not(:focus),input[type=submit][toggles]:hover:not(:focus),input[type=submit][toggles][active]:hover:not(:focus){border-color:#646e7b;outline:0}}@media all{button:active,button[cta]:active,button[toggles]:active,button[toggles][active]:active,input[type=button]:active,input[type=button][cta]:active,input[type=button][toggles]:active,input[type=button][toggles][active]:active,input[type=submit]:active,input[type=submit][cta]:active,input[type=submit][toggles]:active,input[type=submit][toggles][active]:active{background-color:rgba(0,0,0,0);color:#fff;box-shadow:0 0 0 0 rgba(20,30,41,.08)}button:active:not(:focus),button[cta]:active:not(:focus),button[toggles]:active:not(:focus),button[toggles][active]:active:not(:focus),input[type=button]:active:not(:focus),input[type=button][cta]:active:not(:focus),input[type=button][toggles]:active:not(:focus),input[type=button][toggles][active]:active:not(:focus),input[type=submit]:active:not(:focus),input[type=submit][cta]:active:not(:focus),input[type=submit][toggles]:active:not(:focus),input[type=submit][toggles][active]:active:not(:focus){border-color:#646e7b;outline:0}button[cta][disabled],button[disabled],button[toggles][active][disabled],button[toggles][disabled],input[type=button][cta][disabled],input[type=button][disabled],input[type=button][toggles][active][disabled],input[type=button][toggles][disabled],input[type=submit][cta][disabled],input[type=submit][disabled],input[type=submit][toggles][active][disabled],input[type=submit][toggles][disabled]{background-color:#424c58;color:#75808c;border-color:transparent;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0;pointer-events:none}}input:not([type]),input[type=date],input[type=email],input[type=file],input[type=month],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url],input[type=week]{font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;color:#c0cadb;border-radius:0;background-color:#141e29;text-overflow:ellipsis;border:1px solid #75808c;-webkit-appearance:none;-moz-appearance:none;appearance:none}input:not([type])[disabled],input[type=date][disabled],input[type=email][disabled],input[type=file][disabled],input[type=month][disabled],input[type=number][disabled],input[type=password][disabled],input[type=search][disabled],input[type=tel][disabled],input[type=text][disabled],input[type=url][disabled],input[type=week][disabled]{color:rgba(192,202,219,.5);border:1px solid rgba(117,128,140,.5)}input:not([type])[type=number],input[type=date][type=number],input[type=email][type=number],input[type=file][type=number],input[type=month][type=number],input[type=number][type=number],input[type=password][type=number],input[type=search][type=number],input[type=tel][type=number],input[type=text][type=number],input[type=url][type=number],input[type=week][type=number]{padding-right:0}input:not([type])[warning],input[type=date][warning],input[type=email][warning],input[type=file][warning],input[type=month][warning],input[type=number][warning],input[type=password][warning],input[type=search][warning],input[type=tel][warning],input[type=text][warning],input[type=url][warning],input[type=week][warning]{border:1px solid #ffbe42}input:not([type])[warning][disabled],input[type=date][warning][disabled],input[type=email][warning][disabled],input[type=file][warning][disabled],input[type=month][warning][disabled],input[type=number][warning][disabled],input[type=password][warning][disabled],input[type=search][warning][disabled],input[type=tel][warning][disabled],input[type=text][warning][disabled],input[type=url][warning][disabled],input[type=week][warning][disabled]{color:rgba(192,202,219,.5);border:1px solid rgba(255,190,66,.5)}input:not([type])[error],input:not([type])[error][warning],input[type=date][error],input[type=date][error][warning],input[type=email][error],input[type=email][error][warning],input[type=file][error],input[type=file][error][warning],input[type=month][error],input[type=month][error][warning],input[type=number][error],input[type=number][error][warning],input[type=password][error],input[type=password][error][warning],input[type=search][error],input[type=search][error][warning],input[type=tel][error],input[type=tel][error][warning],input[type=text][error],input[type=text][error][warning],input[type=url][error],input[type=url][error][warning],input[type=week][error],input[type=week][error][warning]{border:1px solid #ff5540}input:not([type])[error][disabled],input:not([type])[error][warning][disabled],input[type=date][error][disabled],input[type=date][error][warning][disabled],input[type=email][error][disabled],input[type=email][error][warning][disabled],input[type=file][error][disabled],input[type=file][error][warning][disabled],input[type=month][error][disabled],input[type=month][error][warning][disabled],input[type=number][error][disabled],input[type=number][error][warning][disabled],input[type=password][error][disabled],input[type=password][error][warning][disabled],input[type=search][error][disabled],input[type=search][error][warning][disabled],input[type=tel][error][disabled],input[type=tel][error][warning][disabled],input[type=text][error][disabled],input[type=text][error][warning][disabled],input[type=url][error][disabled],input[type=url][error][warning][disabled],input[type=week][error][disabled],input[type=week][error][warning][disabled]{color:rgba(192,202,219,.5);border:1px solid rgba(255,85,64,.5)}input:not([type]) ::-ms-clear,input[type=date] ::-ms-clear,input[type=email] ::-ms-clear,input[type=file] ::-ms-clear,input[type=month] ::-ms-clear,input[type=number] ::-ms-clear,input[type=password] ::-ms-clear,input[type=search] ::-ms-clear,input[type=tel] ::-ms-clear,input[type=text] ::-ms-clear,input[type=url] ::-ms-clear,input[type=week] ::-ms-clear{display:none}input:not([type]):focus,input[type=date]:focus,input[type=email]:focus,input[type=file]:focus,input[type=month]:focus,input[type=number]:focus,input[type=password]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=url]:focus,input[type=week]:focus{background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#6d84ff}input[type=file]::-webkit-file-upload-button{width:0;padding:0;margin:0;min-width:0;border:none;height:100%;font-family:inherit;font-size:12px}input[type=checkbox],input[type=radio]{display:inline-block;width:13px;height:13px;border-radius:0;background-color:#141e29;margin:1px 0;transition:box-shadow 150ms,border-color 150ms;vertical-align:middle;box-shadow:inset 0 0 0 rgba(0,0,0,.5);border:1px solid #75808c}input[type=checkbox]+label:not(:empty),input[type=radio]+label:not(:empty){vertical-align:middle;margin:1px 7px 1px 4px;display:inline-block}input[type=checkbox]:not([tabindex=\'-1\']):focus,input[type=radio]:not([tabindex=\'-1\']):focus{border-color:#6d84ff;box-shadow:0 0 0 #6d84ff}input[type=radio]{border-radius:100%}input[type=radio]:checked{background-image:radial-gradient(#6d84ff 25%,transparent 30%);background-size:100%}input[type=checkbox]:checked{background:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTVweCIgaGVpZ2h0PSIxM3B4IiB2aWV3Qm94PSIwIDAgMTUgMTMiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJjaGVja2VkIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMy4wMDAwMDAsIC01LjAwMDAwMCkiPgogICAgICAgICAgICA8cmVjdCBpZD0iUmVjdGFuZ2xlIiB4PSIwIiB5PSIwIiB3aWR0aD0iMjIiIGhlaWdodD0iMjIiPjwvcmVjdD4KICAgICAgICAgICAgPHBhdGggZD0iTTUuMjQ4NTY0MTQsMTQuMjk5NDQ5NCBMOC45NjM0MjQ5OCwxNC4zMjUwMzI3IiBpZD0iTGluZSIgc3Ryb2tlPSIjNTM1REU5IiBzdHJva2Utd2lkdGg9IjMiIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDYuOTY4MjczLCAxNC44MTg4MTMpIHJvdGF0ZSg0MC4wMDAwMDApIHRyYW5zbGF0ZSgtNi45NjgyNzMsIC0xNC44MTg4MTMpICI+PC9wYXRoPgogICAgICAgICAgICA8cGF0aCBkPSJNMTEuOTYyNDIyNCw2LjgzNzY3NjYxIEwxMS45NjI0MjI0LDE3LjE0Nzk2MjIiIGlkPSJMaW5lIiBzdHJva2U9IiM1MzVERTkiIHN0cm9rZS13aWR0aD0iMyIgc3Ryb2tlLWxpbmVjYXA9InNxdWFyZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTIuMzQ1NzM5LCAxMi4xMTA0MzkpIHJvdGF0ZSg0MC4wMDAwMDApIHRyYW5zbGF0ZSgtMTIuMzQ1NzM5LCAtMTIuMTEwNDM5KSAiPjwvcGF0aD4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==) center center no-repeat #141e29}input[type=checkbox]:indeterminate{background:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOHB4IiBoZWlnaHQ9IjhweCIgdmlld0JveD0iMCAwIDggOCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogICAgPGcgaWQ9IlBhZ2UtMSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgaWQ9ImluZGV0ZXJtaW5hdGUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC04LjAwMDAwMCwgLTcuMDAwMDAwKSI+CiAgICAgICAgICAgIDxyZWN0IGlkPSJSZWN0YW5nbGUiIHg9IjAiIHk9IjAiIHdpZHRoPSIyMiIgaGVpZ2h0PSIyMiI+PC9yZWN0PgogICAgICAgICAgICA8cmVjdCBpZD0iUmVjdGFuZ2xlIiBmaWxsPSIjNTM1REU5IiB4PSI4IiB5PSI3IiB3aWR0aD0iNy41IiBoZWlnaHQ9IjcuNSIgcng9IjEiPjwvcmVjdD4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==) center center no-repeat #141e29}:host{--grid-header-height:28px;--grid-row-height:28px;--theme-name:\'elf-theme-ds\';--global-focus-bordercolor:#5572ff;--scrollbar-bgcolor:transparent;--grid-bordercolor:#424c58;--grid-title-bgcolor:#323c48;--grid-title-txtcolor:#c0cadb;--grid-title-hover-txtcolor:#c0cadb;--grid-column-active-border-color:#6d84ff;--grid-column-separator-bgcolor:#404955;--grid-row-txtcolor:#c0cadb;--grid-row-bgcolor:#141e29;--grid-alt-row-bgcolor:#111922;--grid-highlight-txtcolor:#c0cadb;--grid-highlight-bgcolor:#424c58;--grid-active-txtcolor:#c0cadb;--grid-selection-bgcolor:#505b67;--grid-header-txtcolor:#c0cadb;--grid-header-bgcolor:#0f161f;--grid-tag-bg-color:#7f93b6;--grid-expanded-tag-bg-color:#a0afc8;--grid-active-bordercolor:#5572ff;--grid-active-bgcolor:#141e29;--input-txtcolor:#c0cadb;--input-selection-txtcolor:currentColor;--input-selection-bgcolor:#5d84b3;--grid-guideline-bgcolor:#8ea0ff;--grid-dragbox-bordercolor:#75808c;--grid-dragbox-bgcolor:#1c2b3a;--grid-drag-indicator:dashed 1px #6e7e92;--grid-title-sort-icon-color:#8ea0ff;--grid-title-icon-color:#001cf0;--grid-title-filter-icon-color:#8ea0ff;--grid-title-filter-icon-hover-color:#bdc6ff;--grid-title-dot-icon:#c0cadb;--grid-column-menu-icon-color:#ffffff;--grid-column-menu-icon-bgcolor:#001cf0;--grid-column-menu-icon-hover-bgcolor:#6d84ff;--grid-row-menu-icon-color:#c0cadb;--grid-row-menu-icon-hover-color:#bdc6ff}@supports not selector(::-webkit-scrollbar){:host .grid-hscroll,:host .grid-vscroll{scrollbar-color:#9a9a9a transparent;scrollbar-width:thin}}:host .cell button,:host .cell input,:host .cell select,:host .cell textarea,:host ef-checkbox,:host input[type=checkbox]{margin:0}:host button,:host input[type=text],:host select{max-height:calc(var(--grid-row-height) - 6px)}:host select{width:100%}:host .cell button{min-width:unset}:host .title input[type=search]{width:100%;background-color:#141e29;max-height:calc(var(--grid-row-height) - 6px)}:host .cell,:host .editing,:host .filter-input,:host .folder,:host .grid-pane,:host .sorting{touch-action:manipulation}:host .tr-lg .cell{padding:0 8px;padding:var(--grid-cell-padding,0 8px 0 8px)}:host .tr-grid .title .cell.sorting:hover,:host .tr-grid .title .sorting,:host .tr-grid .title .sorting:hover{color:#c0cadb}:host .tr-grid{background-color:inherit}:host .tr-grid .title .cell:hover{background-color:#424c58}:host .tr-grid .column.conditionally-colored .cell.highlighted-row,:host .tr-grid .column.conditionally-colored .cell.selected-row,:host .tr-grid .column.conditionally-colored .cell.selection,:host .tr-grid .column.heat-map .cell.highlighted-row,:host .tr-grid .column.heat-map .cell.selected-row,:host .tr-grid .column.heat-map .cell.selection,:host .tr-grid .selected-column.conditionally-colored .cell,:host .tr-grid .selected-column.heat-map .cell,:host .tr-grid .title .selected-column .cell,:host .tr-lg .cell.highlighted-row,:host .tr-lg .cell.selected-row,:host .tr-lg .selected-column .cell{background-image:none}:host .tr-lg .tr-stretched.folder,:host .tr-lg .tr-stretched.header{color:#c0cadb;background-color:#141e29}:host .tr-lg .tr-stretched.folder:not(.closed),:host .tr-lg .tr-stretched.header:not(.closed){color:#fff}:host .tr-lg .selected-column .cell{border-top-color:transparent}:host .tr-lg .cell.selected-row,:host .tr-lg .cell.selected-row.tr-stretched,:host .tr-lg .selected-column .cell{background-color:#505b67}:host .tr-grid .section .tr-lg .cell.highlighted-row{background-color:#424c58}:host .tr-grid .sortable-indicator{opacity:.5}:host .tr-grid .section.title .column.selected-column .cell:last-child{border-bottom-color:invalidColor}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#9a9a9a;border-radius:6px;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#9a9a9a}::-webkit-scrollbar-thumb:active{background:#9a9a9a}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#9a9a9a,#9a9a9a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#9a9a9a,#9a9a9a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#9a9a9a,#9a9a9a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#9a9a9a,#9a9a9a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#9a9a9a,#9a9a9a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#9a9a9a,#9a9a9a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid transparent;border-bottom:1px solid transparent}::-webkit-scrollbar-track:vertical{border-left:1px solid transparent;border-right:1px solid transparent}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat;height:16px;width:16px;display:none;border:1px solid transparent}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#323c48;border:1px solid #323c48}::-webkit-scrollbar-button:active{background-color:rgba(0,0,0,0);border:1px solid transparent}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:transparent;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#323c48}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:transparent}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:transparent;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#323c48}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:transparent}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:transparent;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#323c48}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:transparent}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:transparent;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#323c48}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:transparent}' }}));

package/lib/grid/themes/ds/dark/es5/all-elements.js

@@ -0,0 +1,2 @@
+dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'efx-grid', styles: 'select{-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;font-size:12px;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-block;position:relative;vertical-align:middle;background:#141e29;color:#c0cadb;border:1px solid #75808c}select:focus{background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#6d84ff}button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:4px;background-color:#232d38;color:#fff;border:1px solid #424c58;height:24px;box-shadow:0 0 0 0 rgba(20,30,41,.08);padding:0 12px;outline:0;font-family:inherit;font-size:12px;font-weight:400;min-width:60px;margin:1px 0;transition:120ms;text-align:center;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;vertical-align:bottom;position:relative;overflow:hidden}button[cta]{background-color:#6d84ff;color:#141e29;border-color:transparent;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}button[toggles]{background-color:#232d38;color:#fff;border-color:#424c58;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}button[toggles][active]{background-color:#fff;color:#141e29;border-color:transparent;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}textarea{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;color:#c0cadb;border-radius:0;background-color:#141e29;text-overflow:ellipsis;border:1px solid #75808c;resize:none;line-height:1.2;padding:calc((24px - 1px * 2 - 1em * 1.2)/ 2) 8px}textarea[disabled]{color:rgba(192,202,219,.5);border:1px solid rgba(117,128,140,.5)}textarea[type=number]{padding-right:0}textarea[warning]{border:1px solid #ffbe42}textarea[warning][disabled]{color:rgba(192,202,219,.5);border:1px solid rgba(255,190,66,.5)}textarea[error],textarea[error][warning]{border:1px solid #ff5540}textarea[error][disabled],textarea[error][warning][disabled]{color:rgba(192,202,219,.5);border:1px solid rgba(255,85,64,.5)}textarea ::-ms-clear{display:none}textarea[cols]{width:auto}textarea[rows]{height:auto}textarea:focus{background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#6d84ff}a{text-decoration:none;color:#bdc6ff}a:active{color:#b0b8ed}a:focus{outline:0}a:hover{text-decoration:underline;text-decoration-color:#6d84ff;color:#8ea0ff;text-decoration-color:#8ea0ff}a:visited,a[alt]:visited{color:#424c58}a[alt]{color:#bdc6ff}a[alt]:hover{color:#8ea0ff}input{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0;font-weight:400;text-align:left}input::-webkit-clear-button,input::-webkit-inner-spin-button,input::-webkit-search-cancel-button,input::-webkit-search-decoration{-webkit-appearance:none}input[type=button],input[type=submit]{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:4px;background-color:#232d38;color:#fff;border:1px solid #424c58;height:24px;box-shadow:0 0 0 0 rgba(20,30,41,.08);padding:0 12px;outline:0;font-family:inherit;font-size:12px;font-weight:400;min-width:60px;margin:1px 0;transition:120ms;text-align:center;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;vertical-align:bottom;position:relative;overflow:hidden}input[type=button][cta],input[type=submit][cta]{background-color:#6d84ff;color:#141e29;border-color:transparent;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}input[type=button][toggles],input[type=submit][toggles]{background-color:#232d38;color:#fff;border-color:#424c58;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}input[type=button][toggles][active],input[type=submit][toggles][active]{background-color:#fff;color:#141e29;border-color:transparent;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}@media (-ms-high-contrast:none),(pointer:fine){button:focus:not([focused]),button[cta]:focus:not([focused]),button[cta][focused=visible],button[focused=visible],button[toggles]:focus:not([focused]),button[toggles][active]:focus:not([focused]),button[toggles][active][focused=visible],button[toggles][focused=visible],input[type=button]:focus:not([focused]),input[type=button][cta]:focus:not([focused]),input[type=button][cta][focused=visible],input[type=button][focused=visible],input[type=button][toggles]:focus:not([focused]),input[type=button][toggles][active]:focus:not([focused]),input[type=button][toggles][active][focused=visible],input[type=button][toggles][focused=visible],input[type=submit]:focus:not([focused]),input[type=submit][cta]:focus:not([focused]),input[type=submit][cta][focused=visible],input[type=submit][focused=visible],input[type=submit][toggles]:focus:not([focused]),input[type=submit][toggles][active]:focus:not([focused]),input[type=submit][toggles][active][focused=visible],input[type=submit][toggles][focused=visible]{background-color:#232d38;color:#fff;box-shadow:0 0 0 2px #141e29,0 0 0 4px #5572ff;border-color:#424c58;outline:0}button:hover,button[cta]:hover,button[toggles]:hover,button[toggles][active]:hover,input[type=button]:hover,input[type=button][cta]:hover,input[type=button][toggles]:hover,input[type=button][toggles][active]:hover,input[type=submit]:hover,input[type=submit][cta]:hover,input[type=submit][toggles]:hover,input[type=submit][toggles][active]:hover{background-color:#323c48;color:#fff;box-shadow:0 0 0 0 rgba(20,30,41,.08)}button:hover:not(:focus),button[cta]:hover:not(:focus),button[toggles]:hover:not(:focus),button[toggles][active]:hover:not(:focus),input[type=button]:hover:not(:focus),input[type=button][cta]:hover:not(:focus),input[type=button][toggles]:hover:not(:focus),input[type=button][toggles][active]:hover:not(:focus),input[type=submit]:hover:not(:focus),input[type=submit][cta]:hover:not(:focus),input[type=submit][toggles]:hover:not(:focus),input[type=submit][toggles][active]:hover:not(:focus){border-color:#646e7b;outline:0}}@media all{button:active,button[cta]:active,button[toggles]:active,button[toggles][active]:active,input[type=button]:active,input[type=button][cta]:active,input[type=button][toggles]:active,input[type=button][toggles][active]:active,input[type=submit]:active,input[type=submit][cta]:active,input[type=submit][toggles]:active,input[type=submit][toggles][active]:active{background-color:rgba(0,0,0,0);color:#fff;box-shadow:0 0 0 0 rgba(20,30,41,.08)}button:active:not(:focus),button[cta]:active:not(:focus),button[toggles]:active:not(:focus),button[toggles][active]:active:not(:focus),input[type=button]:active:not(:focus),input[type=button][cta]:active:not(:focus),input[type=button][toggles]:active:not(:focus),input[type=button][toggles][active]:active:not(:focus),input[type=submit]:active:not(:focus),input[type=submit][cta]:active:not(:focus),input[type=submit][toggles]:active:not(:focus),input[type=submit][toggles][active]:active:not(:focus){border-color:#646e7b;outline:0}button[cta][disabled],button[disabled],button[toggles][active][disabled],button[toggles][disabled],input[type=button][cta][disabled],input[type=button][disabled],input[type=button][toggles][active][disabled],input[type=button][toggles][disabled],input[type=submit][cta][disabled],input[type=submit][disabled],input[type=submit][toggles][active][disabled],input[type=submit][toggles][disabled]{background-color:#424c58;color:#75808c;border-color:transparent;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0;pointer-events:none}}input:not([type]),input[type=date],input[type=email],input[type=file],input[type=month],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url],input[type=week]{font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;color:#c0cadb;border-radius:0;background-color:#141e29;text-overflow:ellipsis;border:1px solid #75808c;-webkit-appearance:none;-moz-appearance:none;appearance:none}input:not([type])[disabled],input[type=date][disabled],input[type=email][disabled],input[type=file][disabled],input[type=month][disabled],input[type=number][disabled],input[type=password][disabled],input[type=search][disabled],input[type=tel][disabled],input[type=text][disabled],input[type=url][disabled],input[type=week][disabled]{color:rgba(192,202,219,.5);border:1px solid rgba(117,128,140,.5)}input:not([type])[type=number],input[type=date][type=number],input[type=email][type=number],input[type=file][type=number],input[type=month][type=number],input[type=number][type=number],input[type=password][type=number],input[type=search][type=number],input[type=tel][type=number],input[type=text][type=number],input[type=url][type=number],input[type=week][type=number]{padding-right:0}input:not([type])[warning],input[type=date][warning],input[type=email][warning],input[type=file][warning],input[type=month][warning],input[type=number][warning],input[type=password][warning],input[type=search][warning],input[type=tel][warning],input[type=text][warning],input[type=url][warning],input[type=week][warning]{border:1px solid #ffbe42}input:not([type])[warning][disabled],input[type=date][warning][disabled],input[type=email][warning][disabled],input[type=file][warning][disabled],input[type=month][warning][disabled],input[type=number][warning][disabled],input[type=password][warning][disabled],input[type=search][warning][disabled],input[type=tel][warning][disabled],input[type=text][warning][disabled],input[type=url][warning][disabled],input[type=week][warning][disabled]{color:rgba(192,202,219,.5);border:1px solid rgba(255,190,66,.5)}input:not([type])[error],input:not([type])[error][warning],input[type=date][error],input[type=date][error][warning],input[type=email][error],input[type=email][error][warning],input[type=file][error],input[type=file][error][warning],input[type=month][error],input[type=month][error][warning],input[type=number][error],input[type=number][error][warning],input[type=password][error],input[type=password][error][warning],input[type=search][error],input[type=search][error][warning],input[type=tel][error],input[type=tel][error][warning],input[type=text][error],input[type=text][error][warning],input[type=url][error],input[type=url][error][warning],input[type=week][error],input[type=week][error][warning]{border:1px solid #ff5540}input:not([type])[error][disabled],input:not([type])[error][warning][disabled],input[type=date][error][disabled],input[type=date][error][warning][disabled],input[type=email][error][disabled],input[type=email][error][warning][disabled],input[type=file][error][disabled],input[type=file][error][warning][disabled],input[type=month][error][disabled],input[type=month][error][warning][disabled],input[type=number][error][disabled],input[type=number][error][warning][disabled],input[type=password][error][disabled],input[type=password][error][warning][disabled],input[type=search][error][disabled],input[type=search][error][warning][disabled],input[type=tel][error][disabled],input[type=tel][error][warning][disabled],input[type=text][error][disabled],input[type=text][error][warning][disabled],input[type=url][error][disabled],input[type=url][error][warning][disabled],input[type=week][error][disabled],input[type=week][error][warning][disabled]{color:rgba(192,202,219,.5);border:1px solid rgba(255,85,64,.5)}input:not([type]) ::-ms-clear,input[type=date] ::-ms-clear,input[type=email] ::-ms-clear,input[type=file] ::-ms-clear,input[type=month] ::-ms-clear,input[type=number] ::-ms-clear,input[type=password] ::-ms-clear,input[type=search] ::-ms-clear,input[type=tel] ::-ms-clear,input[type=text] ::-ms-clear,input[type=url] ::-ms-clear,input[type=week] ::-ms-clear{display:none}input:not([type]):focus,input[type=date]:focus,input[type=email]:focus,input[type=file]:focus,input[type=month]:focus,input[type=number]:focus,input[type=password]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=url]:focus,input[type=week]:focus{background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#6d84ff}input[type=file]::-webkit-file-upload-button{width:0;padding:0;margin:0;min-width:0;border:none;height:100%;font-family:inherit;font-size:12px}input[type=checkbox],input[type=radio]{display:inline-block;width:13px;height:13px;border-radius:0;background-color:#141e29;margin:1px 0;transition:box-shadow 150ms,border-color 150ms;vertical-align:middle;box-shadow:inset 0 0 0 rgba(0,0,0,.5);border:1px solid #75808c}input[type=checkbox]+label:not(:empty),input[type=radio]+label:not(:empty){vertical-align:middle;margin:1px 7px 1px 4px;display:inline-block}input[type=checkbox]:not([tabindex=\'-1\']):focus,input[type=radio]:not([tabindex=\'-1\']):focus{border-color:#6d84ff;box-shadow:0 0 0 #6d84ff}input[type=radio]{border-radius:100%}input[type=radio]:checked{background-image:radial-gradient(#6d84ff 25%,transparent 30%);background-size:100%}input[type=checkbox]:checked{background:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTVweCIgaGVpZ2h0PSIxM3B4IiB2aWV3Qm94PSIwIDAgMTUgMTMiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJjaGVja2VkIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMy4wMDAwMDAsIC01LjAwMDAwMCkiPgogICAgICAgICAgICA8cmVjdCBpZD0iUmVjdGFuZ2xlIiB4PSIwIiB5PSIwIiB3aWR0aD0iMjIiIGhlaWdodD0iMjIiPjwvcmVjdD4KICAgICAgICAgICAgPHBhdGggZD0iTTUuMjQ4NTY0MTQsMTQuMjk5NDQ5NCBMOC45NjM0MjQ5OCwxNC4zMjUwMzI3IiBpZD0iTGluZSIgc3Ryb2tlPSIjNTM1REU5IiBzdHJva2Utd2lkdGg9IjMiIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDYuOTY4MjczLCAxNC44MTg4MTMpIHJvdGF0ZSg0MC4wMDAwMDApIHRyYW5zbGF0ZSgtNi45NjgyNzMsIC0xNC44MTg4MTMpICI+PC9wYXRoPgogICAgICAgICAgICA8cGF0aCBkPSJNMTEuOTYyNDIyNCw2LjgzNzY3NjYxIEwxMS45NjI0MjI0LDE3LjE0Nzk2MjIiIGlkPSJMaW5lIiBzdHJva2U9IiM1MzVERTkiIHN0cm9rZS13aWR0aD0iMyIgc3Ryb2tlLWxpbmVjYXA9InNxdWFyZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTIuMzQ1NzM5LCAxMi4xMTA0MzkpIHJvdGF0ZSg0MC4wMDAwMDApIHRyYW5zbGF0ZSgtMTIuMzQ1NzM5LCAtMTIuMTEwNDM5KSAiPjwvcGF0aD4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==) center center no-repeat #141e29}input[type=checkbox]:indeterminate{background:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOHB4IiBoZWlnaHQ9IjhweCIgdmlld0JveD0iMCAwIDggOCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogICAgPGcgaWQ9IlBhZ2UtMSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgaWQ9ImluZGV0ZXJtaW5hdGUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC04LjAwMDAwMCwgLTcuMDAwMDAwKSI+CiAgICAgICAgICAgIDxyZWN0IGlkPSJSZWN0YW5nbGUiIHg9IjAiIHk9IjAiIHdpZHRoPSIyMiIgaGVpZ2h0PSIyMiI+PC9yZWN0PgogICAgICAgICAgICA8cmVjdCBpZD0iUmVjdGFuZ2xlIiBmaWxsPSIjNTM1REU5IiB4PSI4IiB5PSI3IiB3aWR0aD0iNy41IiBoZWlnaHQ9IjcuNSIgcng9IjEiPjwvcmVjdD4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==) center center no-repeat #141e29}:host{--grid-header-height:28px;--grid-row-height:28px;--theme-name:\'elf-theme-ds\';--global-focus-bordercolor:#5572ff;--scrollbar-bgcolor:transparent;--grid-bordercolor:#424c58;--grid-title-bgcolor:#323c48;--grid-title-txtcolor:#c0cadb;--grid-title-hover-txtcolor:#c0cadb;--grid-column-active-border-color:#6d84ff;--grid-column-separator-bgcolor:#404955;--grid-row-txtcolor:#c0cadb;--grid-row-bgcolor:#141e29;--grid-alt-row-bgcolor:#111922;--grid-highlight-txtcolor:#c0cadb;--grid-highlight-bgcolor:#424c58;--grid-active-txtcolor:#c0cadb;--grid-selection-bgcolor:#505b67;--grid-header-txtcolor:#c0cadb;--grid-header-bgcolor:#0f161f;--grid-tag-bg-color:#7f93b6;--grid-expanded-tag-bg-color:#a0afc8;--grid-active-bordercolor:#5572ff;--grid-active-bgcolor:#141e29;--input-txtcolor:#c0cadb;--input-selection-txtcolor:currentColor;--input-selection-bgcolor:#5d84b3;--grid-guideline-bgcolor:#8ea0ff;--grid-dragbox-bordercolor:#75808c;--grid-dragbox-bgcolor:#1c2b3a;--grid-drag-indicator:dashed 1px #6e7e92;--grid-title-sort-icon-color:#8ea0ff;--grid-title-icon-color:#001cf0;--grid-title-filter-icon-color:#8ea0ff;--grid-title-filter-icon-hover-color:#bdc6ff;--grid-title-dot-icon:#c0cadb;--grid-column-menu-icon-color:#ffffff;--grid-column-menu-icon-bgcolor:#001cf0;--grid-column-menu-icon-hover-bgcolor:#6d84ff;--grid-row-menu-icon-color:#c0cadb;--grid-row-menu-icon-hover-color:#bdc6ff}@supports not selector(::-webkit-scrollbar){:host .grid-hscroll,:host .grid-vscroll{scrollbar-color:#9a9a9a transparent;scrollbar-width:thin}}:host .cell button,:host .cell input,:host .cell select,:host .cell textarea,:host ef-checkbox,:host input[type=checkbox]{margin:0}:host button,:host input[type=text],:host select{max-height:calc(var(--grid-row-height) - 6px)}:host select{width:100%}:host .cell button{min-width:unset}:host .title input[type=search]{width:100%;background-color:#141e29;max-height:calc(var(--grid-row-height) - 6px)}:host .cell,:host .editing,:host .filter-input,:host .folder,:host .grid-pane,:host .sorting{touch-action:manipulation}:host .tr-lg .cell{padding:0 8px;padding:var(--grid-cell-padding,0 8px 0 8px)}:host .tr-grid .title .cell.sorting:hover,:host .tr-grid .title .sorting,:host .tr-grid .title .sorting:hover{color:#c0cadb}:host .tr-grid{background-color:inherit}:host .tr-grid .title .cell:hover{background-color:#424c58}:host .tr-grid .column.conditionally-colored .cell.highlighted-row,:host .tr-grid .column.conditionally-colored .cell.selected-row,:host .tr-grid .column.conditionally-colored .cell.selection,:host .tr-grid .column.heat-map .cell.highlighted-row,:host .tr-grid .column.heat-map .cell.selected-row,:host .tr-grid .column.heat-map .cell.selection,:host .tr-grid .selected-column.conditionally-colored .cell,:host .tr-grid .selected-column.heat-map .cell,:host .tr-grid .title .selected-column .cell,:host .tr-lg .cell.highlighted-row,:host .tr-lg .cell.selected-row,:host .tr-lg .selected-column .cell{background-image:none}:host .tr-lg .tr-stretched.folder,:host .tr-lg .tr-stretched.header{color:#c0cadb;background-color:#141e29}:host .tr-lg .tr-stretched.folder:not(.closed),:host .tr-lg .tr-stretched.header:not(.closed){color:#fff}:host .tr-lg .selected-column .cell{border-top-color:transparent}:host .tr-lg .cell.selected-row,:host .tr-lg .cell.selected-row.tr-stretched,:host .tr-lg .selected-column .cell{background-color:#505b67}:host .tr-grid .section .tr-lg .cell.highlighted-row{background-color:#424c58}:host .tr-grid .sortable-indicator{opacity:.5}:host .tr-grid .section.title .column.selected-column .cell:last-child{border-bottom-color:invalidColor}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#9a9a9a;border-radius:6px;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#9a9a9a}::-webkit-scrollbar-thumb:active{background:#9a9a9a}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#9a9a9a,#9a9a9a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#9a9a9a,#9a9a9a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#9a9a9a,#9a9a9a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#9a9a9a,#9a9a9a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#9a9a9a,#9a9a9a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#9a9a9a,#9a9a9a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid transparent;border-bottom:1px solid transparent}::-webkit-scrollbar-track:vertical{border-left:1px solid transparent;border-right:1px solid transparent}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat;height:16px;width:16px;display:none;border:1px solid transparent}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#323c48;border:1px solid #323c48}::-webkit-scrollbar-button:active{background-color:rgba(0,0,0,0);border:1px solid transparent}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:transparent;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#323c48}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:transparent}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:transparent;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#323c48}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:transparent}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:transparent;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#323c48}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:transparent}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:transparent;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#323c48}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:transparent}' }}));
+

package/lib/grid/themes/ds/dark/imports/all-elements.js

@@ -0,0 +1 @@
+import '../efx-grid.js';

package/lib/grid/themes/ds/dark/imports/custom-elements.js

@@ -0,0 +1 @@
+import '../efx-grid.js';

package/lib/grid/themes/ds/dark.js

@@ -0,0 +1,3 @@
+import './dark/efx-grid.js';
+
+import '@refinitiv-ui/elements/icon/themes/ds/dark';

package/lib/grid/themes/ds/efx-grid.less

@@ -0,0 +1,207 @@
+@import '~/@refinitiv-ui/halo-theme/src/shared-styles/scrollbar';
+@import '~/@refinitiv-ui/halo-theme/src/native-elements/select';
+@import '~/@refinitiv-ui/halo-theme/src/native-elements/button';
+@import '~/@refinitiv-ui/halo-theme/src/native-elements/textarea';
+
+@import '~/@refinitiv-ui/ds-theme/src/native-elements/a';
+@import '~/@refinitiv-ui/ds-theme/src/native-elements/input';
+
+@theme-name: 'elf-theme-ds'; // TODO:: change to ds-theme
+
+:host {
+  --grid-header-height                            : @grid-header-height; /// 28 Halo
+  --grid-row-height                               : @grid-row-height; /// 28 Halo
+  --theme-name                                    : @theme-name;
+
+  // Filter icon color, drag guide + drag box border-color
+  // --grid-guideline-color                          : @scheme-color-primary;
+
+  .grid-vscroll, .grid-hscroll {
+    // .ie-scrollbars();
+    .mozilla-scrollbars();
+  }
+
+  // More custom theme that has to be done via css selector
+  .cell input,
+  .cell textarea,
+  .cell select,
+  .cell button,
+  ef-checkbox,
+  input[type=checkbox] {
+    margin: 0;
+  }
+  select, button, input[type=text] { // Todo: force every thing in cells to have max size not exceed row height.
+    max-height: calc(var(--grid-row-height) - 6px);
+  }
+  select {
+    width: 100%;
+  }
+  .cell button {
+    min-width: unset;
+  }
+  
+  .title input[type=search] {
+    width: 100%;
+    background-color: @grid-row-background-color;
+    max-height: calc(var(--grid-row-height) - 6px);
+  }
+  
+  .grid-pane, .cell, .editing, .sorting, .filter-input, .folder {
+    .touch-action();
+  }
+  .tr-lg .cell {
+    // for ie
+    padding: @grid-cell-padding; // Elemental
+    // for modern browser
+    padding: var(--grid-cell-padding, @grid-cell-padding);
+  }
+  
+  // Sorted column text color
+  .tr-grid .title .sorting,
+  .tr-grid .title .sorting:hover,
+  .tr-grid .title .cell.sorting:hover {
+    color: @grid-row-active-text-color;
+  }
+
+  .tr-grid {
+    background-color: inherit;
+  }
+
+  .tr-grid .title .cell:hover {
+    background-color: @grid-header-hover-background-color; // ** missing from ds-theme
+  }
+  
+  // Prevent from unexpected background color overiding
+  .tr-grid .column.heat-map .cell.selected-row,
+  .tr-grid .column.heat-map .cell.highlighted-row,
+  .tr-grid .column.heat-map .cell.selection,
+  .tr-grid .column.conditionally-colored .cell.selected-row,
+  .tr-grid .column.conditionally-colored .cell.highlighted-row,
+  .tr-grid .column.conditionally-colored .cell.selection,
+  .tr-grid .title .selected-column .cell,
+  .tr-grid .selected-column.heat-map .cell,
+  .tr-grid .selected-column.conditionally-colored .cell,
+  .tr-lg .cell.selected-row,
+  .tr-lg .cell.highlighted-row,
+  .tr-lg .selected-column .cell {
+    background-image: none;
+  }
+
+  // Group header row
+  // This feature is implemented for row grouping extension
+  // In Solar theme, the color will be based from tr-grid
+  .tr-lg .tr-stretched.folder,
+  .tr-lg .tr-stretched.header {
+    color: @grid-row-text-color;
+    background-color: @grid-row-background-color;
+
+    &:not(.closed) {
+      color: @grid-expended-row-header-color;
+    }
+  }
+
+  .tr-lg .selected-column .cell {
+    border-top-color: transparent;
+  }
+
+  .tr-lg .cell.selected-row,
+  .tr-lg .cell.selected-row.tr-stretched,
+  .tr-lg .selected-column .cell { // Selected rows have more priority than row-coloring
+    background-color: @grid-row-active-background-color; //
+  }
+
+  .tr-grid .section .tr-lg .cell.highlighted-row { // Highlighted style has more priority than row-coloring
+    background-color: @grid-row-hover-background-color; //
+  }
+
+  .tr-grid .sortable-indicator {
+    opacity: 0.5;
+  }
+
+  .tr-grid .section.title .column.selected-column .cell:last-child {
+    border-bottom-color: @grid-column-active-title-border-color; // 13
+  }
+
+  // Global 
+  --global-focus-bordercolor       : @grid-row-focus-border-color;
+  --scrollbar-bgcolor              : @scrollbar-track-background-color; // transparent
+  --grid-bordercolor               : @grid-border-color;
+  
+  // Column title
+  --grid-title-bgcolor             : @grid-header-background-color;
+  --grid-title-txtcolor            : @grid-header-text-color;
+  --grid-title-hover-txtcolor      : @grid-header-text-color;
+  
+  // Selected column boundary **
+  --grid-column-active-border-color: @grid-column-active-border-color; // The value will be invalidColor in core's theme (backward compatible with v3)
+  
+  // Column collapsing
+  // --grid-column-grouped-bgcolor: @color-charcoal; // Column collapsing (expanded) // unused
+
+  // Column pinning
+  --grid-column-separator-bgcolor  : @grid-column-separator-background-color;
+
+  // Row
+  --grid-row-txtcolor              : @grid-row-text-color;
+  --grid-row-bgcolor               : @grid-row-background-color;
+  --grid-alt-row-bgcolor           : @grid-row-alternate-background-color;
+
+  // row hovering
+  --grid-highlight-txtcolor        : @grid-row-hover-text-color;
+  --grid-highlight-bgcolor         : @grid-row-hover-background-color;
+
+  // selected row, cell
+  --grid-active-txtcolor           : @grid-row-active-text-color;
+  --grid-selection-bgcolor         : @grid-row-active-background-color;
+
+  // Row group header, Filter icon (alway on mode)
+  --grid-header-txtcolor           : @grid-header-text-color;
+
+  // Row group header
+  --grid-header-bgcolor            : @grid-row-header-background-color;
+  
+  // Row grouping - Tag
+  --grid-tag-bg-color              : @grid-tag-background-color;
+  --grid-expanded-tag-bg-color     : @grid-expanded-tag-background-color;
+  
+  // Cell 
+  // Editing
+  // .cell.editing input[type=text], .cell.balloon
+  --grid-active-bordercolor        : @grid-row-focus-border-color;
+  --grid-active-bgcolor            : @input-background-color;
+  // .cell.editing input[type=text]
+  --input-txtcolor                 : @input-text-color;
+  --input-selection-txtcolor       : @global-text-selection-color; // currentColor
+  --input-selection-bgcolor        : @global-text-selection-background; // #B4D5FE, Unable to reset to default. Fix to default chrome/safari
+  
+  // Draging UI
+  --grid-guideline-bgcolor         : @grid-guideline-background-color ;
+  --grid-dragbox-bordercolor       : @grid-drag-box-border-color;
+  --grid-dragbox-bgcolor           : @grid-drag-box-background-color;
+  --grid-drag-indicator            : @grid-drag-indicator-border-color;
+
+  // Sorting indicator, dragbox border color 
+  // .cell.sorting.edge-indicator:before (box-shadow), .sorting.edge-indicator:after (border-top), dragbox border color
+  --grid-title-sort-icon-color     : @grid-title-sort-icon-color;
+
+  // Filter icon (always on mode + active), Dragbox guideline
+  --grid-title-icon-color          : @grid-title-icon-active-color;
+  
+  // Filter icon, Stack icon
+  --grid-title-filter-icon-color   : @grid-title-icon-color; // primary - 1 
+  --grid-title-filter-icon-hover-color: @grid-title-icon-hover-color; //Filter icon normal and alway on mode
+
+  // Filter icon for tiny column
+  --grid-title-dot-icon            : @grid-title-dot-icon-color;
+
+  // Row menu icon, Column menu icon
+  --grid-column-menu-icon-color    : @grid-menu-icon-color;
+  --grid-column-menu-icon-bgcolor  : @grid-menu-icon-background-color;
+  --grid-column-menu-icon-hover-bgcolor: @grid-menu-icon-hover-background-color;
+
+  // Row more icon
+  --grid-row-menu-icon-color       : @grid-row-more-icon-color;
+  --grid-row-menu-icon-hover-color : @grid-row-more-icon-hover-color;
+}
+
+.webkit-scrollbars();

package/lib/grid/themes/ds/index.less

@@ -0,0 +1,3 @@
+@import '~@refinitiv-ui/ds-theme/exports/bare';
+@import 'elements:efx-grid.less';
+@variant: default;

package/lib/grid/themes/ds/light/efx-grid.js

@@ -0,0 +1,4 @@
+import './imports/native-elements.js';
+
+
+dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'efx-grid', styles: 'select{-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;font-size:12px;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-block;position:relative;vertical-align:middle;background:#fff;color:#323c48;border:1px solid #848f9c}select:focus{background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#2336fd}button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:4px;background-color:#f6f7f9;color:#141e29;border:1px solid #c0cadb;height:24px;box-shadow:0 0 0 0 rgba(20,30,41,.08);padding:0 12px;outline:0;font-family:inherit;font-size:12px;font-weight:400;min-width:60px;margin:1px 0;transition:120ms;text-align:center;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;vertical-align:bottom;position:relative;overflow:hidden}button[cta]{background-color:#2336fd;color:#fff;border-color:transparent;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}button[toggles]{background-color:#f6f7f9;color:#141e29;border-color:#c0cadb;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}button[toggles][active]{background-color:#141e29;color:#fff;border-color:transparent;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}textarea{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;color:#323c48;border-radius:0;background-color:#fff;text-overflow:ellipsis;border:1px solid #848f9c;resize:none;line-height:1.2;padding:calc((24px - 1px * 2 - 1em * 1.2)/ 2) 8px}textarea[disabled]{color:rgba(50,60,72,.5);border:1px solid rgba(132,143,156,.5)}textarea[type=number]{padding-right:0}textarea[warning]{border:1px solid #ffbe42}textarea[warning][disabled]{color:rgba(50,60,72,.5);border:1px solid rgba(255,190,66,.5)}textarea[error],textarea[error][warning]{border:1px solid #b70300}textarea[error][disabled],textarea[error][warning][disabled]{color:rgba(50,60,72,.5);border:1px solid rgba(183,3,0,.5)}textarea ::-ms-clear{display:none}textarea[cols]{width:auto}textarea[rows]{height:auto}textarea:focus{background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#2336fd}a{text-decoration:none;color:#0014c2}a:active{color:#0013b4}a:focus{outline:0}a:hover{text-decoration:underline;text-decoration-color:#2336fd;color:#2336fd;text-decoration-color:#2336fd}a:visited,a[alt]:visited{color:#646e7b}a[alt]{color:#0014c2}a[alt]:hover{color:#2336fd}input{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0;font-weight:400;text-align:left}input::-webkit-clear-button,input::-webkit-inner-spin-button,input::-webkit-search-cancel-button,input::-webkit-search-decoration{-webkit-appearance:none}input[type=button],input[type=submit]{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:4px;background-color:#f6f7f9;color:#141e29;border:1px solid #c0cadb;height:24px;box-shadow:0 0 0 0 rgba(20,30,41,.08);padding:0 12px;outline:0;font-family:inherit;font-size:12px;font-weight:400;min-width:60px;margin:1px 0;transition:120ms;text-align:center;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;vertical-align:bottom;position:relative;overflow:hidden}input[type=button][cta],input[type=submit][cta]{background-color:#2336fd;color:#fff;border-color:transparent;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}input[type=button][toggles],input[type=submit][toggles]{background-color:#f6f7f9;color:#141e29;border-color:#c0cadb;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}input[type=button][toggles][active],input[type=submit][toggles][active]{background-color:#141e29;color:#fff;border-color:transparent;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}@media (-ms-high-contrast:none),(pointer:fine){button:focus:not([focused]),button[cta]:focus:not([focused]),button[cta][focused=visible],button[focused=visible],button[toggles]:focus:not([focused]),button[toggles][active]:focus:not([focused]),button[toggles][active][focused=visible],button[toggles][focused=visible],input[type=button]:focus:not([focused]),input[type=button][cta]:focus:not([focused]),input[type=button][cta][focused=visible],input[type=button][focused=visible],input[type=button][toggles]:focus:not([focused]),input[type=button][toggles][active]:focus:not([focused]),input[type=button][toggles][active][focused=visible],input[type=button][toggles][focused=visible],input[type=submit]:focus:not([focused]),input[type=submit][cta]:focus:not([focused]),input[type=submit][cta][focused=visible],input[type=submit][focused=visible],input[type=submit][toggles]:focus:not([focused]),input[type=submit][toggles][active]:focus:not([focused]),input[type=submit][toggles][active][focused=visible],input[type=submit][toggles][focused=visible]{background-color:#f6f7f9;color:#141e29;box-shadow:0 0 0 2px #fff,0 0 0 4px #2336fd;border-color:#c0cadb;outline:0}button:hover,button[cta]:hover,button[toggles]:hover,button[toggles][active]:hover,input[type=button]:hover,input[type=button][cta]:hover,input[type=button][toggles]:hover,input[type=button][toggles][active]:hover,input[type=submit]:hover,input[type=submit][cta]:hover,input[type=submit][toggles]:hover,input[type=submit][toggles][active]:hover{background-color:#eceef4;color:#141e29;box-shadow:0 0 0 0 rgba(20,30,41,.08)}button:hover:not(:focus),button[cta]:hover:not(:focus),button[toggles]:hover:not(:focus),button[toggles][active]:hover:not(:focus),input[type=button]:hover:not(:focus),input[type=button][cta]:hover:not(:focus),input[type=button][toggles]:hover:not(:focus),input[type=button][toggles][active]:hover:not(:focus),input[type=submit]:hover:not(:focus),input[type=submit][cta]:hover:not(:focus),input[type=submit][toggles]:hover:not(:focus),input[type=submit][toggles][active]:hover:not(:focus){border-color:#848f9c;outline:0}}@media all{button:active,button[cta]:active,button[toggles]:active,button[toggles][active]:active,input[type=button]:active,input[type=button][cta]:active,input[type=button][toggles]:active,input[type=button][toggles][active]:active,input[type=submit]:active,input[type=submit][cta]:active,input[type=submit][toggles]:active,input[type=submit][toggles][active]:active{background-color:rgba(0,0,0,0);color:#141e29;box-shadow:0 0 0 0 rgba(20,30,41,.08)}button:active:not(:focus),button[cta]:active:not(:focus),button[toggles]:active:not(:focus),button[toggles][active]:active:not(:focus),input[type=button]:active:not(:focus),input[type=button][cta]:active:not(:focus),input[type=button][toggles]:active:not(:focus),input[type=button][toggles][active]:active:not(:focus),input[type=submit]:active:not(:focus),input[type=submit][cta]:active:not(:focus),input[type=submit][toggles]:active:not(:focus),input[type=submit][toggles][active]:active:not(:focus){border-color:#848f9c;outline:0}button[cta][disabled],button[disabled],button[toggles][active][disabled],button[toggles][disabled],input[type=button][cta][disabled],input[type=button][disabled],input[type=button][toggles][active][disabled],input[type=button][toggles][disabled],input[type=submit][cta][disabled],input[type=submit][disabled],input[type=submit][toggles][active][disabled],input[type=submit][toggles][disabled]{background-color:#eceef4;color:#9ca7b4;border-color:transparent;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0;pointer-events:none}}input:not([type]),input[type=date],input[type=email],input[type=file],input[type=month],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url],input[type=week]{font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;color:#323c48;border-radius:0;background-color:#fff;text-overflow:ellipsis;border:1px solid #848f9c;-webkit-appearance:none;-moz-appearance:none;appearance:none}input:not([type])[disabled],input[type=date][disabled],input[type=email][disabled],input[type=file][disabled],input[type=month][disabled],input[type=number][disabled],input[type=password][disabled],input[type=search][disabled],input[type=tel][disabled],input[type=text][disabled],input[type=url][disabled],input[type=week][disabled]{color:rgba(50,60,72,.5);border:1px solid rgba(132,143,156,.5)}input:not([type])[type=number],input[type=date][type=number],input[type=email][type=number],input[type=file][type=number],input[type=month][type=number],input[type=number][type=number],input[type=password][type=number],input[type=search][type=number],input[type=tel][type=number],input[type=text][type=number],input[type=url][type=number],input[type=week][type=number]{padding-right:0}input:not([type])[warning],input[type=date][warning],input[type=email][warning],input[type=file][warning],input[type=month][warning],input[type=number][warning],input[type=password][warning],input[type=search][warning],input[type=tel][warning],input[type=text][warning],input[type=url][warning],input[type=week][warning]{border:1px solid #ffbe42}input:not([type])[warning][disabled],input[type=date][warning][disabled],input[type=email][warning][disabled],input[type=file][warning][disabled],input[type=month][warning][disabled],input[type=number][warning][disabled],input[type=password][warning][disabled],input[type=search][warning][disabled],input[type=tel][warning][disabled],input[type=text][warning][disabled],input[type=url][warning][disabled],input[type=week][warning][disabled]{color:rgba(50,60,72,.5);border:1px solid rgba(255,190,66,.5)}input:not([type])[error],input:not([type])[error][warning],input[type=date][error],input[type=date][error][warning],input[type=email][error],input[type=email][error][warning],input[type=file][error],input[type=file][error][warning],input[type=month][error],input[type=month][error][warning],input[type=number][error],input[type=number][error][warning],input[type=password][error],input[type=password][error][warning],input[type=search][error],input[type=search][error][warning],input[type=tel][error],input[type=tel][error][warning],input[type=text][error],input[type=text][error][warning],input[type=url][error],input[type=url][error][warning],input[type=week][error],input[type=week][error][warning]{border:1px solid #b70300}input:not([type])[error][disabled],input:not([type])[error][warning][disabled],input[type=date][error][disabled],input[type=date][error][warning][disabled],input[type=email][error][disabled],input[type=email][error][warning][disabled],input[type=file][error][disabled],input[type=file][error][warning][disabled],input[type=month][error][disabled],input[type=month][error][warning][disabled],input[type=number][error][disabled],input[type=number][error][warning][disabled],input[type=password][error][disabled],input[type=password][error][warning][disabled],input[type=search][error][disabled],input[type=search][error][warning][disabled],input[type=tel][error][disabled],input[type=tel][error][warning][disabled],input[type=text][error][disabled],input[type=text][error][warning][disabled],input[type=url][error][disabled],input[type=url][error][warning][disabled],input[type=week][error][disabled],input[type=week][error][warning][disabled]{color:rgba(50,60,72,.5);border:1px solid rgba(183,3,0,.5)}input:not([type]) ::-ms-clear,input[type=date] ::-ms-clear,input[type=email] ::-ms-clear,input[type=file] ::-ms-clear,input[type=month] ::-ms-clear,input[type=number] ::-ms-clear,input[type=password] ::-ms-clear,input[type=search] ::-ms-clear,input[type=tel] ::-ms-clear,input[type=text] ::-ms-clear,input[type=url] ::-ms-clear,input[type=week] ::-ms-clear{display:none}input:not([type]):focus,input[type=date]:focus,input[type=email]:focus,input[type=file]:focus,input[type=month]:focus,input[type=number]:focus,input[type=password]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=url]:focus,input[type=week]:focus{background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#2336fd}input[type=file]::-webkit-file-upload-button{width:0;padding:0;margin:0;min-width:0;border:none;height:100%;font-family:inherit;font-size:12px}input[type=checkbox],input[type=radio]{display:inline-block;width:13px;height:13px;border-radius:0;background-color:#fff;margin:1px 0;transition:box-shadow 150ms,border-color 150ms;vertical-align:middle;box-shadow:inset 0 0 0 rgba(0,0,0,.25);border:1px solid #848f9c}input[type=checkbox]+label:not(:empty),input[type=radio]+label:not(:empty){vertical-align:middle;margin:1px 7px 1px 4px;display:inline-block}input[type=checkbox]:not([tabindex=\'-1\']):focus,input[type=radio]:not([tabindex=\'-1\']):focus{border-color:#2336fd;box-shadow:0 0 0 #2336fd}input[type=radio]{border-radius:100%}input[type=radio]:checked{background-image:radial-gradient(#2336fd 25%,transparent 30%);background-size:100%}input[type=checkbox]:checked{background:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTVweCIgaGVpZ2h0PSIxM3B4IiB2aWV3Qm94PSIwIDAgMTUgMTMiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJjaGVja2VkIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMy4wMDAwMDAsIC01LjAwMDAwMCkiPgogICAgICAgICAgICA8cmVjdCBpZD0iUmVjdGFuZ2xlIiB4PSIwIiB5PSIwIiB3aWR0aD0iMjIiIGhlaWdodD0iMjIiPjwvcmVjdD4KICAgICAgICAgICAgPHBhdGggZD0iTTUuMjQ4NTY0MTQsMTQuMjk5NDQ5NCBMOC45NjM0MjQ5OCwxNC4zMjUwMzI3IiBpZD0iTGluZSIgc3Ryb2tlPSIjNTM1REU5IiBzdHJva2Utd2lkdGg9IjMiIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDYuOTY4MjczLCAxNC44MTg4MTMpIHJvdGF0ZSg0MC4wMDAwMDApIHRyYW5zbGF0ZSgtNi45NjgyNzMsIC0xNC44MTg4MTMpICI+PC9wYXRoPgogICAgICAgICAgICA8cGF0aCBkPSJNMTEuOTYyNDIyNCw2LjgzNzY3NjYxIEwxMS45NjI0MjI0LDE3LjE0Nzk2MjIiIGlkPSJMaW5lIiBzdHJva2U9IiM1MzVERTkiIHN0cm9rZS13aWR0aD0iMyIgc3Ryb2tlLWxpbmVjYXA9InNxdWFyZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTIuMzQ1NzM5LCAxMi4xMTA0MzkpIHJvdGF0ZSg0MC4wMDAwMDApIHRyYW5zbGF0ZSgtMTIuMzQ1NzM5LCAtMTIuMTEwNDM5KSAiPjwvcGF0aD4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==) center center no-repeat #fff}input[type=checkbox]:indeterminate{background:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOHB4IiBoZWlnaHQ9IjhweCIgdmlld0JveD0iMCAwIDggOCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogICAgPGcgaWQ9IlBhZ2UtMSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgaWQ9ImluZGV0ZXJtaW5hdGUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC04LjAwMDAwMCwgLTcuMDAwMDAwKSI+CiAgICAgICAgICAgIDxyZWN0IGlkPSJSZWN0YW5nbGUiIHg9IjAiIHk9IjAiIHdpZHRoPSIyMiIgaGVpZ2h0PSIyMiI+PC9yZWN0PgogICAgICAgICAgICA8cmVjdCBpZD0iUmVjdGFuZ2xlIiBmaWxsPSIjNTM1REU5IiB4PSI4IiB5PSI3IiB3aWR0aD0iNy41IiBoZWlnaHQ9IjcuNSIgcng9IjEiPjwvcmVjdD4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==) center center no-repeat #fff}:host{--grid-header-height:28px;--grid-row-height:28px;--theme-name:\'elf-theme-ds\';--global-focus-bordercolor:#2336fd;--scrollbar-bgcolor:transparent;--grid-bordercolor:#dee2eb;--grid-title-bgcolor:#eceef4;--grid-title-txtcolor:#323c48;--grid-title-hover-txtcolor:#323c48;--grid-column-active-border-color:#2336fd;--grid-column-separator-bgcolor:#dbdfe9;--grid-row-txtcolor:#323c48;--grid-row-bgcolor:#ffffff;--grid-alt-row-bgcolor:#fafafa;--grid-highlight-txtcolor:#323c48;--grid-highlight-bgcolor:#f6f7f9;--grid-active-txtcolor:#323c48;--grid-selection-bgcolor:#eceef4;--grid-header-txtcolor:#323c48;--grid-header-bgcolor:#f7f7f7;--grid-tag-bg-color:#080a0c;--grid-expanded-tag-bg-color:#1d232a;--grid-active-bordercolor:#2336fd;--grid-active-bgcolor:#ffffff;--input-txtcolor:#323c48;--input-selection-txtcolor:currentColor;--input-selection-bgcolor:#B4D5FE;--grid-guideline-bgcolor:#2336fd;--grid-dragbox-bordercolor:#848f9c;--grid-dragbox-bgcolor:#ffffff;--grid-drag-indicator:dashed 1px #ffffff;--grid-title-sort-icon-color:#2336fd;--grid-title-icon-color:#3459ff;--grid-title-filter-icon-color:#2336fd;--grid-title-filter-icon-hover-color:#0014c2;--grid-title-dot-icon:#323c48;--grid-column-menu-icon-color:#ffffff;--grid-column-menu-icon-bgcolor:#3459ff;--grid-column-menu-icon-hover-bgcolor:#2336fd;--grid-row-menu-icon-color:#323c48;--grid-row-menu-icon-hover-color:#0014c2}@supports not selector(::-webkit-scrollbar){:host .grid-hscroll,:host .grid-vscroll{scrollbar-color:#7d7d7d transparent;scrollbar-width:thin}}:host .cell button,:host .cell input,:host .cell select,:host .cell textarea,:host ef-checkbox,:host input[type=checkbox]{margin:0}:host button,:host input[type=text],:host select{max-height:calc(var(--grid-row-height) - 6px)}:host select{width:100%}:host .cell button{min-width:unset}:host .title input[type=search]{width:100%;background-color:#fff;max-height:calc(var(--grid-row-height) - 6px)}:host .cell,:host .editing,:host .filter-input,:host .folder,:host .grid-pane,:host .sorting{touch-action:manipulation}:host .tr-lg .cell{padding:0 8px;padding:var(--grid-cell-padding,0 8px 0 8px)}:host .tr-grid .title .cell.sorting:hover,:host .tr-grid .title .sorting,:host .tr-grid .title .sorting:hover{color:#323c48}:host .tr-grid{background-color:inherit}:host .tr-grid .title .cell:hover{background-color:#c0cadb}:host .tr-grid .column.conditionally-colored .cell.highlighted-row,:host .tr-grid .column.conditionally-colored .cell.selected-row,:host .tr-grid .column.conditionally-colored .cell.selection,:host .tr-grid .column.heat-map .cell.highlighted-row,:host .tr-grid .column.heat-map .cell.selected-row,:host .tr-grid .column.heat-map .cell.selection,:host .tr-grid .selected-column.conditionally-colored .cell,:host .tr-grid .selected-column.heat-map .cell,:host .tr-grid .title .selected-column .cell,:host .tr-lg .cell.highlighted-row,:host .tr-lg .cell.selected-row,:host .tr-lg .selected-column .cell{background-image:none}:host .tr-lg .tr-stretched.folder,:host .tr-lg .tr-stretched.header{color:#323c48;background-color:#fff}:host .tr-lg .tr-stretched.folder:not(.closed),:host .tr-lg .tr-stretched.header:not(.closed){color:#141e29}:host .tr-lg .selected-column .cell{border-top-color:transparent}:host .tr-lg .cell.selected-row,:host .tr-lg .cell.selected-row.tr-stretched,:host .tr-lg .selected-column .cell{background-color:#eceef4}:host .tr-grid .section .tr-lg .cell.highlighted-row{background-color:#f6f7f9}:host .tr-grid .sortable-indicator{opacity:.5}:host .tr-grid .section.title .column.selected-column .cell:last-child{border-bottom-color:invalidColor}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#7d7d7d;border-radius:6px;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#7d7d7d}::-webkit-scrollbar-thumb:active{background:#7d7d7d}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#7d7d7d,#7d7d7d);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#7d7d7d,#7d7d7d);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#7d7d7d,#7d7d7d);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#7d7d7d,#7d7d7d);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#7d7d7d,#7d7d7d);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#7d7d7d,#7d7d7d);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid transparent;border-bottom:1px solid transparent}::-webkit-scrollbar-track:vertical{border-left:1px solid transparent;border-right:1px solid transparent}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat;height:16px;width:16px;display:none;border:1px solid transparent}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#eceef4;border:1px solid #eceef4}::-webkit-scrollbar-button:active{background-color:rgba(0,0,0,0);border:1px solid transparent}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:transparent;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#eceef4}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:transparent}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:transparent;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#eceef4}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:transparent}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:transparent;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#eceef4}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:transparent}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:transparent;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#eceef4}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:transparent}' }}));

package/lib/grid/themes/ds/light/es5/all-elements.js

@@ -0,0 +1,2 @@
+dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'efx-grid', styles: 'select{-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;font-size:12px;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-block;position:relative;vertical-align:middle;background:#fff;color:#323c48;border:1px solid #848f9c}select:focus{background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#2336fd}button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:4px;background-color:#f6f7f9;color:#141e29;border:1px solid #c0cadb;height:24px;box-shadow:0 0 0 0 rgba(20,30,41,.08);padding:0 12px;outline:0;font-family:inherit;font-size:12px;font-weight:400;min-width:60px;margin:1px 0;transition:120ms;text-align:center;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;vertical-align:bottom;position:relative;overflow:hidden}button[cta]{background-color:#2336fd;color:#fff;border-color:transparent;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}button[toggles]{background-color:#f6f7f9;color:#141e29;border-color:#c0cadb;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}button[toggles][active]{background-color:#141e29;color:#fff;border-color:transparent;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}textarea{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;color:#323c48;border-radius:0;background-color:#fff;text-overflow:ellipsis;border:1px solid #848f9c;resize:none;line-height:1.2;padding:calc((24px - 1px * 2 - 1em * 1.2)/ 2) 8px}textarea[disabled]{color:rgba(50,60,72,.5);border:1px solid rgba(132,143,156,.5)}textarea[type=number]{padding-right:0}textarea[warning]{border:1px solid #ffbe42}textarea[warning][disabled]{color:rgba(50,60,72,.5);border:1px solid rgba(255,190,66,.5)}textarea[error],textarea[error][warning]{border:1px solid #b70300}textarea[error][disabled],textarea[error][warning][disabled]{color:rgba(50,60,72,.5);border:1px solid rgba(183,3,0,.5)}textarea ::-ms-clear{display:none}textarea[cols]{width:auto}textarea[rows]{height:auto}textarea:focus{background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#2336fd}a{text-decoration:none;color:#0014c2}a:active{color:#0013b4}a:focus{outline:0}a:hover{text-decoration:underline;text-decoration-color:#2336fd;color:#2336fd;text-decoration-color:#2336fd}a:visited,a[alt]:visited{color:#646e7b}a[alt]{color:#0014c2}a[alt]:hover{color:#2336fd}input{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0;font-weight:400;text-align:left}input::-webkit-clear-button,input::-webkit-inner-spin-button,input::-webkit-search-cancel-button,input::-webkit-search-decoration{-webkit-appearance:none}input[type=button],input[type=submit]{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:4px;background-color:#f6f7f9;color:#141e29;border:1px solid #c0cadb;height:24px;box-shadow:0 0 0 0 rgba(20,30,41,.08);padding:0 12px;outline:0;font-family:inherit;font-size:12px;font-weight:400;min-width:60px;margin:1px 0;transition:120ms;text-align:center;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;vertical-align:bottom;position:relative;overflow:hidden}input[type=button][cta],input[type=submit][cta]{background-color:#2336fd;color:#fff;border-color:transparent;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}input[type=button][toggles],input[type=submit][toggles]{background-color:#f6f7f9;color:#141e29;border-color:#c0cadb;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}input[type=button][toggles][active],input[type=submit][toggles][active]{background-color:#141e29;color:#fff;border-color:transparent;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0}@media (-ms-high-contrast:none),(pointer:fine){button:focus:not([focused]),button[cta]:focus:not([focused]),button[cta][focused=visible],button[focused=visible],button[toggles]:focus:not([focused]),button[toggles][active]:focus:not([focused]),button[toggles][active][focused=visible],button[toggles][focused=visible],input[type=button]:focus:not([focused]),input[type=button][cta]:focus:not([focused]),input[type=button][cta][focused=visible],input[type=button][focused=visible],input[type=button][toggles]:focus:not([focused]),input[type=button][toggles][active]:focus:not([focused]),input[type=button][toggles][active][focused=visible],input[type=button][toggles][focused=visible],input[type=submit]:focus:not([focused]),input[type=submit][cta]:focus:not([focused]),input[type=submit][cta][focused=visible],input[type=submit][focused=visible],input[type=submit][toggles]:focus:not([focused]),input[type=submit][toggles][active]:focus:not([focused]),input[type=submit][toggles][active][focused=visible],input[type=submit][toggles][focused=visible]{background-color:#f6f7f9;color:#141e29;box-shadow:0 0 0 2px #fff,0 0 0 4px #2336fd;border-color:#c0cadb;outline:0}button:hover,button[cta]:hover,button[toggles]:hover,button[toggles][active]:hover,input[type=button]:hover,input[type=button][cta]:hover,input[type=button][toggles]:hover,input[type=button][toggles][active]:hover,input[type=submit]:hover,input[type=submit][cta]:hover,input[type=submit][toggles]:hover,input[type=submit][toggles][active]:hover{background-color:#eceef4;color:#141e29;box-shadow:0 0 0 0 rgba(20,30,41,.08)}button:hover:not(:focus),button[cta]:hover:not(:focus),button[toggles]:hover:not(:focus),button[toggles][active]:hover:not(:focus),input[type=button]:hover:not(:focus),input[type=button][cta]:hover:not(:focus),input[type=button][toggles]:hover:not(:focus),input[type=button][toggles][active]:hover:not(:focus),input[type=submit]:hover:not(:focus),input[type=submit][cta]:hover:not(:focus),input[type=submit][toggles]:hover:not(:focus),input[type=submit][toggles][active]:hover:not(:focus){border-color:#848f9c;outline:0}}@media all{button:active,button[cta]:active,button[toggles]:active,button[toggles][active]:active,input[type=button]:active,input[type=button][cta]:active,input[type=button][toggles]:active,input[type=button][toggles][active]:active,input[type=submit]:active,input[type=submit][cta]:active,input[type=submit][toggles]:active,input[type=submit][toggles][active]:active{background-color:rgba(0,0,0,0);color:#141e29;box-shadow:0 0 0 0 rgba(20,30,41,.08)}button:active:not(:focus),button[cta]:active:not(:focus),button[toggles]:active:not(:focus),button[toggles][active]:active:not(:focus),input[type=button]:active:not(:focus),input[type=button][cta]:active:not(:focus),input[type=button][toggles]:active:not(:focus),input[type=button][toggles][active]:active:not(:focus),input[type=submit]:active:not(:focus),input[type=submit][cta]:active:not(:focus),input[type=submit][toggles]:active:not(:focus),input[type=submit][toggles][active]:active:not(:focus){border-color:#848f9c;outline:0}button[cta][disabled],button[disabled],button[toggles][active][disabled],button[toggles][disabled],input[type=button][cta][disabled],input[type=button][disabled],input[type=button][toggles][active][disabled],input[type=button][toggles][disabled],input[type=submit][cta][disabled],input[type=submit][disabled],input[type=submit][toggles][active][disabled],input[type=submit][toggles][disabled]{background-color:#eceef4;color:#9ca7b4;border-color:transparent;box-shadow:0 0 0 0 rgba(20,30,41,.08);outline:0;pointer-events:none}}input:not([type]),input[type=date],input[type=email],input[type=file],input[type=month],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url],input[type=week]{font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;color:#323c48;border-radius:0;background-color:#fff;text-overflow:ellipsis;border:1px solid #848f9c;-webkit-appearance:none;-moz-appearance:none;appearance:none}input:not([type])[disabled],input[type=date][disabled],input[type=email][disabled],input[type=file][disabled],input[type=month][disabled],input[type=number][disabled],input[type=password][disabled],input[type=search][disabled],input[type=tel][disabled],input[type=text][disabled],input[type=url][disabled],input[type=week][disabled]{color:rgba(50,60,72,.5);border:1px solid rgba(132,143,156,.5)}input:not([type])[type=number],input[type=date][type=number],input[type=email][type=number],input[type=file][type=number],input[type=month][type=number],input[type=number][type=number],input[type=password][type=number],input[type=search][type=number],input[type=tel][type=number],input[type=text][type=number],input[type=url][type=number],input[type=week][type=number]{padding-right:0}input:not([type])[warning],input[type=date][warning],input[type=email][warning],input[type=file][warning],input[type=month][warning],input[type=number][warning],input[type=password][warning],input[type=search][warning],input[type=tel][warning],input[type=text][warning],input[type=url][warning],input[type=week][warning]{border:1px solid #ffbe42}input:not([type])[warning][disabled],input[type=date][warning][disabled],input[type=email][warning][disabled],input[type=file][warning][disabled],input[type=month][warning][disabled],input[type=number][warning][disabled],input[type=password][warning][disabled],input[type=search][warning][disabled],input[type=tel][warning][disabled],input[type=text][warning][disabled],input[type=url][warning][disabled],input[type=week][warning][disabled]{color:rgba(50,60,72,.5);border:1px solid rgba(255,190,66,.5)}input:not([type])[error],input:not([type])[error][warning],input[type=date][error],input[type=date][error][warning],input[type=email][error],input[type=email][error][warning],input[type=file][error],input[type=file][error][warning],input[type=month][error],input[type=month][error][warning],input[type=number][error],input[type=number][error][warning],input[type=password][error],input[type=password][error][warning],input[type=search][error],input[type=search][error][warning],input[type=tel][error],input[type=tel][error][warning],input[type=text][error],input[type=text][error][warning],input[type=url][error],input[type=url][error][warning],input[type=week][error],input[type=week][error][warning]{border:1px solid #b70300}input:not([type])[error][disabled],input:not([type])[error][warning][disabled],input[type=date][error][disabled],input[type=date][error][warning][disabled],input[type=email][error][disabled],input[type=email][error][warning][disabled],input[type=file][error][disabled],input[type=file][error][warning][disabled],input[type=month][error][disabled],input[type=month][error][warning][disabled],input[type=number][error][disabled],input[type=number][error][warning][disabled],input[type=password][error][disabled],input[type=password][error][warning][disabled],input[type=search][error][disabled],input[type=search][error][warning][disabled],input[type=tel][error][disabled],input[type=tel][error][warning][disabled],input[type=text][error][disabled],input[type=text][error][warning][disabled],input[type=url][error][disabled],input[type=url][error][warning][disabled],input[type=week][error][disabled],input[type=week][error][warning][disabled]{color:rgba(50,60,72,.5);border:1px solid rgba(183,3,0,.5)}input:not([type]) ::-ms-clear,input[type=date] ::-ms-clear,input[type=email] ::-ms-clear,input[type=file] ::-ms-clear,input[type=month] ::-ms-clear,input[type=number] ::-ms-clear,input[type=password] ::-ms-clear,input[type=search] ::-ms-clear,input[type=tel] ::-ms-clear,input[type=text] ::-ms-clear,input[type=url] ::-ms-clear,input[type=week] ::-ms-clear{display:none}input:not([type]):focus,input[type=date]:focus,input[type=email]:focus,input[type=file]:focus,input[type=month]:focus,input[type=number]:focus,input[type=password]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=url]:focus,input[type=week]:focus{background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#2336fd}input[type=file]::-webkit-file-upload-button{width:0;padding:0;margin:0;min-width:0;border:none;height:100%;font-family:inherit;font-size:12px}input[type=checkbox],input[type=radio]{display:inline-block;width:13px;height:13px;border-radius:0;background-color:#fff;margin:1px 0;transition:box-shadow 150ms,border-color 150ms;vertical-align:middle;box-shadow:inset 0 0 0 rgba(0,0,0,.25);border:1px solid #848f9c}input[type=checkbox]+label:not(:empty),input[type=radio]+label:not(:empty){vertical-align:middle;margin:1px 7px 1px 4px;display:inline-block}input[type=checkbox]:not([tabindex=\'-1\']):focus,input[type=radio]:not([tabindex=\'-1\']):focus{border-color:#2336fd;box-shadow:0 0 0 #2336fd}input[type=radio]{border-radius:100%}input[type=radio]:checked{background-image:radial-gradient(#2336fd 25%,transparent 30%);background-size:100%}input[type=checkbox]:checked{background:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTVweCIgaGVpZ2h0PSIxM3B4IiB2aWV3Qm94PSIwIDAgMTUgMTMiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJjaGVja2VkIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMy4wMDAwMDAsIC01LjAwMDAwMCkiPgogICAgICAgICAgICA8cmVjdCBpZD0iUmVjdGFuZ2xlIiB4PSIwIiB5PSIwIiB3aWR0aD0iMjIiIGhlaWdodD0iMjIiPjwvcmVjdD4KICAgICAgICAgICAgPHBhdGggZD0iTTUuMjQ4NTY0MTQsMTQuMjk5NDQ5NCBMOC45NjM0MjQ5OCwxNC4zMjUwMzI3IiBpZD0iTGluZSIgc3Ryb2tlPSIjNTM1REU5IiBzdHJva2Utd2lkdGg9IjMiIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDYuOTY4MjczLCAxNC44MTg4MTMpIHJvdGF0ZSg0MC4wMDAwMDApIHRyYW5zbGF0ZSgtNi45NjgyNzMsIC0xNC44MTg4MTMpICI+PC9wYXRoPgogICAgICAgICAgICA8cGF0aCBkPSJNMTEuOTYyNDIyNCw2LjgzNzY3NjYxIEwxMS45NjI0MjI0LDE3LjE0Nzk2MjIiIGlkPSJMaW5lIiBzdHJva2U9IiM1MzVERTkiIHN0cm9rZS13aWR0aD0iMyIgc3Ryb2tlLWxpbmVjYXA9InNxdWFyZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTIuMzQ1NzM5LCAxMi4xMTA0MzkpIHJvdGF0ZSg0MC4wMDAwMDApIHRyYW5zbGF0ZSgtMTIuMzQ1NzM5LCAtMTIuMTEwNDM5KSAiPjwvcGF0aD4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==) center center no-repeat #fff}input[type=checkbox]:indeterminate{background:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOHB4IiBoZWlnaHQ9IjhweCIgdmlld0JveD0iMCAwIDggOCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogICAgPGcgaWQ9IlBhZ2UtMSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgaWQ9ImluZGV0ZXJtaW5hdGUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC04LjAwMDAwMCwgLTcuMDAwMDAwKSI+CiAgICAgICAgICAgIDxyZWN0IGlkPSJSZWN0YW5nbGUiIHg9IjAiIHk9IjAiIHdpZHRoPSIyMiIgaGVpZ2h0PSIyMiI+PC9yZWN0PgogICAgICAgICAgICA8cmVjdCBpZD0iUmVjdGFuZ2xlIiBmaWxsPSIjNTM1REU5IiB4PSI4IiB5PSI3IiB3aWR0aD0iNy41IiBoZWlnaHQ9IjcuNSIgcng9IjEiPjwvcmVjdD4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==) center center no-repeat #fff}:host{--grid-header-height:28px;--grid-row-height:28px;--theme-name:\'elf-theme-ds\';--global-focus-bordercolor:#2336fd;--scrollbar-bgcolor:transparent;--grid-bordercolor:#dee2eb;--grid-title-bgcolor:#eceef4;--grid-title-txtcolor:#323c48;--grid-title-hover-txtcolor:#323c48;--grid-column-active-border-color:#2336fd;--grid-column-separator-bgcolor:#dbdfe9;--grid-row-txtcolor:#323c48;--grid-row-bgcolor:#ffffff;--grid-alt-row-bgcolor:#fafafa;--grid-highlight-txtcolor:#323c48;--grid-highlight-bgcolor:#f6f7f9;--grid-active-txtcolor:#323c48;--grid-selection-bgcolor:#eceef4;--grid-header-txtcolor:#323c48;--grid-header-bgcolor:#f7f7f7;--grid-tag-bg-color:#080a0c;--grid-expanded-tag-bg-color:#1d232a;--grid-active-bordercolor:#2336fd;--grid-active-bgcolor:#ffffff;--input-txtcolor:#323c48;--input-selection-txtcolor:currentColor;--input-selection-bgcolor:#B4D5FE;--grid-guideline-bgcolor:#2336fd;--grid-dragbox-bordercolor:#848f9c;--grid-dragbox-bgcolor:#ffffff;--grid-drag-indicator:dashed 1px #ffffff;--grid-title-sort-icon-color:#2336fd;--grid-title-icon-color:#3459ff;--grid-title-filter-icon-color:#2336fd;--grid-title-filter-icon-hover-color:#0014c2;--grid-title-dot-icon:#323c48;--grid-column-menu-icon-color:#ffffff;--grid-column-menu-icon-bgcolor:#3459ff;--grid-column-menu-icon-hover-bgcolor:#2336fd;--grid-row-menu-icon-color:#323c48;--grid-row-menu-icon-hover-color:#0014c2}@supports not selector(::-webkit-scrollbar){:host .grid-hscroll,:host .grid-vscroll{scrollbar-color:#7d7d7d transparent;scrollbar-width:thin}}:host .cell button,:host .cell input,:host .cell select,:host .cell textarea,:host ef-checkbox,:host input[type=checkbox]{margin:0}:host button,:host input[type=text],:host select{max-height:calc(var(--grid-row-height) - 6px)}:host select{width:100%}:host .cell button{min-width:unset}:host .title input[type=search]{width:100%;background-color:#fff;max-height:calc(var(--grid-row-height) - 6px)}:host .cell,:host .editing,:host .filter-input,:host .folder,:host .grid-pane,:host .sorting{touch-action:manipulation}:host .tr-lg .cell{padding:0 8px;padding:var(--grid-cell-padding,0 8px 0 8px)}:host .tr-grid .title .cell.sorting:hover,:host .tr-grid .title .sorting,:host .tr-grid .title .sorting:hover{color:#323c48}:host .tr-grid{background-color:inherit}:host .tr-grid .title .cell:hover{background-color:#c0cadb}:host .tr-grid .column.conditionally-colored .cell.highlighted-row,:host .tr-grid .column.conditionally-colored .cell.selected-row,:host .tr-grid .column.conditionally-colored .cell.selection,:host .tr-grid .column.heat-map .cell.highlighted-row,:host .tr-grid .column.heat-map .cell.selected-row,:host .tr-grid .column.heat-map .cell.selection,:host .tr-grid .selected-column.conditionally-colored .cell,:host .tr-grid .selected-column.heat-map .cell,:host .tr-grid .title .selected-column .cell,:host .tr-lg .cell.highlighted-row,:host .tr-lg .cell.selected-row,:host .tr-lg .selected-column .cell{background-image:none}:host .tr-lg .tr-stretched.folder,:host .tr-lg .tr-stretched.header{color:#323c48;background-color:#fff}:host .tr-lg .tr-stretched.folder:not(.closed),:host .tr-lg .tr-stretched.header:not(.closed){color:#141e29}:host .tr-lg .selected-column .cell{border-top-color:transparent}:host .tr-lg .cell.selected-row,:host .tr-lg .cell.selected-row.tr-stretched,:host .tr-lg .selected-column .cell{background-color:#eceef4}:host .tr-grid .section .tr-lg .cell.highlighted-row{background-color:#f6f7f9}:host .tr-grid .sortable-indicator{opacity:.5}:host .tr-grid .section.title .column.selected-column .cell:last-child{border-bottom-color:invalidColor}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#7d7d7d;border-radius:6px;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#7d7d7d}::-webkit-scrollbar-thumb:active{background:#7d7d7d}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#7d7d7d,#7d7d7d);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#7d7d7d,#7d7d7d);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#7d7d7d,#7d7d7d);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#7d7d7d,#7d7d7d);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#7d7d7d,#7d7d7d);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#7d7d7d,#7d7d7d);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid transparent;border-bottom:1px solid transparent}::-webkit-scrollbar-track:vertical{border-left:1px solid transparent;border-right:1px solid transparent}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat;height:16px;width:16px;display:none;border:1px solid transparent}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#eceef4;border:1px solid #eceef4}::-webkit-scrollbar-button:active{background-color:rgba(0,0,0,0);border:1px solid transparent}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:transparent;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#eceef4}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:transparent}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:transparent;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#eceef4}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:transparent}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:transparent;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#eceef4}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:transparent}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:transparent;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#eceef4}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29),linear-gradient(#141e29,#141e29);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:transparent}' }}));
+

package/lib/grid/themes/ds/light/imports/all-elements.js

@@ -0,0 +1 @@
+import '../efx-grid.js';

package/lib/grid/themes/ds/light/imports/custom-elements.js

@@ -0,0 +1 @@
+import '../efx-grid.js';