@1771technologies/lytenyte-pro 1.0.14 → 1.0.16

package/dist/__play__/grid-navigation/normal-layout.play.d.ts

@@ -1,10 +0,0 @@
-import "./navigation.css";
-import type { Column } from "../../+types.js";
-export default function BasicRendering({ rtl, columns, pinTop, center, pinBot, floatingRow, }: {
-    rtl?: boolean;
-    columns?: Column<any>[];
-    center?: number;
-    pinTop?: number;
-    pinBot?: number;
-    floatingRow?: boolean;
-}): import("react/jsx-runtime").JSX.Element;

package/dist/__play__/grid-navigation/pinned-gap-layout.play.d.ts

@@ -1,3 +0,0 @@
-export default function PinnedGapLayout({ rtl }: {
-    rtl?: boolean;
-}): import("react/jsx-runtime").JSX.Element;

package/dist/__play__/grid-navigation/pinned-gap-layout.play.js

@@ -1,11 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import NormalLayout from "./normal-layout.play.js";
-const baseColumns = [
-    { id: "age", pin: "start" },
-    { id: "job" },
-    { id: "marital" },
-    { id: "housing", pin: "end" },
-];
-export default function PinnedGapLayout({ rtl }) {
-    return _jsx(NormalLayout, { columns: baseColumns, rtl: rtl });
-}

package/dist/__play__/grid-navigation/row-detail-with-spans.play.d.ts

@@ -1,6 +0,0 @@
-import "./navigation.css";
-import type { Column } from "../../+types.js";
-export default function RowDetailWithSpans({ rtl, columns, }: {
-    rtl?: boolean;
-    columns?: Column<any>[];
-}): import("react/jsx-runtime").JSX.Element;

package/dist/__play__/grid-navigation/row-detail-with-spans.play.js

@@ -1,79 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import "./navigation.css";
-import { useLyteNyte } from "../../state/use-lytenyte.js";
-import { bankDataSmall } from "../test-utils/bank-data-smaller.js";
-import { Root } from "../../root/root.js";
-import { Viewport } from "../../viewport/viewport.js";
-import { Header } from "../../header/header.js";
-import { HeaderRow } from "../../header/header-row.js";
-import { HeaderGroupCell } from "../../header/header-group-cell.js";
-import { HeaderCell } from "../../header/header-cell.js";
-import { RowsContainer } from "../../rows/rows-container.js";
-import { RowsBottom, RowsCenter, RowsTop } from "../../rows/rows-sections.js";
-import { RowHandler } from "../test-utils/row-handler.js";
-import { useClientRowDataSource } from "../../row-data-source-client/use-client-data-source.js";
-const baseColumns = [
-    { id: "age" },
-    {
-        id: "job",
-        rowSpan: (c) => {
-            if (c.rowIndex === 0)
-                return 5;
-            return 1;
-        },
-    },
-    { id: "balance" },
-    { id: "education" },
-    { id: "marital" },
-    { id: "default" },
-    { id: "housing" },
-    { id: "loan" },
-    { id: "contact" },
-    { id: "day" },
-    { id: "month" },
-    { id: "duration" },
-    { id: "campaign" },
-    { id: "pdays" },
-    { id: "previous" },
-    { id: "poutcome" },
-    { id: "y" },
-];
-export default function RowDetailWithSpans({ rtl, columns, }) {
-    const ds = useClientRowDataSource({
-        data: bankDataSmall,
-    });
-    const g = useLyteNyte({
-        gridId: "x",
-        columns: columns ?? baseColumns,
-        rowDataSource: ds,
-        rtl: rtl,
-        rowDetailExpansions: new Set(["2"]),
-        columnMarkerEnabled: true,
-        columnMarker: {
-            width: 60,
-            cellRenderer: (p) => {
-                return _jsx("button", { onClick: () => p.grid.api.rowDetailToggle(p.row), children: "X" });
-            },
-        },
-        rowDetailRenderer: () => {
-            return (_jsxs("div", { children: [_jsx("button", { tabIndex: 0, children: "Detail A" }), _jsx("button", { tabIndex: 0, children: "Detail B" })] }));
-        },
-    });
-    const view = g.view.useValue();
-    return (_jsxs("div", { children: [_jsx("button", { tabIndex: 0, onClick: () => { }, children: "Top Capture" }), _jsx("div", { style: { width: "100%", height: "90vh", border: "1px solid black" }, children: _jsx(Root, { grid: g, children: _jsxs(Viewport, { children: [_jsx(Header, { children: view.header.layout.map((row, i) => {
-                                    return (_jsx(HeaderRow, { headerRowIndex: i, children: row.map((c) => {
-                                            if (c.kind === "group") {
-                                                return _jsx(HeaderGroupCell, { cell: c }, c.idOccurrence);
-                                            }
-                                            return (_jsx(HeaderCell, { cell: c, style: {
-                                                    paddingInline: "16px",
-                                                    background: "light-dark(rgb(200,200,200),rgb(57, 39, 39))",
-                                                    color: "light-dark(black,white)",
-                                                    display: "flex",
-                                                    alignItems: "center",
-                                                    borderBottom: "1px solid light-dark(gray, #444242)",
-                                                    borderRight: "1px solid light-dark(gray, #444242)",
-                                                } }, c.column.id));
-                                        }) }, i));
-                                }) }), _jsxs(RowsContainer, { children: [_jsx(RowsTop, { children: _jsx(RowHandler, { rows: view.rows.top, withStyles: true, pinned: true }) }), _jsx(RowsCenter, { children: _jsx(RowHandler, { rows: view.rows.center, withStyles: true }) }), _jsx(RowsBottom, { children: _jsx(RowHandler, { rows: view.rows.bottom, withStyles: true, pinned: true }) })] })] }) }) }), _jsx("button", { tabIndex: 0, onClick: () => { }, children: "Bottom Capture" })] }));
-}

