initial tree implementation

.vscode/launch.json

@@ -7,7 +7,7 @@
       "name": "Debug PW tests",
       "cwd": "${workspaceFolder}/examples",
       "runtimeExecutable": "npm",
-      "runtimeArgs": ["run-script", "play:test"]
+      "runtimeArgs": ["run-script", "test:watch"]
     }
   ]
 }

examples/src/pages/tests/table/props/row-disabled-state/default.page.tsx

@@ -0,0 +1,160 @@
+import * as React from 'react';
+
+import {
+  InfiniteTableColumn,
+  InfiniteTable,
+  DataSource,
+} from '@infinite-table/infinite-react';
+
+type Developer = {
+  id: number;
+  firstName: string;
+  lastName: string;
+  country: string;
+  city: string;
+  currency: string;
+  preferredLanguage: string;
+  stack: string;
+  canDesign: 'yes' | 'no';
+  hobby: string;
+  salary: number;
+  age: number;
+};
+
+const dataSource: Developer[] = [
+  {
+    id: 1,
+    firstName: 'John',
+    lastName: 'Doe',
+    country: 'USA',
+    city: 'New York',
+    currency: 'USD',
+    preferredLanguage: 'English',
+    stack: 'Frontend',
+    canDesign: 'yes',
+    hobby: 'Reading',
+    salary: 100000,
+    age: 30,
+  },
+  {
+    id: 2,
+    firstName: 'Jane',
+    lastName: 'Doe',
+    country: 'USA',
+    city: 'New York',
+    currency: 'USD',
+    preferredLanguage: 'English',
+    stack: 'Frontend',
+    canDesign: 'yes',
+    hobby: 'Reading',
+    salary: 100000,
+    age: 30,
+  },
+  {
+    id: 3,
+    firstName: 'Alice',
+    lastName: 'Smith',
+    country: 'UK',
+    city: 'London',
+    currency: 'GBP',
+    preferredLanguage: 'English',
+    stack: 'Backend',
+    canDesign: 'no',
+    hobby: 'Painting',
+    salary: 90000,
+    age: 28,
+  },
+  {
+    id: 4,
+    firstName: 'Bob',
+    lastName: 'Johnson',
+    country: 'Canada',
+    city: 'Toronto',
+    currency: 'CAD',
+    preferredLanguage: 'French',
+    stack: 'Full Stack',
+    canDesign: 'yes',
+    hobby: 'Photography',
+    salary: 95000,
+    age: 35,
+  },
+  {
+    id: 5,
+    firstName: 'Eva',
+    lastName: 'Garcia',
+    country: 'Spain',
+    city: 'Barcelona',
+    currency: 'EUR',
+    preferredLanguage: 'Spanish',
+    stack: 'Frontend',
+    canDesign: 'yes',
+    hobby: 'Traveling',
+    salary: 85000,
+    age: 32,
+  },
+];
+
+const columns: Record<string, InfiniteTableColumn<Developer>> = {
+  identifier: {
+    field: 'id',
+    renderSelectionCheckBox: true,
+  },
+  name: {
+    field: 'firstName',
+    name: 'First Name',
+  },
+  city: { field: 'city' },
+
+  fullName: {
+    name: 'Full name',
+    render: ({ data }) => {
+      return (
+        <>
+          {data?.firstName} - {data?.lastName}
+        </>
+      );
+    },
+  },
+  age: {
+    field: 'age',
+    type: 'number',
+  },
+  country: {
+    field: 'country',
+  },
+};
+
+const domProps = {
+  style: { height: '80vh' },
+};
+
+export default function Example() {
+  return (
+    <>
+      <DataSource<Developer>
+        primaryKey="id"
+        data={dataSource}
+        defaultGroupRowsState={{
+          expandedRows: [],
+          collapsedRows: true,
+        }}
+        rowDisabledState={{
+          disabledRows: [2, 4],
+          enabledRows: true,
+        }}
+        rowSelection={{
+          selectedRows: [3],
+          defaultSelection: false,
+        }}
+        selectionMode="multi-row"
+      >
+        <InfiniteTable<Developer>
+          keyboardNavigation="row"
+          domProps={domProps}
+          columns={columns}
+          columnDefaultWidth={200}
+        ></InfiniteTable>
+      </DataSource>
+    </>
+  );
+}

examples/src/pages/tests/table/props/row-disabled-state/employees10.ts

