@rs-x/cli 2.0.0-next.19 → 2.0.0-next.20

package/templates/next-demo/lib/virtual-table-controller.ts

@@ -1,5 +1,5 @@
 import { type RowData, type SortDirection, type SortKey } from '@/lib/row-data';
-import { createRowModel, updateRowModel, type RowModel } from '@/lib/row-model';
+import { createRowModel, type RowModel, updateRowModel } from '@/lib/row-model';
 import { VirtualTableDataService } from '@/lib/virtual-table-data.service';
 
 export type RowView = {
@@ -36,7 +36,10 @@ export class VirtualTableController {
   private sortKey: SortKey = 'id';
   private sortDirection: SortDirection = 'asc';
   private spacerHeight: number;
-  private rowsInView = Math.max(1, Math.ceil(this.viewportHeight / this.rowHeight));
+  private rowsInView = Math.max(
+    1,
+    Math.ceil(this.viewportHeight / this.rowHeight),
+  );
   private visibleRows: RowView[] = [];
   private snapshot: VirtualTableSnapshot;
 
@@ -78,7 +81,10 @@ export class VirtualTableController {
 
   public setViewportHeight(height: number): void {
     this.viewportHeight = height;
-    this.rowsInView = Math.max(1, Math.ceil(this.viewportHeight / this.rowHeight));
+    this.rowsInView = Math.max(
+      1,
+      Math.ceil(this.viewportHeight / this.rowHeight),
+    );
     this.refresh();
   }
 
@@ -89,7 +95,10 @@ export class VirtualTableController {
 
     this.rowHeight = height;
     this.spacerHeight = this.totalRows * this.rowHeight;
-    this.rowsInView = Math.max(1, Math.ceil(this.viewportHeight / this.rowHeight));
+    this.rowsInView = Math.max(
+      1,
+      Math.ceil(this.viewportHeight / this.rowHeight),
+    );
     this.refresh();
   }
 
@@ -112,7 +121,10 @@ export class VirtualTableController {
 
   private refresh(): void {
     const scrollIndex = Math.floor(this.scrollTop / this.rowHeight);
-    const bufferTop = Math.max(0, Math.floor((this.poolSize - this.rowsInView) / 2));
+    const bufferTop = Math.max(
+      0,
+      Math.floor((this.poolSize - this.rowsInView) / 2),
+    );
     const maxStart = Math.max(0, this.totalRows - this.poolSize);
     const startIndex = Math.min(Math.max(scrollIndex - bufferTop, 0), maxStart);
     const endIndex = Math.min(startIndex + this.poolSize, this.totalRows);

package/templates/next-demo/lib/virtual-table-data.service.ts

@@ -42,7 +42,11 @@ export class VirtualTableDataService {
     const items: RowData[] = [];
     const endIndex = Math.min(startIndex + pageSize, TOTAL_ROWS);
 
-    for (let visualIndex = startIndex; visualIndex < endIndex; visualIndex += 1) {
+    for (
+      let visualIndex = startIndex;
+      visualIndex < endIndex;
+      visualIndex += 1
+    ) {
       const id = this.getIdAtVisualIndex(visualIndex, sortKey, sortDirection);
       items.push(createRowData(id));
     }
@@ -116,7 +120,9 @@ export class VirtualTableDataService {
 
   private trimCache(): void {
     while (this.pageCache.size > MAX_CACHED_PAGES) {
-      const oldestKey = this.pageCache.keys().next().value as string | undefined;
+      const oldestKey = this.pageCache.keys().next().value as
+        | string
+        | undefined;
       if (!oldestKey) {
         return;
       }

package/templates/react-demo/src/app/app.tsx

@@ -34,9 +34,9 @@ export const App: FC = () => {
                 Million-row scrolling with a fixed RS-X expression pool.
               </p>
               <p className="hSub">
-                This demo keeps rendering bounded while streaming pages on demand,
-                so scrolling stays smooth without growing expression memory with the
-                dataset.
+                This demo keeps rendering bounded while streaming pages on
+                demand, so scrolling stays smooth without growing expression
+                memory with the dataset.
               </p>
 
               <div className="heroActions">

package/templates/react-demo/src/app/virtual-table/row-model.ts

@@ -1,4 +1,4 @@
-import { rsx, type IExpression } from '@rs-x/expression-parser';
+import { type IExpression, rsx } from '@rs-x/expression-parser';
 
 import type { RowData } from './row-data';
 

package/templates/react-demo/src/app/virtual-table/virtual-table-controller.ts

@@ -1,5 +1,5 @@
 import { type RowData, type SortDirection, type SortKey } from './row-data';
-import { createRowModel, updateRowModel, type RowModel } from './row-model';
+import { createRowModel, type RowModel, updateRowModel } from './row-model';
 import { VirtualTableDataService } from './virtual-table-data.service';
 
 export type RowView = {
@@ -36,7 +36,10 @@ export class VirtualTableController {
   private sortKey: SortKey = 'id';
   private sortDirection: SortDirection = 'asc';
   private spacerHeight: number;
-  private rowsInView = Math.max(1, Math.ceil(this.viewportHeight / this.rowHeight));
+  private rowsInView = Math.max(
+    1,
+    Math.ceil(this.viewportHeight / this.rowHeight),
+  );
   private visibleRows: RowView[] = [];
   private snapshot: VirtualTableSnapshot;
 
@@ -78,7 +81,10 @@ export class VirtualTableController {
 
   public setViewportHeight(height: number): void {
     this.viewportHeight = height;
-    this.rowsInView = Math.max(1, Math.ceil(this.viewportHeight / this.rowHeight));
+    this.rowsInView = Math.max(
+      1,
+      Math.ceil(this.viewportHeight / this.rowHeight),
+    );
     this.refresh();
   }
 
@@ -89,7 +95,10 @@ export class VirtualTableController {
 
     this.rowHeight = height;
     this.spacerHeight = this.totalRows * this.rowHeight;
-    this.rowsInView = Math.max(1, Math.ceil(this.viewportHeight / this.rowHeight));
+    this.rowsInView = Math.max(
+      1,
+      Math.ceil(this.viewportHeight / this.rowHeight),
+    );
     this.refresh();
   }
 
@@ -112,7 +121,10 @@ export class VirtualTableController {
 
   private refresh(): void {
     const scrollIndex = Math.floor(this.scrollTop / this.rowHeight);
-    const bufferTop = Math.max(0, Math.floor((this.poolSize - this.rowsInView) / 2));
+    const bufferTop = Math.max(
+      0,
+      Math.floor((this.poolSize - this.rowsInView) / 2),
+    );
     const maxStart = Math.max(0, this.totalRows - this.poolSize);
     const startIndex = Math.min(Math.max(scrollIndex - bufferTop, 0), maxStart);
     const endIndex = Math.min(startIndex + this.poolSize, this.totalRows);

package/templates/react-demo/src/app/virtual-table/virtual-table-data.service.ts

@@ -42,7 +42,11 @@ export class VirtualTableDataService {
     const items: RowData[] = [];
     const endIndex = Math.min(startIndex + pageSize, TOTAL_ROWS);
 
-    for (let visualIndex = startIndex; visualIndex < endIndex; visualIndex += 1) {
+    for (
+      let visualIndex = startIndex;
+      visualIndex < endIndex;
+      visualIndex += 1
+    ) {
       const id = this.getIdAtVisualIndex(visualIndex, sortKey, sortDirection);
       items.push(createRowData(id));
     }
@@ -116,7 +120,9 @@ export class VirtualTableDataService {
 
   private trimCache(): void {
     while (this.pageCache.size > MAX_CACHED_PAGES) {
-      const oldestKey = this.pageCache.keys().next().value as string | undefined;
+      const oldestKey = this.pageCache.keys().next().value as
+        | string
+        | undefined;
       if (!oldestKey) {
         return;
       }

package/templates/react-demo/src/app/virtual-table/virtual-table-shell.tsx

@@ -2,6 +2,7 @@ import { type FC } from 'react';
 
 import { useVirtualTableController } from '../hooks/use-virtual-table-controller';
 import { useVirtualTableViewport } from '../hooks/use-virtual-table-viewport';
+
 import { VirtualTableRow } from './virtual-table-row';
 
 export const VirtualTableShell: FC = () => {

package/templates/react-demo/src/main.tsx

@@ -3,6 +3,7 @@ import { createRoot } from 'react-dom/client';
 
 import { App } from './app/app';
 import { initRsx } from './rsx-bootstrap';
+
 import './styles.css';
 
 async function start(): Promise<void> {

package/templates/react-demo/vite.config.ts

@@ -1,5 +1,5 @@
-import { defineConfig } from 'vite';
 import react from '@vitejs/plugin-react';
+import { defineConfig } from 'vite';
 
 export default defineConfig({
   plugins: [react()],

package/templates/vue-demo/src/App.vue

@@ -42,8 +42,8 @@ function toggleTheme(): void {
             </p>
             <p class="hSub">
               This demo keeps rendering bounded while streaming pages on demand,
-              so scrolling stays smooth without growing expression memory with the
-              dataset.
+              so scrolling stays smooth without growing expression memory with
+              the dataset.
             </p>
 
             <div class="heroActions">
@@ -69,9 +69,9 @@ function toggleTheme(): void {
           <aside class="card heroNote">
             <h2 class="cardTitle">What This Shows</h2>
             <p class="cardText">
-              Only a small row-model pool stays alive while pages stream in around
-              the viewport. That means one million logical rows without one million
-              live bindings.
+              Only a small row-model pool stays alive while pages stream in
+              around the viewport. That means one million logical rows without
+              one million live bindings.
             </p>
           </aside>
         </div>

package/templates/vue-demo/src/components/VirtualTableShell.vue

@@ -16,12 +16,20 @@ const visibleRows = computed(() => snapshot.value.visibleRows);
   <section class="table-toolbar">
     <div class="toolbar-left">
       <h2>Inventory Snapshot</h2>
-      <p>{{ snapshot.totalRows }} rows • {{ snapshot.poolSize }} pre-wired models</p>
+      <p>
+        {{ snapshot.totalRows }} rows • {{ snapshot.poolSize }} pre-wired models
+      </p>
     </div>
     <div class="toolbar-right">
-      <button type="button" @click="controller.toggleSort('price')">Sort by price</button>
-      <button type="button" @click="controller.toggleSort('quantity')">Sort by stock</button>
-      <button type="button" @click="controller.toggleSort('name')">Sort by name</button>
+      <button type="button" @click="controller.toggleSort('price')">
+        Sort by price
+      </button>
+      <button type="button" @click="controller.toggleSort('quantity')">
+        Sort by stock
+      </button>
+      <button type="button" @click="controller.toggleSort('name')">
+        Sort by name
+      </button>
     </div>
   </section>
 
@@ -38,9 +46,14 @@ const visibleRows = computed(() => snapshot.value.visibleRows);
   <div
     ref="viewport"
     class="table-viewport"
-    @scroll="controller.setScrollTop(($event.target as HTMLDivElement).scrollTop)"
+    @scroll="
+      controller.setScrollTop(($event.target as HTMLDivElement).scrollTop)
+    "
   >
-    <div class="table-spacer" :style="{ height: `${snapshot.spacerHeight}px` }" />
+    <div
+      class="table-spacer"
+      :style="{ height: `${snapshot.spacerHeight}px` }"
+    />
     <VirtualTableRow
       v-for="item in visibleRows"
       :key="item.index"

package/templates/vue-demo/src/composables/use-virtual-table-controller.ts

@@ -1,8 +1,8 @@
 import {
   getCurrentScope,
   onScopeDispose,
-  shallowRef,
   type ShallowRef,
+  shallowRef,
 } from 'vue';
 
 import {

package/templates/vue-demo/src/env.d.ts

@@ -1,6 +1,10 @@
 declare module '*.vue' {
   import type { DefineComponent } from 'vue';
 
-  const component: DefineComponent<Record<string, never>, Record<string, never>, unknown>;
+  const component: DefineComponent<
+    Record<string, never>,
+    Record<string, never>,
+    unknown
+  >;
   export default component;
 }

package/templates/vue-demo/src/lib/row-model.ts

@@ -1,4 +1,4 @@
-import { rsx, type IExpression } from '@rs-x/expression-parser';
+import { type IExpression, rsx } from '@rs-x/expression-parser';
 
 import type { RowData } from './row-data';
 

package/templates/vue-demo/src/lib/virtual-table-controller.ts

@@ -1,5 +1,5 @@
 import { type RowData, type SortDirection, type SortKey } from './row-data';
-import { createRowModel, updateRowModel, type RowModel } from './row-model';
+import { createRowModel, type RowModel, updateRowModel } from './row-model';
 import { VirtualTableDataService } from './virtual-table-data.service';
 
 export type RowView = {
@@ -36,7 +36,10 @@ export class VirtualTableController {
   private sortKey: SortKey = 'id';
   private sortDirection: SortDirection = 'asc';
   private spacerHeight: number;
-  private rowsInView = Math.max(1, Math.ceil(this.viewportHeight / this.rowHeight));
+  private rowsInView = Math.max(
+    1,
+    Math.ceil(this.viewportHeight / this.rowHeight),
+  );
   private visibleRows: RowView[] = [];
   private snapshot: VirtualTableSnapshot;
 
@@ -78,7 +81,10 @@ export class VirtualTableController {
 
   public setViewportHeight(height: number): void {
     this.viewportHeight = height;
-    this.rowsInView = Math.max(1, Math.ceil(this.viewportHeight / this.rowHeight));
+    this.rowsInView = Math.max(
+      1,
+      Math.ceil(this.viewportHeight / this.rowHeight),
+    );
     this.refresh();
   }
 
@@ -89,7 +95,10 @@ export class VirtualTableController {
 
     this.rowHeight = height;
     this.spacerHeight = this.totalRows * this.rowHeight;
-    this.rowsInView = Math.max(1, Math.ceil(this.viewportHeight / this.rowHeight));
+    this.rowsInView = Math.max(
+      1,
+      Math.ceil(this.viewportHeight / this.rowHeight),
+    );
     this.refresh();
   }
 
@@ -112,7 +121,10 @@ export class VirtualTableController {
 
   private refresh(): void {
     const scrollIndex = Math.floor(this.scrollTop / this.rowHeight);
-    const bufferTop = Math.max(0, Math.floor((this.poolSize - this.rowsInView) / 2));
+    const bufferTop = Math.max(
+      0,
+      Math.floor((this.poolSize - this.rowsInView) / 2),
+    );
     const maxStart = Math.max(0, this.totalRows - this.poolSize);
     const startIndex = Math.min(Math.max(scrollIndex - bufferTop, 0), maxStart);
     const endIndex = Math.min(startIndex + this.poolSize, this.totalRows);

package/templates/vue-demo/src/lib/virtual-table-data.service.ts

@@ -42,7 +42,11 @@ export class VirtualTableDataService {
     const items: RowData[] = [];
     const endIndex = Math.min(startIndex + pageSize, TOTAL_ROWS);
 
-    for (let visualIndex = startIndex; visualIndex < endIndex; visualIndex += 1) {
+    for (
+      let visualIndex = startIndex;
+      visualIndex < endIndex;
+      visualIndex += 1
+    ) {
       const id = this.getIdAtVisualIndex(visualIndex, sortKey, sortDirection);
       items.push(createRowData(id));
     }
@@ -116,7 +120,9 @@ export class VirtualTableDataService {
 
   private trimCache(): void {
     while (this.pageCache.size > MAX_CACHED_PAGES) {
-      const oldestKey = this.pageCache.keys().next().value as string | undefined;
+      const oldestKey = this.pageCache.keys().next().value as
+        | string
+        | undefined;
       if (!oldestKey) {
         return;
       }

package/templates/vue-demo/src/main.ts

@@ -1,7 +1,8 @@
 import { createApp } from 'vue';
 
-import App from './App.vue';
 import { initRsx } from './lib/rsx-bootstrap';
+import App from './App.vue';
+
 import './style.css';
 
 async function bootstrap(): Promise<void> {