@colisweb/rescript-toolkit 5.19.1 → 5.20.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.
Files changed (7) hide show
  1. package/package.json +23 -23
  2. package/src/ui/Toolkit__Ui_Autocomplete.res +54 -61
  3. package/src/ui/Toolkit__Ui_Modal.res +53 -74
  4. package/src/vendors/headlessui/HeadlessUi__Combobox.res +5 -1
  5. package/src/vendors/headlessui/HeadlessUi__Dialog.res +14 -4
  6. package/src/vendors/headlessui/HeadlessUi__Disclosure.res +6 -6
  7. package/src/vendors/headlessui/HeadlessUi__Tab.res +10 -10
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@colisweb/rescript-toolkit",
3
- "version": "5.19.1",
3
+ "version": "5.20.0",
4
4
  "type": "module",
5
5
  "scripts": {
6
6
  "clean": "rescript clean",
@@ -28,33 +28,33 @@
28
28
  "license": "MIT",
29
29
  "dependencies": {
30
30
  "@colisweb/bs-react-intl-extractor-bin": "0.12.2",
31
- "@datadog/browser-rum": "5.8.0",
31
+ "@datadog/browser-rum": "5.29.0",
32
32
  "@dck/rescript-ky": "2.1.0",
33
33
  "@dck/rescript-promise": "1.1.0",
34
34
  "@dck/restorative": "1.1.0",
35
- "@greenlabs/ppx-spice": "0.2.1",
36
- "@headlessui/react": "1.7.18",
37
- "@headlessui/tailwindcss": "0.2.0",
38
- "@radix-ui/react-dropdown-menu": "^2.1.1",
39
- "@radix-ui/react-popover": "^1.1.1",
40
- "@radix-ui/react-scroll-area": "^1.1.0",
41
- "@radix-ui/react-toast": "^1.2.1",
42
- "@radix-ui/react-tooltip": "1.1.2",
35
+ "@greenlabs/ppx-spice": "0.2.2",
36
+ "@headlessui/react": "2.1.10",
37
+ "@headlessui/tailwindcss": "0.2.1",
38
+ "@radix-ui/react-dropdown-menu": "2.1.2",
39
+ "@radix-ui/react-popover": "1.1.2",
40
+ "@radix-ui/react-scroll-area": "1.2.0",
41
+ "@radix-ui/react-toast": "1.2.2",
42
+ "@radix-ui/react-tooltip": "1.1.3",
43
43
  "@reach/auto-id": "0.18.0",
44
44
  "@rescript/react": "0.12.0",
45
- "autoprefixer": "10.4.17",
45
+ "autoprefixer": "10.4.20",
46
46
  "axios": "0.24.0",
47
47
  "case": "1.6.3",
48
48
  "click-outside-hook": "1.1.0",
49
49
  "copy-to-clipboard": "3.3.3",
50
50
  "date-fns": "3.2.0",
51
51
  "dedent": "0.7.0",
52
- "ky": "^1.2.4",
52
+ "ky": "1.7.2",
53
53
  "lenses-ppx": "6.1.10",
54
54
  "list-selectors": "2.0.1",
55
55
  "lodash": "4.17.21",
56
- "msw": "2.1.2",
57
- "postcss": "8.4.33",
56
+ "msw": "2.5.0",
57
+ "postcss": "8.4.47",
58
58
  "postcss-preset-env": "8.0.1",
59
59
  "prismjs": "1.29.0",
60
60
  "qs": "6.13.0",
@@ -63,22 +63,22 @@
63
63
  "react-datepicker": "3.8.0",
64
64
  "react-day-picker": "8.10.0",
65
65
  "react-dom": "18.2.0",
66
- "react-error-boundary": "4.0.12",
66
+ "react-error-boundary": "4.1.2",
67
67
  "react-helmet": "6.1.0",
68
- "react-icons": "5.0.1",
69
- "react-intl": "6.6.1",
68
+ "react-icons": "5.3.0",
69
+ "react-intl": "6.8.1",
70
70
  "react-portal": "4.2.2",
71
- "react-select": "5.8.0",
71
+ "react-select": "5.8.1",
72
72
  "react-table": "7.8.0",
73
- "react-use": "17.4.3",
73
+ "react-use": "17.5.1",
74
74
  "res-react-intl": "3.1.2",
75
75
  "rescript": "11.0.0",
76
76
  "rescript-classnames": "6.0.0",
77
77
  "rescript-react-update": "5.0.2",
78
78
  "sanitize-html": "1.27.4",
79
79
  "swr": "2.2.2",
80
- "tailwindcss": "3.4.1",
81
- "use-local-storage-state": "19.1.0"
80
+ "tailwindcss": "3.4.14",
81
+ "use-local-storage-state": "19.4.1"
82
82
  },
83
83
  "devDependencies": {
84
84
  "@babel/core": "7.23.7",
@@ -89,7 +89,7 @@
89
89
  "@originjs/vite-plugin-commonjs": "1.0.3",
90
90
  "@vitejs/plugin-react": "4.2.1",
91
91
  "babel-loader": "8.2.5",
92
- "highlight.js": "11.9.0",
92
+ "highlight.js": "11.10.0",
93
93
  "husky": "8.0.3",
94
94
  "is-ci": "3.0.1",
95
95
  "raw-loader": "4.0.2",
@@ -99,7 +99,7 @@
99
99
  "rehype-highlight": "^6.0.0",
100
100
  "rehype-slug": "^5.1.0",
101
101
  "sass": "1.69.7",
102
- "vite": "5.0.11"
102
+ "vite": "5.4.10"
103
103
  },
104
104
  "packageManager": "yarn@3.3.1",
105
105
  "msw": {
package/src/ui/Toolkit__Ui_Autocomplete.res CHANGED
@@ -108,68 +108,61 @@ let make = (
108
108
  {switch suggestions {
109
109
  | None => React.null
110
110
  | Some(suggestions) =>
111
- <HeadlessUi.Transition
112
- className="relative z-10"
113
- enter="transition duration-100 ease-out"
114
- enterFrom="transform scale-95 opacity-0"
115
- enterTo="transform scale-100 opacity-100"
116
- leave="transition duration-75 ease-out"
117
- leaveFrom="transform scale-100 opacity-100"
118
- leaveTo="transform scale-95 opacity-0">
119
- <HeadlessUi.Combobox.Options
120
- className={cx([
121
- "absolute mt-1 max-h-60 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none sm:text-sm",
122
- optionsContainerClassName,
123
- ])}>
124
- {switch suggestions {
125
- | Error("QUERY_TOO_SMALL") =>
126
- <p className="p-2 text-sm">
127
- <FormattedMessage
128
- defaultMessage="Tapez au moins {minSearchLength, plural, one {1 caractère} other {# caractères}}"
129
- values={"minSearchLength": minSearchLength}
130
- />
131
- </p>
132
- | Error(err) =>
133
- <p className={cx(["p-2 text-danger-500", errorSearchClassName])}>
134
- {err->React.string}
111
+ <HeadlessUi.Combobox.Options
112
+ transition=true
113
+ className={cx([
114
+ "z-10 absolute mt-1 max-h-60 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none sm:text-sm",
115
+ "transition duration-200 ease-out data-[closed]:scale-95 data-[closed]:opacity-0",
116
+ optionsContainerClassName,
117
+ ])}>
118
+ {switch suggestions {
119
+ | Error("QUERY_TOO_SMALL") =>
120
+ <p className="p-2 text-sm">
121
+ <FormattedMessage
122
+ defaultMessage="Tapez au moins {minSearchLength, plural, one {1 caractère} other {# caractères}}"
123
+ values={"minSearchLength": minSearchLength}
124
+ />
125
+ </p>
126
+ | Error(err) =>
127
+ <p className={cx(["p-2 text-danger-500", errorSearchClassName])}>
128
+ {err->React.string}
129
+ </p>
130
+ | Ok([]) =>
131
+ <div className="p-2">
132
+ <p className={cx(["text-sm", emptySearchClassName])}>
133
+ {emptySearchMessage->Option.getWithDefault(
134
+ <FormattedMessage defaultMessage="Aucun résultat pour cette recherche" />,
135
+ )}
135
136
  </p>
136
- | Ok([]) =>
137
- <div className="p-2">
138
- <p className={cx(["text-sm", emptySearchClassName])}>
139
- {emptySearchMessage->Option.getWithDefault(
140
- <FormattedMessage defaultMessage="Aucun résultat pour cette recherche" />,
141
- )}
142
- </p>
143
- {additionnalOption->Option.getWithDefault(React.null)}
144
- </div>
145
- | Ok(suggestions) =>
146
- <React.Fragment>
147
- {suggestions
148
- ->Array.mapWithIndex((i, suggestion) => {
149
- <HeadlessUi.Combobox.OptionRender
150
- \"as"={Node(HeadlessUi__Shared.fragment)}
151
- key={`${suggestion.label}-${i->Int.toString}`}
152
- value={suggestion}>
153
- {({active, selected}) => {
154
- <li
155
- className={cx([
156
- "relative cursor-default select-none py-2 px-4",
157
- `autocompleteSuggestion e2e-autocompleteSuggestion-${i->Int.toString}`,
158
- active ? "bg-primary-700 text-white" : "bg-white text-neutral-900",
159
- selected ? "font-semibold" : "",
160
- optionClassName,
161
- ])}>
162
- {suggestion.label->React.string}
163
- </li>
164
- }}
165
- </HeadlessUi.Combobox.OptionRender>
166
- })
167
- ->React.array}
168
- {additionnalOption->Option.getWithDefault(React.null)}
169
- </React.Fragment>
170
- }}
171
- </HeadlessUi.Combobox.Options>
172
- </HeadlessUi.Transition>
137
+ {additionnalOption->Option.getWithDefault(React.null)}
138
+ </div>
139
+ | Ok(suggestions) =>
140
+ <React.Fragment>
141
+ {suggestions
142
+ ->Array.mapWithIndex((i, suggestion) => {
143
+ <HeadlessUi.Combobox.OptionRender
144
+ \"as"={Node(HeadlessUi__Shared.fragment)}
145
+ key={`${suggestion.label}-${i->Int.toString}`}
146
+ value={suggestion}>
147
+ {({active, selected}) => {
148
+ <li
149
+ className={cx([
150
+ "relative cursor-default select-none py-2 px-4",
151
+ `autocompleteSuggestion e2e-autocompleteSuggestion-${i->Int.toString}`,
152
+ active ? "bg-primary-700 text-white" : "bg-white text-neutral-900",
153
+ selected ? "font-semibold" : "",
154
+ optionClassName,
155
+ ])}>
156
+ {suggestion.label->React.string}
157
+ </li>
158
+ }}
159
+ </HeadlessUi.Combobox.OptionRender>
160
+ })
161
+ ->React.array}
162
+ {additionnalOption->Option.getWithDefault(React.null)}
163
+ </React.Fragment>
164
+ }}
165
+ </HeadlessUi.Combobox.Options>
173
166
  }}
174
167
  </HeadlessUi.Combobox>
175
168
  {children->Option.mapWithDefault(React.null, children =>
package/src/ui/Toolkit__Ui_Modal.res CHANGED
@@ -56,77 +56,56 @@ let make = (
56
56
  ~footer=?,
57
57
  ~ariaLabel="",
58
58
  ) =>
59
- <HeadlessUi.Transition
60
- show={isVisible}
61
- enter="transition duration-100 ease-out"
62
- enterFrom="transform scale-95 opacity-0"
63
- enterTo="transform scale-100 opacity-100"
64
- leave="transition duration-75 ease-out"
65
- leaveFrom="transform scale-100 opacity-100"
66
- leaveTo="transform scale-95 opacity-0">
67
- <HeadlessUi.Dialog \"open"=isVisible onClose=hide className="relative z-50">
68
- <HeadlessUi.Transition.Child
69
- enter="ease-out duration-300"
70
- enterFrom="opacity-0"
71
- enterTo="opacity-100"
72
- leave="ease-in duration-200"
73
- leaveFrom="opacity-100"
74
- leaveTo="opacity-0">
75
- <div className="fixed inset-0 bg-black/30" />
76
- </HeadlessUi.Transition.Child>
77
- <div className="fixed inset-0 overflow-y-auto">
78
- <div className="flex min-h-full items-start justify-center p-4">
79
- <HeadlessUi.Transition.Child
80
- \"as"={Node(fragment)}
81
- enter="ease-out duration-300"
82
- enterFrom="opacity-0 scale-95"
83
- enterTo="opacity-100 scale-100"
84
- leave="ease-in duration-200"
85
- leaveFrom="opacity-100 scale-100"
86
- leaveTo="opacity-0 scale-95">
87
- <HeadlessUi.Dialog.Panel
88
- className={cx(["bg-white pb-5 shadow-lg w-full mt-[10vh]", modalStyle(~type_)])}
89
- style={ReactDOMStyle.make(
90
- ~maxWidth={
91
- let value = switch size {
92
- | #xs => 480
93
- | #sm => 600
94
- | #md => 768
95
- | #lg => 900
96
- | #custom(value) => value
97
- }
98
- `${value->Int.toString}px`
99
- },
100
- (),
101
- )}>
102
- <header
103
- className={cx([
104
- "flex items-center justify-between mb-4 pl-5 pr-3 pt-2 pb-1",
105
- headerStyle(~type_),
106
- ])}>
107
- {title->Option.mapWithDefault(React.null, title =>
108
- <HeadlessUi.Dialog.Title
109
- className={cx(["text-2xl pb-1 font-display", titleStyle(~type_)])}>
110
- title
111
- </HeadlessUi.Dialog.Title>
112
- )}
113
- <button
114
- onClick={_ => hide()}
115
- className={cx([
116
- title->Option.isSome ? "ml-4" : "ml-auto",
117
- "p-1 rounded-full modal-close-button",
118
- closeIconStyle(~type_),
119
- ])}>
120
- <ReactIcons.MdClose size=28 />
121
- </button>
122
- </header>
123
- <div className="px-1 sm:px-2 md:px-5"> body </div>
124
- {footer->Option.mapWithDefault(React.null, footer =>
125
- <div className="flex flex-row justify-end mt-6 pr-4"> footer </div>
126
- )}
127
- </HeadlessUi.Dialog.Panel>
128
- </HeadlessUi.Transition.Child>
129
- </div>
130
- </div>
131
- </HeadlessUi.Dialog>
132
- </HeadlessUi.Transition>
59
+ <HeadlessUi.Dialog \"open"=isVisible onClose=hide className="relative z-50">
60
+ <HeadlessUi.Dialog.Backdrop
61
+ transition=true
62
+ className="fixed inset-0 bg-black/30 duration-200 ease-out data-[closed]:opacity-0"
63
+ />
64
+ <div className="fixed inset-0 overflow-y-auto flex min-h-full items-start justify-center p-4">
65
+ <HeadlessUi.Dialog.Panel
66
+ transition=true
67
+ className={cx([
68
+ "bg-white pb-5 shadow-lg w-full mt-[10vh] duration-300 ease-out data-[closed]:scale-95 data-[closed]:opacity-0",
69
+ modalStyle(~type_),
70
+ ])}
71
+ style={ReactDOMStyle.make(
72
+ ~maxWidth={
73
+ let value = switch size {
74
+ | #xs => 480
75
+ | #sm => 600
76
+ | #md => 768
77
+ | #lg => 900
78
+ | #custom(value) => value
79
+ }
80
+ `${value->Int.toString}px`
81
+ },
82
+ (),
83
+ )}>
84
+ <header
85
+ className={cx([
86
+ "flex items-center justify-between mb-4 pl-5 pr-3 pt-2 pb-1",
87
+ headerStyle(~type_),
88
+ ])}>
89
+ {title->Option.mapWithDefault(React.null, title =>
90
+ <HeadlessUi.Dialog.Title
91
+ className={cx(["text-2xl pb-1 font-display", titleStyle(~type_)])}>
92
+ title
93
+ </HeadlessUi.Dialog.Title>
94
+ )}
95
+ <button
96
+ onClick={_ => hide()}
97
+ className={cx([
98
+ title->Option.isSome ? "ml-4" : "ml-auto",
99
+ "p-1 rounded-full modal-close-button",
100
+ closeIconStyle(~type_),
101
+ ])}>
102
+ <ReactIcons.MdClose size=28 />
103
+ </button>
104
+ </header>
105
+ <div className="px-1 sm:px-2 md:px-5"> body </div>
106
+ {footer->Option.mapWithDefault(React.null, footer =>
107
+ <div className="flex flex-row justify-end mt-6 pr-4"> footer </div>
108
+ )}
109
+ </HeadlessUi.Dialog.Panel>
110
+ </div>
111
+ </HeadlessUi.Dialog>
package/src/vendors/headlessui/HeadlessUi__Combobox.res CHANGED
@@ -35,7 +35,11 @@ module Label = {
35
35
 
36
36
  module Options = {
37
37
  @module("@headlessui/react") @scope("Combobox") @react.component
38
- external make: (~children: React.element, ~className: string=?) => React.element = "Options"
38
+ external make: (
39
+ ~children: React.element,
40
+ ~transition: bool=?,
41
+ ~className: string=?,
42
+ ) => React.element = "Options"
39
43
  }
40
44
 
41
45
  module Option = {
package/src/vendors/headlessui/HeadlessUi__Dialog.res CHANGED
@@ -4,22 +4,32 @@ external make: (
4
4
  ~onClose: unit => unit,
5
5
  ~children: React.element,
6
6
  ~className: string=?,
7
+ ~transition: bool=?,
7
8
  ~style: ReactDOM.Style.t=?,
8
9
  ) => React.element = "Dialog"
9
10
 
10
11
  module Panel = {
11
- @module("@headlessui/react") @scope("Dialog") @react.component
12
+ @module("@headlessui/react") @react.component
12
13
  external make: (
13
14
  ~children: React.element,
14
15
  ~className: string=?,
16
+ ~transition: bool=?,
15
17
  ~style: ReactDOM.Style.t=?,
16
- ) => React.element = "Panel"
18
+ ) => React.element = "DialogPanel"
17
19
  }
18
20
  module Title = {
19
- @module("@headlessui/react") @scope("Dialog") @react.component
21
+ @module("@headlessui/react") @react.component
20
22
  external make: (
21
23
  ~children: React.element,
22
24
  ~className: string=?,
23
25
  ~style: ReactDOM.Style.t=?,
24
- ) => React.element = "Title"
26
+ ) => React.element = "DialogTitle"
27
+ }
28
+ module Backdrop = {
29
+ @module("@headlessui/react") @react.component
30
+ external make: (
31
+ ~className: string=?,
32
+ ~transition: bool=?,
33
+ ~style: ReactDOM.Style.t=?,
34
+ ) => React.element = "DialogBackdrop"
25
35
  }
package/src/vendors/headlessui/HeadlessUi__Disclosure.res CHANGED
@@ -21,32 +21,32 @@ module Render = {
21
21
  }
22
22
 
23
23
  module Button = {
24
- @module("@headlessui/react") @scope("Disclosure") @react.component
24
+ @module("@headlessui/react") @react.component
25
25
  external make: (
26
26
  ~children: React.element,
27
27
  ~className: string=?,
28
28
  ~\"as": as_<'a>=?,
29
- ) => React.element = "Button"
29
+ ) => React.element = "DisclosureButton"
30
30
  }
31
31
 
32
32
  module Panel = {
33
- @module("@headlessui/react") @scope("Disclosure") @react.component
33
+ @module("@headlessui/react") @react.component
34
34
  external make: (
35
35
  ~children: React.element,
36
36
  ~className: string=?,
37
37
  ~static: bool=?,
38
38
  ~\"as": as_<'a>=?,
39
- ) => React.element = "Panel"
39
+ ) => React.element = "DisclosurePanel"
40
40
  }
41
41
 
42
42
  module PanelRender = {
43
43
  type render = {\"open": bool, close: unit => unit}
44
44
 
45
- @module("@headlessui/react") @scope("Disclosure") @react.component
45
+ @module("@headlessui/react") @react.component
46
46
  external make: (
47
47
  ~children: render => React.element,
48
48
  ~className: string=?,
49
49
  ~static: bool=?,
50
50
  ~\"as": as_<'a>=?,
51
- ) => React.element = "Panel"
51
+ ) => React.element = "DisclosurePanel"
52
52
  }
package/src/vendors/headlessui/HeadlessUi__Tab.res CHANGED
@@ -21,36 +21,36 @@ module RenderTab = {
21
21
  }
22
22
 
23
23
  module Group = {
24
- @module("@headlessui/react") @scope("Tab") @react.component
24
+ @module("@headlessui/react") @react.component
25
25
  external make: (
26
26
  ~children: React.element,
27
27
  ~defaultIndex: int=?,
28
28
  ~selectedIndex: int=?,
29
29
  ~onChange: int => unit=?,
30
- ) => React.element = "Group"
30
+ ) => React.element = "TabGroup"
31
31
  }
32
32
 
33
33
  module GroupRender = {
34
34
  type renderProps = {selectedIndex: int}
35
- @module("@headlessui/react") @scope("Tab") @react.component
35
+ @module("@headlessui/react") @react.component
36
36
  external make: (
37
37
  ~children: renderProps => React.element,
38
38
  ~defaultIndex: int=?,
39
39
  ~selectedIndex: int=?,
40
40
  ~onChange: int => unit=?,
41
- ) => React.element = "Group"
41
+ ) => React.element = "TabGroup"
42
42
  }
43
43
 
44
44
  module List = {
45
- @module("@headlessui/react") @scope("Tab") @react.component
46
- external make: (~children: React.element, ~className: string=?) => React.element = "List"
45
+ @module("@headlessui/react") @react.component
46
+ external make: (~children: React.element, ~className: string=?) => React.element = "TabList"
47
47
  }
48
48
 
49
49
  module Panels = {
50
- @module("@headlessui/react") @scope("Tab") @react.component
51
- external make: (~children: React.element, ~className: string=?) => React.element = "Panels"
50
+ @module("@headlessui/react") @react.component
51
+ external make: (~children: React.element, ~className: string=?) => React.element = "TabPanels"
52
52
  }
53
53
  module Panel = {
54
- @module("@headlessui/react") @scope("Tab") @react.component
55
- external make: (~children: React.element, ~className: string=?) => React.element = "Panel"
54
+ @module("@headlessui/react") @react.component
55
+ external make: (~children: React.element, ~className: string=?) => React.element = "TabPanel"
56
56
  }