@aarhus-university/au-lib-react-components 10.3.3 → 10.6.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 (113) hide show
  1. package/.eslintrc.js +34 -44
  2. package/.storybook/main.js +8 -0
  3. package/{types/common/payloads.d.ts → .storybook/preview-head.html} +0 -0
  4. package/.storybook/preview.js +11 -0
  5. package/README.md +19 -19
  6. package/__tests__/jest/AUButtonComponent.test.tsx +163 -0
  7. package/__tests__/jest/AUSpinnerComponent.test.tsx +57 -0
  8. package/__tests__/jest/helpers.test.ts +15 -0
  9. package/__tests__/jest/setupTests.ts +2 -0
  10. package/babel.config.js +8 -7
  11. package/build/umd/all.css +2 -2
  12. package/build/umd/all.js +1 -1
  13. package/build/umd/alphabox.js +1 -1
  14. package/build/umd/alphabox.js.map +1 -1
  15. package/build/umd/databox.js +1 -1
  16. package/build/umd/databox.js.map +1 -1
  17. package/build/umd/diagramme.js +1 -1
  18. package/build/umd/diagramme.js.map +1 -1
  19. package/build/umd/flowbox.js +1 -1
  20. package/build/umd/flowbox.js.map +1 -1
  21. package/build/umd/universe.js +1 -1
  22. package/build/umd/universe.js.map +1 -1
  23. package/package.json +107 -66
  24. package/src/components/AUAlertComponent.tsx +70 -70
  25. package/src/components/AUAutoSuggestComponent.js +158 -158
  26. package/src/components/AUButtonComponent.tsx +77 -0
  27. package/src/components/AUCalendarComponent.tsx +493 -493
  28. package/src/components/AUContentToggleComponent.tsx +33 -33
  29. package/src/components/AUDatepickerComponent.tsx +117 -117
  30. package/src/components/AUMobilePrefixComponent.tsx +15 -15
  31. package/src/components/AUModalComponent.tsx +80 -80
  32. package/src/components/AUReceiptComponent.tsx +33 -33
  33. package/src/components/AUSpinnerComponent.tsx +33 -91
  34. package/src/components/AUSubNavComponent.tsx +48 -48
  35. package/src/components/AUSubmitButtonContainerComponent.tsx +31 -31
  36. package/src/components/AUTabbedContentComponent.tsx +145 -145
  37. package/src/components/AUTableComponent.tsx +24 -24
  38. package/src/components/AUToastComponent.tsx +103 -103
  39. package/src/components/AUToolbarComponent.tsx +45 -45
  40. package/src/components/profile/AUProfileActions.js +128 -128
  41. package/src/components/profile/AUProfileAvatarComponent.js +83 -83
  42. package/src/components/profile/AUProfileAvatarV2Component.js +91 -91
  43. package/src/components/profile/AUProfileAvatarV3Component.tsx +42 -42
  44. package/src/components/profile/AUProfileContainerComponent.js +283 -283
  45. package/src/components/profile/AUProfileHooks.js +30 -30
  46. package/src/components/profile/AUProfileItemComponent.js +54 -54
  47. package/src/components/profile/AUProfileLanguageComponent.js +131 -131
  48. package/src/components/profile/AUProfileLoginComponent.tsx +26 -26
  49. package/src/components/profile/AUProfileMailComponent.js +307 -307
  50. package/src/components/profile/AUProfileMobileComponent.js +164 -164
  51. package/src/components/profile/AUProfileNameComponent.js +253 -253
  52. package/src/components/profile/AUProfileNextOfKinComponent.js +216 -216
  53. package/src/components/profile/AUProfileReducer.js +230 -230
  54. package/src/components/profile/AUProfileWidgetComponent.js +95 -95
  55. package/src/components/profile/AUProfileWidgetV2Component.js +116 -116
  56. package/src/components/profile/AUProfileWidgetV3Component.tsx +122 -122
  57. package/src/components/wrapping/AUEmbedComponent.js +47 -47
  58. package/src/layout-2016/components/alphabox/AlphaBoxComponent.js +143 -143
  59. package/src/layout-2016/components/alphabox/AlphaBoxContentComponent.js +136 -136
  60. package/src/layout-2016/components/common/AUCollapsibleComponent.js +152 -152
  61. package/src/layout-2016/components/common/AUSpinnerComponent.js +103 -103
  62. package/src/layout-2016/components/databox/DataBoxAlphabetComponent.js +144 -144
  63. package/src/layout-2016/components/databox/DataBoxAssociationComponent.js +122 -122
  64. package/src/layout-2016/components/databox/DataBoxButtonComponent.js +157 -157
  65. package/src/layout-2016/components/databox/DataBoxComponent.js +297 -297
  66. package/src/layout-2016/components/databox/DataBoxGroupingComponent.js +64 -64
  67. package/src/layout-2016/components/databox/DataBoxSearchResultComponent.js +36 -36
  68. package/src/layout-2016/components/databox/DataBoxStackedAssociationComponent.js +54 -54
  69. package/src/layout-2016/components/databox/DataBoxSuggestionComponent.js +39 -39
  70. package/src/layout-2016/components/diagramme/AUDiagrammeComponent.js +309 -309
  71. package/src/layout-2016/components/flowbox/FlowBoxComponent.js +126 -126
  72. package/src/layout-2016/components/flowbox/FlowBoxPhoneComponent.js +104 -104
  73. package/src/layout-2016/components/profile/AUProfileAvatar2016Component.js +103 -103
  74. package/src/layout-2016/components/universe/StaffTopComponent.js +363 -363
  75. package/src/layout-2016/components/universe/StudentTopComponent.js +137 -137
  76. package/src/layout-2016/components/universe/UniverseContainerComponent.js +65 -65
  77. package/src/layout-2016/lib/all.js +3 -3
  78. package/src/layout-2016/lib/au-alphabox.js +100 -100
  79. package/src/layout-2016/lib/au-databox.js +400 -400
  80. package/src/layout-2016/lib/au-diagramme.js +85 -85
  81. package/src/layout-2016/lib/au-flowbox.js +93 -93
  82. package/src/layout-2016/lib/universe.js +9 -9
  83. package/src/lib/helpers.ts +194 -194
  84. package/src/lib/hooks.ts +33 -33
  85. package/src/lib/i18n.ts +600 -600
  86. package/src/lib/tracking.ts +69 -69
  87. package/src/lib/wrapping.ts +21 -21
  88. package/src/styles/_settings.scss +10 -10
  89. package/src/styles/alphabox.scss +222 -222
  90. package/src/styles/app.scss +7 -7
  91. package/src/styles/autosuggest.scss +57 -57
  92. package/src/styles/databox.scss +563 -563
  93. package/src/styles/diagramme.scss +119 -119
  94. package/src/styles/flowbox.scss +72 -72
  95. package/src/styles/maps.scss +395 -395
  96. package/stories/AUButtonComponent.stories.tsx +86 -0
  97. package/stories/AUSpinnerComponent.stories.tsx +41 -0
  98. package/stories/assets/code-brackets.svg +1 -0
  99. package/stories/assets/colors.svg +1 -0
  100. package/stories/assets/comments.svg +1 -0
  101. package/stories/assets/direction.svg +1 -0
  102. package/stories/assets/flow.svg +1 -0
  103. package/stories/assets/plugin.svg +1 -0
  104. package/stories/assets/repo.svg +1 -0
  105. package/stories/assets/stackalt.svg +1 -0
  106. package/tsconfig.json +46 -46
  107. package/webpack.config.js +89 -89
  108. package/types/common/delphinus-duplicates.d.ts +0 -40
  109. package/types/common/interfaces/gui.d.ts +0 -52
  110. package/types/common/interfaces/model.d.ts +0 -29
  111. package/types/common/main.d.ts +0 -6
  112. package/types/common/package.json +0 -5
  113. package/types/common/props.d.ts +0 -166
