@colisweb/rescript-toolkit 1.25.3 → 1.26.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@colisweb/rescript-toolkit",
-  "version": "1.25.3",
+  "version": "1.26.3",
   "scripts": {
     "clean": "rescript clean",
     "build": "rescript build",

package/src/ui/Toolkit__Ui.res

@@ -28,3 +28,4 @@ module Layout = Toolkit__Ui_Layout
 module SpinnerFullScreen = Toolkit__Ui_SpinnerFullScreen
 module MultiSelect = Toolkit__Ui_MultiSelect
 module Notice = Toolkit__Ui_Notice
+module NativeDatePicker = Toolkit__Ui_NativeDatePicker

package/src/ui/Toolkit__Ui_Checkbox.res

@@ -51,7 +51,7 @@ let make = (
     />
     <span
       className={cx([
-        "checkmark rounded border text-white mr-3 border-neutral-300 transform transition-all ease-in-out flex items-center justify-center",
+        "checkmark rounded border text-white mr-3 border-neutral-300 transform transition-all ease-in-out flex items-center justify-center flex-shrink-0",
         switch size {
         | #xs => "w-4 h-4"
         | #sm => "w-6 h-6"

package/src/ui/Toolkit__Ui_Dropdown.res

@@ -11,6 +11,7 @@ let make = (
   ~children,
   ~dropdownClassName="",
   ~buttonClassName="",
+  ~containerClassName="",
   ~defaultIsOpen=false,
   ~buttonColor: Toolkit__Ui_Button.color=#white,
   ~buttonSize: Toolkit__Ui_Button.size=#md,
@@ -53,10 +54,11 @@ let make = (
     None
   }, (isOpen, ref))
 
-  <div className="relative">
+  <div className={cx(["relative", containerClassName])}>
     <Toolkit__Ui_Button
       variant=buttonVariant
       size=buttonSize
+      type_="button"
       color=buttonColor
       onClick={event => {
         switch ref.current->Js.Nullable.toOption {

package/src/ui/Toolkit__Ui_Dropdown.resi

@@ -11,6 +11,7 @@ let make: (
   ~children: React.element,
   ~dropdownClassName: string=?,
   ~buttonClassName: string=?,
+  ~containerClassName: string=?,
   ~defaultIsOpen: bool=?,
   ~buttonColor: Toolkit__Ui_Button.color=?,
   ~buttonSize: Toolkit__Ui_Button.size=?,

package/src/ui/Toolkit__Ui_MultiSelect.res

@@ -41,13 +41,20 @@ let make = (
     position=#bottom
     label={switch selectedOptions {
     | [] =>
-      <span className="flex flex-row gap-2 items-end">
-        placeholder <BsReactIcons.FaAngleDown />
-      </span>
+      <p className="flex flex-row gap-2 w-full items-center">
+        <span className="ml-1"> {placeholder} </span>
+        <span className="absolute inset-y-0 right-0 flex items-center px-2">
+          <BsReactIcons.FaAngleDown />
+        </span>
+      </p>
     | options =>
-      <span className="truncate">
-        {options->Array.map(({label}) => label)->Js.Array2.joinWith(", ")->React.string}
-      </span>
+      <div
+        className="table table-fixed w-full"
+        title={options->Array.map(({label}) => label)->Js.Array2.joinWith(", ")}>
+        <span className="table-cell truncate text-left">
+          {options->Array.map(({label}) => label)->Js.Array2.joinWith(", ")->React.string}
+        </span>
+      </div>
     }}>
     <div className="py-2 pl-2 pr-1">
       {allowFilter

package/src/ui/Toolkit__Ui_NativeDatePicker.res

@@ -0,0 +1,23 @@
+@react.component
+let make = (~onChange, ~value=?, ~id=?, ~disabled=false, ~isInvalid=false, ~className="") =>
+  <div className="relative">
+    <input
+      ?id
+      value=?{value->Option.map(d => d->BsDateFns.formatWithPattern("yyyy-MM-dd"))}
+      disabled
+      ariaDisabled={disabled}
+      onChange={event => {
+        let value = ReactEvent.Form.target(event)["value"]
+        onChange(Some(Js.Date.fromString(value))->Option.keep(BsDateFns.isValid))
+      }}
+      className={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",
+        switch isInvalid {
+        | true => "border-danger-500 shadow-danger-500"
+        | _ => "border-gray-300"
+        },
+        className,
+      ])}
+      type_="date"
+    />
+  </div>

package/src/ui/Toolkit__Ui_NativeDatePicker.resi

@@ -0,0 +1,9 @@
+@react.component
+let make: (
+  ~onChange: option<Js.Date.t> => unit,
+  ~value: Js.Date.t=?,
+  ~id: string=?,
+  ~disabled: bool=?,
+  ~isInvalid: bool=?,
+  ~className: string=?,
+) => React.element

package/src/ui/Toolkit__Ui_Select.res

@@ -32,7 +32,7 @@ let make = (
         onChange(value)
       }}>
       {placeholder->Option.mapWithDefault(React.null, placeholder =>
-        <option> {placeholder->React.string} </option>
+        <option value=""> {placeholder->React.string} </option>
       )}
       {options
       ->Array.mapWithIndex((i, (label, value, enabled)) =>
@@ -44,6 +44,6 @@ let make = (
     </select>
     <div
       className="pointer-events-none absolute inset-y-0 right-0 flex items-center px-2 text-gray-800">
-      <BsReactIcons.MdArrowDropDown className="w-6 h-6 z-30" />
+      <BsReactIcons.FaAngleDown />
     </div>
   </div>

package/src/vendors/BsDateFns.res

@@ -88,6 +88,9 @@ external endOfMonth: Js.Date.t => Js.Date.t = "endOfMonth"
 
 // booleans
 
+@module("date-fns")
+external isValid: Js.Date.t => bool = "isValid"
+
 @module("date-fns")
 external isEqual: (Js.Date.t, Js.Date.t) => bool = "isEqual"
 

package/src/vendors/BsReactIcons.res

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

package/src/vendors/BsSentry.res

@@ -1,6 +1,10 @@
 module Sentry = {
   // init
   type initOptions
+  type integration
+
+  @module("@sentry/tracing") @as("Integrations") @new
+  external browserTracing: unit => integration = "BrowserTracing"
 
   @obj
   external initOptions: (
@@ -8,6 +12,7 @@ module Sentry = {
     ~environment: string,
     ~beforeSend: ('a, 'b) => 'c=?,
     ~ignoreErrors: array<string>=?,
+    ~integrations: array<integration>=?,
     unit,
   ) => initOptions = ""
 
@@ -37,9 +42,9 @@ module Sentry = {
   module Scope = {
     type t
 
-    @bs.send external setExtra: (t, string, 'a) => unit = "setExtra"
-    @bs.send external setTag: (t, string, 'a) => unit = "setTag"
-    @bs.send external setUser: (t, 'a) => unit = "setUser"
+    @send external setExtra: (t, string, 'a) => unit = "setExtra"
+    @send external setTag: (t, string, 'a) => unit = "setTag"
+    @send external setUser: (t, 'a) => unit = "setUser"
   }
 
   // withScope