@1771technologies/lytenyte-pro/dist/sort-manager/sort-column-select.js

Blazingly fast headless React data grid with 100s of features.

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { forwardRef } from "react";
import { useSortRowCtx } from "./context.js";
import { useSlot } from "@1771technologies/lytenyte-core/yinternal";
export const SortColumnSelect = forwardRef(function SortColumnSelect({ as, ...props }, forwarded) {
    const row = useSortRowCtx();
    const el = (_jsxs("select", { "aria-label": "Select column to sort", value: row.columnItem?.value ?? "", onChange: (e) => {
            const item = row.columnOptions.find((c) => c.value === e.target.value);
            row.columnOnSelect(item ?? null);
        }, children: [_jsx("option", { value: "", children: "Select..." }), row.columnOptions.map((c) => {
                return (_jsx("option", { value: c.value, children: c.label }, c.value));
            })] }));
    const renderer = useSlot({
        props: [props],
        ref: forwarded,
        slot: as ?? el,
        state: { options: row.columnOptions, onSelect: row.columnOnSelect, value: row.columnSelected },
    });
    return renderer;
});