"use client";

import dynamic from "next/dynamic";

const MapPickerInner = dynamic(
  () => import("@/components/schools/MapPickerInner").then((mod) => mod.MapPickerInner),
  {
    ssr: false,
    loading: () => (
      <div className="flex h-72 items-center justify-center rounded-xl border border-[var(--border)] bg-slate-50 text-sm text-[var(--muted)]">
        در حال بارگذاری نقشه…
      </div>
    ),
  },
);

export function MapPicker({
  lat,
  lng,
  onChange,
  readOnly = false,
}: {
  lat: number | null;
  lng: number | null;
  onChange?: (lat: number, lng: number) => void;
  readOnly?: boolean;
}) {
  return (
    <MapPickerInner
      lat={lat}
      lng={lng}
      onChange={onChange ?? (() => undefined)}
      readOnly={readOnly}
    />
  );
}