@colisweb/rescript-toolkit 2.8.2 → 2.9.0-mobile

package/lib/es6_global/stories/Toolkit__Ui_ButtonStory.bs.js

@@ -0,0 +1,497 @@
+
+
+import * as React from "react";
+import * as Js_dict from "../../../node_modules/rescript/lib/es6/js_dict.js";
+import * as Storybook from "./Storybook.bs.js";
+import * as Belt_Array from "../../../node_modules/rescript/lib/es6/belt_Array.js";
+import * as Toolkit__Ui_Button from "../src/ui/Toolkit__Ui_Button.bs.js";
+import * as Blocks from "@storybook/addon-docs/blocks";
+import Toolkit__Ui_ButtonResi from "!!raw-loader!../../../src/ui/Toolkit__Ui_Button.resi";
+
+var $$default = Storybook.CSF.make("Components/Button", undefined, undefined, undefined, undefined, undefined, undefined);
+
+function defaultPalette(param) {
+  var colors = Js_dict.fromArray([
+        [
+          "primary",
+          "primary"
+        ],
+        [
+          "black",
+          "black"
+        ],
+        [
+          "white",
+          "white"
+        ],
+        [
+          "gray",
+          "gray"
+        ],
+        [
+          "success",
+          "success"
+        ],
+        [
+          "info",
+          "info"
+        ],
+        [
+          "danger",
+          "danger"
+        ],
+        [
+          "warning",
+          "warning"
+        ],
+        [
+          "neutral",
+          "neutral"
+        ],
+        [
+          "neutralLight",
+          "neutralLight"
+        ]
+      ]);
+  var sizes = Js_dict.fromArray([
+        [
+          "xs",
+          "xs"
+        ],
+        [
+          "sm",
+          "sm"
+        ],
+        [
+          "md",
+          "md"
+        ],
+        [
+          "lg",
+          "lg"
+        ]
+      ]);
+  return React.createElement("div", undefined, Belt_Array.mapWithIndex(Js_dict.entries(colors), (function (i, param) {
+                    var color = param[1];
+                    var colorText = param[0];
+                    return React.createElement("div", {
+                                key: String(i) + colorText,
+                                className: "flex flex-row flex-col-gap-4 mb-4 items-center"
+                              }, React.createElement("strong", {
+                                    className: "w-40"
+                                  }, colorText), React.createElement("div", {
+                                    className: "flex flex-col"
+                                  }, Belt_Array.mapWithIndex([
+                                        false,
+                                        true
+                                      ], (function (j, disabled) {
+                                          return React.createElement("div", {
+                                                      className: "flex items-center flex-col-gap-1 mb-2"
+                                                    }, Belt_Array.mapWithIndex(Js_dict.entries(sizes), (function (k, param) {
+                                                            return React.createElement("div", {
+                                                                        key: String((i + j | 0) + k | 0) + (colorText + param[0])
+                                                                      }, React.createElement(Toolkit__Ui_Button.make, {
+                                                                            size: param[1],
+                                                                            color: color,
+                                                                            disabled: disabled,
+                                                                            children: "hello"
+                                                                          }));
+                                                          })));
+                                        }))));
+                  })));
+}
+
+Storybook.CSF.addMeta(defaultPalette, "default palette", undefined, {
+      docs: {
+        page: (function (param) {
+            return React.createElement(React.Fragment, undefined, React.createElement(Blocks.Title, {}), React.createElement(Storybook.CodeBlock.make, {
+                            children: Toolkit__Ui_ButtonResi
+                          }), React.createElement(Blocks.Source, {
+                            language: "rescript",
+                            code: "\n            <Button variant=#default>\"Content\"->React.string</Button>\n          "
+                          }));
+          })
+      }
+    }, undefined);
+
+function pillPalette(param) {
+  var colors = Js_dict.fromArray([
+        [
+          "primary",
+          "primary"
+        ],
+        [
+          "black",
+          "black"
+        ],
+        [
+          "white",
+          "white"
+        ],
+        [
+          "gray",
+          "gray"
+        ],
+        [
+          "success",
+          "success"
+        ],
+        [
+          "info",
+          "info"
+        ],
+        [
+          "danger",
+          "danger"
+        ],
+        [
+          "warning",
+          "warning"
+        ],
+        [
+          "neutral",
+          "neutral"
+        ],
+        [
+          "neutralLight",
+          "neutralLight"
+        ]
+      ]);
+  var sizes = Js_dict.fromArray([
+        [
+          "xs",
+          "xs"
+        ],
+        [
+          "sm",
+          "sm"
+        ],
+        [
+          "md",
+          "md"
+        ],
+        [
+          "lg",
+          "lg"
+        ]
+      ]);
+  return React.createElement("div", undefined, Belt_Array.mapWithIndex(Js_dict.entries(colors), (function (i, param) {
+                    var color = param[1];
+                    var colorText = param[0];
+                    return React.createElement("div", {
+                                key: String(i) + colorText,
+                                className: "flex flex-row flex-col-gap-4 mb-4 items-center"
+                              }, React.createElement("strong", {
+                                    className: "w-40"
+                                  }, colorText), React.createElement("div", {
+                                    className: "flex flex-col"
+                                  }, Belt_Array.mapWithIndex([
+                                        false,
+                                        true
+                                      ], (function (j, disabled) {
+                                          return React.createElement("div", {
+                                                      className: "flex items-center flex-col-gap-1 mb-2"
+                                                    }, Belt_Array.mapWithIndex(Js_dict.entries(sizes), (function (k, param) {
+                                                            return React.createElement("div", {
+                                                                        key: String((i + j | 0) + k | 0) + (colorText + param[0])
+                                                                      }, React.createElement(Toolkit__Ui_Button.make, {
+                                                                            size: param[1],
+                                                                            color: color,
+                                                                            variant: "pill",
+                                                                            disabled: disabled,
+                                                                            children: "hello"
+                                                                          }));
+                                                          })));
+                                        }))));
+                  })));
+}
+
+Storybook.CSF.addMeta(pillPalette, "pill palette", undefined, {
+      docs: {
+        page: (function (param) {
+            return React.createElement(React.Fragment, undefined, React.createElement(Blocks.Title, {}), React.createElement(Storybook.CodeBlock.make, {
+                            children: Toolkit__Ui_ButtonResi
+                          }), React.createElement(Blocks.Source, {
+                            language: "rescript",
+                            code: "\n            <Button variant=#pill>\"Content\"->React.string</Button>\n          "
+                          }));
+          })
+      }
+    }, undefined);
+
+function outlinePalette(param) {
+  var colors = Js_dict.fromArray([
+        [
+          "primary",
+          "primary"
+        ],
+        [
+          "black",
+          "black"
+        ],
+        [
+          "white",
+          "white"
+        ],
+        [
+          "gray",
+          "gray"
+        ],
+        [
+          "success",
+          "success"
+        ],
+        [
+          "info",
+          "info"
+        ],
+        [
+          "danger",
+          "danger"
+        ],
+        [
+          "warning",
+          "warning"
+        ],
+        [
+          "neutral",
+          "neutral"
+        ],
+        [
+          "neutralLight",
+          "neutralLight"
+        ]
+      ]);
+  var sizes = Js_dict.fromArray([
+        [
+          "xs",
+          "xs"
+        ],
+        [
+          "sm",
+          "sm"
+        ],
+        [
+          "md",
+          "md"
+        ],
+        [
+          "lg",
+          "lg"
+        ]
+      ]);
+  return React.createElement("div", undefined, Belt_Array.mapWithIndex(Js_dict.entries(colors), (function (i, param) {
+                    var color = param[1];
+                    var colorText = param[0];
+                    return React.createElement("div", {
+                                key: String(i) + colorText,
+                                className: "flex flex-row flex-col-gap-4 mb-4 items-center"
+                              }, React.createElement("strong", {
+                                    className: "w-40"
+                                  }, colorText), React.createElement("div", {
+                                    className: "flex flex-col"
+                                  }, Belt_Array.mapWithIndex([
+                                        false,
+                                        true
+                                      ], (function (j, disabled) {
+                                          return React.createElement("div", {
+                                                      className: "flex items-center flex-col-gap-1 mb-2"
+                                                    }, Belt_Array.mapWithIndex(Js_dict.entries(sizes), (function (k, param) {
+                                                            return React.createElement("div", {
+                                                                        key: String((i + j | 0) + k | 0) + (colorText + param[0])
+                                                                      }, React.createElement(Toolkit__Ui_Button.make, {
+                                                                            size: param[1],
+                                                                            color: color,
+                                                                            variant: "outline",
+                                                                            disabled: disabled,
+                                                                            children: "hello"
+                                                                          }));
+                                                          })));
+                                        }))));
+                  })));
+}
+
+Storybook.CSF.addMeta(outlinePalette, "outline palette", undefined, {
+      docs: {
+        page: (function (param) {
+            return React.createElement(React.Fragment, undefined, React.createElement(Blocks.Title, {}), React.createElement(Storybook.CodeBlock.make, {
+                            children: Toolkit__Ui_ButtonResi
+                          }), React.createElement(Blocks.Source, {
+                            language: "rescript",
+                            code: "\n            <Button color=#primary variant=#outline>\"Content\"->React.string</Button>\n          "
+                          }), React.createElement(Toolkit__Ui_Button.make, {
+                            color: "primary",
+                            variant: "outline",
+                            children: "hello"
+                          }));
+          })
+      }
+    }, undefined);
+
+function textPalette(param) {
+  var colors = Js_dict.fromArray([
+        [
+          "primary",
+          "primary"
+        ],
+        [
+          "black",
+          "black"
+        ],
+        [
+          "white",
+          "white"
+        ],
+        [
+          "gray",
+          "gray"
+        ],
+        [
+          "success",
+          "success"
+        ],
+        [
+          "info",
+          "info"
+        ],
+        [
+          "danger",
+          "danger"
+        ],
+        [
+          "warning",
+          "warning"
+        ],
+        [
+          "neutral",
+          "neutral"
+        ],
+        [
+          "neutralLight",
+          "neutralLight"
+        ]
+      ]);
+  var sizes = Js_dict.fromArray([
+        [
+          "xs",
+          "xs"
+        ],
+        [
+          "sm",
+          "sm"
+        ],
+        [
+          "md",
+          "md"
+        ],
+        [
+          "lg",
+          "lg"
+        ]
+      ]);
+  return React.createElement("div", undefined, Belt_Array.mapWithIndex(Js_dict.entries(colors), (function (i, param) {
+                    var color = param[1];
+                    var colorText = param[0];
+                    return React.createElement("div", {
+                                key: String(i) + colorText,
+                                className: "flex flex-row flex-col-gap-4 mb-4 items-center"
+                              }, React.createElement("strong", {
+                                    className: "w-40"
+                                  }, colorText), React.createElement("div", {
+                                    className: "flex flex-col"
+                                  }, Belt_Array.mapWithIndex([
+                                        false,
+                                        true
+                                      ], (function (j, disabled) {
+                                          return React.createElement("div", {
+                                                      className: "flex items-center flex-col-gap-1 mb-2"
+                                                    }, Belt_Array.mapWithIndex(Js_dict.entries(sizes), (function (k, param) {
+                                                            return React.createElement("div", {
+                                                                        key: String((i + j | 0) + k | 0) + (colorText + param[0])
+                                                                      }, React.createElement(Toolkit__Ui_Button.make, {
+                                                                            size: param[1],
+                                                                            color: color,
+                                                                            variant: "text",
+                                                                            disabled: disabled,
+                                                                            children: "hello"
+                                                                          }));
+                                                          })));
+                                        }))));
+                  })));
+}
+
+Storybook.CSF.addMeta(textPalette, "text palette", undefined, {
+      docs: {
+        page: (function (param) {
+            return React.createElement(React.Fragment, undefined, React.createElement(Blocks.Title, {}), React.createElement(Storybook.CodeBlock.make, {
+                            children: Toolkit__Ui_ButtonResi
+                          }), React.createElement(Blocks.Source, {
+                            language: "rescript",
+                            code: "\n            <Button color=#primary variant=#text>\"Content\"->React.string</Button>\n          "
+                          }), React.createElement(Toolkit__Ui_Button.make, {
+                            color: "primary",
+                            variant: "text",
+                            children: "hello"
+                          }));
+          })
+      }
+    }, undefined);
+
+function loading(param) {
+  return React.createElement(Toolkit__Ui_Button.make, {
+              color: "primary",
+              isLoading: true,
+              children: "content"
+            });
+}
+
+Storybook.CSF.addMeta(loading, "loading", undefined, {
+      docs: {
+        page: (function (param) {
+            return React.createElement(React.Fragment, undefined, React.createElement(Blocks.Title, {}), React.createElement(Storybook.CodeBlock.make, {
+                            children: Toolkit__Ui_ButtonResi
+                          }), React.createElement(Blocks.Source, {
+                            language: "rescript",
+                            code: "\n            <Button color=#primary isLoading=true>\"Content\"->React.string</Button>\n          "
+                          }), React.createElement(Blocks.Story, {
+                            id: "components-button--loading"
+                          }));
+          })
+      }
+    }, undefined);
+
+function disabled(param) {
+  return React.createElement(Toolkit__Ui_Button.make, {
+              color: "primary",
+              disabled: true,
+              children: "content"
+            });
+}
+
+Storybook.CSF.addMeta(disabled, "disabled", undefined, {
+      docs: {
+        page: (function (param) {
+            return React.createElement(React.Fragment, undefined, React.createElement(Blocks.Title, {}), React.createElement(Storybook.CodeBlock.make, {
+                            children: Toolkit__Ui_ButtonResi
+                          }), React.createElement(Blocks.Source, {
+                            language: "rescript",
+                            code: "\n            <Button color=#primary disabled=true>\"Content\"->React.string</Button>\n          "
+                          }), React.createElement(Blocks.Story, {
+                            id: "components-button--disabled"
+                          }));
+          })
+      }
+    }, undefined);
+
+export {
+  $$default ,
+  $$default as default,
+  defaultPalette ,
+  pillPalette ,
+  outlinePalette ,
+  textPalette ,
+  loading ,
+  disabled ,
+  
+}
+/* default Not a pure module */

