Skip to content
This repository has been archived by the owner on Nov 1, 2021. It is now read-only.

Add functor to type CustomEvent.detail #203

Open
mununki opened this issue Sep 24, 2020 · 0 comments
Open

Add functor to type CustomEvent.detail #203

mununki opened this issue Sep 24, 2020 · 0 comments

Comments

@mununki
Copy link

mununki commented Sep 24, 2020

Hi, team.

I'm working on the CustomEvent to use the typed CustomEvent.detail whichever I want to generate and use. Because it is not clearly typed yet. So that I'd like to add a functor to generate a CustomEvent module with typed detail as below;

// Webapi__Dom__CustomEvent.re

type t = Dom.customEvent;

include Webapi__Dom__Event.Impl({
  type nonrec t = t;
});

[@bs.new] external make: string => t = "CustomEvent";
[@bs.new] external makeWithOptions: (string, Js.t({..})) => t = "CustomEvent";

// START of added functor
module MakeEmittedCustomEvent = (T: {type t;}) => {
  type t = Dom.customEvent;

  include Webapi__Dom__Event.Impl({
    type nonrec t = t;
  });

  [@bs.new] external make: string => t = "CustomEvent";
  [@bs.new]
  external makeWithOptions: (string, t) => t = "CustomEvent";
  [@bs.get] external detail: t => T.t = "detail";
};
// END of added functor

Example to use

module OnChangeDetail = {
  type t = {
    component: string,
    valueAsDate: Js.Date.t,
    value: string,
  };
};

module NewOnChangeEvent = Webapi.Dom.CustomEvent.MakeEmittedCustomEvent(OnChangeDetail);

---
onChange={e => {
  Js.log(e->Webapi.Dom.CustomEvent.preventDefault);  // still can use as before.
  Js.log(e->NewOnChangeEvent.preventDefault);  // can use from new CustomEvent
  Js.log2("make", NewOnChangeEvent.makeWithOptions("foo", bar)); // can make with options..
  Js.log(e->NewOnChangeEvent.detail.valueAsDate); // typed detail!
}}
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant