tyxml icon indicating copy to clipboard operation
tyxml copied to clipboard

JSX: disabled should accept true/false instead of `unit`

Open thangngoc89 opened this issue 2 years ago • 1 comments

Given this code:

<button disabled={()}> "my button" </button>

To have a button that isn't disabled, I have to duplicate the code logic or use pure function syntax instead of doing it directly in JSX syntax.


Update: This is a very awkward Button component that were written to allow this:

module Button = {
  open Tyxml.Html;
  let createElement = (~title=?, ~cls=?, ~disabled=?, ~children, ()) => {
    let a = {
      let or_append = (value, cb, attrs) => {
        switch (value) {
        | None => attrs
        | Some(value) => [cb(value), ...attrs]
        };
      };
      let attrs = [];
      let attrs =
        attrs
        |> or_append(title, title => a_title(title))
        |> or_append(cls, cls => a_class(cls));
      let attrs =
        switch (disabled) {
        | Some(true) => [a_disabled(), ...attrs]
        | Some(false)
        | None => attrs
        };
      attrs;
    };
    button(~a, children);
  };
};

thangngoc89 avatar Jul 22 '21 16:07 thangngoc89

I agree this is quite inconvenient, but I'm not sure I have a satisfying solution.

We could turn all the unit taking attributes into boolean ones. This is a slight departure from the spec, but maybe a reasonable one.

Drup avatar Feb 10 '22 10:02 Drup