@1771technologies/lytenyte-pro 1.0.12-dev.1 → 1.0.12-dev.2

package/dist/header/header.d.ts

@@ -0,0 +1 @@
+export declare const Header: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/header/header.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { useGridRoot } from "../context.js";
+import { fastDeepMemo } from "@1771technologies/lytenyte-react-hooks";
+import { HeaderReact } from "@1771technologies/lytenyte-shared";
+const HeaderImpl = forwardRef(function Header(props, forwarded) {
+    const grid = useGridRoot().grid;
+    const xPositions = grid.state.xPositions.useValue();
+    const columnVisible = grid.state.columnMeta.useValue();
+    return (_jsx(HeaderReact, { ...props, ref: forwarded, floatingRowEnabled: grid.state.floatingRowEnabled.useValue(), floatingRowHeight: grid.state.floatingRowHeight.useValue(), headerGroupHeight: grid.state.headerGroupHeight.useValue(), headerHeight: grid.state.headerHeight.useValue(), rows: grid.internal.headerRows.useValue(), xPositions: xPositions, countBeforeEnd: columnVisible.columnVisibleCenterCount + columnVisible.columnVisibleStartCount, width: grid.state.widthTotal.useValue() }));
+});
+export const Header = fastDeepMemo(HeaderImpl);

package/dist/header/resize-handler.d.ts

@@ -0,0 +1,12 @@
+import { type SlotComponent } from "@1771technologies/lytenyte-react-hooks";
+import type { HeaderCellLayout } from "../+types";
+import { type CSSProperties } from "react";
+interface ResizeHandlerProps<T> {
+    readonly as?: SlotComponent;
+    readonly cell: HeaderCellLayout<T>;
+    readonly xPositions: Uint32Array;
+    readonly className?: string;
+    readonly style?: CSSProperties;
+}
+export declare function ResizeHandler<T>({ as, cell, xPositions, style, className, }: ResizeHandlerProps<T>): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+export {};

package/dist/header/resize-handler.js