package/dist/__play__/grid-navigation/row-detail.play.d.ts

@@ -1,6 +0,0 @@
-import "./navigation.css";
-import type { Column } from "../../+types.js";
-export default function RowDetail({ rtl, columns }: {
-    rtl?: boolean;
-    columns?: Column<any>[];
-}): import("react/jsx-runtime").JSX.Element;

package/dist/__play__/grid-navigation/row-detail.play.js

@@ -1,78 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import "./navigation.css";
-import { useLyteNyte } from "../../state/use-lytenyte.js";
-import { bankDataSmall } from "../test-utils/bank-data-smaller.js";
-import { Root } from "../../root/root.js";
-import { Viewport } from "../../viewport/viewport.js";
-import { Header } from "../../header/header.js";
-import { HeaderRow } from "../../header/header-row.js";
-import { HeaderGroupCell } from "../../header/header-group-cell.js";
-import { HeaderCell } from "../../header/header-cell.js";
-import { RowsContainer } from "../../rows/rows-container.js";
-import { RowsBottom, RowsCenter, RowsTop } from "../../rows/rows-sections.js";
-import { RowHandler } from "../test-utils/row-handler.js";
-import { useClientRowDataSource } from "../../row-data-source-client/use-client-data-source.js";
-const baseColumns = [
-    { id: "age" },
-    { id: "job" },
-    { id: "balance" },
-    { id: "education" },
-    { id: "marital" },
-    { id: "default" },
-    { id: "housing" },
-    { id: "loan" },
-    { id: "contact" },
-    { id: "day" },
-    { id: "month" },
-    { id: "duration" },
-    { id: "campaign" },
-    { id: "pdays" },
-    { id: "previous" },
-    { id: "poutcome" },
-    { id: "y" },
-];
-export default function RowDetail({ rtl, columns }) {
-    const ds = useClientRowDataSource({
-        data: bankDataSmall,
-    });
-    const g = useLyteNyte({
-        gridId: "x",
-        columns: columns ?? baseColumns,
-        rowDataSource: ds,
-        rtl: rtl,
-        rowDetailExpansions: new Set(["2", "5"]),
-        columnMarkerEnabled: true,
-        columnMarker: {
-            width: 60,
-            cellRenderer: (p) => {
-                return _jsx("button", { onClick: () => p.grid.api.rowDetailToggle(p.row), children: "X" });
-            },
-        },
-        rowDetailRenderer: () => {
-            return (_jsxs("div", { children: [_jsx("button", { tabIndex: 0, children: "Detail A" }), _jsx("button", { tabIndex: 0, children: "Detail B" })] }));
-        },
-        rowFullWidthPredicate: (r) => r.rowIndex === 2 || r.rowIndex == 4,
-        rowFullWidthRenderer: (r) => {
-            if (r.rowIndex === 2)
-                return _jsx("div", { children: "Nothing" });
-            return (_jsxs("div", { children: [_jsx("button", { tabIndex: 0, children: "A" }), _jsx("button", { tabIndex: 0, children: "B" }), _jsx("button", { tabIndex: 0, children: "C" })] }));
-        },
-    });
-    const view = g.view.useValue();
-    return (_jsxs("div", { children: [_jsx("button", { tabIndex: 0, onClick: () => { }, children: "Top Capture" }), _jsx("div", { style: { width: "100%", height: "90vh", border: "1px solid black" }, children: _jsx(Root, { grid: g, children: _jsxs(Viewport, { children: [_jsx(Header, { children: view.header.layout.map((row, i) => {
-                                    return (_jsx(HeaderRow, { headerRowIndex: i, children: row.map((c) => {
-                                            if (c.kind === "group") {
-                                                return _jsx(HeaderGroupCell, { cell: c }, c.idOccurrence);
-                                            }
-                                            return (_jsx(HeaderCell, { cell: c, style: {
-                                                    paddingInline: "16px",
-                                                    background: "light-dark(rgb(200,200,200),rgb(57, 39, 39))",
-                                                    color: "light-dark(black,white)",
-                                                    display: "flex",
-                                                    alignItems: "center",
-                                                    borderBottom: "1px solid light-dark(gray, #444242)",
-                                                    borderRight: "1px solid light-dark(gray, #444242)",
-                                                } }, c.column.id));
-                                        }) }, i));
-                                }) }), _jsxs(RowsContainer, { children: [_jsx(RowsTop, { children: _jsx(RowHandler, { rows: view.rows.top, withStyles: true, pinned: true }) }), _jsx(RowsCenter, { children: _jsx(RowHandler, { rows: view.rows.center, withStyles: true }) }), _jsx(RowsBottom, { children: _jsx(RowHandler, { rows: view.rows.bottom, withStyles: true, pinned: true }) })] })] }) }) }), _jsx("button", { tabIndex: 0, onClick: () => { }, children: "Bottom Capture" })] }));
-}

