@regcheq/ui-vue-2 1.7.0 → 1.9.0

package/dist/index.css

@@ -549,10 +549,10 @@
   animation: rq-spin 1s linear infinite;
 }
 .rq-button--sm {
-  height: 36px;
-  padding: 8px 12px;
+  height: 30px;
+  padding: 4px 12px;
   gap: 4px;
-  font-size: 14px;
+  font-size: 12px;
   line-height: 20px;
 }
 .rq-button--md {
@@ -642,15 +642,15 @@
 }
 .rq-button--ghost {
   background: transparent;
-  color: #8c8aa9;
+  color: #52525b;
 }
 .rq-button--ghost:hover:not(:disabled):not(.rq-button--disabled) {
   background: #e6e6ec;
-  color: #52525b;
+  color: #18181b;
 }
 .rq-button--ghost:active:not(:disabled):not(.rq-button--disabled) {
   background: #e6e6ec;
-  color: #52525b;
+  color: #18181b;
 }
 .rq-button--ghost:focus-visible {
   color: #18181b;

package/dist/index.esm.js

@@ -37688,7 +37688,7 @@ var script$4 = {
     },
     maxHeight: {
       type: Number,
-      default: null
+      default: 460
     },
     expandable: {
       type: Boolean,
@@ -37857,6 +37857,27 @@ var script$4 = {
     toggleExpand(rowId) {
       this.expandedRowId = this.expandedRowId === rowId ? null : rowId;
       this.$emit('update:expanded-row-id', this.expandedRowId);
+      if (this.expandedRowId) {
+        this.$nextTick(() => this.scrollExpandedIntoView());
+      }
+    },
+    // Al expandir una fila, scrollea el contenedor propio de la tabla para
+    // hacer visible el contenido desplegado (no toca el scroll de la página).
+    scrollExpandedIntoView() {
+      const scroll = this.$el.querySelector('.rq-table__scroll');
+      const expanded = this.$el.querySelector('.rq-table__tr--expanded');
+      if (!scroll || !expanded) return;
+      const scrollRect = scroll.getBoundingClientRect();
+      const expandedRect = expanded.getBoundingClientRect();
+      const bottomDelta = expandedRect.bottom - scrollRect.bottom;
+      if (bottomDelta > 0) {
+        // no scrollear más allá de dejar el inicio del contenido visible
+        const topDelta = expandedRect.top - scrollRect.top;
+        scroll.scrollTo({
+          top: scroll.scrollTop + Math.min(bottomDelta, topDelta),
+          behavior: 'smooth'
+        });
+      }
     },
     cellKey(rowId, headerId) {
       return `${rowId}::${headerId}`;
@@ -38355,7 +38376,7 @@ var script$3 = {
     },
     maxHeight: {
       type: Number,
-      default: null
+      default: 460
     },
     deleteLabel: {
       type: String,

package/dist/index.js

@@ -37690,7 +37690,7 @@ var script$4 = {
     },
     maxHeight: {
       type: Number,
-      default: null
+      default: 460
     },
     expandable: {
       type: Boolean,
@@ -37859,6 +37859,27 @@ var script$4 = {
     toggleExpand(rowId) {
       this.expandedRowId = this.expandedRowId === rowId ? null : rowId;
       this.$emit('update:expanded-row-id', this.expandedRowId);
+      if (this.expandedRowId) {
+        this.$nextTick(() => this.scrollExpandedIntoView());
+      }
+    },
+    // Al expandir una fila, scrollea el contenedor propio de la tabla para
+    // hacer visible el contenido desplegado (no toca el scroll de la página).
+    scrollExpandedIntoView() {
+      const scroll = this.$el.querySelector('.rq-table__scroll');
+      const expanded = this.$el.querySelector('.rq-table__tr--expanded');
+      if (!scroll || !expanded) return;
+      const scrollRect = scroll.getBoundingClientRect();
+      const expandedRect = expanded.getBoundingClientRect();
+      const bottomDelta = expandedRect.bottom - scrollRect.bottom;
+      if (bottomDelta > 0) {
+        // no scrollear más allá de dejar el inicio del contenido visible
+        const topDelta = expandedRect.top - scrollRect.top;
+        scroll.scrollTo({
+          top: scroll.scrollTop + Math.min(bottomDelta, topDelta),
+          behavior: 'smooth'
+        });
+      }
     },
     cellKey(rowId, headerId) {
       return `${rowId}::${headerId}`;
@@ -38357,7 +38378,7 @@ var script$3 = {
     },
     maxHeight: {
       type: Number,
-      default: null
+      default: 460
     },
     deleteLabel: {
       type: String,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@regcheq/ui-vue-2",
-  "version": "1.7.0",
+  "version": "1.9.0",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",
   "files": [