@@ -0,0 +1,136 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useSlot } from "@1771technologies/lytenyte-react-hooks";
+import {} from "react";
+import { DEFAULT_COLUMN_WIDTH_MAX, DEFAULT_COLUMN_WIDTH_MIN, sizeFromCoord, } from "@1771technologies/lytenyte-shared";
+import { useGridRoot } from "../context.js";
+import { getComputedStyle } from "@1771technologies/lytenyte-dom-utils";
+import { clamp, getClientX } from "@1771technologies/lytenyte-js-utils";
+export function ResizeHandler({ as, cell, xPositions, style, className, }) {
+    const width = sizeFromCoord(cell.colStart, xPositions, cell.colSpan);
+    const sx = useGridRoot().grid;
+    const double = sx.state.columnDoubleClickToAutosize.useValue();
+    const defaultProps = {
+        role: "button",
+        "data-ln-header-resizer": "true",
+        "aria-label": `Resize ${cell.column.name ?? cell.column.id}`,
+        tabIndex: -1,
+        onDoubleClick: () => {
+            if (!double)
+                return;
+            sx.api.columnAutosize({
+                columns: [cell.column],
+                includeHeader: true,
+            });
+        },
+        onPointerDown: (ev) => {
+            const vp = sx.state.viewport.get();
+            if (!vp)
+                return;
+            if (ev.pointerType === "mouse" && ev.button !== 0)
+                return;
+            ev.preventDefault();
+            ev.stopPropagation();
+            const isRtl = sx.state.rtl.get();
+            let startX = null;
+            let anim = null;
+            const style = getComputedStyle(vp);
+            const overflow = style.overflowX;
+            vp.style.overflowX = "hidden";
+            const base = sx.state.columnBase.get();
+            const minWidth = cell.column.widthMin ?? base.widthMin ?? DEFAULT_COLUMN_WIDTH_MIN;
+            const maxWidth = cell.column.widthMax ?? base.widthMax ?? DEFAULT_COLUMN_WIDTH_MAX;
+            const maxDelta = maxWidth - width;
+            const minDelta = minWidth - width;
+            const deltaRef = { current: 0 };
+            const controller = new AbortController();
+            document.addEventListener("pointermove", (ev) => {
+                if (startX === null) {
+                    startX = getClientX(ev);
+                    return;
+                }
+                const endAdjust = cell.colPin === "end" ? -1 : 1;
+                const rtlAdjust = isRtl ? -1 : 1;
+                deltaRef.current = clamp(minDelta, (getClientX(ev) - startX) * endAdjust * rtlAdjust, maxDelta);
+                if (anim)
+                    return;
+                anim = requestAnimationFrame(() => {
+                    const newWidth = width + deltaRef.current;
+                    sx.api.columnResize({ [cell.id]: newWidth });
+                    // TODO @Mike: the below method is a much faster, but potentially much tricky way to get resizing done. We should investigate
+                    // the best approach to lever this. The main issues are around resizing group headers and ensuring column cells pinned to the
+                    // end of the grid do not get shifted.
+                    // const id = sx.state.gridId.get();
+                    // const query = `[data-ln-row][data-ln-gridid="${id}"] [data-ln-cell="true"][data-ln-colindex="${cell.colStart}"]`;
+                    // const headerQuery = `[data-ln-header-row] [data-ln-header-cell="true"][data-ln-header-id="${cell.id}"]`;
+                    // const floatingQuery = `[data-ln-header-row] [data-ln-header-cell="true"][data-ln-header-id="${cell.id}"][data-ln-header-floating="true"]`;
+                    // const header = vp.querySelector(headerQuery) as HTMLElement;
+                    // const floating = vp.querySelector(floatingQuery) as HTMLElement | undefined;
+                    // if (!header) return;
+                    // const pin = header.getAttribute("data-ln-pin");
+                    // const cells = Array.from(vp.querySelectorAll(query)) as HTMLElement[];
+                    // const headers = [header];
+                    // if (floating) headers.push(floating);
+                    // headers.forEach((c) => {
+                    //   if (!isHTMLElement(c)) return;
+                    //   c.style.removeProperty("min-width");
+                    //   c.style.removeProperty("max-width");
+                    //   c.style.width = `${width + deltaRef.current}px`;
+                    //   if (pin === "end") {
+                    //     const viewportWidth = sx.state.viewportWidthInner.get();
+                    //     const spaceLeft = xPositions.at(-1)! - xPositions[cell.colStart];
+                    //     const x = viewportWidth - spaceLeft - deltaRef.current;
+                    //     c.style.transform = getTranslate(isRtl ? -x : x, 0);
+                    //   }
+                    // });
+                    // const widthPx = `${width + deltaRef.current}px`;
+                    // cells.forEach((c) => {
+                    //   if (!isHTMLElement(c)) return;
+                    //   c.style.minWidth = widthPx;
+                    //   c.style.maxWidth = widthPx;
+                    //   c.style.width = widthPx;
+                    // });
+                    // const headerAfterQuery = `${headerQuery} ~ [data-ln-header-cell="true"]`;
+                    // let after: HTMLElement[];
+                    // if (pin !== "end") {
+                    //   after = Array.from(vp.querySelectorAll(headerAfterQuery)) as HTMLElement[];
+                    // } else {
+                    //   after = [];
+                    // }
+                    // after.forEach((c) => {
+                    //   if (!isHTMLElement(c)) return;
+                    //   const thisPin = c.getAttribute("data-ln-pin");
+                    //   if (pin === "end" && thisPin === "end") return;
+                    //   if (pin !== "end" && thisPin === "end") return;
+                    //   const colindex = getColIndexFromEl(c);
+                    //   const transform = xPositions[colindex] + deltaRef.current;
+                    //   c.style.transform = getTranslate(transform * (isRtl ? -1 : 1), 0);
+                    // });
+                    anim = null;
+                });
+            }, { signal: controller.signal });
+            window.addEventListener("pointerup", () => {
+                if (anim)
+                    cancelAnimationFrame(anim);
+                controller.abort();
+                vp.style.overflowX = overflow;
+                const newWidth = width + deltaRef.current;
+                sx.api.columnResize({ [cell.id]: newWidth });
+            }, { signal: controller.signal });
+        },
+        className,
+        style: {
+            height: "100%",
+            width: "6px",
+            ...style,
+            top: "0px",
+            insetInlineEnd: cell.colPin !== "end" ? "0px" : undefined,
+            insetInlineStart: cell.colPin === "end" ? "0px" : undefined,
+            position: "absolute",
+        },
+    };
+    const edge = useSlot({
+        props: [defaultProps],
+        slot: as ?? _jsx("div", {}),
+    });
+    return edge;
+}

