handsontable 16.0.1 → 16.1.0-next-91b8a0f-20250905

package/styles/handsontable.css

@@ -25,8 +25,8 @@
  * INDIRECT, SPECIAL, INCIDENTAL, OR CONSEQUENTIAL DAMAGES OF ANY CHARACTER ARISING FROM
  * USE OR INABILITY TO USE THIS SOFTWARE.
  *
- * Version: 16.0.1
- * Release date: 10/07/2025 (built at 10/07/2025 10:59:04)
+ * Version: 16.1.0-next-91b8a0f-20250905
+ * Release date: 11/09/2025 (built at 05/09/2025 09:35:31)
  */
 .ht-root-wrapper:not([class*=ht-theme]),
 .ht-portal:not([class*=ht-theme]) {
@@ -52,9 +52,19 @@
   --ht-header-row-active-foreground-color: #fff;
   --ht-header-row-active-background-color: #1a42e8;
   --ht-cell-selection-border-color: #1a42e8;
+  --ht-scrollbar-track-color: #f7f7f9;
+  --ht-scrollbar-thumb-color: #a3a3a3;
 }
 
-.ht-root-wrapper .htFocusCatcher {
+.ht-root-wrapper {
+  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Helvetica Neue, Arial, sans-serif;
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+}
+
+.htFocusCatcher {
   position: absolute;
   width: 0;
   height: 0;
@@ -65,6 +75,11 @@
   z-index: -1;
 }
 
+.ht-grid {
+  flex: 1 1 auto;
+  min-height: 0;
+}
+
 .handsontable {
   font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Helvetica Neue, Arial, sans-serif;
   position: relative;
@@ -111,6 +126,10 @@
 .handsontable.htGhostTable table thead th {
   border-bottom-width: 0;
 }
+.handsontable.htGhostTable table tbody tr:first-of-type th:first-child,
+.handsontable.htGhostTable table tbody tr:first-of-type td:first-child {
+  height: calc(var(--ht-cell-vertical-padding) * 2 + var(--ht-line-height) + 1px);
+}
 .handsontable.htGhostTable table tbody tr th,
 .handsontable.htGhostTable table tbody tr td {
   border-top-width: 0;
@@ -121,10 +140,12 @@
   border-top-width: 1px;
   height: calc(var(--ht-cell-vertical-padding) * 2 + var(--ht-line-height) + 2px);
 }
-.handsontable.htHasScrollX .ht_master .wtHolder, .handsontable.htHasScrollY .ht_master .wtHolder {
-  background-color: var(--ht-background-color);
+.handsontable.htHasScrollX:not(.htHorizontallyScrollableByWindow) .ht_master .wtHolder, .handsontable.htHasScrollY:not(.htVerticallyScrollableByWindow) .ht_master .wtHolder {
   border-radius: var(--ht-wrapper-border-radius, 0);
 }
+.handsontable:not(.htHorizontallyScrollableByWindow) .ht_master .wtHolder, .handsontable:not(.htVerticallyScrollableByWindow) .ht_master .wtHolder {
+  background-color: var(--ht-background-color);
+}
 .handsontable tr.ht__row_even th {
   background-color: var(--ht-row-header-even-background-color);
 }
@@ -224,8 +245,8 @@
   color: var(--ht-header-row-active-foreground-color);
   background-color: var(--ht-header-row-active-background-color);
 }
-.handsontable tbody tr:first-of-type th,
-.handsontable tbody tr:first-of-type td {
+.handsontable tbody tr:first-of-type th:first-child,
+.handsontable tbody tr:first-of-type td:first-child {
   height: calc(var(--ht-cell-vertical-padding) * 2 + var(--ht-line-height) + 2px);
 }
 .handsontable tbody tr th {
@@ -403,6 +424,14 @@
 .handsontable .ht_master:not(.innerBorderTop):not(.innerBorderBottom) thead tr.lastChild th, .handsontable .ht_master:not(.innerBorderTop):not(.innerBorderBottom) ~ .handsontable thead tr.lastChild th {
   border-bottom-width: 0;
 }
+.handsontable .ht_master.innerBorderTop tbody tr:first-child th,
+.handsontable .ht_master.innerBorderTop tbody tr:first-child td {
+  border-top-width: 0;
+}
+.handsontable .ht_master.innerBorderTop ~ .ht_clone_inline_start tbody tr:first-child th,
+.handsontable .ht_master.innerBorderTop ~ .ht_clone_inline_start tbody tr:first-child td {
+  border-top-width: 0;
+}
 .handsontable .ht_master table.htCore > thead,
 .handsontable .ht_master table.htCore > tbody > tr > th,
 .handsontable .ht_clone_inline_start table.htCore > thead {
@@ -543,18 +572,18 @@
 .handsontable.ht-wrapper.htHasScrollX .htCore tbody tr:last-child th:last-child {
   border-end-end-radius: 0 !important;
 }
-.handsontable.ht-wrapper.htHasScrollY .htCore {
+.handsontable.ht-wrapper.htHasScrollY:not(.htVerticallyScrollableByWindow) .htCore {
   border-start-end-radius: 0;
   border-end-end-radius: 0;
 }
-.handsontable.ht-wrapper.htHasScrollY .htCore thead tr:first-child th:last-child,
-.handsontable.ht-wrapper.htHasScrollY .htCore tbody tr:first-child td:last-child,
-.handsontable.ht-wrapper.htHasScrollY .htCore tbody tr:first-child th:last-child {
+.handsontable.ht-wrapper.htHasScrollY:not(.htVerticallyScrollableByWindow) .htCore thead tr:first-child th:last-child,
+.handsontable.ht-wrapper.htHasScrollY:not(.htVerticallyScrollableByWindow) .htCore tbody tr:first-child td:last-child,
+.handsontable.ht-wrapper.htHasScrollY:not(.htVerticallyScrollableByWindow) .htCore tbody tr:first-child th:last-child {
   border-start-end-radius: 0 !important;
 }
-.handsontable.ht-wrapper.htHasScrollY .htCore thead tr:last-child th:last-child,
-.handsontable.ht-wrapper.htHasScrollY .htCore tbody tr:last-child td:last-child,
-.handsontable.ht-wrapper.htHasScrollY .htCore tbody tr:last-child th:last-child {
+.handsontable.ht-wrapper.htHasScrollY:not(.htVerticallyScrollableByWindow) .htCore thead tr:last-child th:last-child,
+.handsontable.ht-wrapper.htHasScrollY:not(.htVerticallyScrollableByWindow) .htCore tbody tr:last-child td:last-child,
+.handsontable.ht-wrapper.htHasScrollY:not(.htVerticallyScrollableByWindow) .htCore tbody tr:last-child th:last-child {
   border-end-end-radius: 0 !important;
 }
 
@@ -762,8 +791,8 @@
 .hot-display-license-info {
   font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Helvetica Neue, Arial, sans-serif;
   padding: var(--ht-license-vertical-padding, 16px) var(--ht-license-horizontal-padding, 16px);
-  font-size: calc(var(--ht-font-size) - 2px);
-  line-height: calc(var(--ht-line-height) - 2px);
+  font-size: var(--ht-font-size-small);
+  line-height: var(--ht-line-height-small);
   color: var(--ht-license-foreground-color);
   background-color: var(--ht-license-background-color, #f7f7f9);
   text-align: left;
@@ -788,6 +817,7 @@
   float: right;
   top: calc((var(--ht-line-height) - var(--ht-icon-size)) / 2);
   margin-inline-start: calc(var(--ht-gap-size) * 2);
+  margin-inline-end: 1px;
 }
 .handsontable .htAutocompleteArrow::after {
   content: "";
@@ -822,6 +852,9 @@
 .handsontable .htCheckboxRendererInput::before {
   content: "";
   display: inline-block;
+  position: absolute;
+  top: 0;
+  left: 0;
   width: var(--ht-checkbox-size);
   height: var(--ht-checkbox-size);
   border-radius: var(--ht-checkbox-border-radius);
@@ -839,6 +872,8 @@
   left: 0;
   color: var(--ht-checkbox-icon-color);
   pointer-events: none;
+  width: var(--ht-checkbox-size) !important;
+  height: var(--ht-checkbox-size) !important;
 }
 .handsontable .htCheckboxRendererInput:checked::before {
   border-color: var(--ht-checkbox-checked-border-color);
@@ -1488,6 +1523,7 @@
 .handsontable .collapsibleIndicator {
   top: calc((var(--ht-line-height) - var(--ht-icon-size)) / 2);
   margin-inline-start: var(--ht-gap-size);
+  margin-inline-end: 1px;
 }
 .handsontable .collapsibleIndicator,
 .handsontable .ht_nestingButton {
@@ -1691,6 +1727,7 @@
   float: right;
   top: calc((var(--ht-line-height) - var(--ht-icon-size)) / 2);
   margin-inline-start: var(--ht-gap-size);
+  margin-inline-end: 1px;
 }
 .handsontable .changeType::before {
   content: "";
@@ -1772,6 +1809,9 @@
 .handsontable.htDropdownMenu .wtBorder, .handsontable.htContextMenu .wtBorder, .handsontable.htFiltersConditionsMenu .wtBorder {
   visibility: hidden;
 }
+.handsontable.htDropdownMenu tbody tr:first-of-type td:first-child, .handsontable.htDropdownMenu tbody tr:first-of-type th:first-child, .handsontable.htContextMenu tbody tr:first-of-type td:first-child, .handsontable.htContextMenu tbody tr:first-of-type th:first-child, .handsontable.htFiltersConditionsMenu tbody tr:first-of-type td:first-child, .handsontable.htFiltersConditionsMenu tbody tr:first-of-type th:first-child {
+  height: calc(var(--ht-cell-vertical-padding) * 2 + var(--ht-line-height) + 1px);
+}
 .handsontable.htDropdownMenu table tbody tr td, .handsontable.htContextMenu table tbody tr td, .handsontable.htFiltersConditionsMenu table tbody tr td {
   position: relative;
   padding: var(--ht-menu-item-vertical-padding, 4px) var(--ht-menu-item-horizontal-padding, 8px);
@@ -1900,8 +1940,8 @@
   padding-top: calc(var(--ht-menu-item-vertical-padding, 4px) * 2);
 }
 .handsontable .htFiltersMenuLabel {
-  font-size: calc(var(--ht-font-size) - 2px);
-  line-height: calc(var(--ht-line-height) - 4px);
+  font-size: var(--ht-font-size-small);
+  line-height: var(--ht-line-height-small);
   font-weight: var(--ht-font-weight);
   margin-bottom: calc(var(--ht-gap-size, 2px) * 2);
 }
@@ -1959,7 +1999,7 @@
   padding: calc(var(--ht-gap-size) * 2) 0;
 }
 .handsontable .htUIMultipleSelectHot .wtHolder td {
-  height: auto;
+  height: auto !important;
   padding: 4px var(--ht-cell-horizontal-padding);
 }
 .handsontable .htUIClearAll,
@@ -2184,6 +2224,7 @@
   width: 2px;
   height: calc(100% - 12px);
   max-height: 16px;
+  margin-top: 0.5px;
   background: var(--ht-resize-indicator-color);
   border-radius: 2px;
   transform: translateY(-50%);
@@ -2367,11 +2408,9 @@
   display: none;
 }
 .handsontable .ht__manualRowMove--guideline, .handsontable.ht__manualRowMove--guideline {
-  height: 1px;
+  border-top: 1px solid var(--ht-move-indicator-color);
   left: 0;
-  margin-top: -0.5px;
   z-index: 205;
-  background: var(--ht-move-indicator-color);
 }
 .handsontable .ht__manualRowMove--backlight, .handsontable.ht__manualRowMove--backlight {
   display: none;
@@ -2384,3 +2423,230 @@
 .handsontable.on-moving--rows .ht__manualRowMove--backlight {
   display: block;
 }
+
+.ht-dialog {
+  position: absolute;
+  top: 0;
+  left: 0;
+  display: none;
+  font-size: var(--ht-font-size);
+  line-height: var(--ht-line-height);
+  letter-spacing: var(--ht-letter-spacing);
+  width: 100%;
+  height: 100%;
+  z-index: 1060;
+  opacity: 0;
+  overflow-y: auto;
+  border-radius: var(--ht-wrapper-border-radius);
+  border: 1px solid var(--ht-border-color);
+  box-sizing: border-box !important;
+}
+.ht-dialog[dir=rtl] {
+  left: auto;
+  right: 0;
+}
+.ht-dialog:focus {
+  border: 1px solid var(--ht-accent-color);
+  outline: none;
+}
+.ht-dialog:has(.htFocusCatcher:focus) {
+  border: 1px solid var(--ht-accent-color);
+  outline: none;
+}
+.ht-dialog * {
+  box-sizing: border-box !important;
+}
+.ht-dialog--background-solid {
+  background-color: var(--ht-dialog-solid-background-color);
+}
+.ht-dialog--background-semi-transparent {
+  background-color: var(--ht-dialog-semi-transparent-background-color);
+}
+.ht-dialog--animation {
+  transition: opacity var(--ht-table-transition) ease-in-out;
+}
+.ht-dialog--show {
+  opacity: 1;
+}
+.ht-dialog__content-wrapper {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  min-height: 100%;
+  padding: calc(var(--ht-gap-size) * 4);
+  border-radius: var(--ht-wrapper-border-radius);
+}
+.ht-dialog__content {
+  position: relative;
+  padding: var(--ht-dialog-content-padding-horizontal) var(--ht-dialog-content-padding-vertical);
+  max-width: 480px;
+  color: var(--ht-foreground-color);
+}
+.ht-dialog__content--background {
+  box-shadow: var(--ht-shadow-x, 0) var(--ht-shadow-y, 0) var(--ht-shadow-blur, 8px) var(--ht-shadow-color, rgba(0, 0, 0, 0.08));
+  border-radius: var(--ht-dialog-content-border-radius);
+  background-color: var(--ht-dialog-content-background-color);
+}
+
+.handsontable.ht-pagination {
+  color: var(--ht-pagination-bar-foreground-color);
+  background: var(--ht-pagination-bar-background-color);
+  border: 1px solid var(--ht-wrapper-border-color);
+  border-top-color: transparent;
+  border-radius: 0 0 var(--ht-wrapper-border-radius) var(--ht-wrapper-border-radius);
+  font-size: var(--ht-font-size);
+  line-height: var(--ht-line-height);
+  box-sizing: border-box;
+  overflow-x: auto;
+}
+.handsontable.ht-pagination--bordered {
+  border-top-color: var(--ht-wrapper-border-color);
+}
+.handsontable.ht-pagination .ht-pagination__inner {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: calc(var(--ht-gap-size) * 4);
+  border-radius: 0 0 var(--ht-wrapper-border-radius) var(--ht-wrapper-border-radius);
+  padding-inline: var(--ht-pagination-bar-horizontal-padding);
+  padding-block: var(--ht-pagination-bar-vertical-padding);
+  min-width: 230px;
+}
+.handsontable.ht-pagination .ht-page-size-section {
+  display: flex;
+  align-items: center;
+  gap: calc(var(--ht-gap-size) * 2);
+}
+.handsontable.ht-pagination .ht-page-size-section__label {
+  white-space: nowrap;
+}
+.handsontable.ht-pagination .ht-page-size-section__select-wrapper {
+  position: relative;
+  border-radius: var(--ht-input-border-radius);
+  border: 1px solid var(--ht-input-border-color);
+}
+.handsontable.ht-pagination .ht-page-size-section__select-wrapper select {
+  padding-inline-start: var(--ht-gap-size);
+  padding-inline-end: calc(var(--ht-gap-size) + var(--ht-icon-size));
+  padding-top: var(--ht-gap-size);
+  padding-bottom: var(--ht-gap-size);
+  border-radius: var(--ht-input-border-radius);
+  color: var(--ht-input-foreground-color);
+  background-color: var(--ht-input-background-color);
+  line-height: calc(var(--ht-line-height) - 4px);
+  border: none;
+  -webkit-appearance: none;
+  font-size: inherit;
+  cursor: pointer;
+}
+.handsontable.ht-pagination .ht-page-size-section__select-wrapper select:disabled {
+  opacity: 0.4;
+  cursor: default;
+}
+.handsontable.ht-pagination .ht-page-size-section__select-wrapper select:hover:not(:disabled) {
+  background-color: var(--ht-secondary-button-hover-background-color);
+}
+.handsontable.ht-pagination .ht-page-size-section__select-wrapper select:focus {
+  background-color: var(--ht-input-focus-background-color);
+  outline: 1px solid var(--ht-accent-color);
+}
+.handsontable.ht-pagination .ht-page-size-section__select-wrapper::after {
+  content: "";
+  display: block;
+  position: absolute;
+  inset-inline-end: var(--ht-gap-size);
+  inset-block-end: 50%;
+  transform: translateY(50%);
+  background-color: var(--ht-foreground-color);
+  pointer-events: none;
+}
+.handsontable.ht-pagination .ht-page-counter-section {
+  margin-inline-end: auto;
+}
+.handsontable.ht-pagination .ht-page-navigation-section {
+  display: flex;
+  align-items: center;
+  gap: 1px;
+}
+.handsontable.ht-pagination .ht-page-navigation-section__button {
+  font-size: inherit;
+  color: var(--ht-foreground-color);
+  background-color: var(--ht-pagination-bar-background-color);
+  border: none;
+  border-radius: var(--ht-icon-button-large-border-radius);
+  padding: var(--ht-icon-button-large-padding);
+  cursor: pointer;
+}
+.handsontable.ht-pagination .ht-page-navigation-section__button::before {
+  content: "";
+  display: block;
+}
+.handsontable.ht-pagination .ht-page-navigation-section__button--disabled {
+  opacity: 0.4;
+  cursor: default;
+  pointer-events: none;
+}
+.handsontable.ht-pagination .ht-page-navigation-section__button:hover:not(:disabled) {
+  background-color: var(--ht-secondary-button-hover-background-color);
+}
+.handsontable.ht-pagination .ht-page-navigation-section__button:focus {
+  outline: 1px solid var(--ht-accent-color);
+}
+.handsontable.ht-pagination .ht-page-navigation-section__label {
+  white-space: nowrap;
+  min-width: 100px;
+  text-align: center;
+}
+.handsontable.ht-wrapper.htPagination {
+  border-end-start-radius: 0;
+  border-end-end-radius: 0;
+}
+.handsontable.ht-wrapper.htPagination .htCore {
+  border-end-start-radius: 0;
+  border-end-end-radius: 0;
+}
+.handsontable.ht-wrapper.htPagination .htCore thead tr:last-child th:first-child,
+.handsontable.ht-wrapper.htPagination .htCore tbody tr:last-child td:first-child,
+.handsontable.ht-wrapper.htPagination .htCore tbody tr:last-child th:first-child {
+  border-end-start-radius: 0 !important;
+}
+.handsontable.ht-wrapper.htPagination .htCore thead tr:last-child th:last-child,
+.handsontable.ht-wrapper.htPagination .htCore tbody tr:last-child td:last-child,
+.handsontable.ht-wrapper.htPagination .htCore tbody tr:last-child th:last-child {
+  border-end-end-radius: 0 !important;
+}
+
+.ht-loading__icon-svg {
+  display: block;
+  width: var(--ht-icon-size);
+  height: var(--ht-icon-size);
+  color: var(--ht-accent-color);
+  animation: ht-loading-spin 1s linear infinite;
+  transform-origin: 50% 50%;
+}
+.ht-loading__content {
+  display: flex;
+  align-items: center;
+  gap: calc(var(--ht-gap-size) * 2);
+}
+.ht-loading__title {
+  margin: 0;
+  font-size: var(--ht-font-size);
+  font-weight: var(--ht-font-weight);
+  line-height: var(--ht-line-height);
+}
+.ht-loading__description {
+  margin: 0;
+  color: var(--ht-foreground-secondary-color);
+  font-size: var(--ht-font-size-small);
+  line-height: var(--ht-line-height-small);
+  font-weight: var(--ht-font-weight);
+}
+
+@keyframes ht-loading-spin {
+  to {
+    transform: rotate(360deg);
+  }
+}