[mercury][tabular-grid] Add "min-inline-size" to helper mixin (#568)

bsastregx · web-flow · commit 5e27c348ae42 · 2025-05-06T17:36:20.000-03:00
* `[mercury][tabular-grid]` Add "min-inline-size" to helper mixin

* `[mercury][tabular-grid]` Update test bundle
diff --git a/packages/mercury/src/assets/scss/_helpers.scss b/packages/mercury/src/assets/scss/_helpers.scss
@@ -113,6 +113,7 @@
   $tabular-grid-cell-block-alignment: "start",
   $tabular-grid-cell-inline-alignment: "start",
   $tabular-grid-cell-apply-ellipsis: false,
+  $tabular-grid-cell-min-inline-size: 0,
   $tabular-grid-affected-columns-nth-list: null
 ) {
   $selector: null;
@@ -197,5 +198,8 @@
     {
       @include cell-ellipsis();
     }
+    @if $tabular-grid-cell-min-inline-size != "auto" {
+      min-inline-size: $tabular-grid-cell-min-inline-size;
+    }
   }
 }
diff --git a/packages/mercury/src/components/tabular-grid/_helpers.scss b/packages/mercury/src/components/tabular-grid/_helpers.scss
@@ -73,6 +73,7 @@
   $tabular-grid-cell-block-alignment: "start",
   $tabular-grid-cell-inline-alignment: "start",
   $tabular-grid-cell-apply-ellipsis: false,
+  $tabular-grid-cell-min-inline-size: 0,
   $tabular-grid-affected-columns-nth-list: null
 ) {
   $selector: null;
@@ -157,5 +158,8 @@
     {
       @include cell-ellipsis();
     }
+    @if $tabular-grid-cell-min-inline-size != "auto" {
+      min-inline-size: $tabular-grid-cell-min-inline-size;
+    }
   }
 }
diff --git a/packages/mercury/src/tests/bundles/expected-bundle-content/all.json b/packages/mercury/src/tests/bundles/expected-bundle-content/all.json
@@ -365,7 +365,7 @@
   ".tab::part(tab-list block-start) { border-block-end: var(--items-container__border-width) var(--items-container__border-style) var(--elevation-border-color, var(--items-container__border-color)); }",
   ".tab::part(tab-list inline-end) { border-inline-start: var(--items-container__border-width) var(--items-container__border-style) var(--elevation-border-color, var(--items-container__border-color)); }",
   ".tab::part(tab-list inline-start) { border-inline-end: var(--items-container__border-width) var(--items-container__border-style) var(--elevation-border-color, var(--items-container__border-color)); }",
-  ".tabular-grid ch-tabular-grid-cell { padding-block: var(--grid-cell__padding-block); padding-inline: var(--grid-cell__padding-inline); align-items: start; justify-content: start; }",
+  ".tabular-grid ch-tabular-grid-cell { padding-block: var(--grid-cell__padding-block); padding-inline: var(--grid-cell__padding-inline); align-items: start; justify-content: start; min-inline-size: 0px; }",
   ".tabular-grid, .property-grid { --focus__outline-offset: -2px; --grid-label__gap: var(--mer-spacing--xs); --grid-common__gap: var(--mer-spacing--xs); max-block-size: 100%; --indent: 16px; background-color: var(--elevation-background-color, var(--items-container__bg-color)); border-color: var(--elevation-border-color, var(--items-container__border-color)); --item__border-color--enabled: var(--mer-surface__elevation--01); --grid-rowset-legend__font-size: var(--grid-base__font-size); --grid-rowset-legend__color: var(--grid-base__color); --grid-rowset-legend__color--hover: var(--item__color--hover); --grid-rowset-legend__padding-inline: var(--item__padding-inline); --grid-rowset-legend__padding-block: var(--mer-spacing--3xs); --grid-rowset-legend__indent: var(--mer-spacing--md); --grid-row-actions-show-on-row-hover__margin-inline-end: var( --mer-spacing--xs ); --grid-column-bar__gap: var(--mer-spacing--xs); --grid-column-bar__bg-color: var(--grid-base__bg-color); --grid-column-bar__color: var(--mer-text__bright); --grid-column-bar__padding-inline: var(--mer-spacing--xs); --grid-column-bar__padding-block: var(--mer-spacing--xs); --grid-column-bar__font-size: var(--grid-base__font-size); --grid-bar-resize-split__inline-size: var(--mer-spacing--2xs); --grid-bar-resize-split__bg-color: transparent; --grid-bar-resize-split__border-inline-end: var(--mer-border__width--sm) solid transparent; --grid-bar-resize-split__border-inline-end-color--hover: var( --grid-column-bar__color ); }",
   ".tabular-grid-align-cells-block-center .tabular-grid-cell { align-items: center; }",
   ".tabular-grid-align-cells-block-end .tabular-grid-cell { align-items: flex-end; }",
