canvasxpress-cli 58.8.1 → 58.9.0

package/src/canvasXpress.css

@@ -91,6 +91,13 @@
   --cx-callout-border-width: 1px;
   --cx-callout-background-color: var(--cx-color-ui-background);
   --cx-callout-border-color: var(--cx-color-widgets);
+  /* Grid */
+  --cx-grid-background-color: var(--cx-color-ui-background);
+  --cx-grid-border-color: var(--cx-color-widgets);
+  --cx-grid-border-style: var(--cx-border-style);
+  --cx-grid-banner-background-color: var(--cx-color-widgets);
+  --cx-grid-toolbar-background-color: var(--cx-color-ui-background);
+  --cx-grid-search-background-color: var(--cx-color-ui-background);
 }
 
 *,
@@ -118,24 +125,21 @@ div.cX-bin-container,
 div.cX-bin-name-container,
 table.cX-bin-table,
 span.cX-bin,
-div.CanvasXpressDataTable,
-div.CanvasXpressDataTableToolbar,
-div.CanvasXpressDataTableContainer,
-div.CanvasXpressDataTableVertical,
-div.CanvasXpressDataTableHorizontal,
-div.CanvasXpressDataTableMask,
-img.CanvasXpressDataTableToolbarImage,
-svg.CanvasXpressDataTableToolbarImage,
-img.CanvasXpressDataTableToolbarImageNB,
-svg.CanvasXpressDataTableToolbarImageNB,
-svg.CanvasXpressDataTableToolbarImageLogo,
-table.CanvasXpressDataTable,
-th.CanvasXpressTableCellHead,
-th.CanvasXpressTableCellHeadActive,
-td.CanvasXpressTableCell,
-td.CanvasXpressTableCellActive,
-a.CanvasXpressTableCellHead,
-a.CanvasXpressTableCellHeadActive,
+div.cX-DataTable,
+div.cX-DataTable-Root,
+div.cX-DataTable-Vertical-Scrollbar,
+div.cX-DataTable-Horizontal-Scrollbar,
+div.cX-DataTable-Header-Viewport,
+img.cX-DataTable-Toolbar-Image,
+svg.cX-DataTable-Toolbar-Image,
+svg.cX-DataTable-Toolbar-Image-Logo,
+table.cX-DataTable,
+th.cX-DataTable-Cell-Head,
+th.cX-DataTable-Cell-Head-Active,
+td.cX-DataTable-Cell,
+td.cX-DataTable-Cell-Active,
+a.cX-DataTable-Cell-Head,
+a.cX-DataTable-Cell-Head-Active,
 div.CanvasXpressDataFilter,
 div.CanvasXpressDataFilterToolbar,
 div.CanvasXpressDataFilterHead,