package/dist/header/use-drag-move.d.ts

@@ -0,0 +1,14 @@
+import type { Grid, HeaderCellFloating, HeaderCellLayout, HeaderGroupCellLayout } from "../+types.js";
+import { type JSX } from "react";
+import type { InternalAtoms } from "../state/+types.js";
+export declare function useDragMove<T>(grid: Grid<T> & {
+    internal: InternalAtoms;
+}, cell: HeaderGroupCellLayout | HeaderCellLayout<T> | HeaderCellFloating<T>, onDragStart?: JSX.IntrinsicElements["div"]["onDragStart"]): {
+    draggable?: undefined;
+    onDragStart?: undefined;
+    ref?: undefined;
+} | {
+    draggable: true;
+    onDragStart: (e: import("react").DragEvent<Element>) => void;
+    ref: any;
+};

package/dist/header/use-drag-move.js

@@ -0,0 +1,97 @@
+import { COLUMN_MARKER_ID, getHoveredColumnIndex, getNearestFocusable, GROUP_COLUMN_PREFIX, useDraggable, } from "@1771technologies/lytenyte-shared";
+import { useMemo, useRef } from "react";
+export function useDragMove(grid, cell, onDragStart) {
+    const ctx = grid.state;
+    const meta = ctx.columnMeta.useValue();
+    const base = ctx.columnBase.useValue();
+    const columns = useMemo(() => {
+        const columns = [];
+        for (let i = cell.colStart; i < cell.colEnd; i++) {
+            columns.push(meta.columnsVisible[i]);
+        }
+        return columns;
+    }, [cell.colEnd, cell.colStart, meta.columnsVisible]);
+    const isMovable = useMemo(() => {
+        return columns.every((c) => !c.id.startsWith(GROUP_COLUMN_PREFIX) &&
+            c.id !== COLUMN_MARKER_ID &&
+            (c.uiHints?.movable ?? base.uiHints?.movable ?? false));
+    }, [base.uiHints?.movable, columns]);
+    const swapDirection = useRef(null);
+    const swapIndex = useRef(-1);
+    const swapPrevIndex = useRef(-1);
+    const isForward = useRef(false);
+    const prevPos = useRef(-1);
+    const { dragProps } = useDraggable({
+        getItems: () => ({}),
+        onDragStart: () => {
+            if (cell.kind === "group")
+                grid.internal.draggingHeader.set(cell);
+        },
+        onDragEnd: () => {
+            grid.internal.draggingHeader.set(null);
+        },
+        onDragMove: (p) => {
+            const element = document.elementFromPoint(p.position.x, p.position.y);
+            const vp = grid.state.viewport.get();
+            if (!vp?.contains(element))
+                return;
+            const nearest = getNearestFocusable(element);
+            if (!nearest)
+                return;
+            if (prevPos.current < p.position.x)
+                isForward.current = true;
+            if (prevPos.current > p.position.x)
+                isForward.current = false;
+            prevPos.current = p.position.x;
+            const meta = grid.state.columnMeta.get();
+            const index = getHoveredColumnIndex({
+                viewport: vp,
+                centerCount: meta.columnVisibleCenterCount,
+                startCount: meta.columnVisibleStartCount,
+                endCount: meta.columnVisibleEndCount,
+                clientX: p.position.x,
+                rtl: grid.state.rtl.get(),
+                xPositions: grid.state.xPositions.get(),
+            });
+            if (index == null)
+                return;
+            const columnTarget = grid.api.columnByIndex(index);
+            if (columnTarget) {
+                if (columnTarget.id === COLUMN_MARKER_ID || columnTarget.id.startsWith(GROUP_COLUMN_PREFIX))
+                    return;
+            }
+            const first = columns[0];
+            const currentIndex = grid.api.columnIndex(first);
+            const columnIndices = columns.map((c) => grid.api.columnIndex(c));
+            if (columnIndices.includes(index))
+                return;
+            const ignoreMove = swapDirection.current === isForward.current &&
+                swapIndex.current === currentIndex &&
+                index === swapPrevIndex.current;
+            if (currentIndex === index || ignoreMove)
+                return;
+            swapDirection.current = isForward.current;
+            swapIndex.current = index;
+            swapPrevIndex.current = currentIndex;
+            grid.api.columnMove({
+                moveColumns: columns,
+                moveTarget: index,
+                before: currentIndex > index,
+                updatePinState: true,
+            });
+        },
+    });
+    const finalProps = useMemo(() => {
+        if (cell.kind === "floating" || !isMovable)
+            return {};
+        return {
+            draggable: true,
+            onDragStart: (e) => {
+                onDragStart?.(e);
+                dragProps.onDragStart(e);
+            },
+            ref: dragProps.ref,
+        };
+    }, [cell.kind, dragProps, isMovable, onDragStart]);
+    return finalProps;
+}

