@lensui/lens-table 0.1.50 → 0.1.52

package/dist/index.cjs

@@ -1161,7 +1161,7 @@ function paintGrid(options) {
             label = "Render error";
           }
           if (label) {
-            const padding = 10;
+            const padding = 4;
             const textX = column.align === "right" ? x + cellWidth - padding : column.align === "center" ? x + cellWidth / 2 : x + padding;
             ctx.save();
             ctx.beginPath();
@@ -1291,7 +1291,7 @@ function paintGrid(options) {
         const visibleActions = getVisibleHeaderActions(column, metric.width, columnDraggable, titleWidth, headerActionSlotWidth);
         const actionWidth = (Number(visibleActions.drag) + Number(visibleActions.filter) + Number(visibleActions.sort)) * headerActionSlotWidth;
         const contentWidth = Math.max(0, metric.width - actionWidth);
-        const padding = 10;
+        const padding = 4;
         const clipWidth = contentWidth;
         const centeredTextX = metric.width / 2;
         const centerTitleWidth = Math.max(0, Math.min(centeredTextX - padding, contentWidth - padding - centeredTextX) * 2);

package/dist/index.css

@@ -207,7 +207,7 @@
   display: flex;
   align-items: center;
   min-width: 0;
-  padding: 0 10px;
+  padding: 0 4px;
   overflow: hidden;
   color: var(--rvg-color-text);
   font-family:
@@ -254,7 +254,7 @@
   z-index: 1;
   display: flex;
   min-width: 0;
-  padding: 0 10px;
+  padding: 0 4px;
   align-items: center;
   overflow: hidden;
   color: var(--rvg-color-text);
@@ -1683,7 +1683,7 @@
   position: absolute;
   z-index: 2;
   margin: 0;
-  padding: 0 10px;
+  padding: 0 4px;
   border: 0;
   border-radius: 0;
   outline: 0;
@@ -1720,7 +1720,7 @@
   position: absolute;
   z-index: 6;
   display: flex;
-  padding: 0 28px 0 10px;
+  padding: 0 24px 0 4px;
   align-items: center;
   gap: 3px;
   background: var(--rvg-color-bg);
@@ -1751,16 +1751,16 @@
   position: absolute;
   z-index: 6;
   display: flex;
-  padding: 0 10px;
+  padding: 0 4px;
   align-items: center;
-  gap: 6px;
+  gap: 4px;
   overflow: hidden;
   background: var(--rvg-color-bg);
   line-height: 1;
   box-sizing: border-box;
 }
 .rvg-native-editor.has-clear {
-  padding-right: 10px;
+  padding-right: 4px;
 }
 .rvg-native-editor input {
   min-width: 0;
@@ -2001,7 +2001,7 @@
   display: flex;
   min-width: 0;
   height: 100%;
-  padding: 0 8px;
+  padding: 0 4px;
   flex: 1;
   align-items: center;
   border: 0;
@@ -2018,11 +2018,11 @@
   text-align: left;
 }
 .rvg-choice-editor [data-part=trigger] {
-  padding: 0 28px 0 10px;
+  padding: 0 24px 0 4px;
   line-height: 1;
 }
 .rvg-date-value {
-  padding: 0 8px 2px 10px;
+  padding: 0 4px 2px 4px;
 }
 .rvg-choice-editor [data-part=value-text] {
   min-width: 0;
@@ -2035,7 +2035,7 @@
 }
 .rvg-date-editor [data-part=control] {
   display: flex;
-  padding-right: 28px;
+  padding-right: 24px;
   align-items: center;
 }
 .rvg-date-separator {
@@ -2051,10 +2051,10 @@
 .rvg-date-editor [data-part=trigger] {
   position: absolute;
   top: 50%;
-  right: 4px;
+  right: 3px;
   display: grid;
-  width: 23px;
-  height: 23px;
+  width: 19px;
+  height: 19px;
   padding: 0;
   place-items: center;
   border: 0;
@@ -2068,10 +2068,10 @@
 .rvg-clear-trigger {
   position: absolute;
   top: 50%;
-  right: 4px;
+  right: 3px;
   display: grid;
-  width: 23px;
-  height: 23px;
+  width: 19px;
+  height: 19px;
   padding: 0;
   place-items: center;
   border: 0;
@@ -2086,10 +2086,14 @@
   background: var(--rvg-color-hover-muted);
   color: #3c4043;
 }
+.rvg-clear-trigger:focus-visible {
+  outline: 2px solid color-mix(in srgb, var(--rvg-color-primary) 45%, transparent);
+  outline-offset: 1px;
+}
 .rvg-clear-icon {
   display: block;
-  width: 14px;
-  height: 14px;
+  width: 12px;
+  height: 12px;
   fill: none;
   stroke: currentColor;
   stroke-width: 1.7;
@@ -2109,12 +2113,14 @@
   stroke-linejoin: round;
   paint-order: stroke fill;
 }
-.rvg-choice-editor [data-part=trigger]:hover [data-part=indicator] {
+.rvg-choice-editor [data-part=trigger]:hover [data-part=indicator],
+.rvg-date-editor [data-part=trigger]:hover {
+  background: var(--rvg-color-hover-muted);
   color: #3c4043;
 }
 .rvg-choice-chevron {
-  width: 16px;
-  height: 16px;
+  width: 14px;
+  height: 14px;
   transition: transform 160ms ease;
 }
 .rvg-choice-chevron path,

package/dist/index.js

@@ -1131,7 +1131,7 @@ function paintGrid(options) {
             label = "Render error";
           }
           if (label) {
-            const padding = 10;
+            const padding = 4;
             const textX = column.align === "right" ? x + cellWidth - padding : column.align === "center" ? x + cellWidth / 2 : x + padding;
             ctx.save();
             ctx.beginPath();
@@ -1261,7 +1261,7 @@ function paintGrid(options) {
         const visibleActions = getVisibleHeaderActions(column, metric.width, columnDraggable, titleWidth, headerActionSlotWidth);
         const actionWidth = (Number(visibleActions.drag) + Number(visibleActions.filter) + Number(visibleActions.sort)) * headerActionSlotWidth;
         const contentWidth = Math.max(0, metric.width - actionWidth);
-        const padding = 10;
+        const padding = 4;
         const clipWidth = contentWidth;
         const centeredTextX = metric.width / 2;
         const centerTitleWidth = Math.max(0, Math.min(centeredTextX - padding, contentWidth - padding - centeredTextX) * 2);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lensui/lens-table",
-  "version": "0.1.50",
+  "version": "0.1.52",
   "description": "A lightweight, canvas-rendered React table component for LensUI.",
   "type": "module",
   "main": "./dist/index.cjs",