package/dist/__play__/grid-navigation/row-detail.pt.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/__play__/grid-navigation/row-detail.pt.js

@@ -1,68 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { wait } from "@1771technologies/lytenyte-js-utils";
-import { expect, test } from "vitest";
-import { render } from "vitest-browser-react";
-import RowDetail from "./row-detail.play.js";
-import { getCellQuery } from "@1771technologies/lytenyte-shared";
-import { userEvent } from "@vitest/browser/context";
-import RowDetailWithSpans from "./row-detail-with-spans.play.js";
-test("when row details are present it should be possible to navigate across them", async () => {
-    const screen = render(_jsx(RowDetail, {}));
-    const grid = screen.getByRole("grid");
-    await expect.element(grid).toBeVisible();
-    await wait(); // Give the grid a moment to render
-    const ourFirstCell = document.querySelector(getCellQuery("x", 0, 0));
-    ourFirstCell.focus();
-    await expect.element(ourFirstCell).toHaveFocus();
-    await userEvent.keyboard("{ArrowDown}");
-    await wait();
-    await userEvent.keyboard("{ArrowDown}");
-    await wait();
-    await userEvent.keyboard("{ArrowDown}");
-    await wait();
-    await expect.element(document.activeElement).toHaveTextContent("Detail ADetail B");
-    await userEvent.keyboard("{ArrowLeft}");
-    await wait();
-    await expect.element(document.activeElement).toHaveTextContent("Detail B");
-    await userEvent.keyboard("{ArrowLeft}");
-    await wait();
-    await expect.element(document.activeElement).toHaveTextContent("Detail A");
-    await userEvent.keyboard("{ArrowDown}");
-    await wait();
-    await expect.element(document.activeElement).toHaveTextContent("X");
-    await userEvent.keyboard("{ArrowDown}");
-    await wait();
-    await expect.element(document.activeElement).toHaveTextContent("ABC");
-    await userEvent.keyboard("{ArrowUp}");
-    await wait();
-    await expect.element(document.activeElement).toHaveTextContent("X");
-    await userEvent.keyboard("{ArrowUp}");
-    await wait();
-    await expect.element(document.activeElement).toHaveTextContent("Detail ADetail B");
-    await userEvent.keyboard("{ArrowDown}");
-    await wait();
-    await expect.element(document.activeElement).toHaveTextContent("X");
-    await userEvent.keyboard("{ArrowLeft}");
-    await wait();
-    await expect.element(document.activeElement).toHaveTextContent("X");
-    await userEvent.click(document.activeElement);
-    await wait();
-    await userEvent.keyboard("{ArrowDown}");
-    await expect.element(document.activeElement).toHaveTextContent("Detail ADetail B");
-});
-test("when there are row spans it should be cutoff when the detail is expanded", async () => {
-    const screen = render(_jsx(RowDetailWithSpans, {}));
-    const grid = screen.getByRole("grid");
-    await expect.element(grid).toBeVisible();
-    await wait(); // Give the grid a moment to render
-    const ourFirstCell = document.querySelector(getCellQuery("x", 0, 2));
-    ourFirstCell.focus();
-    await expect.element(ourFirstCell).toHaveFocus();
-    await expect.element(document.activeElement).toHaveTextContent("unemployed");
-    await userEvent.keyboard("{ArrowDown}");
-    await wait();
-    await expect.element(document.activeElement).toHaveTextContent("management");
-    await userEvent.keyboard("{ArrowDown}");
-    await wait();
-    await expect.element(document.activeElement).toHaveTextContent("Detail ADetail B");
-});

