ReactDayPicker.re

module Modifier = {
  type t =
    | Date(Js.Date.t)
    | Range(Js.Date.t, Js.Date.t)
    | Fn(Js.Date.t => bool);

  let toJs =
    (. x) =>
      switch (x) {
      | Date(date) => date
      | Range(startDate, endDate) =>
        {"from": startDate, "to": endDate}->Obj.magic
      | Fn(fn) => fn->Obj.magic
      };
};

[@bs.module "react-day-picker"]
external reactClass: React.reactClass = "default";
let make =
    (
      ~initialMonth: option(Js.Date.t)=?,
      ~fromMonth: option(Js.Date.t)=?,
      ~numberOfMonths: option(int)=?,
      ~showOutsideDays: option(bool)=?,
      ~selectedDays: option(Modifier.t),
      ~modifiers: option(Js.Dict.t(Modifier.t))=?,
      ~classNames: option(Js.t({..}))=?,
      ~onDayClick:
         option(
           (Js.Date.t, Js.Dict.t(Modifier.t), ReactEvent.Mouse.t) => unit,
         )=?,
      ~onMonthChange: option(Js.Date.t => unit)=?,
      children,
    ) =>
  React.wrapJsForReason(
    ~reactClass,
    ~props={
      "initialMonth": initialMonth->Js.Nullable.fromOption,
      "fromMonth": fromMonth->Js.Nullable.fromOption,
      "numberOfMonths": numberOfMonths->Js.Nullable.fromOption,
      "showOutsideDays": showOutsideDays->Js.Nullable.fromOption,
      "selectedDays":
        selectedDays
        ->Option.map(x => Modifier.toJs(. x))
        ->Js.Nullable.fromOption,
      "modifiers":
        modifiers
        ->Option.map(x => x->Js.Dict.map(Modifier.toJs, _))
        ->Js.Nullable.fromOption,
      "classNames": classNames->Js.Nullable.fromOption,
      "onDayClick": onDayClick->Js.Nullable.fromOption,
      "onMonthChange": onMonthChange->Js.Nullable.fromOption,
    },
    children,
  );