@1771technologies/lytenyte-pro
Version:
Blazingly fast headless React data grid with 100s of features.
34 lines (33 loc) • 1.6 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import "../../../css/components.css";
import { useState } from "react";
import { SmartSelectRoot } from "./root.js";
import { Option } from "./option.js";
import { SmartSelectContainer } from "./container.js";
import { BasicSelectTrigger } from "./triggers/basic-trigger.js";
const options = [
{ id: "js", label: "JavaScript" },
{ id: "ts", label: "TypeScript" },
{ id: "py", label: "Python" },
{ id: "java", label: "Java" },
{ id: "cpp", label: "C++" },
{ id: "cs", label: "C#" },
{ id: "php", label: "PHP" },
{ id: "ruby", label: "Ruby" },
{ id: "go", label: "Go" },
{ id: "rust", label: "Rust" },
{ id: "swift", label: "Swift" },
];
export default function SmartSelect() {
const [value, setValue] = useState(options[0]);
void setValue;
return (_jsx("div", { style: { display: "flex", justifyContent: "center", padding: 20 }, children: _jsx(SmartSelectRoot, { options: options, value: value, onOptionChange: (v) => {
if (!v)
return;
setValue(v);
}, closeOnSelect: false, kind: "basic", container: (p) => {
return (_jsxs(SmartSelectContainer, { children: [p.loading && _jsx("div", { children: "Loading...." }), p.children] }));
}, trigger: _jsx(BasicSelectTrigger, { children: value.label }), children: (p) => {
return (_jsxs(Option, { ...p, children: [_jsx("div", { children: p.option.label }), _jsx("div", { children: p.selected && "✔️" })] }));
} }) }));
}