package/dist/header/use-header-cell-renderer.d.ts

@@ -0,0 +1,4 @@
+import type { HeaderCellFloating, HeaderCellLayout, HeaderCellRendererParams } from "../+types";
+declare function DefaultRenderer(p: HeaderCellRendererParams<any>): import("react/jsx-runtime").JSX.Element;
+export declare function useHeaderCellRenderer<T>(cell: HeaderCellLayout<T> | HeaderCellFloating<T>): import("../+types").HeaderFloatingCellRendererFn<any> | import("../+types").HeaderCellRendererFn<T> | typeof DefaultRenderer;
+export {};

package/dist/header/use-header-cell-renderer.js

@@ -0,0 +1,36 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { useGridRoot } from "../context.js";
+function DefaultRenderer(p) {
+    return _jsx(_Fragment, { children: p.column.name ?? p.column.id });
+}
+export function useHeaderCellRenderer(cell) {
+    const ctx = useGridRoot().grid;
+    const base = ctx.state.columnBase.useValue();
+    const floatingRenderers = ctx.state.floatingCellRenderers.useValue();
+    const headerRenderers = ctx.state.headerCellRenderers.useValue();
+    return useMemo(() => {
+        if (cell.kind === "cell") {
+            const renderer = cell.column.headerRenderer ?? base.headerRenderer ?? DefaultRenderer;
+            if (typeof renderer === "string")
+                return headerRenderers[renderer] ?? DefaultRenderer;
+            else
+                return renderer;
+        }
+        else {
+            const renderer = cell.column.floatingCellRenderer ?? base.floatingCellRenderer ?? DefaultRenderer;
+            if (typeof renderer === "string")
+                return floatingRenderers[renderer] ?? DefaultRenderer;
+            else
+                return renderer;
+        }
+    }, [
+        base.floatingCellRenderer,
+        base.headerRenderer,
+        cell.column.floatingCellRenderer,
+        cell.column.headerRenderer,
+        cell.kind,
+        floatingRenderers,
+        headerRenderers,
+    ]);
+}

package/dist/icons/index.d.ts

@@ -0,0 +1 @@
+export { AddIcon, AddSmallIcon, AggregateIcon, AggregationIcon, ArchiveIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightCurvedIcon, ArrowRightIcon, ArrowUpIcon, AutosizeIcon, BackIcon, BookmarkIcon, BooleanIcon, CalendarIcon, ChartIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, Close2Icon, CloseIcon, CollapseGroupIcon, Columns2Icon, ColumnsIcon, CopyIcon, CornerRadiusIcon, CustomizeThemeIcon, CutIcon, CsvIcon, DeleteIcon, DocsIcon, DownloadIcon, Drag2Icon, DragDotsIcon, DragDotsSmallIcon, DragIcon, DuplicateIcon, EditIcon, EmailIcon, ExcelIcon, ExpandGroupIcon, ExpandIcon, Expression2Icon, ExpressionIcon, ExternalLinkIcon, File2Icon, FileIcon, FilterIcon, FolderIcon, GlobeIcon, GridViewIcon, GroupByColIcon, HamburgerIcon, HelpIcon, HiddenIcon, HistoryIcon, ImportIcon, LinkIcon, ListViewIcon, LoadingIcon, LocationIcon, ModalIcon, MoreIcon, MoreVerticalIcon, MultilineIcon, NumberIcon, PasteIcon, PieIcon, PinColumnIcon, RefreshIcon, SearchIcon, SettingsIcon, ShareIcon, SingleLineIcon, Sort2Icon, SortIcon, SpacingHIcon, SpacingIcon, StickColumnIcon, SwapIcon, TagIcon, TaskIcon, TextIcon, ThemesIcon, Tickmark2Icon, TickmarkIcon, TimeIcon, UploadIcon, UserIcon, ViewIcon, } from "@1771technologies/lytenyte-core/icons";