package/dist/__play__/grid-navigation/vertical-navigation.pt.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/__play__/grid-navigation/vertical-navigation.pt.js

@@ -1,176 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { expect, test } from "vitest";
-import { render } from "vitest-browser-react";
-import NormalLayout from "./normal-layout.play.js";
-import { wait } from "@1771technologies/lytenyte-js-utils";
-import { getCellQuery } from "@1771technologies/lytenyte-shared";
-import { userEvent } from "@vitest/browser/context";
-import { bankDataSmall } from "../test-utils/bank-data-smaller.js";
-import FullWidthRows from "./full-width-rows.play.js";
-import CellSpans from "./cell-spans.play.js";
-test("should be able to navigate up and down cells", async () => {
-    const screen = render(_jsx(NormalLayout, { center: 50 }));
-    const grid = screen.getByRole("grid");
-    await expect.element(grid).toBeVisible();
-    await wait(); // Give the grid a moment to render
-    const ourFirstCell = document.querySelector(getCellQuery("x", 0, 0));
-    ourFirstCell.focus();
-    const values = bankDataSmall.slice(0, 50).map((c) => `${c.age}`);
-    for (const v of values) {
-        await expect.element(document.activeElement).toHaveTextContent(v);
-        await userEvent.keyboard("{ArrowDown}");
-        await wait(100);
-    }
-    for (const v of values.toReversed()) {
-        await expect.element(document.activeElement).toHaveTextContent(v);
-        await userEvent.keyboard("{ArrowUp}");
-        await wait(100);
-    }
-});
-test("should be able to navigate up and down cells with pins", async () => {
-    const screen = render(_jsx(NormalLayout, { pinTop: 2, pinBot: 2, center: 50 }));
-    const grid = screen.getByRole("grid");
-    await expect.element(grid).toBeVisible();
-    await wait(); // Give the grid a moment to render
-    const ourFirstCell = document.querySelector(getCellQuery("x", 0, 0));
-    ourFirstCell.focus();
-    const values = bankDataSmall
-        .slice(0, 2)
-        .map((c) => `${c.age}`)
-        .concat(bankDataSmall.slice(0, 50).map((c) => `${c.age}`))
-        .concat(bankDataSmall.slice(0, 2).map((c) => `${c.age}`));
-    for (const v of values) {
-        await expect.element(document.activeElement).toHaveTextContent(v);
-        await userEvent.keyboard("{ArrowDown}");
-        await wait(100);
-    }
-    for (const v of values.toReversed()) {
-        await expect.element(document.activeElement).toHaveTextContent(v);
-        await userEvent.keyboard("{ArrowUp}");
-        await wait(100);
-    }
-});
-test("should be able to handle moving to the start or end", async () => {
-    const screen = render(_jsx(NormalLayout, {}));
-    const grid = screen.getByRole("grid");
-    await expect.element(grid).toBeVisible();
-    await wait(); // Give the grid a moment to render
-    const ourFirstCell = document.querySelector(getCellQuery("x", 0, 0));
-    ourFirstCell.focus();
-    await expect.element(document.activeElement).toHaveTextContent("30");
-    await userEvent.keyboard("{Control>}{ArrowDown}{/Control}");
-    await wait(200);
-    await expect.element(document.activeElement).toHaveTextContent("42");
-    await userEvent.keyboard("{Control>}{ArrowUp}{/Control}");
-    await wait(200);
-    await expect.element(document.activeElement).toHaveTextContent("30");
-});
-test("should be navigate across full width rows", async () => {
-    const screen = render(_jsx(FullWidthRows, {}));
-    const grid = screen.getByRole("grid");
-    await expect.element(grid).toBeVisible();
-    await wait(); // Give the grid a moment to render
-    const ourFirstCell = document.querySelector(getCellQuery("x", 0, 2));
-    ourFirstCell.focus();
-    await expect.element(document.activeElement).toHaveTextContent("1787");
-    await userEvent.keyboard("{ArrowDown}");
-    await expect.element(document.activeElement).toHaveTextContent("4789");
-    await userEvent.keyboard("{ArrowDown}");
-    await expect.element(document.activeElement).toHaveTextContent("Nothing");
-    await userEvent.keyboard("{ArrowDown}");
-    await expect.element(document.activeElement).toHaveTextContent("1476");
-    await userEvent.keyboard("{ArrowDown}");
-    await expect.element(document.activeElement).toHaveTextContent("ABC");
-    await userEvent.keyboard("{ArrowDown}");
-    await expect.element(document.activeElement).toHaveTextContent("747");
-    await userEvent.keyboard("{ArrowUp}");
-    await expect.element(document.activeElement).toHaveTextContent("ABC");
-    await userEvent.keyboard("{ArrowUp}");
-    await expect.element(document.activeElement).toHaveTextContent("1476");
-    await userEvent.keyboard("{ArrowUp}");
-    await expect.element(document.activeElement).toHaveTextContent("Nothing");
-    await userEvent.keyboard("{ArrowUp}");
-    await expect.element(document.activeElement).toHaveTextContent("4789");
-});
-test("should be able to navigate across column and row spans", async () => {
-    const screen = render(_jsx(CellSpans, {}));
-    const grid = screen.getByRole("grid");
-    await expect.element(grid).toBeVisible();
-    await wait(); // Give the grid a moment to render
-    const ourFirstCell = document.querySelector(getCellQuery("x", 0, 3));
-    ourFirstCell.focus();
-    await expect.element(document.activeElement).toHaveTextContent("primary");
-    await userEvent.keyboard("{ArrowDown}");
-    await expect.element(document.activeElement).toHaveTextContent("secondary");
-    await userEvent.keyboard("{ArrowDown}");
-    await expect.element(document.activeElement).toHaveTextContent("management");
-    await userEvent.keyboard("{ArrowDown}");
-    await expect.element(document.activeElement).toHaveTextContent("tertiary");
-    await userEvent.keyboard("{ArrowDown}");
-    await expect.element(document.activeElement).toHaveTextContent("secondary");
-    await userEvent.keyboard("{ArrowUp}");
-    await expect.element(document.activeElement).toHaveTextContent("tertiary");
-    await userEvent.keyboard("{ArrowRight}");
-    await expect.element(document.activeElement).toHaveTextContent("married");
-    await userEvent.keyboard("{ArrowDown}");
-    await expect.element(document.activeElement).toHaveTextContent("secondary");
-    await userEvent.keyboard("{ArrowDown}");
-    await expect.element(document.activeElement).toHaveTextContent("married");
-    await userEvent.keyboard("{ArrowDown}");
-    await expect.element(document.activeElement).toHaveTextContent("married");
-    await userEvent.keyboard("{ArrowLeft}");
-    await expect.element(document.activeElement).toHaveTextContent("tertiary");
-    await userEvent.keyboard("{ArrowDown}");
-    await expect.element(document.activeElement).toHaveTextContent("secondary");
-    await userEvent.keyboard("{ArrowDown}");
-    await expect.element(document.activeElement).toHaveTextContent("tertiary");
-    await userEvent.keyboard("{ArrowDown}");
-    await expect.element(document.activeElement).toHaveTextContent("secondary");
-    await userEvent.keyboard("{ArrowUp}");
-    await expect.element(document.activeElement).toHaveTextContent("tertiary");
-    await userEvent.keyboard("{ArrowUp}");
-    await expect.element(document.activeElement).toHaveTextContent("secondary");
-    await userEvent.keyboard("{ArrowUp}");
-    await expect.element(document.activeElement).toHaveTextContent("tertiary");
-    await userEvent.keyboard("{ArrowUp}");
-    await expect.element(document.activeElement).toHaveTextContent("secondary");
-    await userEvent.keyboard("{ArrowUp}");
-    await expect.element(document.activeElement).toHaveTextContent("secondary");
-    await userEvent.keyboard("{ArrowUp}");
-    await expect.element(document.activeElement).toHaveTextContent("tertiary");
-    await userEvent.keyboard("{ArrowUp}");
-    await expect.element(document.activeElement).toHaveTextContent("management");
-});
-test("page up and down should focus the correct cells", async () => {
-    const screen = render(_jsx(CellSpans, {}));
-    const grid = screen.getByRole("grid");
-    await expect.element(grid).toBeVisible();
-    await wait(); // Give the grid a moment to render
-    const ourFirstCell = document.querySelector(getCellQuery("x", 0, 3));
-    ourFirstCell.focus();
-    await userEvent.keyboard("{PageDown}");
-    await expect.element(document.activeElement).toHaveTextContent("secondary");
-    await userEvent.keyboard("{PageUp}");
-    await expect.element(document.activeElement).toHaveTextContent("management");
-});
-test("home and end should work as expected", async () => {
-    const screen = render(_jsx(CellSpans, {}));
-    const grid = screen.getByRole("grid");
-    await expect.element(grid).toBeVisible();
-    await wait(); // Give the grid a moment to render
-    const ourFirstCell = document.querySelector(getCellQuery("x", 0, 3));
-    ourFirstCell.focus();
-    await expect.element(document.activeElement).toHaveTextContent("primary");
-    await userEvent.keyboard("{End}");
-    await wait(100);
-    await expect.element(document.activeElement).toHaveTextContent("unknown");
-    await userEvent.keyboard("{Home}");
-    await wait(100);
-    await expect.element(document.activeElement).toHaveTextContent("30");
-    await userEvent.keyboard("{Control>}{End}{/Control}");
-    await wait(100);
-    await expect.element(document.activeElement).toHaveTextContent("unknown");
-    await userEvent.keyboard("{Control>}{Home}{/Control}");
-    await wait(100);
-    await expect.element(document.activeElement).toHaveTextContent("30");
-});