diff --git a/packages/mercury/src/tests/bundles/expected-bundle-content/components/tabular-grid.json b/packages/mercury/src/tests/bundles/expected-bundle-content/components/tabular-grid.json
@@ -12,7 +12,7 @@
   ".property-grid-value-editing > .property-grid-cell:nth-child(2) { --control__border-width: 0; --control__border-color: transparent; --control__border-radius: 0; padding-block: 0px; padding-inline: 0px; --control__padding-inline: var(--grid-cell__padding-inline); display: grid; align-items: stretch; justify-content: stretch; }",
   ".property-grid-value-editing > .property-grid-cell:nth-child(2):hover { outline: var(--focus__outline-width) var(--focus__outline-style) var(--control__border-color--hover); outline-offset: var(--focus__outline-offset); }",
   ".property-grid:focus { outline: none; }",
-  ".tabular-grid ch-tabular-grid-cell { padding-block: var(--grid-cell__padding-block); padding-inline: var(--grid-cell__padding-inline); align-items: start; justify-content: start; }",
+  ".tabular-grid ch-tabular-grid-cell { padding-block: var(--grid-cell__padding-block); padding-inline: var(--grid-cell__padding-inline); align-items: start; justify-content: start; min-inline-size: 0px; }",
   ".tabular-grid, .property-grid { --focus__outline-offset: -2px; --grid-label__gap: var(--mer-spacing--xs); --grid-common__gap: var(--mer-spacing--xs); max-block-size: 100%; --indent: 16px; background-color: var(--elevation-background-color, var(--items-container__bg-color)); border-color: var(--elevation-border-color, var(--items-container__border-color)); --item__border-color--enabled: var(--mer-surface__elevation--01); --grid-rowset-legend__font-size: var(--grid-base__font-size); --grid-rowset-legend__color: var(--grid-base__color); --grid-rowset-legend__color--hover: var(--item__color--hover); --grid-rowset-legend__padding-inline: var(--item__padding-inline); --grid-rowset-legend__padding-block: var(--mer-spacing--3xs); --grid-rowset-legend__indent: var(--mer-spacing--md); --grid-row-actions-show-on-row-hover__margin-inline-end: var( --mer-spacing--xs ); --grid-column-bar__gap: var(--mer-spacing--xs); --grid-column-bar__bg-color: var(--grid-base__bg-color); --grid-column-bar__color: var(--mer-text__bright); --grid-column-bar__padding-inline: var(--mer-spacing--xs); --grid-column-bar__padding-block: var(--mer-spacing--xs); --grid-column-bar__font-size: var(--grid-base__font-size); --grid-bar-resize-split__inline-size: var(--mer-spacing--2xs); --grid-bar-resize-split__bg-color: transparent; --grid-bar-resize-split__border-inline-end: var(--mer-border__width--sm) solid transparent; --grid-bar-resize-split__border-inline-end-color--hover: var( --grid-column-bar__color ); }",
   ".tabular-grid, .property-grid, .tabular-grid-cell .combo-box, .property-grid-cell .combo-box, .tabular-grid-cell .input, .property-grid-cell .input { font-weight: var(--font-weight-regular); }",
   ".tabular-grid, .property-grid, .tabular-grid-cell .combo-box, .property-grid-cell .combo-box, .tabular-grid-cell .input, .property-grid-cell .input, .tabular-grid-column { font-size: var(--font-size-body-s); }",

Original file line number	Diff line number	Diff line change
`@@ -113,6 +113,7 @@`
`113`	`113`	`$tabular-grid-cell-block-alignment: "start",`
`114`	`114`	`$tabular-grid-cell-inline-alignment: "start",`
`115`	`115`	`$tabular-grid-cell-apply-ellipsis: false,`
	`116`	`+ $tabular-grid-cell-min-inline-size: 0,`
`116`	`117`	`$tabular-grid-affected-columns-nth-list: null`
`117`	`118`	`) {`
`118`	`119`	`$selector: null;`
`@@ -197,5 +198,8 @@`
`197`	`198`	`{`
`198`	`199`	`@include cell-ellipsis();`
`199`	`200`	`}`
	`201`	`+ @if $tabular-grid-cell-min-inline-size != "auto" {`
	`202`	`+ min-inline-size: $tabular-grid-cell-min-inline-size;`
	`203`	`+ }`
`200`	`204`	`}`
`201`	`205`	`}`
Original file line number	Diff line number	Diff line change
`@@ -73,6 +73,7 @@`
`73`	`73`	`$tabular-grid-cell-block-alignment: "start",`
`74`	`74`	`$tabular-grid-cell-inline-alignment: "start",`
`75`	`75`	`$tabular-grid-cell-apply-ellipsis: false,`
	`76`	`+ $tabular-grid-cell-min-inline-size: 0,`
`76`	`77`	`$tabular-grid-affected-columns-nth-list: null`
`77`	`78`	`) {`
`78`	`79`	`$selector: null;`
`@@ -157,5 +158,8 @@`
`157`	`158`	`{`
`158`	`159`	`@include cell-ellipsis();`
`159`	`160`	`}`
	`161`	`+ @if $tabular-grid-cell-min-inline-size != "auto" {`
	`162`	`+ min-inline-size: $tabular-grid-cell-min-inline-size;`
	`163`	`+ }`
`160`	`164`	`}`
`161`	`165`	`}`