@colisweb/rescript-toolkit 4.12.1 → 4.13.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,132 @@
1
+ type range = {from?: Js.Date.t, to?: Js.Date.t}
2
+ module DateUtils: {
3
+ @module("react-day-picker")
4
+ external addToRange: (Js.Date.t, range) => range = "addToRange"
5
+ }
6
+ type classnames = {container: string, overlayWrapper: string, overlay: string}
7
+ type mode = [#default | #multiple | #range | #single]
8
+ type formatters = {
9
+ formatCaption?: Js.Date.t => React.element,
10
+ formatDay?: Js.Date.t => React.element,
11
+ formatMonthCaption?: Js.Date.t => React.element,
12
+ formatWeekNumber?: int => React.element,
13
+ formatWeekdayName?: Js.Date.t => React.element,
14
+ formatYearCaption?: Js.Date.t => React.element,
15
+ }
16
+ type modifiersClassNames = {
17
+ disabled?: string,
18
+ hidden?: string,
19
+ outside?: string,
20
+ range_end?: string,
21
+ range_middle?: string,
22
+ range_start?: string,
23
+ selected?: string,
24
+ today?: string,
25
+ closed?: string,
26
+ clicked?: string,
27
+ }
28
+ type interval = {before?: Js.Date.t, after?: Js.Date.t}
29
+ module Matcher: {
30
+ @unboxed @unboxed type rec t = Any('a): t
31
+ and case = Date(Js.Date.t) | DayOfWeek(int) | Range(range) | Interval(interval) | Bool(bool)
32
+ let date: Js.Date.t => t
33
+ let dayOfWeek: int => t
34
+ let range: range => t
35
+ let interval: interval => t
36
+ let bool: bool => t
37
+ let make: case => t
38
+ }
39
+ type modifiers = {
40
+ disabled?: array<Matcher.t>,
41
+ hidden?: array<Matcher.t>,
42
+ outside?: array<Matcher.t>,
43
+ range_end?: array<Matcher.t>,
44
+ range_middle?: array<Matcher.t>,
45
+ range_start?: array<Matcher.t>,
46
+ selected?: array<Matcher.t>,
47
+ today?: array<Matcher.t>,
48
+ closed?: array<Matcher.t>,
49
+ clicked?: array<Matcher.t>,
50
+ }
51
+
52
+ let applyHoursToRange: (
53
+ ~rangeToUpdate: option<range>,
54
+ ~hoursToApply: option<range>,
55
+ ) => option<range>
56
+
57
+ module SingleDayPicker: {
58
+ @react.component
59
+ let make: (
60
+ ~selected: Js.Date.t=?,
61
+ ~onSelect: (option<Js.Date.t>, Js.Date.t) => unit=?,
62
+ ~formatters: formatters=?,
63
+ ~modifiers: modifiers=?,
64
+ ~modifiersClassNames: modifiersClassNames=?,
65
+ ~numberOfMonths: int=?,
66
+ ~defaultMonth: Js.Date.t=?,
67
+ ~showOutsideDays: bool=?,
68
+ ~className: string=?,
69
+ ~placeholder: string=?,
70
+ ~footer: React.element=?,
71
+ ) => React.element
72
+ }
73
+ module RangeDayPicker: {
74
+ @react.component
75
+ let make: (
76
+ ~selected: range=?,
77
+ ~onSelect: (option<range>, Js.Date.t) => unit=?,
78
+ ~formatters: formatters=?,
79
+ ~modifiers: modifiers=?,
80
+ ~modifiersClassNames: modifiersClassNames=?,
81
+ ~numberOfMonths: int=?,
82
+ ~defaultMonth: Js.Date.t=?,
83
+ ~showOutsideDays: bool=?,
84
+ ~className: string=?,
85
+ ~placeholder: string=?,
86
+ ~footer: React.element=?,
87
+ ) => React.element
88
+ }
89
+ module SingleDayPickerInput: {
90
+ @react.component
91
+ let make: (
92
+ ~labelFormatter: Js.Date.t => React.element=?,
93
+ ~labelClassName: string=?,
94
+ ~dropdownClassName: string=?,
95
+ ~buttonClassName: string=?,
96
+ ~placeholder: React.element=?,
97
+ ~value: Js.Date.t=?,
98
+ ~onChange: option<Js.Date.t> => unit,
99
+ ~resetButton: bool=?,
100
+ ~allowEmpty: bool=?,
101
+ ~modifiers: modifiers=?,
102
+ ~modifiersClassNames: modifiersClassNames=?,
103
+ ~showOutsideDays: bool=?,
104
+ ~defaultMonth: Js.Date.t=?,
105
+ ) => React.element
106
+ }
107
+ module RangeDayPickerInput: {
108
+ type state = {range: option<range>, startHour: float, endHour: float}
109
+ type action =
110
+ | UpdateRange(option<range>)
111
+ | UpdateStartHour(float)
112
+ | UpdateEndHour(float)
113
+ | ResetRange
114
+ @react.component
115
+ let make: (
116
+ ~labelFormatter: range => React.element=?,
117
+ ~labelClassName: string=?,
118
+ ~dropdownClassName: string=?,
119
+ ~buttonClassName: string=?,
120
+ ~value: range=?,
121
+ ~onChange: option<range> => unit,
122
+ ~placeholder: React.element=?,
123
+ ~withHours: bool=?,
124
+ ~resetButton: bool=?,
125
+ ~allowEmpty: bool=?,
126
+ ~withPresetRanges: bool=?,
127
+ ~showOutsideDays: bool=?,
128
+ ~modifiers: modifiers=?,
129
+ ~modifiersClassNames: modifiersClassNames=?,
130
+ ~defaultMonth: Js.Date.t=?,
131
+ ) => React.element
132
+ }
@@ -1,371 +0,0 @@
1
- /* purgecss start ignore */
2
-
3
- @import url("https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700");
4
- @import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,500,600,700");
5
- @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");
6
- @import url("https://fonts.googleapis.com/css2?family=Fira+Code:wght@300;400;500;600;700&display=swap");
7
-
8
- @import url("~@reach/accordion/styles.css");
9
- @import url("~@reach/listbox/styles.css");
10
- @import url("~@reach/menu-button/styles.css");
11
- @import url("~@reach/tabs/styles.css");
12
- @import url("~@reach/tooltip/styles.css");
13
- @import url("~@reach/combobox/styles.css");
14
- @import url("~@colisweb/react-day-picker/lib/style.css");
15
-
16
- @tailwind base;
17
- @tailwind components;
18
- @tailwind utilities;
19
-
20
- :root {
21
- --reach-dialog: 1;
22
- }
23
-
24
- body {
25
- @apply bg-gray-100;
26
- @apply text-gray-900;
27
- }
28
-
29
- html,
30
- body,
31
- #root {
32
- @apply h-full;
33
- }
34
-
35
- #root {
36
- @apply h-full flex flex-col justify-between;
37
- }
38
-
39
- /* Reach UI */
40
-
41
- [data-reach-popover] {
42
- z-index: 90;
43
- }
44
-
45
- [data-reach-dialog-content] {
46
- padding: 0 !important;
47
- margin: 10vh auto;
48
- outline: 0;
49
- }
50
-
51
- [data-reach-dialog-overlay] {
52
- background: hsla(0, 0%, 0%, 0.6);
53
- z-index: 40;
54
- position: fixed;
55
- top: 0;
56
- right: 0;
57
- bottom: 0;
58
- left: 0;
59
- overflow: auto;
60
- }
61
-
62
- [data-reach-menu-item][data-selected] {
63
- @apply bg-gray-200 text-gray-900;
64
- }
65
-
66
- .searchListBox {
67
- @apply font-sans text-neutral-600 border-0 outline-none;
68
- }
69
- .searchListBox [data-reach-listbox-button] {
70
- border-width: 0;
71
- width: 100%;
72
- }
73
- .searchListBox [data-reach-listbox-button]:focus {
74
- box-shadow: none !important;
75
- white-space: nowrap;
76
- }
77
- .searchListBox [data-reach-listbox-arrow] {
78
- margin-left: auto;
79
- }
80
- .searchListBox [data-reach-listbox-arrow] {
81
- @apply transition-transform ease-in-out duration-150;
82
- }
83
- .searchListBox [data-reach-listbox-arrow][data-expanded] {
84
- transform: rotateX(180deg);
85
- }
86
-
87
- .searchListBox [data-reach-listbox-popover] {
88
- @apply shadow-lg rounded border border-gray-200;
89
- padding: 0px !important;
90
- }
91
- .searchListBox [data-reach-listbox-popover]:focus-within {
92
- outline: none !important;
93
- }
94
- .listBoxOptionsContainer {
95
- max-height: 250px;
96
- @apply overflow-y-auto;
97
- }
98
-
99
- .searchListBox [data-reach-listbox-option] {
100
- @apply text-sm p-2 cursor-pointer;
101
- }
102
- .searchListBox [data-reach-listbox-option]:nth-child(odd) {
103
- @apply bg-neutral-100;
104
- }
105
- .searchListBox [data-reach-listbox-option]:hover {
106
- background-color: #1bb0c4;
107
- }
108
- .searchListBox [aria-selected="true"] {
109
- background-color: #1bb0c4 !important;
110
- }
111
-
112
- [data-reach-tooltip] {
113
- border: none;
114
- }
115
-
116
- /* Animations */
117
-
118
- @keyframes spin {
119
- from {
120
- transform: rotate(0deg);
121
- }
122
- to {
123
- transform: rotate(360deg);
124
- }
125
- }
126
-
127
- .spin {
128
- animation: spin 0.5s linear infinite;
129
- }
130
-
131
- a[href]:not([tabindex="-1"]):focus,
132
- area[href]:not([tabindex="-1"]):focus,
133
- input:not([disabled]):not([tabindex="-1"]):focus,
134
- select:not([disabled]):not([tabindex="-1"]):focus,
135
- textarea:not([disabled]):not([tabindex="-1"]):focus,
136
- button:not([disabled]):not([tabindex="-1"]):focus,
137
- iframe:not([tabindex="-1"]):focus,
138
- [tabindex]:not([tabindex="-1"]):focus,
139
- [contentEditable="true"]:not([tabindex="-1"]):focus,
140
- .focus {
141
- outline: none !important;
142
- box-shadow: rgba(66, 153, 225, 0.9) 0px 0px 0px 3px;
143
- }
144
-
145
- .no-focus {
146
- outline: none !important;
147
- box-shadow: none !important;
148
- }
149
-
150
- .cw-switch > input:checked ~ .cw-switch-bullet {
151
- transform: translateX(20px);
152
- }
153
-
154
- .cw-switch > input:checked ~ .cw-switch-bg {
155
- @apply bg-info-500;
156
- }
157
- .input-range
158
- .DayPicker-Day--selected:not(.DayPicker-Day--start):not(.DayPicker-Day--end):not(.DayPicker-Day--outside) {
159
- background-color: #f0f8ff !important;
160
- color: #4a90e2;
161
- }
162
- .input-range .DayPicker-Day {
163
- border-radius: 0 !important;
164
- }
165
- .input-range .DayPicker-Day--start {
166
- border-top-left-radius: 50% !important;
167
- border-bottom-left-radius: 50% !important;
168
- }
169
- .input-range .DayPicker-Day--end {
170
- border-top-right-radius: 50% !important;
171
- border-bottom-right-radius: 50% !important;
172
- }
173
- .input-range .DayPickerInput-Overlay {
174
- width: 580px;
175
- z-index: 31;
176
- }
177
- .input-range-to .DayPickerInput-Overlay {
178
- margin-left: -198px;
179
- }
180
-
181
- .input-range .DayPickerInput input {
182
- @apply p-2 border rounded-sm cursor-pointer;
183
- }
184
-
185
- .react-select__control {
186
- @apply border-gray-300 #{!important};
187
- }
188
- .errored .react-select__control {
189
- @apply border-danger-500 #{!important};
190
- }
191
- .react-select__indicator-separator {
192
- @apply bg-gray-300 #{!important};
193
- }
194
- .react-select__multi-value {
195
- @apply bg-gray-300 text-gray-800 #{!important};
196
- }
197
-
198
- .react-select--is-disabled .react-select__multi-value {
199
- @apply opacity-50 #{!important};
200
- }
201
- .react-select__input input {
202
- @apply shadow-none #{!important};
203
- }
204
-
205
- .Selectable
206
- .DayPicker-Day--selected:not(.DayPicker-Day--start):not(.DayPicker-Day--end):not(.DayPicker-Day--outside) {
207
- background-color: #f0f8ff !important;
208
- color: #4a90e2;
209
- }
210
- .Selectable .DayPicker-Day {
211
- border-radius: 0 !important;
212
- }
213
- .Selectable .DayPicker-Day--start {
214
- border-top-left-radius: 50% !important;
215
- border-bottom-left-radius: 50% !important;
216
- }
217
- .Selectable .DayPicker-Day--end {
218
- border-top-right-radius: 50% !important;
219
- border-bottom-right-radius: 50% !important;
220
- }
221
-
222
- .cw-Tabs {
223
- @apply flex flex-row bg-gray-200 rounded-full h-6 text-sm mb-2;
224
- }
225
-
226
- .cw-Tabs [data-selected] {
227
- background: linear-gradient(270deg, #11a3b6 0%, #27d0dc 100%);
228
- color: white;
229
- }
230
- .cw-Tabs [data-selected]:hover {
231
- color: white;
232
- @apply bg-primary-500;
233
- }
234
-
235
- .cw-Tabs [data-reach-tab] {
236
- @apply flex items-center justify-center w-full py-3 rounded-full font-display;
237
- }
238
- .cw-Tabs [data-reach-tab]:hover {
239
- @apply bg-primary-300;
240
- }
241
-
242
- .cw-Tabs.cw-Tabs--big {
243
- @apply h-10 text-xl;
244
- }
245
-
246
- [data-reach-accordion-item][data-state="open"] .cw-accordion-icon {
247
- display: block;
248
- transform: rotate(90deg);
249
- }
250
-
251
- [data-reach-accordion-item][data-state="collapsed"]
252
- .cw-accordion-collapsed-hide {
253
- display: none !important;
254
- }
255
-
256
- code {
257
- font-family: "Fira Code", monospace !important ;
258
- }
259
-
260
- [data-reach-combobox-input] {
261
- @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;
262
- }
263
-
264
- [data-reach-combobox-popover] {
265
- @apply bg-white border-gray-200 rounded-b p-2 mt-1 shadow;
266
- }
267
-
268
- [data-reach-combobox-option] {
269
- @apply font-normal truncate text-base font-sans py-2;
270
- }
271
- [data-suggested-value] {
272
- @apply font-normal;
273
- }
274
-
275
- [data-user-value] {
276
- @apply font-semibold;
277
- }
278
-
279
- .sidenav {
280
- top: 64px;
281
- height: calc(100% - 64px) !important;
282
- }
283
-
284
- @media screen and (min-width: 600px) {
285
- .sidenav.sidenav--closed .sidenav-link:hover .sidenav-link-tooltip {
286
- visibility: visible;
287
- opacity: 100%;
288
- }
289
-
290
- .sidenav.sidenav--closed .sidenav-link .sidenav-link-tooltip:before {
291
- content: "";
292
- position: absolute;
293
- left: 0;
294
- top: 50%;
295
- transform: translate(-100%, -50%);
296
- border: 6px solid transparent;
297
- border-right-color: #4a7378;
298
- }
299
- }
300
-
301
- input::-webkit-outer-spin-button,
302
- input::-webkit-inner-spin-button {
303
- -webkit-appearance: none;
304
- margin: 0;
305
- }
306
-
307
- /* Firefox */
308
- input[type="number"] {
309
- -moz-appearance: textfield;
310
- }
311
-
312
- /* Day picker */
313
- .DayPicker {
314
- .DayPicker-Day {
315
- width: 40px !important;
316
- height: 40px !important;
317
- }
318
-
319
- .DayPicker-Day--selected{
320
- border-radius: 0 !important;
321
-
322
- &:not(.DayPicker-Day--start):not(.DayPicker-Day--end) {
323
- background-color: #e7edf3 !important;
324
- color: #15373a;
325
- }
326
- &.DayPicker-Day--start {
327
- border-top-left-radius: 50% !important;
328
- border-bottom-left-radius: 50% !important;
329
- background-color: #15cbe3 !important;
330
- color: #fff;
331
- }
332
- &.DayPicker-Day--end {
333
- border-top-right-radius: 50% !important;
334
- border-bottom-right-radius: 50% !important;
335
- background-color: #15cbe3 !important;
336
- color: #fff;
337
- }
338
- }
339
- .DayPicker-Day--closed{
340
- border-radius: 0 !important;
341
- &:not(.DayPicker-Day--start):not(.DayPicker-Day--end) {
342
- background-color: #ff634b !important;
343
- color: #15373a;
344
- }
345
- &.DayPicker-Day--start:not(.DayPicker-Day--end) {
346
- border-top-left-radius: 50% !important;
347
- border-bottom-left-radius: 50% !important;
348
- border-top-right-radius: 0 !important;
349
- border-bottom-right-radius: 0 !important;
350
- background-color: #ff904b !important;
351
- color: #15373a;
352
- }
353
- &.DayPicker-Day--end:not(.DayPicker-Day--start) {
354
- border-top-right-radius: 50% !important;
355
- border-bottom-right-radius: 50% !important;
356
- border-top-left-radius: 0 !important;
357
- border-bottom-left-radius: 0 !important;
358
- background-color: #ff904b !important;
359
- color: #15373a;
360
- }
361
- &.DayPicker-Day--start.DayPicker-Day--end {
362
- background-color: #ff904b !important;
363
- color: #15373a;
364
- }
365
- }
366
- }
367
-
368
-
369
-
370
- /* purgecss end ignore */
371
-