package/dist/cells/+types.cell.d.ts

@@ -1,13 +0,0 @@
-import type { ColumnPin } from "../+types.js";
-export interface Cell {
-    readonly rowIndex: number;
-    readonly colIndex: number;
-    readonly colSpan: number;
-    readonly rowSpan: number;
-    readonly rowLastPinTop?: boolean;
-    readonly rowFirstPinBottom?: boolean;
-    readonly colLastStartPin?: boolean;
-    readonly colFirstEndPin?: boolean;
-    readonly colPin?: ColumnPin;
-    readonly rowPin?: "top" | "bottom" | null;
-}

package/dist/cells/+types.cell.js

@@ -1 +0,0 @@
-export {};

package/dist/cells/cell-default.d.ts

@@ -1,2 +0,0 @@
-import type { CellRendererParams } from "../+types.js";
-export declare function CellDefault<T>({ grid, column, row }: CellRendererParams<T>): import("react/jsx-runtime").JSX.Element;

package/dist/cells/cell-default.js

@@ -1,8 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-export function CellDefault({ grid, column, row }) {
-    const r = grid.api.columnField(column, row);
-    if (row.data == null && row.loading) {
-        return _jsx("div", { children: "Loading..." });
-    }
-    return _jsx("div", { children: `${r ?? ""}` });
-}

