70 lines
2.0 KiB
TypeScript
70 lines
2.0 KiB
TypeScript
|
"use client";
|
||
|
|
|
||
|
|
import React from "react";
|
||
|
|
import { Label } from "@/components/ui/label";
|
||
|
|
import { Input } from "@/components/ui/input";
|
||
|
|
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
|
||
|
|
|
||
|
|
interface ImageWidgetConfigPanelProps {
|
||
|
|
config: any;
|
||
|
|
onConfigChange: (config: any) => void;
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* 이미지 위젯 설정 패널
|
||
|
|
*/
|
||
|
|
export function ImageWidgetConfigPanel({ config, onConfigChange }: ImageWidgetConfigPanelProps) {
|
||
|
|
const handleChange = (key: string, value: any) => {
|
||
|
|
onConfigChange({
|
||
|
|
...config,
|
||
|
|
[key]: value,
|
||
|
|
});
|
||
|
|
};
|
||
|
|
|
||
|
|
return (
|
||
|
|
<Card>
|
||
|
|
<CardHeader>
|
||
|
|
<CardTitle className="text-sm">이미지 설정</CardTitle>
|
||
|
|
<CardDescription className="text-xs">이미지 업로드 및 표시 설정</CardDescription>
|
||
|
|
</CardHeader>
|
||
|
|
<CardContent className="space-y-4">
|
||
|
|
<div className="space-y-2">
|
||
|
|
<Label htmlFor="maxSize" className="text-xs">
|
||
|
|
최대 파일 크기 (MB)
|
||
|
|
</Label>
|
||
|
|
<Input
|
||
|
|
id="maxSize"
|
||
|
|
type="number"
|
||
|
|
min="1"
|
||
|
|
max="10"
|
||
|
|
value={(config.maxSize || 5 * 1024 * 1024) / (1024 * 1024)}
|
||
|
|
onChange={(e) => handleChange("maxSize", parseInt(e.target.value) * 1024 * 1024)}
|
||
|
|
className="h-8 text-xs"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className="space-y-2">
|
||
|
|
<Label htmlFor="placeholder" className="text-xs">
|
||
|
|
플레이스홀더 텍스트
|
||
|
|
</Label>
|
||
|
|
<Input
|
||
|
|
id="placeholder"
|
||
|
|
type="text"
|
||
|
|
value={config.placeholder || "이미지를 업로드하세요"}
|
||
|
|
onChange={(e) => handleChange("placeholder", e.target.value)}
|
||
|
|
className="h-8 text-xs"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className="rounded-md bg-muted p-3 text-xs text-muted-foreground">
|
||
|
|
<p className="mb-1 font-medium">지원 형식:</p>
|
||
|
|
<p>JPG, PNG, GIF, WebP</p>
|
||
|
|
</div>
|
||
|
|
</CardContent>
|
||
|
|
</Card>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
export default ImageWidgetConfigPanel;
|
||
|
|
|