20 lines
929 B
TypeScript
20 lines
929 B
TypeScript
|
"use client";
|
||
|
|
|
||
|
|
// <select> ที่ถอดลูกศร native ของ browser ออก (วาดชิดขอบและขยับด้วย padding ไม่ได้)
|
||
|
|
// แล้วใส่ลูกศรเอง — ใช้เหมือน <select> ปกติทุกอย่าง (props/children)
|
||
|
|
// className ที่ส่งเข้าไปใช้กับตัว <select> โดย append `appearance-none pr-7` ให้
|
||
|
|
import type { SelectHTMLAttributes } from "react";
|
||
|
|
import { ChevronDown } from "lucide-react";
|
||
|
|
|
||
|
|
export default function Select({
|
||
|
|
className = "",
|
||
|
|
...props
|
||
|
|
}: SelectHTMLAttributes<HTMLSelectElement>) {
|
||
|
|
return (
|
||
|
|
<div className="relative">
|
||
|
|
<select {...props} className={`appearance-none pr-7 ${className}`} />
|
||
|
|
<ChevronDown className="pointer-events-none absolute right-2 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-slate-400" />
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|