vira 26.1.1 → 26.2.0

package/dist/util/define-table.d.ts

@@ -26,13 +26,27 @@ export type ViraTableHeaders = ReadonlyArray<ViraTableKey>;
  */
 export type ViraTableEntry<Headers extends ViraTableHeaders | undefined = undefined> = Record<HeaderKey<Headers>, HtmlInterpolation>;
 /**
- * An individual cell in {@link ViraTable}.
+ * An individual cell in {@link ViraTableRow}.
  *
  * @category Internal
  */
-export type ViraTableCell<Headers extends ViraTableHeaders | undefined = undefined> = {
+export type ViraTableCell<Headers extends ViraTableHeaders | undefined = undefined, Entry extends ViraTableEntry<Headers> | undefined = ViraTableEntry<Headers>> = {
     content: HtmlInterpolation;
     key: HeaderKey<Headers>;
+    /**
+     * The original entry that created this row (in default or vertical table orientation) or column
+     * (in horizontal table orientation). This is `undefined` in header cells.
+     */
+    entry: Entry;
+};
+/**
+ * An individual row in {@link ViraTable}.
+ *
+ * @category Internal
+ */
+export type ViraTableRow<Headers extends ViraTableHeaders | undefined = undefined, CellEntry extends ViraTableEntry<Headers> | undefined = ViraTableEntry<Headers> | undefined, RowEntry extends ViraTableEntry<Headers> | undefined = CellEntry> = {
+    cells: ViraTableCell<Headers, CellEntry>[];
+    entry: RowEntry;
 };
 /**
  * All keys for the given headers.
@@ -45,14 +59,14 @@ export type HeaderKey<Headers extends ViraTableHeaders | undefined = undefined>
  *
  * @category Internal
  */
-export type ViraTable<Headers extends ViraTableHeaders | undefined = undefined, Orientation extends ViraTableOrientation = ViraTableOrientation.Vertical> = (Orientation extends ViraTableOrientation.Horizontal ? {
+export type ViraTable<Headers extends ViraTableHeaders | undefined = undefined, Orientation extends ViraTableOrientation = ViraTableOrientation.Vertical, Entry extends ViraTableEntry<Headers> = ViraTableEntry<Headers>> = Orientation extends ViraTableOrientation.Horizontal ? {
     headerRow: undefined;
     orientation: Orientation;
+    rows: ViraTableRow<Headers, Entry | undefined, undefined>[];
 } : {
-    headerRow: ViraTableCell<Headers>[];
+    headerRow: ViraTableCell<Headers, undefined>[];
     orientation: Orientation;
-}) & {
-    rows: ViraTableCell<Headers>[][];
+    rows: ViraTableRow<Headers, Entry>[];
 };
 /**
  * Orientation options for {@link ViraTable}.
@@ -61,12 +75,14 @@ export type ViraTable<Headers extends ViraTableHeaders | undefined = undefined,
  */
 export declare enum ViraTableOrientation {
     /**
-     * This is the default table layout. Each entry becomes a new row. Headers are a row at the top
-     * of the table.
+     * This corresponds to a _vertical_ entry sequence (as you move from entry to entry, you move
+     * across the table vertically). This is the default table layout. Each entry becomes a new row.
+     * Headers are in a separate row.
      */
     Vertical = "vertical",
     /**
-     * This is a pivoted table layout. Each entry becomes a column. Headers are the left most
+     * This corresponds to a _horizontal_ entry sequence (as you move from entry to entry, you move
+     * across the table horizontally). Each entry becomes a column. Headers are the left most
      * column.
      */
     Horizontal = "horizontal"
@@ -87,6 +103,6 @@ export type ViraTableOptions<Orientation extends ViraTableOrientation = ViraTabl
  *
  * @category Table
  */
-export declare function defineTable<const Headers extends ViraTableHeaders, const Orientation extends ViraTableOrientation = ViraTableOrientation.Vertical>(
+export declare function defineTable<const Headers extends ViraTableHeaders, Entry extends ViraTableEntry<Headers>, const Orientation extends ViraTableOrientation = ViraTableOrientation.Vertical>(
 /** The order of these keys determines the order that they render in. */
-headers: Readonly<Headers>, entries: ReadonlyArray<Readonly<ViraTableEntry<Headers>>>, options?: ViraTableOptions<Orientation>): ViraTable<Headers, Orientation>;
+headers: Readonly<Headers>, entries: Entry[], options?: ViraTableOptions<Orientation>): ViraTable<Headers, Orientation>;

package/dist/util/define-table.js

@@ -6,12 +6,14 @@
 export var ViraTableOrientation;
 (function (ViraTableOrientation) {
     /**
-     * This is the default table layout. Each entry becomes a new row. Headers are a row at the top
-     * of the table.
+     * This corresponds to a _vertical_ entry sequence (as you move from entry to entry, you move
+     * across the table vertically). This is the default table layout. Each entry becomes a new row.
+     * Headers are in a separate row.
      */
     ViraTableOrientation["Vertical"] = "vertical";
     /**
-     * This is a pivoted table layout. Each entry becomes a column. Headers are the left most
+     * This corresponds to a _horizontal_ entry sequence (as you move from entry to entry, you move
+     * across the table horizontally). Each entry becomes a column. Headers are the left most
      * column.
      */
     ViraTableOrientation["Horizontal"] = "horizontal";
@@ -34,18 +36,24 @@ headers, entries, options = {}) {
                     {
                         content: header.content ?? header.key,
                         key: header.key,
+                        entry: undefined,
                     },
                 ];
             const cells = entries.map((entry) => {
                 return {
                     content: entry[header.key],
                     key: header.key,
+                    entry,
                 };
             });
-            return [
+            const allCells = [
                 ...headerCellArray,
                 ...cells,
             ];
+            return {
+                cells: allCells,
+                entry: undefined,
+            };
         });
         return {
             headerRow: undefined,
@@ -60,15 +68,20 @@ headers, entries, options = {}) {
                 return {
                     content: header.content ?? header.key,
                     key: header.key,
+                    entry: undefined,
                 };
             });
         const rows = entries.map((entry) => {
-            return headers.map((header) => {
-                return {
-                    content: entry[header.key],
-                    key: header.key,
-                };
-            });
+            return {
+                cells: headers.map((header) => {
+                    return {
+                        content: entry[header.key],
+                        key: header.key,
+                        entry,
+                    };
+                }),
+                entry,
+            };
         });
         return {
             headerRow,

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "vira",
-    "version": "26.1.1",
+    "version": "26.2.0",
     "description": "A simple and highly versatile design system using element-vir.",
     "keywords": [
         "design",
@@ -47,7 +47,7 @@
         "lit-css-vars": "^3.0.11",
         "observavir": "^2.0.5",
         "page-active": "^1.0.1",
-        "spa-router-vir": "^6.0.0",
+        "spa-router-vir": "^6.1.1",
         "type-fest": "^4.41.0",
         "typed-event-target": "^4.1.0"
     },
@@ -56,7 +56,7 @@
         "@web/dev-server-esbuild": "^1.0.4",
         "@web/test-runner": "^0.20.2",
         "@web/test-runner-commands": "^0.9.0",
-        "@web/test-runner-playwright": "^0.11.0",
+        "@web/test-runner-playwright": "^0.11.1",
         "@web/test-runner-visual-regression": "^0.10.0",
         "esbuild": "^0.25.5",
         "istanbul-smart-text-reporter": "^1.1.5",
@@ -67,7 +67,7 @@
         "vite-tsconfig-paths": "^5.1.4"
     },
     "peerDependencies": {
-        "element-vir": "^26.1.1"
+        "element-vir": "^26.2.0"
     },
     "engines": {
         "node": ">=22"