import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { forwardRef } from 'react';
import { cv } from '../../lib/cv.js';
const select = cv(
// Shares geometry with Input so they line up in forms.
'focus-visible:ring-offset-background flex w-full appearance-none rounded-[var(--radius)] border bg-[var(--background)] pr-8 text-[var(--foreground)] focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50', {
    variants: {
        size: {
            sm: 'h-8 pr-7 pl-2.5 text-xs',
            md: 'h-9 pr-8 pl-3 text-sm',
            lg: 'h-10 pr-9 pl-4 text-base',
        },
        state: {
            default: 'border-[var(--border)]',
            invalid: 'border-[var(--destructive)] focus-visible:ring-[var(--destructive)]',
            valid: 'border-emerald-500 focus-visible:ring-emerald-500',
        },
    },
    defaultVariants: { size: 'md', state: 'default' },
});
export const Select = forwardRef(function Select({ size, state, className, children, ...rest }, ref) {
    return (_jsxs("div", { className: "relative", children: [_jsx("select", { ref: ref, className: select({ size, state, class: className }), ...rest, children: children }), _jsx("svg", { "aria-hidden": true, className: "pointer-events-none absolute top-1/2 right-2 h-4 w-4 -translate-y-1/2 text-[var(--muted-foreground)]", viewBox: "0 0 20 20", fill: "currentColor", children: _jsx("path", { fillRule: "evenodd", d: "M5.23 7.21a.75.75 0 011.06.02L10 11.06l3.71-3.83a.75.75 0 111.08 1.04l-4.25 4.39a.75.75 0 01-1.08 0L5.21 8.27a.75.75 0 01.02-1.06z", clipRule: "evenodd" }) })] }));
});
export { select as selectVariants };
//# sourceMappingURL=Select.js.map