@vuu-ui/vuu-datatable 0.6.9 → 0.6.11-debug-debug

package/index.css

@@ -1,2 +1,638 @@
-.vuuDialog{background:var(--salt-container-primary-background);border:var(--vuuDialog-border, solid 1px #ccc);border-radius:5px;padding:var(--vuuDialog-padding, 0);box-shadow:var(--salt-overlayable-shadow, none);height:var(--vuuDialog-height, fit-content);width:var(--vuuDialog-width, fit-content)}.vuuDialog-header{--saltButton-height: 28px;--saltButton-width: 28px;--saltToolbar-background: transparent;--saltToolbar-height: calc(var(--salt-size-base) + 5px);border-bottom:solid 1px var(--salt-container-primary-borderColor)}.vuuDialog-header>.Responsive-inner{align-items:center}.vuuDialog-header>.Responsive-inner>:last-child{right:2px}.vuuMenuList{--context-menu-color: #161616;--context-menu-padding: var(--hw-list-item-padding, 0 6px);--context-menu-shadow: var(--hw-dialog-shadow, 0 6px 12px rgba(0, 0, 0, .175));--focus-visible-border-color: var(--hw-focus-visible-border-color, rgb(141, 154, 179));--context-menu-highlight-bg: #a4d5f4;--context-menu-blur-focus-bg: #e0e4e9;--menu-item-height: var(--hw-list-item-height, 24px);--menu-item-icon-color: black;--menu-item-twisty-color: black;--menu-item-twisty-content: "";--menu-item-twisty-top: 50%;--menu-item-twisty-left: auto;--menu-item-twisty-right: 0px;--menu-icon-size: 12px;background-clip:padding-box;background-color:#fff;border-radius:4px;border:solid 1px rgba(0,0,0,.15);box-shadow:var(--context-menu-shadow);font-size:var(--salt-text-label-fontSize);font-weight:var(--salt-typography-fontWeight-semiBold);list-style:none;margin:2px 0 0;outline:0;padding:0;position:absolute}.vuuMenuItem{align-items:center;color:var(--context-menu-color);display:flex;gap:6px;height:var(--menu-item-height);padding:var(--context-menu-padding);padding-right:24px;position:relative;white-space:nowrap}.vuuIconContainer{display:inline-block;flex:12px 0 0;height:var(--menu-icon-size);mask-repeat:no-repeat;width:var(--menu-icon-size)}.vuuMenuItem[aria-expanded=true]{background-color:var(--context-menu-blur-focus-bg)}.vuuMenuItem-separator{border-top:solid 1px var(--context-menu-blur-focus-bg)}.vuuMenuItem[aria-haspopup=true]:after{content:var(--menu-item-twisty-content);-webkit-mask:var(--svg-chevron-right) center center/12px 12px;mask:var(--svg-chevron-down) center center/12px 12px;mask-repeat:no-repeat;background-color:var(--menu-item-twisty-color);height:16px;left:var(--menu-item-twisty-left);right:var(--menu-item-twisty-right);margin-top:-8px;position:absolute;top:var(--menu-item-twisty-top);transition:transform .3s;width:16px}.vuuMenuItem[data-highlighted]{background-color:var(--context-menu-highlight-bg)}.vuuMenuItem:hover{background-color:var(--context-menu-highlight-bg);cursor:default}.vuuMenuList-childMenuShowing .hwMenuItem[data-highlighted]{background-color:var(--context-menu-blur-focus-bg)}.vuuMenuItem.focusVisible:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0px;border:dotted var(--focus-visible-border-color) 2px}.vuuPopupContainer.top-bottom-right-right .popup-menu{left:auto;right:0}.popup-menu .menu-item.showing>button,.popup-menu .menu-item>button:focus,.popup-menu .menu-item>button:hover{text-decoration:none;color:#000;background-color:#dcdcdc}.vuuMenuItem-button:active,.hwMenuItem-button:hover{outline:0}.popup-menu .menu-item.disabled>button{clear:both;font-weight:400;line-height:1.5;color:#787878;white-space:nowrap;text-decoration:none;cursor:default}.vuuPopup{box-shadow:0 6px 12px #0000002d;position:absolute;top:0;left:0;width:0;height:0;overflow:visible;z-index:1000}.vuuPopup{position:absolute}.vuuDataTable{--cell-outline-width: 2px;user-select:none}.vuuDataTable-table td{--saltEditableLabel-height: 17px;--saltInput-height: 17px;--saltInput-minHeight: 17px;border-right:1px solid var(--vuuTableCell-border-rightColor);border-bottom:1px solid var(--vuuTableCell-border-bottomColor);color:var(--salt-text-primary-foreground);cursor:default;height:var(--vuuTable-rowHeight);line-height:calc(var(--vuuTable-rowHeight) - 1px);overflow:hidden;padding:0 5px}.vuuDataTable th:focus,.vuuDataTable td:focus{outline:var(--vuuTableCell-outline, dotted var(--salt-color-blue-400) var(--cell-outline-width));outline-offset:calc(var(--cell-outline-width) * -1);box-shadow:inset 0 0 0 var(--cell-outline-width) #fff;border-bottom:none}.vuuDataTable th:focus .vuuTable-headerCell-inner{padding-bottom:var(--cell-outline-width)}.vuuDataTable th:not(.vuuTable-headerCell-resizing):focus .vuuTable-headerCell-inner{--columnResizer-color: transparent}.vuuDataTable td:focus{border-right:none;padding-bottom:1px}td[data-editable=true]{--salt-text-fontSize: 10px;--vuu-icon-size: 5px;position:relative}td[data-editable=true]:after{top:0;content:"";background-color:var(--salt-text-secondary-foreground, black);left:0;height:var(--vuu-icon-height, var(--vuu-icon-size, 12px));-webkit-mask:var(--svg-corner-triangle) center center/var(--vuu-icon-size) var(--vuu-icon-size);mask:var(--svg-corner-triangle) center center/var(--vuu-icon-size) var(--vuu-icon-size);mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;position:absolute;transform:rotate(180deg);width:var(--vuu-icon-width, var(--vuu-icon-size, 12px))}td:focus[data-editable],td:focus-within[data-editable],td:has(.saltEditableLabel-editing){outline:solid var(--salt-color-blue-400) 1px;background-color:#fff;outline-offset:-1px}td:focus[data-editable=true]:after,td:has(.saltEditableLabel):after{background-color:var(--salt-color-blue-400);left:1px;top:1px}.vuuTableGroupCell{--spacer-width: 20px;--toggle-icon-transform: var(--row-toggle-icon-transform, none);--vuu-icon-width: 18px;display:flex;align-items:center}.vuuTableGroupCell-spacer{height:100%;position:relative;width:var(--spacer-width)}.vuuTableGroupCell-spacer:after{background:var(--salt-container-primary-borderColor);content:"";position:absolute;top:0;bottom:-1px;left:9px;width:1px}.vuuTableGroupCell-toggle{transition:transform .25s;transform:var(--toggle-icon-transform)}.vuuDataTableRow-even{--row-background: var(--salt-container-secondary-background)}.vuuDataTableRow:not(.vuuDataTableRow-even){--row-background: var(--vuuTableRow-backgroundColor-odd, var(--table-background))}.vuuDataTableRow{background:var(--row-background)}.vuuDataTableRow :is(.vuuPinFloating,.vuuPinLeft,.vuuPinRight){background-color:var(--row-background)}.vuuDataTableRow-expanded{--row-toggle-icon-transform: rotate(90deg)}.vuuDataTableRow[aria-selected]{background-color:var(--vuuTableRow-selected-background, var(--salt-selectable-background-selected));--vuuTableCell-border-bottomColor: var(--salt-selectable-borderColor-selected)}.vuuDataTableRow-preSelected{--vuuTableCell-border-bottomColor: var(--salt-selectable-borderColor-selected)}.vuuColumnResizer{cursor:col-resize;margin-left:auto;width:4px}.vuuColumnResizer:after{content:"";position:absolute;width:var(--columnResizer-width, 1px);top:0;bottom:0;right:0;background-color:var(--columnResizer-color, var(--salt-separable-tertiary-borderColor));height:var(--columnResizer-height, 100%)}.vuuSortIndicator{--menu-icon-size: 18px;--menu-item-icon-color: black;display:flex;flex-direction:column;position:relative;width:18px}.vuuSortPosition{font-size:10px;line-height:10px;text-align:center}.vuuTable-heading:nth-child(2){--heading-top: calc(var(--header-height))}.vuuTable-heading:nth-child(3){--heading-top: calc(var(--header-height) * 2)}.vuuTable-heading:nth-child(3){--heading-top: calc(var(--header-height) * 3)}.vuuTable-headingCell{background:var(--table-background);border-color:var(--salt-separable-tertiary-borderColor);border-style:solid solid solid none;border-width:1px;color:var(--salt-text-secondary-foreground);height:var(--vuuTableHeaderHeight);padding:0!important;position:sticky;top:var(--heading-top, 0);z-index:1}.vuuTable-heading:has(+ .vuuTable-heading)>.vuuTable-headingCell{border-bottom-color:transparent}.vuuTable-headerCell{--cell-align: "flex-start";text-align:left;background:var(--table-background);border-bottom:2px solid var(--salt-separable-tertiary-borderColor);color:var(--salt-text-secondary-foreground);cursor:default;padding:0!important;position:sticky;top:calc(var(--total-header-height) - var(--header-height));height:var(--vuuTableHeaderHeight);z-index:1}.vuuTable-headerCell-right{--cell-align: flex-end}.vuuTable-headerCell-inner{align-items:stretch;display:flex;height:100%;padding:0 0 0 3px}.vuuTable-headerCell-inner:has(.vuuFilterIndicator){padding-left:0}.vuuTable-headerCell-label{align-items:center;justify-content:var(--cell-align);display:flex;flex:1 1 auto}.vuuTable-headerCell-resizing{--columnResizer-color: var(--salt-color-blue-500);--columnResizer-height: var(--table-height);--columnResizer-width: 2px}.vuuTable-headerCell.vuuPinLeft.vuuEndPin:after{box-shadow:2px 0 5px #0006;content:"";position:absolute;width:1px;background-color:transparent;height:var(--table-height);top:0;right:0px}.vuuTable-headerCell.vuuPinRight.vuuEndPin:after{box-shadow:-2px 0 5px #0000004d;content:"";position:absolute;width:1px;background-color:transparent;height:var(--table-height);top:0;left:0px}.vuuFilterIndicator{--menu-icon-size: 12px;--menu-item-icon-color: black;align-items:center;cursor:pointer;display:flex;flex:0 0 18px;flex-direction:column;justify-content:center;position:relative}.vuuFilterIndicator+.vuuTable-headerCell-inner{padding-left:0}.salt-theme{--vuuFilterEditor-lineHeight: 28px}.salt-density-high{--vuuFilterEditor-buttonWidth: 20px;--vuuFilterEditor-height: 22px;--vuuFilterEditor-lineHeight: 20px}.vuuFilterInput{--vuuFilterEditor-background: var(--salt-container-primary-background);--vuuFilterEditor-color: var(--salt-text-primary-foreground);--vuuFilterEditor-fontFamily: var(--salt-typography-fontFamily);--vuuFilterEditor-fontSize: var(--salt-text-fontSize);--vuuFilterEditor-cursorColor: var(--salt-text-secondary-foreground);--vuuFilterEditor-selectionBackground: var(--salt-text-background-selected);--vuuFilterEditor-tooltipBackground: var(--salt-container-primary-background);--vuuFilterEditor-tooltipBorder: var(--tooltip-status-borderColor) var(--salt-container-borderWidth) var(--salt-container-borderStyle);--vuuFilterEditor-tooltipElevation: var(--salt-overlayable-shadow-popout);--vuuFilterEditor-suggestion-selectedBackground: var(--salt-selectable-background-selected);--vuuFilterEditor-suggestion-selectedColor: var(--vuuFilterEditor-color);--vuuFilterEditor-suggestion-height: 24px;--vuuFilterEditor-variableColor: blue;align-items:center;border-color:var(--salt-container-secondary-borderColor);border-style:solid none;border-width:1px;box-sizing:border-box;display:flex;height:var(--vuuFilterEditor-height, 30px)}.vuuFilterInput-Editor{flex:1 1 auto;height:100%}.vuuFilterInput-FilterButton,.vuuFilterInput-ClearButton{--vuu-icon-size: 12px;--saltButton-width: var(--vuuFilterEditor-buttonWidth, 28px)}.vuuIllustration{--vuuFilterEditor-suggestion-selectedBackground:var(--salt-container-secondary-background);background:var(--salt-container-secondary-background);color:var(--salt-text-secondary-foreground)}.vuuFilterDropdown,.vuuFilterSwitch{--saltToolbarField-marginTop: 0;height:100%}.vuuFilterDropdown.saltFormField-focused:before{top:2px!important;bottom:2px!important}.vuuTable-groupHeaderCell{--cell-align: "flex-start";text-align:left;background:var(--table-background);border-right:1px solid var(--salt-separable-tertiary-borderColor);border-bottom:2px solid var(--salt-separable-tertiary-borderColor);color:var(--salt-text-secondary-foreground);cursor:default;padding:0!important;position:sticky;top:0;height:var(--vuuTableHeaderHeight);z-index:1}.vuuTable-groupHeaderCell-inner{display:flex;height:100%}.vuuTable-groupHeaderCell-label{align-items:center;display:flex;flex:0 0 auto}.vuuTable-groupHeaderCell-col{align-items:center;background-color:inherit;display:inline-flex;flex:0 1 auto;height:calc(var(--vuuTableHeaderHeight) - 4px);justify-content:space-between;padding-right:8px;position:relative}.vuuTable-groupHeaderCell-close{--vuu-icon-height: 18px;--vuu-icon-width: 18px;cursor:pointer;left:3px}.vuuTable-groupHeaderCell-col:nth-child(odd){background-color:var(--salt-color-gray-50)}.vuuTable-groupHeaderCell-col:nth-child(even){background-color:var(--salt-color-gray-40)}.vuuTable-groupHeaderCell-col:first-child{clip-path:polygon(0 0,calc(100% - 8px) 0,100% 50%,calc(100% - 8px) 100%,0 100%);padding-left:3px;z-index:1}.vuuTable-groupHeaderCell-col:not(:first-child){margin-left:-6px;padding-left:12px;clip-path:polygon(0 0,calc(100% - 8px) 0,100% 50%,calc(100% - 8px) 100%,0 100%,8px 50%)}.vuuTable-groupHeaderCell-resizing{--columnResizer-color: var(--salt-color-blue-500);--columnResizer-height: var(--table-height);--columnResizer-width: 2px}.vuuDataTable{background-color:var(--salt-container-primary-background, inherit);position:relative}.vuuDataTable-contentContainer{--table-background: var(--salt-container-primary-background, inherit);--vuuTable-contentHeight: var(--content-height, "auto");--vuuTable-contentWidth: var(--content-width, "auto");--vuuTableHeaderHeight: var(--header-height, 30px);--vuuTable-height: calc(var(--table-height) - var(--scrollbar-size));--vuuTable-pinnedWidthLeft: var(--pinned-width-left, 0pxs);--vuuTable-scrollbarSize: var(--scrollbar-size, 15px);--vuuTable-width: calc(var(--table-width) - var(--scrollbar-size));background-color:var(--salt-container-primary-background);height:var(--vuuTable-height);position:relative;overflow:auto;overscroll-behavior:none;width:var(--vuuTable-width)}.vuuDataTable-contentContainer::-webkit-scrollbar{display:none}.vuuDataTable-scrollbarContainer{--scroll-content-width: calc(var(--content-width) - var(--pinned-width-left));border-left:solid 1px var(--salt-container-primary-borderColor);border-top:solid 1px var(--salt-container-primary-borderColor);overflow:auto;position:absolute;height:calc(var(--table-height) - var(--total-header-height) + 1px);width:calc(var(--table-width) - var(--pinned-width-left) + 1px)}.vuuDataTable-scrollContainerHeader{background:#777;height:var(--header-height);position:fixed;top:0;right:0;width:var(--vuuTable-scrollbarSize)}.vuuDataTable-scrollContainerFooter{background-color:green;height:var(--vuuTable-scrollbarSize);position:fixed;bottom:0;left:0;width:var(--pinned-width-left)}.vuuDataTable-scrollContent{position:absolute;height:var(--content-height);width:var(--scroll-content-width, var(--content-width))}.vuuDataTable-tableContainer{background-color:var(--table-background);border-bottom:solid 1px var(--salt-container-primary-borderColor);height:calc(var(--table-height) - var(--scrollbar-size));left:0px;overflow:hidden;position:sticky;top:0px;width:calc(var(--table-width) - var(--scrollbar-size));white-space:nowrap}.vuuDataTable-table{--vuuTable-rowHeight: var(--row-height);--vuuTableCell-border-bottomColor: transparent;--vuuTableCell-border-rightColor: var(--salt-separable-tertiary-borderColor);position:absolute;top:0;left:0;background:repeating-linear-gradient(to bottom,var(--salt-container-secondary-background),var(--salt-container-secondary-background) 20px,var(--table-background) 20px,var(--table-background) 40px);border-collapse:separate;border-spacing:0;border-left:1px solid #ccc;border:none;font-size:var(--vuuDataTable-font-size, 10px);margin:0;min-height:100%;table-layout:fixed;width:var(--vuuTable-contentWidth)}.vuuDataTable-columnBased{display:inline-table;height:var(--vuuTable-height);position:static}.vuuDataTable-filler{height:var(--filler-height)}:is(.vuuPinLeft,.vuuPinRight,.vuuPinFloating){position:sticky}.vuuAlignRight{text-align:right}th:is(.vuuPinLeft,.vuuPinRight,.vuuPinFloating){top:0;z-index:20}table:is(.vuuPinLeft,.vuuPinRight,.vuuPinFloating){z-index:10}.vuuDataTable-settings{height:var(--header-height);position:absolute;right:0;top:0;width:15px}.vuuDataTable:has(.vuuTable-headerCell-resizing) *{cursor:col-resize}.saltDraggable-table-column{background-color:var(--salt-container-primary-background);overflow:hidden}
+/* ../vuu-popups/src/dialog/Dialog.css */
+.vuuDialog {
+  background: var(--salt-container-primary-background);
+  border: var(--vuuDialog-border, solid 1px #ccc);
+  border-radius: 5px;
+  padding: var(--vuuDialog-padding, 0);
+  box-shadow: var(--salt-overlayable-shadow, none);
+  height: var(--vuuDialog-height, fit-content);
+  width: var(--vuuDialog-width, fit-content);
+}
+.vuuDialog-header {
+  --saltButton-height: 28px;
+  --saltButton-width: 28px;
+  --saltToolbar-background: transparent;
+  --saltToolbar-height: calc(var(--salt-size-base) + 5px);
+  border-bottom: solid 1px var(--salt-container-primary-borderColor);
+}
+.vuuDialog-header > .Responsive-inner {
+  align-items: center;
+}
+.vuuDialog-header > .Responsive-inner > :last-child {
+  right: 2px;
+}
+
+/* ../vuu-popups/src/menu/MenuList.css */
+.vuuMenuList {
+  --context-menu-color: #161616;
+  --context-menu-padding: var(--hw-list-item-padding, 0 6px);
+  --context-menu-shadow: var(--hw-dialog-shadow, 0 6px 12px rgba(0, 0, 0, 0.175));
+  --focus-visible-border-color: var(--hw-focus-visible-border-color, rgb(141, 154, 179));
+  --context-menu-highlight-bg: #a4d5f4;
+  --context-menu-blur-focus-bg: #e0e4e9;
+  --menu-item-height: var(--hw-list-item-height, 24px);
+  --menu-item-icon-color: black;
+  --menu-item-twisty-color: black;
+  --menu-item-twisty-content: "";
+  --menu-item-twisty-top: 50%;
+  --menu-item-twisty-left: auto;
+  --menu-item-twisty-right: 0px;
+  --menu-icon-size: 12px;
+  background-clip: padding-box;
+  background-color: white;
+  border-radius: 4px;
+  border: solid 1px rgba(0, 0, 0, 0.15);
+  box-shadow: var(--context-menu-shadow);
+  font-size: var(--salt-text-label-fontSize);
+  font-weight: var(--salt-typography-fontWeight-semiBold);
+  list-style: none;
+  margin: 2px 0 0;
+  outline: 0;
+  padding: 0;
+  position: absolute;
+}
+.vuuMenuItem {
+  align-items: center;
+  color: var(--context-menu-color);
+  display: flex;
+  gap: 6px;
+  height: var(--menu-item-height);
+  padding: var(--context-menu-padding);
+  padding-right: 24px;
+  position: relative;
+  white-space: nowrap;
+}
+.vuuIconContainer {
+  display: inline-block;
+  flex: 12px 0 0;
+  height: var(--menu-icon-size);
+  mask-repeat: no-repeat;
+  width: var(--menu-icon-size);
+}
+.vuuMenuItem[aria-expanded=true] {
+  background-color: var(--context-menu-blur-focus-bg);
+}
+.vuuMenuItem-separator {
+  border-top: solid 1px var(--context-menu-blur-focus-bg);
+}
+.vuuMenuItem[aria-haspopup=true]:after {
+  content: var(--menu-item-twisty-content);
+  -webkit-mask: var(--svg-chevron-right) center center/12px 12px;
+  mask: var(--svg-chevron-down) center center/12px 12px;
+  mask-repeat: no-repeat;
+  background-color: var(--menu-item-twisty-color);
+  height: 16px;
+  left: var(--menu-item-twisty-left);
+  right: var(--menu-item-twisty-right);
+  margin-top: -8px;
+  position: absolute;
+  top: var(--menu-item-twisty-top);
+  transition: transform 0.3s;
+  width: 16px;
+}
+.vuuMenuItem[data-highlighted] {
+  background-color: var(--context-menu-highlight-bg);
+}
+.vuuMenuItem:hover {
+  background-color: var(--context-menu-highlight-bg);
+  cursor: default;
+}
+.vuuMenuList-childMenuShowing .hwMenuItem[data-highlighted] {
+  background-color: var(--context-menu-blur-focus-bg);
+}
+.vuuMenuItem.focusVisible:before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0px;
+  border: dotted var(--focus-visible-border-color) 2px;
+}
+.vuuPopupContainer.top-bottom-right-right .popup-menu {
+  left: auto;
+  right: 0;
+}
+.popup-menu .menu-item.showing > button,
+.popup-menu .menu-item > button:focus,
+.popup-menu .menu-item > button:hover {
+  text-decoration: none;
+  color: rgb(0, 0, 0);
+  background-color: rgb(220, 220, 220);
+}
+.vuuMenuItem-button:active,
+.hwMenuItem-button:hover {
+  outline: 0;
+}
+.popup-menu .menu-item.disabled > button {
+  clear: both;
+  font-weight: normal;
+  line-height: 1.5;
+  color: rgb(120, 120, 120);
+  white-space: nowrap;
+  text-decoration: none;
+  cursor: default;
+}
+
+/* ../vuu-popups/src/popup/popup-service.css */
+.vuuPopup {
+  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 0;
+  height: 0;
+  overflow: visible;
+  z-index: 1000;
+}
+.vuuPopup {
+  position: absolute;
+}
+
+/* src/TableCell.css */
+.vuuDataTable {
+  --cell-outline-width: 2px;
+  user-select: none;
+}
+.vuuDataTable-table td {
+  --saltEditableLabel-height: 17px;
+  --saltInput-height: 17px;
+  --saltInput-minHeight: 17px;
+  border-right: 1px solid var(--vuuTableCell-border-rightColor);
+  border-bottom: 1px solid var(--vuuTableCell-border-bottomColor);
+  color: var(--salt-text-primary-foreground);
+  cursor: default;
+  height: var(--vuuTable-rowHeight);
+  line-height: calc(var(--vuuTable-rowHeight) - 1px);
+  overflow: hidden;
+  padding: 0 5px;
+}
+.vuuDataTable th:focus,
+.vuuDataTable td:focus {
+  outline: var(--vuuTableCell-outline, dotted var(--salt-color-blue-400) var(--cell-outline-width));
+  outline-offset: calc(var(--cell-outline-width) * -1);
+  box-shadow: inset 0 0 0 var(--cell-outline-width) white;
+  border-bottom: none;
+}
+.vuuDataTable th:focus .vuuTable-headerCell-inner {
+  padding-bottom: var(--cell-outline-width);
+}
+.vuuDataTable th:not(.vuuTable-headerCell-resizing):focus .vuuTable-headerCell-inner {
+  --columnResizer-color: transparent;
+}
+.vuuDataTable td:focus {
+  border-right: none;
+  padding-bottom: 1px;
+}
+td[data-editable=true] {
+  --salt-text-fontSize: 10px;
+  --vuu-icon-size: 5px;
+  position: relative;
+}
+td[data-editable=true]:after {
+  top: 0;
+  content: "";
+  background-color: var(--salt-text-secondary-foreground, black);
+  left: 0;
+  height: var(--vuu-icon-height, var(--vuu-icon-size, 12px));
+  -webkit-mask: var(--svg-corner-triangle) center center/var(--vuu-icon-size) var(--vuu-icon-size);
+  mask: var(--svg-corner-triangle) center center/var(--vuu-icon-size) var(--vuu-icon-size);
+  mask-repeat: no-repeat;
+  -webkit-mask-repeat: no-repeat;
+  position: absolute;
+  transform: rotate(180deg);
+  width: var(--vuu-icon-width, var(--vuu-icon-size, 12px));
+}
+td:focus[data-editable],
+td:focus-within[data-editable],
+td:has(.saltEditableLabel-editing) {
+  outline: solid var(--salt-color-blue-400) 1px;
+  background-color: white;
+  outline-offset: -1px;
+}
+td:focus[data-editable=true]:after,
+td:has(.saltEditableLabel):after {
+  background-color: var(--salt-color-blue-400);
+  left: 1px;
+  top: 1px;
+}
+
+/* src/TableGroupCell.css */
+.vuuTableGroupCell {
+  --spacer-width: 20px;
+  --toggle-icon-transform: var(--row-toggle-icon-transform, none);
+  --vuu-icon-width: 18px;
+  display: flex;
+  align-items: center;
+}
+.vuuTableGroupCell-spacer {
+  height: 100%;
+  position: relative;
+  width: var(--spacer-width);
+}
+.vuuTableGroupCell-spacer:after {
+  background: var(--salt-container-primary-borderColor);
+  content: "";
+  position: absolute;
+  top: 0;
+  bottom: -1px;
+  left: 9px;
+  width: 1px;
+}
+.vuuTableGroupCell-toggle {
+  transition: transform 0.25s;
+  transform: var(--toggle-icon-transform);
+}
+
+/* src/TableRow.css */
+.vuuDataTableRow-even {
+  --row-background: var(--salt-container-secondary-background);
+}
+.vuuDataTableRow:not(.vuuDataTableRow-even) {
+  --row-background: var(--vuuTableRow-backgroundColor-odd, var(--table-background));
+}
+.vuuDataTableRow {
+  background: var(--row-background);
+}
+.vuuDataTableRow :is(.vuuPinFloating, .vuuPinLeft, .vuuPinRight) {
+  background-color: var(--row-background);
+}
+.vuuDataTableRow-expanded {
+  --row-toggle-icon-transform: rotate(90deg);
+}
+.vuuDataTableRow[aria-selected] {
+  background-color: var(--vuuTableRow-selected-background, var(--salt-selectable-background-selected));
+  --vuuTableCell-border-bottomColor: var(--salt-selectable-borderColor-selected);
+}
+.vuuDataTableRow-preSelected {
+  --vuuTableCell-border-bottomColor: var(--salt-selectable-borderColor-selected);
+}
+
+/* src/ColumnResizer.css */
+.vuuColumnResizer {
+  cursor: col-resize;
+  margin-left: auto;
+  width: 4px;
+}
+.vuuColumnResizer:after {
+  content: "";
+  position: absolute;
+  width: var(--columnResizer-width, 1px);
+  top: 0;
+  bottom: 0;
+  right: 0;
+  background-color: var(--columnResizer-color, var(--salt-separable-tertiary-borderColor));
+  height: var(--columnResizer-height, 100%);
+}
+
+/* src/SortIndicator.css */
+.vuuSortIndicator {
+  --menu-icon-size: 18px;
+  --menu-item-icon-color: black;
+  display: flex;
+  flex-direction: column;
+  position: relative;
+  width: 18px;
+}
+.vuuSortPosition {
+  font-size: 10px;
+  line-height: 10px;
+  text-align: center;
+}
+
+/* src/TableHeaderCell.css */
+.vuuTable-heading:nth-child(2) {
+  --heading-top: calc(var(--header-height));
+}
+.vuuTable-heading:nth-child(3) {
+  --heading-top: calc(var(--header-height) * 2);
+}
+.vuuTable-heading:nth-child(3) {
+  --heading-top: calc(var(--header-height) * 3);
+}
+.vuuTable-headingCell {
+  background: var(--table-background);
+  border-color: var(--salt-separable-tertiary-borderColor);
+  border-style: solid solid solid none;
+  border-width: 1px;
+  color: var(--salt-text-secondary-foreground);
+  height: var(--vuuTableHeaderHeight);
+  padding: 0 !important;
+  position: sticky;
+  top: var(--heading-top, 0);
+  z-index: 1;
+}
+.vuuTable-heading:has(+ .vuuTable-heading) > .vuuTable-headingCell {
+  border-bottom-color: transparent;
+}
+.vuuTable-headerCell {
+  --cell-align: "flex-start";
+  text-align: left;
+  background: var(--table-background);
+  border-bottom: 2px solid var(--salt-separable-tertiary-borderColor);
+  color: var(--salt-text-secondary-foreground);
+  cursor: default;
+  padding: 0 !important;
+  position: sticky;
+  top: calc(var(--total-header-height) - var(--header-height));
+  height: var(--vuuTableHeaderHeight);
+  z-index: 1;
+}
+.vuuTable-headerCell-right {
+  --cell-align: flex-end;
+}
+.vuuTable-headerCell-inner {
+  align-items: stretch;
+  display: flex;
+  height: 100%;
+  padding: 0 0 0 3px;
+}
+.vuuTable-headerCell-inner:has(.vuuFilterIndicator) {
+  padding-left: 0;
+}
+.vuuTable-headerCell-label {
+  align-items: center;
+  justify-content: var(--cell-align);
+  display: flex;
+  flex: 1 1 auto;
+}
+.vuuTable-headerCell-resizing {
+  --columnResizer-color: var(--salt-color-blue-500);
+  --columnResizer-height: var(--table-height);
+  --columnResizer-width: 2px;
+}
+.vuuTable-headerCell.vuuPinLeft.vuuEndPin:after {
+  box-shadow: 2px 0px 5px rgba(0, 0, 0, 0.4);
+  content: "";
+  position: absolute;
+  width: 1px;
+  background-color: transparent;
+  height: var(--table-height);
+  top: 0;
+  right: 0px;
+}
+.vuuTable-headerCell.vuuPinRight.vuuEndPin:after {
+  box-shadow: -2px 0px 5px rgba(0, 0, 0, 0.3);
+  content: "";
+  position: absolute;
+  width: 1px;
+  background-color: transparent;
+  height: var(--table-height);
+  top: 0;
+  left: 0px;
+}
+
+/* src/filter-indicator.css */
+.vuuFilterIndicator {
+  --menu-icon-size: 12px;
+  --menu-item-icon-color: black;
+  align-items: center;
+  cursor: pointer;
+  display: flex;
+  flex: 0 0 18px;
+  flex-direction: column;
+  justify-content: center;
+  position: relative;
+}
+.vuuFilterIndicator + .vuuTable-headerCell-inner {
+  padding-left: 0;
+}
+
+/* ../vuu-filters/src/filter-input/FilterInput.css */
+.salt-theme {
+  --vuuFilterEditor-lineHeight: 28px;
+}
+.salt-density-high {
+  --vuuFilterEditor-buttonWidth: 20px;
+  --vuuFilterEditor-height: 22px;
+  --vuuFilterEditor-lineHeight: 20px;
+}
+.vuuFilterInput {
+  --vuuFilterEditor-background: var(--salt-container-primary-background);
+  --vuuFilterEditor-color: var(--salt-text-primary-foreground);
+  --vuuFilterEditor-fontFamily: var(--salt-typography-fontFamily);
+  --vuuFilterEditor-fontSize: var(--salt-text-fontSize);
+  --vuuFilterEditor-cursorColor: var(--salt-text-secondary-foreground);
+  --vuuFilterEditor-selectionBackground: var(--salt-text-background-selected);
+  --vuuFilterEditor-tooltipBackground: var(--salt-container-primary-background);
+  --vuuFilterEditor-tooltipBorder: var(--tooltip-status-borderColor) var(--salt-container-borderWidth) var(--salt-container-borderStyle);
+  --vuuFilterEditor-tooltipElevation: var(--salt-overlayable-shadow-popout);
+  --vuuFilterEditor-suggestion-selectedBackground: var(--salt-selectable-background-selected);
+  --vuuFilterEditor-suggestion-selectedColor: var(--vuuFilterEditor-color);
+  --vuuFilterEditor-suggestion-height: 24px;
+  --vuuFilterEditor-variableColor: blue;
+  align-items: center;
+  border-color: var(--salt-container-secondary-borderColor);
+  border-style: solid none;
+  border-width: 1px;
+  box-sizing: border-box;
+  display: flex;
+  height: var(--vuuFilterEditor-height, 30px);
+}
+.vuuFilterInput-Editor {
+  flex: 1 1 auto;
+  height: 100%;
+}
+.vuuFilterInput-FilterButton,
+.vuuFilterInput-ClearButton {
+  --vuu-icon-size: 12px;
+  --saltButton-width: var(--vuuFilterEditor-buttonWidth, 28px);
+}
+.vuuIllustration {
+  --vuuFilterEditor-suggestion-selectedBackground:var(--salt-container-secondary-background);
+  background: var(--salt-container-secondary-background);
+  color: var(--salt-text-secondary-foreground);
+}
+
+/* ../vuu-filters/src/filter-toolbar/FilterToolbar.css */
+.vuuFilterDropdown,
+.vuuFilterSwitch {
+  --saltToolbarField-marginTop: 0;
+  height: 100%;
+}
+.vuuFilterDropdown.saltFormField-focused:before {
+  top: 2px !important;
+  bottom: 2px !important;
+}
+
+/* src/TableGroupHeaderCell.css */
+.vuuTable-groupHeaderCell {
+  --cell-align: "flex-start";
+  text-align: left;
+  background: var(--table-background);
+  border-right: 1px solid var(--salt-separable-tertiary-borderColor);
+  border-bottom: 2px solid var(--salt-separable-tertiary-borderColor);
+  color: var(--salt-text-secondary-foreground);
+  cursor: default;
+  padding: 0 !important;
+  position: sticky;
+  top: 0;
+  height: var(--vuuTableHeaderHeight);
+  z-index: 1;
+}
+.vuuTable-groupHeaderCell-inner {
+  display: flex;
+  height: 100%;
+}
+.vuuTable-groupHeaderCell-label {
+  align-items: center;
+  display: flex;
+  flex: 0 0 auto;
+}
+.vuuTable-groupHeaderCell-col {
+  align-items: center;
+  background-color: inherit;
+  display: inline-flex;
+  flex: 0 1 auto;
+  height: calc(var(--vuuTableHeaderHeight) - 4px);
+  justify-content: space-between;
+  padding-right: 8px;
+  position: relative;
+}
+.vuuTable-groupHeaderCell-close {
+  --vuu-icon-height: 18px;
+  --vuu-icon-width: 18px;
+  cursor: pointer;
+  left: 3px;
+}
+.vuuTable-groupHeaderCell-col:nth-child(odd) {
+  background-color: var(--salt-color-gray-50);
+}
+.vuuTable-groupHeaderCell-col:nth-child(even) {
+  background-color: var(--salt-color-gray-40);
+}
+.vuuTable-groupHeaderCell-col:first-child {
+  clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 50%, calc(100% - 8px) 100%, 0 100%);
+  padding-left: 3px;
+  z-index: 1;
+}
+.vuuTable-groupHeaderCell-col:not(:first-child) {
+  margin-left: -6px;
+  padding-left: 12px;
+  clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 50%, calc(100% - 8px) 100%, 0 100%, 8px 50%);
+}
+.vuuTable-groupHeaderCell-resizing {
+  --columnResizer-color: var(--salt-color-blue-500);
+  --columnResizer-height: var(--table-height);
+  --columnResizer-width: 2px;
+}
+
+/* src/DataTable.css */
+.vuuDataTable {
+  background-color: var(--salt-container-primary-background, inherit);
+  position: relative;
+}
+.vuuDataTable-contentContainer {
+  --table-background: var(--salt-container-primary-background, inherit);
+  --vuuTable-contentHeight: var(--content-height, "auto");
+  --vuuTable-contentWidth: var(--content-width, "auto");
+  --vuuTableHeaderHeight: var(--header-height, 30px);
+  --vuuTable-height: calc(var(--table-height) - var(--scrollbar-size));
+  --vuuTable-pinnedWidthLeft: var(--pinned-width-left, 0pxs);
+  --vuuTable-scrollbarSize: var(--scrollbar-size, 15px);
+  --vuuTable-width: calc(var(--table-width) - var(--scrollbar-size));
+  background-color: var(--salt-container-primary-background);
+  height: var(--vuuTable-height);
+  position: relative;
+  overflow: auto;
+  overscroll-behavior: none;
+  width: var(--vuuTable-width);
+}
+.vuuDataTable-contentContainer::-webkit-scrollbar {
+  display: none;
+}
+.vuuDataTable-scrollbarContainer {
+  --scroll-content-width: calc(var(--content-width) - var(--pinned-width-left));
+  border-left: solid 1px var(--salt-container-primary-borderColor);
+  border-top: solid 1px var(--salt-container-primary-borderColor);
+  overflow: auto;
+  position: absolute;
+  height: calc(var(--table-height) - var(--total-header-height) + 1px);
+  width: calc(var(--table-width) - var(--pinned-width-left) + 1px);
+}
+.vuuDataTable-scrollContainerHeader {
+  background: #777;
+  height: var(--header-height);
+  position: fixed;
+  top: 0;
+  right: 0;
+  width: var(--vuuTable-scrollbarSize);
+}
+.vuuDataTable-scrollContainerFooter {
+  background-color: green;
+  height: var(--vuuTable-scrollbarSize);
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  width: var(--pinned-width-left);
+}
+.vuuDataTable-scrollContent {
+  position: absolute;
+  height: var(--content-height);
+  width: var(--scroll-content-width, var(--content-width));
+}
+.vuuDataTable-tableContainer {
+  background-color: var(--table-background);
+  border-bottom: solid 1px var(--salt-container-primary-borderColor);
+  height: calc(var(--table-height) - var(--scrollbar-size));
+  left: 0px;
+  overflow: hidden;
+  position: sticky;
+  top: 0px;
+  width: calc(var(--table-width) - var(--scrollbar-size));
+  white-space: nowrap;
+}
+.vuuDataTable-table {
+  --vuuTable-rowHeight: var(--row-height);
+  --vuuTableCell-border-bottomColor: transparent;
+  --vuuTableCell-border-rightColor: var(--salt-separable-tertiary-borderColor);
+  position: absolute;
+  top: 0;
+  left: 0;
+  background: repeating-linear-gradient(to bottom, var(--salt-container-secondary-background), var(--salt-container-secondary-background) 20px, var(--table-background) 20px, var(--table-background) 40px);
+  border-collapse: separate;
+  border-spacing: 0;
+  border-left: 1px solid #ccc;
+  border: none;
+  font-size: var(--vuuDataTable-font-size, 10px);
+  margin: 0;
+  min-height: 100%;
+  table-layout: fixed;
+  width: var(--vuuTable-contentWidth);
+}
+.vuuDataTable-columnBased {
+  display: inline-table;
+  height: var(--vuuTable-height);
+  position: static;
+}
+.vuuDataTable-filler {
+  height: var(--filler-height);
+}
+:is(.vuuPinLeft, .vuuPinRight, .vuuPinFloating) {
+  position: sticky;
+}
+.vuuAlignRight {
+  text-align: right;
+}
+th:is(.vuuPinLeft, .vuuPinRight, .vuuPinFloating) {
+  top: 0;
+  z-index: 20;
+}
+table:is(.vuuPinLeft, .vuuPinRight, .vuuPinFloating) {
+  z-index: 10;
+}
+.vuuDataTable-settings {
+  height: var(--header-height);
+  position: absolute;
+  right: 0;
+  top: 0;
+  width: 15px;
+}
+.vuuDataTable:has(.vuuTable-headerCell-resizing) * {
+  cursor: col-resize;
+}
+.saltDraggable-table-column {
+  background-color: var(--salt-container-primary-background);
+  overflow: hidden;
+}
 /*# sourceMappingURL=index.css.map */