@colisweb/rescript-toolkit 2.9.0-mobile → 2.10.1

package/lib/es6_global/src/ui/Toolkit__Ui_Modal.bs.js

@@ -1,145 +0,0 @@
-
-
-import * as Cx from "../../../../node_modules/rescript-classnames/lib/es6_global/src/Cx.bs.js";
-import * as Css from "../../../../node_modules/bs-css-emotion/lib/es6_global/src/Css.bs.js";
-import * as Curry from "../../../../node_modules/rescript/lib/es6/curry.js";
-import * as React from "react";
-import * as Belt_Option from "../../../../node_modules/rescript/lib/es6/belt_Option.js";
-import * as Dialog from "@reach/dialog";
-import * as ReachUi_Dialog from "../vendors/reach-ui/ReachUi_Dialog.bs.js";
-import * as Md from "react-icons/md";
-
-function sizeRule(size) {
-  var value = typeof size === "object" ? size.VAL : (
-      size === "md" ? 768 : (
-          size === "sm" ? 600 : (
-              size === "xs" ? 480 : 900
-            )
-        )
-    );
-  return Curry._1(Css.style, {
-              hd: Css.width(Css.pct(100)),
-              tl: {
-                hd: Css.important(Css.maxWidth(Css.px(value))),
-                tl: /* [] */0
-              }
-            });
-}
-
-function modalStyle(type_) {
-  if (typeof type_ !== "object") {
-    return "rounded";
-  }
-  var color = type_.VAL;
-  if (color === "primary") {
-    return "rounded-lg border-2 border-primary-500";
-  } else if (color === "danger") {
-    return "rounded-lg border-4 border-danger-700";
-  } else if (color === "success") {
-    return "rounded-lg border-2 border-success-500";
-  } else {
-    return "rounded-lg";
-  }
-}
-
-function headerStyle(type_) {
-  if (typeof type_ !== "object") {
-    return "";
-  }
-  var color = type_.VAL;
-  if (color === "primary") {
-    return "bg-primary-500 rounded-t";
-  } else if (color === "danger") {
-    return "bg-danger-700";
-  } else if (color === "success") {
-    return "bg-success-500 rounded-t";
-  } else {
-    return "bg-neutral-700 rounded-t-lg";
-  }
-}
-
-function titleStyle(type_) {
-  if (typeof type_ === "object") {
-    return "text-white";
-  } else {
-    return "w-full border-b border-info-500";
-  }
-}
-
-function closeIconStyle(type_) {
-  if (typeof type_ === "object") {
-    return "hover:bg-white hover:text-black text-white";
-  } else {
-    return "hover:bg-gray-200";
-  }
-}
-
-Curry._2(Css.$$global, "[data-reach-dialog-overlay]", {
-      hd: Css.important(Css.background(Css.rgba(74, 115, 120, {
-                    NAME: "num",
-                    VAL: 0.5
-                  }))),
-      tl: /* [] */0
-    });
-
-Curry._2(Css.$$global, "[data-reach-dialog-content]", {
-      hd: Css.important(Css.background(Css.transparent)),
-      tl: /* [] */0
-    });
-
-function Toolkit__Ui_Modal(Props) {
-  var isVisible = Props.isVisible;
-  var title = Props.title;
-  var body = Props.body;
-  var hide = Props.hide;
-  var sizeOpt = Props.size;
-  var type_Opt = Props.type_;
-  var footer = Props.footer;
-  var ariaLabelOpt = Props.ariaLabel;
-  var size = sizeOpt !== undefined ? sizeOpt : "md";
-  var type_ = type_Opt !== undefined ? type_Opt : "default";
-  var ariaLabel = ariaLabelOpt !== undefined ? ariaLabelOpt : "";
-  return React.createElement(Dialog.Dialog, ReachUi_Dialog.Dialog.makeProps(isVisible, hide, ariaLabel, undefined, undefined, sizeRule(size), React.createElement("div", {
-                      className: Cx.cx([
-                            "bg-white pb-5 z-40 shadow-lg w-full",
-                            modalStyle(type_)
-                          ])
-                    }, React.createElement("header", {
-                          className: Cx.cx([
-                                "flex items-center justify-between mb-4 pl-5 pr-3 pt-2 pb-1",
-                                headerStyle(type_)
-                              ])
-                        }, Belt_Option.mapWithDefault(title, null, (function (title) {
-                                return React.createElement("h2", {
-                                            className: Cx.cx([
-                                                  "text-2xl pb-1 font-display",
-                                                  titleStyle(type_)
-                                                ])
-                                          }, title);
-                              })), React.createElement("button", {
-                              className: Cx.cx([
-                                    Belt_Option.isSome(title) ? "ml-4" : "ml-auto",
-                                    "p-1 rounded-full modal-close-button",
-                                    closeIconStyle(type_)
-                                  ]),
-                              onClick: (function (param) {
-                                  return Curry._1(hide, undefined);
-                                })
-                            }, React.createElement(Md.MdClose, {
-                                  size: 28
-                                }))), React.createElement("div", {
-                          className: "px-1 sm:px-2 md:px-5"
-                        }, body), Belt_Option.mapWithDefault(footer, null, (function (footer) {
-                            return React.createElement("div", {
-                                        className: "flex flex-row justify-end mt-6 pr-4"
-                                      }, footer);
-                          }))), undefined));
-}
-
-var make = Toolkit__Ui_Modal;
-
-export {
-  make ,
-  
-}
-/*  Not a pure module */

