45 lines
1.1 KiB
React
45 lines
1.1 KiB
React
/**
|
|
* GlassTextarea 组件
|
|
* 毛玻璃文本区域样式
|
|
* @param {Object} props
|
|
* @param {string} props.label - 标签文本
|
|
* @param {string} props.placeholder - 占位符文本
|
|
* @param {string} props.value - 输入值
|
|
* @param {Function} props.onChange - 值变化处理函数
|
|
* @param {number} props.rows - 行数
|
|
* @param {string} props.className - 额外的CSS类名
|
|
* @param {string} props.id - 文本区域ID
|
|
*/
|
|
const GlassTextarea = ({
|
|
label,
|
|
placeholder = '',
|
|
value,
|
|
onChange,
|
|
rows = 4,
|
|
className = '',
|
|
id
|
|
}) => {
|
|
return (
|
|
<div className={`flex flex-col gap-2 ${className}`}>
|
|
{label && (
|
|
<label
|
|
htmlFor={id}
|
|
className="text-[10px] text-white/30 uppercase tracking-widest font-bold"
|
|
>
|
|
{label}
|
|
</label>
|
|
)}
|
|
<textarea
|
|
id={id}
|
|
placeholder={placeholder}
|
|
value={value}
|
|
onChange={(e) => onChange(e.target.value)}
|
|
rows={rows}
|
|
className="glass-input w-full resize-none focus:ring-2 focus:ring-orange-200/50 text-sm"
|
|
/>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default GlassTextarea;
|