@fusion.dev/helix-styles 0.168.0 → 0.170.0

package/dist/base.css

@@ -539,6 +539,9 @@ helix-toggle[disabled]::part(item) {
 :where(helix-navigation[orientation="vertical"]) :where([data-navigation-item], a) {
   justify-content: start;
 }
+:where(helix-navigation[variant="segmented"]) :where([data-navigation-item], a) {
+  min-block-size: 0;
+}
 :where(helix-navigation[orientation="vertical"]) :where(li) > :where([data-navigation-item], a) {
   display: flex;
 }

package/dist/elements.css

@@ -331,3 +331,131 @@ helix-virtual-list[align]
 ) {
   text-align: inherit;
 }
+helix-data-table:not(:defined):has(> helix-table-row),
+helix-data-table:not(:defined):has(> helix-table-row) > helix-table-column:not(:defined),
+helix-data-table > helix-table-row:not(:defined),
+helix-data-table > helix-table-row > helix-table-cell:not(:defined) {
+  visibility: visible;
+}
+helix-data-table:not(:defined):has(> helix-table-row) {
+  display: grid;
+  grid-template-columns: var(--data-table-columns, var(--data-table-template));
+  overflow-x: auto;
+}
+helix-data-table:not(:defined) {
+  --data-table-template: repeat(var(--_data-table-count, 1), minmax(max-content, 1fr));
+}
+helix-data-table:not(:defined):has(> helix-table-column:nth-of-type(1):last-of-type) {
+  --_data-table-count: 1;
+}
+helix-data-table:not(:defined):has(> helix-table-column:nth-of-type(2):last-of-type) {
+  --_data-table-count: 2;
+}
+helix-data-table:not(:defined):has(> helix-table-column:nth-of-type(3):last-of-type) {
+  --_data-table-count: 3;
+}
+helix-data-table:not(:defined):has(> helix-table-column:nth-of-type(4):last-of-type) {
+  --_data-table-count: 4;
+}
+helix-data-table:not(:defined):has(> helix-table-column:nth-of-type(5):last-of-type) {
+  --_data-table-count: 5;
+}
+helix-data-table:not(:defined):has(> helix-table-column:nth-of-type(6):last-of-type) {
+  --_data-table-count: 6;
+}
+helix-data-table:not(:defined):has(> helix-table-column:nth-of-type(7):last-of-type) {
+  --_data-table-count: 7;
+}
+helix-data-table:not(:defined):has(> helix-table-column:nth-of-type(8):last-of-type) {
+  --_data-table-count: 8;
+}
+helix-data-table:not(:defined):has(> helix-table-column:nth-of-type(9):last-of-type) {
+  --_data-table-count: 9;
+}
+helix-data-table:not(:defined):has(> helix-table-column:nth-of-type(10):last-of-type) {
+  --_data-table-count: 10;
+}
+helix-data-table:not(:defined):has(> helix-table-row) > helix-table-column:not([hidden]) {
+  align-items: center;
+  border-block-end: var(--helix-border-thin) solid
+    var(--data-table-rule-color, var(--helix-color-border));
+  box-sizing: border-box;
+  color: var(--data-table-heading-color, var(--helix-color-foreground-muted));
+  display: flex;
+  font-family: var(--helix-font-sans);
+  font-size: var(--data-table-text, var(--helix-text-sm));
+  font-weight: var(--helix-weight-semibold);
+  min-block-size: var(--helix-size-control-loose);
+  min-inline-size: 0;
+  padding-block: var(--data-table-padding-block, var(--helix-space-none));
+  padding-inline: var(--data-table-padding-inline, var(--helix-space-none) var(--helix-space-md));
+}
+helix-data-table:not(:defined):has(> helix-table-row) > helix-table-column[text-align="center"] {
+  justify-content: center;
+}
+helix-data-table:not(:defined):has(> helix-table-row) > helix-table-column[text-align="end"] {
+  justify-content: flex-end;
+}
+helix-data-table:not(:defined):has(> helix-table-row) > helix-table-column::part(column) {
+  border: none;
+  min-block-size: 0;
+  padding: 0;
+}
+helix-data-table > helix-table-row:not([hidden]) {
+  display: contents;
+}
+helix-data-table > helix-table-row > helix-table-cell {
+  border-block-end: var(--helix-border-thin) solid
+    var(--data-table-rule-color, var(--helix-color-border));
+  box-sizing: border-box;
+  color: var(--data-table-color, var(--helix-color-foreground));
+  display: block;
+  font-family: var(--helix-font-sans);
+  font-size: var(--data-table-text, var(--helix-text-sm));
+  font-weight: inherit;
+  min-block-size: auto;
+  min-inline-size: auto;
+  overflow-wrap: normal;
+  padding-block: var(--data-table-padding-block, var(--helix-space-sm));
+  padding-inline: var(--data-table-padding-inline, var(--helix-space-none) var(--helix-space-md));
+}
+helix-data-table > helix-table-row:last-of-type > helix-table-cell {
+  border-block-end-color: transparent;
+}
+helix-data-table:has(> helix-table-column:nth-of-type(1)[text-align="end"]) > helix-table-row > :nth-child(1),
+helix-data-table:has(> helix-table-column:nth-of-type(2)[text-align="end"]) > helix-table-row > :nth-child(2),
+helix-data-table:has(> helix-table-column:nth-of-type(3)[text-align="end"]) > helix-table-row > :nth-child(3),
+helix-data-table:has(> helix-table-column:nth-of-type(4)[text-align="end"]) > helix-table-row > :nth-child(4),
+helix-data-table:has(> helix-table-column:nth-of-type(5)[text-align="end"]) > helix-table-row > :nth-child(5),
+helix-data-table:has(> helix-table-column:nth-of-type(6)[text-align="end"]) > helix-table-row > :nth-child(6),
+helix-data-table:has(> helix-table-column:nth-of-type(7)[text-align="end"]) > helix-table-row > :nth-child(7),
+helix-data-table:has(> helix-table-column:nth-of-type(8)[text-align="end"]) > helix-table-row > :nth-child(8),
+helix-data-table:has(> helix-table-column:nth-of-type(9)[text-align="end"]) > helix-table-row > :nth-child(9),
+helix-data-table:has(> helix-table-column:nth-of-type(10)[text-align="end"]) > helix-table-row > :nth-child(10) {
+  text-align: end;
+}
+helix-data-table:defined:is([selectable], [reorderable-rows]) > helix-table-row > :first-child {
+  grid-column-start: 2;
+}
+helix-data-table:defined[selectable][reorderable-rows] > helix-table-row > :first-child {
+  grid-column-start: 3;
+}
+helix-data-table:not(:defined):has(> helix-table-row) > [slot="toolbar"] {
+  grid-column: 1 / -1;
+  margin-block-end: var(--data-table-toolbar-gap, var(--helix-space-sm));
+  order: -1;
+}
+helix-data-table:not(:defined):has(> helix-table-row)::part(toolbar) {
+  padding-block-end: 0;
+}
+helix-data-table:not(:defined):has(> helix-table-row) > [slot="footer"] {
+  grid-column: 1 / -1;
+  margin-block-start: var(--data-table-footer-gap, var(--helix-space-sm));
+  order: 1;
+}
+helix-data-table:not(:defined):has(> helix-table-row):has(> [slot="footer"])::part(footer) {
+  padding-block-start: 0;
+}
+helix-data-table:not(:defined):has(> helix-table-row) > :is([slot="empty"], [slot="error"], [slot="loading"]) {
+  display: none;
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fusion.dev/helix-styles",
   "description": "Design tokens and base layer. Pure CSS, no JavaScript.",
-  "version": "0.168.0",
+  "version": "0.170.0",
   "license": "MIT",
   "author": "Ross Sheppard <ross.sheppard@fusion.dev>",
   "repository": {