package/lib/es6_global/src/ui/Toolkit__Ui_MultiSelect.bs.js

@@ -1,157 +0,0 @@
-
-
-import * as Cx from "../../../../node_modules/rescript-classnames/lib/es6_global/src/Cx.bs.js";
-import * as Curry from "../../../../node_modules/rescript/lib/es6/curry.js";
-import * as React from "react";
-import * as Belt_Array from "../../../../node_modules/rescript/lib/es6/belt_Array.js";
-import * as Belt_Option from "../../../../node_modules/rescript/lib/es6/belt_Option.js";
-import * as Toolkit__Hooks from "../hooks/Toolkit__Hooks.bs.js";
-import * as Fa from "react-icons/fa";
-import * as Toolkit__Ui_Checkbox from "./Toolkit__Ui_Checkbox.bs.js";
-import * as Toolkit__Ui_Dropdown from "./Toolkit__Ui_Dropdown.bs.js";
-import * as Toolkit__Ui_TextInput from "./Toolkit__Ui_TextInput.bs.js";
-
-function Toolkit__Ui_MultiSelect(Props) {
-  var options = Props.options;
-  var placeholder = Props.placeholder;
-  var buttonClassNameOpt = Props.buttonClassName;
-  var dropdownClassNameOpt = Props.dropdownClassName;
-  var itemClassNameOpt = Props.itemClassName;
-  var searchPlaceholder = Props.searchPlaceholder;
-  var allowFilterOpt = Props.allowFilter;
-  var defaultValueOpt = Props.defaultValue;
-  var onChange = Props.onChange;
-  var buttonClassName = buttonClassNameOpt !== undefined ? buttonClassNameOpt : "";
-  var dropdownClassName = dropdownClassNameOpt !== undefined ? dropdownClassNameOpt : "";
-  var itemClassName = itemClassNameOpt !== undefined ? itemClassNameOpt : "";
-  var allowFilter = allowFilterOpt !== undefined ? allowFilterOpt : true;
-  var defaultValue = defaultValueOpt !== undefined ? defaultValueOpt : [];
-  var match = React.useState(function () {
-        return defaultValue;
-      });
-  var setSelectedOptions = match[1];
-  var selectedOptions = match[0];
-  var previousDefaultValue = Toolkit__Hooks.usePrevious(defaultValue);
-  var match$1 = React.useState(function () {
-        return "";
-      });
-  var setSearch = match$1[1];
-  var search = match$1[0];
-  React.useEffect((function () {
-          var prev = Belt_Array.map(Belt_Option.getWithDefault(previousDefaultValue, []), (function (param) {
-                    return param.value;
-                  })).join("");
-          var $$new = Belt_Array.map(defaultValue, (function (param) {
-                    return param.value;
-                  })).join("");
-          if (prev !== $$new) {
-            Curry._1(setSelectedOptions, (function (param) {
-                    return defaultValue;
-                  }));
-          }
-          
-        }), [
-        previousDefaultValue,
-        defaultValue
-      ]);
-  var tmp;
-  if (allowFilter) {
-    var tmp$1 = {
-      id: "search",
-      onChange: (function ($$event) {
-          var target = $$event.currentTarget;
-          return Curry._1(setSearch, (function (param) {
-                        return target.value.toLowerCase();
-                      }));
-        })
-    };
-    if (searchPlaceholder !== undefined) {
-      tmp$1.placeholder = searchPlaceholder;
-    }
-    tmp = React.createElement("div", {
-          className: "mb-3"
-        }, React.createElement(Toolkit__Ui_TextInput.make, tmp$1));
-  } else {
-    tmp = null;
-  }
-  return React.createElement(Toolkit__Ui_Dropdown.make, {
-              label: selectedOptions.length !== 0 ? React.createElement("div", {
-                      className: "table table-fixed w-full",
-                      title: Belt_Array.map(selectedOptions, (function (param) {
-                                return param.label;
-                              })).join(", ")
-                    }, React.createElement("span", {
-                          className: "table-cell truncate text-left"
-                        }, Belt_Array.map(selectedOptions, (function (param) {
-                                  return param.label;
-                                })).join(", "))) : React.createElement("p", {
-                      className: "flex flex-row gap-2 w-full items-center"
-                    }, React.createElement("span", {
-                          className: "ml-1"
-                        }, placeholder), React.createElement("span", {
-                          className: "absolute inset-y-0 right-0 flex items-center px-2"
-                        }, React.createElement(Fa.FaAngleDown, {}))),
-              children: React.createElement("div", {
-                    className: "py-2 pl-2 pr-1"
-                  }, tmp, Belt_Array.map(Belt_Array.keep(options, (function (param) {
-                              if (search === "") {
-                                return true;
-                              } else {
-                                return param.label.toLowerCase().includes(search);
-                              }
-                            })), (function (item) {
-                          var value = item.value;
-                          var label = item.label;
-                          return React.createElement("div", {
-                                      key: label,
-                                      className: Cx.cx([
-                                            "flex flex-row items-center gap-2 mt-3 pt-3 text-left",
-                                            itemClassName
-                                          ])
-                                    }, React.createElement(Toolkit__Ui_Checkbox.make, {
-                                          value: value,
-                                          children: item.itemLabel,
-                                          onChange: (function (checked, _value) {
-                                              if (checked) {
-                                                return Curry._1(setSelectedOptions, (function (selectedOptions) {
-                                                              var value = Belt_Array.concat(selectedOptions, [item]);
-                                                              Curry._1(onChange, value);
-                                                              return value;
-                                                            }));
-                                              } else {
-                                                return Curry._1(setSelectedOptions, (function (selectedOptions) {
-                                                              var value$1 = Belt_Array.keep(selectedOptions, (function (selectedItem) {
-                                                                      if (selectedItem.value !== value) {
-                                                                        return selectedItem.label !== label;
-                                                                      } else {
-                                                                        return false;
-                                                                      }
-                                                                    }));
-                                                              Curry._1(onChange, value$1);
-                                                              return value$1;
-                                                            }));
-                                              }
-                                            }),
-                                          checked: Belt_Array.some(selectedOptions, (function (item) {
-                                                  if (item.label === label) {
-                                                    return item.value === value;
-                                                  } else {
-                                                    return false;
-                                                  }
-                                                })),
-                                          className: "w-full flex-shrink-0"
-                                        }));
-                        }))),
-              dropdownClassName: dropdownClassName,
-              buttonClassName: buttonClassName,
-              position: "bottom"
-            });
-}
-
-var make = Toolkit__Ui_MultiSelect;
-
-export {
-  make ,
-  
-}
-/* react Not a pure module */