package/dist/icons/index.js

@@ -0,0 +1,3 @@
+export { AddIcon, AddSmallIcon, AggregateIcon, AggregationIcon, ArchiveIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightCurvedIcon, ArrowRightIcon, ArrowUpIcon, AutosizeIcon, BackIcon, BookmarkIcon, BooleanIcon, CalendarIcon, ChartIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, Close2Icon, CloseIcon, CollapseGroupIcon, Columns2Icon, ColumnsIcon, CopyIcon, CornerRadiusIcon, CustomizeThemeIcon, CutIcon, CsvIcon, DeleteIcon, DocsIcon, DownloadIcon, Drag2Icon, DragDotsIcon, DragDotsSmallIcon, DragIcon, DuplicateIcon, EditIcon, EmailIcon, ExcelIcon, ExpandGroupIcon, ExpandIcon, Expression2Icon, ExpressionIcon, ExternalLinkIcon, File2Icon, FileIcon, FilterIcon, FolderIcon, GlobeIcon, GridViewIcon, GroupByColIcon, HamburgerIcon, HelpIcon, HiddenIcon, HistoryIcon, ImportIcon, LinkIcon, ListViewIcon, LoadingIcon, LocationIcon, ModalIcon, MoreIcon, MoreVerticalIcon, MultilineIcon, NumberIcon, PasteIcon, PieIcon, PinColumnIcon, RefreshIcon, SearchIcon, SettingsIcon, ShareIcon, SingleLineIcon, Sort2Icon, SortIcon, SpacingHIcon, SpacingIcon, StickColumnIcon, SwapIcon, TagIcon, TaskIcon, TextIcon, ThemesIcon, Tickmark2Icon, TickmarkIcon, TimeIcon, UploadIcon, UserIcon, ViewIcon,
+// eslint-disable-next-line import/extensions
+ } from "@1771technologies/lytenyte-core/icons";

package/dist/index.d.ts

@@ -0,0 +1,13 @@
+export { GROUP_COLUMN_PREFIX, COLUMN_MARKER_ID, GROUP_COLUMN_SINGLE_ID, GROUP_COLUMN_MULTI_PREFIX, } from "@1771technologies/lytenyte-shared";
+export { Grid } from "./grid.js";
+export { SortManager } from "./sort-manager/sort-manager.js";
+export { FilterTree } from "./filter-tree/filter-tree.js";
+export { ColumnManager } from "./column-manager/column-manager.js";
+export { GridBox } from "./grid-box/grid-box.js";
+export { DropWrap } from "@1771technologies/lytenyte-dragon";
+export { activateLicense } from "./license.js";
+export { measureText } from "@1771technologies/lytenyte-shared";
+export { makeClientDataSource, useClientRowDataSource, } from "./row-data-source-client/use-client-data-source.js";
+export { makeClientDataSourcePaginated, useClientRowDataSourcePaginated, } from "./row-data-source-client/use-client-data-source-paginated.js";
+export { makeClientTreeDataSource, useClientTreeDataSource, } from "./row-data-source-client/use-client-tree-data-source.js";
+export { makeServerDataSource, useServerDataSource, } from "./row-data-source-server/use-server-data-source.js";

package/dist/index.js

@@ -0,0 +1,13 @@
+export { GROUP_COLUMN_PREFIX, COLUMN_MARKER_ID, GROUP_COLUMN_SINGLE_ID, GROUP_COLUMN_MULTI_PREFIX, } from "@1771technologies/lytenyte-shared";
+export { Grid } from "./grid.js";
+export { SortManager } from "./sort-manager/sort-manager.js";
+export { FilterTree } from "./filter-tree/filter-tree.js";
+export { ColumnManager } from "./column-manager/column-manager.js";
+export { GridBox } from "./grid-box/grid-box.js";
+export { DropWrap } from "@1771technologies/lytenyte-dragon";
+export { activateLicense } from "./license.js";
+export { measureText } from "@1771technologies/lytenyte-shared";
+export { makeClientDataSource, useClientRowDataSource, } from "./row-data-source-client/use-client-data-source.js";
+export { makeClientDataSourcePaginated, useClientRowDataSourcePaginated, } from "./row-data-source-client/use-client-data-source-paginated.js";
+export { makeClientTreeDataSource, useClientTreeDataSource, } from "./row-data-source-client/use-client-tree-data-source.js";
+export { makeServerDataSource, useServerDataSource, } from "./row-data-source-server/use-server-data-source.js";

