@colisweb/rescript-toolkit 4.12.1 → 4.14.0

package/src/vendors/ReactDayPicker.resi

@@ -0,0 +1,132 @@
+type range = {from?: Js.Date.t, to?: Js.Date.t}
+module DateUtils: {
+  @module("react-day-picker")
+  external addToRange: (Js.Date.t, range) => range = "addToRange"
+}
+type classnames = {container: string, overlayWrapper: string, overlay: string}
+type mode = [#default | #multiple | #range | #single]
+type formatters = {
+  formatCaption?: Js.Date.t => React.element,
+  formatDay?: Js.Date.t => React.element,
+  formatMonthCaption?: Js.Date.t => React.element,
+  formatWeekNumber?: int => React.element,
+  formatWeekdayName?: Js.Date.t => React.element,
+  formatYearCaption?: Js.Date.t => React.element,
+}
+type modifiersClassNames = {
+  disabled?: string,
+  hidden?: string,
+  outside?: string,
+  range_end?: string,
+  range_middle?: string,
+  range_start?: string,
+  selected?: string,
+  today?: string,
+  closed?: string,
+  clicked?: string,
+}
+type interval = {before?: Js.Date.t, after?: Js.Date.t}
+module Matcher: {
+  @unboxed @unboxed type rec t = Any('a): t
+  and case = Date(Js.Date.t) | DayOfWeek(int) | Range(range) | Interval(interval) | Bool(bool)
+  let date: Js.Date.t => t
+  let dayOfWeek: int => t
+  let range: range => t
+  let interval: interval => t
+  let bool: bool => t
+  let make: case => t
+}
+type modifiers = {
+  disabled?: array<Matcher.t>,
+  hidden?: array<Matcher.t>,
+  outside?: array<Matcher.t>,
+  range_end?: array<Matcher.t>,
+  range_middle?: array<Matcher.t>,
+  range_start?: array<Matcher.t>,
+  selected?: array<Matcher.t>,
+  today?: array<Matcher.t>,
+  closed?: array<Matcher.t>,
+  clicked?: array<Matcher.t>,
+}
+
+let applyHoursToRange: (
+  ~rangeToUpdate: option<range>,
+  ~hoursToApply: option<range>,
+) => option<range>
+
+module SingleDayPicker: {
+  @react.component
+  let make: (
+    ~selected: Js.Date.t=?,
+    ~onSelect: (option<Js.Date.t>, Js.Date.t) => unit=?,
+    ~formatters: formatters=?,
+    ~modifiers: modifiers=?,
+    ~modifiersClassNames: modifiersClassNames=?,
+    ~numberOfMonths: int=?,
+    ~defaultMonth: Js.Date.t=?,
+    ~showOutsideDays: bool=?,
+    ~className: string=?,
+    ~placeholder: string=?,
+    ~footer: React.element=?,
+  ) => React.element
+}
+module RangeDayPicker: {
+  @react.component
+  let make: (
+    ~selected: range=?,
+    ~onSelect: (option<range>, Js.Date.t) => unit=?,
+    ~formatters: formatters=?,
+    ~modifiers: modifiers=?,
+    ~modifiersClassNames: modifiersClassNames=?,
+    ~numberOfMonths: int=?,
+    ~defaultMonth: Js.Date.t=?,
+    ~showOutsideDays: bool=?,
+    ~className: string=?,
+    ~placeholder: string=?,
+    ~footer: React.element=?,
+  ) => React.element
+}
+module SingleDayPickerInput: {
+  @react.component
+  let make: (
+    ~labelFormatter: Js.Date.t => React.element=?,
+    ~labelClassName: string=?,
+    ~dropdownClassName: string=?,
+    ~buttonClassName: string=?,
+    ~placeholder: React.element=?,
+    ~value: Js.Date.t=?,
+    ~onChange: option<Js.Date.t> => unit,
+    ~resetButton: bool=?,
+    ~allowEmpty: bool=?,
+    ~modifiers: modifiers=?,
+    ~modifiersClassNames: modifiersClassNames=?,
+    ~showOutsideDays: bool=?,
+    ~defaultMonth: Js.Date.t=?,
+  ) => React.element
+}
+module RangeDayPickerInput: {
+  type state = {range: option<range>, startHour: float, endHour: float}
+  type action =
+    | UpdateRange(option<range>)
+    | UpdateStartHour(float)
+    | UpdateEndHour(float)
+    | ResetRange
+  @react.component
+  let make: (
+    ~labelFormatter: range => React.element=?,
+    ~labelClassName: string=?,
+    ~dropdownClassName: string=?,
+    ~buttonClassName: string=?,
+    ~value: range=?,
+    ~onChange: option<range> => unit,
+    ~placeholder: React.element=?,
+    ~withHours: bool=?,
+    ~resetButton: bool=?,
+    ~allowEmpty: bool=?,
+    ~withPresetRanges: bool=?,
+    ~showOutsideDays: bool=?,
+    ~modifiers: modifiers=?,
+    ~modifiersClassNames: modifiersClassNames=?,
+    ~defaultMonth: Js.Date.t=?,
+  ) => React.element
+}

package/src/ui/styles.scss

@@ -1,371 +0,0 @@
-/* purgecss start ignore */
-
-@import url("https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700");
-@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,500,600,700");
-@import url("https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap");
-@import url("https://fonts.googleapis.com/css2?family=Fira+Code:wght@300;400;500;600;700&display=swap");
-
-@import url("~@reach/accordion/styles.css");
-@import url("~@reach/listbox/styles.css");
-@import url("~@reach/menu-button/styles.css");
-@import url("~@reach/tabs/styles.css");
-@import url("~@reach/tooltip/styles.css");
-@import url("~@reach/combobox/styles.css");
-@import url("~@colisweb/react-day-picker/lib/style.css");
-
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-:root {
-  --reach-dialog: 1;
-}
-
-body {
-  @apply bg-gray-100;
-  @apply text-gray-900;
-}
-
-html,
-body,
-#root {
-  @apply h-full;
-}
-
-#root {
-  @apply h-full flex flex-col justify-between;
-}
-
-/* Reach UI */
-
-[data-reach-popover] {
-  z-index: 90;
-}
-
-[data-reach-dialog-content] {
-  padding: 0 !important;
-  margin: 10vh auto;
-  outline: 0;
-}
-
-[data-reach-dialog-overlay] {
-  background: hsla(0, 0%, 0%, 0.6);
-  z-index: 40;
-  position: fixed;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  overflow: auto;
-}
-
-[data-reach-menu-item][data-selected] {
-  @apply bg-gray-200 text-gray-900;
-}
-
-.searchListBox {
-  @apply font-sans text-neutral-600 border-0 outline-none;
-}
-.searchListBox [data-reach-listbox-button] {
-  border-width: 0;
-  width: 100%;
-}
-.searchListBox [data-reach-listbox-button]:focus {
-  box-shadow: none !important;
-  white-space: nowrap;
-}
-.searchListBox [data-reach-listbox-arrow] {
-  margin-left: auto;
-}
-.searchListBox [data-reach-listbox-arrow] {
-  @apply transition-transform ease-in-out duration-150;
-}
-.searchListBox [data-reach-listbox-arrow][data-expanded] {
-  transform: rotateX(180deg);
-}
-
-.searchListBox [data-reach-listbox-popover] {
-  @apply shadow-lg rounded border border-gray-200;
-  padding: 0px !important;
-}
-.searchListBox [data-reach-listbox-popover]:focus-within {
-  outline: none !important;
-}
-.listBoxOptionsContainer {
-  max-height: 250px;
-  @apply overflow-y-auto;
-}
-
-.searchListBox [data-reach-listbox-option] {
-  @apply text-sm p-2 cursor-pointer;
-}
-.searchListBox [data-reach-listbox-option]:nth-child(odd) {
-  @apply bg-neutral-100;
-}
-.searchListBox [data-reach-listbox-option]:hover {
-  background-color: #1bb0c4;
-}
-.searchListBox [aria-selected="true"] {
-  background-color: #1bb0c4 !important;
-}
-
-[data-reach-tooltip] {
-  border: none;
-}
-
-/* Animations */
-
-@keyframes spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}
-
-.spin {
-  animation: spin 0.5s linear infinite;
-}
-
-a[href]:not([tabindex="-1"]):focus,
-area[href]:not([tabindex="-1"]):focus,
-input:not([disabled]):not([tabindex="-1"]):focus,
-select:not([disabled]):not([tabindex="-1"]):focus,
-textarea:not([disabled]):not([tabindex="-1"]):focus,
-button:not([disabled]):not([tabindex="-1"]):focus,
-iframe:not([tabindex="-1"]):focus,
-[tabindex]:not([tabindex="-1"]):focus,
-[contentEditable="true"]:not([tabindex="-1"]):focus,
-.focus {
-  outline: none !important;
-  box-shadow: rgba(66, 153, 225, 0.9) 0px 0px 0px 3px;
-}
-
-.no-focus {
-  outline: none !important;
-  box-shadow: none !important;
-}
-
-.cw-switch > input:checked ~ .cw-switch-bullet {
-  transform: translateX(20px);
-}
-
-.cw-switch > input:checked ~ .cw-switch-bg {
-  @apply bg-info-500;
-}
-.input-range
-  .DayPicker-Day--selected:not(.DayPicker-Day--start):not(.DayPicker-Day--end):not(.DayPicker-Day--outside) {
-  background-color: #f0f8ff !important;
-  color: #4a90e2;
-}
-.input-range .DayPicker-Day {
-  border-radius: 0 !important;
-}
-.input-range .DayPicker-Day--start {
-  border-top-left-radius: 50% !important;
-  border-bottom-left-radius: 50% !important;
-}
-.input-range .DayPicker-Day--end {
-  border-top-right-radius: 50% !important;
-  border-bottom-right-radius: 50% !important;
-}
-.input-range .DayPickerInput-Overlay {
-  width: 580px;
-  z-index: 31;
-}
-.input-range-to .DayPickerInput-Overlay {
-  margin-left: -198px;
-}
-
-.input-range .DayPickerInput input {
-  @apply p-2 border rounded-sm cursor-pointer;
-}
-
-.react-select__control {
-  @apply border-gray-300 #{!important};
-}
-.errored .react-select__control {
-  @apply border-danger-500 #{!important};
-}
-.react-select__indicator-separator {
-  @apply bg-gray-300 #{!important};
-}
-.react-select__multi-value {
-  @apply bg-gray-300 text-gray-800 #{!important};
-}
-
-.react-select--is-disabled .react-select__multi-value {
-  @apply opacity-50 #{!important};
-}
-.react-select__input input {
-  @apply shadow-none #{!important};
-}
-
-.Selectable
-  .DayPicker-Day--selected:not(.DayPicker-Day--start):not(.DayPicker-Day--end):not(.DayPicker-Day--outside) {
-  background-color: #f0f8ff !important;
-  color: #4a90e2;
-}
-.Selectable .DayPicker-Day {
-  border-radius: 0 !important;
-}
-.Selectable .DayPicker-Day--start {
-  border-top-left-radius: 50% !important;
-  border-bottom-left-radius: 50% !important;
-}
-.Selectable .DayPicker-Day--end {
-  border-top-right-radius: 50% !important;
-  border-bottom-right-radius: 50% !important;
-}
-
-.cw-Tabs {
-  @apply flex flex-row bg-gray-200 rounded-full h-6 text-sm mb-2;
-}
-
-.cw-Tabs [data-selected] {
-  background: linear-gradient(270deg, #11a3b6 0%, #27d0dc 100%);
-  color: white;
-}
-.cw-Tabs [data-selected]:hover {
-  color: white;
-  @apply bg-primary-500;
-}
-
-.cw-Tabs [data-reach-tab] {
-  @apply flex items-center justify-center w-full py-3 rounded-full font-display;
-}
-.cw-Tabs [data-reach-tab]:hover {
-  @apply bg-primary-300;
-}
-
-.cw-Tabs.cw-Tabs--big {
-  @apply h-10 text-xl;
-}
-
-[data-reach-accordion-item][data-state="open"] .cw-accordion-icon {
-  display: block;
-  transform: rotate(90deg);
-}
-
-[data-reach-accordion-item][data-state="collapsed"]
-  .cw-accordion-collapsed-hide {
-  display: none !important;
-}
-
-code {
-  font-family: "Fira Code", monospace !important ;
-}
-
-[data-reach-combobox-input] {
-  @apply appearance-none outline-none transition duration-150 ease-in-out block w-full bg-white text-gray-800 border rounded py-2 px-4 leading-tight focus:z-30 relative disabled:bg-gray-200 disabled:text-gray-700;
-}
-
-[data-reach-combobox-popover] {
-  @apply bg-white border-gray-200 rounded-b p-2 mt-1 shadow;
-}
-
-[data-reach-combobox-option] {
-  @apply font-normal truncate text-base font-sans py-2;
-}
-[data-suggested-value] {
-  @apply font-normal;
-}
-
-[data-user-value] {
-  @apply font-semibold;
-}
-
-.sidenav {
-  top: 64px;
-  height: calc(100% - 64px) !important;
-}
-
-@media screen and (min-width: 600px) {
-  .sidenav.sidenav--closed .sidenav-link:hover .sidenav-link-tooltip {
-    visibility: visible;
-    opacity: 100%;
-  }
-
-  .sidenav.sidenav--closed .sidenav-link .sidenav-link-tooltip:before {
-    content: "";
-    position: absolute;
-    left: 0;
-    top: 50%;
-    transform: translate(-100%, -50%);
-    border: 6px solid transparent;
-    border-right-color: #4a7378;
-  }
-}
-
-input::-webkit-outer-spin-button,
-input::-webkit-inner-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-/* Firefox */
-input[type="number"] {
-  -moz-appearance: textfield;
-}
-
-/* Day picker */
-.DayPicker {
-  .DayPicker-Day {
-    width: 40px !important;
-    height: 40px !important;
-  }
-
-  .DayPicker-Day--selected{
-    border-radius: 0 !important;
-
-    &:not(.DayPicker-Day--start):not(.DayPicker-Day--end) {
-      background-color: #e7edf3 !important;
-      color: #15373a;
-    }
-    &.DayPicker-Day--start {
-      border-top-left-radius: 50% !important;
-      border-bottom-left-radius: 50% !important;
-      background-color: #15cbe3 !important;
-      color: #fff;
-    }
-    &.DayPicker-Day--end {
-      border-top-right-radius: 50% !important;
-      border-bottom-right-radius: 50% !important;
-      background-color: #15cbe3 !important;
-      color: #fff;
-    }
-  }
-  .DayPicker-Day--closed{
-    border-radius: 0 !important;
-    &:not(.DayPicker-Day--start):not(.DayPicker-Day--end) {
-      background-color: #ff634b !important;
-      color: #15373a;
-    }
-    &.DayPicker-Day--start:not(.DayPicker-Day--end) {
-      border-top-left-radius: 50% !important;
-      border-bottom-left-radius: 50% !important;
-      border-top-right-radius: 0 !important;
-      border-bottom-right-radius: 0 !important;
-      background-color: #ff904b !important;
-      color: #15373a;
-    }
-    &.DayPicker-Day--end:not(.DayPicker-Day--start) {
-      border-top-right-radius: 50% !important;
-      border-bottom-right-radius: 50% !important;
-      border-top-left-radius: 0 !important;
-      border-bottom-left-radius: 0 !important;
-      background-color: #ff904b !important;
-      color: #15373a;
-    }
-    &.DayPicker-Day--start.DayPicker-Day--end {
-      background-color: #ff904b !important;
-      color: #15373a;
-    }
-  }
-}
- 
-
-
-/* purgecss end ignore */
-