package/lib/es6_global/src/ui/Toolkit__Ui_NativeDatePicker.bs.js

@@ -1,56 +0,0 @@
-
-
-import * as Cx from "../../../../node_modules/rescript-classnames/lib/es6_global/src/Cx.bs.js";
-import * as Curry from "../../../../node_modules/rescript/lib/es6/curry.js";
-import * as React from "react";
-import * as DateFns from "date-fns";
-import * as Belt_Option from "../../../../node_modules/rescript/lib/es6/belt_Option.js";
-import * as Caml_option from "../../../../node_modules/rescript/lib/es6/caml_option.js";
-
-function Toolkit__Ui_NativeDatePicker(Props) {
-  var onChange = Props.onChange;
-  var value = Props.value;
-  var id = Props.id;
-  var disabledOpt = Props.disabled;
-  var isInvalidOpt = Props.isInvalid;
-  var classNameOpt = Props.className;
-  var disabled = disabledOpt !== undefined ? disabledOpt : false;
-  var isInvalid = isInvalidOpt !== undefined ? isInvalidOpt : false;
-  var className = classNameOpt !== undefined ? classNameOpt : "";
-  var tmp = {
-    "aria-disabled": disabled,
-    className: Cx.cx([
-          "h-[38px] border rounded transition-all duration-150 ease-in-out py-2 pl-4 pr-8 appearance-none w-full bg-white text-gray-800 leading-tight focus:outline-none focus:shadow-none focus:border-info-500 disabled:bg-gray-200 disabled:text-gray-700 focus:z30 relative border-gray-300",
-          isInvalid ? "border-danger-500 shadow-danger-500" : "border-gray-300",
-          className
-        ]),
-    disabled: disabled,
-    type: "date",
-    onChange: (function ($$event) {
-        var value = $$event.target.value;
-        return Curry._1(onChange, Belt_Option.keep(Caml_option.some(new Date(value)), (function (prim) {
-                          return DateFns.isValid(prim);
-                        })));
-      })
-  };
-  if (id !== undefined) {
-    tmp.id = Caml_option.valFromOption(id);
-  }
-  var tmp$1 = Belt_Option.map(value, (function (d) {
-          return DateFns.format(d, "yyyy-MM-dd");
-        }));
-  if (tmp$1 !== undefined) {
-    tmp.value = Caml_option.valFromOption(tmp$1);
-  }
-  return React.createElement("div", {
-              className: "relative"
-            }, React.createElement("input", tmp));
-}
-
-var make = Toolkit__Ui_NativeDatePicker;
-
-export {
-  make ,
-  
-}
-/* react Not a pure module */