@@ -2059,14 +2063,14 @@ div.CanvasXpressAltTooltip {
  * Data Table DOE *
  ******************/
 
-table.CanvasXpressDataTableDOE {
+table.cX-DataTable-DOE {
   border-spacing: 0 !important;
   font-size: var(--cx-font-size) !important;
   padding: 0 !important;
   border: none !important;
 }
 
-th.CanvasXpressDataTableDOE {
+th.cX-DataTable-DOE {
   padding: 0 !important;
   font-size: var(--cx-font-size) !important;
   font-weight: bold !important;
@@ -2080,7 +2084,7 @@ th.CanvasXpressDataTableDOE {
   border: none !important;
 }
 
-td.CanvasXpressDataTableDOE {
+td.cX-DataTable-DOE {
   padding: 0 !important;
   font-size: var(--cx-font-size) !important;
   padding-left: 5px !important;
@@ -2093,284 +2097,350 @@ td.CanvasXpressDataTableDOE {
   border: none !important;
 }
 
-tr.CanvasXpressDataTableDOE {
+tr.cX-DataTable-DOE {
   font-size: var(--cx-font-size) !important;
 }
 
 /****************/
-/*     Grid     */
+/*  Data Table  */
 /****************/
 
-div.cX-Grid {
-  border: var(--cx-border);
-  border-radius: 5px;
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-  overflow: hidden;
+div.cX-DataTable {
+  box-sizing: border-box;
   position: relative;
 }
 
-div.cX-Grid-Banner {
-  display: flex;
+div.cX-DataTable-Root,
+div.cX-DataTable-Vertical-Scrollbar,
+div.cX-DataTable-Horizontal-Scrollbar,
+div.cX-DataTable-Header-Viewport {
+  box-sizing: border-box;
+  position: absolute;
 }
 
-div.cX-Grid-Root {
-  display: flex;
-  flex: 1 1 auto;
-  flex-direction: row;
-  height: 0;
-  min-height: 0;
+
+div.cX-DataTable-Vertical-Scrollbar,
+div.cX-DataTable-Horizontal-Scrollbar {
+  background-color: var(--cx-background-widgets-color);
 }
 
-div.cX-Grid-Status {
-  border-top: var(--cx-border);
-  display: flex;
-  justify-content: space-between;
-  line-height: 1.5;
+div.cX-DataTable {
+  background-color: var(--cx-grid-background-color);
+  border-color: var(--cx-grid-border-color);
+  border-radius: var(--cx-border-radius);
+  border-style: var(--cx-grid-border-style);
+  border-width: 1px;
+  clear: both;
   overflow: hidden;
-  padding-left: 32px;
-  padding-right: 32px;
+  z-index: 10001;
 }
 
-div.cX-Grid-Pagination {
-  align-items: center;
-  border-top: var(--cx-border);
+div.cX-DataTable-Banner {
+  /* background-color: var(--cx-grid-banner-background-color); */
+  background-color: var(--cx-background-color);
+  border-bottom: 1px var(--cx-grid-border-style) var(--cx-grid-border-color);
   display: flex;
-  gap: 32px;
-  height: 42px;
-  justify-content: flex-end;
-  padding: 0 16px;
+  align-items: center;
 }
 
-/****************/
-/*  Data Table  */
-/****************/
+div.cX-DataTable-Logo {
+  margin: none;
+}
 
-div.CanvasXpressDataTableUpload {
-  border: 1px solid rgba(35, 82, 124, 0.2);
-  border-radius: 6px;
-  margin: -1px;
-  background-image: url('data:image/png;base64,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');
-  background-size: contain;
-  background-repeat: no-repeat;
-  position: relative;
+div.cX-DataTable-Search {
+  margin-left: auto;
 }
 
-div.CanvasXpressDataTable,
-div.CanvasXpressDataTableToolbar,
-div.CanvasXpressDataTableContainer,
-div.CanvasXpressDataTableVertical,
-div.CanvasXpressDataTableHorizontal,
-div.CanvasXpressDataTableMask {
-  box-sizing: border-box;
-  position: absolute;
+input.cX-DataTable-Search {
+  background-color: var(--cx-grid-search-background-color);
+  border: 1px var(--cx-grid-border-style) var(--cx-grid-border-color);
+  border-radius: var(--cx-border-radius);
+  color: var(--cx-font-color);
+  margin-right: 8px;
+  padding: 2px;
+  outline: none;
+  font-size: 14px;
+  display: flex;
 }
 
-div.CanvasXpressDataTable,
-div.CanvasXpressDataTableToolbar,
-div.CanvasXpressDataTableVertical,
-div.CanvasXpressDataTableHorizontal {
+input[type="search"]::-webkit-search-cancel-button.cX-DataTable-Search {
+  -webkit-appearance: auto;
   color: var(--cx-font-color);
-  background-color: var(--cx-background-widgets-color)
+  height: 16px;
+  width: 16px;
 }
 
-div.CanvasXpressDataTable {
-  border: var(--cx-border);
+div.cX-DataTable-Toolbar {
+  background-color: var(--cx-grid-toolbar-background-color);
+  border-bottom: 1px var(--cx-grid-border-style) var(--cx-grid-border-color);
+}
+
+img.cX-DataTable-Toolbar-Image,
+svg.cX-DataTable-Toolbar-Image {
+  background: var(--cx-color-transparent) !important;
   border-radius: 5px;
-  clear: both;
-  overflow: hidden;
+  padding: 2px;
+  box-shadow: 0 0 0px var(--cx-color-transparent) !important;
+  cursor: pointer;
+  float: right;
+  margin: 5px 8px 0px 0px !important;
 }
 
-div.CanvasXpressDataTableToolbar {
-  border-bottom: var(--cx-border);
-  border-radius: 5px 5px 0px 0px;
-  height: 36px;
-  left: 0px;
-  line-height: 100%;
-  top: 0px;
+img.cX-DataTable-Toolbar-Image,
+svg.cX-DataTable-Toolbar-Image {
+  border: var(--cx-border) !important;
 }
 
-div.CanvasXpressDataTableContainer {
-  border-radius: 0px 0px 5px 5px;
-  display: block;
-  left: 0px;
-  line-height: 100%;
+img.cX-DataTable-Toolbar-Image-Logo,
+svg.cX-DataTable-Toolbar-Image-Logo {
+  border: none !important;
+  float: left;
+  margin: 5px 0px 0px 10px !important;
+}
+
+div.cX-DataTable-Root {
+  border: none;
+}
+
+div.cX-DataTable-Header-Viewport {
+  border-bottom: 1px var(--cx-grid-border-style) var(--cx-grid-border-color);
+  border-left: none;
+  border-right: 1px var(--cx-grid-border-style) var(--cx-grid-border-color);
+  border-top: none;
+  overflow: hidden;
+  z-index: 1;
 }
 
-div.CanvasXpressDataTableVertical {
+div.cX-DataTable-Vertical-Scrollbar {
   overflow-x: hidden;
   overflow-y: auto;
-  right: 6px;
+  right: 5px;
   top: 2px;
   width: 16px;
 }
 
-div.CanvasXpressDataTableHorizontal {
-  bottom: 12px;
+img.cX-DataTable-Vertical-Scrollbar-Image {
+  max-height: unset !important;
+  height: revert-layer !important;
+}
+
+div.cX-DataTable-Horizontal-Scrollbar {
+  bottom: 5px;
   height: 16px;
   left: 2px;
   overflow-x: auto;
   overflow-y: hidden;
 }
 
-div.CanvasXpressDataTableMask {
-  border: 0px;
-  top: 0px;
-  overflow: hidden;
+img.cX-DataTable-Horizontal-Scrollbar-Image {
+  max-width: unset !important;
 }
 
-img.CanvasXpressDataTableToolbarImage,
-svg.CanvasXpressDataTableToolbarImage,
-img.CanvasXpressDataTableToolbarImageNB,
-svg.CanvasXpressDataTableToolbarImageNB {
-  background: var(--cx-color-transparent) !important;
-  border-radius: 5px;
-  padding: 2px;
-  box-shadow: 0 0 0px var(--cx-color-transparent) !important;
-  cursor: pointer;
-  float: right;
-  margin: 5px 8px 0px 0px !important;
+div.cX-DataTable-Status {
+  background-color: var(--cx-background-color);
+  border-top: 1px var(--cx-grid-border-style) var(--cx-grid-border-color);
+  position: relative;
+  align-items: center;
+  display: flex;
 }
 
-img.CanvasXpressDataTableToolbarImage,
-svg.CanvasXpressDataTableToolbarImage {
-  border: var(--cx-border) !important;
+span.cX-DataTable-Dimensions {
+  display: flex;
+  align-items: center;
+  margin-left: 30px;
+  font-size: medium;
 }
 
-img.CanvasXpressDataTableToolbarImageNB,
-svg.CanvasXpressDataTableToolbarImageNB {
-  border: none !important;
+div.cX-DataTable-Pagination {
+  background-color: var(--cx-background-color);
+  border-top: 1px var(--cx-grid-border-style) var(--cx-grid-border-color);
+  position: relative;
+  align-items: center;
+  display: flex;
 }
 
-img.CanvasXpressDataTableToolbarImageLogo,
-svg.CanvasXpressDataTableToolbarImageLogo {
-  border: none !important;
-  float: left;
-  margin: 5px 0px 0px 10px !important;
+span.cX-DataTable-Pagination-Size {
+  display: flex;
+  align-items: center;
+  margin-left: auto;
+  gap: 10px;
 }
 
-
-img.CanvasXpressDataTableVertical {
-  max-height: unset !important;
-  height: revert-layer !important;
+span.cX-DataTable-Pagination-Rows {
+  display: flex;
+  align-items: center;
+  margin: auto;
+  gap: 10px;
 }
 
-img.CanvasXpressDataTableHorizontal {
-  max-width: unset !important;
+span.cX-DataTable-Pagination-Controls {
+  margin-right: auto;
+  display: flex;
+  align-items: center;
+  gap: 10px;
 }
 
-table.CanvasXpressDataTable {
-  border: 0px;
-  border-spacing: 1px;
+/* Data Table Table */
+
+table.cX-DataTable {
+  border: none !important;
   color: var(--cx-font-color);
-  left: 1px;
   position: absolute;
-  opacity: 0.95;
   table-layout: fixed;
-  top: 1px;
 }
 
-th.CanvasXpressTableCellHead,
-th.CanvasXpressTableCellHeadActive {
+tr.cX-DataTable-Row,
+tr.cX-DataTable-Row-Active {
+  display: flex;
+  align-content: center;
+  position: relative;
+}
+
+/* Data Table Header th */
+
+th.cX-DataTable-Cell-Head,
+th.cX-DataTable-Cell-Head-Active {
+  background: var(--cx-background-accent-color);
   border-top: none;
   border-bottom: var(--cx-border-transparent);
   border-left: none;
   border-right: var(--cx-border-transparent);
-  font-weight: normal;
-  opacity: 0.95;
-  padding: 2px;
-  vertical-align: middle;
+  color: var(--cx-font-color);
+  cursor: pointer;
+  font: var(--cx-x-large-font);
+  font-weight: bold;
+  padding: 0 3px 0 0 !important;
+  vertical-align: middle !important;
+  display: flex;
+  width: unset !important;
+  position: relative;
 }
 
-tr > th.CanvasXpressTableCell:last-child,
-tr > th.CanvasXpressTableCellActive:last-child {
-  border-right: var(--cx-border-transparent);
+th.cX-DataTable-Cell-Head > div.cX-DataTable-Cell,
+th.cX-DataTable-Cell-Head-Active > div.cX-DataTable-Cell,
+th.cX-DataTable-Cell-Head > div.cX-DataTable-Cell-Number,
+th.cX-DataTable-Cell-Head-Active > div.cX-DataTable-Cell-Number {
+  align-content: center;
+  overflow: hidden;
 }
 
-th.CanvasXpressTableCellHead {
-  background: var(--cx-background-accent-color);
-  font: var(--cx-x-large-font);
-  font-weight: normal;
-  color: var(--cx-font-color);
+a.cX-DataTable-Cell-Header-Menu {
+  cursor: pointer;
+  font-style: normal !important;
+  position: absolute;
+  text-decoration: none;
+  width: 8px;
+  margin: auto;
+  display: flex;
+  padding-left: 1px;
+  top: 0;
 }
 
-th.CanvasXpressTableCellHeadActive {
-  background: var(--cx-background-accent-color);
-  font: var(--cx-x-large-font);
-  font-weight: normal;
-  color: var(--cx-font-color);
+div.cX-DataTable-Cell a.cX-DataTable-Cell-Header-Menu {
+  right: 10px;
+  left: auto;
+}
+
+div.cX-DataTable-Cell-Number a.cX-DataTable-Cell-Header-Menu {
+  right: auto;
+  left: 3px;
 }
 
-a.CanvasXpressTableCellHead,
-a.CanvasXpressTableCellHeadActive {
+a.cX-DataTable-Cell-Header-Menu:hover {
+  transform: scale(1.8);
+}
+
+div.cX-DataTable-Cell-Header-Sort {
   cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
   position: absolute;
-  right: 8px;
-  white-space: normal;
-  text-decoration: none;
-  font-style: normal;
-  width: 14px;
+  top: 50%;
+  transform: translateY(-50%);
 }
 
-a.CanvasXpressTableCellHead {
-  color: var(--cx-font-color);
+div.cX-DataTable-Cell div.cX-DataTable-Cell-Header-Sort {
+  right: 16px;
+  left: auto;
 }
 
-a.CanvasXpressTableCellHeadActive {
-  color: var(--cx-background-color);
+div.cX-DataTable-Cell-Number div.cX-DataTable-Cell-Header-Sort {
+  left: 13px;
+  right: auto;
+}
+
+span.cX-DataTable-Cell-Header-Resize {
+  background: var(--cx-background-accent-color);
+  cursor: col-resize;
+  position: absolute;
+  right: 0;
+  top: 35%;
+  width: 3px;
+  height: 30%;
 }
 
-td.CanvasXpressTableCell,
-td.CanvasXpressTableCellActive {
+/* Data Table Cells td */
+
+td.cX-DataTable-Cell,
+td.cX-DataTable-Cell-Active {
   border-top: none !important;
   border-bottom: var(--cx-border-transparent);
   border-left: none !important;
   border-right: var(--cx-border-transparent);
   font: var(--cx-x-large-font);
   color: var(--cx-font-color);
-  padding: 2px !important;
+  padding: 0 3px 0 0 !important;
   vertical-align: middle;
+  width: unset !important;
+  position: relative;
 }
 
-tr > td.CanvasXpressTableCell:last-child,
-tr > td.CanvasXpressTableCellActive:last-child {
-  border-right: var(--cx-border-transparent);
-}
-
-div.CanvasXpressTableCell,
-div.CanvasXpressTableCellLink {
+div.cX-DataTable-Cell,
+div.cX-DataTable-Cell-Number,
+div.cX-DataTable-Cell-Link {
   box-sizing: border-box;
   color: var(--cx-font-color);
-  margin: 2px 2px 1px 5px;
+  margin: 0px !important;
   overflow: hidden;
   position: relative;
-  text-align: left;
   white-space: pre-wrap;
   word-break: break-word;
 }
 
-div.CanvasXpressTableCell:hover {
-  background-color: var(--cx-background-hover-color);
+div.cX-DataTable-Cell,
+div.cX-DataTable-Cell-Link {
+  padding-left: 15px;
+  text-align: left;
 }
 
-div.CanvasXpressTableCellLink:hover {
-  background-color: var(--cx-background-hover-color);
-  text-decoration: underline var(--cx-border);
-  cursor: pointer;
+div.cX-DataTable-Cell-Number {
+  padding-right: 15px;
+  text-align: right;
 }
 
-th.CanvasXpressTableCellHead div.CanvasXpressTableCell,
-th.CanvasXpressTableCellHeadActive div.CanvasXpressTableCell {
-  border-radius: 5px;
+div.cX-DataTable-Cell-Link {
+  text-decoration: underline var(--cx-border);
+  text-underline-offset: 2px;
+  cursor: pointer;
 }
 
-th.CanvasXpressTableCellHead div.CanvasXpressTableCell {
-  /* border: var(--cx-border-transparent); */
+td.cX-DataTable-Cell > div.cX-DataTable-Cell:hover,
+td.cX-DataTable-Cell > div.cX-DataTable-Cell-Number:hover {
+  background-color: var(--cx-background-hover-color);
 }
 
-th.CanvasXpressTableCellHeadActive div.CanvasXpressTableCell {
-  /* border: var(--cx-border) */
+div.cX-DataTable-Upload {
+  top: 0px;
+  left: 0px;
+  border: 1px solid rgba(35, 82, 124, 0.2);
+  border-radius: 6px;
+  margin: -1px;
+  background-image: url('data:image/png;base64,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');
+  background-size: contain;
+  background-repeat: no-repeat;
+  background-color: #ffffff;
+  position: relative;
 }
 
 /***************/
@@ -2604,6 +2674,7 @@ div.CanvasXpressToggle {
   border: none;
   margin: 5px;
   height: 18px;
+  font-size: medium;
 }
 
 label.CanvasXpressToggle {
@@ -2875,8 +2946,8 @@ input[type=number]::-webkit-inner-spin-button {
 
 /* All scrollbar buttons*/
 
-div.CanvasXpressDataTableHorizontal::-webkit-scrollbar-button,
-div.CanvasXpressDataTableVertical::-webkit-scrollbar-button,
+div.cX-DataTable-Horizontal-Scrollbar::-webkit-scrollbar-button,
+div.cX-DataTable-Vertical-Scrollbar::-webkit-scrollbar-button,
 /*div.CanvasXpressDataFilterContent::-webkit-scrollbar-button,*/
 div.CanvasXpressDataFilterContainerMask::-webkit-scrollbar-button,
 div.CanvasXpressDataFilterContainerMaskNoOverflow::-webkit-scrollbar-button,
@@ -2903,8 +2974,8 @@ select.CanvasXpressSlider::-webkit-scrollbar-track {
   background-color: rgb(255, 255, 255);
 }
 
-div.CanvasXpressDataTableHorizontal::-webkit-scrollbar-track,
-div.CanvasXpressDataTableVertical::-webkit-scrollbar-track,
+div.cX-DataTable-Horizontal-Scrollbar::-webkit-scrollbar-track,
+div.cX-DataTable-Vertical-Scrollbar::-webkit-scrollbar-track,
 div.CanvasXpressDataExplorer::-webkit-scrollbar-track,
 div.CanvasXpressDataCustomizer::-webkit-scrollbar-track,
 div.CanvasXpressConfiguratorExample::-webkit-scrollbar-track,
@@ -2915,8 +2986,8 @@ div.cX-bin-name-container::-webkit-scrollbar-track {
 
 /* All tracks -hovers */
 
-div.CanvasXpressDataTableHorizontal::-webkit-scrollbar-track:hover,
-div.CanvasXpressDataTableVertical::-webkit-scrollbar-track:hover,
+div.cX-DataTable-Horizontal-Scrollbar::-webkit-scrollbar-track:hover,
+div.cX-DataTable-Vertical-Scrollbar::-webkit-scrollbar-track:hover,
 /*div.CanvasXpressDataFilterContent::-webkit-scrollbar-track:hover,*/
 div.CanvasXpressDataFilterContainerMask::-webkit-scrollbar-track:hover,
 div.CanvasXpressDataFilterContainerMaskNoOverflow::-webkit-scrollbar-track:hover,
@@ -2945,8 +3016,8 @@ select.CanvasXpressSlider::-webkit-scrollbar {
   background-color: rgb(255, 255, 255);
 }
 
-div.CanvasXpressDataTableHorizontal::-webkit-scrollbar,
-div.CanvasXpressDataTableVertical::-webkit-scrollbar,
+div.cX-DataTable-Horizontal-Scrollbar::-webkit-scrollbar,
+div.cX-DataTable-Vertical-Scrollbar::-webkit-scrollbar,
 div.CanvasXpressDataExplorer::-webkit-scrollbar,
 div.CanvasXpressDataCustomizer::-webkit-scrollbar,
 div.CanvasXpressConfiguratorExample::-webkit-scrollbar,
@@ -2959,8 +3030,8 @@ div.cX-bin-name-container::-webkit-scrollbar {
 
 /* All tracks thumbs */
 
-div.CanvasXpressDataTableHorizontal::-webkit-scrollbar-thumb,
-div.CanvasXpressDataTableVertical::-webkit-scrollbar-thumb,
+div.cX-DataTable-Horizontal-Scrollbar::-webkit-scrollbar-thumb,
+div.cX-DataTable-Vertical-Scrollbar::-webkit-scrollbar-thumb,
 /*div.CanvasXpressDataFilterContent::-webkit-scrollbar-thumb,*/
 div.CanvasXpressDataFilterContainerMask::-webkit-scrollbar-thumb,
 div.CanvasXpressDataFilterContainerMaskNoOverflow::-webkit-scrollbar-thumb,