GenType variants example

entry.js

import * as ReactDOM from "react-dom";
import * as React from "react";

import SidebarNavLink, {imagesIcon} from "./SidebarNavLink.gen";

const Main = () => (
  <div>
    <SidebarNavLink navLinkIcon={imagesIcon}  />
  </div>
);

ReactDOM.render(React.createElement(Main), document.getElementById("index"));

SidebarNavLink.bs.js

// Generated by BUCKLESCRIPT VERSION 4.0.18, PLEASE EDIT WITH CARE

import * as React from "react";
import * as ReasonReact from "reason-react/src/ReasonReact.js";

var component = ReasonReact.statelessComponent("SidebarNavLink");

function s(prim) {
  return prim;
}

function make($staropt$star, _children) {
  var navLinkIcon = $staropt$star !== undefined ? $staropt$star : /* PaletteIcon */-1046702220;
  return /* record */[
          /* debugName */component[/* debugName */0],
          /* reactClassInternal */component[/* reactClassInternal */1],
          /* handedOffState */component[/* handedOffState */2],
          /* willReceiveProps */component[/* willReceiveProps */3],
          /* didMount */component[/* didMount */4],
          /* didUpdate */component[/* didUpdate */5],
          /* willUnmount */component[/* willUnmount */6],
          /* willUpdate */component[/* willUpdate */7],
          /* shouldUpdate */component[/* shouldUpdate */8],
          /* render */(function (param) {
              var icon = navLinkIcon !== -688774031 ? (
                  navLinkIcon >= 572644669 ? React.createElement("div", undefined, "FontsIcon svg") : React.createElement("div", undefined, "PaletteIcon svg")
                ) : React.createElement("div", undefined, "ImagesIcon svg");
              return React.createElement("div", undefined, icon);
            }),
          /* initialState */component[/* initialState */10],
          /* retainedProps */component[/* retainedProps */11],
          /* reducer */component[/* reducer */12],
          /* jsElementWrapped */component[/* jsElementWrapped */13]
        ];
}

var paletteIcon = /* PaletteIcon */-1046702220;

var imagesIcon = /* ImagesIcon */-688774031;

var fontsIcon = /* FontsIcon */572644669;

export {
  component ,
  s ,
  paletteIcon ,
  imagesIcon ,
  fontsIcon ,
  make ,
  
}
/* component Not a pure module */

SidebarNavLink.gen.js

/* Untyped file generated by genType. */

const $$toRE961545587 = {"FontsIcon": 572644669, "ImagesIcon": -688774031, "PaletteIcon": -1046702220};

import * as Curry from 'bs-platform/lib/es6/curry.js';

import * as ReasonReact from 'reason-react/src/ReasonReact.js';

import * as SidebarNavLinkBS from './SidebarNavLink.bs';

export const paletteIcon = "PaletteIcon";

export const imagesIcon = "ImagesIcon";

export const fontsIcon = "FontsIcon";

export const SidebarNavLink = ReasonReact.wrapReasonForJs(
  SidebarNavLinkBS.component,
  (function _(jsProps) {
     return Curry._2(SidebarNavLinkBS.make, (jsProps.navLinkIcon == null ? undefined : $$toRE961545587[jsProps.navLinkIcon]), jsProps.children);
  }));

export default SidebarNavLink;

SidebarNavLink.re

let component = ReasonReact.statelessComponent("SidebarNavLink");

let s = ReasonReact.string;
[@genType]
type navLinkIcon = [ | `PaletteIcon | `ImagesIcon | `FontsIcon];

[@genType]
let paletteIcon= `PaletteIcon;

[@genType]
let imagesIcon= `ImagesIcon;

[@genType]
let fontsIcon= `FontsIcon;

[@genType]
let make = (~navLinkIcon=paletteIcon, _children) => {
  ...component,
  render: _ => {
    let icon =
      switch (navLinkIcon) {
      | `PaletteIcon => <div> "PaletteIcon svg"->s </div>
      | `ImagesIcon => <div> "ImagesIcon svg"->s </div>
      | `FontsIcon => <div> "FontsIcon svg"->s </div>
      };

    <div> icon </div>;
  },
};