package/dist/license.d.ts

@@ -0,0 +1,3 @@
+export function activateLicense(license: any): boolean;
+export let hasAValidLicense: boolean;
+export let licenseState: null;

package/dist/license.js

@@ -0,0 +1,214 @@
+const hashSalt = "faec0f3c45281b1fe12d87e64a6c3271";
+const issueDate = new Date("2025-09-11");
+function getHostname() {
+    const win = globalThis?.document?.defaultView || (typeof window !== "undefined" ? window : null);
+    const loc = win?.location;
+    const { hostname = "" } = loc ?? {};
+    return hostname;
+}
+function isWebsiteUrl() {
+    const hostname = getHostname();
+    return hostname.match(/^((?:\w+\.)?1771technologies\.com)$/) !== null;
+}
+function isLocalhost() {
+    const hostname = getHostname();
+    return hostname.match(/^(?:127\.0\.0\.1|localhost)$/) !== null;
+}
+export let hasAValidLicense = isWebsiteUrl() || isLocalhost();
+export let licenseState = null;
+export function activateLicense(license) {
+    const parts = license.split("|");
+    const details = parts[0];
+    const hash = parts[1];
+    const detailHash = new MD5().md5(details + hashSalt);
+    if (detailHash !== hash) {
+        console.error(`
+********************************************************************************
+  LyteNyte Grid PRO
+
+  Invalid license key. Please verify the key and try again.
+
+  Visit https://1771technolgies.com for more information.
+********************************************************************************
+`);
+        licenseState = "invalid";
+        return false;
+    }
+    const detailParts = details.split(" ");
+    const endDate = new Date(detailParts[1]);
+    if (issueDate > endDate) {
+        console.error(`
+********************************************************************************
+  LyteNyte Grid PRO
+
+  License key expired. Your license covers earlier versions only.
+
+  Visit https://1771technolgies.com for more information.
+********************************************************************************
+`);
+        licenseState = "expired";
+        return false;
+    }
+    hasAValidLicense = true;
+    return true;
+}
+// see: https://www.myersdaily.org/joseph/javascript/md5-text.html
+// https://stackoverflow.com/a/1655795
+class MD5 {
+    md5cycle(x, k) {
+        let a = x[0];
+        let b = x[1];
+        let c = x[2];
+        let d = x[3];
+        a = this.ff(a, b, c, d, k[0], 7, -680876936);
+        d = this.ff(d, a, b, c, k[1], 12, -389564586);
+        c = this.ff(c, d, a, b, k[2], 17, 606105819);
+        b = this.ff(b, c, d, a, k[3], 22, -1044525330);
+        a = this.ff(a, b, c, d, k[4], 7, -176418897);
+        d = this.ff(d, a, b, c, k[5], 12, 1200080426);
+        c = this.ff(c, d, a, b, k[6], 17, -1473231341);
+        b = this.ff(b, c, d, a, k[7], 22, -45705983);
+        a = this.ff(a, b, c, d, k[8], 7, 1770035416);
+        d = this.ff(d, a, b, c, k[9], 12, -1958414417);
+        c = this.ff(c, d, a, b, k[10], 17, -42063);
+        b = this.ff(b, c, d, a, k[11], 22, -1990404162);
+        a = this.ff(a, b, c, d, k[12], 7, 1804603682);
+        d = this.ff(d, a, b, c, k[13], 12, -40341101);
+        c = this.ff(c, d, a, b, k[14], 17, -1502002290);
+        b = this.ff(b, c, d, a, k[15], 22, 1236535329);
+        a = this.gg(a, b, c, d, k[1], 5, -165796510);
+        d = this.gg(d, a, b, c, k[6], 9, -1069501632);
+        c = this.gg(c, d, a, b, k[11], 14, 643717713);
+        b = this.gg(b, c, d, a, k[0], 20, -373897302);
+        a = this.gg(a, b, c, d, k[5], 5, -701558691);
+        d = this.gg(d, a, b, c, k[10], 9, 38016083);
+        c = this.gg(c, d, a, b, k[15], 14, -660478335);
+        b = this.gg(b, c, d, a, k[4], 20, -405537848);
+        a = this.gg(a, b, c, d, k[9], 5, 568446438);
+        d = this.gg(d, a, b, c, k[14], 9, -1019803690);
+        c = this.gg(c, d, a, b, k[3], 14, -187363961);
+        b = this.gg(b, c, d, a, k[8], 20, 1163531501);
+        a = this.gg(a, b, c, d, k[13], 5, -1444681467);
+        d = this.gg(d, a, b, c, k[2], 9, -51403784);
+        c = this.gg(c, d, a, b, k[7], 14, 1735328473);
+        b = this.gg(b, c, d, a, k[12], 20, -1926607734);
+        a = this.hh(a, b, c, d, k[5], 4, -378558);
+        d = this.hh(d, a, b, c, k[8], 11, -2022574463);
+        c = this.hh(c, d, a, b, k[11], 16, 1839030562);
+        b = this.hh(b, c, d, a, k[14], 23, -35309556);
+        a = this.hh(a, b, c, d, k[1], 4, -1530992060);
+        d = this.hh(d, a, b, c, k[4], 11, 1272893353);
+        c = this.hh(c, d, a, b, k[7], 16, -155497632);
+        b = this.hh(b, c, d, a, k[10], 23, -1094730640);
+        a = this.hh(a, b, c, d, k[13], 4, 681279174);
+        d = this.hh(d, a, b, c, k[0], 11, -358537222);
+        c = this.hh(c, d, a, b, k[3], 16, -722521979);
+        b = this.hh(b, c, d, a, k[6], 23, 76029189);
+        a = this.hh(a, b, c, d, k[9], 4, -640364487);
+        d = this.hh(d, a, b, c, k[12], 11, -421815835);
+        c = this.hh(c, d, a, b, k[15], 16, 530742520);
+        b = this.hh(b, c, d, a, k[2], 23, -995338651);
+        a = this.ii(a, b, c, d, k[0], 6, -198630844);
+        d = this.ii(d, a, b, c, k[7], 10, 1126891415);
+        c = this.ii(c, d, a, b, k[14], 15, -1416354905);
+        b = this.ii(b, c, d, a, k[5], 21, -57434055);
+        a = this.ii(a, b, c, d, k[12], 6, 1700485571);
+        d = this.ii(d, a, b, c, k[3], 10, -1894986606);
+        c = this.ii(c, d, a, b, k[10], 15, -1051523);
+        b = this.ii(b, c, d, a, k[1], 21, -2054922799);
+        a = this.ii(a, b, c, d, k[8], 6, 1873313359);
+        d = this.ii(d, a, b, c, k[15], 10, -30611744);
+        c = this.ii(c, d, a, b, k[6], 15, -1560198380);
+        b = this.ii(b, c, d, a, k[13], 21, 1309151649);
+        a = this.ii(a, b, c, d, k[4], 6, -145523070);
+        d = this.ii(d, a, b, c, k[11], 10, -1120210379);
+        c = this.ii(c, d, a, b, k[2], 15, 718787259);
+        b = this.ii(b, c, d, a, k[9], 21, -343485551);
+        x[0] = this.add32(a, x[0]);
+        x[1] = this.add32(b, x[1]);
+        x[2] = this.add32(c, x[2]);
+        x[3] = this.add32(d, x[3]);
+    }
+    cmn(q, a, b, x, s, t) {
+        a = this.add32(this.add32(a, q), this.add32(x, t));
+        return this.add32((a << s) | (a >>> (32 - s)), b);
+    }
+    ff(a, b, c, d, x, s, t) {
+        return this.cmn((b & c) | (~b & d), a, b, x, s, t);
+    }
+    gg(a, b, c, d, x, s, t) {
+        return this.cmn((b & d) | (c & ~d), a, b, x, s, t);
+    }
+    hh(a, b, c, d, x, s, t) {
+        return this.cmn(b ^ c ^ d, a, b, x, s, t);
+    }
+    ii(a, b, c, d, x, s, t) {
+        return this.cmn(c ^ (b | ~d), a, b, x, s, t);
+    }
+    md51(s) {
+        const n = s.length;
+        const state = [1732584193, -271733879, -1732584194, 271733878];
+        let i;
+        for (i = 64; i <= s.length; i += 64) {
+            this.md5cycle(state, this.md5blk(s.substring(i - 64, i)));
+        }
+        s = s.substring(i - 64);
+        const tail = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
+        for (i = 0; i < s.length; i++) {
+            tail[i >> 2] |= s.charCodeAt(i) << (i % 4 << 3);
+        }
+        tail[i >> 2] |= 0x80 << (i % 4 << 3);
+        if (i > 55) {
+            this.md5cycle(state, tail);
+            for (i = 0; i < 16; i++) {
+                tail[i] = 0;
+            }
+        }
+        tail[14] = n * 8;
+        this.md5cycle(state, tail);
+        return state;
+    }
+    /* there needs to be support for Unicode here, * unless we pretend that we can redefine the MD-5
+     * algorithm for multi-byte characters (perhaps by adding every four 16-bit characters and
+     * shortening the sum to 32 bits). Otherwise I suthis.ggest performing MD-5 as if every character
+     * was two bytes--e.g., 0040 0025 = @%--but then how will an ordinary MD-5 sum be matched?
+     * There is no way to standardize text to something like UTF-8 before transformation; speed cost is
+     * utterly prohibitive. The JavaScript standard itself needs to look at this: it should start
+     * providing access to strings as preformed UTF-8 8-bit unsigned value arrays.
+     */
+    md5blk(s) {
+        const md5blks = [];
+        for (let i = 0; i < 64; i += 4) {
+            md5blks[i >> 2] =
+                s.charCodeAt(i) +
+                    (s.charCodeAt(i + 1) << 8) +
+                    (s.charCodeAt(i + 2) << 16) +
+                    (s.charCodeAt(i + 3) << 24);
+        }
+        return md5blks;
+    }
+    rhex(n) {
+        const hex_chr = "0123456789abcdef".split("");
+        let s = "";
+        let j = 0;
+        for (; j < 4; j++) {
+            s += hex_chr[(n >> (j * 8 + 4)) & 0x0f] + hex_chr[(n >> (j * 8)) & 0x0f];
+        }
+        return s;
+    }
+    hex(x) {
+        for (let i = 0; i < x.length; i++) {
+            x[i] = this.rhex(x[i]);
+        }
+        return x.join("");
+    }
+    md5(s) {
+        return this.hex(this.md51(s));
+    }
+    add32(a, b) {
+        return this.add32Std(a, b);
+    }
+    add32Std(a, b) {
+        return (a + b) & 0xffffffff;
+    }
+}