@@ -0,0 +1,182 @@
+export const employees = [
+  {
+    id: 0,
+    companyName: 'Dibbert - Mitchell',
+    companySize: '0 - 10',
+    firstName: 'Jonathon',
+    lastName: 'Roberts',
+    country: 'Austria',
+    countryCode: 'AT',
+    city: 'Enzersdorf an der Fischa',
+    streetName: 'Streich Branch',
+    streetPrefix: 'Glens',
+    streetNo: 640,
+    age: 20,
+    department: 'Management',
+    team: 'TeamManagement',
+    salary: 118000,
+    email: '[email protected]',
+  },
+  {
+    id: 1,
+    companyName: 'Schuster, Towne and Schmidt',
+    companySize: '100 - 1000',
+    firstName: 'Trevor',
+    lastName: 'Hansen',
+    country: 'Martinique',
+    countryCode: 'MQ',
+    city: 'Case-Pilote',
+    streetName: 'Konopelski Mountain',
+    streetPrefix: 'Path',
+    streetNo: 648,
+    age: 52,
+    department: 'Marketing',
+    team: 'telemarketing',
+    salary: 59000,
+    email: '[email protected]',
+  },
+  {
+    id: 2,
+    companyName: 'Ankunding and Sons',
+    companySize: '100 - 1000',
+    firstName: 'Margret',
+    lastName: 'Douglas',
+    country: 'Hungary',
+    countryCode: 'HU',
+    city: 'Nagymagocs',
+    streetName: 'Ellen Passage',
+    streetPrefix: 'Springs',
+    streetNo: 835,
+    age: 46,
+    department: 'Executive',
+    team: 'ExecutivePlanning',
+    salary: 217000,
+    email: '[email protected]',
+  },
+  {
+    id: 3,
+    companyName: 'Volkman LLC',
+    companySize: '10 - 100',
+    firstName: 'Deon',
+    lastName: 'MacGyver',
+    country: 'Cuba',
+    countryCode: 'CU',
+    city: 'La Habana',
+    streetName: 'Antonina Courts',
+    streetPrefix: 'Inlet',
+    streetNo: 249,
+    age: 18,
+    department: 'IT',
+    team: 'infrastructure',
+    salary: 117000,
+    email: '[email protected]',
+  },
+  {
+    id: 4,
+    companyName: 'McCullough, Hane and Koelpin',
+    companySize: '0 - 10',
+    firstName: 'Flossie',
+    lastName: 'DuBuque',
+    country: 'New Caledonia',
+    countryCode: 'NC',
+    city: 'Paita',
+    streetName: 'Aimee Pine',
+    streetPrefix: 'Ways',
+    streetNo: 176,
+    age: 40,
+    department: 'Management',
+    team: 'TeamManagement',
+    salary: 120000,
+    email: '[email protected]',
+  },
+  {
+    id: 5,
+    companyName: 'Lesch, Jaskolski and Aufderhar',
+    companySize: '1000 - 10000',
+    firstName: 'Sammy',
+    lastName: 'Sporer',
+    country: 'Sri Lanka',
+    countryCode: 'LK',
+    city: 'Talapathpitiya',
+    streetName: 'Cartwright Keys',
+    streetPrefix: 'Plains',
+    streetNo: 620,
+    age: 24,
+    department: 'Support',
+    team: 'chat-support',
+    salary: 49000,
+    email: '[email protected]',
+  },
+  {
+    id: 6,
+    companyName: 'Purdy - Hansen',
+    companySize: '10 - 100',
+    firstName: 'Norris',
+    lastName: 'Rath',
+    country: 'El Salvador',
+    countryCode: 'SV',
+    city: 'La Libertad',
+    streetName: 'Kemmer Cliff',
+    streetPrefix: 'Via',
+    streetNo: 760,
+    age: 35,
+    department: 'Sales',
+    team: 'telesales',
+    salary: 48000,
+    email: '[email protected]',
+  },
+  {
+    id: 7,
+    companyName: 'Reichert Inc',
+    companySize: '10 - 100',
+    firstName: 'Jonathon',
+    lastName: 'Tillman',
+    country: 'Armenia',
+    countryCode: 'AM',
+    city: 'Yerevan',
+    streetName: 'Schmidt Mountain',
+    streetPrefix: 'Crescent',
+    streetNo: 546,
+    age: 58,
+    department: 'Management',
+    team: 'MidLevel',
+    salary: 148000,
+    email: '[email protected]',
+  },
+  {
+    id: 8,
+    companyName: 'Block Inc',
+    companySize: '1000 - 10000',
+    firstName: 'Cleo',
+    lastName: 'Ebert',
+    country: 'Cuba',
+    countryCode: 'CU',
+    city: 'Havana',
+    streetName: 'Scotty Stravenue',
+    streetPrefix: 'Causeway',
+    streetNo: 147,
+    age: 38,
+    department: 'Management',
+    team: 'MicroManagement',
+    salary: 98000,
+    email: '[email protected]',
+  },
+  {
+    id: 9,
+    companyName: 'Volkman LLC',
+    companySize: '10 - 100',
+    firstName: 'Julianne',
+    lastName: 'Pollich',
+    country: 'Swaziland',
+    countryCode: 'SZ',
+    city: 'Lobamba',
+    streetName: 'Harmony Locks',
+    streetPrefix: 'Flats',
+    streetNo: 44,
+    age: 52,
+    department: 'Support',
+    team: 'live-support',
+    salary: 88000,
+    email: '[email protected]',
+  },
+];

examples/src/pages/tests/table/props/row-disabled-state/row-style.module.css

@@ -0,0 +1,3 @@
+.green {
+  background: #004b00;
+}