"use client";

import React from "react";
import { Label } from "@/components/ui/label";
import { Input } from "@/components/ui/input";

export interface BasicTabProps {
  config: any;
  onChange: (key: string, value: any) => void;
  localText?: string;
  onTextChange?: (value: string) => void;
}

export const BasicTab: React.FC<BasicTabProps> = ({
  config,
  onChange,
  localText,
  onTextChange,
}) => {
  const text = localText !== undefined ? localText : (config.text !== undefined ? config.text : "버튼");

  const handleChange = (newValue: string) => {
    onTextChange?.(newValue);
    onChange("componentConfig.text", newValue);
  };

  return (
    <div className="space-y-4">
      <div>
        <Label htmlFor="button-text">버튼 텍스트</Label>
        <Input
          id="button-text"
          value={text}
          onChange={(e) => handleChange(e.target.value)}
          placeholder="버튼 텍스트를 입력하세요"
        />
      </div>
    </div>
  );
};