react-asc 19.0.6 → 20.2.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 (237) hide show
  1. package/apple-touch-icon.png +0 -0
  2. package/assets/index.1f5e1902.js +10 -0
  3. package/assets/index.a1009f35.css +1 -0
  4. package/assets/vendor.d012860f.js +57 -0
  5. package/changelog.md +919 -0
  6. package/favicon-16x16.png +0 -0
  7. package/favicon-32x32.png +0 -0
  8. package/favicon.ico +0 -0
  9. package/favicon.svg +23 -0
  10. package/index.html +27 -0
  11. package/manifest.webmanifest +1 -0
  12. package/package.json +3 -2
  13. package/pwa-192x192.png +0 -0
  14. package/pwa-512x512.png +0 -0
  15. package/react-asc.scss +93 -5
  16. package/registerSW.js +1 -0
  17. package/robots.txt +3 -0
  18. package/showcase/alert.md +3 -0
  19. package/showcase/appbar.md +8 -0
  20. package/showcase/autocomplete.md +53 -0
  21. package/showcase/backdrop.md +11 -0
  22. package/showcase/badge.md +8 -0
  23. package/showcase/breadcrumb.md +5 -0
  24. package/showcase/button.md +11 -0
  25. package/showcase/buttongroup.md +5 -0
  26. package/showcase/card.md +9 -0
  27. package/showcase/checkbox.md +7 -0
  28. package/showcase/chip.md +7 -0
  29. package/showcase/dateselect.md +8 -0
  30. package/showcase/drawer.md +13 -0
  31. package/showcase/expansionpanel.md +40 -0
  32. package/showcase/fileinput.md +6 -0
  33. package/showcase/floatingactionbutton.md +8 -0
  34. package/showcase/form.md +7 -0
  35. package/showcase/grid.md +5 -0
  36. package/showcase/hookuseconstructor.md +3 -0
  37. package/showcase/hookusedebounce.md +5 -0
  38. package/showcase/hookusehover.md +8 -0
  39. package/showcase/hookusewindowsize.md +5 -0
  40. package/showcase/icon.md +3 -0
  41. package/showcase/iconbutton.md +5 -0
  42. package/showcase/link.md +1 -0
  43. package/showcase/list.md +7 -0
  44. package/showcase/loadingindicator.md +18 -0
  45. package/showcase/menu.md +18 -0
  46. package/showcase/modal.md +17 -0
  47. package/showcase/numberselect.md +20 -0
  48. package/showcase/select.md +27 -0
  49. package/showcase/snackbar.md +22 -0
  50. package/showcase/speeddial.md +43 -0
  51. package/showcase/stepper.md +1 -0
  52. package/showcase/table.md +34 -0
  53. package/showcase/tabs.md +35 -0
  54. package/showcase/timeselect.md +1 -0
  55. package/showcase/tooltip.md +6 -0
  56. package/showcase/treeview.md +12 -0
  57. package/showcase/typography.md +6 -0
  58. package/sw.js +1 -0
  59. package/workbox-6cd28afd.js +1 -0
  60. package/components/Alert/Alert.d.ts +0 -11
  61. package/components/Alert/index.d.ts +0 -1
  62. package/components/AppBar/AppBar.d.ts +0 -9
  63. package/components/AppBar/AppBarTitle.d.ts +0 -5
  64. package/components/AppBar/index.d.ts +0 -2
  65. package/components/AutoComplete/AutoComplete.d.ts +0 -19
  66. package/components/AutoComplete/index.d.ts +0 -1
  67. package/components/Backdrop/Backdrop.d.ts +0 -7
  68. package/components/Backdrop/index.d.ts +0 -1
  69. package/components/Badge/Badge.d.ts +0 -7
  70. package/components/Badge/index.d.ts +0 -1
  71. package/components/Breadcrumb/Breadcrumb.d.ts +0 -5
  72. package/components/Breadcrumb/BreadcrumbItem.d.ts +0 -6
  73. package/components/Breadcrumb/index.d.ts +0 -2
  74. package/components/Button/Button.d.ts +0 -12
  75. package/components/Button/index.d.ts +0 -1
  76. package/components/ButtonGroup/ButtonGroup.d.ts +0 -2
  77. package/components/ButtonGroup/index.d.ts +0 -1
  78. package/components/Card/Card.d.ts +0 -6
  79. package/components/Card/CardBody.d.ts +0 -2
  80. package/components/Card/CardFooter.d.ts +0 -2
  81. package/components/Card/CardImage.d.ts +0 -2
  82. package/components/Card/CardSubtitle.d.ts +0 -2
  83. package/components/Card/CardText.d.ts +0 -2
  84. package/components/Card/CardTitle.d.ts +0 -6
  85. package/components/Card/index.d.ts +0 -7
  86. package/components/Checkbox/Checkbox.d.ts +0 -7
  87. package/components/Checkbox/index.d.ts +0 -1
  88. package/components/Chip/Chip.d.ts +0 -11
  89. package/components/Chip/index.d.ts +0 -1
  90. package/components/ConditionalWrapper/ConditionalWrapper.d.ts +0 -8
  91. package/components/ConditionalWrapper/index.d.ts +0 -1
  92. package/components/DateSelect/DateSelect.d.ts +0 -17
  93. package/components/DateSelect/DaySelect.d.ts +0 -12
  94. package/components/DateSelect/MonthSelect.d.ts +0 -10
  95. package/components/DateSelect/YearSelect.d.ts +0 -12
  96. package/components/DateSelect/index.d.ts +0 -4
  97. package/components/Drawer/Drawer.d.ts +0 -9
  98. package/components/Drawer/index.d.ts +0 -1
  99. package/components/ExpansionPanel/ExpansionPanel.d.ts +0 -8
  100. package/components/ExpansionPanel/ExpansionPanelContent.d.ts +0 -5
  101. package/components/ExpansionPanel/ExpansionPanelHeader.d.ts +0 -7
  102. package/components/ExpansionPanel/index.d.ts +0 -3
  103. package/components/FileInput/FileInput.d.ts +0 -5
  104. package/components/FileInput/index.d.ts +0 -1
  105. package/components/FloatingActionButton/FloatingActionButton.d.ts +0 -12
  106. package/components/FloatingActionButton/index.d.ts +0 -1
  107. package/components/Form/Form.d.ts +0 -38
  108. package/components/Form/FormError.d.ts +0 -8
  109. package/components/Form/FormGroup.d.ts +0 -7
  110. package/components/Form/FormHint/FormHint.d.ts +0 -2
  111. package/components/Form/FormHint/index.d.ts +0 -1
  112. package/components/Form/FormInput/FormInput.d.ts +0 -29
  113. package/components/Form/FormInput/index.d.ts +0 -1
  114. package/components/Form/FormLabel/FormLabel.d.ts +0 -2
  115. package/components/Form/FormLabel/index.d.ts +0 -1
  116. package/components/Form/form.interfaces.d.ts +0 -42
  117. package/components/Form/form.models.d.ts +0 -12
  118. package/components/Form/form.types.d.ts +0 -2
  119. package/components/Form/index.d.ts +0 -10
  120. package/components/Form/validators/EmailValidtor.d.ts +0 -1
  121. package/components/Form/validators/IsEmptyValidator.d.ts +0 -1
  122. package/components/Form/validators/IsEqualValidator.d.ts +0 -1
  123. package/components/Form/validators/index.d.ts +0 -3
  124. package/components/Grid/Column/Column.d.ts +0 -10
  125. package/components/Grid/Column/index.d.ts +0 -1
  126. package/components/Grid/Row/Row.d.ts +0 -2
  127. package/components/Grid/Row/index.d.ts +0 -1
  128. package/components/Grid/index.d.ts +0 -2
  129. package/components/Icon/Icon.d.ts +0 -6
  130. package/components/Icon/index.d.ts +0 -1
  131. package/components/IconButton/IconButton.d.ts +0 -11
  132. package/components/IconButton/index.d.ts +0 -1
  133. package/components/Link/Link.d.ts +0 -2
  134. package/components/Link/Link.test.d.ts +0 -1
  135. package/components/Link/index.d.ts +0 -1
  136. package/components/List/List.d.ts +0 -5
  137. package/components/List/ListItem.d.ts +0 -9
  138. package/components/List/ListItemAction.d.ts +0 -2
  139. package/components/List/ListItemAvatar.d.ts +0 -6
  140. package/components/List/ListItemIcon.d.ts +0 -6
  141. package/components/List/ListItemText.d.ts +0 -7
  142. package/components/List/index.d.ts +0 -6
  143. package/components/List/list.models.d.ts +0 -8
  144. package/components/LoadingIndicator/LoadingIndicator.d.ts +0 -2
  145. package/components/LoadingIndicator/LoadingIndicatorContainer.d.ts +0 -5
  146. package/components/LoadingIndicator/index.d.ts +0 -3
  147. package/components/LoadingIndicator/loading-indicator.service.d.ts +0 -11
  148. package/components/Menu/Menu.d.ts +0 -11
  149. package/components/Menu/MenuBackdrop.d.ts +0 -6
  150. package/components/Menu/MenuBody.d.ts +0 -12
  151. package/components/Menu/MenuContext.d.ts +0 -6
  152. package/components/Menu/MenuDivider.d.ts +0 -2
  153. package/components/Menu/MenuItem.d.ts +0 -8
  154. package/components/Menu/MenuToggle.d.ts +0 -6
  155. package/components/Menu/index.d.ts +0 -6
  156. package/components/Menu/menu.types.d.ts +0 -1
  157. package/components/Modal/GlobalModal.d.ts +0 -19
  158. package/components/Modal/Modal.d.ts +0 -14
  159. package/components/Modal/ModalBody.d.ts +0 -6
  160. package/components/Modal/ModalFooter.d.ts +0 -6
  161. package/components/Modal/ModalHeader.d.ts +0 -7
  162. package/components/Modal/index.d.ts +0 -8
  163. package/components/Modal/modal.enum.d.ts +0 -10
  164. package/components/Modal/modal.interfaces.d.ts +0 -11
  165. package/components/Modal/modal.service.d.ts +0 -21
  166. package/components/NumberSelect/NumberSelect.d.ts +0 -12
  167. package/components/NumberSelect/index.d.ts +0 -1
  168. package/components/Select/Select.d.ts +0 -15
  169. package/components/Select/index.d.ts +0 -1
  170. package/components/Sidebar/Sidebar.d.ts +0 -9
  171. package/components/Sidebar/index.d.ts +0 -2
  172. package/components/Sidebar/sidebar.interfaces.d.ts +0 -9
  173. package/components/Sidebar/sidebar.models.d.ts +0 -11
  174. package/components/Snackbar/Snackbar.d.ts +0 -8
  175. package/components/Snackbar/index.d.ts +0 -2
  176. package/components/Snackbar/snackbar.service.d.ts +0 -19
  177. package/components/SpeedDial/SpeedDial.d.ts +0 -7
  178. package/components/SpeedDial/SpeedDialAction.d.ts +0 -9
  179. package/components/SpeedDial/SpeedDialActions.d.ts +0 -2
  180. package/components/SpeedDial/SpeedDialIcon.d.ts +0 -5
  181. package/components/SpeedDial/index.d.ts +0 -3
  182. package/components/Stepper/Step/Step.d.ts +0 -19
  183. package/components/Stepper/Step/index.d.ts +0 -1
  184. package/components/Stepper/StepConnector/StepConnector.d.ts +0 -6
  185. package/components/Stepper/StepPanel/StepPanel.d.ts +0 -5
  186. package/components/Stepper/Stepper.d.ts +0 -16
  187. package/components/Stepper/StepperActions/StepperActions.d.ts +0 -12
  188. package/components/Stepper/StepperActions/index.d.ts +0 -1
  189. package/components/Stepper/index.d.ts +0 -3
  190. package/components/Table/Table.d.ts +0 -10
  191. package/components/Table/index.d.ts +0 -1
  192. package/components/Tabs/Tab.d.ts +0 -14
  193. package/components/Tabs/TabIndicator.d.ts +0 -10
  194. package/components/Tabs/TabPanel.d.ts +0 -6
  195. package/components/Tabs/Tabs.d.ts +0 -17
  196. package/components/Tabs/index.d.ts +0 -3
  197. package/components/Textarea/Textarea.d.ts +0 -2
  198. package/components/Textarea/index.d.ts +0 -1
  199. package/components/TimeSelect/HourSelect.d.ts +0 -10
  200. package/components/TimeSelect/MilliSecondSelect.d.ts +0 -11
  201. package/components/TimeSelect/MinuteSelect.d.ts +0 -10
  202. package/components/TimeSelect/SecondSelect.d.ts +0 -10
  203. package/components/TimeSelect/TimeSelect.d.ts +0 -20
  204. package/components/TimeSelect/index.d.ts +0 -5
  205. package/components/Tooltip/Tooltip.d.ts +0 -6
  206. package/components/Tooltip/index.d.ts +0 -1
  207. package/components/TreeView/TreeItem.d.ts +0 -14
  208. package/components/TreeView/TreeView.d.ts +0 -2
  209. package/components/TreeView/index.d.ts +0 -2
  210. package/components/Typography/Typography.d.ts +0 -10
  211. package/components/Typography/index.d.ts +0 -1
  212. package/components/component.enums.d.ts +0 -25
  213. package/components/component.interfaces.d.ts +0 -18
  214. package/components/index.d.ts +0 -41
  215. package/hooks/index.d.ts +0 -4
  216. package/hooks/useConstructor.d.ts +0 -1
  217. package/hooks/useDebounce.d.ts +0 -2
  218. package/hooks/useHover.d.ts +0 -2
  219. package/hooks/useWindowSize.d.ts +0 -4
  220. package/icons/CaretDownSolidIcon.d.ts +0 -2
  221. package/icons/CheckSolidIcon.d.ts +0 -2
  222. package/icons/CheckSquareRegularIcon.d.ts +0 -2
  223. package/icons/ChevronDownSolidIcon.d.ts +0 -2
  224. package/icons/ChevronLeftSolidIcon.d.ts +0 -2
  225. package/icons/ChevronRightSolidIcon.d.ts +0 -2
  226. package/icons/ChevronUpSolidIcon.d.ts +0 -2
  227. package/icons/CircleSolidIcon.d.ts +0 -2
  228. package/icons/HomeSolidIcon.d.ts +0 -2
  229. package/icons/PlusSolidIcon.d.ts +0 -2
  230. package/icons/SpinnerSolidIcon.d.ts +0 -2
  231. package/icons/SquareRegularIcon.d.ts +0 -2
  232. package/icons/TimesCircleSolidIcon.d.ts +0 -2
  233. package/icons/TimesSolidIcon.d.ts +0 -2
  234. package/icons/index.d.ts +0 -14
  235. package/index.d.ts +0 -3
  236. package/index.es.js +0 -2601
  237. package/index.js +0 -2717