package/lib/es6_global/src/ui/Toolkit__Ui_Notice.bs.js

@@ -1,145 +0,0 @@
-
-
-import * as Cx from "../../../../node_modules/rescript-classnames/lib/es6_global/src/Cx.bs.js";
-import * as Curry from "../../../../node_modules/rescript/lib/es6/curry.js";
-import * as React from "react";
-import * as Browser from "../vendors/Browser.bs.js";
-import * as Belt_Option from "../../../../node_modules/rescript/lib/es6/belt_Option.js";
-import * as Caml_option from "../../../../node_modules/rescript/lib/es6/caml_option.js";
-
-function Toolkit__Ui_Notice(Props) {
-  var baseElementRef = Props.baseElementRef;
-  var classNameOpt = Props.className;
-  var visible = Props.visible;
-  var children = Props.children;
-  var className = classNameOpt !== undefined ? classNameOpt : "";
-  var match = React.useState(function () {
-        return false;
-      });
-  var setVisibility = match[1];
-  var visibility = match[0];
-  var match$1 = React.useState(function () {
-        return "";
-      });
-  var setCustomClassName = match$1[1];
-  var match$2 = React.useState(function () {
-        return false;
-      });
-  var setElementReady = match$2[1];
-  var elementReady = match$2[0];
-  var match$3 = React.useState(function () {
-        
-      });
-  var setStyle = match$3[1];
-  var noticeRef = React.useRef(null);
-  React.useEffect((function () {
-          var timeoutId = {
-            contents: undefined
-          };
-          Belt_Option.forEach(Caml_option.nullable_to_opt(baseElementRef.current), (function (dom) {
-                  var match = Browser.DomElement.getBoundingClientRect(dom);
-                  var height = match.height;
-                  var width = match.width;
-                  var y = match.y;
-                  var x = match.x;
-                  if (visible) {
-                    Curry._1(setVisibility, (function (param) {
-                            return true;
-                          }));
-                    return Curry._1(setStyle, (function (param) {
-                                  Curry._1(setElementReady, (function (param) {
-                                          return true;
-                                        }));
-                                  return {
-                                          left: (x + width / 2).toString() + "px",
-                                          top: (y + height).toString() + "px"
-                                        };
-                                }));
-                  } else {
-                    timeoutId.contents = Caml_option.some(setTimeout((function (param) {
-                                Curry._1(setElementReady, (function (param) {
-                                        return false;
-                                      }));
-                                return Curry._1(setVisibility, (function (param) {
-                                              return visible;
-                                            }));
-                              }), 500));
-                    return Curry._1(setCustomClassName, (function (param) {
-                                  return "opacity-0";
-                                }));
-                  }
-                }));
-          return (function (param) {
-                    return Belt_Option.forEach(timeoutId.contents, (function (prim) {
-                                  clearTimeout(prim);
-                                  
-                                }));
-                  });
-        }), [
-        baseElementRef,
-        visible
-      ]);
-  React.useEffect((function () {
-          var timeoutId = {
-            contents: undefined
-          };
-          if (elementReady) {
-            timeoutId.contents = Caml_option.some(setTimeout((function (param) {
-                        return Curry._1(setCustomClassName, (function (param) {
-                                      return "!opacity-100";
-                                    }));
-                      }), 150));
-          }
-          return (function (param) {
-                    return Belt_Option.forEach(timeoutId.contents, (function (prim) {
-                                  clearTimeout(prim);
-                                  
-                                }));
-                  });
-        }), [elementReady]);
-  React.useEffect((function () {
-          if (visibility) {
-            Belt_Option.forEach(Caml_option.nullable_to_opt(noticeRef.current), (function (dom) {
-                    var match = Browser.DomElement.getBoundingClientRect(dom);
-                    var right = match.right;
-                    var left = match.left;
-                    return Curry._1(setStyle, (function (style) {
-                                  return Belt_Option.map(style, (function (style) {
-                                                return Object.assign({}, style, {
-                                                            marginRight: right < 0 ? (-right).toString() + "px" : "",
-                                                            marginLeft: left < 0 ? (-left).toString() + "px" : ""
-                                                          });
-                                              }));
-                                }));
-                  }));
-          }
-          
-        }), [
-        visibility,
-        noticeRef
-      ]);
-  if (!visibility) {
-    return null;
-  }
-  var tmp = {
-    ref: noticeRef,
-    className: Cx.cx([
-          "absolute rounded mt-2 p-2 transform -translate-x-1/2 z-30 opacity-0 transition-all ease-in-out duration-300",
-          className,
-          match$1[0]
-        ])
-  };
-  var tmp$1 = match$3[0];
-  if (tmp$1 !== undefined) {
-    tmp.style = Caml_option.valFromOption(tmp$1);
-  }
-  return React.createElement("div", tmp, children);
-}
-
-var make = Toolkit__Ui_Notice;
-
-export {
-  make ,
-  
-}
-/* react Not a pure module */

