@1771technologies/lytenyte-pro/dist/sort-manager/sort-value-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 SortValueSelect = forwardRef(function SortValueSelect({ as, ...props }, forwarded) {
    const row = useSortRowCtx();
    const el = (_jsxs("select", { "aria-label": "Select sort value", value: row.sortSelected?.value ?? "", onChange: (e) => {
            const item = row.sortOptions.find((c) => c.value === e.target.value);
            row.sortOnSelect(item ?? null);
        }, disabled: !row.sortOptions.length, children: [_jsx("option", { value: "", children: "Select..." }), row.sortOptions.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.sortOptions,
            value: row.sortSelected,
            onSelect: row.sortOnSelect,
            disabled: !row.sortOptions.length,
        },
    });
    return renderer;
});