package/index.js DELETED
@@ -1,2717 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var React = require('react');
6
- var reactDom = require('react-dom');
7
- var core = require('@popperjs/core');
8
-
9
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
10
-
11
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
12
-
13
- /*! *****************************************************************************
14
- Copyright (c) Microsoft Corporation.
15
-
16
- Permission to use, copy, modify, and/or distribute this software for any
17
- purpose with or without fee is hereby granted.
18
-
19
- THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
20
- REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
21
- AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
22
- INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
23
- LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
24
- OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
25
- PERFORMANCE OF THIS SOFTWARE.
26
- ***************************************************************************** */
27
-
28
- function __rest(s, e) {
29
- var t = {};
30
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
31
- t[p] = s[p];
32
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
33
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
34
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
35
- t[p[i]] = s[p[i]];
36
- }
37
- return t;
38
- }
39
-
40
- exports.COLOR = void 0;
41
- (function (COLOR) {
42
- COLOR["primary"] = "primary";
43
- COLOR["accent"] = "accent";
44
- COLOR["secondary"] = "secondary";
45
- // danger = 'danger',
46
- COLOR["light"] = "light";
47
- COLOR["dark"] = "dark";
48
- })(exports.COLOR || (exports.COLOR = {}));
49
- exports.VARIANT = void 0;
50
- (function (VARIANT) {
51
- VARIANT["contained"] = "contained";
52
- VARIANT["outline"] = "outline";
53
- VARIANT["text"] = "text";
54
- })(exports.VARIANT || (exports.VARIANT = {}));
55
- exports.SIZE = void 0;
56
- (function (SIZE) {
57
- SIZE["sm"] = "sm";
58
- SIZE["md"] = "md";
59
- SIZE["lg"] = "lg";
60
- })(exports.SIZE || (exports.SIZE = {}));
61
- exports.POSITION = void 0;
62
- (function (POSITION) {
63
- POSITION["right"] = "right";
64
- POSITION["left"] = "left";
65
- })(exports.POSITION || (exports.POSITION = {}));
66
- const STATUS = {
67
- HOVERED: 'hovered',
68
- NORMAL: 'normal',
69
- };
70
-
71
- function styleInject(css, ref) {
72
- if ( ref === void 0 ) ref = {};
73
- var insertAt = ref.insertAt;
74
-
75
- if (!css || typeof document === 'undefined') { return; }
76
-
77
- var head = document.head || document.getElementsByTagName('head')[0];
78
- var style = document.createElement('style');
79
- style.type = 'text/css';
80
-
81
- if (insertAt === 'top') {
82
- if (head.firstChild) {
83
- head.insertBefore(style, head.firstChild);
84
- } else {
85
- head.appendChild(style);
86
- }
87
- } else {
88
- head.appendChild(style);
89
- }
90
-
91
- if (style.styleSheet) {
92
- style.styleSheet.cssText = css;
93
- } else {
94
- style.appendChild(document.createTextNode(css));
95
- }
96
- }
97
-
98
- var css_248z$X = ".Alert-module_alert__b4tbk {\n border-radius: var(--borderRadius);\n padding: 6px 16px; }\n\n.Alert-module_contained__EM0x6.Alert-module_primary__q4pNj {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n\n.Alert-module_contained__EM0x6.Alert-module_accent__a2WIl {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n\n.Alert-module_contained__EM0x6.Alert-module_secondary__syXKX {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n\n.Alert-module_contained__EM0x6.Alert-module_light__VKCXF {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n\n.Alert-module_contained__EM0x6.Alert-module_dark__3c-Hm {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n\n.Alert-module_outline__T2262.Alert-module_primary__q4pNj {\n color: var(--primary) !important;\n border: 1px solid var(--primary) !important; }\n\n.Alert-module_outline__T2262.Alert-module_secondary__syXKX {\n color: var(--secondary) !important;\n border: 1px solid var(--secondary) !important; }\n\n.Alert-module_outline__T2262.Alert-module_accent__a2WIl {\n color: var(--accent) !important;\n border: 1px solid var(--accent) !important; }\n\n.Alert-module_outline__T2262.Alert-module_light__VKCXF {\n color: var(--light-contrast-text) !important;\n border: 1px solid var(--light) !important; }\n\n.Alert-module_outline__T2262.Alert-module_dark__3c-Hm {\n color: var(--dark) !important;\n border: 1px solid var(--dark) !important; }\n";
99
- var styles$X = {"alert":"Alert-module_alert__b4tbk","contained":"Alert-module_contained__EM0x6","primary":"Alert-module_primary__q4pNj","accent":"Alert-module_accent__a2WIl","secondary":"Alert-module_secondary__syXKX","light":"Alert-module_light__VKCXF","dark":"Alert-module_dark__3c-Hm","outline":"Alert-module_outline__T2262"};
100
- styleInject(css_248z$X);
101
-
102
- const Alert = (props) => {
103
- const { children, className, color = exports.COLOR.primary, variant = exports.VARIANT.contained, shadow = true } = props, rest = __rest(props, ["children", "className", "color", "variant", "shadow"]);
104
- const getCssClasses = () => {
105
- const cssClasses = [];
106
- cssClasses.push(styles$X.alert);
107
- if (variant === exports.VARIANT.contained) {
108
- cssClasses.push(styles$X.contained);
109
- cssClasses.push(styles$X[color]);
110
- }
111
- if (variant === exports.VARIANT.outline) {
112
- cssClasses.push(styles$X.outline);
113
- cssClasses.push(styles$X[color]);
114
- }
115
- shadow && cssClasses.push(styles$X['shadow']);
116
- className && cssClasses.push(className);
117
- return cssClasses.filter(r => r).join(' ');
118
- };
119
- return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
120
- };
121
-
122
- var css_248z$W = ".AppBar-module_appbar__Neyh3 {\n padding: 0.5rem 1rem;\n display: flex;\n z-index: 1000;\n min-height: 64px;\n flex-shrink: 0; }\n .AppBar-module_appbar__Neyh3.AppBar-module_primary__xMqXD {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .AppBar-module_appbar__Neyh3.AppBar-module_secondary__8MkLA {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .AppBar-module_appbar__Neyh3.AppBar-module_accent__vHbkp {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .AppBar-module_appbar__Neyh3.AppBar-module_light__HGy3y {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .AppBar-module_appbar__Neyh3.AppBar-module_dark__ILq96 {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n .AppBar-module_appbar__Neyh3.AppBar-module_shadow__gQN8s {\n box-shadow: var(--shadow); }\n";
123
- var styles$W = {"appbar":"AppBar-module_appbar__Neyh3","primary":"AppBar-module_primary__xMqXD","secondary":"AppBar-module_secondary__8MkLA","accent":"AppBar-module_accent__vHbkp","light":"AppBar-module_light__HGy3y","dark":"AppBar-module_dark__ILq96","shadow":"AppBar-module_shadow__gQN8s"};
124
- styleInject(css_248z$W);
125
-
126
- const AppBar = (props) => {
127
- const { children, className, color = exports.COLOR.primary, shadow = true } = props, rest = __rest(props, ["children", "className", "color", "shadow"]);
128
- const getCssClasses = () => {
129
- const cssClasses = [];
130
- cssClasses.push(styles$W[color]);
131
- cssClasses.push(styles$W.appbar);
132
- shadow && cssClasses.push(styles$W['shadow']);
133
- className && cssClasses.push(className);
134
- return cssClasses.filter(r => r).join(' ');
135
- };
136
- return (React__default["default"].createElement("nav", Object.assign({ className: getCssClasses() }, rest), children));
137
- };
138
-
139
- var css_248z$V = ".AppBarTitle-module_appbarTitle__RsFg5 {\n align-items: center;\n padding-top: 0.3125rem;\n padding-bottom: 0.3125rem;\n font-size: 1.25rem;\n line-height: 1.8;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden !important;\n display: inline-block; }\n .AppBarTitle-module_appbarTitle__RsFg5:hover {\n cursor: pointer; }\n";
140
- var styles$V = {"appbarTitle":"AppBarTitle-module_appbarTitle__RsFg5"};
141
- styleInject(css_248z$V);
142
-
143
- const AppBarTitle = (props) => {
144
- const { children, className, onClick } = props;
145
- const getCssClass = () => {
146
- const cssClasses = [];
147
- cssClasses.push(styles$V.appbarTitle);
148
- className && cssClasses.push(className);
149
- return cssClasses.filter(r => r).join(' ');
150
- };
151
- return (React__default["default"].createElement("div", { className: getCssClass(), onClick: onClick }, children));
152
- };
153
-
154
- var css_248z$U = ".Icon-module_icon__lFKCA {\n align-items: center;\n justify-content: center;\n display: flex;\n width: 20px;\n height: 20px; }\n .Icon-module_icon__lFKCA svg {\n width: inherit;\n height: inherit; }\n .Icon-module_icon__lFKCA.Icon-module_primary__3fID- {\n color: var(--primary); }\n .Icon-module_icon__lFKCA.Icon-module_accent__aZXGb {\n color: var(--accent); }\n .Icon-module_icon__lFKCA.Icon-module_secondary__HKKop {\n color: var(--secondary); }\n .Icon-module_icon__lFKCA.Icon-module_light__-ApMm {\n color: var(--light); }\n .Icon-module_icon__lFKCA.Icon-module_dark__DpCIK {\n color: var(--dark); }\n";
155
- var styles$U = {"icon":"Icon-module_icon__lFKCA","primary":"Icon-module_primary__3fID-","accent":"Icon-module_accent__aZXGb","secondary":"Icon-module_secondary__HKKop","light":"Icon-module_light__-ApMm","dark":"Icon-module_dark__DpCIK"};
156
- styleInject(css_248z$U);
157
-
158
- const Icon = (props) => {
159
- const { children, iconColor, className } = props, rest = __rest(props, ["children", "iconColor", "className"]);
160
- const getCssClasses = () => {
161
- const cssClasses = [];
162
- cssClasses.push(styles$U.icon);
163
- iconColor && cssClasses.push(styles$U[iconColor]);
164
- className && cssClasses.push(className);
165
- return cssClasses.filter(css => css).join(' ');
166
- };
167
- return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
168
- };
169
-
170
- var css_248z$T = ".IconButton-module_iconButton__rpCPQ {\n border-radius: 100%;\n padding: 0px;\n display: flex;\n flex-shrink: 0;\n justify-content: center;\n align-items: center;\n min-width: auto;\n box-shadow: none;\n font-weight: 400;\n text-align: center;\n vertical-align: middle;\n -webkit-user-select: none;\n user-select: none;\n background-color: transparent;\n font-size: 1rem;\n line-height: 1.5;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n border: none; }\n .IconButton-module_iconButton__rpCPQ:hover {\n cursor: pointer; }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_shadow__Uw0RK {\n box-shadow: var(--shadow); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_md__XnuSk {\n width: 48px;\n height: 48px; }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_lg__arEvo {\n width: 56px;\n height: 56px; }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag {\n padding: 0;\n background: transparent;\n color: inherit; }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_active__VIqU9 {\n background-color: rgba(0, 0, 0, 0.04); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_primary__vbo-G {\n color: var(--primary); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_primary__vbo-G:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_primary__vbo-G.IconButton-module_active__VIqU9 {\n color: var(--primary-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_secondary__AiNAY {\n color: var(--secondary); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_secondary__AiNAY:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_secondary__AiNAY.IconButton-module_active__VIqU9 {\n color: var(--secondary-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_accent__QRzM2 {\n color: var(--accent); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_accent__QRzM2:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_accent__QRzM2.IconButton-module_active__VIqU9 {\n color: var(--accent-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_light__YNEiO {\n color: var(--light); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_light__YNEiO:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_light__YNEiO.IconButton-module_active__VIqU9 {\n color: var(--light-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_dark__gnbUH {\n color: var(--dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_dark__gnbUH:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_dark__gnbUH.IconButton-module_active__VIqU9 {\n color: var(--dark-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_disabled__QB0ZV {\n color: rgba(0, 0, 0, 0.26);\n background-color: transparent;\n cursor: default;\n pointer-events: none; }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_active__VIqU9 {\n background-color: rgba(0, 0, 0, 0.04); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_primary__vbo-G {\n background-color: var(--primary);\n color: var(--white); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_primary__vbo-G:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_primary__vbo-G.IconButton-module_active__VIqU9 {\n background-color: var(--primary-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_secondary__AiNAY {\n background-color: var(--secondary);\n color: var(--white); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_secondary__AiNAY:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_secondary__AiNAY.IconButton-module_active__VIqU9 {\n background-color: var(--secondary-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_accent__QRzM2 {\n background-color: var(--accent);\n color: var(--white); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_accent__QRzM2:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_accent__QRzM2.IconButton-module_active__VIqU9 {\n background-color: var(--accent-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_light__YNEiO {\n background-color: var(--light);\n color: var(--dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_light__YNEiO:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_light__YNEiO.IconButton-module_active__VIqU9 {\n background-color: var(--light-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_dark__gnbUH {\n background-color: var(--dark);\n color: var(--white); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_dark__gnbUH:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_dark__gnbUH.IconButton-module_active__VIqU9 {\n background-color: var(--dark-light); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_disabled__QB0ZV {\n color: rgba(0, 0, 0, 0.26);\n background-color: transparent;\n cursor: default;\n pointer-events: none; }\n";
171
- var styles$T = {"iconButton":"IconButton-module_iconButton__rpCPQ","shadow":"IconButton-module_shadow__Uw0RK","md":"IconButton-module_md__XnuSk","lg":"IconButton-module_lg__arEvo","text":"IconButton-module_text__Ualag","active":"IconButton-module_active__VIqU9","primary":"IconButton-module_primary__vbo-G","secondary":"IconButton-module_secondary__AiNAY","accent":"IconButton-module_accent__QRzM2","light":"IconButton-module_light__YNEiO","dark":"IconButton-module_dark__gnbUH","disabled":"IconButton-module_disabled__QB0ZV","contained":"IconButton-module_contained__k7vGA"};
172
- styleInject(css_248z$T);
173
-
174
- const IconButton = (props) => {
175
- const { children, icon, variant = exports.VARIANT.text, color = exports.COLOR.dark, size = exports.SIZE.md, isActive, disabled, className, shadow } = props, rest = __rest(props, ["children", "icon", "variant", "color", "size", "isActive", "disabled", "className", "shadow"]);
176
- const getCssClasses = () => {
177
- const cssClasses = [];
178
- cssClasses.push(styles$T[color]);
179
- cssClasses.push(styles$T[variant]);
180
- cssClasses.push(styles$T[size]);
181
- cssClasses.push(styles$T.iconButton);
182
- isActive && cssClasses.push(styles$T.active);
183
- disabled && cssClasses.push(styles$T.disabled);
184
- shadow && cssClasses.push(styles$T.shadow);
185
- className && cssClasses.push(className);
186
- return cssClasses.filter(css => css).join(' ');
187
- };
188
- return (React__default["default"].createElement("button", Object.assign({ type: "button", className: getCssClasses(), disabled: disabled }, rest),
189
- icon && React__default["default"].createElement(Icon, null, icon),
190
- children));
191
- };
192
-
193
- const CaretDownSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", "data-prefix": "fas", "data-icon": "caret-down", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 320 512" },
194
- React__default["default"].createElement("path", { fill: "currentColor", d: "M31.3 192h257.3c17.8 0 26.7 21.5 14.1 34.1L174.1 354.8c-7.8 7.8-20.5 7.8-28.3 0L17.2 226.1C4.6 213.5 13.5 192 31.3 192z" })));
195
-
196
- const CheckSquareRegularIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", "data-prefix": "far", "data-icon": "check-square", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512" },
197
- React__default["default"].createElement("path", { fill: "currentColor", d: "M400 32H48C21.49 32 0 53.49 0 80v352c0 26.51 21.49 48 48 48h352c26.51 0 48-21.49 48-48V80c0-26.51-21.49-48-48-48zm0 400H48V80h352v352zm-35.864-241.724L191.547 361.48c-4.705 4.667-12.303 4.637-16.97-.068l-90.781-91.516c-4.667-4.705-4.637-12.303.069-16.971l22.719-22.536c4.705-4.667 12.303-4.637 16.97.069l59.792 60.277 141.352-140.216c4.705-4.667 12.303-4.637 16.97.068l22.536 22.718c4.667 4.706 4.637 12.304-.068 16.971z" })));
198
-
199
- const ChevronDownSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", "data-prefix": "fas", "data-icon": "chevron-down", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512" },
200
- React__default["default"].createElement("path", { fill: "currentColor", d: "M207.029 381.476L12.686 187.132c-9.373-9.373-9.373-24.569 0-33.941l22.667-22.667c9.357-9.357 24.522-9.375 33.901-.04L224 284.505l154.745-154.021c9.379-9.335 24.544-9.317 33.901.04l22.667 22.667c9.373 9.373 9.373 24.569 0 33.941L240.971 381.476c-9.373 9.372-24.569 9.372-33.942 0z" })));
201
-
202
- const ChevronRightSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", "data-prefix": "fas", "data-icon": "chevron-right", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 320 512" },
203
- React__default["default"].createElement("path", { fill: "currentColor", d: "M285.476 272.971L91.132 467.314c-9.373 9.373-24.569 9.373-33.941 0l-22.667-22.667c-9.357-9.357-9.375-24.522-.04-33.901L188.505 256 34.484 101.255c-9.335-9.379-9.317-24.544.04-33.901l22.667-22.667c9.373-9.373 24.569-9.373 33.941 0L285.475 239.03c9.373 9.372 9.373 24.568.001 33.941z" })));
204
-
205
- const ChevronUpSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", "data-prefix": "fas", "data-icon": "chevron-up", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512" },
206
- React__default["default"].createElement("path", { fill: "currentColor", d: "M240.971 130.524l194.343 194.343c9.373 9.373 9.373 24.569 0 33.941l-22.667 22.667c-9.357 9.357-24.522 9.375-33.901.04L224 227.495 69.255 381.516c-9.379 9.335-24.544 9.317-33.901-.04l-22.667-22.667c-9.373-9.373-9.373-24.569 0-33.941L207.03 130.525c9.372-9.373 24.568-9.373 33.941-.001z" })));
207
-
208
- const HomeSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", "data-prefix": "fas", "data-icon": "home", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 576 512" },
209
- React__default["default"].createElement("path", { fill: "currentColor", d: "M280.37 148.26L96 300.11V464a16 16 0 0 0 16 16l112.06-.29a16 16 0 0 0 15.92-16V368a16 16 0 0 1 16-16h64a16 16 0 0 1 16 16v95.64a16 16 0 0 0 16 16.05L464 480a16 16 0 0 0 16-16V300L295.67 148.26a12.19 12.19 0 0 0-15.3 0zM571.6 251.47L488 182.56V44.05a12 12 0 0 0-12-12h-56a12 12 0 0 0-12 12v72.61L318.47 43a48 48 0 0 0-61 0L4.34 251.47a12 12 0 0 0-1.6 16.9l25.5 31A12 12 0 0 0 45.15 301l235.22-193.74a12.19 12.19 0 0 1 15.3 0L530.9 301a12 12 0 0 0 16.9-1.6l25.5-31a12 12 0 0 0-1.7-16.93z" })));
210
-
211
- const SquareRegularIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", "data-prefix": "far", "data-icon": "square", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512" },
212
- React__default["default"].createElement("path", { fill: "currentColor", d: "M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zm-6 400H54c-3.3 0-6-2.7-6-6V86c0-3.3 2.7-6 6-6h340c3.3 0 6 2.7 6 6v340c0 3.3-2.7 6-6 6z" })));
213
-
214
- const TimesCircleSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512" },
215
- React__default["default"].createElement("path", { fill: "currentColor", d: "M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8zm121.6 313.1c4.7 4.7 4.7 12.3 0 17L338 377.6c-4.7 4.7-12.3 4.7-17 0L256 312l-65.1 65.6c-4.7 4.7-12.3 4.7-17 0L134.4 338c-4.7-4.7-4.7-12.3 0-17l65.6-65-65.6-65.1c-4.7-4.7-4.7-12.3 0-17l39.6-39.6c4.7-4.7 12.3-4.7 17 0l65 65.7 65.1-65.6c4.7-4.7 12.3-4.7 17 0l39.6 39.6c4.7 4.7 4.7 12.3 0 17L312 256l65.6 65.1z" })));
216
-
217
- const TimesSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 352 512" },
218
- React__default["default"].createElement("path", { fill: "currentColor", d: "M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z" })));
219
-
220
- const SpinnerSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", "data-prefix": "fas", "data-icon": "spinner", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512" },
221
- React__default["default"].createElement("path", { fill: "currentColor", d: "M304 48c0 26.51-21.49 48-48 48s-48-21.49-48-48 21.49-48 48-48 48 21.49 48 48zm-48 368c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48-21.49-48-48-48zm208-208c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48-21.49-48-48-48zM96 256c0-26.51-21.49-48-48-48S0 229.49 0 256s21.49 48 48 48 48-21.49 48-48zm12.922 99.078c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48c0-26.509-21.491-48-48-48zm294.156 0c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48c0-26.509-21.49-48-48-48zM108.922 60.922c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48-21.491-48-48-48z" })));
222
-
223
- const PlusSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512" },
224
- React__default["default"].createElement("path", { fill: "currentColor", d: "M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z" })));
225
-
226
- const CheckSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512" },
227
- React__default["default"].createElement("path", { fill: "currentColor", d: "M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z" })));
228
-
229
- const CircleSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512" },
230
- React__default["default"].createElement("path", { fill: "currentColor", d: "M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8z" })));
231
-
232
- const ChevronLeftSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 320 512" },
233
- React__default["default"].createElement("path", { fill: "currentColor", d: "M34.52 239.03L228.87 44.69c9.37-9.37 24.57-9.37 33.94 0l22.67 22.67c9.36 9.36 9.37 24.52.04 33.9L131.49 256l154.02 154.75c9.34 9.38 9.32 24.54-.04 33.9l-22.67 22.67c-9.37 9.37-24.57 9.37-33.94 0L34.52 272.97c-9.37-9.37-9.37-24.57 0-33.94z" })));
234
-
235
- function useWindowSize() {
236
- const [windowSize, setWindowSize] = React.useState({
237
- width: 0,
238
- height: 0,
239
- });
240
- React.useEffect(() => {
241
- function handleResize() {
242
- setWindowSize({
243
- width: window.innerWidth,
244
- height: window.innerHeight,
245
- });
246
- }
247
- window.addEventListener("resize", handleResize);
248
- handleResize();
249
- return () => window.removeEventListener("resize", handleResize);
250
- }, []);
251
- return windowSize;
252
- }
253
-
254
- function useHover() {
255
- const [value, setValue] = React.useState(false);
256
- const ref = React.useRef(null);
257
- const handleMouseOver = () => setValue(true);
258
- const handleMouseOut = () => setValue(false);
259
- React.useEffect(() => {
260
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
261
- const node = ref.current;
262
- if (node) {
263
- node.addEventListener("mouseover", handleMouseOver);
264
- node.addEventListener("mouseout", handleMouseOut);
265
- return () => {
266
- node.removeEventListener("mouseover", handleMouseOver);
267
- node.removeEventListener("mouseout", handleMouseOut);
268
- };
269
- }
270
- return;
271
- }, [ref.current] // Recall only if ref changes
272
- );
273
- return [ref, value];
274
- }
275
-
276
- const useConstructor = (callBack) => {
277
- const [hasBeenCalled, setHasBeenCalled] = React.useState(false);
278
- if (hasBeenCalled)
279
- return;
280
- callBack();
281
- setHasBeenCalled(true);
282
- };
283
-
284
- function useDebounce(callback, timeout, deps) {
285
- const timeoutId = React.useRef();
286
- React.useEffect(() => {
287
- clearTimeout(timeoutId.current);
288
- timeoutId.current = setTimeout(callback, timeout);
289
- return () => clearTimeout(timeoutId.current);
290
- }, deps);
291
- }
292
-
293
- const Backdrop = (props) => {
294
- const { target = document.body, isTransparent = false, onClick, style } = props, rest = __rest(props, ["target", "isTransparent", "onClick", "style"]);
295
- const handleClick = (e) => {
296
- e.stopPropagation();
297
- onClick && onClick(e);
298
- };
299
- const getCssClasses = () => {
300
- const cssClasses = [];
301
- cssClasses.push(`modal-backdrop fade show`);
302
- if (isTransparent) {
303
- cssClasses.push(`bg-transparent`);
304
- }
305
- return cssClasses.filter(css => css).join(' ');
306
- };
307
- const getStyles = () => {
308
- const styles = Object.assign({ height: '100%', width: '100%', position: 'absolute' }, style);
309
- return styles;
310
- };
311
- return (reactDom.createPortal(React__default["default"].createElement("div", Object.assign({ className: getCssClasses(), onClick: handleClick, style: getStyles() }, rest)), target));
312
- };
313
-
314
- var css_248z$S = ".List-module_list__gpZ41 {\n width: 100%;\n display: flex;\n flex-direction: column;\n padding-left: 0;\n margin-bottom: 0;\n margin-top: 0;\n background-color: var(--white); }\n";
315
- var styles$S = {"list":"List-module_list__gpZ41"};
316
- styleInject(css_248z$S);
317
-
318
- const List = (props) => {
319
- const { children, className, isFlush } = props, rest = __rest(props, ["children", "className", "isFlush"]);
320
- const getCssClasses = () => {
321
- const cssClasses = [];
322
- isFlush && cssClasses.push(styles$S.flush);
323
- cssClasses.push(styles$S.list);
324
- className && cssClasses.push(className);
325
- return cssClasses.filter(css => css).join(' ');
326
- };
327
- return (React__default["default"].createElement("ul", Object.assign({ className: getCssClasses() }, rest), children));
328
- };
329
-
330
- var css_248z$R = ".ListItem-module_listItem__Pk1AP {\n display: flex;\n align-items: center;\n position: relative;\n padding: 0.75rem 1.25rem;\n min-width: 100%;\n color: var(--bodyColor);\n text-align: inherit;\n transition: background 0.5s ease; }\n .ListItem-module_listItem__Pk1AP:hover, .ListItem-module_listItem__Pk1AP.ListItem-module_active__zm2q8 {\n cursor: pointer;\n z-index: 1;\n text-decoration: none;\n background-color: rgba(0, 0, 0, 0.04);\n color: var(--primary); }\n .ListItem-module_listItem__Pk1AP + .ListItem-module_listItem__Pk1AP {\n border-top-width: 0; }\n .ListItem-module_listItem__Pk1AP.ListItem-module_primary__F6Qja {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .ListItem-module_listItem__Pk1AP.ListItem-module_accent__pg3Ha {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .ListItem-module_listItem__Pk1AP.ListItem-module_secondary__d0drD {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .ListItem-module_listItem__Pk1AP.ListItem-module_light__37kby {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .ListItem-module_listItem__Pk1AP.ListItem-module_dark__ZxQTF {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n .ListItem-module_listItem__Pk1AP.ListItem-module_disabled__DQLKl {\n color: rgba(0, 0, 0, 0.26); }\n .ListItem-module_listItem__Pk1AP.ListItem-module_disabled__DQLKl:hover {\n cursor: not-allowed;\n background-color: inherit; }\n";
331
- var styles$R = {"listItem":"ListItem-module_listItem__Pk1AP","active":"ListItem-module_active__zm2q8","primary":"ListItem-module_primary__F6Qja","accent":"ListItem-module_accent__pg3Ha","secondary":"ListItem-module_secondary__d0drD","light":"ListItem-module_light__37kby","dark":"ListItem-module_dark__ZxQTF","disabled":"ListItem-module_disabled__DQLKl"};
332
- styleInject(css_248z$R);
333
-
334
- const ListItem = (props) => {
335
- const { children, color, active, className, disabled, onClick } = props, rest = __rest(props, ["children", "color", "active", "className", "disabled", "onClick"]);
336
- const getCssClasses = () => {
337
- const cssClasses = [];
338
- cssClasses.push(styles$R.listItem);
339
- color && cssClasses.push(styles$R[color]);
340
- active && cssClasses.push(styles$R['active']);
341
- disabled && cssClasses.push(styles$R['disabled']);
342
- className && cssClasses.push(className);
343
- return cssClasses.filter(css => css).join(' ');
344
- };
345
- const handleClick = (e) => {
346
- !disabled && onClick && onClick(e);
347
- };
348
- return (React__default["default"].createElement("li", Object.assign({ onClick: handleClick, className: getCssClasses() }, rest), children));
349
- };
350
-
351
- var css_248z$Q = ".ListItemAvatar-module_avatar__sVWfR {\n margin-right: 16px; }\n .ListItemAvatar-module_avatar__sVWfR svg, .ListItemAvatar-module_avatar__sVWfR img {\n width: 24px;\n height: 24px; }\n .ListItemAvatar-module_avatar__sVWfR img {\n border-radius: 50%; }\n";
352
- var styles$Q = {"avatar":"ListItemAvatar-module_avatar__sVWfR"};
353
- styleInject(css_248z$Q);
354
-
355
- const ListItemAvatar = (_a) => {
356
- var { avatar } = _a, rest = __rest(_a, ["avatar"]);
357
- return (React__default["default"].createElement("div", Object.assign({ className: styles$Q.avatar }, rest), avatar));
358
- };
359
-
360
- var css_248z$P = ".ListItemIcon-module_icon__cCvEv {\n margin-right: 32px; }\n .ListItemIcon-module_icon__cCvEv svg {\n width: 24px;\n height: 24px; }\n";
361
- var styles$P = {"icon":"ListItemIcon-module_icon__cCvEv"};
362
- styleInject(css_248z$P);
363
-
364
- const ListItemIcon = (_a) => {
365
- var { icon } = _a, rest = __rest(_a, ["icon"]);
366
- return (React__default["default"].createElement("div", Object.assign({ className: styles$P.icon }, rest), icon));
367
- };
368
-
369
- var css_248z$O = ".ListItemAction-module_listItemAction__gAQRj {\n display: flex;\n justify-content: center;\n min-width: 40px; }\n .ListItemAction-module_listItemAction__gAQRj svg {\n width: 20px;\n height: 20px; }\n";
370
- var styles$O = {"listItemAction":"ListItemAction-module_listItemAction__gAQRj"};
371
- styleInject(css_248z$O);
372
-
373
- const ListItemAction = (_a) => {
374
- var { children, onClick } = _a, rest = __rest(_a, ["children", "onClick"]);
375
- return (React__default["default"].createElement("div", Object.assign({ className: styles$O.listItemAction, onClick: e => onClick && onClick(e) }, rest), children));
376
- };
377
-
378
- var css_248z$N = ".ListItemTextIcon-module_listItemText__xCBLW {\n flex: 1; }\n";
379
- var styles$N = {"listItemText":"ListItemTextIcon-module_listItemText__xCBLW"};
380
- styleInject(css_248z$N);
381
-
382
- const ListItemText = (_a) => {
383
- var { primary, secondary } = _a, rest = __rest(_a, ["primary", "secondary"]);
384
- const getCssClasses = () => {
385
- const cssClasses = [];
386
- cssClasses.push(styles$N.listItemText);
387
- return cssClasses.filter(css => css).join(' ');
388
- };
389
- return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest),
390
- React__default["default"].createElement(ListItemTextPrimary, null, primary),
391
- secondary &&
392
- React__default["default"].createElement(ListItemTextSecondary, null, secondary)));
393
- };
394
- const ListItemTextPrimary = ({ children }) => (React__default["default"].createElement("div", { className: "list-item-text-primary" }, children));
395
- const ListItemTextSecondary = ({ children }) => (React__default["default"].createElement("div", { className: "list-item-text-secondary text-muted", style: { fontSize: '0.875rem' } }, children));
396
-
397
- var css_248z$M = ".AutoComplete-module_selectContainer__1kA85 {\n position: relative; }\n\n.AutoComplete-module_select__NNYOi {\n min-height: calc(1.5em + 0.75rem + 2px);\n height: auto;\n display: flex; }\n .AutoComplete-module_select__NNYOi:hover {\n cursor: pointer; }\n\n.AutoComplete-module_selectMenu__Gu81L {\n background-color: var(--light);\n position: absolute;\n box-shadow: var(--shadow);\n border-radius: var(--borderRadius);\n width: 100%;\n top: 38px;\n z-index: 1050;\n max-height: 280px;\n overflow: auto; }\n";
398
- var styles$M = {"selectContainer":"AutoComplete-module_selectContainer__1kA85","select":"AutoComplete-module_select__NNYOi","selectMenu":"AutoComplete-module_selectMenu__Gu81L"};
399
- styleInject(css_248z$M);
400
-
401
- // preset value
402
- // enter -> delay? -> show results
403
- // single
404
- // multiple
405
- // custom template render items
406
- const AutoComplete = (props) => {
407
- const { id, name, className, options = [], openOnFocus = true, disabled, readOnly, debounce = 0, placeholder, showNoEntry = true, showClearButton, onChange, onSelect, value } = props;
408
- const [model, setModel] = React.useState('');
409
- const [searchText, setSearchText] = React.useState('');
410
- const [isShow, setIsShow] = React.useState(false);
411
- const [optionsTemp, setOptionsTemp] = React.useState([]);
412
- const selectConainter = React.useRef(null);
413
- React.useEffect(() => {
414
- if (value !== model) {
415
- const option = options.find(o => o.value === value);
416
- setModel(option ? option.label : '');
417
- }
418
- }, [value]);
419
- React.useEffect(() => {
420
- if (options && options.length > 0) {
421
- const optionsOrigin = JSON.parse(JSON.stringify(options));
422
- const regex = new RegExp(searchText.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&'), 'gi');
423
- const optionsFiltered = optionsOrigin.filter(o => { var _a; return (_a = o.label) === null || _a === void 0 ? void 0 : _a.match(regex); });
424
- if (optionsFiltered.length === 0 && showNoEntry) {
425
- setOptionsTemp([{ value: '', label: '- no entry found -' }]);
426
- }
427
- else {
428
- setOptionsTemp(optionsFiltered);
429
- }
430
- }
431
- }, [options]);
432
- useDebounce(() => { onChange && onChange(searchText); }, debounce, [searchText]);
433
- React.useEffect(() => {
434
- if (isShow === true) {
435
- document.body.classList.add('modal-open');
436
- const main = document.querySelector('.main');
437
- main === null || main === void 0 ? void 0 : main.classList.add('modal-open');
438
- }
439
- else {
440
- document.body.classList.remove('modal-open');
441
- const main = document.querySelector('.main');
442
- main === null || main === void 0 ? void 0 : main.classList.remove('modal-open');
443
- }
444
- }, [isShow]);
445
- React.useEffect(() => {
446
- return () => {
447
- document.body.classList.remove('modal-open');
448
- const main = document.querySelector('.main');
449
- main === null || main === void 0 ? void 0 : main.classList.remove('modal-open');
450
- };
451
- }, []);
452
- const getCssClass = () => {
453
- const cssClasses = [];
454
- className && cssClasses.push(className);
455
- cssClasses.push(styles$M.select);
456
- return cssClasses.filter(r => r).join(' ');
457
- };
458
- const show = () => setIsShow(true);
459
- const hide = () => setIsShow(false);
460
- const handleOnClick = (option) => {
461
- if (model !== option.value) {
462
- onSelect && onSelect(option);
463
- }
464
- setModel(option.label);
465
- hide();
466
- };
467
- const handleOnChange = (e) => {
468
- setModel(e.target.value);
469
- setSearchText(e.target.value);
470
- show();
471
- };
472
- const handleOnFocus = () => {
473
- openOnFocus && show();
474
- };
475
- const handleClickReset = () => {
476
- setModel('');
477
- setSearchText('');
478
- };
479
- return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$M.selectContainer },
480
- React__default["default"].createElement("div", { className: "d-flex" },
481
- React__default["default"].createElement("input", { type: "text", className: getCssClass(), id: id, name: name, tabIndex: 0, readOnly: readOnly, disabled: disabled, onChange: handleOnChange, onFocus: handleOnFocus, placeholder: placeholder, value: model }),
482
- showClearButton && (model === null || model === void 0 ? void 0 : model.length) > 0 &&
483
- React__default["default"].createElement(IconButton, { icon: React__default["default"].createElement(TimesSolidIcon, null), onClick: handleClickReset })),
484
- isShow &&
485
- React__default["default"].createElement(React__default["default"].Fragment, null,
486
- React__default["default"].createElement("div", { className: styles$M.selectMenu },
487
- React__default["default"].createElement(List, null, optionsTemp && optionsTemp.map((option, index) => React__default["default"].createElement(ListItem, { id: `list-item-${index}`, key: option.value, onClick: () => handleOnClick(option), disabled: !option.value },
488
- React__default["default"].createElement(ListItemText, { primary: option.label ? option.label : option.value }))))),
489
- React__default["default"].createElement(Backdrop, { isTransparent: true, onClick: () => hide() }))));
490
- };
491
-
492
- var css_248z$L = ".Badge-module_badgeContainer__3nZBs {\n display: inline-flex;\n position: relative;\n flex-shrink: 0;\n vertical-align: middle; }\n\n.Badge-module_badge__9ImR0 {\n top: 0;\n right: 0;\n transform: scale(1) translate(50%, -50%);\n transform-origin: 100% 0%;\n height: 20px;\n display: flex;\n padding: 0 6px;\n z-index: 1;\n position: absolute;\n flex-wrap: wrap;\n font-size: 0.75rem;\n min-width: 20px;\n align-items: center;\n font-weight: 500;\n line-height: 1;\n align-content: center;\n flex-direction: row;\n justify-content: center;\n border-radius: 10px;\n transition: transform 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n .Badge-module_badge__9ImR0.Badge-module_primary__41U-t {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .Badge-module_badge__9ImR0.Badge-module_accent__OQy2- {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .Badge-module_badge__9ImR0.Badge-module_secondary__a9Jfh {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .Badge-module_badge__9ImR0.Badge-module_light__4QvQ5 {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .Badge-module_badge__9ImR0.Badge-module_dark__g1yUJ {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n";
493
- var styles$L = {"badgeContainer":"Badge-module_badgeContainer__3nZBs","badge":"Badge-module_badge__9ImR0","primary":"Badge-module_primary__41U-t","accent":"Badge-module_accent__OQy2-","secondary":"Badge-module_secondary__a9Jfh","light":"Badge-module_light__4QvQ5","dark":"Badge-module_dark__g1yUJ"};
494
- styleInject(css_248z$L);
495
-
496
- const Badge = (props) => {
497
- const { children, content, className, color = exports.COLOR.primary } = props, rest = __rest(props, ["children", "content", "className", "color"]);
498
- const getCssClassesBadgeContainer = () => {
499
- const cssClasses = [];
500
- cssClasses.push(styles$L.badgeContainer);
501
- className && cssClasses.push(className);
502
- return cssClasses.filter(css => css).join(' ');
503
- };
504
- const getCssClassesBadge = () => {
505
- const cssClasses = [];
506
- cssClasses.push(styles$L.badge);
507
- cssClasses.push(styles$L[color]);
508
- return cssClasses.filter(css => css).join(' ');
509
- };
510
- return (React__default["default"].createElement("div", Object.assign({ className: getCssClassesBadgeContainer() }, rest),
511
- children,
512
- React__default["default"].createElement("span", { className: getCssClassesBadge() }, content)));
513
- };
514
-
515
- var css_248z$K = ".Button-module_button__qeIer {\n text-transform: uppercase !important;\n flex-shrink: 0;\n background-color: transparent;\n display: inline-block;\n font-weight: 400;\n line-height: 1.5;\n text-align: center;\n text-decoration: none;\n vertical-align: middle;\n user-select: none;\n border: 1px solid transparent;\n padding: 0.375rem 0.75rem;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n min-width: 64px;\n font-size: 0.875rem;\n border-radius: var(--borderRadius); }\n .Button-module_button__qeIer.Button-module_shadow__6N2nE {\n box-shadow: var(--shadow); }\n\n.Button-module_btnContained__16y5l.Button-module_primary__EUyOu {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .Button-module_btnContained__16y5l.Button-module_primary__EUyOu:hover {\n background-color: var(--primary-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_accent__opVgQ {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .Button-module_btnContained__16y5l.Button-module_accent__opVgQ:hover {\n background-color: var(--accent-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_secondary__zKoGk {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .Button-module_btnContained__16y5l.Button-module_secondary__zKoGk:hover {\n background-color: var(--secondary-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_light__LXeZy {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .Button-module_btnContained__16y5l.Button-module_light__LXeZy:hover {\n background-color: var(--light-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_dark__5oFOT {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n .Button-module_btnContained__16y5l.Button-module_dark__5oFOT:hover {\n background-color: var(--dark-dark); }\n\n.Button-module_btnContained__16y5l:disabled:hover {\n cursor: not-allowed; }\n\n.Button-module_btnText__N5Gys {\n box-shadow: none;\n text-decoration: none; }\n .Button-module_btnText__N5Gys.Button-module_primary__EUyOu {\n color: var(--primary) !important; }\n .Button-module_btnText__N5Gys.Button-module_primary__EUyOu:hover {\n text-decoration: none;\n background: var(--primary-highlight) !important; }\n .Button-module_btnText__N5Gys.Button-module_secondary__zKoGk {\n color: var(--secondary) !important; }\n .Button-module_btnText__N5Gys.Button-module_secondary__zKoGk:hover {\n text-decoration: none;\n background: var(--secondary-highlight) !important; }\n .Button-module_btnText__N5Gys.Button-module_accent__opVgQ {\n color: var(--accent) !important; }\n .Button-module_btnText__N5Gys.Button-module_accent__opVgQ:hover {\n text-decoration: none;\n background: var(--accent-highlight) !important; }\n .Button-module_btnText__N5Gys.Button-module_light__LXeZy {\n color: var(--light-contrast-text) !important; }\n .Button-module_btnText__N5Gys.Button-module_light__LXeZy:hover {\n text-decoration: none;\n background: var(--light-highlight) !important; }\n .Button-module_btnText__N5Gys.Button-module_dark__5oFOT {\n color: var(--dark) !important; }\n .Button-module_btnText__N5Gys.Button-module_dark__5oFOT:hover {\n text-decoration: none;\n background: var(--dark-highlight) !important; }\n\n.Button-module_btnOutline__CCFPI {\n box-shadow: none;\n text-decoration: none; }\n .Button-module_btnOutline__CCFPI.Button-module_primary__EUyOu {\n color: var(--primary) !important;\n border-color: var(--primary) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_primary__EUyOu:hover {\n background: var(--primary-highlight) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_secondary__zKoGk {\n color: var(--secondary) !important;\n border-color: var(--secondary) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_secondary__zKoGk:hover {\n background: var(--secondary-highlight) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_accent__opVgQ {\n color: var(--accent) !important;\n border-color: var(--accent) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_accent__opVgQ:hover {\n background: var(--accent-highlight) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_light__LXeZy {\n color: var(--light-contrast-text) !important;\n border-color: var(--light) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_light__LXeZy:hover {\n background: var(--light-highlight) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_dark__5oFOT {\n color: var(--dark) !important;\n border-color: var(--dark) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_dark__5oFOT:hover {\n background: var(--dark-highlight) !important; }\n\n.Button-module_startIcon__Eylwr {\n display: inherit;\n margin-left: -4px;\n margin-right: 8px; }\n .Button-module_startIcon__Eylwr svg {\n width: 18px;\n height: 18px; }\n\n.Button-module_endIcon__pCffL {\n display: inherit;\n margin-left: 8px; }\n .Button-module_endIcon__pCffL svg {\n width: 18px;\n height: 18px; }\n";
516
- var styles$K = {"button":"Button-module_button__qeIer","shadow":"Button-module_shadow__6N2nE","btnContained":"Button-module_btnContained__16y5l","primary":"Button-module_primary__EUyOu","accent":"Button-module_accent__opVgQ","secondary":"Button-module_secondary__zKoGk","light":"Button-module_light__LXeZy","dark":"Button-module_dark__5oFOT","btnText":"Button-module_btnText__N5Gys","btnOutline":"Button-module_btnOutline__CCFPI","startIcon":"Button-module_startIcon__Eylwr","endIcon":"Button-module_endIcon__pCffL"};
517
- styleInject(css_248z$K);
518
-
519
- const Button = (props) => {
520
- const { children, variant = exports.VARIANT.contained, color = exports.COLOR.primary, isRounded, isActive, className, startIcon, endIcon, shadow = true } = props, rest = __rest(props, ["children", "variant", "color", "isRounded", "isActive", "className", "startIcon", "endIcon", "shadow"]);
521
- const getCssClasses = () => {
522
- const cssClasses = [];
523
- cssClasses.push(styles$K.button);
524
- if (variant !== 'outline' && variant !== 'text') {
525
- cssClasses.push(styles$K.btnContained);
526
- cssClasses.push(styles$K[color]);
527
- }
528
- if (variant === 'outline') {
529
- cssClasses.push(styles$K.btnOutline);
530
- cssClasses.push(styles$K[color]);
531
- }
532
- if (variant === 'text') {
533
- cssClasses.push(styles$K.btnText);
534
- cssClasses.push(styles$K[color]);
535
- }
536
- if (isRounded && variant !== 'text') {
537
- cssClasses.push(`rounded-pill`);
538
- }
539
- if (isActive) {
540
- cssClasses.push('active');
541
- }
542
- shadow && cssClasses.push(styles$K.shadow);
543
- className && cssClasses.push(className);
544
- return cssClasses.filter(css => css).join(' ');
545
- };
546
- return (React__default["default"].createElement("button", Object.assign({ type: "button", className: getCssClasses() }, rest),
547
- React__default["default"].createElement("span", { className: "d-flex justify-content-center" },
548
- startIcon &&
549
- React__default["default"].createElement(Icon, { className: styles$K.startIcon }, startIcon),
550
- children,
551
- endIcon &&
552
- React__default["default"].createElement(Icon, { className: styles$K.endIcon }, endIcon))));
553
- };
554
-
555
- var css_248z$J = ".ButtonGroup-module_buttonGroup__w6iB- button:not(:last-child) {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0; }\n\n.ButtonGroup-module_buttonGroup__w6iB- button:not(:first-child) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0; }\n";
556
- var styles$J = {"buttonGroup":"ButtonGroup-module_buttonGroup__w6iB-"};
557
- styleInject(css_248z$J);
558
-
559
- const ButtonGroup = (props) => {
560
- const { children, className } = props, rest = __rest(props, ["children", "className"]);
561
- const getCssClasses = () => {
562
- const cssClasses = [];
563
- cssClasses.push(styles$J.buttonGroup);
564
- className && cssClasses.push(className);
565
- return cssClasses.filter(css => css).join(' ');
566
- };
567
- return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses(), role: "group" }, rest), children));
568
- };
569
-
570
- var css_248z$I = ".Breadcrumb-module_breadcrumb__-pvAn {\n display: flex;\n flex-wrap: wrap;\n padding: 0;\n margin-bottom: 0;\n list-style: none;\n margin-bottom: 1rem; }\n";
571
- var styles$I = {"breadcrumb":"Breadcrumb-module_breadcrumb__-pvAn"};
572
- styleInject(css_248z$I);
573
-
574
- const Breadcrumb = (props) => {
575
- const { children, className } = props, rest = __rest(props, ["children", "className"]);
576
- const getCssClasses = () => {
577
- const cssClasses = [];
578
- cssClasses.push(styles$I.breadcrumb);
579
- className && cssClasses.push(className);
580
- return cssClasses.filter(css => css).join(' ');
581
- };
582
- return (React__default["default"].createElement("nav", Object.assign({}, rest),
583
- React__default["default"].createElement("ol", { className: getCssClasses() }, children)));
584
- };
585
-
586
- const ConditionalWrapper = ({ condition, wrapper, children }) => condition ? wrapper(children) : children;
587
-
588
- var css_248z$H = ".BreadcrumbItem-module_breadcrumbItem__zsUq- {\n display: flex;\n align-items: center; }\n .BreadcrumbItem-module_breadcrumbItem__zsUq- + .BreadcrumbItem-module_breadcrumbItem__zsUq- {\n padding-left: 0.5rem; }\n .BreadcrumbItem-module_breadcrumbItem__zsUq- + .BreadcrumbItem-module_breadcrumbItem__zsUq-::before {\n float: left;\n padding-right: 0.5rem;\n color: #6c757d;\n content: \"/\"; }\n .BreadcrumbItem-module_breadcrumbItem__zsUq- a:not([href]):not([class]) {\n color: var(--primary); }\n .BreadcrumbItem-module_breadcrumbItem__zsUq-:hover {\n cursor: pointer; }\n .BreadcrumbItem-module_breadcrumbItem__zsUq-.BreadcrumbItem-module_active__Kn1dA:hover {\n cursor: unset; }\n";
589
- var styles$H = {"breadcrumbItem":"BreadcrumbItem-module_breadcrumbItem__zsUq-","active":"BreadcrumbItem-module_active__Kn1dA"};
590
- styleInject(css_248z$H);
591
-
592
- const BreadcrumbItem = (props) => {
593
- const { children, className, isActive, onClick } = props;
594
- const getCssClasses = () => {
595
- const cssClasses = [];
596
- cssClasses.push(styles$H.breadcrumbItem);
597
- className && cssClasses.push(className);
598
- isActive && cssClasses.push('active');
599
- return cssClasses.filter(css => css).join(' ');
600
- };
601
- const handleClick = (event) => {
602
- onClick && onClick(event);
603
- };
604
- return (React__default["default"].createElement("li", { className: getCssClasses(), onClick: handleClick },
605
- React__default["default"].createElement(ConditionalWrapper, { condition: !isActive, wrapper: label => React__default["default"].createElement("a", null, label) }, children)));
606
- };
607
-
608
- var css_248z$G = ".Card-module_card__TQdQq {\n background: var(--white);\n border-radius: var(--borderRadius); }\n .Card-module_card__TQdQq.Card-module_shadow__NxDVz {\n box-shadow: var(--shadow); }\n";
609
- var styles$G = {"card":"Card-module_card__TQdQq","shadow":"Card-module_shadow__NxDVz"};
610
- styleInject(css_248z$G);
611
-
612
- const Card = (props) => {
613
- const { children, className, shadow = true } = props, rest = __rest(props, ["children", "className", "shadow"]);
614
- const getCssClasses = () => {
615
- const cssClasses = [];
616
- cssClasses.push(styles$G.card);
617
- shadow && cssClasses.push(styles$G.shadow);
618
- className && cssClasses.push(className);
619
- return cssClasses.filter(css => css).join(' ');
620
- };
621
- return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
622
- };
623
-
624
- var css_248z$F = ".CardBody-module_cardBody__X52VY {\n flex: 1 1 auto;\n min-height: 1px;\n padding: 1.25rem; }\n";
625
- var styles$F = {"cardBody":"CardBody-module_cardBody__X52VY"};
626
- styleInject(css_248z$F);
627
-
628
- const CardBody = (props) => {
629
- const { children, className } = props, rest = __rest(props, ["children", "className"]);
630
- const getCssClasses = () => {
631
- const cssClasses = [];
632
- cssClasses.push(styles$F.cardBody);
633
- className && cssClasses.push(className);
634
- return cssClasses.filter(css => css).join(' ');
635
- };
636
- return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
637
- };
638
-
639
- var css_248z$E = ".CardFooter-module_cardFooter__BpOTG {\n padding: 0.75rem 1.25rem;\n background-color: rgba(0, 0, 0, 0.03);\n border-top: 1px solid rgba(0, 0, 0, 0.125); }\n .CardFooter-module_cardFooter__BpOTG:last-child {\n border-radius: 0 0 calc(0.25rem - 1px) calc(0.25rem - 1px); }\n";
640
- var styles$E = {"cardFooter":"CardFooter-module_cardFooter__BpOTG"};
641
- styleInject(css_248z$E);
642
-
643
- const CardFooter = (props) => {
644
- const { children, className } = props, rest = __rest(props, ["children", "className"]);
645
- const getCssClasses = () => {
646
- const cssClasses = [];
647
- cssClasses.push(styles$E.cardFooter);
648
- className && cssClasses.push(className);
649
- return cssClasses.filter(css => css).join(' ');
650
- };
651
- return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
652
- };
653
-
654
- var css_248z$D = ".CardSubtitle-module_cardSubtitle__YdoRM {\n color: #6c757d !important; }\n";
655
- var styles$D = {"cardSubtitle":"CardSubtitle-module_cardSubtitle__YdoRM"};
656
- styleInject(css_248z$D);
657
-
658
- const CardSubtitle = (props) => {
659
- const { children, className } = props, rest = __rest(props, ["children", "className"]);
660
- const getCssClasses = () => {
661
- const cssClasses = [];
662
- cssClasses.push(styles$D.cardSubtitle);
663
- className && cssClasses.push(className);
664
- return cssClasses.filter(css => css).join(' ');
665
- };
666
- return (React__default["default"].createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
667
- };
668
-
669
- var css_248z$C = ".CardText-module_cardText__UtYd9:last-child {\n margin-bottom: 0; }\n";
670
- var styles$C = {"cardText":"CardText-module_cardText__UtYd9"};
671
- styleInject(css_248z$C);
672
-
673
- const CardText = (props) => {
674
- const { children, className } = props, rest = __rest(props, ["children", "className"]);
675
- const getCssClasses = () => {
676
- const cssClasses = [];
677
- cssClasses.push(styles$C.cardText);
678
- className && cssClasses.push(className);
679
- return cssClasses.filter(css => css).join(' ');
680
- };
681
- return (React__default["default"].createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
682
- };
683
-
684
- var css_248z$B = ".CardTitle-module_cardTitle__aiPSE {\n margin-bottom: 0;\n font-size: 1.5rem;\n font-weight: 400;\n line-height: 1.334;\n letter-spacing: 0em; }\n";
685
- var styles$B = {"cardTitle":"CardTitle-module_cardTitle__aiPSE"};
686
- styleInject(css_248z$B);
687
-
688
- const CardTitle = (props) => {
689
- const { children, className, as: As = 'div' } = props, rest = __rest(props, ["children", "className", "as"]);
690
- const getCssClasses = () => {
691
- const cssClasses = [];
692
- cssClasses.push(styles$B.cardTitle);
693
- className && cssClasses.push(className);
694
- return cssClasses.filter(css => css).join(' ');
695
- };
696
- return (React__default["default"].createElement(As, Object.assign({ className: getCssClasses() }, rest), children));
697
- };
698
-
699
- var css_248z$A = ".CardImage-module_cardImage__Z6JWW {\n flex-shrink: 0;\n width: 100%;\n border-top-left-radius: calc(0.25rem - 1px);\n border-top-right-radius: calc(0.25rem - 1px); }\n";
700
- var styles$A = {"cardImage":"CardImage-module_cardImage__Z6JWW"};
701
- styleInject(css_248z$A);
702
-
703
- const CardImage = (props) => {
704
- const { src, alt, className } = props, rest = __rest(props, ["src", "alt", "className"]);
705
- const getCssClasses = () => {
706
- const cssClasses = [];
707
- cssClasses.push(styles$A.cardImage);
708
- className && cssClasses.push(className);
709
- return cssClasses.filter(css => css).join(' ');
710
- };
711
- return (React__default["default"].createElement("img", Object.assign({ className: getCssClasses(), src: src, alt: alt }, rest)));
712
- };
713
-
714
- var css_248z$z = ".Checkbox-module_checkboxContainer__x2GCi {\n display: flex;\n align-items: center;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n .Checkbox-module_checkboxContainer__x2GCi label {\n margin-bottom: 0;\n margin-left: 0; }\n .Checkbox-module_checkboxContainer__x2GCi label:hover {\n cursor: pointer; }\n\n.Checkbox-module_checkboxLabel__nPY4k.Checkbox-module_disabled__wnFIG {\n color: rgba(0, 0, 0, 0.26);\n cursor: not-allowed; }\n";
715
- var styles$z = {"checkboxContainer":"Checkbox-module_checkboxContainer__x2GCi","checkboxLabel":"Checkbox-module_checkboxLabel__nPY4k","disabled":"Checkbox-module_disabled__wnFIG"};
716
- styleInject(css_248z$z);
717
-
718
- const Checkbox = (props) => {
719
- const { id, checked, className, label, name, value = "off", disabled, readOnly } = props, rest = __rest(props, ["id", "checked", "className", "label", "name", "value", "disabled", "readOnly"]);
720
- // TODO
721
- // add own value
722
- // set from outer
723
- // update on change
724
- // emit to outer
725
- // can be: true/false, custom
726
- const [isChecked, setIsChecked] = React.useState(false);
727
- const checkboxElement = React.useRef(null);
728
- React.useEffect(() => {
729
- if (checked === true || checked === false) {
730
- setIsChecked(checked);
731
- }
732
- }, [checked]);
733
- const icons = {
734
- default: React__default["default"].createElement(SquareRegularIcon, null),
735
- selected: React__default["default"].createElement(CheckSquareRegularIcon, null)
736
- };
737
- const getCssClasses = () => {
738
- const cssClasses = [];
739
- cssClasses.push('checkbox');
740
- className && cssClasses.push(className);
741
- return cssClasses.filter(css => css).join(' ');
742
- };
743
- const getIcon = () => {
744
- return isChecked ? icons.selected : icons.default;
745
- };
746
- const handleClick = () => {
747
- var _a;
748
- if (!disabled && !readOnly) {
749
- setIsChecked(!isChecked);
750
- (_a = checkboxElement === null || checkboxElement === void 0 ? void 0 : checkboxElement.current) === null || _a === void 0 ? void 0 : _a.click();
751
- }
752
- };
753
- return (React__default["default"].createElement("div", { className: styles$z.checkboxContainer },
754
- React__default["default"].createElement(IconButton, { className: getCssClasses(), onClick: handleClick, icon: getIcon(), disabled: disabled || readOnly }),
755
- React__default["default"].createElement("label", { onClick: handleClick, className: styles$z.checkboxLabel + ' ' + (disabled ? styles$z['disabled'] : undefined) }, label),
756
- React__default["default"].createElement("input", Object.assign({ type: "checkbox", ref: checkboxElement, id: id, name: name, checked: isChecked, disabled: disabled, readOnly: readOnly, hidden: true, value: value }, rest))));
757
- };
758
-
759
- var css_248z$y = ".Chip-module_chip__dZ5qz {\n display: inline-flex;\n align-items: center;\n padding: 0.5rem;\n text-align: center;\n white-space: nowrap;\n vertical-align: baseline;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n font-size: 75%;\n font-weight: 700;\n border-radius: 10rem;\n line-height: 1; }\n .Chip-module_chip__dZ5qz svg {\n width: 18px;\n height: 18px; }\n .Chip-module_chip__dZ5qz .Chip-module_deleteIcon__--rUx {\n margin-left: 5px; }\n .Chip-module_chip__dZ5qz .Chip-module_deleteIcon__--rUx:hover {\n cursor: pointer; }\n .Chip-module_chip__dZ5qz.Chip-module_primary__YVDi9 {\n background: var(--primary);\n color: var(--primary-contrast-text); }\n .Chip-module_chip__dZ5qz.Chip-module_secondary__-e4xP {\n background: var(--secondary);\n color: var(--secondary-contrast-text); }\n .Chip-module_chip__dZ5qz.Chip-module_accent__ZCTwu {\n background: var(--accent);\n color: var(--accent-contrast-text); }\n .Chip-module_chip__dZ5qz.Chip-module_light__vKs7O {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .Chip-module_chip__dZ5qz.Chip-module_dark__G-FLQ {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n .Chip-module_chip__dZ5qz.Chip-module_clickable__qAqVH:hover {\n cursor: pointer; }\n .Chip-module_chip__dZ5qz.Chip-module_clickable__qAqVH:hover.Chip-module_primary__YVDi9 {\n background: var(--primary-dark); }\n .Chip-module_chip__dZ5qz.Chip-module_clickable__qAqVH:hover.Chip-module_secondary__-e4xP {\n background: var(--secondary-dark); }\n .Chip-module_chip__dZ5qz.Chip-module_clickable__qAqVH:hover.Chip-module_accent__ZCTwu {\n background: var(--accent-dark); }\n .Chip-module_chip__dZ5qz.Chip-module_shadow__v11NF {\n box-shadow: var(--shadow); }\n";
760
- var styles$y = {"chip":"Chip-module_chip__dZ5qz","deleteIcon":"Chip-module_deleteIcon__--rUx","primary":"Chip-module_primary__YVDi9","secondary":"Chip-module_secondary__-e4xP","accent":"Chip-module_accent__ZCTwu","light":"Chip-module_light__vKs7O","dark":"Chip-module_dark__G-FLQ","clickable":"Chip-module_clickable__qAqVH","shadow":"Chip-module_shadow__v11NF"};
761
- styleInject(css_248z$y);
762
-
763
- const Chip = (props) => {
764
- const { children, color = 'secondary', className, shadow, onClick, isDeletable, onDelete, deleteIcon = React__default["default"].createElement(TimesCircleSolidIcon, null), style } = props, rest = __rest(props, ["children", "color", "className", "shadow", "onClick", "isDeletable", "onDelete", "deleteIcon", "style"]);
765
- const getCssClass = () => {
766
- const cssClasses = [];
767
- cssClasses.push(styles$y.chip);
768
- cssClasses.push(styles$y[color]);
769
- shadow && cssClasses.push(styles$y['shadow']);
770
- onClick && cssClasses.push(styles$y['clickable']);
771
- className && cssClasses.push(className);
772
- return cssClasses.filter(r => r).join(' ');
773
- };
774
- const handleClickOnDelete = (e) => {
775
- e.stopPropagation();
776
- onDelete && onDelete(e);
777
- };
778
- return (React__default["default"].createElement("div", Object.assign({ className: getCssClass() }, rest, { style: style }),
779
- React__default["default"].createElement("div", null, children),
780
- isDeletable && (React__default["default"].createElement("div", { className: styles$y.deleteIcon, onClick: e => handleClickOnDelete(e) }, deleteIcon))));
781
- };
782
-
783
- var css_248z$x = ".FormLabel-module_formLabel__TXcHc {\n margin-bottom: .5rem; }\n";
784
- var styles$x = {"formLabel":"FormLabel-module_formLabel__TXcHc"};
785
- styleInject(css_248z$x);
786
-
787
- const FormLabel = (_a) => {
788
- var { children, className, htmlFor } = _a, rest = __rest(_a, ["children", "className", "htmlFor"]);
789
- const getCssClasses = () => {
790
- const cssClasses = [];
791
- cssClasses.push(styles$x.formLabel);
792
- className && cssClasses.push(className);
793
- return cssClasses.filter(css => css).join(' ');
794
- };
795
- return (React__default["default"].createElement("label", Object.assign({ htmlFor: htmlFor, className: getCssClasses() }, rest), children));
796
- };
797
-
798
- const FormGroup = (props) => {
799
- const { children, className = 'mb-1' } = props;
800
- return (React__default["default"].createElement("div", { className: className }, children));
801
- };
802
-
803
- const FileInput = (props) => {
804
- const { id, className, children, name, multiple = false, accept, disabled, onChange, readOnly, value, deletable = false } = props, rest = __rest(props, ["id", "className", "children", "name", "multiple", "accept", "disabled", "onChange", "readOnly", "value", "deletable"]);
805
- const inputFileElement = React.useRef(null);
806
- // eslint-disable-next-line @typescript-eslint/no-unused-vars
807
- const [model, setModel] = React.useState(value);
808
- const [fileList, setFileList] = React.useState();
809
- const getCssClasses = () => {
810
- const cssClasses = [];
811
- className && cssClasses.push(className);
812
- return cssClasses.filter(r => r).join(' ');
813
- };
814
- const handleOnChange = (event) => {
815
- const values = event.target.files;
816
- setFileList(values);
817
- onChange && onChange(event);
818
- };
819
- const handleOnDelete = () => {
820
- alert('coming soon');
821
- };
822
- return (React__default["default"].createElement("div", { className: "d-flex align-items-start" },
823
- React__default["default"].createElement(Button, { className: "flex-wrap", disabled: disabled, onClick: () => { var _a; return (_a = inputFileElement.current) === null || _a === void 0 ? void 0 : _a.click(); } }, children),
824
- React__default["default"].createElement("div", { className: "d-flex align-items-center flex-wrap ml-1" }, fileList && Array.from(fileList).map((file) => React__default["default"].createElement(Chip, { key: file.name, isDeletable: deletable, onDelete: () => handleOnDelete() }, file.name))),
825
- React__default["default"].createElement("input", Object.assign({ type: "file", ref: inputFileElement, className: getCssClasses(), id: id, name: name, multiple: multiple, accept: accept, disabled: disabled, readOnly: readOnly, hidden: true, onChange: handleOnChange, value: model }, rest))));
826
- };
827
-
828
- var css_248z$w = ".Select-module_selectContainer__DHFDZ {\n position: relative; }\n\n.Select-module_select__Fbn38 {\n min-height: calc(1.5em + 0.75rem + 2px);\n height: auto;\n display: flex; }\n .Select-module_select__Fbn38:hover {\n cursor: pointer; }\n\n.Select-module_selectMenu__8y4kQ {\n background-color: var(--light);\n position: absolute;\n box-shadow: var(--shadow);\n border-radius: var(--borderRadius);\n width: 100%;\n top: 2px;\n z-index: 1112;\n max-height: 280px;\n overflow: auto; }\n";
829
- var styles$w = {"selectContainer":"Select-module_selectContainer__DHFDZ","select":"Select-module_select__Fbn38","selectMenu":"Select-module_selectMenu__8y4kQ"};
830
- styleInject(css_248z$w);
831
-
832
- const Select = (props) => {
833
- var _a, _b, _c;
834
- const { id, className, options = [], value, multiple, multipleMaxCountItems = 5, onChange, onKeyDown } = props;
835
- const [model, setModel] = React.useState('');
836
- const [hoverIndex, setHoverIndex] = React.useState(null);
837
- const [isShow, setIsShow] = React.useState(false);
838
- const [selectedOptions, setSelectedOptions] = React.useState([]);
839
- const selectConainter = React.useRef(null);
840
- const getCssClass = () => {
841
- const cssClasses = [];
842
- className && cssClasses.push(className);
843
- cssClasses.push(styles$w.select);
844
- return cssClasses.filter(r => r).join(' ');
845
- };
846
- React.useEffect(() => {
847
- const newValue = value ? value : '';
848
- writeValue(newValue);
849
- if (newValue) {
850
- const option = options.find(o => o.value === newValue);
851
- if (option) {
852
- setHoverIndex(options.indexOf(option));
853
- }
854
- }
855
- }, [value, options]);
856
- React.useEffect(() => {
857
- if (hoverIndex) {
858
- scrollIntoView(hoverIndex);
859
- }
860
- }, [hoverIndex, isShow]);
861
- const scrollIntoView = (index) => {
862
- var _a;
863
- const htmlListItem = (_a = selectConainter.current) === null || _a === void 0 ? void 0 : _a.querySelector(`#list-item-${index}`);
864
- if (htmlListItem) {
865
- htmlListItem === null || htmlListItem === void 0 ? void 0 : htmlListItem.scrollIntoView({ block: "end", behavior: "smooth" });
866
- }
867
- };
868
- const writeValue = (val) => setModel(val);
869
- React.useEffect(() => {
870
- if (!multiple) {
871
- const newOption = options.find(o => o.value === model);
872
- if (newOption) {
873
- setSelectedOptions([newOption]);
874
- }
875
- }
876
- else {
877
- const filteredOptions = options.filter(o => model.indexOf(o.value) >= 0);
878
- setSelectedOptions([...filteredOptions]);
879
- }
880
- }, [model, multiple]);
881
- const handleOnClick = (option) => {
882
- let newValue = multiple ? [] : '';
883
- if (!multiple) {
884
- if (model !== option.value) {
885
- newValue = option.value;
886
- onChange && onChange(newValue);
887
- }
888
- hide();
889
- }
890
- else {
891
- const selectedOption = selectedOptions.find(o => o.value === option.value);
892
- if (selectedOption) {
893
- newValue = selectedOptions.filter(o => o.value !== option.value).map(o => o.value);
894
- }
895
- else {
896
- newValue = newValue.concat(selectedOptions.map(o => o.value));
897
- newValue.push(option.value);
898
- }
899
- onChange && onChange(newValue);
900
- }
901
- writeValue(newValue);
902
- };
903
- const show = () => setIsShow(true);
904
- const hide = () => setIsShow(false);
905
- const isActive = (option) => {
906
- return selectedOptions.indexOf(option) >= 0 || hoverIndex === options.indexOf(option);
907
- };
908
- const renderSingleViewModel = () => {
909
- let result = null;
910
- if (selectedOptions.length > 0) {
911
- result = React__default["default"].createElement("span", null, selectedOptions[0].label);
912
- }
913
- return result;
914
- };
915
- const renderMultipleViewModel = () => {
916
- let result = null;
917
- if (selectedOptions.length <= multipleMaxCountItems && selectedOptions.length > 0) {
918
- result = selectedOptions
919
- .map(option => React__default["default"].createElement(Chip, { key: option.value, className: "mr-2", color: exports.COLOR.primary, isDeletable: true, onDelete: (e) => handleOnDelete(e, option) }, option.label));
920
- }
921
- else {
922
- result = React__default["default"].createElement("span", null,
923
- selectedOptions.length,
924
- " Items selected");
925
- }
926
- return result;
927
- };
928
- const handleOnDelete = (event, option) => {
929
- event.stopPropagation();
930
- handleOnClick(option);
931
- };
932
- // TODO - extract with wrapper?
933
- const handleOnKeyDown = (e) => {
934
- if (isShow) {
935
- onKeyDown && onKeyDown(e);
936
- switch (e.code) {
937
- case 'Escape':
938
- hide();
939
- break;
940
- case 'ArrowDown':
941
- if (hoverIndex) {
942
- setHoverIndex(hoverIndex + 1);
943
- }
944
- break;
945
- case 'ArrowUp':
946
- // TODO
947
- if (hoverIndex) {
948
- setHoverIndex(hoverIndex - 1);
949
- }
950
- break;
951
- case 'Enter':
952
- if (hoverIndex) {
953
- const option = options[hoverIndex];
954
- if (option)
955
- handleOnClick(option);
956
- }
957
- break;
958
- }
959
- }
960
- };
961
- return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$w.selectContainer },
962
- React__default["default"].createElement("div", { id: id, className: getCssClass(), onClick: () => show(), tabIndex: 0, onKeyDown: e => handleOnKeyDown(e) },
963
- !multiple && renderSingleViewModel(),
964
- multiple && renderMultipleViewModel(),
965
- React__default["default"].createElement(Icon, { className: "ml-auto" },
966
- React__default["default"].createElement(ChevronDownSolidIcon, null))),
967
- isShow &&
968
- reactDom.createPortal(React__default["default"].createElement(React__default["default"].Fragment, null,
969
- React__default["default"].createElement("div", { className: styles$w.selectMenu, style: { left: (_a = selectConainter.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().x, top: (_b = selectConainter.current) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect().y, width: (_c = selectConainter.current) === null || _c === void 0 ? void 0 : _c.getBoundingClientRect().width } },
970
- React__default["default"].createElement(List, null, options && options.map((option, index) => React__default["default"].createElement(ListItem, { id: `list-item-${index}`, key: option.value, onClick: () => handleOnClick(option), active: isActive(option) },
971
- multiple &&
972
- React__default["default"].createElement(Checkbox, { checked: isActive(option), onChange: () => handleOnClick(option) }),
973
- React__default["default"].createElement(ListItemText, { primary: option.label ? option.label : option.value }))))),
974
- React__default["default"].createElement(Backdrop, { style: { zIndex: 1111 }, isTransparent: true, onClick: () => hide() })), document.body)));
975
- };
976
-
977
- var css_248z$v = "textarea {\n min-height: calc(10em + 0.75rem + 2px);\n display: block;\n width: 100%;\n padding: 0.375rem 0.75rem;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.5;\n background-clip: padding-box;\n border: 2px solid var(--input-border-color);\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n border-radius: var(--borderRadius);\n transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n resize: vertical; }\n textarea:focus {\n outline: none !important;\n border-color: var(--primary); }\n";
978
- var styles$v = {};
979
- styleInject(css_248z$v);
980
-
981
- const Textarea = (props) => {
982
- const { className } = props, rest = __rest(props, ["className"]);
983
- const getCssClass = () => {
984
- const cssClasses = [];
985
- cssClasses.push(styles$v.textarea);
986
- className && cssClasses.push(className);
987
- return cssClasses.filter(r => r).join(' ');
988
- };
989
- return (React__default["default"].createElement("textarea", Object.assign({ className: getCssClass() }, rest)));
990
- };
991
-
992
- var css_248z$u = ".FormInput-module_formInput__VXZip {\n display: block;\n width: 100%;\n padding: 0.375rem 0.75rem;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.5;\n color: #212529;\n background-color: #fff;\n background-clip: padding-box;\n border: 1px solid #ced4da;\n -webkit-appearance: none;\n appearance: none;\n border-radius: 0.25rem;\n box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.08);\n transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }\n .FormInput-module_formInput__VXZip:focus {\n color: #212529;\n background-color: #fff;\n border-color: #86b7fe;\n outline: 0;\n box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); }\n";
993
- var styles$u = {"formInput":"FormInput-module_formInput__VXZip"};
994
- styleInject(css_248z$u);
995
-
996
- const FormInput = (props) => {
997
- const { value, name, type, placeholder, className = 'form-control', isValid = true, options = [], textareaOptions, selectOptions, autoCompleteOptions, autoFocus, label, disabled = false, readonly = false, onInput, onChange, onBlur, onKeyDown } = props;
998
- const getCssClasses = () => {
999
- const cssClasses = [];
1000
- cssClasses.push(styles$u.formInput);
1001
- className && cssClasses.push(className);
1002
- !isValid && cssClasses.push('is-invalid');
1003
- return cssClasses.filter(css => css).join(' ');
1004
- };
1005
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
1006
- const handleOnInput = (value, type, name) => {
1007
- onInput && onInput({ value, type, name });
1008
- };
1009
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
1010
- const handleOnChange = (value, type, name) => {
1011
- onChange && onChange({ value, type, name });
1012
- };
1013
- return (React__default["default"].createElement(React.Fragment, null,
1014
- (type === 'text' ||
1015
- type === 'date' ||
1016
- type === 'datetime-local' ||
1017
- type === 'email' ||
1018
- type === 'number' ||
1019
- type === 'password' ||
1020
- type === 'color' ||
1021
- type === 'time')
1022
- &&
1023
- React__default["default"].createElement("input", { id: name, name: name, type: type, className: getCssClasses(), value: value, autoFocus: autoFocus, onInput: e => handleOnInput(e.target.value, type, name), onChange: e => handleOnChange((e === null || e === void 0 ? void 0 : e.target).value, type, name), onBlur: onBlur, placeholder: placeholder, readOnly: readonly, disabled: disabled, onKeyDown: onKeyDown }),
1024
- type === 'file' &&
1025
- React__default["default"].createElement(FileInput, { id: name, name: name, className: className + (!isValid ? ' is-invalid' : ''), value: value, autoFocus: autoFocus, readOnly: readonly, disabled: disabled, onChange: e => handleOnChange(e.target.value, type, name) }, "choose a file"),
1026
- type === 'textarea' &&
1027
- React__default["default"].createElement(Textarea, { id: name, name: name, className: className + (!isValid ? ' is-invalid' : ''), value: value, autoFocus: autoFocus, onInput: e => handleOnInput(e.target.value, type, name), onChange: e => handleOnChange(e.target.value, type, name), placeholder: placeholder, rows: textareaOptions === null || textareaOptions === void 0 ? void 0 : textareaOptions.rows, style: (textareaOptions === null || textareaOptions === void 0 ? void 0 : textareaOptions.resize) !== false ? undefined : { resize: 'none' } }),
1028
- type === 'select' &&
1029
- React__default["default"].createElement(Select, { id: name, name: name, className: className + (!isValid ? ' is-invalid' : ''), value: value, multiple: selectOptions === null || selectOptions === void 0 ? void 0 : selectOptions.multiple, onChange: e => handleOnChange(e, type, name),
1030
- // onKeyDown={e => onKeyDown(e)}
1031
- options: options }),
1032
- type === 'autocomplete' &&
1033
- React__default["default"].createElement(AutoComplete, { id: name, name: name, className: className + (!isValid ? ' is-invalid' : ''), value: value, openOnFocus: autoCompleteOptions === null || autoCompleteOptions === void 0 ? void 0 : autoCompleteOptions.openOnFocus, onChange: e => handleOnChange(e, type, name), options: options }),
1034
- type === 'checkbox' &&
1035
- React__default["default"].createElement(Checkbox, { id: name, name: name, label: label, className: (!isValid ? ' is-invalid' : ''), onChange: e => handleOnChange((e === null || e === void 0 ? void 0 : e.target).checked, type, name), checked: value }),
1036
- type === 'radio' &&
1037
- React__default["default"].createElement(React__default["default"].Fragment, null, options.map((option) => React__default["default"].createElement("div", { className: "form-check", key: option.id },
1038
- React__default["default"].createElement("input", { id: option.id ? option.id : option.value, name: name, type: "radio", className: "form-check-input", onChange: e => handleOnChange((e === null || e === void 0 ? void 0 : e.target).value, type, name), value: option.value, checked: value === option.value, onKeyDown: onKeyDown }),
1039
- React__default["default"].createElement("label", { className: "form-check-label", htmlFor: option.id }, option.label))))));
1040
- };
1041
-
1042
- const FormHint = (props) => {
1043
- const { children, className = 'form-text text-muted' } = props;
1044
- const getCssClasses = () => {
1045
- const cssClasses = [];
1046
- className && cssClasses.push(className);
1047
- return cssClasses.filter(css => css).join(' ');
1048
- };
1049
- return (React__default["default"].createElement("small", { className: getCssClasses() }, children));
1050
- };
1051
-
1052
- const FormError = (props) => {
1053
- const { className = 'invalid-feedback', errors = [] } = props;
1054
- return (React__default["default"].createElement(React.Fragment, null, errors &&
1055
- React__default["default"].createElement("div", { className: className }, errors.map(e => React__default["default"].createElement("div", { key: e.validator }, e.message)))));
1056
- };
1057
-
1058
- const IsEmptyValidator = (value) => value.trim() === '' || value === null || value === undefined;
1059
-
1060
- const EmailValidator = (value) => {
1061
- const isInvalidEmailFormat = value.match(/^([\w.%+-]+)@([\w-]+\.)+([\w]{2,})$/i) === null;
1062
- const isInvalid = !IsEmptyValidator(value) && isInvalidEmailFormat;
1063
- return isInvalid;
1064
- };
1065
-
1066
- const IsEqualValidator = (valueA, valueB) => valueA === valueB;
1067
-
1068
- // values, isSubmitting, handleChange, handleBlur, handleSubmit
1069
- class Form extends React.Component {
1070
- constructor(props) {
1071
- super(props);
1072
- this.myForm = React.createRef();
1073
- this.state = { controls: undefined, isValid: false, isChanged: false, isSubmitted: false, submitOnEnter: props.submitOnEnter !== undefined ? props.submitOnEnter : true };
1074
- }
1075
- static getDerivedStateFromProps(nextProps, state) {
1076
- if (!state.controls && nextProps.controls) {
1077
- return ({ controls: nextProps.controls });
1078
- }
1079
- return null;
1080
- }
1081
- handleChange() {
1082
- // get value by myForm instead of getControl?
1083
- if (this.state.isChanged || this.state.isSubmitted) {
1084
- const keys = Object.keys(this.state.controls);
1085
- const values = keys.reduce((obj, f) => {
1086
- const control = this.getControl(f);
1087
- // TODO - refactor
1088
- const newValue = ((control.type === 'date' || control.type === 'datetime-local') && control.value && isValidDate((control.value))) ? new Date((control.value)).toISOString() : control.value;
1089
- return (Object.assign(Object.assign({}, obj), { [f]: newValue }));
1090
- }, {});
1091
- if (this.state.isValid && this.state.isSubmitted) {
1092
- this.props.onSubmit && this.props.onSubmit(values);
1093
- }
1094
- this.props.onChange && this.props.onChange(values);
1095
- this.setState({ isChanged: false, isSubmitted: false });
1096
- }
1097
- }
1098
- // extract to service?
1099
- validateField(fieldValue, fieldValidators) {
1100
- const errors = [];
1101
- if (fieldValidators) {
1102
- for (const validator of fieldValidators) {
1103
- const validatorSplitted = validator.split(':');
1104
- const validatorName = validatorSplitted[0];
1105
- const validatorParam = validatorSplitted.length > 1 ? validatorSplitted[1] : null;
1106
- switch (validatorName) {
1107
- case 'required':
1108
- if (IsEmptyValidator(fieldValue)) {
1109
- errors.push({ validator: validatorName, message: 'This field is required' });
1110
- }
1111
- break;
1112
- case 'email':
1113
- if (EmailValidator(fieldValue)) {
1114
- errors.push({ validator: validatorName, message: 'Email format is wrong' });
1115
- }
1116
- break;
1117
- case 'match':
1118
- if (validatorParam) {
1119
- const matchControl = this.getControl(validatorParam);
1120
- if (matchControl) {
1121
- if (!IsEqualValidator(fieldValue, matchControl.value)) {
1122
- errors.push({ validator: validatorName, message: 'Values do not match' });
1123
- }
1124
- }
1125
- else {
1126
- console.error(`Form: Field ${validatorParam} not found`);
1127
- }
1128
- }
1129
- break;
1130
- }
1131
- }
1132
- }
1133
- return errors;
1134
- }
1135
- handleInputChange(name, value) {
1136
- const field = this.getControl(name);
1137
- field.value = value;
1138
- // redundant mit handleOnBlur
1139
- field.isDirty = true;
1140
- field.errors = this.validateField(field.value, field.validators);
1141
- field.isValid = field.errors.length === 0;
1142
- const newControls = Object.assign({}, this.state.controls);
1143
- newControls[name] = field;
1144
- this.setState({ controls: newControls, isChanged: true }, () => this.handleChange());
1145
- }
1146
- handleOnBlur(e) {
1147
- if (this.props.validateOnBlur) {
1148
- const { name } = e.target;
1149
- const field = this.getControl(name);
1150
- field.isDirty = true;
1151
- field.errors = this.validateField(field.value, field.validators);
1152
- field.isValid = field.errors.length === 0;
1153
- const controls = this.state.controls;
1154
- if (controls) {
1155
- controls[name] = field;
1156
- this.setState({ controls: controls, isChanged: true }, () => this.handleChange());
1157
- }
1158
- }
1159
- }
1160
- isRequired(fieldName) {
1161
- let result = false;
1162
- result = this.getControl(fieldName).validators.indexOf('required') >= 0;
1163
- return result;
1164
- }
1165
- isInvalid(fieldName) {
1166
- let result = false;
1167
- const field = this.getControl(fieldName);
1168
- result = field.isDirty && !field.isValid;
1169
- return result;
1170
- }
1171
- getControl(name) {
1172
- return this.state.controls[name];
1173
- }
1174
- renderLabel(fieldKey, label, labelClassName = 'form-label') {
1175
- const cssClasses = [labelClassName, this.isRequired(fieldKey) ? 'required' : undefined];
1176
- return React__default["default"].createElement(FormLabel, { htmlFor: fieldKey, className: cssClasses.join(' ') }, label);
1177
- }
1178
- // trigger via ref
1179
- handleFormSubmit() {
1180
- for (const fieldKey of Object.keys(this.state.controls)) {
1181
- const field = this.getControl(fieldKey);
1182
- // redundant mit handleBlur
1183
- field.isDirty = true;
1184
- field.errors = this.validateField(field.value, field.validators);
1185
- field.isValid = field.errors.length === 0;
1186
- }
1187
- this.setState({
1188
- controls: Object.assign({}, this.state.controls),
1189
- isSubmitted: true,
1190
- isValid: Object.keys(this.state.controls).map(f => this.getControl(f).isValid).every(valid => valid === true)
1191
- }, () => this.handleChange());
1192
- }
1193
- // trigger via ref
1194
- handleFormReset() {
1195
- for (const fieldKey of Object.keys(this.state.controls)) {
1196
- const field = this.getControl(fieldKey);
1197
- field.value = '';
1198
- field.isDirty = false;
1199
- field.errors = [];
1200
- field.isValid = field.errors.length === 0;
1201
- }
1202
- this.setState({
1203
- controls: Object.assign({}, this.state.controls),
1204
- isSubmitted: false,
1205
- isChanged: false,
1206
- isValid: false
1207
- });
1208
- }
1209
- handleOnKeyDown(e) {
1210
- if (e.key === 'Enter') {
1211
- e.preventDefault();
1212
- this.state.submitOnEnter && this.handleFormSubmit();
1213
- }
1214
- }
1215
- destroy() {
1216
- this.setState({ controls: {}, isValid: false, isChanged: false, isSubmitted: false });
1217
- }
1218
- getFormGroupCssClass(fieldKey) {
1219
- const result = this.getControl(fieldKey).config.formGroupClassName;
1220
- return result;
1221
- }
1222
- render() {
1223
- return (React__default["default"].createElement("form", { ref: this.myForm }, this.state && this.state.controls && Object.keys(this.state.controls).map((fieldKey) => {
1224
- return (React__default["default"].createElement(FormGroup, { key: fieldKey, className: this.getFormGroupCssClass(fieldKey) },
1225
- this.getControl(fieldKey).config.labelPosition !== 'behind' && this.getControl(fieldKey).type !== 'checkbox' &&
1226
- this.renderLabel(fieldKey, this.getControl(fieldKey).config.label, this.getControl(fieldKey).config.labelClassName),
1227
- React__default["default"].createElement(FormInput, { autoFocus: this.getControl(fieldKey).config.autoFocus, className: this.getControl(fieldKey).config.formControlClassName, isValid: !this.isInvalid(fieldKey), label: this.getControl(fieldKey).config.label, name: fieldKey, options: this.getControl(fieldKey).config.options, placeholder: this.getControl(fieldKey).config.placeholder, textareaOptions: this.getControl(fieldKey).config.textareaOptions, selectOptions: this.getControl(fieldKey).config.selectOptions, autoCompleteOptions: this.getControl(fieldKey).config.autoCompleteOptions, type: this.getControl(fieldKey).type, value: this.getControl(fieldKey).value, disabled: this.getControl(fieldKey).config.disabled, readonly: this.getControl(fieldKey).config.readonly, onChange: ({ name, value }) => this.handleInputChange(name, value), onBlur: (e) => this.handleOnBlur(e), onKeyDown: (e) => this.handleOnKeyDown(e) }),
1228
- this.getControl(fieldKey).config.labelPosition === 'behind' && this.getControl(fieldKey).type !== 'checkbox' &&
1229
- this.renderLabel(fieldKey, this.getControl(fieldKey).config.label, this.getControl(fieldKey).config.labelClassName),
1230
- this.getControl(fieldKey).config.hint &&
1231
- React__default["default"].createElement(FormHint, null, this.getControl(fieldKey).config.hint),
1232
- this.getControl(fieldKey).errors &&
1233
- React__default["default"].createElement(FormError, { errors: this.getControl(fieldKey).errors })));
1234
- })));
1235
- }
1236
- }
1237
- function isValidDate(dateObject) {
1238
- return new Date(dateObject).toString() !== 'Invalid Date';
1239
- }
1240
-
1241
- class FormControl {
1242
- constructor(
1243
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
1244
- value, validators = [], type, config) {
1245
- this.value = value;
1246
- this.validators = validators;
1247
- this.type = type;
1248
- this.config = config;
1249
- this.errors = [];
1250
- this.isValid = false;
1251
- this.isDirty = false;
1252
- }
1253
- }
1254
-
1255
- const DaySelect = (props) => {
1256
- const { className, day = new Date().getDate(), month = new Date().getMonth(), year = new Date().getFullYear(), disabled, id, name, onChange } = props;
1257
- React.useEffect(() => {
1258
- init();
1259
- }, [month, year]);
1260
- const init = () => {
1261
- const daysInMonth = new Date(year, month + 1, 0).getDate();
1262
- const newDays = [];
1263
- for (let i = 1; i <= daysInMonth; i++) {
1264
- newDays.push({ value: i.toString(), label: i.toString() });
1265
- }
1266
- setDayOptions(newDays);
1267
- };
1268
- const [value, setValue] = React.useState(day);
1269
- const [dayOptions, setDayOptions] = React.useState();
1270
- const getCssClasses = () => {
1271
- const cssClasses = [];
1272
- className && cssClasses.push(className);
1273
- return cssClasses.filter(css => css).join(' ');
1274
- };
1275
- const handleOnChange = (e) => {
1276
- setValue(e);
1277
- onChange && onChange(e);
1278
- };
1279
- return (React__default["default"].createElement(Select, { id: id, name: name, className: getCssClasses(), options: dayOptions, onChange: (e) => handleOnChange(parseInt(e)), disabled: disabled, value: value.toString() }));
1280
- };
1281
-
1282
- const MonthSelect = (props) => {
1283
- const months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
1284
- const { className, value = new Date().getMonth(), id, name, disabled, onChange } = props;
1285
- const [newValue, setNewValue] = React.useState(value);
1286
- const [monthOptions, setMonthOptions] = React.useState();
1287
- React.useEffect(() => {
1288
- setMonthOptions(months.map((m, index) => ({ value: index.toString(), label: m })));
1289
- }, []);
1290
- const getCssClasses = () => {
1291
- const cssClasses = [];
1292
- className && cssClasses.push(className);
1293
- return cssClasses.filter(css => css).join(' ');
1294
- };
1295
- const handleOnChange = (e) => {
1296
- setNewValue(e);
1297
- onChange && onChange(e);
1298
- };
1299
- return (React__default["default"].createElement(Select, { id: id, name: name, className: getCssClasses(), options: monthOptions, onChange: (e) => handleOnChange(parseInt(e)), disabled: disabled, value: newValue.toString() }));
1300
- };
1301
-
1302
- const YearSelect = (props) => {
1303
- const { className, from = 1970, to = new Date().getFullYear().toString(), value = new Date().getFullYear().toString(), id, name, disabled, onChange } = props;
1304
- const [newValue, setNewValue] = React.useState(value.toString());
1305
- const [years, setYears] = React.useState();
1306
- React.useEffect(() => {
1307
- const newYears = [];
1308
- for (let i = from; i <= to; i++) {
1309
- newYears.push({ value: i.toString(), label: i.toString() });
1310
- }
1311
- setYears(newYears.reverse());
1312
- }, [from, to]);
1313
- const getCssClasses = () => {
1314
- const cssClasses = [];
1315
- className && cssClasses.push(className);
1316
- return cssClasses.filter(css => css).join(' ');
1317
- };
1318
- const handleOnChange = (e) => {
1319
- setNewValue(e);
1320
- onChange && onChange(parseInt(e));
1321
- };
1322
- return (React__default["default"].createElement(Select, { id: id, name: name, className: getCssClasses(), options: years, onChange: handleOnChange, disabled: disabled, value: newValue }));
1323
- };
1324
-
1325
- exports.DATEMODE = void 0;
1326
- (function (DATEMODE) {
1327
- DATEMODE[DATEMODE["YEAR"] = 0] = "YEAR";
1328
- DATEMODE[DATEMODE["MONTH"] = 1] = "MONTH";
1329
- DATEMODE[DATEMODE["DAY"] = 2] = "DAY";
1330
- })(exports.DATEMODE || (exports.DATEMODE = {}));
1331
- const DateSelect = (props) => {
1332
- const { className, value = new Date(), disabled, yearConfig, onChange } = props;
1333
- const getCssClasses = () => {
1334
- const cssClasses = [];
1335
- cssClasses.push('row');
1336
- className && cssClasses.push(className);
1337
- return cssClasses.filter(css => css).join(' ');
1338
- };
1339
- const [currDate, setCurrDate] = React.useState(value);
1340
- const handleOnChange = (e, mode) => {
1341
- const currYear = mode === exports.DATEMODE.YEAR ? e : currDate.getFullYear();
1342
- const currMonth = mode === exports.DATEMODE.MONTH ? e : currDate.getMonth();
1343
- const currday = mode === exports.DATEMODE.DAY ? e : currDate.getDate();
1344
- const newDate = new Date(currYear, currMonth, currday);
1345
- setCurrDate(newDate);
1346
- onChange && onChange(newDate);
1347
- };
1348
- return (React__default["default"].createElement("div", { className: getCssClasses() },
1349
- React__default["default"].createElement(FormGroup, { className: "col" },
1350
- React__default["default"].createElement(FormLabel, null, "Year"),
1351
- React__default["default"].createElement(YearSelect, { className: "form-control", value: currDate.getFullYear(), disabled: disabled, from: yearConfig === null || yearConfig === void 0 ? void 0 : yearConfig.from, to: yearConfig === null || yearConfig === void 0 ? void 0 : yearConfig.to, onChange: e => handleOnChange(e, exports.DATEMODE.YEAR) })),
1352
- React__default["default"].createElement(FormGroup, { className: "col" },
1353
- React__default["default"].createElement(FormLabel, null, "Month"),
1354
- React__default["default"].createElement(MonthSelect, { className: "form-control", value: currDate.getMonth(), disabled: disabled, onChange: e => handleOnChange(e, exports.DATEMODE.MONTH) })),
1355
- React__default["default"].createElement(FormGroup, { className: "col" },
1356
- React__default["default"].createElement(FormLabel, null, "Day"),
1357
- React__default["default"].createElement(DaySelect, { className: "form-control", day: currDate.getDate(), month: currDate.getMonth(), year: currDate.getFullYear(), disabled: disabled, onChange: e => handleOnChange(e, exports.DATEMODE.DAY) }))));
1358
- };
1359
- /*
1360
- * result = { year, month, day, dayOfWeek, weekNumber }
1361
- */
1362
- // const getWeekNumber = () => {
1363
- // var d = new Date(Date.UTC(this.getFullYear(), this.getMonth(), this.getDate()));
1364
- // var dayNum = d.getUTCDay() || 7;
1365
- // d.setUTCDate(d.getUTCDate() + 4 - dayNum);
1366
- // var yearStart = new Date(Date.UTC(d.getUTCFullYear(), 0, 1));
1367
- // return Math.ceil((((d - yearStart) / 86400000) + 1) / 7)
1368
- // };
1369
-
1370
- var css_248z$t = ".Drawer-module_drawer__kdQCk {\n height: 100%;\n z-index: 1101;\n bottom: 0;\n position: fixed;\n background: white;\n min-width: 280px;\n overflow-y: auto; }\n .Drawer-module_drawer__kdQCk.Drawer-module_permanent__c-y8y {\n position: inherit;\n z-index: 0; }\n .Drawer-module_drawer__kdQCk.Drawer-module_left__loQVO {\n order: 0; }\n .Drawer-module_drawer__kdQCk.Drawer-module_right__sJ3mZ {\n order: 2; }\n .Drawer-module_drawer__kdQCk.Drawer-module_shadow__Myo3n {\n box-shadow: var(--shadow); }\n\n.Drawer-module_drawerOpen__07ptP {\n overflow: hidden; }\n";
1371
- var styles$t = {"drawer":"Drawer-module_drawer__kdQCk","permanent":"Drawer-module_permanent__c-y8y","left":"Drawer-module_left__loQVO","right":"Drawer-module_right__sJ3mZ","shadow":"Drawer-module_shadow__Myo3n","drawerOpen":"Drawer-module_drawerOpen__07ptP"};
1372
- styleInject(css_248z$t);
1373
-
1374
- const Drawer = (props) => {
1375
- const { children, className, position = 'left', permanent = false, target = document.body, shadow = true, onClickBackdrop } = props, rest = __rest(props, ["children", "className", "position", "permanent", "target", "shadow", "onClickBackdrop"]);
1376
- React.useEffect(() => {
1377
- document.body.classList.add(styles$t.drawerOpen);
1378
- return () => {
1379
- document.body.classList.remove(styles$t.drawerOpen);
1380
- };
1381
- }, []);
1382
- const handleClickBackdrop = () => {
1383
- onClickBackdrop && onClickBackdrop();
1384
- };
1385
- return reactDom.createPortal(React__default["default"].createElement(React__default["default"].Fragment, null,
1386
- React__default["default"].createElement(DrawerContent, Object.assign({ className: className, position: position, permanent: permanent, shadow: shadow }, rest), children),
1387
- !permanent && React__default["default"].createElement(Backdrop, { onClick: handleClickBackdrop })), target);
1388
- };
1389
- const DrawerContent = (props) => {
1390
- const { children, className, position = 'left', permanent = false, shadow } = props, rest = __rest(props, ["children", "className", "position", "permanent", "shadow"]);
1391
- const getCssClasses = () => {
1392
- const cssClasses = [];
1393
- cssClasses.push(styles$t.drawer);
1394
- shadow && cssClasses.push(styles$t.shadow);
1395
- !!permanent && cssClasses.push(styles$t['permanent']);
1396
- position === 'left' ? cssClasses.push(styles$t['left']) : cssClasses.push(styles$t['right']);
1397
- className && cssClasses.push(className);
1398
- return cssClasses.filter(css => css).join(' ');
1399
- };
1400
- const positionStyles = {
1401
- left: { left: '0px' },
1402
- right: { right: '0px' },
1403
- };
1404
- const getStyles = () => {
1405
- return !permanent ? positionStyles[position] : undefined;
1406
- };
1407
- return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses(), style: getStyles() }, rest), children));
1408
- };
1409
-
1410
- var css_248z$s = ".MenuBody-module_menuBody__u4FIQ {\n z-index: 1111;\n margin: 0;\n position: absolute;\n top: 100%;\n left: 0;\n min-width: 10rem;\n padding: 8px 0px;\n font-size: 1rem;\n color: #212529;\n text-align: left;\n list-style: none;\n background-color: #fff;\n background-clip: padding-box;\n border-radius: var(--borderRadius); }\n .MenuBody-module_menuBody__u4FIQ.MenuBody-module_shadow__OBp-f {\n box-shadow: var(--shadow); }\n";
1411
- var styles$s = {"menuBody":"MenuBody-module_menuBody__u4FIQ","shadow":"MenuBody-module_shadow__OBp-f"};
1412
- styleInject(css_248z$s);
1413
-
1414
- const MenuBody = (props) => {
1415
- const { parentRef, children, className, shadow = true, menuPosition = 'left', onClickBackdrop } = props;
1416
- const menuBodyRef = React.useRef(null);
1417
- React.useEffect(() => {
1418
- if (menuBodyRef && parentRef.current && menuBodyRef.current) {
1419
- core.createPopper(parentRef.current, menuBodyRef.current, {
1420
- placement: `${menuPosition}-start`,
1421
- modifiers: [
1422
- {
1423
- name: 'offset',
1424
- options: {
1425
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
1426
- offset: ({ placement, popper }) => {
1427
- if (placement === 'left-start') {
1428
- return [0, -popper.width]; // y, x
1429
- }
1430
- if (placement === 'right-start') {
1431
- return [0, -popper.width];
1432
- }
1433
- return [];
1434
- },
1435
- },
1436
- },
1437
- ]
1438
- });
1439
- }
1440
- }, [menuBodyRef]);
1441
- const getCssClasses = () => {
1442
- const cssClasses = [];
1443
- cssClasses.push(styles$s.menuBody);
1444
- shadow && cssClasses.push(styles$s.shadow);
1445
- className && cssClasses.push(className);
1446
- return cssClasses.filter(css => css).join(' ');
1447
- };
1448
- const handleClickBackdrop = () => {
1449
- onClickBackdrop && onClickBackdrop();
1450
- };
1451
- return (reactDom.createPortal(React__default["default"].createElement(React__default["default"].Fragment, null,
1452
- React__default["default"].createElement("div", { ref: menuBodyRef, className: getCssClasses() }, children),
1453
- React__default["default"].createElement(Backdrop, { isTransparent: true, onClick: handleClickBackdrop })), document.body));
1454
- };
1455
-
1456
- var css_248z$r = ".Menu-module_menu__p8QL- {\n display: flex; }\n";
1457
- var styles$r = {"menu":"Menu-module_menu__p8QL-"};
1458
- styleInject(css_248z$r);
1459
-
1460
- const Menu = (props) => {
1461
- const { toggle, children, className, open, menuPosition, onClickBackdrop } = props, rest = __rest(props, ["toggle", "children", "className", "open", "menuPosition", "onClickBackdrop"]);
1462
- const menuContainer = React.useRef(null);
1463
- const toggleContainerRef = React.useRef(null);
1464
- const getCssClasses = () => {
1465
- const cssClasses = [];
1466
- cssClasses.push(styles$r.menu);
1467
- className && cssClasses.push(className);
1468
- return cssClasses.filter(css => css).join(' ');
1469
- };
1470
- const handleClickBackdrop = () => {
1471
- onClickBackdrop && onClickBackdrop();
1472
- };
1473
- return (React__default["default"].createElement("div", Object.assign({ ref: menuContainer, className: getCssClasses() }, rest),
1474
- React__default["default"].createElement("div", { ref: toggleContainerRef }, toggle),
1475
- open &&
1476
- React__default["default"].createElement(MenuBody, { parentRef: toggleContainerRef, menuPosition: menuPosition, onClickBackdrop: handleClickBackdrop }, children)));
1477
- };
1478
-
1479
- var css_248z$q = ".MenuItem-module_menuItem__MeBxN {\n display: flex;\n width: 100%;\n padding: 0.25rem 1.5rem;\n clear: both;\n font-weight: 400;\n color: #212529;\n text-align: inherit;\n text-decoration: none;\n white-space: nowrap;\n background-color: transparent;\n border: 0; }\n .MenuItem-module_menuItem__MeBxN.MenuItem-module_menuItemHeader__2l732 {\n margin-bottom: 0;\n font-size: 0.875rem; }\n .MenuItem-module_menuItem__MeBxN:hover {\n cursor: pointer;\n color: #1e2125;\n background-color: rgba(0, 0, 0, 0.04); }\n";
1480
- var styles$q = {"menuItem":"MenuItem-module_menuItem__MeBxN","menuItemHeader":"MenuItem-module_menuItemHeader__2l732"};
1481
- styleInject(css_248z$q);
1482
-
1483
- const MenuItem = (props) => {
1484
- const { children, onClick, type = 'item' } = props;
1485
- const getCssClasses = () => {
1486
- const cssClasses = [];
1487
- cssClasses.push(styles$q.menuItem);
1488
- if (type === 'header') {
1489
- cssClasses.push(styles$q.menuItemHeader);
1490
- }
1491
- return cssClasses.filter(css => css).join(' ');
1492
- };
1493
- const handleClick = (e) => {
1494
- e.stopPropagation();
1495
- onClick && onClick(e);
1496
- };
1497
- return (React__default["default"].createElement(ConditionalWrapper, { condition: true, wrapper: children => ((type === 'item' ? (React__default["default"].createElement("a", { className: getCssClasses(), onClick: handleClick }, children)) :
1498
- React__default["default"].createElement("div", { className: getCssClasses(), onClick: handleClick }, children))) }, children));
1499
- };
1500
-
1501
- const MenuToggle = ({ children }) => {
1502
- return (React__default["default"].createElement(React.Fragment, null, children));
1503
- };
1504
-
1505
- var css_248z$p = ".MenuDivider-module_menuItemDivider__oRP-j {\n height: 0;\n margin: 0.5rem 0;\n overflow: hidden;\n border-top: 1px solid #e9ecef; }\n";
1506
- var styles$p = {"menuItemDivider":"MenuDivider-module_menuItemDivider__oRP-j"};
1507
- styleInject(css_248z$p);
1508
-
1509
- const MenuDivider = () => React__default["default"].createElement("div", { className: styles$p.menuItemDivider });
1510
-
1511
- var css_248z$o = ".ExpansionPanelContent-module_expansionPanelContent__aXNfH {\n padding: 8px 16px 16px; }\n";
1512
- var styles$o = {"expansionPanelContent":"ExpansionPanelContent-module_expansionPanelContent__aXNfH"};
1513
- styleInject(css_248z$o);
1514
-
1515
- const ExpansionPanelContent = ({ children }) => {
1516
- return (React__default["default"].createElement("div", { className: styles$o.expansionPanelContent }, children));
1517
- };
1518
-
1519
- var css_248z$n = ".ExpansionPanelHeader-module_expansionPanelHeader__Wy6Pq {\n display: flex;\n align-items: center;\n padding: 12px 16px;\n min-height: 48px; }\n .ExpansionPanelHeader-module_expansionPanelHeader__Wy6Pq:hover {\n cursor: pointer;\n background-color: var(--highlight); }\n";
1520
- var styles$n = {"expansionPanelHeader":"ExpansionPanelHeader-module_expansionPanelHeader__Wy6Pq"};
1521
- styleInject(css_248z$n);
1522
-
1523
- const ExpansionPanelHeader = (props) => {
1524
- const { children, isExpanded, onClick } = props;
1525
- const handleClick = (e) => {
1526
- e.stopPropagation();
1527
- onClick && onClick(e);
1528
- };
1529
- return (React__default["default"].createElement("div", { className: styles$n.expansionPanelHeader, onClick: handleClick },
1530
- children,
1531
- React__default["default"].createElement("span", { className: "ml-auto text-muted" },
1532
- React__default["default"].createElement(Icon, null, isExpanded ? React__default["default"].createElement(ChevronUpSolidIcon, null) : React__default["default"].createElement(ChevronDownSolidIcon, null)))));
1533
- };
1534
-
1535
- var css_248z$m = ".ExpansionPanel-module_expansionPanel__m1yQq {\n background-color: var(--white);\n box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }\n .ExpansionPanel-module_expansionPanel__m1yQq:first-child {\n border-top-left-radius: 4px;\n border-top-right-radius: 4px; }\n .ExpansionPanel-module_expansionPanel__m1yQq:last-child {\n border-bottom-left-radius: 4px;\n border-bottom-right-radius: 4px; }\n .ExpansionPanel-module_expansionPanel__m1yQq.ExpansionPanel-module_isExpanded__TS1ph {\n margin: 16px 0; }\n .ExpansionPanel-module_expansionPanel__m1yQq.ExpansionPanel-module_isExpanded__TS1ph:first-child {\n margin-top: 0; }\n .ExpansionPanel-module_expansionPanel__m1yQq.ExpansionPanel-module_isExpanded__TS1ph:last-child {\n margin-bottom: 0; }\n";
1536
- var styles$m = {"expansionPanel":"ExpansionPanel-module_expansionPanel__m1yQq","isExpanded":"ExpansionPanel-module_isExpanded__TS1ph"};
1537
- styleInject(css_248z$m);
1538
-
1539
- const ExpansionPanel = (props) => {
1540
- const { header, children, isExpanded = false, onChange } = props;
1541
- const [_isExpanded, setIsExpanded] = React.useState(false);
1542
- React.useEffect(() => {
1543
- setIsExpanded(isExpanded);
1544
- }, [isExpanded]);
1545
- const getCssClasses = () => {
1546
- const cssClasses = [];
1547
- cssClasses.push(styles$m.expansionPanel);
1548
- if (_isExpanded) {
1549
- cssClasses.push(styles$m.isExpanded);
1550
- }
1551
- return cssClasses.filter(css => css).join(' ');
1552
- };
1553
- const handleClickHeader = (event) => {
1554
- setIsExpanded(!_isExpanded);
1555
- onChange && onChange(event, !_isExpanded);
1556
- };
1557
- return (React__default["default"].createElement("div", { className: getCssClasses() },
1558
- React__default["default"].createElement(ExpansionPanelHeader, { isExpanded: _isExpanded, onClick: handleClickHeader }, header),
1559
- _isExpanded &&
1560
- React__default["default"].createElement(ExpansionPanelContent, null, children)));
1561
- };
1562
-
1563
- var css_248z$l = ".FloatingActionButton-module_fab__Rw3kd {\n box-shadow: var(--shadow); }\n .FloatingActionButton-module_fab__Rw3kd.FloatingActionButton-module_fixed__XQOkG {\n position: fixed;\n bottom: 16px;\n right: 16px;\n z-index: 1000; }\n";
1564
- var styles$l = {"fab":"FloatingActionButton-module_fab__Rw3kd","fixed":"FloatingActionButton-module_fixed__XQOkG"};
1565
- styleInject(css_248z$l);
1566
-
1567
- const FloatingActionButton = (props) => {
1568
- const { className, icon, color = exports.COLOR.primary, fixed, size = exports.SIZE.lg, isActive, disabled, onClick } = props;
1569
- const getCssClasses = () => {
1570
- const cssClasses = [];
1571
- cssClasses.push(styles$l.fab);
1572
- fixed && cssClasses.push(styles$l['fixed']);
1573
- className && cssClasses.push(className);
1574
- return cssClasses.filter(css => css).join(' ');
1575
- };
1576
- const handleClick = (e) => {
1577
- e.stopPropagation();
1578
- onClick && onClick(e);
1579
- };
1580
- return (React__default["default"].createElement(IconButton, { className: getCssClasses(), color: color, size: size, isActive: isActive, disabled: disabled, icon: icon, variant: exports.VARIANT.contained, onClick: handleClick }));
1581
- };
1582
-
1583
- const Column = (props) => {
1584
- const { children, className, xs, sm, md, lg, xl } = props, rest = __rest(props, ["children", "className", "xs", "sm", "md", "lg", "xl"]);
1585
- const getCssClasses = () => {
1586
- const cssClasses = [];
1587
- !xs && !sm && !md && !lg && !xl && cssClasses.push('col');
1588
- if (xs)
1589
- cssClasses.push(`col-${xs.toString()}`);
1590
- if (sm)
1591
- cssClasses.push(`col-sm-${sm.toString()}`);
1592
- if (md)
1593
- cssClasses.push(`col-md-${md.toString()}`);
1594
- if (lg)
1595
- cssClasses.push(`col-lg-${lg.toString()}`);
1596
- if (xl)
1597
- cssClasses.push(`col-xl-${xl.toString()}`);
1598
- className && cssClasses.push(className);
1599
- return cssClasses.filter(css => css).join(' ');
1600
- };
1601
- return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
1602
- };
1603
-
1604
- const Row = (props) => {
1605
- const { children, className } = props, rest = __rest(props, ["children", "className"]);
1606
- const getCssClasses = () => {
1607
- const cssClasses = [];
1608
- cssClasses.push('row');
1609
- className && cssClasses.push(className);
1610
- return cssClasses.filter(css => css).join(' ');
1611
- };
1612
- return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
1613
- };
1614
-
1615
- var css_248z$k = ".Link-module_link__YlJQl {\n color: var(--primary);\n text-decoration: underline; }\n .Link-module_link__YlJQl:hover {\n color: var(--primary-dark); }\n";
1616
- var styles$k = {"link":"Link-module_link__YlJQl"};
1617
- styleInject(css_248z$k);
1618
-
1619
- const Link = (props) => {
1620
- const { href = '#', className, target, children } = props, rest = __rest(props, ["href", "className", "target", "children"]);
1621
- const [status, setStatus] = React.useState(STATUS.NORMAL);
1622
- const getCssClasses = () => {
1623
- const cssClasses = [];
1624
- cssClasses.push(styles$k.link);
1625
- className && cssClasses.push(className);
1626
- status !== STATUS.NORMAL && cssClasses.push(status);
1627
- return cssClasses.filter(css => css).join(' ');
1628
- };
1629
- const onMouseEnter = () => {
1630
- setStatus(STATUS.HOVERED);
1631
- };
1632
- const onMouseLeave = () => {
1633
- setStatus(STATUS.NORMAL);
1634
- };
1635
- return (React__default["default"].createElement("a", Object.assign({ className: getCssClasses(), href: href, target: target, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }, rest), children));
1636
- };
1637
-
1638
- var css_248z$j = ".LoadingIndicator-module_loadingIndicatorContainer__GS9OG {\n position: fixed;\n top: 0;\n left: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100%; }\n\n.LoadingIndicator-module_loadingIndicator__EC9sx {\n animation-name: LoadingIndicator-module_spinAnimation__LeY4Z;\n animation-duration: 5000ms;\n animation-iteration-count: infinite;\n animation-timing-function: linear;\n width: 24px;\n height: 24px; }\n\n@keyframes LoadingIndicator-module_spinAnimation__LeY4Z {\n from {\n transform: rotate(0deg); }\n to {\n transform: rotate(360deg); } }\n";
1639
- var styles$j = {"loadingIndicatorContainer":"LoadingIndicator-module_loadingIndicatorContainer__GS9OG","loadingIndicator":"LoadingIndicator-module_loadingIndicator__EC9sx","spinAnimation":"LoadingIndicator-module_spinAnimation__LeY4Z"};
1640
- styleInject(css_248z$j);
1641
-
1642
- const LoadingIndicator = (_a) => {
1643
- var rest = __rest(_a, []);
1644
- const getCssClasses = () => {
1645
- const cssClasses = [];
1646
- cssClasses.push(styles$j.loadingIndicator);
1647
- return cssClasses.filter(css => css).join(' ');
1648
- };
1649
- return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest),
1650
- React__default["default"].createElement(SpinnerSolidIcon, null)));
1651
- };
1652
-
1653
- const LoadingIndicatorContainer = ({ children }) => {
1654
- const getCssClasses = () => {
1655
- const cssClasses = [];
1656
- cssClasses.push(styles$j.loadingIndicatorContainer);
1657
- return cssClasses.filter(css => css).join(' ');
1658
- };
1659
- return (React__default["default"].createElement("div", { className: getCssClasses() }, children));
1660
- };
1661
-
1662
- class LoadingIndicatorService {
1663
- show() {
1664
- if (this.container) {
1665
- this.hide();
1666
- }
1667
- this.container = document.createElement('div');
1668
- this.container.classList.add('snackbar-container');
1669
- document.body.appendChild(this.container);
1670
- reactDom.render(React__default["default"].createElement(LoadingIndicatorContainer, null,
1671
- React__default["default"].createElement(LoadingIndicator, null)), this.container);
1672
- }
1673
- hide() {
1674
- if (this.container) {
1675
- reactDom.unmountComponentAtNode(this.container);
1676
- document.body.removeChild(this.container);
1677
- this.container = undefined;
1678
- this.handler && clearTimeout(this.handler);
1679
- }
1680
- }
1681
- }
1682
- const loadingIndicatorService = new LoadingIndicatorService();
1683
-
1684
- var css_248z$i = ".ModalHeader-module_modalHeader__tw-u- {\n border-bottom: none;\n align-items: center; }\n";
1685
- var styles$i = {"modalHeader":"ModalHeader-module_modalHeader__tw-u-"};
1686
- styleInject(css_248z$i);
1687
-
1688
- const ModalHeader = (props) => {
1689
- const { children, isDismissable = false, onClose } = props, rest = __rest(props, ["children", "isDismissable", "onClose"]);
1690
- const handleClick = () => {
1691
- onClose && onClose();
1692
- };
1693
- return (React__default["default"].createElement("div", Object.assign({ className: "modal-header " + styles$i.modalHeader }, rest),
1694
- React__default["default"].createElement("h5", { className: "modal-title" }, children),
1695
- isDismissable &&
1696
- React__default["default"].createElement(IconButton, { icon: React__default["default"].createElement(TimesSolidIcon, null), variant: exports.VARIANT.text, onClick: handleClick })));
1697
- };
1698
-
1699
- const ModalBody = ({ children }) => (React__default["default"].createElement("div", { className: "modal-body" }, children));
1700
-
1701
- var css_248z$h = ".Modal-module_modal__HMxWV {\n z-index: 1111 !important;\n border-radius: var(--borderRadius); }\n .Modal-module_modal__HMxWV.Modal-module_fullscreen__iepGa {\n width: 100% !important;\n height: 100% !important;\n max-height: 100% !important;\n margin: 0;\n padding: 0; }\n .Modal-module_modal__HMxWV.Modal-module_fullscreen__iepGa .Modal-module_modalContent__9wAwB {\n height: auto;\n min-height: 100%;\n max-height: 100%;\n border-radius: 0;\n overflow: auto; }\n @media (min-width: 320px) {\n .Modal-module_modal__HMxWV.Modal-module_fullscreen__iepGa {\n max-width: 100% !important; } }\n .Modal-module_modal__HMxWV .Modal-module_sm__CsR6U {\n max-width: 300px; }\n .Modal-module_modal__HMxWV .Modal-module_md__lNggx {\n max-width: 500px; }\n .Modal-module_modal__HMxWV .Modal-module_lg__6dtT2 {\n max-width: 1140px; }\n @media (min-width: 576px) {\n .Modal-module_modal__HMxWV .Modal-module_modal-dialog__U2wGf {\n max-width: 600px; } }\n";
1702
- var styles$h = {"modal":"Modal-module_modal__HMxWV","fullscreen":"Modal-module_fullscreen__iepGa","modalContent":"Modal-module_modalContent__9wAwB","sm":"Modal-module_sm__CsR6U","md":"Modal-module_md__lNggx","lg":"Modal-module_lg__6dtT2","modal-dialog":"Modal-module_modal-dialog__U2wGf"};
1703
- styleInject(css_248z$h);
1704
-
1705
- var css_248z$g = ".ModalFooter-module_modalFooter__SNm-f {\n border-top: none; }\n";
1706
- var styles$g = {"modalFooter":"ModalFooter-module_modalFooter__SNm-f"};
1707
- styleInject(css_248z$g);
1708
-
1709
- const ModalFooter = ({ children }) => (React__default["default"].createElement("div", { className: "modal-footer " + styles$g.modalFooter }, children));
1710
-
1711
- const Modal = (props) => {
1712
- const { className, size, fullScreen, children, header, footer, onHeaderCloseClick, onBackdropClick, isDismissable = false } = props;
1713
- const getCssClass = () => {
1714
- const cssClasses = [];
1715
- cssClasses.push('modal-dialog modal-dialog-centered');
1716
- cssClasses.push(styles$h.modal);
1717
- !!fullScreen && cssClasses.push(styles$h['fullscreen']);
1718
- size && cssClasses.push(styles$h[size]);
1719
- className && cssClasses.push(className);
1720
- return cssClasses.filter(r => r).join(' ');
1721
- };
1722
- React.useEffect(() => {
1723
- document.body.classList.add('modal-open');
1724
- return () => {
1725
- document.body.classList.remove('modal-open');
1726
- };
1727
- }, []);
1728
- const handleClickBackdrop = () => {
1729
- onBackdropClick && onBackdropClick();
1730
- };
1731
- return (React__default["default"].createElement(React.Fragment, null,
1732
- React__default["default"].createElement("div", { className: "modal show " + styles$h.modal, style: { display: 'block' } },
1733
- React__default["default"].createElement("div", { className: getCssClass() },
1734
- React__default["default"].createElement("div", { className: 'modal-content ' + (fullScreen ? styles$h['modalContent'] : undefined) },
1735
- header &&
1736
- React__default["default"].createElement(ModalHeader, { isDismissable: isDismissable, onClose: () => onHeaderCloseClick && onHeaderCloseClick() }, header),
1737
- React__default["default"].createElement(ModalBody, null, children),
1738
- footer &&
1739
- React__default["default"].createElement(ModalFooter, null, footer)))),
1740
- React__default["default"].createElement(Backdrop, { onClick: handleClickBackdrop })));
1741
- };
1742
-
1743
- // export enum MODALRESULT { OK = 'OK', CANCEL = 'CANCEL', DELETE = 'DELETE' }
1744
- exports.MODALTYPE = void 0;
1745
- (function (MODALTYPE) {
1746
- MODALTYPE["BASIC"] = "BASIC";
1747
- MODALTYPE["FORM"] = "FORM";
1748
- })(exports.MODALTYPE || (exports.MODALTYPE = {}));
1749
- exports.MODALBUTTONTYPE = void 0;
1750
- (function (MODALBUTTONTYPE) {
1751
- MODALBUTTONTYPE["OK"] = "OK";
1752
- MODALBUTTONTYPE["CANCEL"] = "CANCEL";
1753
- MODALBUTTONTYPE["RESET"] = "RESET";
1754
- MODALBUTTONTYPE["DEFAULT"] = "DEFAULT";
1755
- })(exports.MODALBUTTONTYPE || (exports.MODALBUTTONTYPE = {}));
1756
-
1757
- const GlobalModal = ({ title, description, formControls, onOk, onCancel, isDismissable = false, buttons = [
1758
- { label: 'Cancel', type: exports.MODALBUTTONTYPE.CANCEL, color: exports.COLOR.secondary, variant: exports.VARIANT.text, focus: true },
1759
- { label: 'Ok', type: exports.MODALBUTTONTYPE.OK, variant: exports.VARIANT.contained },
1760
- ], size = exports.SIZE.md, fullScreen = false }) => {
1761
- // workaround for getDerivedStateFromProps
1762
- const [myControls, setMyControls] = React.useState(null);
1763
- React.useEffect(() => {
1764
- setMyControls(Object.assign({}, formControls));
1765
- }, []);
1766
- // end
1767
- const modalType = formControls ? exports.MODALTYPE.FORM : exports.MODALTYPE.BASIC;
1768
- const myForm = React.useRef(null);
1769
- const handleOk = () => {
1770
- var _a;
1771
- if (modalType === exports.MODALTYPE.FORM) {
1772
- (_a = myForm === null || myForm === void 0 ? void 0 : myForm.current) === null || _a === void 0 ? void 0 : _a.handleFormSubmit();
1773
- }
1774
- else {
1775
- onOk && onOk();
1776
- }
1777
- };
1778
- const handleCancel = () => {
1779
- onCancel && onCancel();
1780
- };
1781
- const onSubmit = (values) => {
1782
- onOk && onOk(values);
1783
- };
1784
- const handleClickButton = (button) => {
1785
- switch (button.type) {
1786
- case exports.MODALBUTTONTYPE.OK:
1787
- handleOk();
1788
- break;
1789
- case exports.MODALBUTTONTYPE.CANCEL:
1790
- handleCancel();
1791
- break;
1792
- default:
1793
- handleCancel();
1794
- break;
1795
- }
1796
- button.handler && button.handler();
1797
- };
1798
- return (React__default["default"].createElement(Modal, { size: size, fullScreen: fullScreen, header: title, onHeaderCloseClick: onCancel, isDismissable: isDismissable, footer: React__default["default"].createElement(React.Fragment, null, buttons.map((button, index) => (React__default["default"].createElement(Button, { key: index, variant: button.variant, color: button.color, autoFocus: button.autoFocus, onClick: () => handleClickButton(button) }, button.label)))) },
1799
- description && React__default["default"].createElement("div", null, description),
1800
- modalType === exports.MODALTYPE.FORM &&
1801
- React__default["default"].createElement(React.Fragment, null,
1802
- React__default["default"].createElement(Form, { ref: myForm, controls: myControls, validateOnBlur: true, onSubmit: onSubmit }))));
1803
- };
1804
-
1805
- class ModalService {
1806
- show(title, description, options) {
1807
- return new Promise((resolve, reject) => {
1808
- if (!this.container) {
1809
- this.container = document.createElement('div');
1810
- document.body.appendChild(this.container);
1811
- const handleOk = (values) => {
1812
- resolve(values);
1813
- this.hide();
1814
- };
1815
- const handleCancel = () => {
1816
- reject();
1817
- this.hide();
1818
- };
1819
- reactDom.render(React__default["default"].createElement(GlobalModal, { fullScreen: options && options.fullScreen, size: options && options.size, title: title, description: description, formControls: options && options.formControls, onCancel: handleCancel, onOk: handleOk, isDismissable: options && options.isDismissable, buttons: options && options.buttons }), this.container);
1820
- }
1821
- });
1822
- }
1823
- hide() {
1824
- if (this.container) {
1825
- reactDom.unmountComponentAtNode(this.container);
1826
- document.body.removeChild(this.container);
1827
- this.container = undefined;
1828
- }
1829
- }
1830
- }
1831
- const modalService = new ModalService();
1832
-
1833
- const NumberSelect = (props) => {
1834
- const { className, value = 0, from = 0, to = 100, id, name, disabled = false, onChange } = props;
1835
- const [newValue, setNewValue] = React.useState(0);
1836
- const [numberOptions, setNumberOptions] = React.useState();
1837
- React.useEffect(() => {
1838
- setNewValue(value);
1839
- }, [value]);
1840
- React.useEffect(() => {
1841
- const options = [];
1842
- for (let i = from; i <= to; i++) {
1843
- options.push({ value: i.toString(), label: i.toString() });
1844
- }
1845
- setNumberOptions(options);
1846
- }, [from, to]);
1847
- const getCssClasses = () => {
1848
- const cssClasses = [];
1849
- cssClasses.push('form-control');
1850
- className && cssClasses.push(className);
1851
- return cssClasses.filter(css => css).join(' ');
1852
- };
1853
- const handleOnChange = (e) => {
1854
- setNewValue(e);
1855
- onChange && onChange(e);
1856
- };
1857
- return (React__default["default"].createElement(Select, { id: id, name: name, className: getCssClasses(), options: numberOptions, onChange: (e) => handleOnChange(parseInt(e)), disabled: disabled, value: newValue.toString() }));
1858
- };
1859
-
1860
- class SidebarItemModel {
1861
- constructor(id, label, path, icon, isActive, items, isCollapsible = false, isCollapsed = false) {
1862
- this.id = id;
1863
- this.label = label;
1864
- this.path = path;
1865
- this.icon = icon;
1866
- this.isActive = isActive;
1867
- this.items = items;
1868
- this.isCollapsible = isCollapsible;
1869
- this.isCollapsed = isCollapsed;
1870
- }
1871
- }
1872
-
1873
- const Sidebar = (props) => {
1874
- const { className, items, currentUrl, onItemClicked } = props, rest = __rest(props, ["className", "items", "currentUrl", "onItemClicked"]);
1875
- const [menuItems, setMenuItems] = React.useState([]);
1876
- React.useEffect(() => {
1877
- if (items && items.length > 0) {
1878
- initMenuItems();
1879
- }
1880
- }, []);
1881
- const getCssClasses = () => {
1882
- const cssClasses = [];
1883
- className && cssClasses.push(className);
1884
- return cssClasses.filter(css => css).join(' ');
1885
- };
1886
- const initMenuItems = () => {
1887
- const newItems = items.map(item => new SidebarItemModel(item.id, item.label, item.path, item.icon, isMenuItemActive(item.path), item.items && item.items.map(subItem => new SidebarItemModel(subItem.id, subItem.label, subItem.path, subItem.icon, isMenuItemActive(`${item.path}/${subItem.path}`))), item.isCollapsible, item.isCollapsed));
1888
- setMenuItems(newItems);
1889
- };
1890
- const isMenuItemActive = (path) => {
1891
- const lastSegment = currentUrl.substring(currentUrl.lastIndexOf('/') + 1, currentUrl.length);
1892
- let result = false;
1893
- if (currentUrl === '/' && path === '') {
1894
- result = true;
1895
- }
1896
- else if (path !== '') {
1897
- result = lastSegment ? lastSegment.toLowerCase() === path.toLowerCase() : false;
1898
- }
1899
- return result;
1900
- };
1901
- const navigate = (e, path) => {
1902
- e.stopPropagation();
1903
- e.preventDefault();
1904
- onItemClicked(path);
1905
- };
1906
- const handleClickItem = (item, e) => {
1907
- if (item.items && item.items.length > 0 && item.isCollapsible) {
1908
- const newMenuItems = menuItems.map((menuItem) => {
1909
- if (item.id === menuItem.id) {
1910
- menuItem.isCollapsed = !item.isCollapsed;
1911
- }
1912
- return menuItem;
1913
- });
1914
- setMenuItems(newMenuItems);
1915
- }
1916
- else {
1917
- navigate(e, `/${item.path}`);
1918
- }
1919
- };
1920
- const handleClickSubItem = (itemPath, subItemPath, e) => {
1921
- navigate(e, `/${itemPath}/${subItemPath}`);
1922
- };
1923
- return (React__default["default"].createElement("nav", Object.assign({ className: getCssClasses() }, rest),
1924
- React__default["default"].createElement(List, null, menuItems.map(item => (React__default["default"].createElement(React__default["default"].Fragment, { key: item.id },
1925
- React__default["default"].createElement(ListItem, { active: isMenuItemActive(item.path), onClick: (e) => handleClickItem(item, e) },
1926
- React__default["default"].createElement(ListItemText, { primary: React__default["default"].createElement(React__default["default"].Fragment, null,
1927
- item.label,
1928
- item.items && item.items.length > 0 && (React__default["default"].createElement("small", { className: "ml-2" },
1929
- "(",
1930
- item.items.length,
1931
- ")"))) }),
1932
- item.items && item.items.length > 0 &&
1933
- React__default["default"].createElement(ListItemAction, null, item.isCollapsed ? React__default["default"].createElement(ChevronDownSolidIcon, null) : React__default["default"].createElement(ChevronUpSolidIcon, null))),
1934
- !item.isCollapsed && item.items && item.items.length > 0 && (React__default["default"].createElement(List, { className: "list-level-1", key: `${item.id}-sub` }, item.items.map(subItem => (React__default["default"].createElement(ListItem, { className: "list-item-level-1", active: isMenuItemActive(subItem.path), key: subItem.id, onClick: (e) => handleClickSubItem(item.path, subItem.path, e) }, subItem.label)))))))))));
1935
- };
1936
-
1937
- var css_248z$f = ".Snackbar-module_snackbar__O5T2b {\n display: flex;\n align-items: center;\n min-width: 288px;\n padding: 6px 16px;\n transform-origin: center;\n min-height: 52px;\n animation: Snackbar-module_bounceIn__E47iD 0.4s ease;\n z-index: 1001;\n position: fixed;\n left: 50%;\n transform: translateX(-50%);\n bottom: 2%;\n border-radius: var(--borderRadius); }\n .Snackbar-module_snackbar__O5T2b.Snackbar-module_primary__ZBOTN {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .Snackbar-module_snackbar__O5T2b.Snackbar-module_accent__0MnFy {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .Snackbar-module_snackbar__O5T2b.Snackbar-module_secondary__s8-ez {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .Snackbar-module_snackbar__O5T2b.Snackbar-module_light__Vrd7o {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .Snackbar-module_snackbar__O5T2b.Snackbar-module_dark__U-5io {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n\n.Snackbar-module_text__G5r5D {\n width: 100%;\n padding: 8px 0; }\n\n.Snackbar-module_action__vus2Y {\n margin-left: auto; }\n .Snackbar-module_action__vus2Y:hover {\n cursor: pointer; }\n\n@keyframes Snackbar-module_bounceIn__E47iD {\n 0% {\n opacity: 0; }\n 50% {\n opacity: 0.9; }\n 80% {\n opacity: 1; }\n 100% {\n opacity: 1; } }\n";
1938
- var styles$f = {"snackbar":"Snackbar-module_snackbar__O5T2b","bounceIn":"Snackbar-module_bounceIn__E47iD","primary":"Snackbar-module_primary__ZBOTN","accent":"Snackbar-module_accent__0MnFy","secondary":"Snackbar-module_secondary__s8-ez","light":"Snackbar-module_light__Vrd7o","dark":"Snackbar-module_dark__U-5io","text":"Snackbar-module_text__G5r5D","action":"Snackbar-module_action__vus2Y"};
1939
- styleInject(css_248z$f);
1940
-
1941
- const Snackbar = (props) => {
1942
- const { children, color = exports.COLOR.dark, actionText = 'ok', onOk } = props, rest = __rest(props, ["children", "color", "actionText", "onOk"]);
1943
- const getCssClasses = () => {
1944
- const cssClasses = [];
1945
- cssClasses.push(styles$f.snackbar);
1946
- cssClasses.push(`shadow-lg`);
1947
- cssClasses.push(styles$f[color]);
1948
- return cssClasses.filter(css => css).join(' ');
1949
- };
1950
- const handleClickAction = (e) => {
1951
- onOk && onOk(e);
1952
- };
1953
- return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest),
1954
- React__default["default"].createElement("div", { className: styles$f.text }, children),
1955
- React__default["default"].createElement("div", { className: styles$f.action + " text-accent", onClick: handleClickAction },
1956
- React__default["default"].createElement("span", null, actionText))));
1957
- };
1958
-
1959
- class SnackbarService {
1960
- show(message, options) {
1961
- const defaultOptions = { timeout: 3000, actionText: 'ok', color: exports.COLOR.dark, target: document.body };
1962
- const mergedOptions = Object.assign(defaultOptions, options);
1963
- return new Promise((resolve) => {
1964
- if (this.container) {
1965
- this.hide();
1966
- }
1967
- this.container = document.createElement('div');
1968
- this.container.classList.add('snackbar-container');
1969
- mergedOptions.target.appendChild(this.container);
1970
- if (mergedOptions.timeout && mergedOptions.timeout > 0) {
1971
- this.handler = setTimeout(() => {
1972
- this.hide();
1973
- }, mergedOptions.timeout);
1974
- }
1975
- const handleOk = () => {
1976
- resolve();
1977
- this.hide();
1978
- };
1979
- reactDom.render(React__default["default"].createElement(Snackbar, { color: mergedOptions.color, actionText: mergedOptions.actionText, onOk: handleOk }, message), this.container);
1980
- });
1981
- }
1982
- hide() {
1983
- if (this.container) {
1984
- reactDom.unmountComponentAtNode(this.container);
1985
- document.body.removeChild(this.container);
1986
- this.container = undefined;
1987
- this.handler && clearTimeout(this.handler);
1988
- }
1989
- }
1990
- }
1991
- const snackbarService = new SnackbarService();
1992
-
1993
- var css_248z$e = ".SpeedDialActions-module_speedDialActions__cY2i3 {\n margin-bottom: -32px;\n flex-direction: column-reverse;\n padding-bottom: 48px;\n display: flex;\n pointer-events: auto; }\n";
1994
- var styles$e = {"speedDialActions":"SpeedDialActions-module_speedDialActions__cY2i3"};
1995
- styleInject(css_248z$e);
1996
-
1997
- const SpeedDialActions = (props) => {
1998
- const { children } = props;
1999
- const getCssClasses = () => {
2000
- const cssClasses = [];
2001
- cssClasses.push(styles$e.speedDialActions);
2002
- return cssClasses.filter(css => css).join(' ');
2003
- };
2004
- return (React__default["default"].createElement("div", { className: getCssClasses() }, children));
2005
- };
2006
-
2007
- var css_248z$d = ".SpeedDial-module_speedDial__W3VN2 {\n position: absolute;\n flex-direction: column-reverse;\n display: flex;\n z-index: 1050;\n align-items: center;\n right: 16px;\n bottom: 16px;\n transition: transform 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n";
2008
- var styles$d = {"speedDial":"SpeedDial-module_speedDial__W3VN2"};
2009
- styleInject(css_248z$d);
2010
-
2011
- const SpeedDial = (props) => {
2012
- const { children, className, open, onOpen, onClose } = props, rest = __rest(props, ["children", "className", "open", "onOpen", "onClose"]);
2013
- const getCssClasses = () => {
2014
- const cssClasses = [];
2015
- cssClasses.push(styles$d.speedDial);
2016
- className && cssClasses.push(className);
2017
- return cssClasses.filter(css => css).join(' ');
2018
- };
2019
- const handleClick = (e) => {
2020
- if (open)
2021
- onClose && onClose(e);
2022
- else
2023
- onOpen && onOpen(e);
2024
- };
2025
- return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest),
2026
- React__default["default"].createElement("div", { style: { 'transform': open ? 'rotate(45deg)' : undefined } },
2027
- React__default["default"].createElement(FloatingActionButton, { icon: React__default["default"].createElement(PlusSolidIcon, null), onClick: handleClick })),
2028
- open &&
2029
- React__default["default"].createElement(SpeedDialActions, null, children)));
2030
- };
2031
-
2032
- var css_248z$c = ".SpeedDialAction-module_speedDialAction__kJLpz + .SpeedDialAction-module_speedDialAction__kJLpz {\n margin-bottom: 10px; }\n";
2033
- var styles$c = {"speedDialAction":"SpeedDialAction-module_speedDialAction__kJLpz"};
2034
- styleInject(css_248z$c);
2035
-
2036
- const SpeedDialAction = (props) => {
2037
- const { icon, color = exports.COLOR.light, onClick, className } = props;
2038
- const getCssClasses = () => {
2039
- const cssClasses = [];
2040
- cssClasses.push(styles$c.speedDialAction);
2041
- className && cssClasses.push(className);
2042
- return cssClasses.filter(css => css).join(' ');
2043
- };
2044
- return (React__default["default"].createElement(IconButton, { className: getCssClasses(), icon: icon, color: color, variant: exports.VARIANT.contained, shadow: true, onClick: onClick }));
2045
- };
2046
-
2047
- const SpeedDialIcon = (props) => {
2048
- const { children, className } = props, rest = __rest(props, ["children", "className"]);
2049
- const getCssClasses = () => {
2050
- const cssClasses = [];
2051
- className && cssClasses.push(className);
2052
- return cssClasses.filter(css => css).join(' ');
2053
- };
2054
- return (React__default["default"].createElement(Icon, Object.assign({ className: getCssClasses() }, rest), children));
2055
- };
2056
-
2057
- var css_248z$b = ".StepperActions-module_stepperActions__hBUkh {\n display: flex; }\n";
2058
- var styles$b = {"stepperActions":"StepperActions-module_stepperActions__hBUkh"};
2059
- styleInject(css_248z$b);
2060
-
2061
- const StepperActions = (props) => {
2062
- const { className, isCompleted, isFirstStep, isStepOptional, onBack, onSkip, onNext, onReset } = props;
2063
- const getCssClasses = () => {
2064
- const cssClasses = [];
2065
- cssClasses.push(styles$b.stepperActions);
2066
- className && cssClasses.push(className);
2067
- return cssClasses.filter(css => css).join(' ');
2068
- };
2069
- return (React__default["default"].createElement("div", { className: getCssClasses() },
2070
- React__default["default"].createElement(Button, { className: "mr-2", variant: exports.VARIANT.outline, disabled: isFirstStep, startIcon: !isFirstStep ? React__default["default"].createElement(ChevronLeftSolidIcon, null) : undefined, onClick: () => onBack && onBack() }, "Back"),
2071
- React__default["default"].createElement("div", { className: "ml-auto" },
2072
- isCompleted && (React__default["default"].createElement(Button, { className: "mr-2", color: exports.COLOR.secondary, variant: exports.VARIANT.text, onClick: () => onReset && onReset() }, "Reset")),
2073
- isStepOptional && (React__default["default"].createElement(Button, { className: "mr-2", variant: exports.VARIANT.contained, color: exports.COLOR.primary, onClick: () => onSkip && onSkip() }, "Skip")),
2074
- React__default["default"].createElement(Button, { variant: exports.VARIANT.contained, color: exports.COLOR.primary, startIcon: isCompleted ? React__default["default"].createElement(CheckSolidIcon, null) : undefined, endIcon: !isCompleted ? React__default["default"].createElement(ChevronRightSolidIcon, null) : undefined, onClick: () => onNext && onNext() }, isCompleted ? 'Done' : 'Next'))));
2075
- };
2076
-
2077
- const StepPanel = (props) => {
2078
- const { children } = props;
2079
- return (React__default["default"].createElement("div", { className: "steppanel" }, children));
2080
- };
2081
-
2082
- var css_248z$a = ".StepConnector-module_stepConnector__A7A-7 {\n flex: 1 1 auto;\n flex-shrink: 0;\n min-width: 20px; }\n\n.StepConnector-module_stepConnectorLine__8rQxv {\n display: block;\n border-color: var(--secondary);\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n .StepConnector-module_stepConnectorLine__8rQxv.StepConnector-module_isActive__TUIKV {\n border-color: var(--primary); }\n\n.StepConnector-module_stepConnectorLineHorizontal__i09K0 {\n border-top-style: solid;\n border-top-width: 1px; }\n";
2083
- var styles$a = {"stepConnector":"StepConnector-module_stepConnector__A7A-7","stepConnectorLine":"StepConnector-module_stepConnectorLine__8rQxv","isActive":"StepConnector-module_isActive__TUIKV","stepConnectorLineHorizontal":"StepConnector-module_stepConnectorLineHorizontal__i09K0"};
2084
- styleInject(css_248z$a);
2085
-
2086
- const StepConnector = (props) => {
2087
- const { isActive, isHorizontal = true } = props;
2088
- const getCssClassesConnector = () => {
2089
- const cssClasses = [];
2090
- cssClasses.push(styles$a.stepConnector);
2091
- return cssClasses.filter(css => css).join(' ');
2092
- };
2093
- const getCssClassesLine = () => {
2094
- const cssClasses = [];
2095
- cssClasses.push(styles$a.stepConnectorLine);
2096
- isActive && cssClasses.push(styles$a['isActive']);
2097
- isHorizontal && cssClasses.push(styles$a.stepConnectorLineHorizontal);
2098
- return cssClasses.filter(css => css).join(' ');
2099
- };
2100
- return (React__default["default"].createElement("div", { className: getCssClassesConnector() },
2101
- React__default["default"].createElement("div", { className: getCssClassesLine() })));
2102
- };
2103
-
2104
- var css_248z$9 = ".Stepper-module_stepper__V6odG {\n display: flex;\n align-items: center;\n flex-direction: row;\n margin-bottom: 10px; }\n .Stepper-module_stepper__V6odG.Stepper-module_isHorizontal__Q-3Wu {\n overflow-x: auto; }\n";
2105
- var styles$9 = {"stepper":"Stepper-module_stepper__V6odG","isHorizontal":"Stepper-module_isHorizontal__Q-3Wu"};
2106
- styleInject(css_248z$9);
2107
-
2108
- const Stepper = (props) => {
2109
- const { children, isLinear = true, showLabel = true, showProgressCheckIcon = false, value, isHorizontal = true, onChange, onFinish } = props;
2110
- const [steps, setSteps] = React.useState();
2111
- const [activeIndex, setActiveIndex] = React__default["default"].useState(0);
2112
- const [skipped, setSkipped] = React__default["default"].useState(new Set());
2113
- React.useEffect(() => {
2114
- if (children) {
2115
- setSteps(React__default["default"].Children.toArray(children));
2116
- }
2117
- }, [children]);
2118
- React.useEffect(() => {
2119
- if (value !== undefined) {
2120
- setActiveIndex(value);
2121
- }
2122
- }, [value]);
2123
- const isStepSkipped = (step) => {
2124
- return skipped.has(step);
2125
- };
2126
- const handleClickStep = (event, newValue, index) => {
2127
- setActiveIndex(() => {
2128
- onChange && onChange(index);
2129
- return index;
2130
- });
2131
- };
2132
- const renderSteps = (child, index) => {
2133
- return React__default["default"].isValidElement(child) &&
2134
- React.cloneElement(child, {
2135
- index: index,
2136
- isActive: activeIndex >= index,
2137
- isDone: activeIndex > index,
2138
- isDisabled: isLinear && (activeIndex + 1 < index),
2139
- showLabel: showLabel,
2140
- showProgressCheckIcon: showProgressCheckIcon,
2141
- onClick: (e) => handleClickStep(e.event, e.value, index)
2142
- });
2143
- };
2144
- const isStepOptional = (index) => {
2145
- return steps && steps[index].props.isOptional;
2146
- };
2147
- const handleBack = () => {
2148
- setActiveIndex((prevActiveStep) => {
2149
- const newIndex = prevActiveStep - 1;
2150
- onChange && onChange(newIndex);
2151
- return newIndex;
2152
- });
2153
- };
2154
- // TODO
2155
- const handleSkip = () => {
2156
- if (!isStepOptional(activeIndex)) {
2157
- throw new Error("You can't skip a step that isn't optional.");
2158
- }
2159
- setActiveIndex((prevActiveStep) => prevActiveStep + 1);
2160
- setSkipped((prevSkipped) => {
2161
- const newSkipped = new Set(prevSkipped.values());
2162
- newSkipped.add(activeIndex);
2163
- return newSkipped;
2164
- });
2165
- };
2166
- // TODO
2167
- const handleNext = () => {
2168
- if (!isLastStep()) {
2169
- let newSkipped = skipped;
2170
- if (isStepSkipped(activeIndex)) {
2171
- newSkipped = new Set(newSkipped.values());
2172
- newSkipped.delete(activeIndex);
2173
- }
2174
- setActiveIndex((prevActiveStep) => {
2175
- const newIndex = prevActiveStep + 1;
2176
- onChange && onChange(newIndex);
2177
- return newIndex;
2178
- });
2179
- setSkipped(newSkipped);
2180
- }
2181
- else {
2182
- onFinish && onFinish();
2183
- }
2184
- };
2185
- const handleReset = () => {
2186
- setActiveIndex(0);
2187
- onChange && onChange(0);
2188
- };
2189
- const isLastStep = () => {
2190
- return steps && activeIndex === steps.length - 1;
2191
- };
2192
- const getCssClasses = () => {
2193
- const cssClasses = [];
2194
- cssClasses.push(styles$9.stepper);
2195
- isHorizontal && cssClasses.push(styles$9['isHorizontal']);
2196
- return cssClasses.filter(css => css).join(' ');
2197
- };
2198
- return (React__default["default"].createElement(React__default["default"].Fragment, null, steps &&
2199
- React__default["default"].createElement(React__default["default"].Fragment, null,
2200
- React__default["default"].createElement("div", { className: getCssClasses() }, steps.map((child, index) => (React__default["default"].createElement(React__default["default"].Fragment, { key: child.props.value },
2201
- renderSteps(child, index),
2202
- index !== steps.length - 1 && React__default["default"].createElement(StepConnector, { isActive: activeIndex > index }))))),
2203
- steps && steps.map((step, index) => React__default["default"].createElement(React.Fragment, { key: step.props.value }, index === activeIndex &&
2204
- React__default["default"].createElement(StepPanel, null, step.props.children))),
2205
- React__default["default"].createElement(StepperActions, { className: "mt-3", isFirstStep: activeIndex === 0, isStepOptional: isStepOptional(activeIndex), isCompleted: isLastStep(), onBack: handleBack, onSkip: handleSkip, onNext: handleNext, onReset: handleReset }))));
2206
- };
2207
-
2208
- var css_248z$8 = ".Typography-module_typography__sw-td {\n text-overflow: ellipsis;\n overflow: hidden !important; }\n";
2209
- var styles$8 = {"typography":"Typography-module_typography__sw-td"};
2210
- styleInject(css_248z$8);
2211
-
2212
- const Wrapper = (props) => {
2213
- const { as = 'span', children, className } = props, rest = __rest(props, ["as", "children", "className"]);
2214
- const getCssClasses = () => {
2215
- const cssClasses = [];
2216
- cssClasses.push(styles$8.typography);
2217
- className && cssClasses.push(className);
2218
- return cssClasses.filter(css => css).join(' ');
2219
- };
2220
- return React__default["default"].createElement(as, Object.assign(Object.assign({}, rest), { className: getCssClasses() }), children);
2221
- };
2222
- const Typography = (_a) => {
2223
- var { children, as = 'span' } = _a, rest = __rest(_a, ["children", "as"]);
2224
- return (React__default["default"].createElement(Wrapper, Object.assign({ as: as }, rest), children));
2225
- };
2226
-
2227
- var css_248z$7 = ".Step-module_stepWrapper__IQwq1 {\n display: flex;\n align-items: center;\n padding-left: 8px;\n padding-right: 8px;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n .Step-module_stepWrapper__IQwq1.Step-module_hasLabel__LZNvd:not(.Step-module_disabled__JnxUP):hover {\n cursor: pointer;\n background-color: rgba(0, 0, 0, 0.04);\n border-radius: var(--borderRadius); }\n\n.Step-module_step__k42go {\n width: 40px;\n height: 40px;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n .Step-module_step__k42go:not(.Step-module_hasLabel__LZNvd):not(.Step-module_disabled__JnxUP):hover {\n border-radius: 100%;\n cursor: pointer;\n background-color: rgba(0, 0, 0, 0.04); }\n .Step-module_step__k42go.Step-module_hasLabel__LZNvd svg {\n width: 18px !important;\n height: 18px !important; }\n\n.Step-module_stepIconCircle__hnxIV svg {\n width: 24px;\n height: 24px; }\n\n.Step-module_stepValue__B0-xv {\n position: absolute;\n color: var(--secondary-contrast-text); }\n .Step-module_stepValue__B0-xv .Step-module_isActive__3GGcl {\n color: var(--primary-contrast-text); }\n";
2228
- var styles$7 = {"stepWrapper":"Step-module_stepWrapper__IQwq1","hasLabel":"Step-module_hasLabel__LZNvd","disabled":"Step-module_disabled__JnxUP","step":"Step-module_step__k42go","stepIconCircle":"Step-module_stepIconCircle__hnxIV","stepValue":"Step-module_stepValue__B0-xv","isActive":"Step-module_isActive__3GGcl"};
2229
- styleInject(css_248z$7);
2230
-
2231
- const Step = (props) => {
2232
- const { className, label, showLabel, index, value, isActive, isDone, isDisabled, showProgressCheckIcon, onClick } = props;
2233
- const [hoverRef, isHovered] = useHover();
2234
- const handleClick = (event) => {
2235
- if (!isDisabled) {
2236
- onClick && onClick({ event, value });
2237
- }
2238
- };
2239
- const getCssClasses = () => {
2240
- const cssClasses = [];
2241
- cssClasses.push(styles$7.stepWrapper);
2242
- label && showLabel && cssClasses.push(styles$7['hasLabel']);
2243
- isDisabled && cssClasses.push(styles$7['disabled']);
2244
- className && cssClasses.push(className);
2245
- return cssClasses.filter(css => css).join(' ');
2246
- };
2247
- const getCssClassesStep = () => {
2248
- const cssClasses = [];
2249
- cssClasses.push(styles$7.step);
2250
- label && showLabel && cssClasses.push(styles$7['hasLabel']);
2251
- isDisabled && cssClasses.push(styles$7['disabled']);
2252
- return cssClasses.filter(css => css).join(' ');
2253
- };
2254
- const getCssClassesStepValue = () => {
2255
- const cssClasses = [];
2256
- cssClasses.push(styles$7.stepValue);
2257
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
2258
- isActive && cssClasses.push(styles$7.stepValue['isActive']);
2259
- return cssClasses.filter(css => css).join(' ');
2260
- };
2261
- return (React__default["default"].createElement("div", { ref: hoverRef, className: getCssClasses(), onClick: handleClick },
2262
- React__default["default"].createElement("div", { className: getCssClassesStep() },
2263
- React__default["default"].createElement(Icon, { className: styles$7.stepIconCircle, iconColor: (isHovered || isActive) && !isDisabled ? exports.COLOR.primary : exports.COLOR.secondary },
2264
- React__default["default"].createElement(CircleSolidIcon, null)),
2265
- React__default["default"].createElement("div", { className: getCssClassesStepValue() }, showProgressCheckIcon && isActive && isDone ?
2266
- React__default["default"].createElement(Icon, null,
2267
- React__default["default"].createElement(CheckSolidIcon, null))
2268
- :
2269
- React__default["default"].createElement(Typography, null, index + 1))),
2270
- label && showLabel &&
2271
- React__default["default"].createElement(Typography, { className: "flex-shrink-0" }, label)));
2272
- };
2273
-
2274
- var css_248z$6 = ".Table-module_table__DHKNv {\n --bs-table-bg: transparent;\n --bs-table-accent-bg: transparent;\n --bs-table-striped-color: #212529;\n --bs-table-striped-bg: rgba(0, 0, 0, 0.05);\n --bs-table-active-color: #212529;\n --bs-table-active-bg: rgba(0, 0, 0, 0.1);\n --bs-table-hover-color: #212529;\n --bs-table-hover-bg: rgba(0, 0, 0, 0.075);\n width: 100%;\n margin-bottom: 1rem;\n color: #212529;\n vertical-align: top;\n border-color: #dee2e6; }\n .Table-module_table__DHKNv thead {\n vertical-align: bottom; }\n .Table-module_table__DHKNv > :not(caption) > * > * {\n padding: 0.5rem 0.5rem;\n background-color: var(--bs-table-bg);\n border-bottom-width: 1px;\n box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg); }\n .Table-module_table__DHKNv > :not(:first-child) {\n border-top: 2px solid currentColor; }\n\n.Table-module_bordered__1Kp1p > :not(caption) > * > * {\n border-width: 0 1px; }\n\n.Table-module_bordered__1Kp1p > :not(caption) > * {\n border-width: 1px 0; }\n\n.Table-module_striped__jmxgE > tbody > tr:nth-of-type(odd) > * {\n --bs-table-accent-bg: var(--bs-table-striped-bg);\n color: var(--bs-table-striped-color); }\n\n.Table-module_hover__P6r3y > tbody > tr:hover > * {\n --bs-table-accent-bg: var(--bs-table-hover-bg);\n color: var(--bs-table-hover-color); }\n\n.Table-module_tableResponsive__ykttB {\n overflow-x: auto; }\n";
2275
- var styles$6 = {"table":"Table-module_table__DHKNv","bordered":"Table-module_bordered__1Kp1p","striped":"Table-module_striped__jmxgE","hover":"Table-module_hover__P6r3y","tableResponsive":"Table-module_tableResponsive__ykttB"};
2276
- styleInject(css_248z$6);
2277
-
2278
- const Table = (props) => {
2279
- const { children, className, bordered, striped, hover, responsive = false } = props;
2280
- const getCssClasses = () => {
2281
- const cssClasses = [];
2282
- cssClasses.push(styles$6.table);
2283
- bordered && cssClasses.push(styles$6['bordered']);
2284
- striped && cssClasses.push(styles$6['striped']);
2285
- hover && cssClasses.push(styles$6['hover']);
2286
- className && cssClasses.push(className);
2287
- return cssClasses.filter(css => css).join(' ');
2288
- };
2289
- return (React__default["default"].createElement(ConditionalWrapper, { condition: responsive, wrapper: children => React__default["default"].createElement("div", { className: styles$6.tableResponsive }, children) },
2290
- React__default["default"].createElement("table", { className: getCssClasses() }, children)));
2291
- };
2292
-
2293
- var css_248z$5 = ".TabIndicator-module_tabIndicator__jSJhH {\n bottom: 0;\n height: 2px;\n position: absolute;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n .TabIndicator-module_tabIndicator__jSJhH.TabIndicator-module_primary__Q5jEo {\n background-color: var(--primary); }\n .TabIndicator-module_tabIndicator__jSJhH.TabIndicator-module_accent__qbgIG {\n background-color: var(--accent); }\n";
2294
- var styles$5 = {"tabIndicator":"TabIndicator-module_tabIndicator__jSJhH","primary":"TabIndicator-module_primary__Q5jEo","accent":"TabIndicator-module_accent__qbgIG"};
2295
- styleInject(css_248z$5);
2296
-
2297
- const TabIndicator = (props) => {
2298
- const { color = exports.COLOR.accent, width, amount, index } = props;
2299
- const getCssClasses = () => {
2300
- const cssClasses = [];
2301
- cssClasses.push(styles$5.tabIndicator);
2302
- cssClasses.push(styles$5[color]);
2303
- return cssClasses.filter(css => css).join(' ');
2304
- };
2305
- return (React__default["default"].createElement("span", { className: getCssClasses(), style: {
2306
- width: width,
2307
- left: `calc(calc(100% / ${amount}) * ${index})`
2308
- } }));
2309
- };
2310
-
2311
- var css_248z$4 = ".Tabs-module_tabs__YyRTZ {\n display: flex;\n position: relative; }\n";
2312
- var styles$4 = {"tabs":"Tabs-module_tabs__YyRTZ"};
2313
- styleInject(css_248z$4);
2314
-
2315
- const Tabs = (props) => {
2316
- const { children, className, fixed, indicatorColor, onChange, value } = props;
2317
- const [selectedValue, setSelectedValue] = React.useState(value);
2318
- const [selectedIndex, setSelectedIndex] = React.useState();
2319
- React.useEffect(() => {
2320
- React__default["default"].Children.toArray(children).forEach((child, index) => {
2321
- if (child.props.value === value) {
2322
- setSelectedIndex(index);
2323
- }
2324
- });
2325
- }, [children, value]);
2326
- const getCssClasses = () => {
2327
- const cssClasses = [];
2328
- cssClasses.push(styles$4.tabs);
2329
- className && cssClasses.push(className);
2330
- return cssClasses.filter(css => css).join(' ');
2331
- };
2332
- const handleClickTab = (event, newValue, index) => {
2333
- setSelectedValue(newValue);
2334
- setSelectedIndex(index);
2335
- onChange && onChange({ event, newValue });
2336
- };
2337
- const renderTabs = (child, index) => {
2338
- return React__default["default"].isValidElement(child) && React.cloneElement(child, {
2339
- key: child.props.value,
2340
- isActive: child.props.value === selectedValue,
2341
- fixed: fixed,
2342
- onClick: (e) => handleClickTab(e.event, e.value, index),
2343
- });
2344
- };
2345
- return (React__default["default"].createElement(React__default["default"].Fragment, null,
2346
- React__default["default"].createElement("div", { className: getCssClasses() },
2347
- children && React__default["default"].Children.toArray(children).map((child, index) => renderTabs(child, index)),
2348
- children &&
2349
- React__default["default"].createElement(TabIndicator, { color: indicatorColor, width: (100 / React__default["default"].Children.toArray(children).length) + '%', index: selectedIndex, amount: React__default["default"].Children.toArray(children).length }))));
2350
- };
2351
-
2352
- var css_248z$3 = ".Tab-module_tab__Q8w1f {\n padding: 6px 12px;\n overflow: hidden;\n position: relative;\n font-size: 0.875rem;\n min-width: 72px;\n box-sizing: border-box;\n min-height: 48px;\n text-align: center;\n font-weight: 500;\n line-height: 1.75;\n white-space: normal;\n letter-spacing: 0.02857em;\n text-transform: uppercase;\n border-radius: 0;\n flex-grow: 1;\n flex-basis: 0;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n";
2353
- var styles$3 = {"tab":"Tab-module_tab__Q8w1f"};
2354
- styleInject(css_248z$3);
2355
-
2356
- const Tab = (props) => {
2357
- const { label, className, isActive, disabled, value, onClick } = props;
2358
- const getCssClasses = () => {
2359
- const cssClasses = [];
2360
- cssClasses.push(styles$3.tab);
2361
- if (isActive) {
2362
- cssClasses.push(`show active`);
2363
- }
2364
- className && cssClasses.push(className);
2365
- return cssClasses.filter(css => css).join(' ');
2366
- };
2367
- return (React__default["default"].createElement(Button, { className: getCssClasses(), onClick: (event) => onClick && onClick({ event, value }), isActive: isActive, disabled: disabled }, label));
2368
- };
2369
-
2370
- const TabPanel = (props) => {
2371
- const { children, value, index } = props, rest = __rest(props, ["children", "value", "index"]);
2372
- return (React__default["default"].createElement("div", Object.assign({ role: "tabpanel", hidden: value !== index, id: `tabpanel-${index}`, "aria-labelledby": `wrapped-tab-${index}` }, rest), value === index && children));
2373
- };
2374
-
2375
- var css_248z$2 = ".Tooltip-module_tooltipContainer__9ZWx3 {\n display: inline; }\n\n.Tooltip-module_tooltip__x5HOu {\n background-color: #333;\n color: white;\n padding: 5px 10px;\n border-radius: 4px;\n font-size: 13px;\n position: absolute;\n left: -1000000px;\n z-index: 1100; }\n .Tooltip-module_tooltip__x5HOu #Tooltip-module_arrow__B6lfe,\n .Tooltip-module_tooltip__x5HOu #Tooltip-module_arrow__B6lfe::before {\n position: absolute;\n width: 8px;\n height: 8px;\n z-index: -1; }\n .Tooltip-module_tooltip__x5HOu #Tooltip-module_arrow__B6lfe::before {\n content: \"\";\n transform: rotate(45deg);\n background: #333; }\n .Tooltip-module_tooltip__x5HOu[data-popper-placement^=\"top\"] > #Tooltip-module_arrow__B6lfe {\n bottom: -4px; }\n .Tooltip-module_tooltip__x5HOu[data-popper-placement^=\"bottom\"] > #Tooltip-module_arrow__B6lfe {\n top: -4px; }\n .Tooltip-module_tooltip__x5HOu[data-popper-placement^=\"left\"] > #Tooltip-module_arrow__B6lfe {\n right: -4px; }\n .Tooltip-module_tooltip__x5HOu[data-popper-placement^=\"right\"] > #Tooltip-module_arrow__B6lfe {\n left: -4px; }\n";
2376
- var styles$2 = {"tooltipContainer":"Tooltip-module_tooltipContainer__9ZWx3","tooltip":"Tooltip-module_tooltip__x5HOu","arrow":"Tooltip-module_arrow__B6lfe"};
2377
- styleInject(css_248z$2);
2378
-
2379
- const Tooltip = (props) => {
2380
- const { children, text, placement = 'bottom' } = props;
2381
- const [show, setShow] = React.useState(false);
2382
- const refChild = React.useRef();
2383
- const refTooltip = React.useRef();
2384
- React.useEffect(() => {
2385
- if (show === true && refChild && refChild.current && refTooltip && refTooltip.current) {
2386
- // TODO - extract to own component?
2387
- core.createPopper(refChild.current, refTooltip.current, {
2388
- placement: placement,
2389
- modifiers: [
2390
- {
2391
- name: 'offset',
2392
- options: { offset: [0, 8] }
2393
- },
2394
- ]
2395
- });
2396
- }
2397
- }, [show]);
2398
- const handleMouseOver = () => {
2399
- setShow(true);
2400
- };
2401
- const handleMouseLeave = () => {
2402
- setShow(false);
2403
- };
2404
- return (React__default["default"].createElement(React__default["default"].Fragment, null,
2405
- React__default["default"].createElement("div", { className: styles$2.tooltipContainer, ref: refChild, id: "tooltip-container" }, React.cloneElement(children, {
2406
- onMouseOver: handleMouseOver,
2407
- onMouseLeave: handleMouseLeave,
2408
- })),
2409
- show &&
2410
- React__default["default"].createElement("div", { className: styles$2.tooltip, ref: refTooltip, id: "tooltip" },
2411
- text,
2412
- React__default["default"].createElement("div", { id: "arrow", "data-popper-arrow": true }))));
2413
- };
2414
-
2415
- const HourSelect = (props) => {
2416
- const { className, value = 0, id, name, disabled, onChange } = props;
2417
- const [newValue, setNewValue] = React.useState(value);
2418
- const [hourOptions, setHourOptions] = React.useState();
2419
- React.useEffect(() => {
2420
- const newHourOptions = [];
2421
- for (let i = 0; i < 24; i++) {
2422
- newHourOptions.push({ value: i.toString(), label: i.toString() });
2423
- }
2424
- setHourOptions(newHourOptions);
2425
- }, []);
2426
- const getCssClasses = () => {
2427
- const cssClasses = [];
2428
- className && cssClasses.push(className);
2429
- return cssClasses.filter(css => css).join(' ');
2430
- };
2431
- const handleOnChange = (e) => {
2432
- setNewValue(e);
2433
- onChange && onChange(e);
2434
- };
2435
- return (React__default["default"].createElement(Select, { id: id, name: name, className: getCssClasses(), options: hourOptions, onChange: (e) => handleOnChange(parseInt(e)), disabled: disabled, value: newValue.toString() }));
2436
- };
2437
-
2438
- const MilliSecondSelect = (props) => {
2439
- const { className, value = 0, steps = 100, id, name, disabled, onChange } = props;
2440
- const [newValue, setNewValue] = React.useState(value);
2441
- const [milliSecondOptions, setMilliSecondOptions] = React.useState();
2442
- React.useEffect(() => {
2443
- const newMilliSecondOptions = [];
2444
- for (let i = 0; i < 1000; i += steps) {
2445
- newMilliSecondOptions.push({ value: i.toString(), label: i.toString() });
2446
- }
2447
- setMilliSecondOptions(newMilliSecondOptions);
2448
- }, []);
2449
- const getCssClasses = () => {
2450
- const cssClasses = [];
2451
- className && cssClasses.push(className);
2452
- return cssClasses.filter(css => css).join(' ');
2453
- };
2454
- const handleOnChange = (e) => {
2455
- setNewValue(e);
2456
- onChange && onChange(e);
2457
- };
2458
- return (React__default["default"].createElement(Select, { id: id, name: name, className: getCssClasses(), options: milliSecondOptions, onChange: (e) => handleOnChange(parseInt(e)), disabled: disabled, value: newValue.toString() }));
2459
- };
2460
-
2461
- const MinuteSelect = (props) => {
2462
- const { className, value = 0, id, name, disabled, onChange } = props;
2463
- const [newValue, setNewValue] = React.useState(value);
2464
- const [minuteOptions, setMinuteOptions] = React.useState();
2465
- React.useEffect(() => {
2466
- const newMinuteOptions = [];
2467
- for (let i = 0; i < 60; i++) {
2468
- newMinuteOptions.push({ value: i.toString(), label: i.toString() });
2469
- }
2470
- setMinuteOptions(newMinuteOptions);
2471
- }, []);
2472
- const getCssClasses = () => {
2473
- const cssClasses = [];
2474
- className && cssClasses.push(className);
2475
- return cssClasses.filter(css => css).join(' ');
2476
- };
2477
- const handleOnChange = (e) => {
2478
- setNewValue(e);
2479
- onChange && onChange(e);
2480
- };
2481
- return (React__default["default"].createElement(Select, { id: id, name: name, className: getCssClasses(), options: minuteOptions, onChange: (e) => handleOnChange(parseInt(e)), disabled: disabled, value: newValue.toString() }));
2482
- };
2483
-
2484
- const SecondSelect = (props) => {
2485
- const { className, value = 0, id, name, disabled, onChange } = props;
2486
- const [newValue, setNewValue] = React.useState(value);
2487
- const [secondOptions, setSecondOptions] = React.useState();
2488
- React.useEffect(() => {
2489
- const newSecondOptions = [];
2490
- for (let i = 0; i < 60; i++) {
2491
- newSecondOptions.push({ value: i.toString(), label: i.toString() });
2492
- }
2493
- setSecondOptions(newSecondOptions);
2494
- }, []);
2495
- const getCssClasses = () => {
2496
- const cssClasses = [];
2497
- className && cssClasses.push(className);
2498
- return cssClasses.filter(css => css).join(' ');
2499
- };
2500
- const handleOnChange = (e) => {
2501
- setNewValue(e);
2502
- onChange && onChange(e);
2503
- };
2504
- return (React__default["default"].createElement(Select, { id: id, name: name, className: getCssClasses(), options: secondOptions, onChange: (e) => handleOnChange(parseInt(e)), disabled: disabled, value: newValue.toString() }));
2505
- };
2506
-
2507
- exports.TIMEMODE = void 0;
2508
- (function (TIMEMODE) {
2509
- TIMEMODE[TIMEMODE["HOUR"] = 0] = "HOUR";
2510
- TIMEMODE[TIMEMODE["MINUTE"] = 1] = "MINUTE";
2511
- TIMEMODE[TIMEMODE["SECONDS"] = 2] = "SECONDS";
2512
- TIMEMODE[TIMEMODE["MILLISECONDS"] = 3] = "MILLISECONDS";
2513
- })(exports.TIMEMODE || (exports.TIMEMODE = {}));
2514
- const TimeSelect = (props) => {
2515
- const { className, value = new Date(), disabled, showHours = true, showMinutes = true, showSeconds = false, showMilliSeconds = false, onChange } = props;
2516
- const [currDate, setCurrDate] = React.useState(value);
2517
- const getCssClasses = () => {
2518
- const cssClasses = [];
2519
- cssClasses.push('row');
2520
- className && cssClasses.push(className);
2521
- return cssClasses.filter(css => css).join(' ');
2522
- };
2523
- const handleOnChange = (e, mode) => {
2524
- const currYear = currDate.getFullYear();
2525
- const currMonth = currDate.getMonth();
2526
- const currday = currDate.getDate();
2527
- const currHour = mode === exports.TIMEMODE.HOUR ? e : currDate.getHours();
2528
- const currMinute = mode === exports.TIMEMODE.MINUTE ? e : currDate.getMinutes();
2529
- const currSeconds = mode === exports.TIMEMODE.SECONDS ? e : currDate.getSeconds();
2530
- const currMilliSeconds = mode === exports.TIMEMODE.MILLISECONDS ? e : currDate.getMilliseconds();
2531
- const newDate = new Date(currYear, currMonth, currday, currHour, currMinute, currSeconds, currMilliSeconds);
2532
- setCurrDate(newDate);
2533
- onChange && onChange(newDate);
2534
- };
2535
- return (React__default["default"].createElement("div", { className: getCssClasses() },
2536
- showHours &&
2537
- React__default["default"].createElement(FormGroup, { className: "col" },
2538
- React__default["default"].createElement(FormLabel, null, "Hours"),
2539
- React__default["default"].createElement(HourSelect, { className: "form-control", value: currDate.getHours(), disabled: disabled, onChange: e => handleOnChange(e, exports.TIMEMODE.HOUR) })),
2540
- showMinutes &&
2541
- React__default["default"].createElement(FormGroup, { className: "col" },
2542
- React__default["default"].createElement(FormLabel, null, "Minutes"),
2543
- React__default["default"].createElement(MinuteSelect, { className: "form-control", value: currDate.getMinutes(), disabled: disabled, onChange: e => handleOnChange(e, exports.TIMEMODE.MINUTE) })),
2544
- showSeconds &&
2545
- React__default["default"].createElement(FormGroup, { className: "col" },
2546
- React__default["default"].createElement(FormLabel, null, "Seconds"),
2547
- React__default["default"].createElement(SecondSelect, { className: "form-control", value: currDate.getSeconds(), disabled: disabled, onChange: e => handleOnChange(e, exports.TIMEMODE.SECONDS) })),
2548
- showMilliSeconds &&
2549
- React__default["default"].createElement(FormGroup, { className: "col" },
2550
- React__default["default"].createElement(FormLabel, null, "Milliseconds"),
2551
- React__default["default"].createElement(MilliSecondSelect, { className: "form-control", value: currDate.getMilliseconds(), disabled: disabled, onChange: e => handleOnChange(e, exports.TIMEMODE.MILLISECONDS) }))));
2552
- };
2553
-
2554
- var css_248z$1 = ".TreeView-module_treeView__VVj-4 {\n list-style-type: none;\n margin-bottom: 0;\n padding-left: 0px !important; }\n .TreeView-module_treeView__VVj-4 ul {\n padding-left: 48px !important; }\n";
2555
- var styles$1 = {"treeView":"TreeView-module_treeView__VVj-4"};
2556
- styleInject(css_248z$1);
2557
-
2558
- const TreeView = (props) => {
2559
- const { children, className } = props, rest = __rest(props, ["children", "className"]);
2560
- const getCssClasses = () => {
2561
- const cssClasses = [];
2562
- cssClasses.push(styles$1.treeView);
2563
- className && cssClasses.push(className);
2564
- return cssClasses.filter(css => css).join(' ');
2565
- };
2566
- return (React__default["default"].createElement("ul", Object.assign({ className: getCssClasses() }, rest), children));
2567
- };
2568
-
2569
- var css_248z = ".TreeItem-module_treeItem__Mxsjr {\n display: flex;\n flex-direction: column;\n min-height: 48px;\n justify-content: center; }\n";
2570
- var styles = {"treeItem":"TreeItem-module_treeItem__Mxsjr"};
2571
- styleInject(css_248z);
2572
-
2573
- const TreeItem = (props) => {
2574
- const { nodeId, label, children, className, isExpanded, isSelected, isSelectable, onToggleExpand, onItemSelect } = props;
2575
- const [_isExpanded, setIsExpanded] = React.useState(false);
2576
- const [_isSelected, setIsSelected] = React.useState(false);
2577
- const getCssClasses = () => {
2578
- const cssClasses = [];
2579
- cssClasses.push(styles.treeItem);
2580
- className && cssClasses.push(className);
2581
- return cssClasses.filter(css => css).join(' ');
2582
- };
2583
- React.useEffect(() => {
2584
- if (isExpanded !== undefined)
2585
- setIsExpanded(isExpanded);
2586
- }, [isExpanded]);
2587
- React.useEffect(() => {
2588
- if (isSelected !== undefined)
2589
- setIsSelected(isSelected);
2590
- }, [isSelected]);
2591
- const handleOnToggleExpand = (nodeId) => {
2592
- setIsExpanded(!_isExpanded);
2593
- onToggleExpand && onToggleExpand(nodeId);
2594
- };
2595
- const handleOnSelect = (nodeId) => {
2596
- setIsSelected(!_isSelected);
2597
- onItemSelect && onItemSelect({ id: nodeId, isSelected: !_isSelected });
2598
- };
2599
- return (React__default["default"].createElement("li", { className: getCssClasses(), style: { paddingLeft: `${(48 * (children ? 0 : 1))}px` } },
2600
- React__default["default"].createElement("div", { className: "d-flex align-items-center" },
2601
- children &&
2602
- React__default["default"].createElement(IconButton, { onClick: () => handleOnToggleExpand(nodeId), icon: !_isExpanded ? React__default["default"].createElement(ChevronRightSolidIcon, null) : React__default["default"].createElement(ChevronDownSolidIcon, null) }),
2603
- isSelectable &&
2604
- React__default["default"].createElement(Checkbox, { checked: _isSelected, onChange: () => handleOnSelect(nodeId) }),
2605
- label),
2606
- children && _isExpanded ? React__default["default"].createElement("ul", null, children) : null));
2607
- };
2608
-
2609
- exports.Alert = Alert;
2610
- exports.AppBar = AppBar;
2611
- exports.AppBarTitle = AppBarTitle;
2612
- exports.AutoComplete = AutoComplete;
2613
- exports.Backdrop = Backdrop;
2614
- exports.Badge = Badge;
2615
- exports.Breadcrumb = Breadcrumb;
2616
- exports.BreadcrumbItem = BreadcrumbItem;
2617
- exports.Button = Button;
2618
- exports.ButtonGroup = ButtonGroup;
2619
- exports.Card = Card;
2620
- exports.CardBody = CardBody;
2621
- exports.CardFooter = CardFooter;
2622
- exports.CardImage = CardImage;
2623
- exports.CardSubtitle = CardSubtitle;
2624
- exports.CardText = CardText;
2625
- exports.CardTitle = CardTitle;
2626
- exports.CaretDownSolidIcon = CaretDownSolidIcon;
2627
- exports.CheckSolidIcon = CheckSolidIcon;
2628
- exports.CheckSquareRegularIcon = CheckSquareRegularIcon;
2629
- exports.Checkbox = Checkbox;
2630
- exports.ChevronDownSolidIcon = ChevronDownSolidIcon;
2631
- exports.ChevronLeftSolidIcon = ChevronLeftSolidIcon;
2632
- exports.ChevronRightSolidIcon = ChevronRightSolidIcon;
2633
- exports.ChevronUpSolidIcon = ChevronUpSolidIcon;
2634
- exports.Chip = Chip;
2635
- exports.CircleSolidIcon = CircleSolidIcon;
2636
- exports.Column = Column;
2637
- exports.ConditionalWrapper = ConditionalWrapper;
2638
- exports.DateSelect = DateSelect;
2639
- exports.DaySelect = DaySelect;
2640
- exports.Drawer = Drawer;
2641
- exports.EmailValidator = EmailValidator;
2642
- exports.ExpansionPanel = ExpansionPanel;
2643
- exports.ExpansionPanelContent = ExpansionPanelContent;
2644
- exports.ExpansionPanelHeader = ExpansionPanelHeader;
2645
- exports.FileInput = FileInput;
2646
- exports.FloatingActionButton = FloatingActionButton;
2647
- exports.Form = Form;
2648
- exports.FormControl = FormControl;
2649
- exports.FormError = FormError;
2650
- exports.FormGroup = FormGroup;
2651
- exports.FormHint = FormHint;
2652
- exports.FormInput = FormInput;
2653
- exports.FormLabel = FormLabel;
2654
- exports.GlobalModal = GlobalModal;
2655
- exports.HomeSolidIcon = HomeSolidIcon;
2656
- exports.HourSelect = HourSelect;
2657
- exports.Icon = Icon;
2658
- exports.IconButton = IconButton;
2659
- exports.IsEmptyValidator = IsEmptyValidator;
2660
- exports.IsEqualValidator = IsEqualValidator;
2661
- exports.Link = Link;
2662
- exports.List = List;
2663
- exports.ListItem = ListItem;
2664
- exports.ListItemAction = ListItemAction;
2665
- exports.ListItemAvatar = ListItemAvatar;
2666
- exports.ListItemIcon = ListItemIcon;
2667
- exports.ListItemText = ListItemText;
2668
- exports.LoadingIndicator = LoadingIndicator;
2669
- exports.LoadingIndicatorContainer = LoadingIndicatorContainer;
2670
- exports.Menu = Menu;
2671
- exports.MenuBody = MenuBody;
2672
- exports.MenuDivider = MenuDivider;
2673
- exports.MenuItem = MenuItem;
2674
- exports.MenuToggle = MenuToggle;
2675
- exports.MilliSecondSelect = MilliSecondSelect;
2676
- exports.MinuteSelect = MinuteSelect;
2677
- exports.Modal = Modal;
2678
- exports.ModalBody = ModalBody;
2679
- exports.ModalFooter = ModalFooter;
2680
- exports.ModalHeader = ModalHeader;
2681
- exports.MonthSelect = MonthSelect;
2682
- exports.NumberSelect = NumberSelect;
2683
- exports.PlusSolidIcon = PlusSolidIcon;
2684
- exports.Row = Row;
2685
- exports.STATUS = STATUS;
2686
- exports.SecondSelect = SecondSelect;
2687
- exports.Select = Select;
2688
- exports.Sidebar = Sidebar;
2689
- exports.Snackbar = Snackbar;
2690
- exports.SpeedDial = SpeedDial;
2691
- exports.SpeedDialAction = SpeedDialAction;
2692
- exports.SpeedDialIcon = SpeedDialIcon;
2693
- exports.SpinnerSolidIcon = SpinnerSolidIcon;
2694
- exports.SquareRegularIcon = SquareRegularIcon;
2695
- exports.Step = Step;
2696
- exports.Stepper = Stepper;
2697
- exports.StepperActions = StepperActions;
2698
- exports.Tab = Tab;
2699
- exports.TabPanel = TabPanel;
2700
- exports.Table = Table;
2701
- exports.Tabs = Tabs;
2702
- exports.Textarea = Textarea;
2703
- exports.TimeSelect = TimeSelect;
2704
- exports.TimesCircleSolidIcon = TimesCircleSolidIcon;
2705
- exports.TimesSolidIcon = TimesSolidIcon;
2706
- exports.Tooltip = Tooltip;
2707
- exports.TreeItem = TreeItem;
2708
- exports.TreeView = TreeView;
2709
- exports.Typography = Typography;
2710
- exports.YearSelect = YearSelect;
2711
- exports.loadingIndicatorService = loadingIndicatorService;
2712
- exports.modalService = modalService;
2713
- exports.snackbarService = snackbarService;
2714
- exports.useConstructor = useConstructor;
2715
- exports.useDebounce = useDebounce;
2716
- exports.useHover = useHover;
2717
- exports.useWindowSize = useWindowSize;