"use client";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import * as React from "react";
import Input from "jt-design-system/es/input";
import Textarea from "jt-design-system/es/textarea";
import Button from "jt-design-system/es/button";
import Checkbox from "jt-design-system/es/checkbox";
import CheckIcon from "jt-design-system/es/icons/check";
import css from "./editable-map.module.css";
export default function MarkerForm({ popupRef, marker, setMarkers }) {
    const [draft, setDraft] = React.useState(marker);
    React.useEffect(() => {
        setDraft(marker);
    }, [marker]);
    const update = (field) => (value) => setDraft((current) => ({ ...current, [field]: value }));
    const submit = () => {
        setMarkers((current) => current.map((item) => (item.id === draft.id ? draft : item)));
        popupRef.current?.close();
    };
    return (_jsxs("div", { className: css.form, children: [_jsx(Input, { label: "Titre", value: draft.title, onValueChange: update("title"), compact: true }), _jsx(Textarea, { label: "Description", value: draft.description, className: css.formDescription, placeholder: "Description du point d'int\u00E9r\u00EAt", onValueChange: update("description"), compact: true }), _jsxs("div", { className: css.formRow, children: [_jsx(Input, { label: "Image", value: draft.image || "", placeholder: "/static/images/\u2026", onValueChange: update("image"), compact: true }), _jsx(Button, { variant: "secondary", onClick: () => window.openEdenFileManager?.({ onSelect: update("image") }), compact: true, children: "Choisir" })] }), _jsxs("div", { className: css.formRow, children: [_jsx(Input, { label: "Lien bouton", value: draft.url, onValueChange: update("url"), compact: true }), _jsx(Input, { label: "Libell\u00E9 bouton", value: draft.label, onValueChange: update("label"), compact: true })] }), _jsx(Checkbox, { label: "Important", checked: Boolean(draft.important), onCheckedChange: update("important") }), _jsx(Checkbox, { label: "Tooltip affich\u00E9 par d\u00E9faut", checked: draft.tooltipOpened, onCheckedChange: update("tooltipOpened") }), _jsx(Input, { label: "Sur-titre (pour les groupes)", value: draft.groupTitle || "", onValueChange: update("groupTitle"), compact: true }), _jsx("div", { className: css.formButtons, children: _jsxs(Button, { variant: "success", onClick: submit, compact: true, children: ["Valider", _jsx(CheckIcon, {})] }) })] }));
}
