@smitch/fluid/lib/autocomplete/Autocomplete.js

A Next/React ui-component libray.

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { twMerge } from 'tailwind-merge';
import { Input, Label } from '..';
var Autocomplete = function (_a) {
    var _b = _a.className, className = _b === void 0 ? '' : _b, _c = _a.size, size = _c === void 0 ? 'md' : _c, data = _a.data, list = _a.list, required = _a.required, name = _a.name, _d = _a.placeholder, placeholder = _d === void 0 ? 'Please Select' : _d, onChange = _a.onChange, autocomplete = _a.autocomplete, label = _a.label, _e = _a.layout, layout = _e === void 0 ? 'row' : _e, rounded = _a.rounded, _f = _a.suppressHydrationWarning, suppressHydrationWarning = _f === void 0 ? false : _f;
    return (_jsxs(Label, { label: label, layout: layout, required: required, size: size, children: [_jsx(Input, { list: list, placeholder: placeholder, required: required, name: name || list, onChange: onChange, className: twMerge("autocomplete group [&::-webkit-calendar-picker-indicator]:opacity-0", className), size: size, autocomplete: autocomplete, "data-testid": name || list, rounded: rounded, suppressHydrationWarning: suppressHydrationWarning }), _jsx("datalist", { className: 'datalist bg-light text-dark dark:bg-dark dark:text-light dark:[color-scheme:dark]', id: list, "data-testid": 'datalist', children: data.map(function (el, index) { return (_jsx("option", { value: el }, index)); }) })] }));
};
export default Autocomplete;