package/dist/listbox/context.d.ts

@@ -0,0 +1,6 @@
+export interface ListboxContext {
+    readonly orientation: "horizontal" | "vertical";
+    readonly rtl: boolean;
+}
+export declare const context: import("react").Context<ListboxContext>;
+export declare const useListboxContext: () => ListboxContext;

package/dist/listbox/context.js

@@ -0,0 +1,3 @@
+import { createContext, useContext } from "react";
+export const context = createContext({ orientation: "vertical", rtl: false });
+export const useListboxContext = () => useContext(context);

package/dist/listbox/item.d.ts

@@ -0,0 +1 @@
+export declare const Item: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/listbox/item.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { useListboxContext } from "./context.js";
+import { getTabbables } from "@1771technologies/lytenyte-dom-utils";
+export const Item = forwardRef(function Item(props, forwarded) {
+    const ctx = useListboxContext();
+    return (_jsx("div", { ...props, role: "option", onKeyDownCapture: (ev) => {
+            const next = ctx.rtl ? "ArrowLeft" : "ArrowRight";
+            const prev = ctx.rtl ? "ArrowRight" : "ArrowLeft";
+            if (ev.key !== next && ev.key !== prev)
+                return;
+            ev.preventDefault();
+            const items = getTabbables(ev.currentTarget);
+            if (!items.length)
+                return;
+            items.unshift(ev.currentTarget);
+            const index = items.findIndex((c) => document.activeElement === c);
+            const nextIndex = ev.key === next ? index + 1 : index - 1;
+            const itemToFocus = items[nextIndex];
+            if (!itemToFocus)
+                return;
+            ev.stopPropagation();
+            itemToFocus.focus();
+        }, ref: forwarded, tabIndex: 0, "data-ln-listbox-item": true }));
+});

package/dist/listbox/panel.d.ts

@@ -0,0 +1 @@
+export declare const Panel: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;