package/dist/cells/cell-editor.d.ts

@@ -1,6 +0,0 @@
-import type { RowCellLayout } from "../+types";
-interface CellEditorParams<T> {
-    readonly cell: RowCellLayout<T>;
-}
-export declare function CellEditor<T>({ cell }: CellEditorParams<T>): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/cells/cell-editor.js

@@ -1,110 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useCallback, useEffect, useState } from "react";
-import { getTabbables } from "@1771technologies/lytenyte-dom-utils";
-import { useGridRoot } from "../context.js";
-import { editOnChange } from "../state/helpers/edit-on-change.js";
-import { handleNavigation } from "@1771technologies/lytenyte-shared";
-export function CellEditor({ cell }) {
-    const [el, setEl] = useState(null);
-    const grid = useGridRoot().grid;
-    useEffect(() => {
-        if (!el)
-            return;
-        const focusFirst = () => {
-            const tabbables = getTabbables(el);
-            if (!el.contains(document.activeElement))
-                tabbables.at(0)?.focus();
-        };
-        const controller = new AbortController();
-        if (el.parentElement) {
-            el.parentElement.addEventListener("focus", () => {
-                focusFirst();
-            }, { signal: controller.signal });
-        }
-        focusFirst();
-        return () => controller.abort();
-    }, [el]);
-    return (_jsx("div", { ref: setEl, style: { width: "100%", height: "100%" }, onKeyDown: (e) => {
-            if (e.key === "Escape") {
-                const parent = el?.parentElement;
-                grid.api.editEnd(true);
-                setTimeout(() => {
-                    parent?.focus();
-                }, 4);
-            }
-            if (e.key === "Enter") {
-                const ds = grid.state.rowDataStore;
-                // Don't move if the there are validation errors.
-                const editValidation = grid.internal.editValidation.get();
-                if (typeof editValidation === "boolean"
-                    ? editValidation === false
-                    : Object.keys(editValidation).length >= 1) {
-                    return;
-                }
-                handleNavigation({
-                    event: {
-                        key: "ArrowDown",
-                        ctrlKey: false,
-                        metaKey: false,
-                        preventDefault: () => { },
-                        stopPropagation: () => { },
-                    },
-                    topCount: grid.state.rowDataStore.rowTopCount.get(),
-                    centerCount: grid.state.rowDataStore.rowCenterCount.get(),
-                    isRowDetailExpanded: (r) => {
-                        const row = grid.api.rowByIndex(r);
-                        if (!row)
-                            return false;
-                        return grid.api.rowDetailIsExpanded(row);
-                    },
-                    viewport: grid.state.viewport.get(),
-                    rowCount: ds.rowCount.get(),
-                    columnCount: grid.state.columnMeta.get().columnsVisible.length,
-                    focusActive: grid.internal.focusActive,
-                    gridId: grid.state.gridId.get(),
-                    getRootCell: grid.api.cellRoot,
-                    rtl: grid.state.rtl.get(),
-                    scrollIntoView: grid.api.scrollIntoView,
-                });
-            }
-            e.stopPropagation();
-        }, children: _jsx(EditRenderer, { cell: cell }) }));
-}
-function EditRenderer({ cell }) {
-    const column = cell.column;
-    const ctx = useGridRoot();
-    const base = ctx.grid.state.columnBase.useValue();
-    const editFuncs = ctx.grid.state.editRenderers.useValue();
-    const editRenderer = column.editRenderer ?? base.editRenderer;
-    const activeData = ctx.grid.internal.editData.useValue();
-    const row = cell.row.get();
-    const value = ctx.grid.api.columnField(column, row.kind === "branch"
-        ? { kind: "branch", data: activeData, key: row.key }
-        : { kind: "leaf", data: activeData });
-    const onChange = useCallback((c) => {
-        editOnChange({
-            value: c,
-            activeData,
-            base,
-            column,
-            grid: ctx.grid,
-            row,
-            rowIndex: cell.rowIndex,
-        });
-    }, [activeData, base, cell.rowIndex, column, ctx.grid, row]);
-    if (!editRenderer) {
-        const type = column.type;
-        if (type === "number")
-            return (_jsx("input", { type: "number", value: value ?? "", onChange: (e) => (e.target.value ? onChange(Number.parseFloat(e.target.value)) : 0) }));
-        if (type === "date")
-            return _jsx("input", { type: "date", value: value ?? "", onChange: (e) => onChange(e.target.value) });
-        if (type === "datetime")
-            return (_jsx("input", { type: "datetime-local", value: value ?? "", onChange: (e) => onChange(e.target.value) }));
-        return _jsx("input", { value: value ?? "", onChange: (e) => onChange(e.target.value) });
-    }
-    const Renderer = typeof editRenderer === "string" ? editFuncs[editRenderer] : editRenderer;
-    const validation = ctx.grid.internal.editValidation.useValue();
-    if (!Renderer)
-        return null;
-    return (_jsx(Renderer, { column: column, grid: ctx.grid, onChange: onChange, row: cell.row.get(), rowIndex: cell.rowIndex, value: value, rowValidationState: validation }));
-}

package/dist/cells/cell-spacer.d.ts

@@ -1,9 +0,0 @@
-export declare function CellSpacePinStart({ xPositions: x }: {
-    xPositions: Uint32Array;
-}): import("react/jsx-runtime").JSX.Element | null;
-export declare function CellSpacerPinEnd({ xPositions: x }: {
-    xPositions: Uint32Array;
-}): import("react/jsx-runtime").JSX.Element | null;
-export declare function CellSpacerNoPin({ xPositions: x }: {
-    xPositions: Uint32Array;
-}): import("react/jsx-runtime").JSX.Element | null;