package/lib/es6_global/src/ui/Toolkit__Ui_ProgressBar.bs.js

@@ -1,39 +0,0 @@
-
-
-import * as Cx from "../../../../node_modules/rescript-classnames/lib/es6_global/src/Cx.bs.js";
-import * as Css from "../../../../node_modules/bs-css-emotion/lib/es6_global/src/Css.bs.js";
-import * as Curry from "../../../../node_modules/rescript/lib/es6/curry.js";
-import * as React from "react";
-
-function Toolkit__Ui_ProgressBar(Props) {
-  var progression = Props.progression;
-  var colorOpt = Props.color;
-  var color = colorOpt !== undefined ? colorOpt : "success";
-  return React.createElement("div", {
-              className: "flex flex-row w-full h-2 bg-neutral-300 rounded-lg"
-            }, React.createElement("div", {
-                  className: Cx.cx([
-                        "h-full rounded-lg",
-                        color === "warning" ? "bg-warning-500" : (
-                            color === "danger" ? "bg-danger-500" : (
-                                color === "success" ? "bg-success-500" : "bg-info-500"
-                              )
-                          ),
-                        Curry._1(Css.style, {
-                              hd: Css.width({
-                                    NAME: "percent",
-                                    VAL: progression
-                                  }),
-                              tl: /* [] */0
-                            })
-                      ])
-                }));
-}
-
-var make = Toolkit__Ui_ProgressBar;
-
-export {
-  make ,
-  
-}
-/* Css Not a pure module */

