@bryntum/grid-thin-trial 7.2.4 → 7.3.1

package/README.md

@@ -80,7 +80,6 @@ The **Thin package** contains only product-specific code and styling, making it
 * [Angular](https://angularjs.org/): `>= 9.0.0`
 * [React](https://react.dev/): `>= 16.0.0`
 * [Vue](https://vuejs.org/): `>= 3.0.0`
-* [Ionic](https://ionicframework.com/): `>= 5.0.0`
 * [Vite](https://vite.dev/): `>= 4.0.0`
 * [Webpack](https://webpack.js.org/): `>= 4.0.0`
 

package/fluent2-dark.css

@@ -147,6 +147,22 @@
 
     /* TaskBoard */
     --b-task-board-column-header-font-weight     : 600;
+
+    /* Heat map values ranging from lowest to highest intensity to create
+     * background colors to indicate how "hot" an element is, for example
+     * based on the number of events in a calendar cell.
+     */
+     /*
+      * Start color for the heatmap, representing the lowest intensity (e.g. 1 event in a calendar cell).
+      */
+    --b-heatmap-start          : oklab(0.53 -0.03 0.1);
+
+    /*
+     * End color for the heatmap, representing the highest intensity (e.g. 10 or more events in a calendar cell).
+     */
+    --b-heatmap-end            : oklab(0.38 0.13 0.03);
+
+    --b-heatmap-mix-blend-mode : hard-light;
 }
 
 /* Shades of primary color have to be specified per widget, for color-mix to work as intended */

package/grid.css

@@ -732,7 +732,7 @@
   --b-region-resize-button-color: var(--b-splitter-button-icon-color);
   --b-region-resize-splitter-hover-color: var(--b-splitter-hover-color);
   --b-region-resize-button-hover-color: var(--b-splitter-button-hover-color);
-  --bi-grid-splitter-button-size: 1em;
+  --bi-grid-splitter-button-size: var(--b-splitter-button-size, 1em);
   --bi-grid-splitter-button-display: flex;
 }
 .b-grid-base.b-split {
@@ -753,7 +753,7 @@
 }
 @media (any-pointer: coarse) {
   .b-grid-splitter {
-    --bi-grid-splitter-button-size: 1.3em;
+    --bi-grid-splitter-button-size: var(--b-splitter-touch-button-size, 1.3em);
   }
 }
 .b-split .b-grid-splitter {
@@ -785,7 +785,7 @@
   align-items: center;
   opacity: 0;
   transition: opacity .2s;
-  display: var(--bi-grid-splitter-button-display);
+  display: flex;
   width: var(--b-region-resize-splitter-width-hover);
 }
 .b-grid-base.b-split .b-grid-splitter:where(:not(.b-disabled)).b-grid-splitter-collapsed {
@@ -809,7 +809,7 @@
   visibility: hidden;
 }
 .b-grid-base.b-split .b-grid-splitter:where(:not(.b-disabled)) .b-grid-splitter-buttons {
-  display: flex;
+  display: var(--bi-grid-splitter-button-display);
   position: absolute;
   translate: 0 -50%;
   height: 2.4em;
@@ -1236,27 +1236,19 @@
 }
 
 /* lib/Grid/feature/StickyCells.css */
-.b-sticky-cells .b-grid-sticky-row {
-  position: absolute;
-  top: 0;
-  left: 0;
-  min-width: auto;
-  border: 0 none;
-  padding: 0;
-  contain: initial;
-}
-.b-sticky-cells .b-grid-sticky-row .b-grid-cell {
-  width: min-content;
-  contain: initial;
-  padding: 0;
-  border: 0 none;
+.b-sticky-cells {
+  --b-grid-cell-padding-block: var(--b-widget-padding);
 }
-.b-sticky-cells .b-sticky-cells-current-top-row .b-sticky-content-el {
-  visibility: hidden;
+.b-sticky-cells .b-sticky-cell-content {
+  width: 100%;
+  will-change: transform;
+  align-items: center;
+  display: inherit;
+  text-align: inherit;
+  justify-content: inherit;
 }
-.b-sticky-cells .b-sticky-cells-current-top-row.b-not-enough-height .b-sticky-content-el {
-  visibility: visible;
-  align-self: flex-end;
+.b-sticky-cells .b-tree-cell .b-sticky-cell-content {
+  align-self: center;
 }
 
 /* lib/Grid/feature/Stripe.css */
@@ -1666,12 +1658,6 @@ html.b-print-root,
 .b-grid-panel-body:not(.b-auto-height) > .b-grid-body-container > .b-grid-vertical-scroller {
   min-height: 100%;
 }
-.b-grid-base.b-enable-sticky .b-sticky-cell,
-.b-grid-base.b-enable-sticky .b-grid-sub-grid,
-.b-grid-base.b-enable-sticky .b-grid-vertical-scroller,
-.b-grid-base.b-enable-sticky .b-grid-row {
-  overflow: visible !important;
-}
 .b-grid-base > .b-panel-body-wrap {
   --b-toolbar-background: var(--b-grid-toolbar-background);
 }
@@ -2330,6 +2316,9 @@ div.b-grid-header-container .b-yscroll-pad {
   width: var(--bi-percent-bar-value);
   transition: var(--bi-percent-column-transition);
 }
+.b-sticky-cell-content .b-percent-bar-outer {
+  height: var(--b-percent-column-bar-max-height);
+}
 .b-percent-bar-value {
   display: flex;
   align-items: center;
@@ -2463,6 +2452,7 @@ div.b-grid-header-container .b-yscroll-pad {
   --b-tree-line-width: 2px;
   --b-tree-line-color: var(--b-neutral-85);
   --b-tree-line-offset: .45em;
+  --b-tree-empty-parent-icon-opacity: .5;
 }
 .b-internal {
   --b-tree-level: null;
@@ -2522,7 +2512,8 @@ div.b-grid-header-container .b-yscroll-pad {
   margin-inline-start: .1em;
 }
 :is(.b-icon-tree-expand, .b-icon-tree-collapse).b-empty-parent {
-  visibility: hidden;
+  pointer-events: none;
+  opacity: var(--b-tree-empty-parent-icon-opacity);
 }
 :is(.b-icon-tree-expand, .b-icon-tree-collapse):before {
   font-size: var(--b-tree-expander-icon-font-size);