@@ -1,194 +1,194 @@
1
- /* eslint-env browser */
2
- /* NO IMPORTS! */
3
-
4
- // eslint-disable-next-line no-control-regex
5
- const emailRegex = /(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/;
6
-
7
- const sortAlphaObj = (a, b) => {
8
- if (typeof a.name !== 'undefined' && typeof b.name !== 'undefined') {
9
- return a.name.toLowerCase().localeCompare(b.name.toLowerCase(), 'da', { ignorePunctuation: true });
10
- }
11
- return 0;
12
- };
13
-
14
- const isElementInViewport = (element: HTMLElement): boolean => {
15
- if (element === null) {
16
- return false;
17
- }
18
-
19
- const rect = element.getBoundingClientRect();
20
-
21
- return rect.bottom > 0
22
- && rect.right > 0
23
- && rect.left < (window.innerWidth || document.documentElement.clientWidth)
24
- && rect.top < (window.innerHeight || document.documentElement.clientHeight);
25
- };
26
-
27
- const isElementPartlyInViewport = (element: HTMLElement): boolean => {
28
- let top = element.offsetTop;
29
- let left = element.offsetLeft;
30
- const width = element.offsetWidth;
31
- const height = element.offsetHeight;
32
-
33
- let offsetElement = element;
34
- while (offsetElement.offsetParent) {
35
- offsetElement = element.offsetParent as HTMLElement;
36
- top += element.offsetTop;
37
- left += element.offsetLeft;
38
- }
39
-
40
- return (
41
- top < (window.pageYOffset + window.innerHeight)
42
- && left < (window.pageXOffset + window.innerWidth)
43
- && (top + height) > window.pageYOffset
44
- && (left + width) > window.pageXOffset
45
- );
46
- };
47
-
48
- const setCookie = (
49
- cookieName: string,
50
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
51
- value: any,
52
- maxAge: number | null = null,
53
- exdays: number | null = null,
54
- path = ';path=/;domain=au.dk',
55
- ): void => {
56
- let cookieValue = encodeURI(value);
57
- if (exdays != null) {
58
- const exdate = new Date();
59
- exdate.setDate(exdate.getDate() + exdays);
60
- cookieValue = `${cookieValue}; expires=${exdate.toUTCString()}`;
61
- } else if (maxAge != null) {
62
- cookieValue = `${cookieValue}; max-age=${maxAge}`;
63
- }
64
-
65
- document.cookie = `${cookieName}=${cookieValue}${path}`;
66
- };
67
-
68
- const getCookie = (cookieName: string): string | null | boolean => {
69
- let cookieValue: string | null | boolean = document.cookie;
70
- let cookieStart = cookieValue.indexOf(` ${cookieName}=`);
71
- if (cookieStart === -1) {
72
- cookieStart = cookieValue.indexOf(`${cookieName}=`);
73
- }
74
- if (cookieStart === -1) {
75
- cookieValue = null;
76
- } else {
77
- cookieStart = cookieValue.indexOf('=', cookieStart) + 1;
78
- let cookieEnd = cookieValue.indexOf(';', cookieStart);
79
- if (cookieEnd === -1) {
80
- cookieEnd = cookieValue.length;
81
- }
82
- cookieValue = decodeURI(cookieValue.substring(cookieStart, cookieEnd));
83
- }
84
- return cookieValue;
85
- };
86
-
87
- const addToSessionStorage = (key: string, data: unknown): unknown => {
88
- if (window.sessionStorage) {
89
- sessionStorage.setItem(key, JSON.stringify(data));
90
- }
91
-
92
- return data;
93
- };
94
-
95
- const getFromSessionStorage = (key: string): unknown | null => {
96
- if (window.sessionStorage) {
97
- const data = sessionStorage.getItem(key);
98
- if (data) {
99
- return JSON.parse(data);
100
- }
101
- }
102
-
103
- return null;
104
- };
105
-
106
- const addToLocalStorage = (key: string, data: unknown): unknown => {
107
- if (window.localStorage) {
108
- localStorage.setItem(key, JSON.stringify(data));
109
- }
110
-
111
- return data;
112
- };
113
-
114
- const getFromLocalStorage = (key: string): unknown | null => {
115
- if (window.localStorage) {
116
- const data = localStorage.getItem(key);
117
- if (data) {
118
- return JSON.parse(data);
119
- }
120
- }
121
-
122
- return null;
123
- };
124
-
125
- // Credits: http://blog.vishalon.net/index.php/javascript-getting-and-setting-caret-position-in-textarea/
126
- const setCaretPosition = (element: HTMLInputElement, pos: number): void => {
127
- // Modern browsers
128
- if (element && element.setSelectionRange) {
129
- element.focus();
130
- element.setSelectionRange(pos, pos);
131
- }
132
- };
133
-
134
- const splitPhoneNumber = (
135
- countryCodes: AU.ICountryCode[],
136
- phoneNumber: string,
137
- ): AU.IPhoneNumber => {
138
- const countryCodeFound = (code: string) => countryCodes.filter(
139
- (x) => x.code === parseInt(code, 10),
140
- ).length > 0;
141
-
142
- const findPrefix = (): string => {
143
- if (countryCodes.length > 0) {
144
- const skip = '';
145
- let count = 1;
146
- let prefix = `${countryCodes.find((x) => x.important)?.code}`;
147
- while (count < phoneNumber.length) {
148
- const split = phoneNumber.substring(skip.length, skip.length + count);
149
- if (countryCodeFound(split)) {
150
- prefix = split;
151
- }
152
- count += 1;
153
- }
154
- return skip + prefix;
155
- }
156
- return '';
157
- };
158
-
159
- const prefix = findPrefix();
160
- return {
161
- prefix,
162
- number: phoneNumber.replace(prefix, ''),
163
- };
164
- };
165
-
166
- const prettyPrintPhone = (countryCodes: AU.ICountryCode[], phone: string) => {
167
- if (phone) {
168
- const { prefix, number } = splitPhoneNumber(countryCodes, phone);
169
- if (prefix) {
170
- return `${prefix} ${number?.match(/\d{1,2}/g)?.join(' ')}`;
171
- }
172
- return number?.match(/\d{1,2}/g)?.join(' ');
173
- }
174
- return '';
175
- };
176
-
177
- const scrollTo = (x = 0, y = 0) => window.scrollTo(x, y);
178
-
179
- export {
180
- emailRegex,
181
- sortAlphaObj,
182
- isElementInViewport,
183
- isElementPartlyInViewport,
184
- setCookie,
185
- getCookie,
186
- addToLocalStorage,
187
- getFromLocalStorage,
188
- addToSessionStorage,
189
- getFromSessionStorage,
190
- setCaretPosition,
191
- splitPhoneNumber,
192
- prettyPrintPhone,
193
- scrollTo,
194
- };
1
+ /* eslint-env browser */
2
+ /* NO IMPORTS! */
3
+
4
+ // eslint-disable-next-line no-control-regex
5
+ const emailRegex = /(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/;
6
+
7
+ const sortAlphaObj = (a, b) => {
8
+ if (typeof a.name !== 'undefined' && typeof b.name !== 'undefined') {
9
+ return a.name.toLowerCase().localeCompare(b.name.toLowerCase(), 'da', { ignorePunctuation: true });
10
+ }
11
+ return 0;
12
+ };
13
+
14
+ const isElementInViewport = (element: HTMLElement): boolean => {
15
+ if (element === null) {
16
+ return false;
17
+ }
18
+
19
+ const rect = element.getBoundingClientRect();
20
+
21
+ return rect.bottom > 0
22
+ && rect.right > 0
23
+ && rect.left < (window.innerWidth || document.documentElement.clientWidth)
24
+ && rect.top < (window.innerHeight || document.documentElement.clientHeight);
25
+ };
26
+
27
+ const isElementPartlyInViewport = (element: HTMLElement): boolean => {
28
+ let top = element.offsetTop;
29
+ let left = element.offsetLeft;
30
+ const width = element.offsetWidth;
31
+ const height = element.offsetHeight;
32
+
33
+ let offsetElement = element;
34
+ while (offsetElement.offsetParent) {
35
+ offsetElement = element.offsetParent as HTMLElement;
36
+ top += element.offsetTop;
37
+ left += element.offsetLeft;
38
+ }
39
+
40
+ return (
41
+ top < (window.pageYOffset + window.innerHeight)
42
+ && left < (window.pageXOffset + window.innerWidth)
43
+ && (top + height) > window.pageYOffset
44
+ && (left + width) > window.pageXOffset
45
+ );
46
+ };
47
+
48
+ const setCookie = (
49
+ cookieName: string,
50
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
51
+ value: any,
52
+ maxAge: number | null = null,
53
+ exdays: number | null = null,
54
+ path = ';path=/;domain=au.dk',
55
+ ): void => {
56
+ let cookieValue = encodeURI(value);
57
+ if (exdays != null) {
58
+ const exdate = new Date();
59
+ exdate.setDate(exdate.getDate() + exdays);
60
+ cookieValue = `${cookieValue}; expires=${exdate.toUTCString()}`;
61
+ } else if (maxAge != null) {
62
+ cookieValue = `${cookieValue}; max-age=${maxAge}`;
63
+ }
64
+
65
+ document.cookie = `${cookieName}=${cookieValue}${path}`;
66
+ };
67
+
68
+ const getCookie = (cookieName: string): string | null | boolean => {
69
+ let cookieValue: string | null | boolean = document.cookie;
70
+ let cookieStart = cookieValue.indexOf(` ${cookieName}=`);
71
+ if (cookieStart === -1) {
72
+ cookieStart = cookieValue.indexOf(`${cookieName}=`);
73
+ }
74
+ if (cookieStart === -1) {
75
+ cookieValue = null;
76
+ } else {
77
+ cookieStart = cookieValue.indexOf('=', cookieStart) + 1;
78
+ let cookieEnd = cookieValue.indexOf(';', cookieStart);
79
+ if (cookieEnd === -1) {
80
+ cookieEnd = cookieValue.length;
81
+ }
82
+ cookieValue = decodeURI(cookieValue.substring(cookieStart, cookieEnd));
83
+ }
84
+ return cookieValue;
85
+ };
86
+
87
+ const addToSessionStorage = (key: string, data: unknown): unknown => {
88
+ if (window.sessionStorage) {
89
+ sessionStorage.setItem(key, JSON.stringify(data));
90
+ }
91
+
92
+ return data;
93
+ };
94
+
95
+ const getFromSessionStorage = (key: string): unknown | null => {
96
+ if (window.sessionStorage) {
97
+ const data = sessionStorage.getItem(key);
98
+ if (data) {
99
+ return JSON.parse(data);
100
+ }
101
+ }
102
+
103
+ return null;
104
+ };
105
+
106
+ const addToLocalStorage = (key: string, data: unknown): unknown => {
107
+ if (window.localStorage) {
108
+ localStorage.setItem(key, JSON.stringify(data));
109
+ }
110
+
111
+ return data;
112
+ };
113
+
114
+ const getFromLocalStorage = (key: string): unknown | null => {
115
+ if (window.localStorage) {
116
+ const data = localStorage.getItem(key);
117
+ if (data) {
118
+ return JSON.parse(data);
119
+ }
120
+ }
121
+
122
+ return null;
123
+ };
124
+
125
+ // Credits: http://blog.vishalon.net/index.php/javascript-getting-and-setting-caret-position-in-textarea/
126
+ const setCaretPosition = (element: HTMLInputElement, pos: number): void => {
127
+ // Modern browsers
128
+ if (element && element.setSelectionRange) {
129
+ element.focus();
130
+ element.setSelectionRange(pos, pos);
131
+ }
132
+ };
133
+
134
+ const splitPhoneNumber = (
135
+ countryCodes: AU.ICountryCode[],
136
+ phoneNumber: string,
137
+ ): AU.IPhoneNumber => {
138
+ const countryCodeFound = (code: string) => countryCodes.filter(
139
+ (x) => x.code === parseInt(code, 10),
140
+ ).length > 0;
141
+
142
+ const findPrefix = (): string => {
143
+ if (countryCodes.length > 0) {
144
+ const skip = '';
145
+ let count = 1;
146
+ let prefix = `${countryCodes.find((x) => x.important)?.code}`;
147
+ while (count < phoneNumber.length) {
148
+ const split = phoneNumber.substring(skip.length, skip.length + count);
149
+ if (countryCodeFound(split)) {
150
+ prefix = split;
151
+ }
152
+ count += 1;
153
+ }
154
+ return skip + prefix;
155
+ }
156
+ return '';
157
+ };
158
+
159
+ const prefix = findPrefix();
160
+ return {
161
+ prefix,
162
+ number: phoneNumber.replace(prefix, ''),
163
+ };
164
+ };
165
+
166
+ const prettyPrintPhone = (countryCodes: AU.ICountryCode[], phone: string) => {
167
+ if (phone) {
168
+ const { prefix, number } = splitPhoneNumber(countryCodes, phone);
169
+ if (prefix) {
170
+ return `${prefix} ${number?.match(/\d{1,2}/g)?.join(' ')}`;
171
+ }
172
+ return number?.match(/\d{1,2}/g)?.join(' ');
173
+ }
174
+ return '';
175
+ };
176
+
177
+ const scrollTo = (x = 0, y = 0) => window.scrollTo(x, y);
178
+
179
+ export {
180
+ emailRegex,
181
+ sortAlphaObj,
182
+ isElementInViewport,
183
+ isElementPartlyInViewport,
184
+ setCookie,
185
+ getCookie,
186
+ addToLocalStorage,
187
+ getFromLocalStorage,
188
+ addToSessionStorage,
189
+ getFromSessionStorage,
190
+ setCaretPosition,
191
+ splitPhoneNumber,
192
+ prettyPrintPhone,
193
+ scrollTo,
194
+ };
package/src/lib/hooks.ts CHANGED
@@ -1,33 +1,33 @@
1
- /* eslint-disable import/prefer-default-export */
2
- import { useState, useEffect } from 'react';
3
- import { showModal, hideModal } from '@aarhus-university/au-designsystem-delphinus/source/js/components/modal-view';
4
-
5
- const useModal = (
6
- domId: string,
7
- initialState: boolean,
8
- showCondition = true,
9
- hideCondition = false,
10
- closeable = true,
11
- ): [IModal, (modal: IModal) => void] => {
12
- const [modal, setModal] = useState<IModal>({ modal: initialState, sender: null });
13
-
14
- useEffect(() => {
15
- if (modal.modal && modal.sender && showCondition) {
16
- showModal(domId, modal.sender, () => {
17
- setModal({ modal: false, sender: null });
18
- }, closeable);
19
- }
20
-
21
- if (modal.modal && modal.sender && hideCondition) {
22
- hideModal(domId, modal.sender, () => {
23
- setModal({ modal: false, sender: null });
24
- });
25
- }
26
- });
27
-
28
- return [modal, setModal];
29
- };
30
-
31
- export {
32
- useModal,
33
- };
1
+ /* eslint-disable import/prefer-default-export */
2
+ import { useState, useEffect } from 'react';
3
+ import { showModal, hideModal } from '@aarhus-university/au-designsystem-delphinus/source/js/components/modal-view';
4
+
5
+ const useModal = (
6
+ domId: string,
7
+ initialState: boolean,
8
+ showCondition = true,
9
+ hideCondition = false,
10
+ closeable = true,
11
+ ): [IModal, (modal: IModal) => void] => {
12
+ const [modal, setModal] = useState<IModal>({ modal: initialState, sender: null });
13
+
14
+ useEffect(() => {
15
+ if (modal.modal && modal.sender && showCondition) {
16
+ showModal(domId, modal.sender, () => {
17
+ setModal({ modal: false, sender: null });
18
+ }, closeable);
19
+ }
20
+
21
+ if (modal.modal && modal.sender && hideCondition) {
22
+ hideModal(domId, modal.sender, () => {
23
+ setModal({ modal: false, sender: null });
24
+ });
25
+ }
26
+ });
27
+
28
+ return [modal, setModal];
29
+ };
30
+
31
+ export {
32
+ useModal,
33
+ };