package/lib/es6_global/src/ui/Toolkit__Ui_Radio.bs.js

@@ -1,110 +0,0 @@
-
-
-import * as Cx from "../../../../node_modules/rescript-classnames/lib/es6_global/src/Cx.bs.js";
-import * as Css from "../../../../node_modules/bs-css-emotion/lib/es6_global/src/Css.bs.js";
-import * as Curry from "../../../../node_modules/rescript/lib/es6/curry.js";
-import * as React from "react";
-import * as Belt_Option from "../../../../node_modules/rescript/lib/es6/belt_Option.js";
-import * as Caml_option from "../../../../node_modules/rescript/lib/es6/caml_option.js";
-import * as Go from "react-icons/go";
-
-var label = Curry._1(Css.style, {
-      hd: Css.selector("& > input + .checkmark", {
-            hd: Css.backgroundColor(Css.hex("fff")),
-            tl: /* [] */0
-          }),
-      tl: {
-        hd: Css.selector("& > input:focus + .checkmark", {
-              hd: Css.unsafe("boxShadow", "0px 0px 4px #15CBE3"),
-              tl: /* [] */0
-            }),
-        tl: {
-          hd: Css.selector("& > input:checked + .checkmark", {
-                hd: Css.backgroundColor(Css.hex("15cbe3")),
-                tl: {
-                  hd: Css.borderColor(Css.hex("15cbe3")),
-                  tl: /* [] */0
-                }
-              }),
-          tl: {
-            hd: Css.selector("& > input + .checkmark > *", {
-                  hd: Css.opacity(0),
-                  tl: /* [] */0
-                }),
-            tl: {
-              hd: Css.selector("& > input:checked + .checkmark > *", {
-                    hd: Css.opacity(1),
-                    tl: /* [] */0
-                  }),
-              tl: /* [] */0
-            }
-          }
-        }
-      }
-    });
-
-function Toolkit__Ui_Radio(Props) {
-  var value = Props.value;
-  var children = Props.children;
-  var disabled = Props.disabled;
-  var onChange = Props.onChange;
-  var name = Props.name;
-  var checked = Props.checked;
-  var classNameOpt = Props.className;
-  var sizeOpt = Props.size;
-  var className = classNameOpt !== undefined ? classNameOpt : "";
-  var size = sizeOpt !== undefined ? sizeOpt : "sm";
-  var tmp = {
-    className: "opacity-0 w-0 h-0",
-    type: "radio",
-    value: value,
-    onChange: (function ($$event) {
-        var target = $$event.target;
-        var value = target.value;
-        return Belt_Option.forEach(onChange, (function (fn) {
-                      return Curry._1(fn, value);
-                    }));
-      })
-  };
-  if (checked !== undefined) {
-    tmp.checked = Caml_option.valFromOption(checked);
-  }
-  if (disabled !== undefined) {
-    tmp.disabled = Caml_option.valFromOption(disabled);
-  }
-  if (name !== undefined) {
-    tmp.name = Caml_option.valFromOption(name);
-  }
-  return React.createElement("label", {
-              className: Cx.cx([
-                    label,
-                    "flex items-center",
-                    Belt_Option.getWithDefault(disabled, false) ? "cursor-not-allowed opacity-75 text-gray-600" : "cursor-pointer",
-                    className
-                  ])
-            }, React.createElement("input", tmp), React.createElement("span", {
-                  className: Cx.cx([
-                        "checkmark rounded-full border text-white mr-3 border-neutral-300 transform transition-all ease-in-out flex items-center justify-center",
-                        size === "md" ? "w-8 h-8" : (
-                            size === "sm" ? "w-6 h-6" : (
-                                size === "xs" ? "w-4 h-4" : "w-10 h-10"
-                              )
-                          )
-                      ])
-                }, React.createElement(Go.GoPrimitiveDot, {
-                      size: size === "md" ? 24 : (
-                          size === "sm" ? 16 : (
-                              size === "xs" ? 12 : 32
-                            )
-                        ),
-                      className: "transform transition-all ease-in-out"
-                    })), Belt_Option.getWithDefault(children, null));
-}
-
-var make = Toolkit__Ui_Radio;
-
-export {
-  make ,
-  
-}
-/* label Not a pure module */