package/lib/es6_global/stories/Toolkit__Ui_ProgressBarStory.bs.js

@@ -0,0 +1,70 @@
+
+
+import * as React from "react";
+import * as Js_dict from "../../../node_modules/rescript/lib/es6/js_dict.js";
+import * as Storybook from "./Storybook.bs.js";
+import * as Belt_Array from "../../../node_modules/rescript/lib/es6/belt_Array.js";
+import * as Toolkit__Ui_ProgressBar from "../src/ui/Toolkit__Ui_ProgressBar.bs.js";
+import * as Blocks from "@storybook/addon-docs/blocks";
+import Toolkit__Ui_ProgressBarResi from "!!raw-loader!../../../src/ui/Toolkit__Ui_ProgressBar.resi";
+
+var $$default = Storybook.CSF.make("Components/ProgressBar", undefined, undefined, undefined, undefined, undefined, undefined);
+
+function defaultPalette(param) {
+  var colors = Js_dict.fromArray([
+        [
+          "success",
+          "success"
+        ],
+        [
+          "warning",
+          "warning"
+        ],
+        [
+          "info",
+          "info"
+        ],
+        [
+          "danger",
+          "danger"
+        ]
+      ]);
+  return React.createElement("div", undefined, Belt_Array.mapWithIndex(Js_dict.entries(colors), (function (i, param) {
+                    var colorText = param[0];
+                    return React.createElement("div", {
+                                key: String(i) + colorText,
+                                className: "flex flex-row flex-col-gap-4 mb-4 items-center"
+                              }, React.createElement("strong", {
+                                    className: "w-40"
+                                  }, colorText), React.createElement("div", {
+                                    className: "w-60"
+                                  }, React.createElement(Toolkit__Ui_ProgressBar.make, {
+                                        progression: 60,
+                                        color: param[1]
+                                      })));
+                  })));
+}
+
+Storybook.CSF.addMeta(defaultPalette, "default palette", undefined, {
+      docs: {
+        page: (function (param) {
+            return React.createElement(React.Fragment, undefined, React.createElement(Storybook.CodeBlock.make, {
+                            children: Toolkit__Ui_ProgressBarResi
+                          }), React.createElement(Blocks.Source, {
+                            language: "rescript",
+                            code: "\n            <ProgressBar color=#success progression=60. />\n          "
+                          }), React.createElement(Toolkit__Ui_ProgressBar.make, {
+                            progression: 60,
+                            color: "success"
+                          }));
+          })
+      }
+    }, undefined);
+
+export {
+  $$default ,
+  $$default as default,
+  defaultPalette ,
+  
+}
+/* default Not a pure module */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@colisweb/rescript-toolkit",
-  "version": "2.8.2",
+  "version": "2.9.0-mobile",
   "scripts": {
     "clean": "rescript clean",
     "build": "rescript build",
@@ -55,6 +55,7 @@
     "postcss-loader": "4.2.0",
     "postcss-preset-env": "6.7.0",
     "prismjs": "1.25.0",
+    "react-datepicker": "3.8.0",
     "react-icons": "4.3.1",
     "react-select": "5.2.1",
     "react-table": "7.7.0",
@@ -64,15 +65,14 @@
     "reschema": "1.3.1",
     "rescript": "9.1.4",
     "rescript-classnames": "6.0.0",
-    "rescript-logger": "2.0.2",
+    "rescript-logger": "2.0.0",
     "rescript-react-update": "5.0.0",
     "restorative": "0.4.0-beta.1",
+    "sanitize-html": "2.6.1",
     "swr": "1.1.1",
-    "tailwindcss": "3.0.2",
-    "react-datepicker": "3.8.0"
+    "tailwindcss": "3.0.2"
   },
   "devDependencies": {
-    "highlight.js": "11.3.1",
     "@babel/core": "7.16.5",
     "@storybook/addon-actions": "6.1.21",
     "@storybook/addon-essentials": "6.1.21",
@@ -82,6 +82,7 @@
     "@storybook/react": "6.1.21",
     "@storybook/theming": "6.1.21",
     "babel-loader": "8.2.3",
+    "highlight.js": "11.3.1",
     "raw-loader": "4.0.2",
     "react": "17.0.2",
     "react-dom": "17.0.2",

package/src/request/Toolkit__Request.res

@@ -54,13 +54,18 @@ let toResult = (
     | Ok(response) =>
       switch response["data"]->mapData {
       | Ok(_) as ok => ok
-      | Error(error) =>
-        Error(
-          #invalidResponseData(
-            response->castToUndecodedResponse,
-            "\"" ++ (error.path ++ ("\" " ++ error.message)),
-          ),
-        )
+      | Error(error) => {
+          %log.error(
+            "Decoder failure"
+            ("err", error)
+          )
+          Error(
+            #invalidResponseData(
+              response->castToUndecodedResponse,
+              "\"" ++ (error.path ++ ("\" " ++ error.message)),
+            ),
+          )
+        }
       }
     | Error(error) =>
       if (error->castToJs)["response"] {

package/src/tailwind/tailwind.config.js

@@ -11,8 +11,7 @@ module.exports = {
       },
       boxShadow: {
         sidenav: "inset 0 0 1px 2px rgba(0, 0, 0, 0.2)",
-        sm:
-          "0px 2px 1px -1px rgba(0,0,0,0.1), 0px 1px 1px 0px rgba(0,0,0,0.1), 0px 1px 3px 0px rgba(0,0,0,0.1)",
+        sm: "0px 2px 1px -1px rgba(0,0,0,0.1), 0px 1px 1px 0px rgba(0,0,0,0.1), 0px 1px 3px 0px rgba(0,0,0,0.1)",
       },
       borderColor: {
         currentColor: "currentColor",
@@ -142,7 +141,7 @@ module.exports = {
       purple: {
         50: "#F8F1FF",
         100: "#DDC8F0",
-        300: "#8787E0",
+        300: "#B787E0",
         400: "#9151C9",
         500: "#6C1CB2",
         600: "#55158B",

package/src/ui/Toolkit__Ui_RichText.res

@@ -1,7 +1,22 @@
 let transformUrl = text =>
   text |> Js.String.unsafeReplaceBy0(%re("/(https?:\\/\\/[^\\s]+)/g"), (url, _, _) =>
-    j`<a target='_blank' class='text-blue-500 underline' href="$url">$url</a>`
+    j`<a target='_blank' class='text-info-500 underline' href="$url">$url</a>`
   )
 
+@module("sanitize-html")
+external sanitizeHtml: (string, Js.t<'a>) => string = "default"
+
 @react.component
-let make = (~text) => <span dangerouslySetInnerHTML={"__html": text->transformUrl} />
+let make = (~text) =>
+  <span
+    dangerouslySetInnerHTML={
+      "__html": text
+      ->sanitizeHtml({
+        "allowedTags": ["a"],
+        "allowedAttributes": {
+          "a": ["href"],
+        },
+      })
+      ->transformUrl,
+    }
+  />

package/src/vendors/BsReactIcons.res

@@ -5893,3 +5893,9 @@ module FaFilter = {
   external make: (~size: int=?, ~color: string=?, ~className: string=?) => React.element =
     "FaFilter"
 }
+
+module IoIosCloseCircle = {
+  @module("react-icons/io") @react.component
+  external make: (~size: int=?, ~color: string=?, ~className: string=?) => React.element =
+    "IoIosCloseCircle"
+}